/* CSS khusus inquiry-cart.blade.php (resources/views/livewire/guest-page). Dimuat di <head> lewat partials/page-css. */
:where(*) { font-family: var(--font-body); }

.ugs-container { max-width:1240px; margin:0 auto; padding:0 2rem; }

/* ── HERO ── */
.ugs-cart-hero {
    position:relative; background:var(--navy);
    padding:8rem 0 4rem; overflow:hidden;
}
/* Technical grid overlay */
.ugs-cart-hero-grid {
    position:absolute; inset:0; pointer-events:none;
    background-image:
        linear-gradient(rgba(var(--ugs-accent-deep-rgb),.05) 1px, transparent 1px),
        linear-gradient(90deg, rgba(var(--ugs-accent-deep-rgb),.05) 1px, transparent 1px);
    background-size:60px 60px;
}
/* Radial glow */
.ugs-cart-hero::after {
    content:''; position:absolute; inset:0; pointer-events:none;
    background:radial-gradient(ellipse at 10% 50%, rgba(var(--ugs-accent-deep-rgb),.18) 0%, transparent 55%);
}
.ugs-cart-hero-content { position:relative; z-index:2; }

.ugs-cart-eyebrow {
    display:block; font-size:.65rem; font-weight:700;
    text-transform:uppercase; letter-spacing:3.5px;
    color:var(--blue); margin-bottom:.75rem;
}
.ugs-cart-hero-title {
    font-family:var(--font-display);
    font-size:var(--ugs-fs-h1);
    font-weight:800; text-transform:uppercase;
    letter-spacing:-.5px; line-height:.95;
    color:#fff; margin-bottom:1.25rem;
}
.ugs-cart-hero-title em { font-style:normal; color:rgba(255,255,255,.55); }
.ugs-cart-hero-sub strong { color: rgba(255,255,255,.8); }
.ugs-cart-hero-sub {
    font-size:.95rem; font-weight:300;
    color:rgba(255,255,255,.55); max-width:500px; line-height:1.8; margin:0;
}

/* ── MAIN ── */
.ugs-cart-section { background:var(--surface); padding:3rem 0 5rem; }

/* Flash alert */
.ugs-alert-success {
    background: #d1fae5;
    border: 1px solid #6ee7b7;
    color: #065f46;
    border-radius: 8px;
    padding: 0.875rem 1.25rem;
    font-size: 0.88rem;
    font-weight: 500;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

/* ── CART CARD ── */
.ugs-cart-card {
    background:var(--ugs-card); border:1.5px solid var(--border);
    border-radius:16px; box-shadow:0 4px 24px rgba(11,24,40,.06);
    display:flex; flex-direction:column; overflow:hidden; height:100%;
}
.ugs-cart-card-header {
    display:flex; justify-content:space-between; align-items:center;
    padding:1.125rem 1.5rem;
    border-bottom:1.5px solid var(--border);
    background:var(--navy);
}
.ugs-cart-card-title {
    font-family:var(--font-display);
    font-size:.88rem; font-weight:700;
    text-transform:uppercase; letter-spacing:2px;
    color:#fff; margin:0;
    display:flex; align-items:center; gap:.5rem;
}
.ugs-cart-card-title i { color:var(--blue); }
.ugs-cart-card-body { padding:1.5rem; flex-grow:1; }

/* ── CART ITEMS ── */
.ugs-cart-items { display:flex; flex-direction:column; gap:0; }
.ugs-cart-item {
    display:flex; align-items:center; gap:1rem;
    padding:1rem 0; border-bottom:1px solid var(--border);
}
.ugs-cart-item:last-child { border-bottom:none; }
.ugs-cart-item-img {
    width:80px; height:80px; object-fit:contain;
    border-radius:10px; background:var(--surface);
    padding:.5rem; flex-shrink:0;
    border:1.5px solid var(--border);
    mix-blend-mode:multiply;
}
.ugs-cart-item-info { flex-grow:1; min-width:0; }
.ugs-cart-item-name {
    font-family:var(--font-display);
    font-size:.88rem; font-weight:700; text-transform:uppercase;
    letter-spacing:.3px; color:var(--text);
    margin-bottom:.4rem; line-height:1.3;
}
.ugs-cart-item-meta { display:flex; flex-wrap:wrap; gap:.3rem; }
.ugs-tag {
    font-size:.65rem; font-weight:600; color:var(--muted);
    background:var(--surface); border:1px solid var(--border);
    border-radius:4px; padding:.15rem .5rem;
}
.ugs-tag-muted { opacity:.65; }

.ugs-btn-remove {
    width:32px; height:32px; border-radius:50%;
    border:1.5px solid var(--border); background:transparent;
    color:var(--muted); display:flex; align-items:center;
    justify-content:center; font-size:.75rem;
    cursor:pointer; transition:all .2s; flex-shrink:0;
}
.ugs-btn-remove:hover { border-color:#c0392b; background:rgba(192,57,43,.06); color:#c0392b; }

/* DEV-15: isian jumlah per produk */
.ugs-cart-qty { display:flex; flex-direction:column; align-items:center; gap:.2rem; margin:0; flex-shrink:0; }
.ugs-cart-qty span { font-size:.65rem; font-weight:600; color:var(--muted); text-transform:uppercase; letter-spacing:.5px; }
.ugs-cart-qty input {
    width:64px; height:40px; text-align:center; font-size:.95rem; font-weight:600;
    color:var(--text); background:var(--surface); border:1.5px solid var(--border); border-radius:8px;
}
.ugs-cart-qty input:focus { outline:2px solid var(--ugs-accent, #ff6a13); outline-offset:1px; border-color:transparent; }

.ugs-btn-clear {
    display:inline-flex; align-items:center; gap:.35rem;
    padding:.35rem .875rem; border:1.5px solid rgba(255,255,255,.2);
    border-radius:100px; background:transparent;
    color:rgba(255,255,255,.5); font-size:.72rem; font-weight:600;
    cursor:pointer; transition:all .2s;
}
.ugs-btn-clear:hover { border-color:#c0392b; color:#ff6b6b; }

/* Total bar */
.ugs-cart-total {
    display:flex; justify-content:space-between; align-items:center;
    margin-top:1.25rem; padding:.875rem 1.1rem;
    background:var(--surface); border-radius:8px;
    border:1px solid var(--border);
}
.ugs-cart-total-label {
    font-family:var(--font-display);
    font-size:.7rem; font-weight:700; color:var(--muted);
    text-transform:uppercase; letter-spacing:2px;
}
.ugs-cart-total-badge {
    font-size:.78rem; font-weight:700; color:#fff;
    background:var(--blue); padding:.3rem .9rem; border-radius:100px;
}

/* Empty state */
.ugs-cart-empty {
    display:flex; flex-direction:column; align-items:center;
    text-align:center; padding:3rem 1rem;
}
.ugs-cart-empty-icon {
    width:72px; height:72px; border-radius:50%;
    background:var(--surface); border:1.5px solid var(--border);
    display:flex; align-items:center; justify-content:center;
    font-size:1.75rem; color:var(--muted); margin-bottom:1.25rem;
}
.ugs-cart-empty-title {
    font-family:var(--font-display);
    font-size:1.1rem; font-weight:700; text-transform:uppercase;
    color:var(--text); margin-bottom:.5rem;
}
.ugs-cart-empty-desc { font-size:.875rem; color:var(--muted); margin-bottom:1.5rem; max-width:280px; }
.ugs-btn-browse {
    display:inline-flex; align-items:center; gap:.4rem;
    padding:.7rem 1.75rem; background:var(--blue); color:#fff;
    border-radius:100px; font-size:.82rem; font-weight:600;
    text-transform:uppercase; letter-spacing:.3px;
    text-decoration:none; transition:all .2s;
}
.ugs-btn-browse:hover { background:var(--ugs-accent-dark); color:#fff; transform:translateY(-1px); }

/* Inquiry notice */
.ugs-inquiry-notice {
    background:#d1fae5; border:1px solid #6ee7b7;
    color:#065f46; border-radius:8px;
    padding:.75rem 1rem; font-size:.85rem; font-weight:500;
    display:flex; align-items:center;
}

/* What happens next */
.ugs-cart-next {
    margin-top:1.5rem; padding:1.25rem;
    background:var(--surface); border-radius:10px;
    border:1px solid var(--border);
}
.ugs-cart-next-title {
    font-family:var(--font-display);
    font-size:.72rem; font-weight:700;
    text-transform:uppercase; letter-spacing:2px;
    color:var(--muted); margin:0 0 1rem;
}
.ugs-cart-next-steps { display:flex; flex-direction:column; gap:.875rem; }
.ugs-cart-step {
    display:flex; align-items:flex-start; gap:.875rem;
}
.ugs-cart-step-num {
    width:24px; height:24px; border-radius:50%;
    background:var(--blue); color:#fff;
    font-size:.7rem; font-weight:700;
    display:flex; align-items:center; justify-content:center;
    flex-shrink:0; margin-top:.1rem;
}
.ugs-cart-step > div { display:flex; flex-direction:column; gap:.1rem; }
.ugs-cart-step strong { font-size:.82rem; font-weight:600; color:var(--text); }
.ugs-cart-step span   { font-size:.75rem; color:var(--muted); line-height:1.5; }

/* Trust signals */
.ugs-cart-trust {
    display:flex; flex-direction:column; gap:.625rem;
    margin-top:1.5rem; padding-top:1.25rem;
    border-top:1px solid var(--border);
}
.ugs-cart-trust-item {
    display:flex; align-items:center; gap:.625rem;
    font-size:.78rem; color:var(--muted);
}
.ugs-cart-trust-item i { color:var(--blue); font-size:.8rem; flex-shrink:0; }

/* How it works (empty state) */
.ugs-cart-how {
    margin-top:1.5rem; padding:1.25rem;
    background:var(--surface); border-radius:10px;
    border:1px solid var(--border);
}
.ugs-cart-how-title {
    font-family:var(--font-display);
    font-size:.72rem; font-weight:700;
    text-transform:uppercase; letter-spacing:2px;
    color:var(--muted); margin:0 0 1rem;
}
.ugs-cart-how-steps { display:flex; flex-direction:column; gap:.875rem; }
.ugs-cart-how-step {
    display:flex; align-items:flex-start; gap:.875rem;
}
.ugs-cart-how-num {
    width:24px; height:24px; border-radius:50%;
    background:var(--blue); color:#fff;
    font-size:.7rem; font-weight:700;
    display:flex; align-items:center; justify-content:center;
    flex-shrink:0; margin-top:.1rem;
}
.ugs-cart-how-step > div { display:flex; flex-direction:column; gap:.1rem; }
.ugs-cart-how-step strong { font-size:.82rem; font-weight:600; color:var(--text); }
.ugs-cart-how-step span   { font-size:.75rem; color:var(--muted); line-height:1.5; }
.ugs-cart-how-note {
    display:flex; align-items:flex-start; gap:.5rem;
    margin-top:1rem; padding-top:.875rem;
    border-top:1px solid var(--border);
    font-size:.75rem; color:var(--muted); line-height:1.6;
}
.ugs-cart-how-note i { color:var(--blue); font-size:.8rem; flex-shrink:0; margin-top:.15rem; }

/* Alert */
.ugs-alert-success {
    background:#d1fae5; border:1px solid #6ee7b7; color:#065f46;
    border-radius:8px; padding:.875rem 1.25rem;
    font-size:.88rem; font-weight:500;
    display:flex; align-items:center; justify-content:space-between;
    margin-bottom:1.5rem;
}

@media(max-width:768px){
    .ugs-cart-hero { padding:6rem 0 3rem; }
    .ugs-container { padding:0 1.25rem; }
    .ugs-cart-item-name { font-size:.82rem; }
}
@media(max-width:480px){
    .ugs-cart-card-body { padding:1rem; }
    .ugs-cart-card-header { padding:1rem; }
    .ugs-cart-item-img { width:60px; height:60px; }
}

/* ================================================
   TEMA TERANG + DARK MODE & HIERARKI TIPOGRAFI (sama dengan halaman lain)
   ================================================ */
.ugs-cart-page { background: var(--ugs-page); color: var(--ugs-fg); }
.ugs-cart-hero { background: var(--ugs-studio); padding: calc(var(--ugs-nav-h) + 3.5rem) 0 3rem; }
.ugs-cart-hero::after, .ugs-cart-hero-grid { display: none; }
.ugs-cart-eyebrow { font-family: var(--ugs-font-mono); font-size: .72rem; font-weight: 500; letter-spacing: .14em; color: var(--ugs-accent-text); }
.ugs-cart-hero-title { color: var(--ugs-fg); letter-spacing: .005em; line-height: .9; }
.ugs-cart-hero-title em { font-family: inherit; font-weight: 300; color: var(--ugs-fg-3); }
.ugs-cart-hero-sub { color: var(--ugs-fg-2); font-weight: 400; font-size: clamp(.95rem, 1.4vw, 1.05rem); max-width: 580px; }
.ugs-cart-hero-sub strong { color: var(--ugs-fg); }
.ugs-cart-section { background: var(--ugs-page); }
.ugs-cart-card { border: 1px solid var(--ugs-hairline); border-radius: 22px; box-shadow: none; }
.ugs-cart-card-header { background: var(--ugs-card); border-bottom: 1px solid var(--ugs-hairline); }
.ugs-cart-card-title { font-family: var(--ugs-font-body); font-size: 1.1rem; font-weight: 600; text-transform: none; letter-spacing: 0; color: var(--ugs-fg); }
.ugs-cart-card-title i { color: var(--ugs-accent); }
.ugs-btn-clear { border-color: var(--ugs-hairline-strong); color: var(--ugs-fg-2); font-weight: 500; font-size: .8rem; }
.ugs-btn-clear:hover { border-color: #c0392b; color: #c0392b; }
.ugs-cart-item-name { font-family: var(--ugs-font-body); font-size: .95rem; font-weight: 600; text-transform: none; letter-spacing: 0; color: var(--ugs-fg); }
.ugs-cart-item-img { background: #fff; }
.ugs-tag { font-size: .74rem; font-weight: 500; border-radius: 6px; color: var(--ugs-fg-2); }
.ugs-cart-total-label, .ugs-cart-next-title, .ugs-cart-how-title { font-family: var(--ugs-font-mono); font-size: .72rem; font-weight: 500; letter-spacing: .14em; color: var(--ugs-accent-text); }
.ugs-cart-total-badge { font-weight: 500; background: var(--ugs-accent); }
.ugs-cart-total, .ugs-cart-next, .ugs-cart-how { border-radius: 16px; }
.ugs-cart-empty-title { font-family: var(--ugs-font-body); font-size: 1.15rem; font-weight: 600; text-transform: none; color: var(--ugs-fg); }
.ugs-cart-empty-icon { background: var(--ugs-accent-tint); border: 0; color: var(--ugs-accent); border-radius: 20px; }
.ugs-btn-browse { text-transform: none; letter-spacing: 0; font-weight: 500; font-size: .92rem; background: var(--ugs-accent); }
.ugs-cart-step-num, .ugs-cart-how-num { background: var(--ugs-accent); }
.ugs-cart-trust-item i, .ugs-cart-how-note i { color: var(--ugs-accent); }
:root[data-ugs-theme="dark"] .ugs-inquiry-notice, :root[data-ugs-theme="dark"] .ugs-alert-success { background: rgba(34,197,94,.12); border-color: rgba(74,222,128,.3); color: #4ade80; }