/* ── Sayuri Orders Modal ── */
.sord-modal{position:fixed;inset:0;background:rgba(0,0,0,0.45);z-index:2147483647;display:none;}
.sord-modal.is-open{display:block;}
.sord-backdrop{position:absolute;inset:0;}
.sord-dialog{position:absolute;inset:0;background:#f9fafb;display:flex;flex-direction:column;}
.sord-header{height:46px;display:flex;align-items:center;padding:0 12px;background:#bbf7d0;color:#14532d;font-size:14px;font-weight:600;gap:8px;border-radius:0 0 18px 18px;box-shadow:0 2px 6px rgba(15,23,42,0.06);position:sticky;top:0;z-index:5;}
.sord-close-btn{background:transparent;border:0;font-size:20px;color:#14532d;cursor:pointer;line-height:1;padding:0 4px;margin-left:auto;}
.sord-title{flex:1;}
.sord-body{flex:1;overflow-y:auto;padding:16px;}
.sord-card{background:#fff;border:1px solid #e5e7eb;border-radius:16px;padding:14px;margin-bottom:12px;cursor:pointer;box-shadow:0 2px 6px rgba(15,23,42,0.04);-webkit-tap-highlight-color:transparent;outline:none;-webkit-user-select:none;user-select:none;}
.sord-card-top{display:flex;align-items:flex-start;justify-content:space-between;gap:8px;}
.sord-card-left{flex:1;}
.sord-card-num{font-weight:700;font-size:14px;color:#111827;}
.sord-card-date{font-size:12px;color:#6b7280;margin-top:2px;}
.sord-card-right{text-align:right;}
.sord-card-total{font-weight:700;font-size:14px;color:#111827;}
.sord-status{display:inline-block;padding:2px 10px;border-radius:999px;font-size:11px;font-weight:600;margin-top:4px;}
.sord-status-pending{background:#fef9c3;color:#854d0e;}
.sord-status-processing{background:#dbeafe;color:#1e40af;}
.sord-status-completed{background:#dcfce7;color:#166534;}
.sord-status-cancelled,.sord-status-failed{background:#fee2e2;color:#991b1b;}
.sord-status-default{background:#f3f4f6;color:#374151;}
.sord-items{margin-top:12px;border-top:1px solid #f3f4f6;padding-top:10px;display:none;}
.sord-card.is-open .sord-items{display:block;}
.sord-item{display:flex;justify-content:space-between;font-size:13px;color:#374151;padding:4px 0;gap:8px;}
.sord-item-name{flex:1;}
.sord-item-qty{color:#6b7280;white-space:nowrap;}
.sord-item-total{font-weight:600;white-space:nowrap;}
.sord-chevron{font-size:11px;color:#6b7280;margin-top:6px;display:block;}
.sord-loading{text-align:center;padding:48px 16px;color:#6b7280;font-size:14px;}
.sord-empty{text-align:center;padding:48px 16px;color:#6b7280;font-size:14px;}
.sord-error{text-align:center;padding:48px 16px;color:#991b1b;font-size:14px;}
/* Minimal Checkout Drawer v1 (P0) */
#sayuri-checkout-drawer-backdrop{position:fixed;inset:0;background:rgba(0,0,0,0.45);opacity:0;pointer-events:none;transition:opacity .22s ease;z-index:1100}
#sayuri-checkout-drawer-backdrop.is-open{opacity:1;pointer-events:auto}
#sayuri-checkout-drawer-panel{position:fixed;left:0;right:0;bottom:0;max-height:86vh;background:#fff;border-top-left-radius:12px;border-top-right-radius:12px;box-shadow:0 -12px 40px rgba(2,6,23,0.32);transform:translateY(100%);transition:transform .28s cubic-bezier(.2,.9,.2,1);z-index:1101;display:flex;flex-direction:column}
#sayuri-checkout-drawer-panel.is-open{transform:translateY(0)}
#sayuri-checkout-drawer-header{padding:14px 16px;border-bottom:1px solid #eee;display:flex;align-items:center;justify-content:space-between}
#sayuri-checkout-drawer-header .title{font-weight:700;font-size:16px}
#sayuri-checkout-drawer-header .subtitle{font-size:13px;color:#6b7280;margin-top:4px}
#sayuri-checkout-drawer-body{overflow:auto;padding:12px 16px 84px 16px}
.scd-section{background:#fff;border-radius:10px;padding:12px;margin-bottom:12px;border:1px solid #f1f5f9}
.scd-row{display:flex;align-items:center;justify-content:space-between}
.scd-row .label{font-weight:600}
.scd-row .muted{color:#6b7280;font-size:13px}
#sayuri-checkout-drawer-body .scd-section[data-scd-role]{cursor:pointer;position:relative}
#sayuri-checkout-drawer-body .scd-section[data-scd-role]:hover{background:#fbfaf9}
#sayuri-checkout-drawer-body .scd-section[data-scd-role]::after{content:'›';position:absolute;right:12px;top:50%;transform:translateY(-50%);color:#9ca3af;font-size:18px}
.scd-needs{background:#fff7f5;border-color:#fdecea}
.scd-needs .label{font-weight:800}
.scd-sum-wrap{display:flex;align-items:flex-start;gap:8px;flex:1;min-width:0}
.scd-sum-icon{font-size:14px;line-height:1;opacity:.9;flex-shrink:0;margin-top:1px}
.scd-sum-text{font-weight:700;font-size:13px;color:#111827}
.scd-sum-addr-row{display:flex;align-items:center;gap:4px;flex-wrap:wrap;min-width:0}
.scd-section .sdsw-address-item-label-bubble{background:#d1fae5;color:#047857;font-size:11px;height:20px;padding:0 8px;border-radius:999px;display:inline-flex;align-items:center;font-weight:600;line-height:1}
.scd-section .sdsw-address-item-default-bubble{background:#d1fae5;color:#047857;font-size:11px;height:20px;padding:0 8px;border-radius:999px;display:inline-flex;align-items:center;gap:4px;font-weight:600;line-height:1}
.scd-section .sdsw-address-item-default-bubble::before{content:"★";font-size:11px;line-height:1}
#sayuri-checkout-drawer-bottom{position:fixed;left:0;right:0;bottom:0;padding:12px 16px;background:linear-gradient(180deg, rgba(255,255,255,0), #fff 10%);z-index:1102;display:none}
.scd-bottom-inner{max-width:900px;margin:0 auto;display:flex;gap:12px;align-items:center}
.scd-total{flex:1;font-weight:700}
.scd-cta{width:100%;padding:11px 16px;border-radius:999px;border:none;background:#166534;color:#fff;font-weight:600;font-size:13px;cursor:pointer;transition:transform 0.08s ease-out,box-shadow 0.12s ease-out,background-color 0.12s ease-out;}
.scd-cta:hover{box-shadow:0 6px 16px rgba(15,23,42,0.15);}
.scd-cta:active{transform:scale(0.97);box-shadow:0 2px 6px rgba(15,23,42,0.12);}
.scd-cta.is-loading{background:#9ca3af !important;color:#f9fafb !important;cursor:default !important;box-shadow:none !important;}
.scd-success{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px 24px;text-align:center;gap:12px;}
.scd-success-icon{font-size:48px;line-height:1;}
.scd-success-title{font-size:17px;font-weight:700;color:#111827;}
.scd-success-sub{font-size:13px;color:#6b7280;}
.scd-success-order{font-size:13px;font-weight:600;color:#166534;}
.scd-success-link{display:inline-block;margin-top:8px;padding:10px 24px;border-radius:999px;background:#166534;color:#fff;font-weight:600;font-size:13px;text-decoration:none;}
.scd-close{background:transparent;border:0;font-size:20px}
.scd-small-btn{background:#f3f4f6;border:1px solid #e5e7eb;padding:6px 8px;border-radius:8px;font-weight:700}
@media(min-width:720px){#sayuri-checkout-drawer-panel{left:50%;right:auto;transform:translateX(-50%) translateY(100%);width:720px;border-radius:12px 12px 10px 10px}#sayuri-checkout-drawer-panel.is-open{transform:translateX(-50%) translateY(0)}}

#sayuri-checkout-drawer-bottom.is-open{display:block}

.scd-cat{margin-bottom:12px}
.scd-cat-header{display:flex;justify-content:space-between;align-items:center;font-weight:800;padding:10px;border:1px solid #166534;border-radius:10px;cursor:pointer;background:#166534;color:#fff}
.scd-card{display:flex;align-items:flex-start;gap:8px;padding:8px;border-bottom:1px solid #f1f5f9}
.scd-card--inactive{opacity:0.55}
.scd-card--inactive .scd-card-unit-price,.scd-card--inactive .scd-card-subtotal{text-decoration:line-through;color:#9ca3af}
/* ── Media: fixed 60px, overlays inside ── */
.scd-card-media{position:relative;flex:0 0 60px;width:60px;overflow:visible}
.scd-card-thumb{display:block;width:60px;height:60px;object-fit:cover;border-radius:8px}
.scd-card-thumb--placeholder{display:block;width:60px;height:60px;border-radius:8px;background:#f1f5f9}
.scd-tick{position:absolute;top:3px;left:3px;background:#fff;border:none;border-radius:50%;padding:0;cursor:pointer;line-height:0;box-shadow:0 1px 3px rgba(0,0,0,.18);z-index:10}
.scd-delete-btn{position:absolute;bottom:3px;left:3px;background:#ef4444;border:none;padding:3px;cursor:pointer;color:#fff;line-height:0;border-radius:50%;box-shadow:0 1px 3px rgba(0,0,0,.18);z-index:10}
.scd-delete-btn:hover{background:#dc2626}
/* ── Body: 3 stacked rows ── */
.scd-card-body{flex:1;min-width:0;display:flex;flex-direction:column;gap:5px}
/* ── R1: name (truncate) | price column (fixed) ── */
.scd-card-r1{display:flex;align-items:flex-start;gap:6px}
.scd-card-name{flex:1;min-width:0;font-weight:700;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.scd-card-pack-inline{font-weight:400;font-size:12px;color:#6b7280}
.scd-card-r1-right{flex:0 0 72px;width:72px;display:flex;flex-direction:column;align-items:flex-end;gap:1px}
.scd-card-unit-price{font-size:13px;color:#6b7280;white-space:nowrap}
/* ── R2: prep label + fixed dropdown + fee ── */
.scd-card-r2{display:flex;align-items:center;gap:5px;font-size:12px}
.scd-prep-label{flex-shrink:0;color:#6b7280;white-space:nowrap;font-size:12px;max-width:64px;overflow:hidden;text-overflow:ellipsis}
.scd-prep-select{flex:0 0 105px;width:105px;padding:4px 5px;border:1px solid #e5e7eb;border-radius:8px;font-size:12px;background:#fff}
.scd-prep-fee{font-size:12px;color:#059669;font-weight:700;white-space:nowrap;margin-left:auto}
/* ── R3: stepper · badges · subtotal ── */
.scd-card-r3{display:flex;align-items:center;gap:5px}
.scd-stepper{display:inline-flex;align-items:center;gap:3px;border:1px solid #e5e7eb;border-radius:10px;padding:2px 5px;background:#f9fafb;flex-shrink:0}
.scd-stepper--disabled{opacity:0.4;pointer-events:none}
.scd-stepper button{background:#fff;border:1px solid #e5e7eb;border-radius:6px;width:24px;height:24px;font-weight:800;line-height:1;cursor:pointer;font-size:14px}
.scd-stepper-qty{min-width:16px;text-align:center;font-weight:700;font-size:13px}
.scd-card-badges{display:flex;gap:3px;align-items:center;flex-shrink:0}
.scd-badge{display:inline-flex;align-items:center;font-weight:700;font-size:10px;padding:2px 5px;border-radius:6px}
.scd-badge--grosir{background:#eef2ff;color:#4338ca}
.scd-badge--hh{background:#fef3c7;color:#d97706}
.scd-badge--vaedp{background:#dcfce7;color:#166534;}
.scd-vaedp-price{display:inline-block;font-weight:600;color:#16a34a;}
.scd-vaedp-original{display:inline-block;font-size:0.78em;color:#94a3b8;text-decoration:line-through;margin-left:4px;}
/* t5_4: smooth price transition on VAEDP re-render */
.scd-vaedp-price { transition: color 0.3s ease; }
/* My Vouchers panel */
.scd-my-vouchers-trigger { display: block; width: 100%; margin-top: 10px; padding: 8px; background: transparent; border: 1px dashed #bbf7d0; border-radius: 8px; color: #16a34a; font-size: 12px; cursor: pointer; text-align: center; }
.scd-my-vouchers-trigger:hover { background: #f0fdf4; }
.scd-mv-tabs { display: flex; gap: 4px; margin-bottom: 10px; }
.scd-mv-tab { flex: 1; padding: 5px; border: 1px solid #e5e7eb; border-radius: 6px; background: #fff; font-size: 11px; cursor: pointer; color: #6b7280; }
.scd-mv-tab--active { background: #f0fdf4; border-color: #16a34a; color: #166534; font-weight: 700; }
.scd-vaedp-tag{display:inline-block;font-size:10px;color:#16a34a;background:#f0fdf4;border:1px solid #bbf7d0;border-radius:4px;padding:1px 5px;margin-top:3px;line-height:1.4;}
.scd-mv-card--locked{opacity:.7;}
.scd-mv-card-lock{font-size:11px;color:#ef4444;margin-top:4px;}
.scd-mv-card { padding: 10px 12px; border: 1px solid #e5e7eb; border-radius: 8px; margin-bottom: 6px; }
.scd-mv-card-name { font-weight: 700; font-size: 13px; color: #111827; margin-bottom: 2px; }
.scd-mv-card-benefit { font-size: 12px; color: #16a34a; font-weight: 600; }
.scd-mv-card-scope { font-size: 11px; color: #6b7280; margin-top: 2px; }
.scd-mv-card-cond { font-size: 11px; color: #6b7280; margin-top: 2px; }
.scd-mv-loading, .scd-mv-empty { padding: 16px; text-align: center; color: #6b7280; font-size: 12px; }
.scd-card-subtotal{font-weight:800;font-size:13px;white-space:nowrap;margin-left:auto}
/* ── Left drawer nav ───────────────────────────────────────────────── */
.shd-nav { display:flex; flex-direction:column; gap:4px; padding:8px 0; }
.shd-nav-item { display:flex; align-items:center; gap:10px; width:100%; padding:12px 16px; background:transparent; border:none; border-radius:8px; font-size:14px; color:#111827; cursor:pointer; text-align:left; transition:background .15s; }
.shd-nav-item:hover { background:#f0fdf4; color:#16a34a; }
.shd-nav-item--active { background:#dcfce7; color:#166534; font-weight:600; }
.shd-nav-icon { font-size:18px; flex-shrink:0; }
.shd-nav-label { font-size:14px; }

/* ── VAEDP Browse Card Price ── */
.scd-vaedp-price {
	display: inline-block !important;
	font-size: 14px !important;
	font-weight: 700 !important;
	color: #16a34a !important;
	line-height: 1.3;
}
.scd-vaedp-original {
	display: inline-block !important;
	font-size: 12px !important;
	font-weight: 400 !important;
	color: #9ca3af !important;
	text-decoration: line-through !important;
	margin-left: 4px;
	line-height: 1.3;
}
.sayuri-card-price-text {
	font-size: 14px !important;
}

/* ── Voucher Modal countdown ── */
.scd-mv-card-countdown { font-size:12px; color:#b45309; background:#fef9c3; border-radius:12px; padding:2px 8px; display:inline-block; margin-top:4px; }
.scd-mv-card-countdown--expired { color:#9ca3af; background:#f3f4f6; }

/* ── Voucher Modal ─────────────────────────────────────────────────── */
.svm-overlay { position:fixed; inset:0; background:rgba(0,0,0,.45); z-index:10000; }
body.svm-open { overflow:hidden; }
body.svm-open #sayuri_bottom_dock { transform:translateY(110%); opacity:0; pointer-events:none; }
.svm-modal { position:fixed; bottom:0; left:0; right:0; height:85vh; background:#fff; border-radius:16px 16px 0 0; z-index:10001; display:flex; flex-direction:column; overflow:hidden; transform:translateY(100%); transition:transform .3s ease; }
.svm-modal--open { transform:translateY(0); }
.svm-head { display:flex; align-items:center; justify-content:space-between; padding:16px 20px 12px; border-bottom:1px solid #e5e7eb; flex-shrink:0; }
.svm-title { font-size:16px; font-weight:700; color:#111827; }
.svm-close { background:none; border:none; font-size:20px; color:#6b7280; cursor:pointer; padding:4px 8px; border-radius:6px; line-height:1; }
.svm-close:hover { background:#f3f4f6; color:#111827; }
.svm-body { overflow-y:auto; padding:16px 20px 32px; flex:1; }
.svm-section-title { font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.06em; color:#6b7280; margin:16px 0 8px; }
.svm-section-title:first-child { margin-top:0; }
.svm-card { display:flex; justify-content:space-between; align-items:flex-start; padding:12px 14px; border:1px solid #e5e7eb; border-radius:10px; margin-bottom:8px; cursor:pointer; transition:border-color .15s, background .15s; }
.svm-card:hover { border-color:#16a34a; background:#f9fffe; }
.svm-card--applied { opacity:.5; background:#f9fafb; }
.svm-card--locked { opacity:.45; background:#f9fafb; cursor:pointer; }
.svm-card-left { flex:1; }
.svm-card-name { font-size:14px; font-weight:700; color:#111827; margin-bottom:3px; }
.svm-card-benefit { font-size:12px; color:#16a34a; font-weight:600; }
.svm-card-scope { font-size:11px; color:#6b7280; margin-top:2px; }
.svm-card-cond { font-size:11px; color:#6b7280; margin-top:3px; }
.svm-card-badge { font-size:10px; font-weight:700; padding:3px 10px; border-radius:999px; flex-shrink:0; margin-left:10px; align-self:flex-start; letter-spacing:.02em; }
.svm-badge--active  { background:#dcfce7; color:#166534; }
.svm-badge--applied { background:#dcfce7; color:#166534; }
.svm-badge--locked  { background:#f3f4f6; color:#6b7280; }
.svm-card--applied  { background:#f0fdf4; border-color:#bbf7d0; }
.svm-card-scope, .scd-mv-card-scope { font-size:11px; font-weight:600; color:#374151; background:#f3f4f6; border-radius:4px; padding:2px 6px; display:inline-block; margin-top:4px; }
.svm-card-countdown { display:inline-flex; align-items:center; gap:4px; font-size:11px; font-weight:600; color:#92400e; background:#fef3c7; border:1px solid #fde68a; border-radius:999px; padding:3px 9px; margin-top:6px; }
.scd-mv-card-countdown { display:inline-flex; align-items:center; gap:4px; font-size:11px; font-weight:600; color:#92400e; background:#fef3c7; border:1px solid #fde68a; border-radius:999px; padding:3px 9px; margin-top:4px; }
.scd-mv-card-countdown--expired, .svm-card-countdown--expired { color:#9ca3af; background:#f3f4f6; border-color:#e5e7eb; }
.svm-countdown-icon { display:inline-block; vertical-align:middle; flex-shrink:0; }
.svm-empty { text-align:center; color:#9ca3af; font-size:13px; padding:20px 0; }

/* ── Detail Popover ────────────────────────────────────────────────── */
.svm-popover { position:fixed; bottom:0; left:0; right:0; background:#fff; border-radius:14px 14px 0 0; z-index:10002; padding:20px; box-shadow:0 -4px 24px rgba(0,0,0,.12); transform:translateY(100%); transition:transform .25s ease; max-height:60vh; overflow-y:auto; }
.svm-popover--open { transform:translateY(0); }
.svm-pop-head { display:flex; align-items:center; justify-content:space-between; margin-bottom:14px; }
.svm-pop-name { font-size:16px; font-weight:700; color:#111827; }
.svm-pop-close { background:none; border:none; font-size:18px; color:#6b7280; cursor:pointer; padding:2px 6px; border-radius:6px; }
.svm-pop-body { display:flex; flex-direction:column; gap:10px; }
.svm-pop-row { display:flex; justify-content:space-between; align-items:center; font-size:13px; padding:8px 0; border-bottom:1px solid #f3f4f6; }
.svm-pop-row:last-child { border-bottom:none; }
.svm-pop-key { color:#6b7280; }
.svm-pop-val { font-weight:600; color:#111827; }
.svm-pop-status { font-size:11px; font-weight:700; padding:3px 10px; border-radius:999px; }
.svm-pop-status--active { background:#dcfce7; color:#166534; }
.svm-pop-status--applied { background:#ede9fe; color:#6d28d9; }
.svm-pop-status--locked { background:#f3f4f6; color:#6b7280; }


.scd-fee-line{display:flex;justify-content:space-between;font-size:13px;padding:4px 0;color:#111827}
.scd-fee-total{font-weight:800;border-top:1px solid #e5e7eb;margin-top:6px;padding-top:8px}
#scd-voucher-chips{padding:4px 16px 2px;flex-basis:100%;order:1}
.scd-savings-chip{display:inline-flex;align-items:center;gap:4px;background:#dcfce7;color:#166534;font-weight:700;font-size:11px;padding:3px 10px;border-radius:999px}
.scd-voucher-lanes{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:6px}
.scd-voucher-chip{display:inline-flex;align-items:center;gap:5px;background:#f0fdf4;border:1px solid #bbf7d0;border-radius:8px;padding:4px 10px;font-size:12px;color:#166534;font-weight:600}
.scd-voucher-header { display:flex; align-items:center; justify-content:space-between; margin-bottom:6px; }
.scd-voucher-header .label { margin-bottom:0; }
.scd-voucher-see-all { background:none; border:none; font-size:11px; font-weight:600; color:#16a34a; cursor:pointer; padding:0; }
.scd-voucher-see-all:hover { text-decoration:underline; }
.scd-voucher-chip__icon{font-size:13px}
.scd-voucher-chip__name{line-height:1.2}
.scd-voucher-total{font-size:12px;color:#374151;margin-top:4px}
.scd-voucher-ineligible{margin-top:6px}
.scd-voucher-ineligible__row{font-size:11px;color:#b45309;padding:2px 0}

/* While checkout drawer is open we must prevent the dock from intercepting taps. */
body.sayuri-checkout-open #sayuri_bottom_dock{ display:none !important; }
/* Diagnostic: if other bottom-sticky UI intercepts taps, add its selector here after inspecting in DevTools. */

/* Make preview view-only: disable interactive steppers/remove/selectors inside preview area */
#scd-cart-preview .sayuri-cart-stepper,
#scd-cart-preview .sayuri-cart-prep-select,
#scd-cart-preview .sayuri-cart-remove{ pointer-events:none !important; opacity:0.7 !important; }

/* Hide bottom nav while checkout drawer is open */
body.sayuri-checkout-open .sayuri-app-bottom-nav{display:none !important;}