:root {
  color-scheme: light;
  --accent: #2563eb;
  --accent-rgb: 37, 99, 235;
  --accent-strong: #1d4ed8;
  --accent-soft: #eff6ff;
  --bg: #f4f7fb;
  --surface: #ffffff;
  --surface-2: #f8fafc;
  --surface-3: #eef2f7;
  --text: #0f172a;
  --text-soft: #334155;
  --muted: #64748b;
  --border: #e2e8f0;
  --success: #059669;
  --success-soft: #ecfdf5;
  --warning: #d97706;
  --warning-soft: #fffbeb;
  --danger: #dc2626;
  --danger-soft: #fef2f2;
  --info: #0284c7;
  --shadow-sm: 0 1px 2px rgba(15, 23, 42, .04);
  --shadow: 0 12px 34px rgba(15, 23, 42, .08);
  --radius-sm: 10px;
  --radius: 16px;
  --radius-lg: 24px;
  --sidebar-width: 248px;
  --topbar-height: 72px;
  --font: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

html[data-theme="dark"] {
  color-scheme: dark;
  --bg: #0b1118;
  --surface: #111923;
  --surface-2: #151f2b;
  --surface-3: #1b2734;
  --text: #f8fafc;
  --text-soft: #cbd5e1;
  --muted: #94a3b8;
  --border: #263442;
  --accent-soft: rgba(var(--accent-rgb), .13);
  --success-soft: rgba(5, 150, 105, .13);
  --warning-soft: rgba(217, 119, 6, .13);
  --danger-soft: rgba(220, 38, 38, .13);
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, .2);
  --shadow: 0 18px 42px rgba(0, 0, 0, .28);
}

html[data-accent="blue"] {
  --accent: #2563eb; --accent-rgb: 37, 99, 235; --accent-strong: #1d4ed8; --accent-soft: #eff6ff;
}
html[data-accent="emerald"] {
  --accent: #059669; --accent-rgb: 5, 150, 105; --accent-strong: #047857; --accent-soft: #ecfdf5;
}
html[data-accent="purple"] {
  --accent: #7c3aed; --accent-rgb: 124, 58, 237; --accent-strong: #6d28d9; --accent-soft: #f5f3ff;
}
html[data-accent="orange"] {
  --accent: #ea580c; --accent-rgb: 234, 88, 12; --accent-strong: #c2410c; --accent-soft: #fff7ed;
}
html[data-theme="dark"][data-accent] { --accent-soft: rgba(var(--accent-rgb), .14); }

* { box-sizing: border-box; }
html { min-height: 100%; background: var(--bg); }
body {
  margin: 0;
  min-height: 100vh;
  background: var(--bg);
  color: var(--text);
  font-family: var(--font);
  font-size: 14px;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}
button, input, select, textarea { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
a { color: inherit; text-decoration: none; }
img, svg { display: block; max-width: 100%; }
.hidden { display: none !important; }
.text-muted { color: var(--muted); }
.text-success { color: var(--success); }
.text-danger { color: var(--danger); }
.fw-700 { font-weight: 700; }
.small { font-size: 12px; }
.nowrap { white-space: nowrap; }

.icon {
  width: 20px; height: 20px; display: inline-flex; align-items: center; justify-content: center;
  flex: 0 0 auto;
}
.icon svg { width: 100%; height: 100%; stroke: currentColor; fill: none; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }

.btn {
  border: 1px solid transparent;
  border-radius: 11px;
  min-height: 40px;
  padding: 9px 14px;
  display: inline-flex;
  gap: 8px;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  background: var(--surface);
  color: var(--text);
  font-weight: 650;
  transition: .18s ease;
}
.btn:hover { transform: translateY(-1px); }
.btn:active { transform: translateY(0); }
.btn-primary { background: var(--accent); color: white; box-shadow: 0 8px 18px rgba(var(--accent-rgb), .2); }
.btn-primary:hover { background: var(--accent-strong); }
.btn-secondary { border-color: var(--border); background: var(--surface); }
.btn-ghost { background: transparent; color: var(--muted); }
.btn-danger-soft { background: var(--danger-soft); color: var(--danger); }
.btn-block { width: 100%; }
.btn-lg { min-height: 48px; padding-inline: 18px; font-size: 15px; }

.input, .select {
  width: 100%;
  min-height: 42px;
  border: 1px solid var(--border);
  border-radius: 11px;
  background: var(--surface);
  color: var(--text);
  padding: 9px 12px;
  outline: none;
  transition: border-color .18s, box-shadow .18s;
}
.input:focus, .select:focus { border-color: var(--accent); box-shadow: 0 0 0 3px rgba(var(--accent-rgb), .12); }
.input::placeholder { color: var(--muted); }
.form-group { display: grid; gap: 7px; }
.form-label { font-size: 12px; font-weight: 700; color: var(--text-soft); }
.input-wrap { position: relative; }
.input-wrap .icon { position: absolute; left: 12px; top: 50%; transform: translateY(-50%); color: var(--muted); width: 18px; height: 18px; }
.input-wrap .input { padding-left: 40px; }

.flash {
  padding: 12px 14px;
  border-radius: 12px;
  border: 1px solid var(--border);
  margin-bottom: 16px;
}
.flash-error { background: var(--danger-soft); color: var(--danger); border-color: rgba(220,38,38,.25); }
.flash-success { background: var(--success-soft); color: var(--success); border-color: rgba(5,150,105,.25); }

.login-page {
  min-height: 100vh;
  padding: 28px;
  display: grid;
  place-items: center;
  background:
    radial-gradient(circle at 15% 15%, rgba(var(--accent-rgb), .14), transparent 35%),
    radial-gradient(circle at 85% 75%, rgba(5, 150, 105, .10), transparent 35%),
    var(--bg);
}
.login-shell {
  width: min(1080px, 100%);
  display: grid;
  grid-template-columns: 1.05fr .85fr;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 28px;
  overflow: hidden;
  box-shadow: var(--shadow);
}
.login-hero {
  min-height: 650px;
  padding: 52px;
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  background:
    linear-gradient(150deg, rgba(var(--accent-rgb), .98), rgba(var(--accent-rgb), .76)),
    var(--accent);
  color: white;
}
.login-hero::after {
  content:""; position:absolute; width:280px; height:280px; border-radius:50%; right:-90px; bottom:-90px;
  border: 52px solid rgba(255,255,255,.08);
}
.brand { display:flex; align-items:center; gap:12px; font-weight:800; letter-spacing:-.02em; }
.brand-mark {
  width: 42px; height: 42px; border-radius: 13px; display:grid; place-items:center;
  background: var(--accent); color:white; box-shadow: 0 8px 22px rgba(var(--accent-rgb), .28);
}
.login-hero .brand-mark { background: rgba(255,255,255,.18); box-shadow:none; backdrop-filter: blur(8px); }
.brand-mark svg { width:25px; height:25px; }
.brand-copy small { display:block; font-size:11px; font-weight:600; opacity:.7; letter-spacing:0; }
.hero-title { font-size: clamp(34px, 5vw, 56px); line-height: 1.05; letter-spacing: -.045em; margin: 0 0 18px; max-width: 570px; }
.hero-copy { font-size: 16px; line-height: 1.7; opacity: .86; max-width: 530px; }
.hero-badges { display:flex; flex-wrap:wrap; gap:10px; margin-top:30px; }
.hero-badge { padding:9px 12px; border-radius:999px; background:rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.16); font-weight:650; font-size:12px; }
.login-panel { padding: 52px 46px; display:flex; flex-direction:column; justify-content:center; }
.login-panel h1 { margin:0; font-size:28px; letter-spacing:-.03em; }
.login-panel > p { margin:8px 0 28px; color:var(--muted); }
.login-form { display:grid; gap:16px; }
.demo-accounts { margin-top:24px; padding:14px; border:1px dashed var(--border); border-radius:14px; background:var(--surface-2); }
.demo-account { display:flex; justify-content:space-between; gap:12px; padding:7px 0; font-size:12px; }
.demo-account + .demo-account { border-top:1px solid var(--border); }

.app-shell { min-height:100vh; display:grid; grid-template-columns: var(--sidebar-width) 1fr; }
.sidebar {
  position:fixed; inset:0 auto 0 0; width:var(--sidebar-width); z-index:30;
  background:var(--surface); border-right:1px solid var(--border);
  display:flex; flex-direction:column; padding:18px 14px;
  transition: transform .2s ease;
}
.sidebar .brand { padding:3px 8px 18px; }
.sidebar-nav { display:grid; gap:4px; overflow:auto; padding-right:2px; }
.nav-label { padding:16px 12px 7px; color:var(--muted); font-size:10px; font-weight:800; text-transform:uppercase; letter-spacing:.1em; }
.nav-link {
  min-height:42px; padding:10px 12px; border-radius:11px; display:flex; gap:11px; align-items:center;
  color:var(--text-soft); font-weight:620; transition:.16s;
}
.nav-link:hover { background:var(--surface-2); color:var(--text); }
.nav-link.active { background:var(--accent); color:#fff; box-shadow:0 8px 18px rgba(var(--accent-rgb),.2); }
.nav-link .badge-count { margin-left:auto; min-width:21px; height:21px; display:grid; place-items:center; border-radius:999px; font-size:10px; background:var(--warning-soft); color:var(--warning); }
.nav-link.active .badge-count { background:rgba(255,255,255,.18); color:white; }
.sidebar-bottom { margin-top:auto; padding-top:14px; }
.tenant-chip { padding:12px; border:1px solid var(--border); border-radius:13px; background:var(--surface-2); display:flex; gap:10px; align-items:center; }
.tenant-avatar { width:34px; height:34px; border-radius:10px; display:grid; place-items:center; background:var(--accent-soft); color:var(--accent); font-weight:800; }
.tenant-meta { min-width:0; }
.tenant-meta strong, .tenant-meta span { display:block; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }
.tenant-meta strong { font-size:12px; }
.tenant-meta span { font-size:10px; color:var(--muted); margin-top:2px; }

.main { grid-column:2; min-width:0; }
.topbar {
  height:var(--topbar-height); position:sticky; top:0; z-index:20; padding:0 28px;
  display:flex; align-items:center; gap:16px; border-bottom:1px solid var(--border);
  background:color-mix(in srgb, var(--surface) 91%, transparent);
  backdrop-filter: blur(16px);
}
.menu-toggle { display:none; }
.global-search { width:min(440px, 38vw); }
.topbar-spacer { flex:1; }
.topbar-actions { display:flex; gap:8px; align-items:center; }
.icon-btn {
  width:40px; height:40px; border-radius:11px; border:1px solid var(--border); background:var(--surface);
  color:var(--muted); display:grid; place-items:center; cursor:pointer; position:relative;
}
.icon-btn:hover { color:var(--accent); border-color:rgba(var(--accent-rgb),.35); }
.icon-btn .dot { position:absolute; width:8px; height:8px; right:7px; top:7px; background:var(--danger); border:2px solid var(--surface); border-radius:50%; }
.user-menu { display:flex; align-items:center; gap:10px; padding-left:8px; }
.user-avatar { width:38px; height:38px; border-radius:12px; display:grid; place-items:center; background:var(--accent-soft); color:var(--accent); font-weight:800; }
.user-copy strong, .user-copy span { display:block; }
.user-copy strong { font-size:12px; }
.user-copy span { color:var(--muted); font-size:10px; margin-top:1px; }

.page { padding:28px; max-width:1600px; margin:0 auto; }
.page-header { display:flex; gap:18px; align-items:flex-start; justify-content:space-between; margin-bottom:22px; }
.page-title h1 { margin:0; font-size:26px; letter-spacing:-.035em; }
.page-title p { color:var(--muted); margin:6px 0 0; }
.page-actions { display:flex; gap:9px; flex-wrap:wrap; justify-content:flex-end; }

.grid { display:grid; gap:16px; }
.kpi-grid { grid-template-columns: repeat(4, minmax(0,1fr)); }
.dashboard-grid { grid-template-columns: minmax(0,1.65fr) minmax(320px,.85fr); margin-top:16px; }
.bottom-grid { grid-template-columns: minmax(0,1.25fr) minmax(320px,.75fr); margin-top:16px; }
.card {
  background:var(--surface); border:1px solid var(--border); border-radius:var(--radius);
  box-shadow:var(--shadow-sm); min-width:0;
}
.card-header { padding:18px 18px 0; display:flex; justify-content:space-between; gap:12px; align-items:flex-start; }
.card-title { margin:0; font-size:14px; font-weight:780; }
.card-subtitle { margin:4px 0 0; color:var(--muted); font-size:11px; }
.card-body { padding:18px; }
.kpi-card { padding:17px; position:relative; overflow:hidden; }
.kpi-card::after {
  content:""; position:absolute; width:72px; height:72px; border-radius:50%; right:-26px; top:-28px;
  background:rgba(var(--accent-rgb),.08);
}
.kpi-top { display:flex; align-items:center; justify-content:space-between; gap:10px; color:var(--muted); font-size:11px; font-weight:700; }
.kpi-icon { width:32px; height:32px; border-radius:10px; display:grid; place-items:center; background:var(--accent-soft); color:var(--accent); }
.kpi-value { font-size:24px; font-weight:820; letter-spacing:-.035em; margin:13px 0 5px; }
.kpi-note { font-size:11px; color:var(--muted); }
.kpi-note strong { color:var(--success); }

.chart-wrap { padding:10px 8px 0; }
.chart-svg { width:100%; height:260px; }
.chart-grid-line { stroke:var(--border); stroke-width:1; }
.chart-label { fill:var(--muted); font:10px var(--font); }
.chart-line { fill:none; stroke:var(--accent); stroke-width:3; stroke-linecap:round; stroke-linejoin:round; }
.chart-area { fill:url(#chartFill); opacity:.55; }
.chart-dot { fill:var(--surface); stroke:var(--accent); stroke-width:2.5; }
.donut-layout { display:grid; grid-template-columns:150px 1fr; gap:18px; align-items:center; padding:18px; }
.donut { width:146px; height:146px; border-radius:50%; position:relative; background:conic-gradient(var(--accent) 0 55%, #14b8a6 55% 80%, #f59e0b 80% 95%, #ef4444 95%); }
.donut::after { content:""; position:absolute; inset:28px; background:var(--surface); border-radius:50%; }
.donut-center { position:absolute; inset:0; z-index:1; display:grid; place-content:center; text-align:center; }
.donut-center strong { font-size:15px; }
.donut-center span { font-size:10px; color:var(--muted); }
.legend { display:grid; gap:11px; }
.legend-item { display:grid; grid-template-columns:10px 1fr auto; gap:8px; align-items:center; font-size:11px; }
.legend-dot { width:8px; height:8px; border-radius:50%; }

.table-wrap { overflow:auto; }
.data-table { width:100%; border-collapse:separate; border-spacing:0; min-width:680px; }
.data-table th { text-align:left; color:var(--muted); font-size:10px; text-transform:uppercase; letter-spacing:.045em; font-weight:800; padding:11px 14px; background:var(--surface-2); border-bottom:1px solid var(--border); }
.data-table th:first-child { border-top-left-radius:10px; }
.data-table th:last-child { border-top-right-radius:10px; }
.data-table td { padding:13px 14px; border-bottom:1px solid var(--border); font-size:12px; vertical-align:middle; }
.data-table tr:last-child td { border-bottom:0; }
.data-table tbody tr:hover { background:var(--surface-2); }
.product-cell { display:flex; gap:10px; align-items:center; min-width:180px; }
.product-icon { width:34px; height:34px; border-radius:10px; display:grid; place-items:center; background:var(--accent-soft); color:var(--accent); font-weight:800; font-size:11px; }
.product-copy strong, .product-copy span { display:block; }
.product-copy span { color:var(--muted); font-size:10px; margin-top:2px; }

.badge { display:inline-flex; align-items:center; gap:5px; border-radius:999px; padding:5px 8px; font-size:10px; font-weight:750; white-space:nowrap; }
.badge-success { color:var(--success); background:var(--success-soft); }
.badge-warning { color:var(--warning); background:var(--warning-soft); }
.badge-danger { color:var(--danger); background:var(--danger-soft); }
.badge-info { color:var(--info); background:rgba(2,132,199,.1); }
.badge-neutral { color:var(--muted); background:var(--surface-3); }

.activity-list { display:grid; gap:3px; }
.activity-item { display:grid; grid-template-columns:34px 1fr auto; gap:11px; padding:11px 2px; align-items:start; }
.activity-item + .activity-item { border-top:1px solid var(--border); }
.activity-icon { width:32px; height:32px; border-radius:10px; display:grid; place-items:center; background:var(--accent-soft); color:var(--accent); }
.activity-copy strong { display:block; font-size:11px; }
.activity-copy span { display:block; color:var(--muted); font-size:10px; margin-top:3px; }
.activity-time { color:var(--muted); font-size:10px; }

.toolbar { padding:14px; display:flex; gap:10px; align-items:center; flex-wrap:wrap; }
.toolbar .search-grow { flex:1 1 260px; }
.filter-chip { border:1px solid var(--border); border-radius:10px; min-height:39px; padding:8px 11px; background:var(--surface); color:var(--text-soft); }
.filter-chip.active { border-color:rgba(var(--accent-rgb),.35); background:var(--accent-soft); color:var(--accent); font-weight:700; }

.pos-layout { display:grid; grid-template-columns:minmax(230px,.75fr) minmax(420px,1.5fr) minmax(280px,.8fr); gap:16px; }
.pos-panel { min-height:590px; }
.pos-panel .card-body { padding:16px; }
.stepper { display:flex; align-items:center; margin-bottom:18px; }
.step { display:flex; align-items:center; gap:8px; color:var(--muted); font-size:11px; font-weight:700; }
.step-number { width:25px; height:25px; border-radius:50%; border:1px solid var(--border); display:grid; place-items:center; background:var(--surface); }
.step.active { color:var(--accent); }
.step.active .step-number { background:var(--accent); color:white; border-color:var(--accent); }
.step-line { flex:1; height:1px; background:var(--border); margin:0 10px; }
.search-history { display:grid; gap:5px; margin-top:14px; }
.history-item { padding:9px 10px; border-radius:9px; color:var(--text-soft); display:flex; gap:8px; align-items:center; cursor:pointer; }
.history-item:hover { background:var(--surface-2); }
.qty-control { display:inline-flex; border:1px solid var(--border); border-radius:9px; overflow:hidden; background:var(--surface); }
.qty-control button { width:27px; height:29px; border:0; background:transparent; color:var(--text); cursor:pointer; }
.qty-control span { min-width:26px; display:grid; place-items:center; font-size:11px; border-inline:1px solid var(--border); }
.summary-lines { display:grid; gap:10px; }
.summary-line { display:flex; justify-content:space-between; gap:12px; color:var(--muted); }
.summary-line strong { color:var(--text); }
.summary-line.total { padding-top:12px; border-top:1px solid var(--border); font-size:16px; color:var(--text); font-weight:800; }
.payment-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin:14px 0; }
.payment-option { min-height:58px; border:1px solid var(--border); border-radius:11px; background:var(--surface); color:var(--muted); display:grid; place-items:center; gap:2px; cursor:pointer; font-size:10px; }
.payment-option.active { background:var(--accent-soft); color:var(--accent); border-color:rgba(var(--accent-rgb),.42); font-weight:750; }
.change-box { display:flex; justify-content:space-between; gap:12px; padding:12px; border-radius:11px; background:var(--success-soft); color:var(--success); margin:12px 0 16px; font-weight:800; }

.settings-grid { grid-template-columns:minmax(0,1fr) minmax(340px,.55fr); }
.setting-section + .setting-section { border-top:1px solid var(--border); margin-top:18px; padding-top:18px; }
.theme-options { display:grid; grid-template-columns:repeat(4,1fr); gap:10px; }
.theme-swatch { border:1px solid var(--border); border-radius:13px; padding:12px 8px; background:var(--surface); text-align:center; cursor:pointer; color:var(--text-soft); }
.theme-swatch.active { border-color:var(--accent); box-shadow:0 0 0 2px rgba(var(--accent-rgb),.1); color:var(--text); font-weight:750; }
.swatch-color { width:32px; height:32px; border-radius:10px; margin:0 auto 8px; box-shadow:inset 0 0 0 1px rgba(255,255,255,.2); }
.mode-options { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.mode-card { min-height:90px; border:1px solid var(--border); border-radius:13px; display:grid; place-items:center; gap:3px; background:var(--surface); cursor:pointer; color:var(--muted); }
.mode-card.active { border-color:var(--accent); color:var(--accent); background:var(--accent-soft); font-weight:750; }
.preview-card { padding:18px; background:linear-gradient(135deg,var(--surface-2),var(--surface)); border:1px solid var(--border); border-radius:16px; }
.preview-window { border:1px solid var(--border); border-radius:14px; overflow:hidden; background:var(--surface); box-shadow:var(--shadow); }
.preview-top { height:30px; background:var(--surface-2); border-bottom:1px solid var(--border); display:flex; gap:5px; align-items:center; padding:0 10px; }
.preview-top span { width:7px; height:7px; border-radius:50%; background:var(--border); }
.preview-body { display:grid; grid-template-columns:65px 1fr; height:190px; }
.preview-side { background:var(--surface-2); border-right:1px solid var(--border); padding:10px 7px; }
.preview-line { height:7px; background:var(--border); border-radius:4px; margin-bottom:8px; }
.preview-line.active { background:var(--accent); }
.preview-main { padding:12px; }
.preview-kpis { display:grid; grid-template-columns:repeat(3,1fr); gap:7px; }
.preview-box { height:43px; border:1px solid var(--border); border-radius:8px; background:var(--surface); }
.preview-chart { height:85px; margin-top:8px; border:1px solid var(--border); border-radius:8px; background:linear-gradient(to bottom,transparent 49%,var(--border) 50%,transparent 51%); position:relative; overflow:hidden; }
.preview-chart::after { content:""; position:absolute; left:10%; right:8%; bottom:20%; height:3px; background:var(--accent); transform:rotate(-8deg); border-radius:99px; }

.platform-stats { grid-template-columns:repeat(3,1fr); }
.tenant-table .tenant-name { font-weight:750; }
.status-dot { width:8px; height:8px; border-radius:50%; display:inline-block; margin-right:6px; background:var(--success); }
.status-dot.suspended { background:var(--warning); }

.empty-state { padding:48px 20px; text-align:center; color:var(--muted); }
.empty-state .icon { width:42px; height:42px; margin:0 auto 12px; color:var(--accent); }
.footer-note { color:var(--muted); font-size:10px; margin-top:16px; text-align:center; }

.overlay { display:none; position:fixed; inset:0; z-index:25; background:rgba(2,6,23,.48); backdrop-filter:blur(3px); }
.overlay.show { display:block; }

@media (max-width: 1180px) {
  .kpi-grid { grid-template-columns:repeat(2,1fr); }
  .dashboard-grid, .bottom-grid, .settings-grid { grid-template-columns:1fr; }
  .pos-layout { grid-template-columns:1fr 1.5fr; }
  .pos-layout > :last-child { grid-column:1/-1; min-height:auto; }
}
@media (max-width: 900px) {
  :root { --sidebar-width: 258px; }
  .app-shell { grid-template-columns:1fr; }
  .sidebar { transform:translateX(-102%); box-shadow:var(--shadow); }
  .sidebar.open { transform:translateX(0); }
  .main { grid-column:1; }
  .menu-toggle { display:grid; }
  .topbar { padding:0 16px; }
  .global-search { display:none; }
  .page { padding:20px 16px; }
  .user-copy { display:none; }
  .login-shell { grid-template-columns:1fr; }
  .login-hero { min-height:310px; padding:34px; }
  .login-panel { padding:36px 30px; }
}
@media (max-width: 680px) {
  .kpi-grid, .platform-stats { grid-template-columns:1fr; }
  .page-header { flex-direction:column; }
  .page-actions { justify-content:flex-start; width:100%; }
  .pos-layout { grid-template-columns:1fr; }
  .pos-layout > :last-child { grid-column:auto; }
  .pos-panel { min-height:auto; }
  .theme-options { grid-template-columns:repeat(2,1fr); }
  .donut-layout { grid-template-columns:1fr; justify-items:center; }
  .legend { width:100%; }
  .login-page { padding:12px; }
  .login-hero { display:none; }
  .login-panel { padding:30px 22px; }
}


/* Sprint 1 backend additions */
.btn-danger{background:#dc2626;color:#fff;border-color:#dc2626}
.btn-danger:hover{background:#b91c1c}
.modal-backdrop{position:fixed;inset:0;background:rgba(15,23,42,.58);display:none;align-items:center;justify-content:center;padding:20px;z-index:100}
.modal-backdrop.show{display:flex}
.modal-card{width:min(760px,100%);max-height:92vh;overflow:auto;background:var(--surface);border:1px solid var(--border);border-radius:20px;box-shadow:0 28px 80px rgba(15,23,42,.28)}
.modal-header,.modal-footer{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:20px 22px;border-bottom:1px solid var(--border)}
.modal-header h2{margin:0;font-size:1.25rem}
.modal-header p{margin:4px 0 0;color:var(--text-muted)}
.modal-body{padding:22px}
.modal-footer{border-top:1px solid var(--border);border-bottom:0;justify-content:flex-end}
.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.form-grid .span-2{grid-column:1/-1}
.form-divider{padding-top:8px;border-top:1px solid var(--border)}
textarea.input{height:auto;min-height:74px;resize:vertical}
select.input{appearance:auto}
.status-form{display:flex;gap:8px;align-items:center;min-width:280px}
.small-input{min-width:150px;height:36px;padding:6px 10px}
code.small{font-size:.72rem;word-break:break-all}
.nav-link[aria-disabled="true"]{opacity:.62;cursor:not-allowed}
@media(max-width:720px){
  .form-grid{grid-template-columns:1fr}
  .form-grid .span-2{grid-column:auto}
  .status-form{min-width:220px;flex-wrap:wrap}
}

/* Tenant selection */
.tenant-choice-shell{width:min(680px,calc(100% - 32px));margin:auto;padding:36px 0}.tenant-choice-card{padding:28px}.tenant-choice-list{display:grid;gap:12px;margin-top:24px}.tenant-choice-button{width:100%;display:flex;align-items:center;gap:14px;padding:15px;border:1px solid var(--border);border-radius:14px;background:var(--surface);color:var(--text);font:inherit;text-align:left;cursor:pointer;transition:.18s ease}.tenant-choice-button:hover{border-color:var(--accent);transform:translateY(-1px);box-shadow:var(--shadow-sm)}.tenant-choice-copy{display:grid;gap:3px;flex:1}.tenant-choice-copy small{color:var(--text-muted)}.text-center{text-align:center}


/* Sprint 2 — Master Data */
.tabs { display:flex; gap:6px; overflow:auto; padding:5px; margin-bottom:16px; border:1px solid var(--border); border-radius:14px; background:var(--surface); }
.tab { white-space:nowrap; min-height:38px; padding:9px 13px; border-radius:10px; color:var(--muted); font-weight:700; }
.tab:hover { background:var(--surface-2); color:var(--text); }
.tab.active { background:var(--accent); color:white; box-shadow:0 7px 16px rgba(var(--accent-rgb),.18); }
.master-layout { display:grid; grid-template-columns:minmax(320px,.65fr) minmax(0,1.35fr); gap:16px; align-items:start; }
.form-card { position:sticky; top:calc(var(--topbar-height) + 16px); }
.form-stack { display:grid; gap:14px; }
.form-grid { display:grid; gap:13px; }
.form-grid.two-col { grid-template-columns:repeat(2,minmax(0,1fr)); }
.span-2 { grid-column:1/-1; }
.textarea { min-height:90px; resize:vertical; }
.card-head { display:flex; align-items:center; justify-content:space-between; gap:14px; padding:0 0 14px; }
.card-head h3,.form-card h3 { margin:0; }
.card-head p,.form-card > p { margin:4px 0 0; color:var(--muted); font-size:12px; }
.compact-search { width:min(280px,45%); }
.table-sub { display:block; color:var(--muted); font-size:11px; margin-top:3px; }
.info-box { display:flex; gap:10px; padding:12px; margin:12px 0 16px; border-radius:12px; background:var(--accent-soft); color:var(--text-soft); }
.info-box .icon { color:var(--accent); }
.compact-list { margin:6px 0 0; padding-left:18px; }
.update-grid { display:grid; grid-template-columns:minmax(0,1.25fr) minmax(320px,.75fr); gap:16px; }
.update-hero h2 { font-size:28px; margin:8px 0; letter-spacing:-.03em; }
.update-hero > p { color:var(--muted); max-width:720px; }
.eyebrow { display:inline-flex; color:var(--accent); background:var(--accent-soft); padding:6px 9px; border-radius:999px; font-weight:800; font-size:11px; }
.update-status { margin-top:22px; display:flex; gap:12px; align-items:center; padding:14px; border-radius:13px; border:1px solid var(--border); }
.update-status.is-ready { background:var(--success-soft); color:var(--success); }
.update-status.is-pending { background:var(--warning-soft); color:var(--warning); }
.update-status strong,.update-status span { display:block; }
.update-status span { font-size:11px; opacity:.8; }
.feature-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.feature-list > div { display:flex; gap:12px; padding:14px; background:var(--surface-2); border:1px solid var(--border); border-radius:13px; }
.feature-list .icon { color:var(--accent); }
.feature-list strong,.feature-list small { display:block; }
.feature-list small { color:var(--muted); margin-top:3px; }
@media (max-width:1000px){ .master-layout,.update-grid{grid-template-columns:1fr}.form-card{position:static}.feature-list{grid-template-columns:1fr} }
@media (max-width:680px){ .form-grid.two-col{grid-template-columns:1fr}.span-2{grid-column:auto}.card-head{align-items:stretch;flex-direction:column}.compact-search{width:100%} }


/* Sprint 3 — Pembelian dan Penerimaan */
.purchase-layout { display:grid; grid-template-columns:minmax(400px,.88fr) minmax(0,1.12fr); gap:16px; align-items:start; }
.purchase-form-card { position:static; }
.purchase-wide-card { max-width:1500px; }
.line-section { border-top:1px solid var(--border); padding-top:16px; }
.line-list { display:grid; gap:10px; }
.line-row { display:grid; gap:9px; align-items:end; padding:12px; border:1px solid var(--border); border-radius:13px; background:var(--surface-2); }
.order-line { grid-template-columns:minmax(190px,1.6fr) repeat(4,minmax(85px,.65fr)) 38px; }
.receipt-line { grid-template-columns:minmax(180px,1.4fr) minmax(140px,1fr) repeat(6,minmax(95px,.7fr)) 38px; }
.line-row .form-label { font-size:10px; }
.line-row .input { min-width:0; }
.line-remove { align-self:end; margin-bottom:1px; color:var(--danger); }
.line-total { display:flex; align-items:center; justify-content:space-between; padding:14px 16px; border-radius:13px; background:var(--accent-soft); color:var(--text-soft); }
.line-total strong { color:var(--accent); font-size:19px; }
.status-actions { display:flex; gap:7px; flex-wrap:wrap; align-items:center; min-width:250px; }
.inline-cancel { display:flex; gap:6px; align-items:center; }
.receipt-head-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
.mutation-value { font-weight:850; }
.mutation-value.positive { color:var(--success); }
.mutation-value.negative { color:var(--danger); }
.ledger-table { min-width:950px; }
@media (max-width:1250px) {
  .purchase-layout { grid-template-columns:1fr; }
  .order-line { grid-template-columns:minmax(180px,1.3fr) repeat(4,minmax(80px,.7fr)) 38px; }
  .receipt-line { grid-template-columns:repeat(4,minmax(150px,1fr)); }
  .receipt-line .line-remove { grid-column:4; justify-self:end; }
}
@media (max-width:850px) {
  .order-line,.receipt-line { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .line-product { grid-column:1/-1; }
  .line-remove { grid-column:2; justify-self:end; }
  .receipt-head-grid { grid-template-columns:1fr; }
}
@media (max-width:560px) {
  .order-line,.receipt-line { grid-template-columns:1fr; }
  .line-product,.line-remove { grid-column:auto; }
  .line-remove { justify-self:end; }
  .inline-cancel { flex-direction:column; align-items:stretch; }
}

/* Sprint 3.1 -------------------------------------------------------------- */
.po-loader {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: end;
  padding: 16px;
  margin-bottom: 18px;
  border: 1px solid var(--border);
  border-radius: 14px;
  background: var(--surface-soft);
}

.po-prefill-summary {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 18px;
}

.po-prefill-summary > div,
.po-quantity-strip span {
  padding: 12px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--surface-soft);
}

.po-prefill-summary span,
.po-quantity-strip span {
  color: var(--text-muted);
  font-size: 12px;
}

.po-prefill-summary strong,
.po-quantity-strip strong {
  display: block;
  margin-top: 3px;
  color: var(--text);
}

.receipt-items-v2 {
  display: grid;
  gap: 16px;
}

.receipt-product-block {
  padding: 16px;
  border: 1px solid var(--border);
  border-radius: 16px;
  background: var(--surface-soft);
}

.receipt-product-head {
  display: grid;
  grid-template-columns: minmax(180px, .8fr) minmax(0, 2fr);
  gap: 16px;
  margin-bottom: 14px;
}

.receipt-product-head > div:first-child {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.receipt-product-head span {
  color: var(--text-muted);
}

.po-quantity-strip {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.receipt-allocation-row {
  display: grid;
  grid-template-columns: .7fr .9fr 1fr .9fr 1.1fr .7fr .7fr minmax(150px, 1fr) 42px;
  gap: 9px;
  align-items: end;
  margin-bottom: 10px;
  padding: 12px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--surface);
}

.variance-preview {
  min-height: 42px;
  display: flex;
  align-items: center;
  padding: 9px 11px;
  border-radius: 10px;
  font-size: 12px;
  font-weight: 700;
  background: var(--surface-soft);
  color: var(--text-muted);
}

.variance-preview.is-same {
  background: color-mix(in srgb, var(--success) 12%, transparent);
  color: var(--success);
}

.variance-preview.is-warning {
  background: color-mix(in srgb, var(--warning) 14%, transparent);
  color: var(--warning);
}

.variance-preview.is-danger {
  background: color-mix(in srgb, var(--danger) 14%, transparent);
  color: var(--danger);
}

.field-attention .input {
  border-color: var(--warning);
}

.receipt-workflow-list {
  display: grid;
  gap: 12px;
}

.receipt-workflow-card {
  padding: 16px;
  border: 1px solid var(--border);
  border-radius: 14px;
  background: var(--surface-soft);
}

.receipt-workflow-main,
.receipt-workflow-actions,
.receipt-workflow-badges,
.receipt-inline-form {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.receipt-workflow-main {
  justify-content: space-between;
}

.receipt-workflow-main > div:first-child {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.receipt-workflow-main span {
  color: var(--text-muted);
}

.receipt-workflow-meta {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  margin: 14px 0;
}

.receipt-workflow-meta span {
  padding: 9px 11px;
  border-radius: 10px;
  background: var(--surface);
  color: var(--text-muted);
  font-size: 12px;
}

.receipt-workflow-meta strong {
  display: block;
  margin-top: 2px;
  color: var(--text);
}

.receipt-inline-form {
  margin-bottom: 12px;
}

.receipt-inline-form .input {
  flex: 1 1 300px;
}

.product-detail-hero {
  display: flex;
  align-items: center;
  gap: 14px;
}

.product-icon.large {
  width: 58px;
  height: 58px;
  font-size: 18px;
}

@media (max-width: 1200px) {
  .receipt-allocation-row {
    grid-template-columns: repeat(4, minmax(120px, 1fr));
  }

  .receipt-allocation-row .variance-preview {
    grid-column: span 3;
  }
}

@media (max-width: 820px) {
  .po-loader,
  .receipt-product-head {
    grid-template-columns: 1fr;
  }

  .po-prefill-summary,
  .po-quantity-strip,
  .receipt-workflow-meta {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .receipt-allocation-row {
    grid-template-columns: 1fr 1fr;
  }

  .receipt-allocation-row .variance-preview {
    grid-column: span 2;
  }
}
/* UI spacing refinement — 2026-07
   Memberi ruang napas konsisten antara isi card dan garis tepi. */
.form-card,
.purchase-form-card,
.purchase-wide-card,
.update-hero,
.product-detail-hero {
  padding: 24px;
}

.form-card > h3,
.purchase-form-card > h3,
.purchase-wide-card > .card-head,
.update-hero > .eyebrow,
.product-detail-hero > .product-icon {
  position: relative;
}

.form-card > p,
.purchase-form-card > p {
  margin-bottom: 20px;
  line-height: 1.55;
}

.form-stack {
  gap: 18px;
}

.form-grid {
  column-gap: 18px;
  row-gap: 16px;
}

.form-group {
  min-width: 0;
}

.form-label {
  display: inline-block;
  margin-bottom: 7px;
  line-height: 1.35;
}

.card-head {
  padding-bottom: 18px;
}

.line-section {
  margin-top: 2px;
  padding-top: 20px;
}

.line-list {
  gap: 12px;
}

.line-row {
  padding: 14px;
}

.purchase-layout {
  gap: 20px;
}

.po-loader,
.receipt-product-block,
.receipt-workflow-card {
  padding: 18px;
}

@media (max-width: 1000px) {
  .form-card,
  .purchase-form-card,
  .purchase-wide-card,
  .update-hero,
  .product-detail-hero {
    padding: 20px;
  }
}

@media (max-width: 680px) {
  .form-card,
  .purchase-form-card,
  .purchase-wide-card,
  .update-hero,
  .product-detail-hero {
    padding: 16px;
  }

  .form-stack {
    gap: 16px;
  }

  .form-grid {
    gap: 14px;
  }

  .card-head {
    padding-bottom: 15px;
  }

  .line-row,
  .po-loader,
  .receipt-product-block,
  .receipt-workflow-card {
    padding: 14px;
  }
}

/* Sprint 4 — inventory controls ----------------------------------------- */
.tabs-scroll {
  overflow-x: auto;
  scrollbar-width: thin;
}

.control-overview-grid,
.control-split {
  display: grid;
  grid-template-columns: minmax(300px, .85fr) minmax(0, 1.65fr);
  gap: 20px;
  margin-top: 16px;
  align-items: start;
}

.control-intro-card h2 {
  margin: 8px 0 10px;
}

.feature-list.compact {
  margin-top: 18px;
}

.control-list {
  display: grid;
  gap: 14px;
}

.workflow-card {
  padding: 20px;
}

.workflow-card-head,
.workflow-actions,
.status-actions,
.recall-resolution-form,
.batch-status-form {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.workflow-card-head {
  justify-content: space-between;
  margin-bottom: 12px;
}

.workflow-card-head > div:first-child {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.workflow-card-head span,
.workflow-metrics span {
  color: var(--text-muted);
}

.workflow-metrics,
.reconciliation-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin: 14px 0;
}

.workflow-metrics > span,
.reconciliation-summary > div {
  padding: 11px 12px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--surface-soft);
  font-size: 12px;
}

.workflow-metrics strong,
.reconciliation-summary strong {
  display: block;
  margin-top: 3px;
  color: var(--text);
  font-size: 16px;
}

.reconciliation-summary.large {
  grid-template-columns: repeat(6, minmax(0, 1fr));
}

.count-sheet {
  display: grid;
  gap: 14px;
}

.count-input {
  min-width: 110px;
}

.variance-chip {
  display: inline-flex;
  justify-content: center;
  min-width: 72px;
  padding: 7px 9px;
  border-radius: 999px;
  font-weight: 800;
  background: var(--surface-soft);
}

.variance-chip.is-positive {
  color: var(--success);
  background: color-mix(in srgb, var(--success) 12%, transparent);
}

.variance-chip.is-negative {
  color: var(--danger);
  background: color-mix(in srgb, var(--danger) 12%, transparent);
}

.variance-chip.is-zero {
  color: var(--text-muted);
}

.compact-table th,
.compact-table td {
  padding-top: 10px;
  padding-bottom: 10px;
}

.batch-status-form {
  min-width: 460px;
}

.batch-status-form .input:first-of-type {
  width: 150px;
}

.batch-status-form .input:nth-of-type(2) {
  flex: 1 1 220px;
}

.recall-resolution-form {
  margin-top: 14px;
}

.recall-resolution-form select {
  width: 200px;
}

.recall-resolution-form input {
  flex: 1 1 260px;
}

.multi-select {
  min-height: 190px;
}

.reconciliation-card h4 {
  margin: 24px 0 10px;
}

.field-help {
  display: block;
  margin-top: 6px;
  color: var(--text-muted);
  font-size: 12px;
}

@media (max-width: 1180px) {
  .reconciliation-summary.large {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 900px) {
  .control-overview-grid,
  .control-split {
    grid-template-columns: 1fr;
  }

  .workflow-metrics,
  .reconciliation-summary,
  .reconciliation-summary.large {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .batch-status-form {
    min-width: 0;
  }
}

@media (max-width: 620px) {
  .workflow-metrics,
  .reconciliation-summary,
  .reconciliation-summary.large {
    grid-template-columns: 1fr;
  }

  .workflow-card {
    padding: 16px;
  }

  .batch-status-form,
  .recall-resolution-form {
    align-items: stretch;
    flex-direction: column;
  }

  .batch-status-form .input:first-of-type,
  .recall-resolution-form select {
    width: 100%;
  }
}

/* Sprint 4.1 — inventory disposition redesign ---------------------------- */
.inventory-control-tabs {
  overflow-x: auto;
  scrollbar-width: thin;
}

.disposition-table th,
.disposition-table td {
  white-space: nowrap;
}

.bucket-value {
  display: inline-flex;
  min-width: 52px;
  justify-content: flex-end;
  padding: 5px 8px;
  border-radius: 9px;
  font-weight: 750;
  background: var(--surface-soft);
}

.bucket-value.is-available {
  color: var(--success);
  background: color-mix(in srgb, var(--success) 12%, transparent);
}

.bucket-value.is-quarantine {
  color: var(--warning);
  background: color-mix(in srgb, var(--warning) 13%, transparent);
}

.bucket-value.is-damaged {
  color: var(--danger);
  background: color-mix(in srgb, var(--danger) 12%, transparent);
}

.control-two-column {
  display: grid;
  grid-template-columns: minmax(320px, .82fr) minmax(0, 1.5fr);
  gap: 18px;
  margin-top: 16px;
  align-items: start;
}

.workflow-stack {
  display: grid;
  gap: 14px;
}

.opname-condition-form {
  display: grid;
  gap: 12px;
  margin-top: 16px;
}

.opname-condition-row {
  display: grid;
  grid-template-columns: minmax(190px, 1.4fr) repeat(7, minmax(82px, .5fr)) minmax(190px, 1.25fr);
  gap: 9px;
  padding: 14px;
  border: 1px solid var(--border);
  border-radius: 14px;
  background: var(--surface-soft);
  align-items: end;
}

.opname-item-name {
  display: flex;
  flex-direction: column;
  gap: 4px;
  align-self: center;
}

.opname-item-name span,
.condition-input label,
.condition-reason label {
  color: var(--text-muted);
  font-size: 12px;
}

.condition-input,
.condition-reason {
  display: grid;
  gap: 6px;
}

.compact-condition-review {
  margin-top: 14px;
}

.condition-event-card {
  padding: 15px;
  border: 1px solid var(--border);
  border-radius: 14px;
  background: var(--surface-soft);
}

.condition-event-card > div:first-child,
.condition-event-card > div:nth-child(2) {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
}

.condition-event-card > div:first-child {
  flex-direction: column;
  align-items: flex-start;
}

.condition-event-card > div:first-child span {
  color: var(--text-muted);
}

.condition-event-card p {
  margin: 10px 0;
}

.text-danger {
  color: var(--danger);
}

.mini-kpi-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin: 16px 0 22px;
}

.mini-kpi {
  padding: 13px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--surface-soft);
}

.mini-kpi span {
  display: block;
  color: var(--text-muted);
  font-size: 12px;
}

.mini-kpi strong {
  display: block;
  margin-top: 4px;
  font-size: 22px;
}

@media (max-width: 1280px) {
  .opname-condition-row {
    grid-template-columns: repeat(3, minmax(120px, 1fr));
  }

  .opname-item-name,
  .condition-reason {
    grid-column: 1 / -1;
  }
}

@media (max-width: 900px) {
  .control-two-column {
    grid-template-columns: 1fr;
  }

  .mini-kpi-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 620px) {
  .opname-condition-row,
  .mini-kpi-grid {
    grid-template-columns: 1fr;
  }

  .opname-item-name,
  .condition-reason {
    grid-column: auto;
  }
}


/* Sprint 4.2 — simple stocktake and issue reporting */
.simple-count-form { display:grid; gap:14px; }
.simple-count-toolbar { display:flex; gap:12px; align-items:center; flex-wrap:wrap; }
.simple-count-row { display:grid; grid-template-columns:minmax(260px,1.6fr) 110px 150px auto; gap:14px; align-items:end; padding:16px; border:1px solid var(--border); border-radius:14px; background:var(--surface-soft); }
.simple-count-product { display:flex; flex-direction:column; gap:4px; }
.simple-count-product span, .simple-count-product small { color:var(--text-muted); }
.system-stock { display:flex; flex-direction:column; gap:4px; padding:10px 12px; border-radius:10px; background:var(--surface); }
.system-stock span { color:var(--text-muted); font-size:12px; }
.system-stock strong { font-size:18px; }
.count-note-panel { grid-column:1/-1; display:grid; grid-template-columns:1fr .7fr 1.4fr; gap:12px; padding-top:14px; border-top:1px dashed var(--border); }
.count-note-panel[hidden] { display:none; }
.review-problem-list { display:grid; gap:12px; margin:14px 0; }
.review-problem-row { display:grid; grid-template-columns:minmax(240px,1.4fr) 1fr 1fr; gap:10px; align-items:end; padding:14px; border:1px solid var(--border); border-radius:12px; background:var(--surface-soft); }
.review-problem-row > div { display:flex; flex-direction:column; gap:4px; }
.review-problem-row span, .review-problem-row small { color:var(--text-muted); }
.issue-review-form { display:grid; grid-template-columns:1fr 1.4fr auto; gap:10px; align-items:end; margin-top:14px; }
.simple-opname-layout { align-items:start; }
@media (max-width:1100px) { .simple-count-row { grid-template-columns:1fr 110px 150px; } .simple-count-row > button { grid-column:1/-1; justify-self:start; } }
@media (max-width:760px) { .simple-count-row, .review-problem-row, .issue-review-form, .count-note-panel { grid-template-columns:1fr; } .count-note-panel { grid-column:auto; } }

/* Sprint 5 — Penjualan kasir -------------------------------------------- */
.small-value { font-size: clamp(22px, 3vw, 34px); }
.shift-gate-card {
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) minmax(280px, .7fr);
  gap: 28px;
  align-items: center;
  padding: 28px;
}
.shift-gate-copy h2 { margin: 6px 0 8px; font-size: 28px; }
.shift-gate-copy p { max-width: 650px; color: var(--text-muted); line-height: 1.6; }
.shift-open-form { padding: 18px; border: 1px solid var(--border); border-radius: 16px; background: var(--surface-soft); }
.compact-stepper { margin: 18px 0; }
.pos-live-layout { grid-template-columns: minmax(260px, .8fr) minmax(420px, 1.35fr) minmax(280px, .85fr); align-items: start; }
.pos-search-panel,
.pos-cart-panel,
.pos-payment-panel { min-height: 590px; }
.pos-search-status { margin: 14px 0 10px; color: var(--text-muted); font-size: 13px; }
.pos-product-results { display: grid; gap: 8px; max-height: 430px; overflow: auto; padding-right: 3px; }
.pos-product-result {
  width: 100%;
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  padding: 11px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--surface);
  color: var(--text);
  text-align: left;
  cursor: pointer;
}
.pos-product-result:hover { border-color: var(--accent); transform: translateY(-1px); }
.pos-product-result.is-blocked { opacity: .62; cursor: not-allowed; }
.pos-result-copy { min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.pos-result-copy strong,
.pos-result-copy span,
.pos-result-copy small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pos-result-copy span,
.pos-result-copy small,
.pos-result-side span { color: var(--text-muted); font-size: 12px; }
.pos-result-side { text-align: right; display: flex; flex-direction: column; gap: 3px; }
.pos-cart-body { min-height: 500px; }
.pos-empty-cart { min-height: 380px; display: grid; place-content: center; justify-items: center; gap: 8px; color: var(--text-muted); text-align: center; }
.pos-empty-cart .icon { width: 40px; height: 40px; }
.pos-cart-list { display: grid; gap: 10px; }
.pos-cart-item {
  display: grid;
  grid-template-columns: minmax(170px, 1fr) auto minmax(130px, auto) auto 38px;
  gap: 10px;
  align-items: center;
  padding: 12px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--surface-soft);
}
.pos-cart-product { display: flex; gap: 10px; align-items: center; min-width: 0; }
.pos-cart-product > div:last-child { min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.pos-cart-product strong,
.pos-cart-product span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pos-cart-product span { color: var(--text-muted); font-size: 12px; }
.pos-cart-price { color: var(--text-muted); font-size: 13px; }
.pos-cart-item .qty-control input { width: 64px; border: 0; background: transparent; text-align: center; color: var(--text); font-weight: 700; }
.pos-payment-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); margin-bottom: 16px; }
.payment-label { margin-top: 18px; }
.pos-summary-lines { margin-top: 18px; }
.is-hidden { display: none !important; }
.sale-detail-grid { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 18px; align-items: start; }
.sale-detail-main { padding: 24px; }
.sale-detail-head { display: flex; justify-content: space-between; gap: 16px; align-items: flex-start; }
.sale-detail-head h2 { margin: 4px 0; }
.sale-detail-head p { margin: 0; color: var(--text-muted); }
.sale-meta-grid,
.shift-current-meta { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin-top: 18px; }
.sale-meta-grid > div,
.shift-current-meta > div { padding: 12px; border: 1px solid var(--border); border-radius: 12px; background: var(--surface-soft); }
.sale-meta-grid span,
.shift-current-meta span { display: block; color: var(--text-muted); font-size: 12px; }
.sale-meta-grid strong,
.shift-current-meta strong { display: block; margin-top: 3px; }
.allocation-chip { display: block; width: fit-content; margin: 2px 0; padding: 4px 7px; border-radius: 8px; background: var(--surface-soft); color: var(--text-muted); font-size: 11px; }
.payment-detail-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 10px; margin-top: 18px; }
.payment-detail-list > div { padding: 12px; border: 1px solid var(--border); border-radius: 12px; display: flex; flex-direction: column; gap: 2px; }
.payment-detail-list span,
.payment-detail-list small { color: var(--text-muted); }
.sale-action-column { display: grid; gap: 16px; }
.risk-card,
.return-card { padding: 20px; }
.risk-card p,
.return-card p { color: var(--text-muted); line-height: 1.55; }
.return-item-list { display: grid; gap: 8px; }
.return-item-row { display: grid; grid-template-columns: minmax(0, 1fr) 100px; gap: 10px; align-items: center; padding: 10px; border: 1px solid var(--border); border-radius: 10px; background: var(--surface-soft); }
.return-item-row > div { display: flex; flex-direction: column; gap: 2px; }
.return-item-row span { color: var(--text-muted); font-size: 12px; }
.sale-return-history { margin-top: 22px; }
.return-history-row { display: flex; justify-content: space-between; gap: 12px; padding: 11px 0; border-bottom: 1px solid var(--border); }
.return-history-row > div { display: flex; flex-direction: column; gap: 2px; }
.return-history-row span { color: var(--text-muted); font-size: 12px; }
.shift-layout { display: grid; grid-template-columns: minmax(280px, .7fr) minmax(0, 1.3fr); gap: 18px; align-items: start; }
.shift-current-card { padding: 24px; }
.shift-current-card h2 { margin: 10px 0; }
.shift-current-meta { grid-template-columns: repeat(2, minmax(0, 1fr)); margin-bottom: 20px; }

@media (max-width: 1250px) {
  .pos-live-layout { grid-template-columns: minmax(240px, .8fr) minmax(380px, 1.2fr); }
  .pos-payment-panel { grid-column: 1 / -1; min-height: auto; }
  .pos-payment-panel .card-body { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 22px; }
  .pos-payment-panel .pos-summary-lines,
  .pos-payment-panel .change-box,
  .pos-payment-panel .btn-block,
  .pos-payment-panel .field-help { grid-column: 1 / -1; }
}

@media (max-width: 900px) {
  .shift-gate-card,
  .shift-layout,
  .sale-detail-grid,
  .pos-live-layout { grid-template-columns: 1fr; }
  .pos-search-panel,
  .pos-cart-panel,
  .pos-payment-panel { min-height: auto; }
  .pos-product-results { max-height: 320px; }
  .sale-meta-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 620px) {
  .pos-cart-item { grid-template-columns: minmax(0, 1fr) auto; }
  .pos-cart-product { grid-column: 1 / -1; }
  .pos-cart-item .qty-control { grid-column: 1; }
  .pos-payment-panel .card-body { display: block; }
  .sale-meta-grid { grid-template-columns: 1fr; }
}

/* Sprint 5.1 — POS simplification --------------------------------------- */
.pos51-layout {
  display: grid;
  grid-template-columns: minmax(290px, .7fr) minmax(540px, 1.3fr);
  gap: 18px;
  align-items: stretch;
  margin-top: 18px;
}

.pos51-panel {
  min-height: 620px;
}

.pos51-search-panel .card-body,
.pos51-cart-panel {
  min-height: 0;
}

.pos51-cart-panel {
  display: flex;
  flex-direction: column;
}

.pos51-cart-header {
  position: relative;
}

.pos51-transaction-menu-wrap,
.pos51-item-menu-wrap {
  position: relative;
}

.pos51-transaction-menu,
.pos51-item-menu {
  position: absolute;
  z-index: 30;
  top: calc(100% + 7px);
  right: 0;
  min-width: 190px;
  padding: 6px;
  border: 1px solid var(--border);
  border-radius: 11px;
  background: var(--surface);
  box-shadow: 0 18px 45px rgb(0 0 0 / .22);
}

.pos51-transaction-menu button,
.pos51-item-menu button {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 10px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: var(--text);
  text-align: left;
  cursor: pointer;
}

.pos51-transaction-menu button:hover,
.pos51-item-menu button:hover {
  background: var(--surface-soft);
}

.pos51-cart-body {
  flex: 1;
  min-height: 420px;
}

.pos-empty-cart[hidden],
.pos-cart-list[hidden],
.pos51-cart-footer[hidden],
.pos51-payment-modal[hidden],
.pos51-customer-field[hidden],
.pos51-transaction-menu[hidden],
.pos51-item-menu[hidden],
[data-pos-reference-group][hidden],
[data-pos-cash-section][hidden] {
  display: none !important;
}

.pos-product-result.is-active {
  border-color: var(--accent);
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--accent) 20%, transparent);
}

.pos51-cart-item {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) auto minmax(120px, auto) 38px;
  gap: 12px;
  align-items: center;
  padding: 13px;
  border: 1px solid var(--border);
  border-radius: 13px;
  background: var(--surface-soft);
}

.pos51-qty-control input {
  width: 58px !important;
}

.pos51-cart-amount {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 2px;
}

.pos51-cart-amount span {
  color: var(--text-muted);
  font-size: 11px;
}

.pos51-cart-footer {
  padding: 15px 18px 18px;
  border-top: 1px solid var(--border);
  background: color-mix(in srgb, var(--surface) 94%, transparent);
}

.pos51-customer-disclosure {
  margin-bottom: 13px;
}

.pos51-customer-field {
  margin: 0;
}

.pos51-inline-field {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 42px;
  gap: 8px;
}

.pos51-checkout-summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
}

.pos51-checkout-summary > div {
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.pos51-checkout-summary span {
  color: var(--text-muted);
  font-size: 12px;
}

.pos51-checkout-summary strong {
  font-size: 20px;
}

.pos51-checkout-summary strong b {
  margin-left: 6px;
  color: var(--text);
}

.pos51-shortcuts {
  display: flex;
  gap: 14px;
  flex-wrap: wrap;
  margin-top: 11px;
  color: var(--text-muted);
  font-size: 11px;
}

.pos51-shortcuts kbd {
  padding: 2px 5px;
  border: 1px solid var(--border);
  border-bottom-width: 2px;
  border-radius: 5px;
  background: var(--surface-soft);
  color: var(--text);
  font: inherit;
  font-weight: 700;
}

.pos51-modal-open {
  overflow: hidden;
}

.pos51-payment-modal {
  position: fixed;
  z-index: 1000;
  inset: 0;
  display: grid;
  place-items: center;
  padding: 18px;
}

.pos51-payment-backdrop {
  position: absolute;
  inset: 0;
  border: 0;
  background: rgb(0 0 0 / .58);
  backdrop-filter: blur(4px);
  cursor: default;
}

.pos51-payment-dialog {
  position: relative;
  z-index: 1;
  width: min(510px, 100%);
  max-height: calc(100vh - 36px);
  overflow: auto;
  padding: 24px;
  border: 1px solid var(--border);
  border-radius: 20px;
  background: var(--surface);
  box-shadow: 0 30px 90px rgb(0 0 0 / .36);
}

.pos51-payment-head {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: flex-start;
}

.pos51-payment-head h2 {
  margin: 5px 0 3px;
}

.pos51-payment-head p {
  margin: 0;
  color: var(--text-muted);
}

.pos51-payment-total {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  margin: 20px 0;
  padding: 16px;
  border-radius: 14px;
  background: color-mix(in srgb, var(--accent) 11%, var(--surface-soft));
}

.pos51-payment-total span {
  color: var(--text-muted);
}

.pos51-payment-total strong {
  font-size: 25px;
}

.pos51-payment-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-bottom: 18px;
}

.pos51-payment-grid .payment-option {
  min-height: 74px;
}

.input-lg {
  min-height: 52px;
  font-size: 18px;
  font-weight: 700;
}

.pos51-cash-shortcuts {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin: 9px 0 15px;
}

.pos51-change-box {
  margin-bottom: 16px;
}

.pos51-payment-help {
  margin: 12px 0 0;
  text-align: center;
}

@media (max-width: 1050px) {
  .pos51-layout {
    grid-template-columns: minmax(250px, .8fr) minmax(450px, 1.2fr);
  }

  .pos51-cart-item {
    grid-template-columns: minmax(190px, 1fr) auto minmax(105px, auto) 38px;
  }
}

@media (max-width: 820px) {
  .pos51-layout {
    grid-template-columns: 1fr;
  }

  .pos51-panel {
    min-height: auto;
  }

  .pos51-search-panel .pos-product-results {
    max-height: 300px;
  }

  .pos51-cart-body {
    min-height: 280px;
  }
}

@media (max-width: 620px) {
  .pos51-cart-item {
    grid-template-columns: minmax(0, 1fr) auto;
  }

  .pos51-cart-item .pos-cart-product {
    grid-column: 1 / -1;
  }

  .pos51-cart-amount {
    align-items: flex-start;
  }

  .pos51-checkout-summary {
    align-items: stretch;
    flex-direction: column;
  }

  .pos51-checkout-summary .btn {
    width: 100%;
  }

  .pos51-payment-dialog {
    padding: 18px;
  }

  .pos51-payment-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* Sprint 5.2 — compact POS and stock card -------------------------------- */
.sales52-page .kpi-grid { gap: 12px; margin-bottom: 12px; }
.sales52-page .kpi-card { min-height: 118px; padding: 14px 16px; border-radius: 16px; }
.sales52-page .kpi-top { margin-bottom: 10px; font-size: 12px; }
.sales52-page .kpi-icon { width: 36px; height: 36px; }
.sales52-page .kpi-value { font-size: 24px; line-height: 1.1; }
.sales52-page .kpi-note { margin-top: 8px; font-size: 12px; }
.sales52-page .tabs { margin-top: 10px !important; padding: 4px; }
.sales52-page .tab { padding: 10px 14px; }
.sales52-page .pos51-layout { gap: 14px; margin-top: 14px; grid-template-columns: minmax(280px, .7fr) minmax(520px, 1.3fr); }
.sales52-page .pos51-panel { min-height: 510px; }
.sales52-page .pos51-cart-body { min-height: 300px; }
.sales52-page .pos51-cart-item { grid-template-columns: minmax(220px, 1fr) auto minmax(110px, auto) 38px; padding: 10px 12px; border-radius: 12px; }
.sales52-page .product-icon { width: 30px; height: 30px; font-size: 11px; }
.sales52-page .pos52-qty-control button,
.sales52-page .pos52-qty-control input { min-height: 30px; height: 30px; }
.sales52-page .pos52-qty-control input { width: 44px !important; font-weight: 700; text-align: center; padding: 0 4px; }
.sales52-page .pos51-checkout-summary strong { font-size: 18px; }
.sales52-page .pos51-shortcuts { margin-top: 8px; gap: 10px; }
.sales52-page .card-header .card-title { font-size: 18px; }
.sales52-page .card-subtitle,
.sales52-page .field-help,
.sales52-page .pos-search-status { font-size: 12px; }
.sales52-page .pos-product-results { max-height: 320px; overflow: auto; }
.sales52-page .pos-result-side strong,
.sales52-page .pos-cart-line-total { font-size: 14px; }

.stock-card-summary { display: flex; gap: 12px; padding: 14px 16px; margin-bottom: 12px; border: 1px solid var(--border); border-radius: 14px; background: color-mix(in srgb, var(--surface-soft) 90%, transparent); }
.stock-card-summary strong { display: block; margin-bottom: 4px; }
.stock-card-summary span { color: var(--text-muted); font-size: 13px; }
.stock-card-table .stock-mutation-cell,
.stock-card-table .stock-balance-cell { display: flex; flex-direction: column; gap: 4px; }
.stock-card-table .stock-mutation-cell strong,
.stock-card-table .stock-balance-cell strong { font-size: 14px; }
.stock-card-table .table-sub { font-size: 12px; }

@media (max-width: 1200px) {
  .sales52-page .kpi-card { min-height: 108px; }
  .sales52-page .pos51-layout { grid-template-columns: minmax(250px, .76fr) minmax(470px, 1.24fr); }
}

@media (max-width: 820px) {
  .sales52-page .pos51-layout { grid-template-columns: 1fr; }
  .sales52-page .pos51-panel { min-height: auto; }
  .sales52-page .kpi-grid { gap: 10px; }
}

/* Sprint 5.3 — conventional stock card ----------------------------------- */
.stock53-card {
  padding: 0;
  overflow: visible;
}

.stock53-header {
  display: grid;
  grid-template-columns: minmax(260px, .8fr) minmax(0, 1.2fr);
  gap: 20px;
  padding: 22px 24px 18px;
  border-bottom: 1px solid var(--border);
}

.stock53-header h2 {
  margin: 5px 0 4px;
  font-size: 24px;
}

.stock53-header p {
  margin: 0;
  color: var(--text-muted);
}

.stock53-identity {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.stock53-identity > div {
  padding: 10px 12px;
  border-radius: 11px;
  background: var(--surface-soft);
}

.stock53-identity span,
.stock53-summary span {
  display: block;
  color: var(--text-muted);
  font-size: 11px;
}

.stock53-identity strong,
.stock53-summary strong {
  display: block;
  margin-top: 3px;
}

.stock53-filter {
  display: grid;
  grid-template-columns: repeat(4, minmax(140px, 1fr)) auto;
  gap: 10px;
  align-items: end;
  padding: 14px 24px;
  border-bottom: 1px solid var(--border);
}

.stock53-filter .form-group {
  margin: 0;
}

.stock53-summary {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  padding: 14px 24px;
  border-bottom: 1px solid var(--border);
}

.stock53-summary > div {
  padding: 12px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: color-mix(in srgb, var(--surface-soft) 92%, transparent);
}

.stock53-summary strong {
  font-size: 17px;
}

.stock53-table th,
.stock53-table td {
  vertical-align: top;
}

.stock53-table .text-end {
  text-align: right;
  white-space: nowrap;
}

.stock53-in {
  color: var(--success);
  font-weight: 700;
}

.stock53-out {
  color: var(--warning);
  font-weight: 700;
}

.stock53-detail-col {
  width: 72px;
}

.stock53-detail {
  position: relative;
}

.stock53-detail summary {
  cursor: pointer;
  color: var(--accent);
  font-size: 12px;
  font-weight: 700;
  list-style: none;
}

.stock53-detail summary::-webkit-details-marker {
  display: none;
}

.stock53-detail > div {
  position: absolute;
  z-index: 20;
  top: calc(100% + 8px);
  right: 0;
  width: 290px;
  padding: 14px;
  border: 1px solid var(--border);
  border-radius: 13px;
  background: var(--surface);
  box-shadow: 0 18px 50px rgb(0 0 0 / .26);
}

.stock53-detail dl {
  display: grid;
  grid-template-columns: 105px minmax(0, 1fr);
  gap: 7px 10px;
  margin: 0;
  font-size: 12px;
}

.stock53-detail dt {
  color: var(--text-muted);
}

.stock53-detail dd {
  margin: 0;
  overflow-wrap: anywhere;
}

.stock53-table tfoot th {
  background: var(--surface-soft);
}

.stock53-footer {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  padding: 13px 24px 18px;
  color: var(--text-muted);
  font-size: 11px;
}

@media (max-width: 1100px) {
  .stock53-header {
    grid-template-columns: 1fr;
  }

  .stock53-filter {
    grid-template-columns: repeat(2, minmax(160px, 1fr));
  }

  .stock53-filter .btn {
    width: 100%;
  }

  .stock53-identity,
  .stock53-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 650px) {
  .stock53-header,
  .stock53-filter,
  .stock53-summary {
    padding-left: 16px;
    padding-right: 16px;
  }

  .stock53-filter,
  .stock53-identity,
  .stock53-summary {
    grid-template-columns: 1fr;
  }

  .stock53-footer {
    flex-direction: column;
    padding-left: 16px;
    padding-right: 16px;
  }
}

@media print {
  .sidebar,
  .topbar,
  .page-header .page-actions,
  .stock53-filter,
  .stock53-detail,
  .flash,
  .overlay {
    display: none !important;
  }

  .main,
  .page {
    margin: 0 !important;
    padding: 0 !important;
  }

  .stock53-card {
    border: 0 !important;
    box-shadow: none !important;
  }

  .stock53-header {
    grid-template-columns: 1fr;
    padding: 0 0 10px;
  }

  .stock53-identity {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .stock53-summary {
    padding: 10px 0;
  }

  .stock53-table {
    font-size: 9px;
  }

  .stock53-table th,
  .stock53-table td {
    padding: 6px 5px !important;
  }

  .stock53-detail-col {
    display: none !important;
  }

  .stock53-footer {
    padding: 10px 0 0;
  }

  @page {
    size: A4 landscape;
    margin: 10mm;
  }
}

/* Sprint 6 — Prescription services --------------------------------------- */
.rx-summary-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  margin-bottom: 14px;
}

.rx-tabs {
  margin-bottom: 16px;
}

.rx-intake-card {
  padding: 24px;
}

.rx-form-section {
  padding: 20px 0;
  border-top: 1px solid var(--border);
}

.rx-form-section:first-of-type {
  border-top: 0;
  padding-top: 4px;
}

.rx-section-title {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 16px;
}

.rx-section-title > span {
  display: grid;
  width: 32px;
  height: 32px;
  place-items: center;
  border-radius: 50%;
  background: var(--accent);
  color: white;
  font-weight: 800;
}

.rx-section-title strong,
.rx-section-title small {
  display: block;
}

.rx-section-title small {
  color: var(--text-muted);
  margin-top: 2px;
}

.rx-item-list {
  display: grid;
  gap: 12px;
  margin-bottom: 12px;
}

.rx-item-row {
  padding: 16px;
  border: 1px solid var(--border);
  border-radius: 14px;
  background: var(--surface-soft);
}

.rx-item-row-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 12px;
}

.rx-product-picker {
  position: relative;
}

.rx-product-suggestions {
  position: absolute;
  z-index: 40;
  top: calc(100% + 6px);
  left: 0;
  right: 0;
  max-height: 300px;
  overflow: auto;
  padding: 6px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--surface);
  box-shadow: 0 18px 50px rgb(0 0 0 / .25);
}

.rx-product-option {
  width: 100%;
  display: flex;
  justify-content: space-between;
  gap: 16px;
  padding: 10px;
  border: 0;
  border-radius: 9px;
  background: transparent;
  color: var(--text);
  text-align: left;
  cursor: pointer;
}

.rx-product-option:hover {
  background: var(--surface-soft);
}

.rx-product-option span {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.rx-product-option span:last-child {
  align-items: flex-end;
}

.rx-product-option small,
.rx-product-empty {
  color: var(--text-muted);
  font-size: 11px;
}

.rx-product-empty {
  padding: 12px;
}

.rx-queue-table td {
  vertical-align: middle;
}

.rx-detail-hero,
.rx-preparation-hero {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  align-items: flex-start;
  padding: 22px 24px;
}

.rx-detail-hero h2,
.rx-preparation-hero h2 {
  margin: 5px 0 4px;
}

.rx-detail-hero p,
.rx-preparation-hero p {
  margin: 0;
  color: var(--text-muted);
}

.rx-detail-hero > div:last-child {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.rx-workflow {
  display: grid;
  grid-template-columns: repeat(6, minmax(110px, 1fr));
  gap: 8px;
  margin: 14px 0 16px;
}

.rx-workflow > div {
  position: relative;
  min-height: 70px;
  padding: 12px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--surface);
}

.rx-workflow span {
  display: grid;
  width: 25px;
  height: 25px;
  place-items: center;
  margin-bottom: 7px;
  border-radius: 50%;
  background: var(--surface-soft);
  color: var(--text-muted);
  font-size: 11px;
  font-weight: 800;
}

.rx-workflow strong {
  font-size: 12px;
}

.rx-workflow .is-current {
  border-color: var(--accent);
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--accent) 14%, transparent);
}

.rx-workflow .is-current span,
.rx-workflow .is-done span {
  background: var(--accent);
  color: white;
}

.rx-workflow .is-done {
  background: color-mix(in srgb, var(--accent) 7%, var(--surface));
}

.rx-detail-grid,
.rx-bottom-grid,
.rx-payment-layout {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.detail-list {
  display: grid;
  grid-template-columns: 130px minmax(0, 1fr);
  gap: 9px 14px;
  margin: 16px 0 0;
}

.detail-list dt {
  color: var(--text-muted);
}

.detail-list dd {
  margin: 0;
  overflow-wrap: anywhere;
}

.rx-action-card {
  margin-top: 16px;
  padding: 22px 24px;
  border-color: color-mix(in srgb, var(--accent) 45%, var(--border));
}

.rx-action-head {
  margin-bottom: 18px;
}

.rx-action-head > span {
  color: var(--accent);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.rx-action-head h3 {
  margin: 5px 0;
}

.rx-action-head p {
  margin: 0;
  color: var(--text-muted);
}

.rx-check-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.check-card {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  padding: 13px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--surface-soft);
  cursor: pointer;
}

.check-card.compact {
  align-self: end;
}

.check-card input {
  margin-top: 3px;
}

.check-card strong,
.check-card small {
  display: block;
}

.check-card small {
  margin-top: 3px;
  color: var(--text-muted);
}

.rx-prepare-row {
  padding: 16px;
  border: 1px solid var(--border);
  border-radius: 14px;
  background: var(--surface-soft);
}

.rx-prepare-row > div:first-child {
  margin-bottom: 12px;
}

.rx-prepare-row > div:first-child strong,
.rx-prepare-row > div:first-child span {
  display: block;
}

.rx-prepare-row > div:first-child span {
  margin-top: 4px;
  color: var(--text-muted);
}

.rx-topic-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.rx-topic-grid label {
  padding: 10px;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--surface-soft);
}

.rx-bottom-grid {
  margin-top: 16px;
}

.rx-event-list {
  display: grid;
  gap: 0;
  margin-top: 12px;
}

.rx-event-list > div {
  position: relative;
  display: grid;
  grid-template-columns: 120px minmax(140px, .5fr) minmax(0, 1fr);
  gap: 12px;
  padding: 11px 0;
  border-bottom: 1px solid var(--border);
}

.rx-event-list > div:last-child {
  border-bottom: 0;
}

.rx-event-list span,
.rx-event-list small {
  color: var(--text-muted);
}

.hash-text {
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 11px;
  overflow-wrap: anywhere;
}

.danger-disclosure {
  margin-top: 18px;
  padding-top: 14px;
  border-top: 1px solid var(--border);
}

.danger-disclosure summary {
  color: var(--danger);
  font-weight: 700;
  cursor: pointer;
}

.danger-disclosure form {
  margin-top: 12px;
}

.rx-payment-layout {
  grid-template-columns: minmax(0, 1.3fr) minmax(320px, .7fr);
  align-items: start;
}

.rx-payment-total {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  margin-top: 16px;
  padding: 16px;
  border-radius: 13px;
  background: color-mix(in srgb, var(--accent) 10%, var(--surface-soft));
}

.rx-payment-total strong {
  font-size: 24px;
}

.rx-cash-shortcuts {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

@media (max-width: 1100px) {
  .rx-summary-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .rx-workflow {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .rx-topic-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 820px) {
  .rx-detail-grid,
  .rx-bottom-grid,
  .rx-payment-layout {
    grid-template-columns: 1fr;
  }

  .rx-check-grid {
    grid-template-columns: 1fr;
  }

  .rx-event-list > div {
    grid-template-columns: 1fr;
    gap: 3px;
  }
}

@media (max-width: 620px) {
  .rx-summary-grid,
  .rx-workflow,
  .rx-topic-grid {
    grid-template-columns: 1fr;
  }

  .rx-detail-hero,
  .rx-preparation-hero {
    flex-direction: column;
  }

  .rx-intake-card,
  .rx-action-card {
    padding: 16px;
  }
}

/* Sprint 6.1 — compact prescription workspace ---------------------------- */
.rx61-filter-bar {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 14px;
}

.rx61-filter {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 9px 13px;
  border: 1px solid var(--border);
  border-radius: 999px;
  background: var(--surface);
  color: var(--text-muted);
  font-size: 12px;
  font-weight: 700;
  text-decoration: none;
}

.rx61-filter span {
  display: grid;
  min-width: 22px;
  height: 22px;
  place-items: center;
  border-radius: 999px;
  background: var(--surface-soft);
  color: var(--text);
  font-size: 11px;
}

.rx61-filter.active {
  border-color: var(--accent);
  background: color-mix(in srgb, var(--accent) 10%, var(--surface));
  color: var(--accent);
}

.rx61-queue {
  display: grid;
  gap: 10px;
}

.rx61-queue-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 16px;
  align-items: center;
  padding: 14px 16px;
}

.rx61-queue-main {
  display: grid;
  grid-template-columns: 110px minmax(220px, 1fr) minmax(150px, auto);
  gap: 16px;
  align-items: center;
}

.rx61-queue-number strong,
.rx61-queue-number span,
.rx61-queue-status small {
  display: block;
}

.rx61-queue-number span,
.rx61-queue-status small,
.rx61-queue-copy p {
  color: var(--text-muted);
  font-size: 12px;
}

.rx61-queue-copy h3,
.rx61-queue-copy p {
  margin: 0;
}

.rx61-queue-copy p {
  margin-top: 4px;
}

.rx61-queue-status {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
}

.rx61-intake {
  padding: 22px 24px;
}

.rx61-intake-grid {
  display: grid;
  grid-template-columns: minmax(260px, .7fr) minmax(0, 1.3fr);
  gap: 18px;
}

.rx61-upload-panel {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.rx61-upload-box {
  display: grid;
  min-height: 210px;
  place-items: center;
  align-content: center;
  gap: 8px;
  padding: 24px;
  border: 1px dashed var(--border);
  border-radius: 16px;
  background: var(--surface-soft);
  text-align: center;
  cursor: pointer;
}

.rx61-upload-box svg {
  width: 34px;
  height: 34px;
  color: var(--accent);
}

.rx61-upload-box span,
.rx61-file-name {
  color: var(--text-muted);
  font-size: 12px;
}

.rx61-upload-box input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
}

.rx61-core-fields {
  padding: 16px;
  border: 1px solid var(--border);
  border-radius: 16px;
}

.rx61-disclosure {
  margin-top: 14px;
  border: 1px solid var(--border);
  border-radius: 14px;
  background: var(--surface);
}

.rx61-disclosure summary,
.rx61-meta-disclosure summary,
.rx61-history summary {
  padding: 13px 15px;
  color: var(--accent);
  font-weight: 700;
  cursor: pointer;
}

.rx61-disclosure-body,
.rx61-history-body {
  padding: 0 15px 15px;
}

.rx61-items-section {
  margin-top: 18px;
  padding-top: 18px;
  border-top: 1px solid var(--border);
}

.rx61-section-head {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: flex-start;
  margin-bottom: 12px;
}

.rx61-section-head h3,
.rx61-section-head p {
  margin: 0;
}

.rx61-section-head p {
  margin-top: 4px;
  color: var(--text-muted);
}

.rx61-item-list {
  display: grid;
  gap: 12px;
}

.rx61-item-card {
  padding: 15px;
  border: 1px solid var(--border);
  border-radius: 14px;
  background: var(--surface-soft);
  transition: background-color .18s ease, border-color .18s ease, box-shadow .18s ease;
}

.rx61-item-card[data-item-type="finished"] {
  background: color-mix(in srgb, var(--accent) 4%, var(--surface-soft));
}

.rx61-item-card[data-item-type="compound"] {
  background: color-mix(in srgb, var(--warning) 5%, var(--surface-soft));
}

.rx61-item-card[data-item-type="finished"]:focus-within {
  background: color-mix(in srgb, var(--accent) 10%, var(--surface-soft));
  border-color: color-mix(in srgb, var(--accent) 58%, var(--border));
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--accent) 35%, transparent);
}

.rx61-item-card[data-item-type="compound"]:focus-within {
  background: color-mix(in srgb, var(--warning) 12%, var(--surface-soft));
  border-color: color-mix(in srgb, var(--warning) 60%, var(--border));
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--warning) 35%, transparent);
}

.rx61-item-card:focus-within > header strong {
  color: var(--text);
}

.rx61-item-card:focus-within .badge-info {
  background: color-mix(in srgb, var(--accent) 18%, var(--surface));
  color: var(--accent);
}

.rx61-item-card:focus-within .badge-warning {
  background: color-mix(in srgb, var(--warning) 18%, var(--surface));
  color: var(--warning);
}

.rx61-item-card > header {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
  margin-bottom: 12px;
}

.rx61-item-card > header > div {
  display: flex;
  align-items: center;
  gap: 9px;
}

.rx61-product-picker {
  position: relative;
}

.rx61-suggestions {
  position: absolute;
  z-index: 60;
  top: calc(100% + 6px);
  left: 0;
  right: 0;
  max-height: 310px;
  overflow: auto;
  padding: 6px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--surface);
  box-shadow: 0 20px 55px rgb(0 0 0 / .25);
}

.rx61-suggestions[hidden] {
  display: none !important;
}

.rx61-suggestion-option {
  width: 100%;
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 10px;
  border: 0;
  border-radius: 9px;
  background: transparent;
  color: var(--text);
  text-align: left;
  cursor: pointer;
}

.rx61-suggestion-option:hover,
.rx61-suggestion-option.is-active {
  background: var(--surface-soft);
}

.rx61-suggestion-option span {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.rx61-suggestion-option span:last-child {
  align-items: flex-end;
}

.rx61-suggestion-option small,
.rx61-suggestion-empty {
  color: var(--text-muted);
  font-size: 11px;
}

.rx61-suggestion-empty {
  padding: 11px;
}

.rx61-component-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin: 12px 0 8px;
}

.rx61-component-list {
  display: grid;
  gap: 8px;
  margin-bottom: 12px;
}

.rx61-component-row {
  display: grid;
  grid-template-columns: minmax(220px, 1.4fr) minmax(150px, .6fr) minmax(170px, .8fr) 40px;
  gap: 9px;
  align-items: end;
  padding: 10px;
  border: 1px solid var(--border);
  border-radius: 11px;
  background: var(--surface);
}

.rx61-workspace-head,
.rx61-prep-head {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  align-items: flex-start;
  padding: 18px 20px;
  margin-bottom: 14px;
}

.rx61-workspace-head h2,
.rx61-prep-head h2 {
  margin: 4px 0;
}

.rx61-workspace-head p,
.rx61-prep-head p {
  margin: 0;
  color: var(--text-muted);
}

.rx61-workspace-head > div:last-child {
  display: flex;
  gap: 7px;
  flex-wrap: wrap;
}

.rx61-workspace {
  display: grid;
  grid-template-columns: minmax(300px, .75fr) minmax(0, 1.25fr);
  gap: 14px;
  align-items: start;
}

.rx61-document-panel {
  position: sticky;
  top: 74px;
}

.rx61-document-view {
  min-height: 510px;
  overflow: hidden;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--surface-soft);
}

.rx61-document-view img,
.rx61-document-view iframe {
  display: block;
  width: 100%;
  min-height: 510px;
  border: 0;
  object-fit: contain;
}

.rx61-meta-disclosure {
  margin-top: 12px;
  border-top: 1px solid var(--border);
}

.rx61-work-main {
  display: grid;
  gap: 14px;
}

.rx61-work-items {
  display: grid;
  gap: 10px;
}

.rx61-work-item {
  padding: 13px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--surface-soft);
}

.rx61-work-item > header {
  display: flex;
  justify-content: space-between;
  gap: 12px;
}

.rx61-work-item h4 {
  margin: 6px 0 0;
}

.rx61-direction {
  margin: 8px 0;
}

.rx61-item-meta,
.rx61-fefo-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.rx61-item-meta span,
.rx61-fefo-chips span {
  padding: 5px 8px;
  border-radius: 999px;
  background: var(--surface);
  color: var(--text-muted);
  font-size: 11px;
}

.rx61-compound-components {
  display: grid;
  gap: 6px;
  margin: 9px 0;
}

.rx61-compound-components > div {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 8px 9px;
  border-radius: 8px;
  background: var(--surface);
}

.rx61-prepared-note {
  margin-top: 9px;
  padding: 9px;
  border-radius: 9px;
  background: color-mix(in srgb, var(--accent) 8%, var(--surface));
  font-size: 12px;
}

.rx61-primary-action {
  padding: 20px;
  border-color: color-mix(in srgb, var(--accent) 48%, var(--border));
}

.rx61-action-heading {
  margin-bottom: 15px;
}

.rx61-action-heading > span {
  color: var(--accent);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.rx61-action-heading h3,
.rx61-action-heading p {
  margin: 4px 0 0;
}

.rx61-action-heading p {
  color: var(--text-muted);
}

.rx61-review-checks,
.rx61-final-checks {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.rx61-review-checks label,
.rx61-final-checks label,
.rx61-topic-grid label {
  display: flex;
  gap: 9px;
  align-items: flex-start;
  padding: 11px;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--surface-soft);
}

.rx61-review-checks strong,
.rx61-review-checks small {
  display: block;
}

.rx61-review-checks small {
  margin-top: 3px;
  color: var(--text-muted);
}

.rx61-problem-choice {
  display: flex;
  gap: 14px;
  align-items: center;
  margin: 14px 0;
}

.rx61-problem-panel {
  padding: 14px;
  border: 1px solid var(--warning);
  border-radius: 12px;
  background: color-mix(in srgb, var(--warning) 7%, var(--surface));
}

.rx61-problem-panel[hidden],
.rx61-discrepancy[hidden],
[data-rx61-confirm-return][hidden],
[data-rx61-cash-group][hidden],
[data-rx61-reference-group][hidden],
[data-rx61-change-box][hidden],
[data-rx61-cash-shortcuts][hidden] {
  display: none !important;
}

.rx61-discrepancy {
  margin-top: 12px;
}

.rx61-topic-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 7px;
}

.rx61-complete {
  display: flex;
  gap: 14px;
  align-items: flex-start;
  padding: 20px;
}

.rx61-complete > svg {
  width: 34px;
  height: 34px;
  color: var(--success);
}

.rx61-complete h3,
.rx61-complete p {
  margin: 0;
}

.rx61-complete p {
  margin: 5px 0;
  color: var(--text-muted);
}

.rx61-history {
  padding: 0;
}

.rx61-event-list {
  display: grid;
  gap: 0;
}

.rx61-event-list > div {
  display: grid;
  grid-template-columns: 120px minmax(150px, .5fr) minmax(0, 1fr);
  gap: 12px;
  padding: 9px 0;
  border-bottom: 1px solid var(--border);
}

.rx61-event-list span,
.rx61-event-list small {
  color: var(--text-muted);
}

.rx61-picking-list {
  display: grid;
  gap: 12px;
  padding-bottom: 90px;
}

.rx61-picking-card {
  padding: 17px;
}

.rx61-picking-card > header {
  display: flex;
  justify-content: space-between;
  gap: 15px;
  margin-bottom: 12px;
}

.rx61-picking-card h3,
.rx61-picking-card p {
  margin: 5px 0 0;
}

.rx61-picking-card p {
  color: var(--text-muted);
}

.rx61-fefo-box,
.rx61-compound-picking {
  margin-bottom: 12px;
  padding: 12px;
  border: 1px solid var(--border);
  border-radius: 11px;
  background: var(--surface-soft);
}

.rx61-fefo-box > span {
  display: block;
  margin-bottom: 7px;
  color: var(--text-muted);
  font-size: 11px;
}

.rx61-fefo-chips .is-alert {
  color: var(--danger);
}

.rx61-compound-picking h4 {
  margin: 0 0 8px;
}

.rx61-component-pick {
  display: grid;
  grid-template-columns: minmax(190px, 1fr) minmax(220px, 1.2fr) minmax(150px, .6fr);
  gap: 12px;
  align-items: end;
  padding: 9px 0;
  border-top: 1px solid var(--border);
}

.rx61-component-pick:first-of-type {
  border-top: 0;
}

.rx61-component-pick strong,
.rx61-component-pick span {
  display: block;
}

.rx61-component-pick span {
  color: var(--text-muted);
  font-size: 12px;
}

.rx61-sticky-action {
  position: sticky;
  bottom: 12px;
  z-index: 20;
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: center;
  padding: 13px 15px;
  border: 1px solid var(--border);
  border-radius: 14px;
  background: color-mix(in srgb, var(--surface) 94%, transparent);
  box-shadow: 0 16px 45px rgb(0 0 0 / .18);
  backdrop-filter: blur(10px);
}

.rx61-sticky-action strong,
.rx61-sticky-action span {
  display: block;
}

.rx61-sticky-action span {
  color: var(--text-muted);
  font-size: 12px;
}

.rx61-payment-shell {
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) minmax(320px, .7fr);
  gap: 14px;
  align-items: start;
}

.rx61-payment-summary,
.rx61-payment-box {
  padding: 20px;
}

.rx61-payment-summary h2 {
  margin: 5px 0;
}

.rx61-payment-summary > p {
  color: var(--text-muted);
}

.rx61-payment-total {
  display: flex;
  justify-content: space-between;
  gap: 15px;
  margin-top: 14px;
  padding: 15px;
  border-radius: 12px;
  background: color-mix(in srgb, var(--accent) 10%, var(--surface-soft));
}

.rx61-payment-total strong {
  font-size: 23px;
}

.rx61-payment-methods {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px;
}

.rx61-payment-methods label {
  position: relative;
}

.rx61-payment-methods input {
  position: absolute;
  opacity: 0;
}

.rx61-payment-methods span {
  display: grid;
  min-height: 52px;
  place-items: center;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--surface-soft);
  cursor: pointer;
  font-weight: 700;
}

.rx61-payment-methods input:checked + span {
  border-color: var(--accent);
  background: color-mix(in srgb, var(--accent) 10%, var(--surface));
  color: var(--accent);
}

.rx61-cash-shortcuts {
  display: flex;
  gap: 7px;
  flex-wrap: wrap;
}

.sale-charge-row {
  background: color-mix(in srgb, var(--accent) 5%, var(--surface));
}

@media (max-width: 1100px) {
  .rx61-workspace,
  .rx61-payment-shell {
    grid-template-columns: 1fr;
  }

  .rx61-document-panel {
    position: static;
  }

  .rx61-document-view,
  .rx61-document-view img,
  .rx61-document-view iframe {
    min-height: 420px;
  }

  .rx61-review-checks,
  .rx61-final-checks {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .rx61-topic-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .rx61-component-row,
  .rx61-component-pick {
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width: 760px) {
  .rx61-intake-grid,
  .rx61-queue-main {
    grid-template-columns: 1fr;
  }

  .rx61-queue-card {
    grid-template-columns: 1fr;
  }

  .rx61-queue-action .btn {
    width: 100%;
  }

  .rx61-section-head,
  .rx61-sticky-action {
    flex-direction: column;
    align-items: stretch;
  }

  .rx61-review-checks,
  .rx61-final-checks,
  .rx61-topic-grid,
  .rx61-component-row,
  .rx61-component-pick {
    grid-template-columns: 1fr;
  }

  .rx61-event-list > div {
    grid-template-columns: 1fr;
    gap: 3px;
  }
}

/* Sprint 6.2 — users, roles, profession, branch access -------------------- */
.user62-summary {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  margin-bottom: 14px;
}

.user62-credentials {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(320px, .8fr);
  gap: 20px;
  align-items: center;
  margin-bottom: 14px;
  border-color: color-mix(in srgb, var(--warning) 55%, var(--border));
  background: color-mix(in srgb, var(--warning) 7%, var(--surface));
}

.user62-credentials h3,
.user62-credentials p {
  margin: 4px 0;
}

.user62-credentials p {
  color: var(--text-muted);
}

.user62-credentials dl {
  display: grid;
  grid-template-columns: 90px minmax(0, 1fr);
  gap: 8px 12px;
  margin: 0;
}

.user62-credentials dt {
  color: var(--text-muted);
}

.user62-credentials dd {
  margin: 0;
}

.user62-credentials code {
  display: inline-block;
  padding: 8px 10px;
  margin-right: 6px;
  border-radius: 8px;
  background: var(--surface);
  color: var(--text);
  font-size: 15px;
  font-weight: 800;
  letter-spacing: .04em;
}

.user62-filter-card {
  margin-bottom: 14px;
  padding: 12px;
}

.user62-filter-form {
  display: grid;
  grid-template-columns: minmax(260px, 1fr) 180px 220px auto;
  gap: 9px;
  align-items: center;
}

.user62-table td {
  vertical-align: middle;
}

.user62-role-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  max-width: 330px;
}

.user62-row-menu {
  position: relative;
}

.user62-row-menu > summary {
  display: grid;
  width: 38px;
  height: 38px;
  place-items: center;
  border: 1px solid var(--border);
  border-radius: 10px;
  cursor: pointer;
  list-style: none;
  font-size: 20px;
}

.user62-row-menu > summary::-webkit-details-marker {
  display: none;
}

.user62-row-menu > div {
  position: absolute;
  z-index: 70;
  top: calc(100% + 6px);
  right: 0;
  width: 280px;
  padding: 8px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--surface);
  box-shadow: 0 18px 50px rgb(0 0 0 / .25);
  text-align: left;
}

.user62-row-menu > div > a,
.user62-row-menu > div > details > summary {
  display: block;
  padding: 9px 10px;
  border-radius: 8px;
  color: var(--text);
  text-decoration: none;
  cursor: pointer;
  font-weight: 700;
}

.user62-row-menu > div > a:hover,
.user62-row-menu > div > details > summary:hover {
  background: var(--surface-soft);
}

.user62-row-menu details form {
  display: grid;
  gap: 7px;
  padding: 8px;
}

.user62-form {
  padding-bottom: 90px;
}

.user62-form-section {
  padding: 20px 22px;
}

.user62-section-title {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  margin-bottom: 16px;
}

.user62-section-title > span {
  display: grid;
  flex: 0 0 32px;
  width: 32px;
  height: 32px;
  place-items: center;
  border-radius: 50%;
  background: var(--accent);
  color: white;
  font-weight: 800;
}

.user62-section-title h3,
.user62-section-title p {
  margin: 0;
}

.user62-section-title p {
  margin-top: 3px;
  color: var(--text-muted);
}

.user62-role-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 9px;
}

.user62-role-card {
  position: relative;
}

.user62-role-card input {
  position: absolute;
  opacity: 0;
}

.user62-role-card > span {
  display: block;
  min-height: 100px;
  padding: 14px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--surface-soft);
  cursor: pointer;
}

.user62-role-card strong,
.user62-role-card small {
  display: block;
}

.user62-role-card small {
  margin-top: 5px;
  color: var(--text-muted);
}

.user62-role-card input:checked + span {
  border-color: var(--accent);
  background: color-mix(in srgb, var(--accent) 9%, var(--surface));
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--accent) 12%, transparent);
}

.user62-role-warning {
  margin-top: 12px;
}

.user62-access-choice {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px;
  margin-bottom: 12px;
}

.user62-access-choice label {
  position: relative;
}

.user62-access-choice input {
  position: absolute;
  opacity: 0;
}

.user62-access-choice span {
  display: block;
  padding: 14px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--surface-soft);
  cursor: pointer;
}

.user62-access-choice strong,
.user62-access-choice small {
  display: block;
}

.user62-access-choice small {
  margin-top: 4px;
  color: var(--text-muted);
}

.user62-access-choice input:checked + span {
  border-color: var(--accent);
  background: color-mix(in srgb, var(--accent) 9%, var(--surface));
}

.user62-branch-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.user62-branch-grid[hidden],
[data-user62-professional-panel][hidden],
[data-user62-apj-panel][hidden],
[data-user62-apj-fields][hidden] {
  display: none !important;
}

.user62-branch-grid label {
  position: relative;
}

.user62-branch-grid input {
  position: absolute;
  opacity: 0;
}

.user62-branch-grid span {
  display: block;
  padding: 12px;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--surface-soft);
  cursor: pointer;
}

.user62-branch-grid strong,
.user62-branch-grid small {
  display: block;
}

.user62-branch-grid small {
  color: var(--text-muted);
}

.user62-branch-grid input:checked + span {
  border-color: var(--accent);
  background: color-mix(in srgb, var(--accent) 9%, var(--surface));
}

.user62-info-box {
  display: flex;
  gap: 11px;
  align-items: flex-start;
  padding: 12px;
  border: 1px solid var(--border);
  border-radius: 11px;
  background: var(--surface-soft);
}

.user62-info-box svg {
  flex: 0 0 22px;
  width: 22px;
  height: 22px;
  color: var(--accent);
}

.user62-info-box strong,
.user62-info-box span {
  display: block;
}

.user62-info-box span {
  margin-top: 3px;
  color: var(--text-muted);
  font-size: 12px;
}

.user62-apj-panel {
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid var(--border);
}

.user62-sticky-save {
  position: sticky;
  bottom: 12px;
  z-index: 30;
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: center;
  padding: 13px 15px;
  border: 1px solid var(--border);
  border-radius: 14px;
  background: color-mix(in srgb, var(--surface) 94%, transparent);
  box-shadow: 0 16px 45px rgb(0 0 0 / .18);
  backdrop-filter: blur(10px);
}

.user62-sticky-save strong,
.user62-sticky-save span {
  display: block;
}

.user62-sticky-save span {
  margin-top: 2px;
  color: var(--text-muted);
  font-size: 12px;
}

.branch-switch-form {
  display: grid;
  gap: 5px;
  margin-bottom: 8px;
}

.branch-switch-form label {
  color: var(--text-muted);
  font-size: 11px;
}

.branch-switch-form .input {
  min-height: 36px;
  padding: 7px 9px;
  font-size: 12px;
}

.user-menu {
  color: inherit;
  text-decoration: none;
}

.user62-password-shell {
  width: min(100% - 28px, 520px);
  margin-inline: auto;
}

.user62-logout-form {
  margin-top: 10px;
}

@media (max-width: 1100px) {
  .user62-summary,
  .user62-role-grid,
  .user62-branch-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .user62-filter-form {
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width: 720px) {
  .user62-summary,
  .user62-role-grid,
  .user62-branch-grid,
  .user62-access-choice,
  .user62-filter-form,
  .user62-credentials {
    grid-template-columns: 1fr;
  }

  .user62-sticky-save {
    flex-direction: column;
    align-items: stretch;
  }
}


.user62-professional-branches {
  margin-top: 14px;
}

/* Physical-only prescription documentation hotfix ----------------------- */
.rx61-intake-grid--physical {
  grid-template-columns: 1fr;
}

.rx61-core-fields--full {
  width: 100%;
}

.rx61-physical-intake-note,
.rx61-physical-document {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  padding: 13px 14px;
  border: 1px solid color-mix(in srgb, var(--accent) 34%, var(--border));
  border-radius: 12px;
  background: color-mix(in srgb, var(--accent) 7%, var(--surface-soft));
}

.rx61-physical-intake-note {
  margin-bottom: 14px;
}

.rx61-physical-intake-note svg,
.rx61-physical-document svg {
  flex: 0 0 25px;
  width: 25px;
  height: 25px;
  color: var(--accent);
}

.rx61-physical-intake-note strong,
.rx61-physical-intake-note span,
.rx61-physical-document strong,
.rx61-physical-document span,
.rx61-physical-document small {
  display: block;
}

.rx61-physical-intake-note span,
.rx61-physical-document span,
.rx61-physical-document small {
  margin-top: 3px;
  color: var(--text-muted);
  font-size: 12px;
}

.rx61-physical-document-panel {
  position: sticky;
  top: 74px;
}

.rx61-legacy-file-note {
  margin-top: 12px;
}

.rx61-legacy-file-note a {
  font-weight: 700;
}

/* Sprint 6.3 — product packaging and unit conversion --------------------- */
.unit63-master-layout {
  grid-template-columns: minmax(470px, .95fr) minmax(620px, 1.35fr);
}

.unit63-initial-units {
  padding: 14px;
  border: 1px solid var(--border);
  border-radius: 13px;
  background: var(--surface-soft);
}

.unit63-section-heading {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: flex-start;
  margin-bottom: 13px;
}

.unit63-section-heading h3,
.unit63-section-heading h4,
.unit63-section-heading p {
  margin: 0;
}

.unit63-section-heading p {
  margin-top: 4px;
  color: var(--text-muted);
}

.unit63-product-head {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  align-items: flex-start;
  margin-bottom: 14px;
}

.unit63-product-head h2,
.unit63-product-head p {
  margin: 4px 0 0;
}

.unit63-product-head p {
  color: var(--text-muted);
}

.unit63-status-stack {
  display: flex;
  gap: 7px;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.unit63-principle-card {
  display: flex;
  gap: 13px;
  align-items: flex-start;
  border-color: color-mix(in srgb, var(--accent) 38%, var(--border));
  background: color-mix(in srgb, var(--accent) 5%, var(--surface));
}

.unit63-principle-card > div:first-child {
  display: grid;
  width: 38px;
  height: 38px;
  flex: 0 0 38px;
  place-items: center;
  border-radius: 10px;
  background: color-mix(in srgb, var(--accent) 13%, var(--surface));
  color: var(--accent);
}

.unit63-principle-card h3,
.unit63-principle-card p {
  margin: 0;
}

.unit63-principle-card p {
  margin-top: 4px;
  color: var(--text-muted);
}

.unit63-base-field {
  max-width: 440px;
}

.unit63-package-list {
  display: grid;
  gap: 11px;
}

.unit63-package-card {
  padding: 14px;
  border: 1px solid var(--border);
  border-radius: 13px;
  background: var(--surface-soft);
}

.unit63-package-card:focus-within {
  border-color: color-mix(in srgb, var(--accent) 52%, var(--border));
  background: color-mix(in srgb, var(--accent) 6%, var(--surface-soft));
}

.unit63-package-card > header {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
  margin-bottom: 11px;
}

.unit63-purpose-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin: 10px 0;
}

.unit63-purpose-grid section {
  display: grid;
  gap: 5px;
  padding: 8px;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--surface);
}

.unit63-default-choice {
  display: flex;
  gap: 7px;
  align-items: center;
  padding: 4px 7px;
  color: var(--text-muted);
  font-size: 12px;
}

.unit63-sticky-save {
  position: sticky;
  z-index: 30;
  bottom: 12px;
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: center;
  padding: 13px 15px;
  border: 1px solid var(--border);
  border-radius: 14px;
  background: color-mix(in srgb, var(--surface) 94%, transparent);
  box-shadow: 0 16px 45px rgb(0 0 0 / .18);
  backdrop-filter: blur(10px);
}

.unit63-sticky-save strong,
.unit63-sticky-save span {
  display: block;
}

.unit63-sticky-save span {
  margin-top: 2px;
  color: var(--text-muted);
  font-size: 12px;
}

.unit63-history {
  margin-top: 14px;
}

.unit63-history summary {
  padding: 14px 16px;
  color: var(--accent);
  font-weight: 800;
  cursor: pointer;
}

.unit63-history-list {
  display: grid;
  padding: 0 16px 16px;
}

.unit63-history-list > div {
  display: grid;
  grid-template-columns: 90px minmax(180px, .6fr) minmax(0, 1fr);
  gap: 12px;
  padding: 9px 0;
  border-top: 1px solid var(--border);
}

.unit63-history-list span,
.unit63-history-list small {
  color: var(--text-muted);
}

.unit63-migration-hero {
  margin-bottom: 14px;
  border-color: color-mix(in srgb, var(--danger) 48%, var(--border));
  background: color-mix(in srgb, var(--danger) 5%, var(--surface));
}

.unit63-migration-hero h2,
.unit63-migration-hero p {
  margin: 4px 0 0;
}

.unit63-migration-hero p {
  color: var(--text-muted);
}

.unit63-migration-grid {
  display: grid;
  grid-template-columns: minmax(340px, .8fr) minmax(0, 1.2fr);
  gap: 14px;
  margin-bottom: 14px;
}

.unit63-impact-card {
  margin-bottom: 14px;
}

.unit63-bucket-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
}

.unit63-bucket-chips span {
  padding: 4px 7px;
  border-radius: 999px;
  background: var(--surface-soft);
  color: var(--text-muted);
  font-size: 11px;
}

@media (max-width: 1180px) {
  .unit63-master-layout,
  .unit63-migration-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 760px) {
  .unit63-product-head,
  .unit63-section-heading,
  .unit63-sticky-save {
    flex-direction: column;
    align-items: stretch;
  }

  .unit63-purpose-grid {
    grid-template-columns: 1fr;
  }

  .unit63-history-list > div {
    grid-template-columns: 1fr;
    gap: 3px;
  }
}


.unit63-quantity-input {
  position: relative;
}

.unit63-quantity-input .input {
  padding-right: 86px;
}

.unit63-quantity-input > span {
  position: absolute;
  top: 50%;
  right: 12px;
  transform: translateY(-50%);
  color: var(--text-muted);
  font-size: 12px;
  font-weight: 700;
  pointer-events: none;
}

/* Sprint 6.3.1 — live-transaction stocktake ------------------------------ */
.live-count-info {
  margin: 12px 0;
  border-color: color-mix(in srgb, var(--accent) 35%, var(--border));
  background: color-mix(in srgb, var(--accent) 5%, var(--surface));
}

.live-count-info span {
  display: grid;
  gap: 2px;
}

.live-count-list {
  display: grid;
  gap: 10px;
}

.live-count-row {
  grid-template-columns: minmax(250px, 1.5fr) 110px 145px auto;
  margin: 0;
  transition:
    border-color .18s ease,
    background-color .18s ease,
    box-shadow .18s ease;
}

.live-count-row.is-saved {
  border-color: color-mix(
    in srgb,
    var(--success) 52%,
    var(--border)
  );
  background: color-mix(
    in srgb,
    var(--success) 5%,
    var(--surface-soft)
  );
}

.live-count-row.has-error {
  border-color: color-mix(
    in srgb,
    var(--danger) 65%,
    var(--border)
  );
  background: color-mix(
    in srgb,
    var(--danger) 5%,
    var(--surface-soft)
  );
}

.live-count-row:focus-within {
  border-color: color-mix(
    in srgb,
    var(--accent) 60%,
    var(--border)
  );
  box-shadow: 0 0 0 2px color-mix(
    in srgb,
    var(--accent) 12%,
    transparent
  );
}

.live-count-actions {
  display: grid;
  gap: 7px;
  align-self: end;
}

.live-count-complete {
  display: flex;
  justify-content: space-between;
  gap: 14px;
  align-items: center;
  margin-top: 14px;
  padding: 13px 14px;
  border: 1px solid var(--border);
  border-radius: 13px;
  background: var(--surface-soft);
}

.live-count-complete strong,
.live-count-complete span {
  display: block;
}

.live-count-complete span {
  margin-top: 3px;
  color: var(--text-muted);
  font-size: 12px;
}

.review-row-actions {
  display: flex;
  align-items: center;
}

.approved-count-lines {
  display: grid;
  gap: 7px;
  margin: 12px 0;
}

.approved-count-lines > div {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
  padding: 9px 11px;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--surface-soft);
}

.approved-count-lines form {
  flex: 0 0 auto;
}

@media (max-width: 1100px) {
  .live-count-row {
    grid-template-columns: 1fr 110px 145px;
  }

  .live-count-actions {
    grid-column: 1 / -1;
    grid-template-columns: auto auto;
    justify-content: start;
  }
}

@media (max-width: 760px) {
  .live-count-row,
  .live-count-complete,
  .approved-count-lines > div {
    display: grid;
    grid-template-columns: 1fr;
  }

  .live-count-actions {
    grid-template-columns: 1fr;
  }
}


/* Sprint 6.3.2 — book-at-count reconciliation and cancellation ---------- */
.live-book-stock {
  min-width: 140px;
}

.live-book-stock small {
  display: block;
  margin-top: 4px;
  color: var(--text-muted);
  font-size: 11px;
  line-height: 1.35;
}

.count-cancel-panel {
  margin-top: 13px;
  border: 1px solid color-mix(
    in srgb,
    var(--danger) 32%,
    var(--border)
  );
  border-radius: 12px;
  background: color-mix(
    in srgb,
    var(--danger) 3%,
    var(--surface)
  );
}

.count-cancel-panel summary {
  padding: 11px 13px;
  color: var(--danger);
  font-weight: 800;
  cursor: pointer;
}

.count-cancel-panel form {
  padding: 0 13px 13px;
}

.count-cancelled-info {
  display: grid;
  gap: 3px;
  margin-top: 11px;
}

.count-cancelled-info strong,
.count-cancelled-info span,
.count-cancelled-info small {
  display: block;
}

.review-problem-row small strong {
  color: var(--text);
}

@media (max-width: 760px) {
  .live-book-stock {
    min-width: 0;
  }
}

/* Sprint 6.4 — simple transaction units and full-width purchase entry ----- */
.purchase-tabs {
  overflow-x: auto;
  scrollbar-width: thin;
}

.purchase-tabs .tab {
  flex: 0 0 auto;
  white-space: nowrap;
}

.purchase64-form-card {
  width: 100%;
  max-width: none;
}

.purchase64-form-head {
  align-items: flex-start;
}

.purchase64-header-grid {
  display: grid;
  grid-template-columns: minmax(280px, 1.5fr) minmax(170px, .6fr) minmax(170px, .6fr);
  gap: 12px;
  align-items: end;
}

.purchase64-notes {
  grid-column: 1 / -1;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--surface-2);
}

.purchase64-notes summary {
  padding: 10px 12px;
  color: var(--text-soft);
  font-weight: 750;
  cursor: pointer;
}

.purchase64-notes .form-group {
  padding: 0 12px 12px;
}

.purchase64-line-section {
  margin-top: 2px;
}

.purchase64-line-list {
  gap: 12px;
}

.purchase64-order-line {
  grid-template-columns:
    minmax(260px, 1.8fr)
    minmax(95px, .55fr)
    minmax(155px, .75fr)
    minmax(140px, .8fr)
    minmax(95px, .55fr)
    minmax(95px, .55fr)
    40px;
  padding: 14px;
}

.purchase64-order-line .field-help {
  min-height: 17px;
  line-height: 1.25;
}

.purchase64-form-footer {
  display: grid;
  grid-template-columns: minmax(260px, 1fr) auto;
  gap: 12px;
  align-items: center;
}

.purchase64-po-list .card-head > .button-row {
  align-items: center;
  flex-wrap: wrap;
}

.purchase64-po-list .table-wrap {
  margin-top: 4px;
}

.unit64-initial-units {
  display: grid;
  gap: 13px;
}

.unit64-unit-cards {
  display: grid;
  gap: 10px;
}

.unit64-unit-card {
  padding: 13px;
  border: 1px solid var(--border);
  border-radius: 13px;
  background: var(--surface-2);
}

.unit64-unit-card-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 10px;
}

.unit64-unit-card-head strong {
  font-size: 14px;
}

.unit64-unit-card-head span {
  color: var(--muted);
  font-size: 11px;
}

.unit64-base-card {
  background: color-mix(in srgb, var(--accent) 4%, var(--surface-2));
}

.unit64-advanced-units {
  border: 1px dashed var(--border);
  border-radius: 13px;
  background: var(--surface);
}

.unit64-advanced-units summary {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 13px;
  cursor: pointer;
  font-weight: 750;
}

.unit64-advanced-units summary small {
  color: var(--muted);
  font-weight: 500;
}

.unit64-advanced-units > .form-grid {
  padding: 0 13px 13px;
}

.pos64-cart-product-copy {
  min-width: 0;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(130px, .7fr);
  column-gap: 10px;
  row-gap: 2px;
  align-items: center;
}

.pos64-cart-product-copy > strong,
.pos64-cart-product-copy > span {
  grid-column: 1;
}

.pos64-cart-unit-label {
  grid-column: 2;
  grid-row: 1 / span 2;
  display: grid;
  gap: 3px;
  min-width: 130px;
}

.pos64-cart-unit-label > span {
  overflow: visible;
  color: var(--muted);
  font-size: 10px;
  line-height: 1;
}

.pos64-cart-unit-label .input {
  min-height: 34px;
  padding: 6px 9px;
  font-size: 12px;
}

.rx64-finished-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.rx61-component-row {
  grid-template-columns:
    minmax(220px, 1.35fr)
    minmax(125px, .55fr)
    minmax(145px, .65fr)
    minmax(160px, .75fr)
    40px;
}

@media (max-width: 1260px) {
  .purchase64-order-line {
    grid-template-columns: minmax(240px, 1.5fr) repeat(3, minmax(125px, .7fr)) 40px;
  }

  .purchase64-discount,
  .purchase64-tax {
    grid-row: 2;
  }

  .purchase64-discount {
    grid-column: 2;
  }

  .purchase64-tax {
    grid-column: 3;
  }

  .purchase64-order-line .line-remove {
    grid-column: 5;
    grid-row: 1 / span 2;
  }

  .pos64-cart-product-copy {
    grid-template-columns: 1fr;
  }

  .pos64-cart-unit-label {
    grid-column: 1;
    grid-row: auto;
    max-width: 190px;
  }
}

@media (max-width: 980px) {
  .purchase64-header-grid {
    grid-template-columns: 1fr 1fr;
  }

  .purchase64-supplier {
    grid-column: 1 / -1;
  }

  .purchase64-order-line {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .purchase64-order-line .line-product {
    grid-column: 1 / -1;
  }

  .purchase64-discount,
  .purchase64-tax,
  .purchase64-order-line .line-remove {
    grid-column: auto;
    grid-row: auto;
  }

  .purchase64-order-line .line-remove {
    justify-self: end;
  }

  .rx64-finished-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .rx61-component-row {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .rx61-component-row .rx61-product-picker {
    grid-column: 1 / -1;
  }
}

@media (max-width: 680px) {
  .purchase64-form-head,
  .unit63-section-heading,
  .unit64-unit-card-head,
  .unit64-advanced-units summary {
    align-items: stretch;
    flex-direction: column;
  }

  .purchase64-header-grid,
  .purchase64-order-line,
  .purchase64-form-footer,
  .rx64-finished-grid,
  .rx61-component-row {
    grid-template-columns: 1fr;
  }

  .purchase64-supplier,
  .purchase64-order-line .line-product,
  .rx61-component-row .rx61-product-picker {
    grid-column: auto;
  }

  .purchase64-form-footer .btn {
    width: 100%;
  }

  .pos64-cart-product-copy {
    width: 100%;
  }
}

/* Sprint 6.5 — laporan operasional */
.report-toolbar {
  display: grid;
  gap: 14px;
  padding: 16px;
  margin-bottom: 16px;
}

.report-filter-form {
  display: grid;
  grid-template-columns: minmax(150px, 190px) minmax(150px, 190px) minmax(220px, 1fr) auto auto;
  gap: 12px;
  align-items: end;
}

.report-filter-form:not(:has(.report-search-field)) {
  grid-template-columns: minmax(150px, 190px) minmax(150px, 190px) 1fr auto auto;
}

.report-filter-form:not(:has(.report-search-field)) .report-apply {
  grid-column: 4;
}

.report-filter-form.is-inventory {
  grid-template-columns: minmax(260px, 1fr) minmax(220px, 1fr) auto auto;
}

.report-current-position {
  min-height: 44px;
  display: flex;
  gap: 10px;
  align-items: center;
  padding: 8px 11px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--surface-2);
}
.report-current-position strong,
.report-current-position small { display: block; }
.report-current-position small { margin-top: 2px; color: var(--muted); }
.report-current-position .icon { color: var(--accent); }

.report-search-field { min-width: 220px; }
.report-apply,
.report-export { white-space: nowrap; }

.report-quick-periods {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 12px;
  align-items: center;
  color: var(--muted);
  font-size: 12px;
}

.report-quick-periods span { font-weight: 700; color: var(--text-soft); }
.report-quick-periods a {
  padding: 5px 9px;
  border: 1px solid var(--border);
  border-radius: 999px;
  background: var(--surface-2);
  color: var(--text-soft);
  font-weight: 650;
}
.report-quick-periods a:hover { border-color: var(--accent); color: var(--accent); }

.report-tabs { margin-bottom: 16px; overflow-x: auto; }
.report-kpi-grid { margin-bottom: 16px; }
.report-money { font-size: clamp(20px, 2vw, 28px); }

.report-summary-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(300px, .8fr);
  gap: 16px;
  margin-bottom: 16px;
}

.report-purchase-grid { grid-template-columns: minmax(0, 1.7fr) minmax(300px, .7fr); }
.report-cash-grid { grid-template-columns: minmax(320px, .65fr) minmax(0, 1.35fr); }

.report-panel { padding: 0; overflow: hidden; margin-bottom: 16px; }
.report-summary-grid > .report-panel { margin-bottom: 0; }
.report-panel .card-head { padding: 18px 20px 14px; }
.report-panel .card-head h3 { margin: 0 0 3px; }
.report-panel .card-head p { margin: 0; color: var(--muted); }
.report-panel .table-wrap { border-top: 1px solid var(--border); }
.report-panel .data-table { margin: 0; }
.report-panel .data-table th:first-child,
.report-panel .data-table td:first-child { padding-left: 20px; }
.report-panel .data-table th:last-child,
.report-panel .data-table td:last-child { padding-right: 20px; }
.report-panel .data-table td small { display: block; margin-top: 2px; color: var(--muted); }

.compact-table th,
.compact-table td { padding-top: 10px; padding-bottom: 10px; }

.report-wide-table { min-width: 820px; }
.report-side-panel .report-ranked-list { border-top: 1px solid var(--border); }

.report-method-list { display: grid; padding: 4px 20px 10px; }
.report-method-row,
.report-panel-total {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: center;
  padding: 11px 0;
  border-bottom: 1px solid var(--border);
}
.report-method-row:last-child { border-bottom: 0; }
.report-method-row span { color: var(--text-soft); }
.report-panel-total {
  padding: 14px 20px 18px;
  border-top: 1px solid var(--border);
  border-bottom: 0;
  background: var(--surface-2);
}
.report-panel-total strong { font-size: 18px; }

.report-ranked-list { display: grid; }
.report-ranked-row {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 13px 18px;
  border-bottom: 1px solid var(--border);
}
.report-ranked-row:last-child { border-bottom: 0; }
.report-ranked-row > div { min-width: 0; }
.report-ranked-row strong,
.report-ranked-row small { display: block; }
.report-ranked-row strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.report-ranked-row small { color: var(--muted); margin-top: 2px; }
.report-ranked-row b { white-space: nowrap; }
.report-rank {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: var(--accent-soft);
  color: var(--accent);
  font-weight: 800;
}

.report-footnote {
  margin: -4px 0 18px;
  padding: 10px 12px;
  border-left: 3px solid var(--accent);
  background: var(--accent-soft);
  border-radius: 0 10px 10px 0;
  color: var(--text-soft);
  font-size: 12px;
}

.report-difference { color: var(--danger); font-weight: 800; }
.empty-state.compact { min-height: 150px; padding: 24px; }

@media (max-width: 1120px) {
  .report-filter-form,
  .report-filter-form:not(:has(.report-search-field)),
  .report-filter-form.is-inventory {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .report-search-field { grid-column: 1 / -1; }
  .report-filter-form:not(:has(.report-search-field)) .report-apply { grid-column: auto; }

  .report-summary-grid,
  .report-purchase-grid,
  .report-cash-grid { grid-template-columns: 1fr; }
}

@media (max-width: 680px) {
  .report-toolbar { padding: 14px; }
  .report-filter-form,
  .report-filter-form:not(:has(.report-search-field)),
  .report-filter-form.is-inventory { grid-template-columns: 1fr; }
  .report-search-field { grid-column: auto; }
  .report-apply,
  .report-export { width: 100%; }
  .report-panel .card-head { align-items: stretch; flex-direction: column; }
  .report-panel .card-head .btn { width: 100%; }
  .report-ranked-row { grid-template-columns: 32px minmax(0, 1fr); }
  .report-ranked-row b { grid-column: 2; }
}

/* Sprint 6.5.1 — zona waktu operasional dan jam aplikasi */
.app-clock {
  min-width: 206px;
  min-height: 44px;
  padding: 6px 11px;
  display: flex;
  align-items: center;
  gap: 9px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--surface-2);
}

.app-clock-icon,
.settings-clock-icon {
  width: 30px;
  height: 30px;
  flex: 0 0 30px;
  display: grid;
  place-items: center;
  border-radius: 9px;
  color: var(--accent);
  background: var(--accent-soft);
}

.app-clock-copy {
  min-width: 0;
  line-height: 1.15;
}

.app-clock-copy strong,
.app-clock-copy span {
  display: block;
  white-space: nowrap;
}

.app-clock-copy strong {
  max-width: 176px;
  overflow: hidden;
  color: var(--muted);
  font-size: 10px;
  font-weight: 650;
  text-overflow: ellipsis;
}

.app-clock-copy span {
  margin-top: 3px;
  color: var(--muted);
  font-size: 10px;
}

.app-clock-copy b {
  color: var(--text);
  font-size: 13px;
  letter-spacing: .02em;
}

.settings-stack {
  display: grid;
  gap: 16px;
  align-content: start;
}

.timezone-form,
.timezone-readonly {
  display: grid;
  gap: 14px;
}

.timezone-actions {
  display: flex;
  justify-content: flex-start;
}

.timezone-readonly strong,
.timezone-readonly span,
.timezone-readonly small {
  display: block;
}

.timezone-readonly span {
  margin-top: 4px;
  color: var(--muted);
  font-size: 12px;
}

.timezone-readonly small {
  margin-top: 10px;
  color: var(--muted);
}

.timezone-note {
  margin-top: 16px;
  padding: 12px;
  display: flex;
  align-items: flex-start;
  gap: 9px;
  border: 1px solid color-mix(in srgb, var(--info) 25%, var(--border));
  border-radius: 12px;
  color: var(--text-soft);
  background: color-mix(in srgb, var(--info) 7%, var(--surface));
  font-size: 11px;
  line-height: 1.55;
}

.timezone-note .icon {
  flex: 0 0 auto;
  color: var(--info);
}

.settings-clock-preview {
  margin-bottom: 14px;
  padding: 13px;
  display: flex;
  align-items: center;
  gap: 10px;
  border: 1px solid var(--border);
  border-radius: 13px;
  background: var(--surface);
}

.settings-clock-preview strong,
.settings-clock-preview b {
  display: block;
}

.settings-clock-preview strong {
  color: var(--muted);
  font-size: 11px;
}

.settings-clock-preview b {
  margin-top: 4px;
  color: var(--text);
  font-size: 17px;
}

@media (max-width: 1180px) {
  .app-clock {
    min-width: 150px;
  }

  .app-clock-copy strong {
    display: none;
  }

  .app-clock-copy span {
    margin-top: 0;
  }
}

@media (max-width: 680px) {
  .app-clock {
    min-width: 0;
    padding: 6px 9px;
  }

  .app-clock-icon {
    display: none;
  }

  .app-clock-copy span {
    font-size: 9px;
  }

  .app-clock-copy b {
    font-size: 12px;
  }

  .timezone-actions .btn {
    width: 100%;
  }
}

/* Sprint 6.6 — Plan & Entitlement Engine */
.plan-hero {
    display:grid;
    grid-template-columns:minmax(0,1.25fr) minmax(280px,.75fr);
    gap:24px;
    align-items:center;
    padding:28px;
    overflow:hidden;
    position:relative;
}
.plan-hero::after {
    content:"";
    position:absolute;
    width:220px;
    height:220px;
    right:-80px;
    top:-100px;
    border-radius:999px;
    background:color-mix(in srgb,var(--accent) 10%,transparent);
    pointer-events:none;
}
.plan-hero h2 {font-size:clamp(28px,4vw,44px);margin:6px 0 8px;letter-spacing:-.04em}
.plan-hero p {max-width:680px;margin:0;color:var(--muted);line-height:1.65}
.plan-hero-badges {display:flex;gap:8px;flex-wrap:wrap;margin-top:18px}
.plan-luxury-note {display:flex;gap:14px;align-items:flex-start;padding:18px;border:1px solid var(--border);border-radius:18px;background:color-mix(in srgb,var(--surface) 88%,var(--accent) 12%);position:relative;z-index:1}
.plan-luxury-note strong,.plan-luxury-note span {display:block}
.plan-luxury-note span {color:var(--muted);font-size:13px;line-height:1.55;margin-top:4px}
.plan-luxury-icon {display:grid;place-items:center;width:38px;height:38px;flex:0 0 38px;border-radius:12px;background:var(--accent);color:#fff}
.usage-grid {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:16px}
.usage-card {padding:20px}
.usage-card-head {display:flex;align-items:center;gap:10px;color:var(--muted);font-size:13px;font-weight:700}
.usage-card>strong {display:block;font-size:25px;letter-spacing:-.03em;margin-top:16px}
.usage-card small {display:block;color:var(--muted);margin-top:8px}
.usage-meter {height:7px;border-radius:999px;background:var(--surface-2);overflow:hidden;margin-top:14px}
.usage-meter span {display:block;height:100%;border-radius:inherit;background:var(--accent)}
.plan-features-card,.plan-comparison-card {margin-top:16px;padding:22px}
.section-heading {display:flex;justify-content:space-between;gap:18px;align-items:flex-start;margin-bottom:18px}
.section-heading h2 {margin:0 0 5px;font-size:20px}
.section-heading p {margin:0;color:var(--muted);line-height:1.55}
.feature-groups {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.feature-group {border:1px solid var(--border);border-radius:16px;padding:16px}
.feature-group h3 {font-size:14px;margin:0 0 12px;color:var(--muted)}
.feature-list {display:grid;gap:9px}
.feature-row {display:grid;grid-template-columns:32px minmax(0,1fr) auto;gap:10px;align-items:center;padding:10px;border-radius:12px}
.feature-row.is-enabled {background:color-mix(in srgb,var(--success) 8%,transparent)}
.feature-row.is-disabled {background:var(--surface-2);opacity:.76}
.feature-row strong,.feature-row span {display:block}
.feature-row>div>span {font-size:12px;line-height:1.45;color:var(--muted);margin-top:2px}
.feature-state {display:grid;place-items:center;width:30px;height:30px;border-radius:9px;background:var(--surface);border:1px solid var(--border)}
.plan-comparison-grid {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.plan-option {padding:18px;border:1px solid var(--border);border-radius:16px;background:var(--surface)}
.plan-option.is-current {border-color:var(--accent);box-shadow:0 0 0 2px color-mix(in srgb,var(--accent) 14%,transparent)}
.plan-option-head {display:flex;justify-content:space-between;gap:10px;align-items:flex-start}
.plan-option h3 {margin:0;font-size:18px}
.plan-option p {margin:5px 0 0;color:var(--muted);font-size:12px;line-height:1.45}
.plan-option dl {display:grid;gap:8px;margin:16px 0 0}
.plan-option dl div {display:flex;justify-content:space-between;gap:10px;padding-top:8px;border-top:1px solid var(--border)}
.plan-option dt {color:var(--muted)}
.plan-option dd {margin:0;font-weight:700}
.plan-pilot-note {display:flex;gap:10px;align-items:flex-start;margin-top:16px;padding:13px 15px;border-radius:12px;background:var(--surface-2);color:var(--muted);font-size:13px;line-height:1.55}
.tenant-usage-inline {display:flex;gap:12px;flex-wrap:wrap}
.tenant-usage-inline span {display:inline-flex;align-items:center;gap:5px;white-space:nowrap}
.tenant-usage-inline .icon {width:15px;height:15px;color:var(--muted)}
.modal-card-compact {max-width:640px}

@media (max-width:980px) {
    .plan-hero,.feature-groups {grid-template-columns:1fr}
    .usage-grid,.plan-comparison-grid {grid-template-columns:1fr}
}
.feature-group .feature-list {grid-template-columns:1fr}
.feature-group .feature-list > .feature-row {
    display:grid;
    grid-template-columns:32px minmax(0,1fr) auto;
    gap:10px;
    align-items:center;
    padding:10px;
    border:0;
    border-radius:12px;
}
.feature-group .feature-list > .feature-row.is-enabled {background:color-mix(in srgb,var(--success) 8%,transparent)}
.feature-group .feature-list > .feature-row.is-disabled {background:var(--surface-2)}
@media (max-width:680px) {
    .feature-group .feature-list > .feature-row {grid-template-columns:30px minmax(0,1fr)}
    .feature-group .feature-list > .feature-row > .badge {grid-column:2;justify-self:start}
    .section-heading {align-items:stretch;flex-direction:column}
}

/* Sprint 6.7 — simple user, role, and branch administration */
.user67-tabs {
  display: inline-flex;
  gap: 4px;
  padding: 4px;
  margin-bottom: 16px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--surface-2);
}
.user67-tabs a {
  min-height: 36px;
  padding: 8px 14px;
  border-radius: 9px;
  color: var(--muted);
  font-weight: 700;
}
.user67-tabs a:hover { color: var(--text); }
.user67-tabs a.active {
  color: var(--accent);
  background: var(--surface);
  box-shadow: var(--shadow-sm);
}

.user67-form { padding-bottom: 88px; }
.user67-section { padding: 22px; }
.user67-section-heading {
  display: flex;
  gap: 13px;
  align-items: flex-start;
  margin-bottom: 20px;
}
.user67-section-heading h3,
.user67-section-heading p { margin: 0; }
.user67-section-heading p { color: var(--muted); margin-top: 3px; }
.user67-step {
  width: 32px;
  height: 32px;
  border-radius: 10px;
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  color: var(--accent);
  background: var(--accent-soft);
  font-weight: 800;
}

.user67-role-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}
.user67-role-card { cursor: pointer; }
.user67-role-card input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}
.user67-role-card > span {
  min-height: 116px;
  padding: 16px;
  border: 1px solid var(--border);
  border-radius: 14px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  background: var(--surface);
  transition: .18s ease;
}
.user67-role-card:hover > span {
  border-color: rgba(var(--accent-rgb), .45);
  transform: translateY(-1px);
}
.user67-role-card input:checked + span {
  border-color: var(--accent);
  background: var(--accent-soft);
  box-shadow: 0 0 0 2px rgba(var(--accent-rgb), .08);
}
.user67-role-card-top {
  display: flex;
  gap: 8px;
  align-items: center;
  justify-content: space-between;
}
.user67-role-card strong { font-size: 15px; }
.user67-role-card small { color: var(--muted); }
.user67-role-card em {
  padding: 3px 7px;
  border-radius: 999px;
  color: var(--warning);
  background: var(--warning-soft);
  font-size: 10px;
  font-style: normal;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .04em;
}

.user67-advanced {
  margin-top: 14px;
  border: 1px solid var(--border);
  border-radius: 14px;
  overflow: hidden;
  background: var(--surface-2);
}
.user67-advanced > summary {
  padding: 14px 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  cursor: pointer;
  list-style: none;
}
.user67-advanced > summary::-webkit-details-marker { display: none; }
.user67-advanced > summary span:first-child {
  display: flex;
  flex-direction: column;
}
.user67-advanced > summary small { color: var(--muted); font-weight: 500; }
.user67-additional-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  padding: 0 16px 16px;
}
.user67-additional-grid label,
.user67-branch-grid label {
  position: relative;
  cursor: pointer;
}
.user67-additional-grid input,
.user67-branch-grid input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}
.user67-additional-grid label > span,
.user67-branch-grid label > span {
  min-height: 68px;
  padding: 12px 13px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--surface);
}
.user67-additional-grid input:checked + span,
.user67-branch-grid input:checked + span {
  border-color: var(--accent);
  background: var(--accent-soft);
}
.user67-additional-grid small,
.user67-branch-grid small { color: var(--muted); }
.user67-additional-grid label.is-disabled,
.user67-branch-grid label.is-disabled { opacity: .48; cursor: not-allowed; }

.user67-inline-info {
  margin-top: 14px;
  padding: 13px 14px;
  display: flex;
  gap: 11px;
  align-items: flex-start;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--surface-2);
}
.user67-inline-info > .icon { color: var(--accent); margin-top: 1px; }
.user67-inline-info div { display: flex; flex-direction: column; }
.user67-inline-info span { color: var(--muted); }
.user67-inline-info a { color: var(--accent); font-weight: 700; }

.user67-fixed-access {
  padding: 15px 16px;
  display: flex;
  gap: 12px;
  align-items: center;
  border: 1px solid var(--border);
  border-radius: 14px;
  background: var(--surface-2);
}
.user67-fixed-access > span:first-child {
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border-radius: 12px;
  color: var(--accent);
  background: var(--accent-soft);
}
.user67-fixed-access > div {
  min-width: 0;
  flex: 1;
  display: flex;
  flex-direction: column;
}
.user67-fixed-access small { color: var(--muted); }
.user67-access-choice {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 14px;
}
.user67-access-choice label { cursor: pointer; position: relative; }
.user67-access-choice input { position: absolute; opacity: 0; pointer-events: none; }
.user67-access-choice span {
  min-height: 78px;
  padding: 14px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  border: 1px solid var(--border);
  border-radius: 13px;
  background: var(--surface);
}
.user67-access-choice small { color: var(--muted); }
.user67-access-choice input:checked + span {
  border-color: var(--accent);
  background: var(--accent-soft);
}
.user67-access-choice input:disabled + span { opacity: .55; cursor: not-allowed; }
.user67-branch-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}
.user67-branch-grid[hidden],
[data-user67-professional-panel][hidden],
[data-user67-apj-panel][hidden],
[data-user67-apj-fields][hidden] { display: none !important; }
.user67-apj {
  margin-top: 16px;
  padding-top: 16px;
  border-top: 1px solid var(--border);
}
.user67-apj [data-user67-apj-fields] { margin-top: 14px; }

.user67-sticky-save {
  position: sticky;
  bottom: 14px;
  z-index: 10;
  margin-top: 16px;
  padding: 14px 16px;
  display: flex;
  gap: 16px;
  align-items: center;
  justify-content: space-between;
  border: 1px solid var(--border);
  border-radius: 16px;
  background: color-mix(in srgb, var(--surface) 92%, transparent);
  box-shadow: var(--shadow);
  backdrop-filter: blur(14px);
}
.user67-sticky-save > div { display: flex; flex-direction: column; }
.user67-sticky-save span { color: var(--muted); }

.user67-role-intro {
  padding: 22px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 16px;
}
.user67-role-intro h3,
.user67-role-intro p { margin: 0; }
.user67-role-intro p { margin-top: 5px; color: var(--muted); max-width: 720px; }
.user67-role-rule {
  min-width: 250px;
  padding: 13px;
  display: flex;
  gap: 10px;
  align-items: center;
  border-radius: 13px;
  color: var(--accent);
  background: var(--accent-soft);
}
.user67-role-rule > span { display: flex; flex-direction: column; color: var(--text); }
.user67-role-rule > span:not(strong) { font-size: 12px; }
.user67-template-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}
.user67-template-card { padding: 20px; }
.user67-template-card > header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 14px;
}
.user67-template-card h3,
.user67-template-card p { margin: 0; }
.user67-template-card p { color: var(--muted); margin-top: 4px; }
.user67-plan-note { margin-bottom: 12px; }
.user67-permission-groups {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.user67-permission-groups details {
  border: 1px solid var(--border);
  border-radius: 11px;
  background: var(--surface-2);
}
.user67-permission-groups summary {
  padding: 10px 12px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  cursor: pointer;
}
.user67-permission-groups summary span {
  min-width: 24px;
  height: 24px;
  padding: 0 6px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  color: var(--muted);
  background: var(--surface-3);
  font-size: 11px;
  font-weight: 800;
}
.user67-permission-groups ul {
  margin: 0;
  padding: 0 28px 12px;
  color: var(--muted);
}
.user67-template-card > footer {
  margin-top: 14px;
  padding-top: 13px;
  display: flex;
  gap: 9px;
  align-items: flex-start;
  border-top: 1px solid var(--border);
  color: var(--muted);
}
.user67-template-card > footer .icon { color: var(--accent); }
.user67-combination-section { margin-top: 22px; }
.user67-combination-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}
.user67-combination-grid .card {
  min-height: 112px;
  padding: 17px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.user67-combination-grid span { color: var(--muted); }

@media (max-width: 1050px) {
  .user67-role-grid,
  .user67-additional-grid,
  .user67-branch-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .user67-template-grid { grid-template-columns: 1fr; }
}

@media (max-width: 720px) {
  .user67-tabs { width: 100%; }
  .user67-tabs a { flex: 1; text-align: center; }
  .user67-section { padding: 16px; }
  .user67-role-grid,
  .user67-additional-grid,
  .user67-branch-grid,
  .user67-access-choice,
  .user67-combination-grid { grid-template-columns: 1fr; }
  .user67-role-intro { align-items: stretch; flex-direction: column; }
  .user67-role-rule { min-width: 0; }
  .user67-sticky-save {
    bottom: 8px;
    align-items: stretch;
    flex-direction: column;
  }
  .user67-sticky-save .btn { width: 100%; }
}

/* Sprint 6.8 — Multi-Branch foundation */
.branch68-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.75fr) minmax(260px, .75fr);
  gap: 16px;
  margin-bottom: 16px;
}
.branch68-hero-main {
  padding: 24px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
}
.branch68-hero-main h2,
.branch68-hero-main p { margin: 0; }
.branch68-hero-main h2 { margin-top: 5px; }
.branch68-hero-main p {
  max-width: 720px;
  margin-top: 8px;
  color: var(--muted);
}
.branch68-usage {
  min-width: 150px;
  padding: 16px;
  display: flex;
  flex-direction: column;
  border-radius: 15px;
  background: var(--accent-soft);
}
.branch68-usage strong { font-size: 25px; }
.branch68-usage span { color: var(--muted); font-size: 12px; }
.branch68-meter {
  height: 7px;
  margin-top: 12px;
  overflow: hidden;
  border-radius: 999px;
  background: color-mix(in srgb, var(--accent) 17%, transparent);
}
.branch68-meter i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: var(--accent);
}
.branch68-rule-card {
  padding: 22px;
  display: flex;
  align-items: center;
  gap: 14px;
}
.branch68-rule-card > .icon {
  width: 44px;
  height: 44px;
  padding: 10px;
  flex: 0 0 auto;
  border-radius: 13px;
  color: var(--accent);
  background: var(--accent-soft);
}
.branch68-rule-card div { display: flex; flex-direction: column; gap: 4px; }
.branch68-rule-card span { color: var(--muted); }
.branch68-limit-note { margin-bottom: 16px; }

.branch68-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}
.branch68-card {
  padding: 20px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.branch68-card.is-current {
  border-color: color-mix(in srgb, var(--accent) 58%, var(--border));
  box-shadow: 0 0 0 2px var(--accent-soft), var(--shadow-sm);
}
.branch68-card.is-inactive { opacity: .72; }
.branch68-card > header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
}
.branch68-title {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 12px;
}
.branch68-avatar {
  width: 46px;
  height: 46px;
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  border-radius: 14px;
  color: var(--accent);
  background: var(--accent-soft);
  font-weight: 850;
}
.branch68-title > div { min-width: 0; }
.branch68-title-line {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 7px;
}
.branch68-title h3 { margin: 0; }
.branch68-title > div > span { color: var(--muted); font-size: 12px; }
.branch68-address {
  min-height: 44px;
  display: flex;
  align-items: flex-start;
  gap: 10px;
  color: var(--muted);
}
.branch68-address .icon { color: var(--accent); flex: 0 0 auto; }
.branch68-stats {
  margin: 0;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}
.branch68-stats div {
  min-width: 0;
  padding: 11px 12px;
  border: 1px solid var(--border);
  border-radius: 11px;
  background: var(--surface-2);
}
.branch68-stats dt { color: var(--muted); font-size: 11px; }
.branch68-stats dd {
  margin: 3px 0 0;
  overflow: hidden;
  text-overflow: ellipsis;
  font-weight: 800;
}
.branch68-contact {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 14px;
  color: var(--muted);
  font-size: 12px;
}
.branch68-actions {
  padding-top: 14px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  border-top: 1px solid var(--border);
}
.branch68-actions form { margin: 0; }
.branch68-action-menu { position: relative; }
.branch68-action-menu > summary { list-style: none; cursor: pointer; }
.branch68-action-menu > summary::-webkit-details-marker { display: none; }
.branch68-action-menu[open] > form {
  position: absolute;
  right: 0;
  bottom: calc(100% + 8px);
  z-index: 30;
  width: 280px;
  padding: 14px;
  display: flex;
  flex-direction: column;
  gap: 9px;
  border: 1px solid var(--border);
  border-radius: 13px;
  background: var(--surface);
  box-shadow: var(--shadow);
}
.branch68-action-menu label { font-size: 12px; font-weight: 800; }
.branch68-foundation {
  margin-top: 16px;
  padding: 18px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}
.branch68-foundation > div {
  display: flex;
  align-items: flex-start;
  gap: 11px;
}
.branch68-foundation .icon { color: var(--accent); flex: 0 0 auto; }
.branch68-foundation span { display: flex; flex-direction: column; }
.branch68-foundation small { margin-top: 3px; color: var(--muted); }

.branch68-form {
  max-width: 980px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.branch68-form-section { padding: 22px; }
.branch68-form-section > header {
  display: flex;
  align-items: flex-start;
  gap: 13px;
  margin-bottom: 20px;
}
.branch68-form-section > header > div { flex: 1; }
.branch68-form-section h2,
.branch68-form-section p { margin: 0; }
.branch68-form-section p { margin-top: 4px; color: var(--muted); }
.branch68-step {
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  border-radius: 11px;
  color: var(--accent);
  background: var(--accent-soft);
  font-weight: 850;
}
.branch68-form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}
.branch68-span-2 { grid-column: 1 / -1; }
.branch68-form .form-group small { color: var(--muted); }
.branch68-advanced { padding: 0; overflow: visible; }
.branch68-advanced > summary {
  padding: 18px 20px;
  display: flex;
  align-items: center;
  gap: 12px;
  cursor: pointer;
  list-style: none;
}
.branch68-advanced > summary::-webkit-details-marker { display: none; }
.branch68-advanced > summary > span {
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  border-radius: 11px;
  color: var(--accent);
  background: var(--accent-soft);
}
.branch68-advanced > summary > div { display: flex; flex-direction: column; }
.branch68-advanced > summary small { color: var(--muted); }
.branch68-advanced > .branch68-form-grid {
  padding: 0 20px 20px;
  border-top: 1px solid var(--border);
  padding-top: 20px;
}
.branch68-form-note {
  padding: 16px 18px;
  display: flex;
  gap: 12px;
  align-items: flex-start;
  border: 1px solid color-mix(in srgb, var(--accent) 28%, var(--border));
  border-radius: 14px;
  background: var(--accent-soft);
}
.branch68-form-note > .icon { color: var(--accent); flex: 0 0 auto; }
.branch68-form-note div { display: flex; flex-direction: column; }
.branch68-form-note span { color: var(--muted); }
.branch68-savebar {
  position: sticky;
  bottom: 12px;
  z-index: 15;
  padding: 14px 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  border: 1px solid var(--border);
  border-radius: 16px;
  background: color-mix(in srgb, var(--surface) 92%, transparent);
  box-shadow: var(--shadow);
  backdrop-filter: blur(14px);
}
.branch68-savebar > div { display: flex; flex-direction: column; }
.branch68-savebar span { color: var(--muted); }

@media (max-width: 1000px) {
  .branch68-hero,
  .branch68-grid { grid-template-columns: 1fr; }
  .branch68-foundation { grid-template-columns: 1fr; }
}

@media (max-width: 700px) {
  .branch68-hero-main { align-items: stretch; flex-direction: column; }
  .branch68-usage { width: 100%; }
  .branch68-stats,
  .branch68-form-grid { grid-template-columns: 1fr; }
  .branch68-span-2 { grid-column: auto; }
  .branch68-card { padding: 16px; }
  .branch68-card > header { flex-direction: column; }
  .branch68-action-menu[open] > form {
    position: fixed;
    left: 16px;
    right: 16px;
    bottom: 16px;
    width: auto;
  }
  .branch68-savebar { align-items: stretch; flex-direction: column; }
  .branch68-savebar .btn { width: 100%; }
}

/* Sprint 6.9A — purchasing maturity */
.purchase69-workspace { overflow: visible; }
.purchase69-workspace .card-head { align-items: flex-start; }
.purchase69-kpi .kpi-note { min-height: 21px; }
.purchase69-header-grid {
  display: grid;
  grid-template-columns: minmax(280px, 1.7fr) minmax(170px, .65fr) minmax(170px, .65fr);
  gap: 14px;
}
.purchase69-supplier { min-width: 0; }
.purchase69-lines-head,
.purchase69-form-footer,
.purchase69-receipt-footer {
  display: flex;
  gap: 16px;
  align-items: center;
  justify-content: space-between;
}
.purchase69-lines-head { margin-top: 4px; }
.purchase69-lines-head h3,
.purchase69-lines-head p { margin: 0; }
.purchase69-lines-head p { color: var(--muted); margin-top: 3px; }
.purchase69-order-lines { display: grid; gap: 12px; }
.purchase69-order-line {
  display: grid;
  grid-template-columns: minmax(250px, 2fr) minmax(100px, .55fr) minmax(150px, .8fr) minmax(145px, .75fr) minmax(150px, .8fr) 42px;
  gap: 10px;
  align-items: start;
  padding: 14px;
  border: 1px solid var(--border);
  border-radius: 14px;
  background: var(--surface-2);
}
.purchase69-order-line .form-group { margin: 0; }
.purchase69-line-more,
.purchase69-allocation-more,
.purchase69-more-actions,
.purchase69-danger-zone,
.purchase69-notes,
.purchase69-exceptions {
  border: 1px solid var(--border);
  border-radius: 11px;
  background: var(--surface);
}
.purchase69-line-more > summary,
.purchase69-allocation-more > summary,
.purchase69-more-actions > summary,
.purchase69-danger-zone > summary,
.purchase69-notes > summary,
.purchase69-exceptions > summary {
  cursor: pointer;
  color: var(--text-soft);
  font-weight: 650;
  list-style: none;
}
.purchase69-line-more > summary,
.purchase69-allocation-more > summary { padding: 10px 12px; }
.purchase69-line-more[open] > summary,
.purchase69-allocation-more[open] > summary { border-bottom: 1px solid var(--border); }
.purchase69-line-more-grid,
.purchase69-allocation-more-grid { display: grid; gap: 10px; padding: 10px; }
.purchase69-line-more-grid { grid-template-columns: 1fr 1fr; }
.purchase69-allocation-more-grid { grid-template-columns: 1fr 1fr; }
.purchase69-notes,
.purchase69-exceptions { margin-top: 2px; }
.purchase69-notes > summary,
.purchase69-exceptions > summary { padding: 12px 14px; }
.purchase69-notes textarea,
.purchase69-exceptions > div { margin: 0 14px 14px; width: calc(100% - 28px); }
.purchase69-form-footer,
.purchase69-receipt-footer {
  position: sticky;
  bottom: 14px;
  z-index: 4;
  padding: 14px 16px;
  border: 1px solid var(--border);
  border-radius: 14px;
  background: color-mix(in srgb, var(--surface) 94%, transparent);
  box-shadow: var(--shadow);
  backdrop-filter: blur(10px);
}
.purchase69-po-loader {
  display: grid;
  grid-template-columns: minmax(280px, 1fr) auto;
  gap: 12px;
  align-items: end;
  max-width: 760px;
  padding: 14px;
  border: 1px solid var(--border);
  border-radius: 14px;
  background: var(--surface-2);
  margin-bottom: 16px;
}
.purchase69-po-summary { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.purchase69-receipt-header { grid-template-columns: minmax(280px, 1fr) minmax(180px, .45fr); }
.purchase69-receipt-items { display: grid; gap: 14px; }
.purchase69-allocation {
  grid-template-columns: minmax(90px, .55fr) minmax(130px, .75fr) minmax(130px, .85fr) minmax(135px, .75fr) minmax(145px, .85fr) minmax(150px, .9fr) minmax(125px, .8fr) 40px;
  align-items: start;
}
.purchase69-allocation .variance-preview,
.purchase69-allocation .purchase69-expiry-preview {
  min-height: 38px;
  display: flex;
  align-items: center;
  padding: 8px 10px;
  border-radius: 10px;
  background: var(--surface-3);
  color: var(--muted);
  font-size: 12px;
  font-weight: 650;
}
.variance-preview.is-warning,
.purchase69-expiry-preview.is-warning { background: var(--warning-soft); color: var(--warning); }
.variance-preview.is-danger,
.purchase69-expiry-preview.is-danger { background: var(--danger-soft); color: var(--danger); }
.purchase69-expiry-preview.is-ok { background: var(--success-soft); color: var(--success); }
.purchase69-live-summary { display: flex; flex-wrap: wrap; gap: 14px; color: var(--muted); }
.purchase69-live-summary strong,
.purchase69-live-summary b { color: var(--text); }
.purchase69-receipt-list .receipt-workflow-card { position: relative; }
.purchase69-list-action { display: flex; justify-content: flex-end; margin-top: 12px; }
.purchase69-row-actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.purchase69-row-actions form { margin: 0; }
.purchase69-more-actions { position: relative; }
.purchase69-more-actions > summary { padding: 8px 10px; font-size: 12px; }
.purchase69-more-actions form { min-width: 220px; padding: 10px; }
.purchase69-review-hero {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 20px;
}
.purchase69-review-hero h2 { margin: 5px 0 2px; }
.purchase69-review-hero p { margin: 0; color: var(--muted); }
.purchase69-review-status { display: flex; gap: 8px; flex-wrap: wrap; justify-content: flex-end; }
.purchase69-blockers {
  margin-top: 16px;
  display: flex;
  gap: 14px;
  border-color: color-mix(in srgb, var(--warning) 40%, var(--border));
  background: var(--warning-soft);
}
.purchase69-blocker-icon { color: var(--warning); padding-top: 2px; }
.purchase69-blockers h3,
.purchase69-blockers p { margin: 0; }
.purchase69-blockers ul { margin: 10px 0 0; padding-left: 20px; }
.purchase69-review-kpi { grid-template-columns: repeat(4, minmax(0, 1fr)); margin-top: 16px; }
.purchase69-money { font-size: clamp(18px, 2vw, 28px); }
.purchase69-review-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.7fr) minmax(300px, .65fr);
  gap: 16px;
  margin-top: 16px;
  align-items: start;
}
.purchase69-review-main { min-width: 0; }
.purchase69-review-table td { vertical-align: top; }
.purchase69-review-table .badge { margin-top: 6px; }
.purchase69-variance-text { color: var(--warning); font-weight: 700; }
.purchase69-review-side { display: grid; gap: 16px; position: sticky; top: calc(var(--topbar-height) + 16px); }
.purchase69-doc-card h3,
.purchase69-action-card h3 { margin-top: 0; }
.purchase69-doc-card dl { display: grid; gap: 10px; margin: 0; }
.purchase69-doc-card dl > div { display: flex; justify-content: space-between; gap: 14px; }
.purchase69-doc-card dt { color: var(--muted); }
.purchase69-doc-card dd { margin: 0; font-weight: 700; text-align: right; }
.purchase69-doc-total { padding-top: 10px; border-top: 1px solid var(--border); font-size: 16px; }
.purchase69-note { margin-top: 14px; padding: 12px; border-radius: 11px; background: var(--surface-2); }
.purchase69-note strong { display: block; margin-bottom: 4px; }
.purchase69-note p { margin: 0; color: var(--text-soft); }
.purchase69-note.danger { background: var(--danger-soft); color: var(--danger); }
.purchase69-action-card { display: grid; gap: 12px; }
.purchase69-next-step { display: flex; gap: 10px; align-items: center; padding: 11px; border-radius: 12px; background: var(--accent-soft); }
.purchase69-next-step > span { width: 28px; height: 28px; display: grid; place-items: center; border-radius: 50%; background: var(--accent); color: white; font-weight: 800; }
.purchase69-next-step strong,
.purchase69-next-step small { display: block; }
.purchase69-next-step small { color: var(--muted); }
.purchase69-inline-reason,
.purchase69-approval-box { padding: 12px; border: 1px solid var(--border); border-radius: 12px; background: var(--surface-2); }
.purchase69-approval-box { display: grid; gap: 10px; }
.purchase69-complete-state { text-align: center; padding: 16px; border-radius: 14px; background: var(--success-soft); color: var(--success); }
.purchase69-complete-state .icon { width: 32px; height: 32px; margin: 0 auto 8px; }
.purchase69-complete-state strong { display: block; font-size: 16px; }
.purchase69-complete-state p { margin: 5px 0 0; color: var(--text-soft); }
.purchase69-complete-state.is-cancelled { background: var(--danger-soft); color: var(--danger); }
.purchase69-danger-zone { border-color: color-mix(in srgb, var(--danger) 30%, var(--border)); }
.purchase69-danger-zone > summary { padding: 11px 12px; color: var(--danger); }
.purchase69-danger-zone form { padding: 12px; border-top: 1px solid var(--border); }

@media (max-width: 1180px) {
  .purchase69-order-line { grid-template-columns: minmax(220px, 1.6fr) 100px minmax(140px, .8fr) minmax(130px, .7fr) 42px; }
  .purchase69-line-more { grid-column: 1 / -2; }
  .purchase69-allocation { grid-template-columns: repeat(4, minmax(135px, 1fr)); }
  .purchase69-allocation-more { grid-column: span 2; }
  .purchase69-allocation .variance-preview,
  .purchase69-allocation .purchase69-expiry-preview { min-height: 42px; }
  .purchase69-review-layout { grid-template-columns: 1fr; }
  .purchase69-review-side { position: static; grid-template-columns: 1fr 1fr; }
}

@media (max-width: 820px) {
  .purchase69-header-grid,
  .purchase69-receipt-header,
  .purchase69-po-summary,
  .purchase69-review-kpi { grid-template-columns: 1fr 1fr; }
  .purchase69-supplier { grid-column: 1 / -1; }
  .purchase69-order-line { grid-template-columns: 1fr 1fr; }
  .purchase69-order-line .line-product,
  .purchase69-line-more { grid-column: 1 / -1; }
  .purchase69-order-line .line-remove { justify-self: end; }
  .purchase69-allocation { grid-template-columns: 1fr 1fr; }
  .purchase69-allocation-more { grid-column: 1 / -1; }
  .purchase69-form-footer,
  .purchase69-receipt-footer,
  .purchase69-lines-head,
  .purchase69-review-hero { align-items: stretch; flex-direction: column; }
  .purchase69-review-status { justify-content: flex-start; }
  .purchase69-review-side { grid-template-columns: 1fr; }
}

@media (max-width: 560px) {
  .purchase69-header-grid,
  .purchase69-receipt-header,
  .purchase69-po-summary,
  .purchase69-review-kpi,
  .purchase69-order-line,
  .purchase69-allocation { grid-template-columns: 1fr; }
  .purchase69-po-loader { grid-template-columns: 1fr; }
  .purchase69-line-more,
  .purchase69-allocation-more,
  .purchase69-order-line .line-product { grid-column: auto; }
  .purchase69-line-more-grid,
  .purchase69-allocation-more-grid { grid-template-columns: 1fr; }
  .purchase69-live-summary { display: grid; gap: 6px; }
  .purchase69-form-footer,
  .purchase69-receipt-footer { position: static; }
}


/* Sprint 6.9A: compact tenant controls */
.purchase69-control-settings { margin-bottom: 16px; }
.purchase69-control-settings > summary {
  display: flex;
  align-items: center;
  gap: 12px;
  cursor: pointer;
  list-style: none;
  font-weight: 700;
}
.purchase69-control-settings > summary::-webkit-details-marker { display: none; }
.purchase69-control-settings > summary span:last-child { display: grid; gap: 2px; }
.purchase69-control-settings > summary small { font-weight: 400; color: var(--text-muted); }
.purchase69-settings-form { margin-top: 18px; align-items: end; }
.purchase69-settings-action { display: flex; align-items: end; padding-bottom: 2px; }
.input-suffix { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: stretch; }
.input-suffix .input { border-top-right-radius: 0; border-bottom-right-radius: 0; }
.input-suffix > span {
  display: inline-flex;
  align-items: center;
  padding: 0 12px;
  border: 1px solid var(--border);
  border-left: 0;
  border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
  background: var(--surface-soft);
  color: var(--text-muted);
  white-space: nowrap;
}
@media (max-width: 760px) {
  .purchase69-settings-action .btn { width: 100%; }
}

/* Sprint 6.9A.1 — alur pembelian berbasis pekerjaan, bukan tab proses */
.purchase691-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
    margin-bottom: 16px;
}
.purchase691-action-primary {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 14px;
    min-height: 94px;
    padding: 18px 20px;
    text-decoration: none;
    transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease;
}
.purchase691-action-primary:hover {
    transform: translateY(-2px);
    border-color: var(--accent);
    box-shadow: 0 12px 30px rgba(15, 23, 42, .10);
}
.purchase691-action-icon,
.purchase691-source-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border-radius: 14px;
    background: var(--accent-soft);
    color: var(--accent);
}
.purchase691-action-primary strong,
.purchase691-source-card strong,
.purchase691-external-card strong {
    display: block;
    font-size: 1rem;
}
.purchase691-action-primary small,
.purchase691-source-card small,
.purchase691-order-choice small {
    display: block;
    margin-top: 3px;
    color: var(--muted);
}
.purchase691-action-arrow { font-size: 1.25rem; color: var(--accent); }
.purchase691-kpi { grid-template-columns: repeat(3, minmax(0, 1fr)); margin-bottom: 16px; }
.purchase691-queue { margin-bottom: 16px; }
.purchase691-queue-list { display: grid; gap: 10px; }
.purchase691-task {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px;
    padding: 12px 0;
    border-top: 1px solid var(--border);
}
.purchase691-task:first-child { border-top: 0; }
.purchase691-task-state {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 12px;
    background: var(--surface-soft);
    color: var(--muted);
}
.purchase691-task-state.is-warning,
.purchase691-task-state.is-danger { background: rgba(245, 158, 11, .13); color: #b45309; }
.purchase691-task-state.is-info { background: rgba(59, 130, 246, .13); color: #2563eb; }
.purchase691-task-main strong,
.purchase691-task-main span { display: block; }
.purchase691-task-main span { margin-top: 3px; color: var(--muted); font-size: .88rem; }
.purchase691-focus-bar {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0 0 14px;
    color: var(--muted);
    font-size: .9rem;
}
.purchase691-focus-bar a { color: var(--accent); text-decoration: none; font-weight: 700; }
.purchase691-external-note {
    padding: 14px 16px;
    border: 1px solid rgba(59, 130, 246, .25);
    border-radius: 14px;
    background: rgba(59, 130, 246, .07);
}
.purchase691-external-note p { margin: 4px 0 0; color: var(--muted); }
.purchase691-external-grid { grid-template-columns: 1fr 1fr; }
.purchase691-receive-start { margin-bottom: 16px; }
.purchase691-source-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(260px, .8fr);
    gap: 16px;
}
.purchase691-open-orders h4 { margin: 0 0 10px; }
.purchase691-order-choice,
.purchase691-external-card,
.purchase691-source-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 14px 16px;
    border: 1px solid var(--border);
    border-radius: 14px;
    text-decoration: none;
    color: inherit;
    background: var(--surface);
}
.purchase691-order-choice + .purchase691-order-choice { margin-top: 8px; }
.purchase691-order-choice:hover,
.purchase691-external-card:hover,
.purchase691-source-card:hover { border-color: var(--accent); }
.purchase691-order-choice span { min-width: 0; }
.purchase691-order-choice b,
.purchase691-external-card b { color: var(--accent); white-space: nowrap; }
.purchase691-external-card {
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    min-height: 100%;
}
.purchase691-external-card p { margin: 0; color: var(--muted); line-height: 1.5; }
.purchase691-source-choice {
    display: grid;
    gap: 10px;
    padding: 18px;
    border: 1px dashed var(--border);
    border-radius: 16px;
    background: var(--surface-soft);
}
.purchase691-source-head p { margin: 4px 0 0; color: var(--muted); }
.purchase691-progress {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    margin: 14px 0 16px;
    padding: 10px 14px;
    border: 1px solid var(--border);
    border-radius: 14px;
    background: var(--surface);
    color: var(--muted);
    font-size: .84rem;
}
.purchase691-progress span {
    padding: 5px 9px;
    border-radius: 999px;
}
.purchase691-progress .is-done { background: rgba(34, 197, 94, .12); color: #15803d; font-weight: 700; }
.purchase691-progress .is-current { background: var(--accent-soft); color: var(--accent); font-weight: 800; }
.purchase691-primary-help { display: block; margin-top: 8px; color: var(--muted); line-height: 1.45; }

@media (max-width: 960px) {
    .purchase691-actions,
    .purchase691-source-grid,
    .purchase691-external-grid { grid-template-columns: 1fr; }
    .purchase691-kpi { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
    .purchase691-task { grid-template-columns: auto minmax(0, 1fr); }
    .purchase691-task .btn { grid-column: 1 / -1; width: 100%; }
    .purchase691-action-primary { min-height: 82px; padding: 14px; }
    .purchase691-progress b { display: none; }
}

/* Sprint 6.9A.2 — pembelian berpusat pada faktur, satu layar */
.purchase692-home,
.purchase692-form-card,
.purchase692-review-items,
.purchase692-review-action { display: grid; gap: 16px; }
.purchase692-primary-actions { display: flex; align-items: center; gap: 10px; margin-bottom: 16px; }
.purchase692-list-card { margin-bottom: 16px; }
.purchase692-list-head { align-items: flex-end; }
.purchase692-status-strip { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 8px; }
.purchase692-status-strip span { padding: 7px 10px; border-radius: 999px; background: var(--surface-soft); color: var(--muted); font-size: .82rem; }
.purchase692-status-strip b { color: var(--text); }
.purchase692-invoice-list { display: grid; }
.purchase692-invoice-row { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; gap: 14px; padding: 14px 0; border-top: 1px solid var(--border); }
.purchase692-invoice-row:first-child { border-top: 0; }
.purchase692-invoice-main strong,
.purchase692-invoice-main span { display: block; }
.purchase692-invoice-main span { margin-top: 3px; color: var(--muted); font-size: .88rem; }
.purchase692-invoice-meta { display: flex; align-items: center; gap: 8px; }
.purchase692-invoice-meta > strong { min-width: 118px; text-align: right; }
.purchase692-po-drawer,
.purchase692-settings-drawer { margin-bottom: 12px; }
.purchase692-po-drawer > summary,
.purchase692-settings-drawer > summary { display: flex; align-items: center; gap: 12px; cursor: pointer; list-style: none; font-weight: 700; }
.purchase692-po-drawer > summary::-webkit-details-marker,
.purchase692-settings-drawer > summary::-webkit-details-marker { display: none; }
.purchase692-po-drawer > summary span:last-child,
.purchase692-settings-drawer > summary span:last-child { display: grid; gap: 2px; }
.purchase692-po-drawer > summary small,
.purchase692-settings-drawer > summary small { color: var(--muted); font-weight: 400; }
.purchase692-po-list { display: grid; gap: 8px; margin-top: 14px; }
.purchase692-po-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px; border: 1px solid var(--border); border-radius: 12px; }
.purchase692-po-row > div:first-child strong,
.purchase692-po-row > div:first-child span { display: block; }
.purchase692-po-row > div:first-child span { margin-top: 3px; color: var(--muted); font-size: .86rem; }
.purchase692-back { margin-bottom: 12px; }
.purchase692-back a { color: var(--accent); text-decoration: none; font-weight: 700; }
.purchase692-form-card { max-width: 100%; }
.purchase692-header-grid { grid-template-columns: minmax(260px, 1.5fr) minmax(160px, .7fr) minmax(160px, .7fr); }
.purchase692-invoice-header-grid { grid-template-columns: minmax(260px, 1.3fr) repeat(3, minmax(160px, .7fr)); align-items: end; }
.purchase692-wide { min-width: 0; }
.purchase692-lines-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.purchase692-lines-head h3,
.purchase692-lines-head p { margin: 0; }
.purchase692-lines-head p { margin-top: 3px; color: var(--muted); }
.purchase692-order-lines,
.purchase692-invoice-lines { display: grid; gap: 10px; }
.purchase692-order-row { display: grid; grid-template-columns: minmax(240px, 1.5fr) 110px minmax(140px, .7fr) minmax(145px, .75fr) minmax(130px, .65fr) 42px; align-items: start; gap: 10px; padding: 12px; border: 1px solid var(--border); border-radius: 14px; background: var(--surface); }
.purchase692-product { min-width: 0; }
.purchase692-row-more { min-width: 0; }
.purchase692-row-more > summary { min-height: 42px; display: flex; align-items: center; cursor: pointer; color: var(--accent); font-weight: 700; }
.purchase692-more-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; min-width: 270px; padding: 10px; border: 1px solid var(--border); border-radius: 12px; background: var(--surface-soft); }
.purchase692-footer { position: sticky; bottom: 0; z-index: 5; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 14px 16px; border: 1px solid var(--border); border-radius: 14px; background: color-mix(in srgb, var(--surface) 94%, transparent); backdrop-filter: blur(10px); box-shadow: 0 -8px 30px rgba(15, 23, 42, .06); }
.purchase692-footer > div:first-child span,
.purchase692-footer > div:first-child strong { display: block; }
.purchase692-footer > div:first-child span { color: var(--muted); font-size: .82rem; }
.purchase692-invoice-head { align-items: flex-start; }
.purchase692-po-picker { padding: 0; border: 1px solid var(--border); border-radius: 14px; background: var(--surface-soft); }
.purchase692-po-picker > summary { display: flex; align-items: center; gap: 8px; padding: 12px 14px; cursor: pointer; font-weight: 700; }
.purchase692-po-picker > summary small { color: var(--muted); font-weight: 400; }
.purchase692-po-choices { display: grid; gap: 8px; padding: 0 12px 12px; }
.purchase692-po-choice { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 11px 12px; border: 1px solid var(--border); border-radius: 12px; color: inherit; text-decoration: none; background: var(--surface); }
.purchase692-po-choice:hover,
.purchase692-po-choice.is-selected { border-color: var(--accent); }
.purchase692-po-choice span strong,
.purchase692-po-choice span small { display: block; }
.purchase692-po-choice span small { margin-top: 2px; color: var(--muted); }
.purchase692-po-choice b { color: var(--accent); }
.purchase692-readonly-field { min-height: 42px; display: flex; flex-direction: column; justify-content: center; padding: 8px 11px; border: 1px solid var(--border); border-radius: var(--radius-sm); background: var(--surface-soft); }
.purchase692-readonly-field span { margin-top: 2px; color: var(--muted); font-size: .78rem; }
.purchase692-po-product { display: grid; gap: 8px; padding: 12px; border: 1px solid var(--border); border-radius: 15px; background: var(--surface-soft); }
.purchase692-po-product-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.purchase692-po-product-head strong,
.purchase692-po-product-head span { display: block; }
.purchase692-po-product-head span { margin-top: 2px; color: var(--muted); font-size: .84rem; }
.purchase692-invoice-row-edit { display: grid; grid-template-columns: minmax(105px, .6fr) minmax(110px, .55fr) minmax(130px, .7fr) minmax(140px, .75fr) minmax(140px, .75fr) minmax(115px, .55fr) 42px; align-items: start; gap: 9px; padding: 11px; border: 1px solid var(--border); border-radius: 13px; background: var(--surface); }
.purchase692-invoice-row-edit .purchase692-product { grid-column: span 2; }
.purchase692-invoice-row-edit.has-danger { border-color: color-mix(in srgb, var(--danger) 50%, var(--border)); }
.purchase692-static-value { min-height: 42px; display: flex; align-items: center; padding: 0 10px; border: 1px solid var(--border); border-radius: var(--radius-sm); background: var(--surface-soft); }
.purchase692-row-alert { grid-column: 1 / -2; min-height: 0; color: #b45309; font-size: .8rem; }
.purchase692-row-alert[hidden] { display: none; }
.purchase692-extra-details > summary { cursor: pointer; color: var(--accent); font-weight: 700; }
.purchase692-live-total span,
.purchase692-live-total strong,
.purchase692-live-total small { display: block; }
.purchase692-live-total strong { font-size: 1.18rem; }
.purchase692-live-total small { margin-top: 2px; color: var(--muted); }
.purchase692-review-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 14px; }
.purchase692-review-head h2,
.purchase692-review-head p { margin: 0; }
.purchase692-review-head p { margin-top: 4px; color: var(--muted); }
.purchase692-review-head-meta { display: flex; align-items: center; gap: 12px; }
.purchase692-review-head-meta > strong { font-size: 1.15rem; }
.purchase692-success-panel { display: flex; align-items: center; gap: 12px; margin-bottom: 14px; padding: 14px 16px; border-radius: 14px; background: var(--success-soft); color: var(--success); }
.purchase692-success-panel strong,
.purchase692-success-panel p { display: block; margin: 0; }
.purchase692-success-panel p { margin-top: 3px; color: var(--text-soft); }
.purchase692-attention-card { margin-bottom: 14px; border-color: color-mix(in srgb, #f59e0b 35%, var(--border)); }
.purchase692-attention-title { display: flex; gap: 10px; align-items: flex-start; }
.purchase692-attention-title strong,
.purchase692-attention-title p { display: block; margin: 0; }
.purchase692-attention-title p { margin-top: 3px; color: var(--muted); }
.purchase692-attention-card ul { margin: 10px 0 0 22px; }
.purchase692-review-items { margin-bottom: 14px; }
.purchase692-review-action { margin-bottom: 14px; }
.purchase692-approval-box { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; padding: 12px; border: 1px solid var(--border); border-radius: 13px; background: var(--surface-soft); }
.purchase692-approval-box > p { grid-column: 1 / -1; margin: 0; }
.purchase692-reason-form { max-width: 680px; }
.purchase692-review-buttons { justify-content: flex-end; }
.purchase692-cancel-box { margin-top: 4px; }
.purchase692-cancel-box > summary { cursor: pointer; color: var(--danger); font-weight: 700; }
.warning-text { color: #b45309; }
.optional { color: var(--muted); font-weight: 400; font-size: .78rem; }

@media (max-width: 1180px) {
  .purchase692-invoice-header-grid { grid-template-columns: 1fr 1fr; }
  .purchase692-wide { grid-column: 1 / -1; }
  .purchase692-invoice-row-edit { grid-template-columns: repeat(3, minmax(130px, 1fr)); }
  .purchase692-invoice-row-edit .purchase692-product { grid-column: span 2; }
  .purchase692-row-alert { grid-column: 1 / -1; }
}
@media (max-width: 850px) {
  .purchase692-invoice-row { grid-template-columns: 1fr auto; }
  .purchase692-invoice-meta { grid-column: 1 / -1; justify-content: flex-start; }
  .purchase692-invoice-meta > strong { margin-left: auto; }
  .purchase692-order-row { grid-template-columns: 1fr 1fr; }
  .purchase692-order-row .purchase692-product { grid-column: 1 / -1; }
  .purchase692-header-grid,
  .purchase692-invoice-header-grid { grid-template-columns: 1fr 1fr; }
  .purchase692-footer { position: static; align-items: stretch; flex-direction: column; }
  .purchase692-footer .button-row { justify-content: flex-end; }
  .purchase692-approval-box { grid-template-columns: 1fr; }
  .purchase692-approval-box > p { grid-column: auto; }
}
@media (max-width: 640px) {
  .purchase692-primary-actions { align-items: stretch; flex-direction: column; }
  .purchase692-primary-actions .btn { width: 100%; }
  .purchase692-invoice-row,
  .purchase692-po-row { align-items: stretch; grid-template-columns: 1fr; }
  .purchase692-po-row { display: grid; }
  .purchase692-invoice-row > .btn { width: 100%; }
  .purchase692-header-grid,
  .purchase692-invoice-header-grid,
  .purchase692-order-row,
  .purchase692-invoice-row-edit { grid-template-columns: 1fr; }
  .purchase692-wide,
  .purchase692-order-row .purchase692-product,
  .purchase692-invoice-row-edit .purchase692-product { grid-column: auto; }
  .purchase692-po-product-head,
  .purchase692-review-head,
  .purchase692-review-head-meta { align-items: flex-start; flex-direction: column; }
  .purchase692-footer .button-row,
  .purchase692-review-buttons { width: 100%; flex-direction: column; }
  .purchase692-footer .btn,
  .purchase692-review-buttons .btn,
  .purchase692-review-buttons form { width: 100%; }
  .purchase692-review-buttons form .btn { width: 100%; }
}

/* Sprint 6.9A.3 — purchase action cards and guided worklist ------------ */
.purchase693-home {
  display: grid;
  gap: 16px;
}

.purchase693-page-intro {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 20px;
}

.purchase693-page-intro h2,
.purchase693-page-intro p,
.purchase693-worklist-head h3,
.purchase693-worklist-head p,
.purchase693-document-heading h3,
.purchase693-document-heading p {
  margin: 0;
}

.purchase693-page-intro h2 {
  margin-top: 4px;
}

.purchase693-page-intro p,
.purchase693-worklist-head p,
.purchase693-document-heading p {
  margin-top: 4px;
  color: var(--muted);
}

.purchase693-primary-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  flex-wrap: wrap;
}

.purchase693-action-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.purchase693-action-card {
  position: relative;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 13px;
  min-height: 126px;
  padding: 18px;
  border: 1px solid var(--border);
  border-radius: 16px;
  background: var(--surface);
  color: inherit;
  text-decoration: none;
  box-shadow: var(--shadow-sm);
  transition: border-color .16s ease, transform .16s ease, box-shadow .16s ease;
}

.purchase693-action-card:hover,
.purchase693-action-card:focus-visible,
.purchase693-action-card.is-active {
  border-color: var(--accent);
  box-shadow: 0 12px 30px color-mix(in srgb, var(--accent) 10%, transparent);
  transform: translateY(-1px);
}

.purchase693-action-card.is-active::after {
  position: absolute;
  inset: auto 16px 0;
  height: 3px;
  border-radius: 999px 999px 0 0;
  background: var(--accent);
  content: "";
}

.purchase693-action-icon {
  width: 43px;
  height: 43px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 13px;
  background: var(--surface-soft);
  color: var(--accent);
}

.purchase693-action-card.is-waiting .purchase693-action-icon {
  color: var(--info, var(--accent));
}

.purchase693-action-card.is-review .purchase693-action-icon {
  color: var(--warning);
}

.purchase693-action-content {
  min-width: 0;
  display: grid;
  gap: 3px;
}

.purchase693-action-content b {
  font-size: 1.65rem;
  line-height: 1;
}

.purchase693-action-content strong {
  font-size: .98rem;
}

.purchase693-action-content small {
  color: var(--muted);
  line-height: 1.35;
}

.purchase693-action-arrow {
  color: var(--muted);
  font-size: 1.2rem;
}

.purchase693-worklist {
  padding: 0;
  overflow: hidden;
}

.purchase693-worklist-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 18px;
  padding: 20px 20px 14px;
}

.purchase693-search {
  width: min(360px, 100%);
}

.purchase693-filter-row {
  display: flex;
  gap: 8px;
  padding: 0 20px 14px;
  overflow-x: auto;
  scrollbar-width: thin;
}

.purchase693-filter-chip {
  flex: 0 0 auto;
  min-height: 36px;
  padding: 7px 11px;
  border: 1px solid var(--border);
  border-radius: 999px;
  background: var(--surface);
  color: var(--muted);
  cursor: pointer;
  font: inherit;
  font-size: .82rem;
  font-weight: 700;
}

.purchase693-filter-chip b {
  margin-left: 4px;
  color: var(--text);
}

.purchase693-filter-chip:hover,
.purchase693-filter-chip.is-active {
  border-color: var(--accent);
  background: color-mix(in srgb, var(--accent) 9%, var(--surface));
  color: var(--accent);
}

.purchase693-task-list {
  display: grid;
  border-top: 1px solid var(--border);
}

.purchase693-task-row {
  display: grid;
  grid-template-columns: 5px minmax(0, 1fr) minmax(110px, auto) auto;
  align-items: center;
  gap: 14px;
  padding: 15px 20px;
  border-bottom: 1px solid var(--border);
  background: var(--surface);
}

.purchase693-task-row:last-of-type {
  border-bottom: 0;
}

.purchase693-task-row:hover {
  background: color-mix(in srgb, var(--surface-soft) 72%, var(--surface));
}

.purchase693-task-marker {
  align-self: stretch;
  min-height: 54px;
  border-radius: 999px;
  background: var(--accent);
}

.purchase693-task-marker.is-waiting {
  background: var(--info, var(--accent));
}

.purchase693-task-marker.is-review {
  background: var(--warning);
}

.purchase693-task-main {
  min-width: 0;
  display: grid;
  gap: 3px;
}

.purchase693-task-title {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.purchase693-task-main > span,
.purchase693-task-main > small,
.purchase693-task-amount > span {
  color: var(--muted);
}

.purchase693-task-main > small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.purchase693-task-status {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 3px 8px;
  border-radius: 999px;
  background: var(--surface-soft);
  color: var(--muted);
  font-size: .72rem;
  font-weight: 800;
}

.purchase693-task-status.is-info {
  color: var(--accent);
  background: color-mix(in srgb, var(--accent) 10%, transparent);
}

.purchase693-task-status.is-warning {
  color: #b45309;
  background: color-mix(in srgb, var(--warning) 14%, transparent);
}

.purchase693-task-status.is-success {
  color: var(--success);
  background: color-mix(in srgb, var(--success) 12%, transparent);
}

.purchase693-task-amount {
  min-width: 120px;
  display: grid;
  gap: 2px;
  text-align: right;
}

.purchase693-task-amount span {
  font-size: .72rem;
}

.purchase693-task-empty {
  padding: 34px 20px;
}

.purchase693-all-documents > summary {
  display: flex;
  align-items: center;
  gap: 12px;
  cursor: pointer;
  list-style: none;
}

.purchase693-all-documents > summary::-webkit-details-marker {
  display: none;
}

.purchase693-all-documents > summary > span:last-child {
  display: grid;
  gap: 2px;
}

.purchase693-all-documents > summary small {
  color: var(--muted);
  font-weight: 400;
}

.purchase693-document-section {
  margin-top: 18px;
  padding-top: 18px;
  border-top: 1px solid var(--border);
}

.purchase693-document-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 10px;
}

.purchase693-document-status {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 16px;
  padding: 20px;
  border: 1px solid var(--border);
  border-left-width: 5px;
  border-radius: 16px;
  background: var(--surface);
  box-shadow: var(--shadow-sm);
}

.purchase693-document-status.is-info {
  border-left-color: var(--accent);
}

.purchase693-document-status.is-warning {
  border-left-color: var(--warning);
}

.purchase693-document-status.is-success {
  border-left-color: var(--success);
}

.purchase693-document-status.is-danger {
  border-left-color: var(--danger);
}

.purchase693-document-status-icon {
  width: 48px;
  height: 48px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 14px;
  background: var(--surface-soft);
  color: var(--accent);
}

.purchase693-document-status.is-warning .purchase693-document-status-icon {
  color: var(--warning);
}

.purchase693-document-status.is-success .purchase693-document-status-icon {
  color: var(--success);
}

.purchase693-document-status.is-danger .purchase693-document-status-icon {
  color: var(--danger);
}

.purchase693-document-status-main h2,
.purchase693-document-status-main p {
  margin: 0;
}

.purchase693-document-status-main h2 {
  margin-top: 3px;
}

.purchase693-document-status-main p {
  margin-top: 5px;
  color: var(--muted);
}

.purchase693-document-meta {
  display: flex;
  align-items: center;
  gap: 8px 14px;
  flex-wrap: wrap;
  margin-top: 10px;
  font-size: .82rem;
}

.purchase693-document-meta span {
  color: var(--muted);
}

.purchase693-document-status-action {
  display: flex;
  justify-content: flex-end;
}

.purchase693-blocker-card {
  border-color: color-mix(in srgb, var(--warning) 40%, var(--border));
}

.purchase693-blocker-head {
  display: flex;
  align-items: flex-start;
  gap: 11px;
}

.purchase693-blocker-head > svg {
  color: var(--warning);
}

.purchase693-blocker-head strong,
.purchase693-blocker-head p {
  display: block;
  margin: 0;
}

.purchase693-blocker-head p {
  margin-top: 3px;
  color: var(--muted);
}

.purchase693-blocker-card ul {
  margin: 14px 0 0 22px;
}

@media (max-width: 980px) {
  .purchase693-action-grid {
    grid-template-columns: 1fr;
  }

  .purchase693-action-card {
    min-height: 104px;
  }

  .purchase693-task-row {
    grid-template-columns: 5px minmax(0, 1fr) auto;
  }

  .purchase693-task-amount {
    display: none;
  }
}

@media (max-width: 720px) {
  .purchase693-page-intro,
  .purchase693-worklist-head,
  .purchase693-document-heading {
    align-items: stretch;
    flex-direction: column;
  }

  .purchase693-primary-actions,
  .purchase693-primary-actions .btn,
  .purchase693-search {
    width: 100%;
  }

  .purchase693-primary-actions .btn {
    justify-content: center;
  }

  .purchase693-task-row {
    grid-template-columns: 4px minmax(0, 1fr);
    align-items: start;
  }

  .purchase693-task-action {
    grid-column: 2;
    width: 100%;
    justify-content: center;
  }

  .purchase693-task-main > small {
    white-space: normal;
  }

  .purchase693-document-status {
    grid-template-columns: auto minmax(0, 1fr);
    align-items: start;
  }

  .purchase693-document-status-action {
    grid-column: 1 / -1;
  }

  .purchase693-document-status-action,
  .purchase693-document-status-action form,
  .purchase693-document-status-action .btn {
    width: 100%;
  }

  .purchase693-document-status-action .btn {
    justify-content: center;
  }
}

/* Sprint 6.9A.4 — pembelian dua tab & pembayaran supplier ------------- */
.purchase694-shell,
.purchase694-detail,
.purchase694-payment-page {
  display: grid;
  gap: 16px;
}

.purchase694-tabs {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  width: min(620px, 100%);
  padding: 6px;
  border: 1px solid var(--border);
  border-radius: 16px;
  background: var(--surface);
  box-shadow: var(--shadow-sm);
}

.purchase694-tab {
  min-width: 0;
  min-height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  padding: 10px 14px;
  border-radius: 11px;
  color: var(--muted);
  font-weight: 800;
  transition: background .16s ease, color .16s ease, box-shadow .16s ease;
}

.purchase694-tab:hover {
  color: var(--accent);
  background: var(--accent-soft);
}

.purchase694-tab.is-active {
  color: #fff;
  background: var(--accent);
  box-shadow: 0 8px 20px rgba(var(--accent-rgb), .22);
}

.purchase694-tab b {
  min-width: 24px;
  min-height: 24px;
  display: inline-grid;
  place-items: center;
  padding: 2px 7px;
  border-radius: 999px;
  background: var(--surface-3);
  color: var(--text-soft);
  font-size: 11px;
}

.purchase694-tab.is-active b {
  background: rgba(255, 255, 255, .2);
  color: #fff;
}

.purchase694-panel {
  padding: 0;
  overflow: hidden;
}

.purchase694-panel-head,
.purchase694-detail-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 18px;
  padding: 22px;
}

.purchase694-panel-head h2,
.purchase694-panel-head p,
.purchase694-detail-head h2,
.purchase694-detail-head p,
.purchase694-section-title h3,
.purchase694-section-title p {
  margin: 0;
}

.purchase694-panel-head h2,
.purchase694-detail-head h2 {
  margin-top: 5px;
  line-height: 1.2;
}

.purchase694-panel-head p,
.purchase694-detail-head p,
.purchase694-section-title p {
  margin-top: 5px;
  color: var(--muted);
}

.purchase694-two-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 9px;
  flex-wrap: wrap;
}

.purchase694-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 14px 22px;
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
  background: var(--surface-2);
}

.purchase694-toolbar-wrap {
  flex-wrap: wrap;
}

.purchase694-search {
  width: min(410px, 100%);
}

.purchase694-count {
  display: flex;
  align-items: baseline;
  gap: 7px;
  color: var(--muted);
}

.purchase694-count strong {
  color: var(--text);
  font-size: 1rem;
}

.purchase694-filters {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 3px;
  overflow-x: auto;
  scrollbar-width: thin;
}

.purchase694-filter {
  flex: 0 0 auto;
  min-height: 34px;
  display: inline-flex;
  align-items: center;
  padding: 7px 11px;
  border: 1px solid transparent;
  border-radius: 999px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 750;
}

.purchase694-filter:hover,
.purchase694-filter.is-active {
  border-color: rgba(var(--accent-rgb), .28);
  background: var(--accent-soft);
  color: var(--accent);
}

.purchase694-list {
  display: grid;
}

.purchase694-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(150px, auto) auto;
  align-items: center;
  gap: 18px;
  min-height: 84px;
  padding: 15px 22px;
  border-bottom: 1px solid var(--border);
  background: var(--surface);
}

.purchase694-row:last-child {
  border-bottom: 0;
}

.purchase694-row:hover {
  background: color-mix(in srgb, var(--surface-2) 70%, var(--surface));
}

.purchase694-invoice-row {
  grid-template-columns: 28px minmax(0, 1fr) minmax(160px, auto) auto;
}

.purchase694-row-main,
.purchase694-row-value {
  min-width: 0;
  display: grid;
  gap: 3px;
}

.purchase694-row-title {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.purchase694-row-title strong {
  overflow-wrap: anywhere;
}

.purchase694-row-main > span,
.purchase694-row-main > small,
.purchase694-row-value > span,
.purchase694-row-value > small {
  color: var(--muted);
}

.purchase694-row-main > small,
.purchase694-row-value > small {
  font-size: 12px;
}

.purchase694-row-value {
  justify-items: end;
  text-align: right;
}

.purchase694-row-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 7px;
  flex-wrap: wrap;
}

.purchase694-row-actions form {
  margin: 0;
}

.purchase694-check,
.purchase694-check-spacer {
  width: 28px;
  min-width: 28px;
  display: grid;
  place-items: center;
}

.purchase694-check input {
  width: 17px;
  height: 17px;
  accent-color: var(--accent);
  cursor: pointer;
}

.purchase694-check.is-disabled {
  opacity: .35;
}

.purchase694-payable-strip {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
  background: var(--surface);
}

.purchase694-payable-strip > * {
  min-width: 0;
  display: grid;
  gap: 3px;
  padding: 14px 22px;
  border-right: 1px solid var(--border);
}

.purchase694-payable-strip > *:last-child {
  border-right: 0;
}

.purchase694-payable-strip a:hover {
  background: var(--accent-soft);
}

.purchase694-payable-strip span {
  color: var(--muted);
  font-size: 12px;
}

.purchase694-payable-strip strong {
  overflow-wrap: anywhere;
  font-size: 1rem;
}

.purchase694-bulkbar {
  position: sticky;
  top: calc(var(--topbar-height) + 8px);
  z-index: 8;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 22px;
  border-bottom: 1px solid rgba(var(--accent-rgb), .2);
  background: color-mix(in srgb, var(--accent-soft) 88%, var(--surface));
  box-shadow: var(--shadow-sm);
}

.purchase694-settings {
  padding: 0;
  overflow: hidden;
}

.purchase694-settings > summary {
  padding: 15px 18px;
  cursor: pointer;
  font-weight: 750;
}

.purchase694-settings form {
  padding: 0 18px 18px;
}

.purchase694-settings-action {
  align-self: end;
}

.purchase694-payment-terms {
  display: grid;
  gap: 13px;
  padding: 18px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface-2);
}

.purchase694-section-title {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.purchase694-term-options {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 9px;
}

.purchase694-term-option {
  position: relative;
  display: block;
  cursor: pointer;
}

.purchase694-term-option input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.purchase694-term-option span {
  min-height: 74px;
  display: grid;
  align-content: center;
  gap: 3px;
  padding: 13px 14px;
  border: 1px solid var(--border);
  border-radius: 13px;
  background: var(--surface);
  transition: border-color .15s ease, background .15s ease, box-shadow .15s ease;
}

.purchase694-term-option strong {
  font-size: 14px;
}

.purchase694-term-option small {
  color: var(--muted);
  line-height: 1.35;
}

.purchase694-term-option input:checked + span {
  border-color: var(--accent);
  background: var(--accent-soft);
  box-shadow: 0 0 0 2px rgba(var(--accent-rgb), .11);
}

.purchase694-term-option input:focus-visible + span {
  outline: 3px solid rgba(var(--accent-rgb), .18);
  outline-offset: 2px;
}

.purchase694-term-panel,
.purchase694-payment-now,
.purchase694-consignment-note {
  padding-top: 3px;
}

.purchase694-payment-now[hidden],
.purchase694-term-panel[hidden],
.purchase694-consignment-note[hidden] {
  display: none !important;
}

.purchase694-pay-now-toggle {
  align-self: end;
  min-height: 43px;
}

.purchase694-pay-now-toggle.is-hidden {
  visibility: hidden;
}

.purchase694-consignment-note {
  padding: 11px 13px;
  border: 1px solid color-mix(in srgb, var(--warning) 32%, var(--border));
  border-radius: 11px;
  background: var(--warning-soft);
  color: var(--text-soft);
}

.purchase694-detail-head {
  grid-template-columns: minmax(0, 1fr) auto auto;
  border-left: 4px solid var(--accent);
}

.purchase694-detail-badges {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 7px;
  flex-wrap: wrap;
}

.purchase694-detail-total {
  min-width: 155px;
  display: grid;
  gap: 2px;
  justify-items: end;
  text-align: right;
}

.purchase694-detail-total span,
.purchase694-detail-total small {
  color: var(--muted);
}

.purchase694-detail-total strong {
  font-size: 1.08rem;
}

.purchase694-inline-warning {
  margin: 0;
}

.purchase694-detail-card {
  overflow: hidden;
}

.purchase694-final-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 9px;
  margin-top: 15px;
  flex-wrap: wrap;
}

.purchase694-reason {
  padding: 14px;
  border: 1px solid color-mix(in srgb, var(--warning) 35%, var(--border));
  border-radius: 13px;
  background: var(--warning-soft);
}

.purchase694-cancel {
  margin-top: 18px;
  border-top: 1px solid var(--border);
  padding-top: 13px;
}

.purchase694-cancel > summary,
.purchase694-payment-history-row details > summary {
  cursor: pointer;
  color: var(--danger);
  font-size: 12px;
  font-weight: 750;
}

.purchase694-payment-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 9px;
  margin-bottom: 14px;
}

.purchase694-payment-summary > div {
  display: grid;
  gap: 3px;
  padding: 12px 13px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--surface-2);
}

.purchase694-payment-summary span,
.purchase694-payment-history-row span,
.purchase694-payment-history-row small,
.purchase694-allocation-row span,
.purchase694-payment-footer span,
.purchase694-payment-footer small {
  color: var(--muted);
}

.purchase694-payment-history {
  display: grid;
  border: 1px solid var(--border);
  border-radius: 13px;
  overflow: hidden;
}

.purchase694-payment-history-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  align-items: center;
  gap: 14px;
  padding: 12px 14px;
  border-bottom: 1px solid var(--border);
}

.purchase694-payment-history-row:last-child {
  border-bottom: 0;
}

.purchase694-payment-history-row > div:first-child {
  min-width: 0;
  display: grid;
  gap: 2px;
}

.purchase694-payment-history-row details form {
  min-width: 230px;
  margin-top: 8px;
}

.purchase694-payment-page {
  width: min(920px, 100%);
  margin-inline: auto;
}

.purchase694-payment-card {
  overflow: hidden;
}

.purchase694-payment-card > form {
  padding-top: 4px;
}

.purchase694-allocation-list {
  display: grid;
  border: 1px solid var(--border);
  border-radius: 14px;
  overflow: hidden;
}

.purchase694-allocation-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(130px, auto) minmax(170px, .55fr);
  align-items: end;
  gap: 16px;
  padding: 14px;
  border-bottom: 1px solid var(--border);
  background: var(--surface);
}

.purchase694-allocation-row:last-child {
  border-bottom: 0;
}

.purchase694-allocation-row > div:first-child,
.purchase694-allocation-row > div:nth-child(2) {
  display: grid;
  gap: 3px;
}

.purchase694-allocation-row > div:nth-child(2) {
  justify-items: end;
  text-align: right;
}

.purchase694-allocation-row .form-group {
  margin: 0;
}

.purchase694-payment-footer {
  position: sticky;
  bottom: 0;
  z-index: 6;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin: 6px -20px -20px;
  padding: 15px 20px;
  border-top: 1px solid var(--border);
  background: color-mix(in srgb, var(--surface) 94%, transparent);
  backdrop-filter: blur(10px);
}

.purchase694-payment-footer > div {
  display: grid;
  gap: 2px;
}

.purchase694-payment-footer strong {
  font-size: 1.12rem;
}

@media (max-width: 920px) {
  .purchase694-panel-head,
  .purchase694-detail-head {
    grid-template-columns: minmax(0, 1fr) auto;
  }

  .purchase694-detail-total {
    grid-column: 1 / -1;
    width: 100%;
    grid-template-columns: auto auto 1fr;
    align-items: baseline;
    justify-items: start;
    gap: 8px;
    padding-top: 11px;
    border-top: 1px solid var(--border);
    text-align: left;
  }

  .purchase694-row,
  .purchase694-invoice-row {
    grid-template-columns: 28px minmax(0, 1fr) auto;
  }

  .purchase694-row:not(.purchase694-invoice-row) {
    grid-template-columns: minmax(0, 1fr) auto;
  }

  .purchase694-row-value {
    display: none;
  }

  .purchase694-term-options {
    grid-template-columns: 1fr;
  }

  .purchase694-term-option span {
    min-height: 60px;
  }
}

@media (max-width: 720px) {
  .purchase694-tabs {
    width: 100%;
  }

  .purchase694-tab {
    padding-inline: 9px;
    font-size: 12px;
  }

  .purchase694-panel-head,
  .purchase694-detail-head,
  .purchase694-toolbar {
    align-items: stretch;
    grid-template-columns: 1fr;
    flex-direction: column;
  }

  .purchase694-panel-head,
  .purchase694-detail-head {
    padding: 18px;
  }

  .purchase694-two-actions,
  .purchase694-two-actions .btn,
  .purchase694-panel-head > .btn,
  .purchase694-search {
    width: 100%;
  }

  .purchase694-two-actions .btn,
  .purchase694-panel-head > .btn {
    justify-content: center;
  }

  .purchase694-payable-strip {
    grid-template-columns: 1fr;
  }

  .purchase694-payable-strip > * {
    border-right: 0;
    border-bottom: 1px solid var(--border);
  }

  .purchase694-payable-strip > *:last-child {
    border-bottom: 0;
  }

  .purchase694-filters {
    width: 100%;
  }

  .purchase694-row,
  .purchase694-row:not(.purchase694-invoice-row),
  .purchase694-invoice-row {
    grid-template-columns: 28px minmax(0, 1fr);
    align-items: start;
    gap: 10px 12px;
    padding: 14px 16px;
  }

  .purchase694-row:not(.purchase694-invoice-row) .purchase694-row-main {
    grid-column: 1 / -1;
  }

  .purchase694-row-actions {
    grid-column: 2;
    width: 100%;
    justify-content: flex-start;
  }

  .purchase694-row:not(.purchase694-invoice-row) .purchase694-row-actions {
    grid-column: 1 / -1;
  }

  .purchase694-row-actions .btn,
  .purchase694-row-actions form {
    flex: 1 1 auto;
  }

  .purchase694-row-actions form .btn {
    width: 100%;
    justify-content: center;
  }

  .purchase694-bulkbar {
    top: calc(var(--topbar-height) + 4px);
    padding-inline: 16px;
  }

  .purchase694-detail-badges {
    justify-content: flex-start;
  }

  .purchase694-detail-total {
    grid-column: auto;
    grid-template-columns: 1fr;
  }

  .purchase694-payment-summary {
    grid-template-columns: 1fr;
  }

  .purchase694-payment-history-row {
    grid-template-columns: minmax(0, 1fr) auto;
  }

  .purchase694-payment-history-row details {
    grid-column: 1 / -1;
  }

  .purchase694-payment-history-row details form {
    min-width: 0;
  }

  .purchase694-allocation-row {
    grid-template-columns: 1fr;
    align-items: stretch;
  }

  .purchase694-allocation-row > div:nth-child(2) {
    grid-template-columns: auto auto;
    justify-content: space-between;
    justify-items: initial;
    text-align: left;
  }

  .purchase694-payment-footer {
    align-items: stretch;
    flex-direction: column;
  }

  .purchase694-payment-footer .btn {
    width: 100%;
    justify-content: center;
  }
}

.purchase694-order-document {
  width: min(1050px, 100%);
  margin-inline: auto;
}

.purchase694-order-sheet {
  padding: 0;
  overflow: hidden;
}

.purchase694-order-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
  gap: 20px;
  padding: 24px;
  border-bottom: 1px solid var(--border);
}

.purchase694-order-head h2,
.purchase694-order-head p {
  margin: 0;
}

.purchase694-order-head h2 {
  margin-top: 5px;
}

.purchase694-order-head p {
  margin-top: 5px;
  color: var(--muted);
}

.purchase694-order-meta {
  min-width: 220px;
  display: grid;
  justify-items: end;
  gap: 12px;
}

.purchase694-order-meta dl {
  display: grid;
  gap: 6px;
  margin: 0;
}

.purchase694-order-meta dl > div {
  display: grid;
  grid-template-columns: auto auto;
  gap: 14px;
}

.purchase694-order-meta dt {
  color: var(--muted);
}

.purchase694-order-meta dd {
  margin: 0;
  font-weight: 750;
  text-align: right;
}

.purchase694-order-notes {
  margin: 16px 20px 0;
  padding: 13px 14px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--surface-2);
}

.purchase694-order-notes p {
  margin: 5px 0 0;
  color: var(--text-soft);
}

.purchase694-order-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 18px 22px;
  border-top: 1px solid var(--border);
  background: var(--surface-2);
}

.purchase694-order-footer > div:first-child {
  display: grid;
  gap: 2px;
}

.purchase694-order-footer span,
.purchase694-order-footer small {
  color: var(--muted);
}

.purchase694-order-footer strong {
  font-size: 1.12rem;
}

.purchase694-order-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  flex-wrap: wrap;
}

.purchase694-order-actions form {
  margin: 0;
}

@media (max-width: 720px) {
  .purchase694-order-head {
    grid-template-columns: 1fr;
  }

  .purchase694-order-meta {
    min-width: 0;
    justify-items: start;
  }

  .purchase694-order-meta dd {
    text-align: left;
  }

  .purchase694-order-footer {
    align-items: stretch;
    flex-direction: column;
  }

  .purchase694-order-actions,
  .purchase694-order-actions .btn,
  .purchase694-order-actions form {
    width: 100%;
  }

  .purchase694-order-actions .btn {
    justify-content: center;
  }
}

@media print {
  [data-print-page],
  .purchase694-order-actions,
  .page-actions {
    display: none !important;
  }

  .purchase694-order-document,
  .purchase694-order-sheet {
    width: 100% !important;
    border: 0 !important;
    box-shadow: none !important;
  }

  .purchase694-order-head,
  .purchase694-order-footer {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  .purchase694-order-table {
    font-size: 11px;
  }
}

/* Compatibility aliases used by earlier incremental purchase styles. */
:root {
  --surface-soft: var(--surface-2);
  --text-muted: var(--muted);
}

.purchase694-order-identity {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
  gap: 20px;
  padding: 18px 24px;
  border-bottom: 1px solid var(--border);
  background: var(--surface-2);
}

.purchase694-order-identity > div {
  display: grid;
  gap: 2px;
}

.purchase694-order-identity > div:last-child {
  justify-items: end;
  text-align: right;
}

.purchase694-order-identity > div:first-child > strong {
  font-size: 1rem;
}

.purchase694-order-identity span,
.purchase694-order-identity small {
  color: var(--muted);
}

@media (max-width: 720px) {
  .purchase694-order-identity {
    grid-template-columns: 1fr;
  }

  .purchase694-order-identity > div:last-child {
    justify-items: start;
    text-align: left;
  }
}

@media print {
  .purchase694-order-identity {
    padding-left: 0 !important;
    padding-right: 0 !important;
    background: transparent !important;
  }
}

/* Sprint 6.9A.5 — Surat Pesanan, golongan obat, dan Profil & Perizinan */
.purchase695-order-page {
  width: 100%;
  max-width: none;
  display: grid;
  gap: 16px;
}

.purchase695-screen-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
}

.purchase695-screen-header h2,
.purchase695-screen-header p { margin: 0; }
.purchase695-screen-header p { margin-top: 5px; color: var(--muted); }
.purchase695-title-line,
.purchase695-screen-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.purchase695-screen-actions { justify-content: flex-end; }
.purchase695-screen-actions form { margin: 0; }

.purchase695-cancel-summary {
  display: grid;
  gap: 3px;
  margin: 0;
}
.purchase695-cancel-summary span { color: inherit; opacity: .9; }

.purchase695-print-stack {
  width: 100%;
  display: grid;
  gap: 18px;
}
.purchase695-extra-copy { display: none; }

.purchase695-document {
  position: relative;
  width: 100%;
  max-width: none;
  padding: 0;
  overflow: hidden;
  isolation: isolate;
}

.purchase695-watermark {
  position: absolute;
  inset: 42% auto auto 50%;
  z-index: 0;
  transform: translate(-50%, -50%) rotate(-24deg);
  color: color-mix(in srgb, var(--danger) 18%, transparent);
  font-size: clamp(52px, 9vw, 118px);
  font-weight: 900;
  letter-spacing: .08em;
  pointer-events: none;
  white-space: nowrap;
}

.purchase695-document > *:not(.purchase695-watermark) {
  position: relative;
  z-index: 1;
}

.purchase695-document-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 24px;
  padding: 22px 24px;
  border-bottom: 1px solid var(--border);
  background: var(--surface-2);
}

.purchase695-brand {
  min-width: 0;
  display: flex;
  align-items: flex-start;
  gap: 14px;
}
.purchase695-brand img,
.purchase695-logo-placeholder {
  width: 66px;
  height: 66px;
  flex: 0 0 66px;
  border: 1px solid var(--border);
  border-radius: 14px;
  background: var(--surface);
}
.purchase695-brand img { object-fit: contain; padding: 5px; }
.purchase695-logo-placeholder {
  display: grid;
  place-items: center;
  color: var(--accent);
}
.purchase695-logo-placeholder .icon { width: 28px; height: 28px; }
.purchase695-brand > div:last-child { min-width: 0; display: grid; gap: 3px; }
.purchase695-brand strong { font-size: 1.08rem; }
.purchase695-brand span,
.purchase695-brand small { color: var(--muted); line-height: 1.45; }
.purchase695-brand small { display: block; }

.purchase695-copy-label {
  display: grid;
  justify-items: end;
  gap: 6px;
  text-align: right;
}
.purchase695-copy-label strong {
  font-size: clamp(1rem, 2vw, 1.35rem);
  text-transform: uppercase;
  letter-spacing: .035em;
}
.purchase695-copy-label span {
  padding: 4px 8px;
  border: 1px solid var(--border);
  border-radius: 999px;
  color: var(--muted);
  background: var(--surface);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .08em;
}

.purchase695-document-summary {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 22px;
  align-items: start;
  padding: 20px 24px;
  border-bottom: 1px solid var(--border);
}
.purchase695-document-number { display: grid; gap: 4px; }
.purchase695-document-number span { color: var(--muted); }
.purchase695-document-number strong { font-size: clamp(1.25rem, 2.4vw, 1.75rem); letter-spacing: -.025em; }
.purchase695-document-summary dl { display: grid; gap: 7px; margin: 0; min-width: 250px; }
.purchase695-document-summary dl > div {
  display: grid;
  grid-template-columns: auto auto;
  justify-content: space-between;
  gap: 20px;
}
.purchase695-document-summary dt { color: var(--muted); }
.purchase695-document-summary dd { margin: 0; font-weight: 750; text-align: right; }

.purchase695-party-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0;
  border-bottom: 1px solid var(--border);
}
.purchase695-party-grid > div {
  min-width: 0;
  min-height: 130px;
  padding: 18px 24px;
  display: flex;
  flex-direction: column;
  gap: 4px;
  border-right: 1px solid var(--border);
}
.purchase695-party-grid > div:last-child { border-right: 0; }
.purchase695-party-grid strong { margin-top: 3px; }
.purchase695-party-grid small,
.purchase695-party-grid p { color: var(--muted); line-height: 1.5; }
.purchase695-party-grid p { margin: 5px 0 0; }
.purchase695-label {
  color: var(--muted);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .065em;
  text-transform: uppercase;
}

.purchase695-table-wrap { border: 0; }
.purchase695-order-table { min-width: 820px; margin: 0; }
.purchase695-order-table th,
.purchase695-order-table td { vertical-align: top; }
.purchase695-order-table th:first-child,
.purchase695-order-table td:first-child { padding-left: 24px; }
.purchase695-order-table th:last-child,
.purchase695-order-table td:last-child { padding-right: 24px; }
.purchase695-col-no { width: 54px; text-align: center; }
.purchase695-order-table tbody tr:last-child td { border-bottom: 0; }

.purchase695-notes {
  margin: 0 24px 20px;
  padding: 13px 14px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--surface-2);
}
.purchase695-notes p { margin: 5px 0 0; color: var(--text-soft); line-height: 1.55; }

.purchase695-document-footer {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(250px, .42fr);
  gap: 28px;
  align-items: start;
  padding: 20px 24px 24px;
  border-top: 1px solid var(--border);
  background: var(--surface-2);
}
.purchase695-document-totals { display: grid; gap: 4px; }
.purchase695-document-totals span,
.purchase695-document-totals small { color: var(--muted); }
.purchase695-document-totals strong { font-size: 1.18rem; }

.purchase695-signature {
  position: relative;
  min-height: 190px;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 3px;
}
.purchase695-signature > span,
.purchase695-signature small { color: var(--muted); }
.purchase695-signature-space { height: 72px; }
.purchase695-signature em {
  position: absolute;
  right: 0;
  bottom: 4px;
  padding: 18px 12px;
  border: 1px dashed var(--border-strong, var(--border));
  border-radius: 50%;
  color: var(--muted);
  font-size: 9px;
  font-style: normal;
  transform: rotate(-8deg);
}
.purchase695-footer-note,
.purchase695-cancel-print {
  padding: 10px 24px;
  border-top: 1px solid var(--border);
  color: var(--muted);
  font-size: 11px;
  text-align: center;
}
.purchase695-cancel-print { color: var(--danger); font-weight: 800; }

.purchase695-action-panels { display: grid; gap: 10px; }
.purchase695-action-panel {
  border: 1px solid var(--border);
  border-radius: 14px;
  overflow: hidden;
  background: var(--surface);
}
.purchase695-action-panel > summary {
  padding: 14px 16px;
  cursor: pointer;
  list-style: none;
  font-weight: 800;
}
.purchase695-action-panel > summary::-webkit-details-marker { display: none; }
.purchase695-action-panel > form {
  padding: 0 16px 16px;
  border-top: 1px solid var(--border);
}
.purchase695-action-panel > form .form-group { margin-top: 14px; }
.purchase695-danger-panel { border-color: color-mix(in srgb, var(--danger) 32%, var(--border)); }
.purchase695-danger-panel > summary { color: var(--danger); }

.settings695-grid { align-items: start; }
.profile695-card { overflow: hidden; scroll-margin-top: 80px; }
.profile695-card-head { align-items: flex-start; }
.profile695-card-head .eyebrow { margin-bottom: 6px; }
.profile695-form { display: grid; }
.profile695-section {
  padding: 22px;
  border-top: 1px solid var(--border);
}
.profile695-section-head {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 18px;
}
.profile695-section-head h3,
.profile695-section-head p { margin: 0; }
.profile695-section-head p { margin-top: 3px; color: var(--muted); line-height: 1.5; }
.profile695-step {
  width: 32px;
  height: 32px;
  flex: 0 0 32px;
  display: grid;
  place-items: center;
  border-radius: 10px;
  color: var(--accent);
  background: var(--accent-soft);
  font-weight: 850;
}
.profile695-identity-grid {
  display: grid;
  grid-template-columns: 154px minmax(0, 1fr);
  gap: 20px;
  align-items: start;
}
.profile695-logo-box { display: grid; justify-items: center; gap: 9px; }
.profile695-logo-box > small { color: var(--muted); text-align: center; }
.profile695-logo-preview {
  width: 142px;
  height: 142px;
  padding: 10px;
  display: grid;
  place-items: center;
  gap: 7px;
  border: 1px dashed var(--border-strong, var(--border));
  border-radius: 18px;
  background: var(--surface-2);
  color: var(--muted);
  text-align: center;
}
.profile695-logo-preview img { width: 100%; height: 100%; object-fit: contain; }
.profile695-logo-preview span { display: grid; justify-items: center; gap: 6px; }
.profile695-logo-preview .icon { width: 34px; height: 34px; color: var(--accent); }
.profile695-file { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.profile695-fields { align-content: start; }
.profile695-empty {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 14px;
  border: 1px solid var(--border);
  border-radius: 13px;
  background: var(--surface-2);
}
.profile695-empty strong,
.profile695-empty span { display: block; }
.profile695-empty span { margin-top: 3px; color: var(--muted); }
.profile695-savebar {
  position: sticky;
  bottom: 0;
  z-index: 4;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 15px 22px;
  border-top: 1px solid var(--border);
  background: color-mix(in srgb, var(--surface) 92%, transparent);
  backdrop-filter: blur(12px);
}
.profile695-savebar strong,
.profile695-savebar span { display: block; }
.profile695-savebar span { margin-top: 3px; color: var(--muted); font-size: 12px; }

.product-regulatory-inline {
  min-width: 210px;
  display: grid;
  grid-template-columns: minmax(150px, 1fr) auto;
  gap: 7px;
  align-items: center;
}
.product-regulatory-inline .select { min-width: 0; }
.product-regulatory-inline .btn { min-height: 38px; padding-inline: 10px; }

@media (max-width: 1050px) {
  .purchase695-party-grid { grid-template-columns: 1fr 1fr; }
  .purchase695-party-grid > div:nth-child(2) { border-right: 0; }
  .purchase695-party-grid > div:nth-child(3) { grid-column: 1 / -1; border-top: 1px solid var(--border); }
  .settings695-grid { grid-template-columns: 1fr; }
  .settings695-aside { position: static; }
}

@media (max-width: 760px) {
  .purchase695-screen-header,
  .purchase695-document-header,
  .profile695-savebar { align-items: stretch; flex-direction: column; }
  .purchase695-screen-actions,
  .purchase695-screen-actions .btn,
  .purchase695-screen-actions form,
  .purchase695-screen-actions form .btn { width: 100%; }
  .purchase695-screen-actions .btn { justify-content: center; }
  .purchase695-copy-label { justify-items: start; text-align: left; }
  .purchase695-document-summary { grid-template-columns: 1fr; }
  .purchase695-document-summary dl { min-width: 0; }
  .purchase695-party-grid { grid-template-columns: 1fr; }
  .purchase695-party-grid > div,
  .purchase695-party-grid > div:nth-child(2) { border-right: 0; border-top: 1px solid var(--border); }
  .purchase695-party-grid > div:first-child { border-top: 0; }
  .purchase695-party-grid > div:nth-child(3) { grid-column: auto; }
  .purchase695-document-footer { grid-template-columns: 1fr; }
  .purchase695-document-totals { order: 2; }
  .profile695-identity-grid { grid-template-columns: 1fr; }
  .profile695-logo-box { justify-items: start; }
  .profile695-empty { align-items: stretch; flex-direction: column; }
  .profile695-empty .btn,
  .profile695-savebar .btn { width: 100%; justify-content: center; }
  .product-regulatory-inline { grid-template-columns: 1fr; min-width: 170px; }
}

@media print {
  @page { size: A4 portrait; margin: 12mm; }

  body {
    background: #fff !important;
    color: #000 !important;
    print-color-adjust: exact;
    -webkit-print-color-adjust: exact;
  }

  .sidebar,
  .topbar,
  .page-header,
  .page-actions,
  .purchase695-screen-header,
  .purchase695-cancel-summary,
  .purchase695-action-panels,
  [data-print-page] { display: none !important; }

  .app-shell,
  .main-shell,
  .page-content,
  .purchase695-order-page,
  .purchase695-print-stack {
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    background: #fff !important;
  }

  .purchase695-print-copy {
    display: block !important;
    width: 100% !important;
    min-height: 265mm;
    margin: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    overflow: visible !important;
    break-after: page;
    page-break-after: always;
    color: #000 !important;
    background: #fff !important;
  }
  .purchase695-print-copy:last-child { break-after: auto; page-break-after: auto; }

  .purchase695-document-header,
  .purchase695-document-footer,
  .purchase695-notes,
  .purchase695-logo-placeholder {
    color: #000 !important;
    background: #fff !important;
  }
  .purchase695-document-header,
  .purchase695-document-summary,
  .purchase695-party-grid,
  .purchase695-party-grid > div,
  .purchase695-order-table th,
  .purchase695-order-table td,
  .purchase695-document-footer,
  .purchase695-footer-note,
  .purchase695-cancel-print,
  .purchase695-brand img,
  .purchase695-logo-placeholder,
  .purchase695-copy-label span,
  .purchase695-notes {
    border-color: #777 !important;
  }

  .purchase695-document-header { padding: 0 0 5mm; }
  .purchase695-document-summary { padding: 5mm 0; }
  .purchase695-party-grid > div { padding: 4mm 3mm; min-height: 30mm; }
  .purchase695-party-grid > div:first-child { padding-left: 0; }
  .purchase695-party-grid > div:last-child { padding-right: 0; }
  .purchase695-order-table { min-width: 0 !important; width: 100% !important; font-size: 9.5pt; }
  .purchase695-order-table thead { display: table-header-group; }
  .purchase695-order-table tr { break-inside: avoid; page-break-inside: avoid; }
  .purchase695-order-table th:first-child,
  .purchase695-order-table td:first-child { padding-left: 0; }
  .purchase695-order-table th:last-child,
  .purchase695-order-table td:last-child { padding-right: 0; }
  .purchase695-screen-financial { display: none !important; }
  .purchase695-notes { margin: 4mm 0; }
  .purchase695-document-footer { padding: 5mm 0 0; background: #fff !important; }
  .purchase695-footer-note,
  .purchase695-cancel-print { padding: 3mm 0 0; }

  .purchase695-brand span,
  .purchase695-brand small,
  .purchase695-party-grid small,
  .purchase695-party-grid p,
  .purchase695-document-summary dt,
  .purchase695-signature > span,
  .purchase695-signature small,
  .purchase695-label,
  .purchase695-footer-note { color: #222 !important; }

  .purchase695-watermark { color: rgba(220, 38, 38, .18) !important; }
}

@media print {
  .main,
  .page {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    background: #fff !important;
  }
  .overlay { display: none !important; }
}

body:has(.purchase695-order-page) .page {
  max-width: none;
}

.purchase695-order-type-note {
  margin: 0 0 12px;
  padding: 10px 12px;
  border: 1px solid color-mix(in srgb, var(--info) 30%, var(--border));
  border-radius: 11px;
  color: var(--text-soft);
  background: color-mix(in srgb, var(--info) 7%, var(--surface));
  font-size: 12px;
  line-height: 1.5;
}
.purchase695-order-type-note.is-warning {
  border-color: color-mix(in srgb, var(--warning) 40%, var(--border));
  color: var(--warning);
  background: var(--warning-soft);
}

/* Sprint 6.9A.5.1 — formal purchase-order printing */
.product-regulatory-inline {
  display: grid;
  grid-template-columns: minmax(170px, .8fr) minmax(220px, 1.3fr) auto;
  gap: 8px;
  align-items: center;
  min-width: 510px;
}
.product-regulatory-inline .product-print-spec { min-width: 220px; }

.purchase6951-print-page {
  margin: 0;
  min-height: 100vh;
  background: #e9edf3;
  color: #111827;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
.purchase6951-toolbar {
  position: sticky;
  top: 0;
  z-index: 20;
  display: grid;
  grid-template-columns: minmax(220px, 1fr) auto auto;
  gap: 16px;
  align-items: center;
  padding: 12px 20px;
  background: rgba(255, 255, 255, .96);
  border-bottom: 1px solid #d7dde7;
  box-shadow: 0 8px 24px rgba(15, 23, 42, .08);
  backdrop-filter: blur(14px);
}
.purchase6951-toolbar > div:first-child { display: grid; gap: 2px; }
.purchase6951-toolbar > div:first-child span { color: #64748b; font-size: .86rem; }
.purchase6951-print-options,
.purchase6951-toolbar-actions {
  display: flex;
  gap: 9px;
  align-items: end;
}
.purchase6951-print-options label {
  display: grid;
  gap: 4px;
  color: #475569;
  font-size: .76rem;
  font-weight: 750;
}
.purchase6951-print-options .select { min-width: 104px; }
.purchase6951-preview {
  display: grid;
  justify-items: center;
  gap: 26px;
  padding: 28px;
}
.purchase6951-sheet {
  position: relative;
  box-sizing: border-box;
  width: 210mm;
  min-height: 297mm;
  padding: 14mm 15mm 12mm;
  overflow: hidden;
  background: #fff;
  color: #111;
  box-shadow: 0 16px 44px rgba(15, 23, 42, .18);
  font-family: Georgia, "Times New Roman", Times, serif;
  font-size: 10.5pt;
  line-height: 1.42;
}
.purchase6951-paper-f4 .purchase6951-sheet { min-height: 330mm; }
.purchase6951-sheet > *:not(.purchase6951-watermark) { position: relative; z-index: 1; }
.purchase6951-copy-label {
  position: absolute;
  top: 7mm;
  right: 15mm;
  padding: 1.5mm 3mm;
  border: 1px solid #777;
  border-radius: 2px;
  color: #333;
  font-family: Arial, sans-serif;
  font-size: 7.5pt;
  font-weight: 700;
  letter-spacing: .03em;
  text-transform: uppercase;
}
.purchase6951-letterhead {
  display: grid;
  grid-template-columns: 24mm 1fr 24mm;
  gap: 5mm;
  align-items: center;
  min-height: 27mm;
  padding: 0 0 4mm;
  border-bottom: 3px double #111;
  text-align: center;
}
.purchase6951-letterhead::after { content: ""; width: 24mm; }
.purchase6951-letterhead img,
.purchase6951-logo-space {
  width: 22mm;
  height: 22mm;
  object-fit: contain;
}
.purchase6951-letterhead h1 {
  margin: 0;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 16pt;
  line-height: 1.12;
  letter-spacing: .03em;
  text-transform: uppercase;
}
.purchase6951-letterhead p {
  margin: 1px 0 0;
  font-size: 8.5pt;
  line-height: 1.25;
}
.purchase6951-document-title {
  margin: 7mm 0 6mm;
  text-align: center;
}
.purchase6951-document-title h2 {
  display: inline-block;
  margin: 0;
  padding: 0 5mm 1mm;
  border-bottom: 1px solid #111;
  font-size: 13pt;
  letter-spacing: .035em;
}
.purchase6951-document-title p { margin: 1.5mm 0 0; font-size: 10pt; }
.purchase6951-recipient { margin: 0 0 5mm; max-width: 118mm; }
.purchase6951-recipient p { margin: 0; }
.purchase6951-recipient strong { display: block; margin: .5mm 0; font-size: 11pt; }
.purchase6951-letter-body { margin: 0 0 4mm; text-align: justify; }
.purchase6951-letter-body p { margin: 0 0 2mm; }
.purchase6951-table {
  width: 100%;
  margin: 3mm 0 4mm;
  border-collapse: collapse;
  table-layout: fixed;
  font-size: 9.25pt;
}
.purchase6951-table th,
.purchase6951-table td {
  padding: 2.1mm 2mm;
  border: 1px solid #111;
  vertical-align: top;
}
.purchase6951-table th {
  background: #f2f2f2;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 8.2pt;
  line-height: 1.2;
  text-align: center;
}
.purchase6951-table td:first-child { width: 10mm; text-align: center; }
.purchase6951-table td span { display: block; margin-top: .7mm; font-size: 8.5pt; }
.purchase6951-general-table th:nth-child(1) { width: 10mm; }
.purchase6951-general-table th:nth-child(3) { width: 22mm; }
.purchase6951-general-table th:nth-child(4) { width: 22mm; }
.purchase6951-general-table th:nth-child(5) { width: 28mm; }
.purchase6951-controlled-table th:nth-child(1) { width: 10mm; }
.purchase6951-controlled-table th:nth-child(2) { width: 38mm; }
.purchase6951-controlled-table th:nth-child(4) { width: 28mm; }
.purchase6951-controlled-table th:nth-child(5) { width: 37mm; }
.purchase6951-number { text-align: center; white-space: nowrap; }
.purchase6951-identity-intro > p { margin: 0 0 2.5mm; }
.purchase6951-definition-list {
  display: grid;
  gap: 1.25mm;
  margin: 0 0 5mm;
}
.purchase6951-definition-list > div {
  display: grid;
  grid-template-columns: 38mm 4mm 1fr;
  align-items: start;
}
.purchase6951-definition-list > div::before {
  content: ":";
  grid-column: 2;
  grid-row: 1;
}
.purchase6951-definition-list dt { grid-column: 1; font-weight: 400; }
.purchase6951-definition-list dd { grid-column: 3; margin: 0; min-width: 0; }
.purchase6951-request-line { margin-top: 4mm !important; }
.purchase6951-narcotic-detail {
  margin: 5mm 0;
  padding: 4mm 5mm;
  border: 1px solid #111;
}
.purchase6951-drug-fields { margin: 0; }
.purchase6951-use-statement { margin: 5mm 0 3mm; text-align: justify; }
.purchase6951-notes {
  margin-top: 4mm;
  padding-top: 2.5mm;
  border-top: 1px solid #999;
  font-size: 9pt;
}
.purchase6951-notes p { margin: 1mm 0 0; }
.purchase6951-closing {
  display: grid;
  grid-template-columns: 1fr 72mm;
  gap: 10mm;
  margin-top: 8mm;
  break-inside: avoid;
  page-break-inside: avoid;
}
.purchase6951-signature-block { text-align: center; }
.purchase6951-signature-block p { margin: 0 0 1.3mm; }
.purchase6951-signature-space {
  display: flex;
  align-items: end;
  justify-content: center;
  height: 24mm;
  color: #777;
  font-size: 7pt;
  font-style: italic;
}
.purchase6951-signature-block strong {
  display: inline-block;
  min-width: 52mm;
  padding-top: 1mm;
  border-bottom: 1px solid #111;
}
.purchase6951-sheet-footer {
  position: absolute !important;
  right: 15mm;
  bottom: 6mm;
  left: 15mm;
  display: flex;
  justify-content: space-between;
  padding-top: 1.5mm;
  border-top: .5px solid #aaa;
  color: #555;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 6.8pt;
}
.purchase6951-watermark {
  position: absolute;
  z-index: 0;
  top: 48%;
  left: 50%;
  transform: translate(-50%, -50%) rotate(-27deg);
  color: rgba(185, 28, 28, .13);
  font-family: Arial, Helvetica, sans-serif;
  font-size: 49pt;
  font-weight: 900;
  letter-spacing: .08em;
  pointer-events: none;
}
.purchase6951-cancel-reason {
  margin: 6mm 0 0;
  padding: 2mm 3mm;
  border: 1px solid #991b1b;
  color: #991b1b;
  font-size: 8.5pt;
  font-weight: 700;
}

@media (max-width: 980px) {
  .purchase6951-toolbar { grid-template-columns: 1fr; }
  .purchase6951-print-options,
  .purchase6951-toolbar-actions { flex-wrap: wrap; }
  .purchase6951-preview { justify-items: start; overflow-x: auto; }
}

@page purchase-a4 { size: A4 portrait; margin: 12mm; }
@page purchase-f4 { size: 210mm 330mm; margin: 12mm; }

@media print {
  .purchase6951-print-page { background: #fff !important; }
  .purchase6951-toolbar { display: none !important; }
  .purchase6951-preview { display: block; padding: 0; }
  .purchase6951-paper-a4 .purchase6951-sheet { page: purchase-a4; }
  .purchase6951-paper-f4 .purchase6951-sheet { page: purchase-f4; }
  .purchase6951-sheet {
    width: auto;
    margin: 0;
    padding: 0 0 8mm;
    overflow: visible;
    box-shadow: none;
    break-after: page;
    page-break-after: always;
    print-color-adjust: exact;
    -webkit-print-color-adjust: exact;
  }
  .purchase6951-sheet:last-child { break-after: auto; page-break-after: auto; }
  .purchase6951-paper-a4 .purchase6951-sheet { min-height: 273mm; }
  .purchase6951-paper-f4 .purchase6951-sheet { min-height: 306mm; }
  .purchase6951-copy-label { top: 0; right: 0; }
  .purchase6951-sheet-footer { right: 0; bottom: 0; left: 0; }
  .purchase6951-table thead { display: table-header-group; }
  .purchase6951-table tr,
  .purchase6951-narcotic-detail,
  .purchase6951-closing { break-inside: avoid; page-break-inside: avoid; }
}


/* Sprint 6.9A.5.2 — compact operational detail and refined formal printing */
body:has(.purchase6952-order-page) .page { max-width: none; }
.purchase6952-order-page {
  display: grid;
  gap: 16px;
  width: 100%;
}
.purchase6952-header {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  align-items: flex-start;
}
.purchase6952-heading { min-width: 0; }
.purchase6952-heading h2 {
  margin: 7px 0 3px;
  font-size: clamp(1.35rem, 2.2vw, 1.8rem);
  line-height: 1.15;
  letter-spacing: -.025em;
}
.purchase6952-heading p { margin: 0; color: var(--muted); }
.purchase6952-badges,
.purchase6952-primary-actions {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
}
.purchase6952-primary-actions { justify-content: flex-end; }
.purchase6952-primary-actions form { margin: 0; }
.purchase6952-alert { display: grid; gap: 3px; }
.purchase6952-summary-card,
.purchase6952-items-card,
.purchase6952-notes-card { overflow: hidden; }
.purchase6952-summary-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0;
  margin: 0;
}
.purchase6952-summary-grid > div {
  min-width: 0;
  padding: 18px 20px;
  border-right: 1px solid var(--border);
}
.purchase6952-summary-grid > div:last-child { border-right: 0; }
.purchase6952-summary-grid dt {
  margin: 0 0 5px;
  color: var(--muted);
  font-size: .78rem;
  font-weight: 700;
}
.purchase6952-summary-grid dd {
  margin: 0;
  color: var(--text);
  font-weight: 750;
  line-height: 1.35;
}
.purchase6952-summary-grid small {
  display: block;
  margin-top: 3px;
  color: var(--muted);
}
.purchase6952-card-header {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: center;
  padding: 18px 20px 12px;
}
.purchase6952-card-header h3,
.purchase6952-card-header p,
.purchase6952-notes-card h3,
.purchase6952-notes-card p { margin: 0; }
.purchase6952-card-header p { margin-top: 3px; color: var(--muted); font-size: .86rem; }
.purchase6952-table th,
.purchase6952-table td { vertical-align: middle; }
.purchase6952-table .num { text-align: right; white-space: nowrap; }
.purchase6952-total-row {
  display: flex;
  justify-content: flex-end;
  gap: 18px;
  align-items: baseline;
  padding: 15px 20px;
  border-top: 1px solid var(--border);
  background: color-mix(in srgb, var(--surface-2) 72%, transparent);
}
.purchase6952-total-row span { color: var(--muted); }
.purchase6952-total-row strong { font-size: 1.15rem; }
.purchase6952-notes-card { padding: 18px 20px; }
.purchase6952-notes-card p { margin-top: 7px; color: var(--text-soft); line-height: 1.55; }
.purchase6952-action-panels { display: grid; gap: 10px; }
.purchase6952-action-panel {
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  background: var(--surface);
  overflow: hidden;
}
.purchase6952-action-panel > summary {
  padding: 14px 16px;
  cursor: pointer;
  font-weight: 750;
  list-style: none;
}
.purchase6952-action-panel > summary::-webkit-details-marker { display: none; }
.purchase6952-action-panel > form {
  padding: 0 16px 16px;
  border-top: 1px solid var(--border);
}
.purchase6952-action-panel > form .form-group { margin-top: 14px; }
.purchase6952-danger-panel { border-color: color-mix(in srgb, var(--danger) 38%, var(--border)); }
.purchase6952-danger-panel > summary { color: var(--danger); }

@media (max-width: 1040px) {
  .purchase6952-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .purchase6952-summary-grid > div:nth-child(2) { border-right: 0; }
  .purchase6952-summary-grid > div:nth-child(-n+2) { border-bottom: 1px solid var(--border); }
}
@media (max-width: 720px) {
  .purchase6952-header { display: grid; }
  .purchase6952-primary-actions { justify-content: flex-start; }
  .purchase6952-summary-grid { grid-template-columns: 1fr; }
  .purchase6952-summary-grid > div,
  .purchase6952-summary-grid > div:nth-child(2) {
    border-right: 0;
    border-bottom: 1px solid var(--border);
  }
  .purchase6952-summary-grid > div:last-child { border-bottom: 0; }
  .purchase6952-total-row { justify-content: space-between; }
}

/* Print refinement applies to every Surat Pesanan template. */
.purchase6951-sheet {
  padding: 7mm 12mm 10mm;
  font-size: 10.2pt;
  line-height: 1.22;
}
.purchase6951-copy-label { display: none !important; }
.purchase6951-letterhead {
  grid-template-columns: 20mm 1fr 20mm;
  gap: 4mm;
  min-height: 22mm;
  padding: 0 0 2.5mm;
}
.purchase6951-letterhead::after { width: 20mm; }
.purchase6951-letterhead img,
.purchase6951-logo-space { width: 19mm; height: 19mm; }
.purchase6951-letterhead h1 { font-size: 15pt; line-height: 1.02; }
.purchase6951-letterhead p { margin: 0; font-size: 8.2pt; line-height: 1.12; }
.purchase6951-document-title { margin: 4mm 0 4mm; }
.purchase6951-document-title h2 { padding-bottom: .6mm; font-size: 12.5pt; }
.purchase6951-document-title p { margin: 1mm 0 0; }
.purchase6951-recipient { margin-bottom: 3.2mm; }
.purchase6951-recipient strong { margin: .25mm 0; }
.purchase6951-letter-body { margin-bottom: 2.5mm; }
.purchase6951-letter-body p { margin-bottom: 1.2mm; }
.purchase6951-table { margin: 2mm 0 3mm; font-size: 9.1pt; line-height: 1.16; }
.purchase6951-table th,
.purchase6951-table td { padding: 1.5mm 1.7mm; }
.purchase6951-table td span { margin-top: .35mm; font-size: 8.2pt; }
.purchase6951-identity-intro > p { margin-bottom: 1.4mm; }
.purchase6951-definition-list { gap: .7mm; margin-bottom: 3mm; }
.purchase6951-request-line { margin-top: 2.5mm !important; }
.purchase6951-narcotic-detail { margin: 3mm 0; padding: 3mm 4mm; }
.purchase6951-use-statement { margin: 3mm 0 2mm; }
.purchase6951-notes { margin-top: 2.5mm; padding-top: 1.8mm; }
.purchase6951-notes p { margin-top: .6mm; }
.purchase6951-closing { margin-top: 5mm; }
.purchase6951-signature-block p { margin-bottom: .8mm; }
.purchase6951-signature-space { height: 20mm; }
.purchase6951-sheet-footer {
  right: 12mm;
  bottom: 3.5mm;
  left: 12mm;
  padding-top: 1mm;
  font-size: 6.6pt;
}

@page purchase-a4 { size: A4 portrait; margin: 7mm 12mm 10mm; }
@page purchase-f4 { size: 210mm 330mm; margin: 7mm 12mm 10mm; }
@media print {
  .purchase6951-sheet { padding: 0 0 7mm; }
  .purchase6951-paper-a4 .purchase6951-sheet { min-height: 280mm; }
  .purchase6951-paper-f4 .purchase6951-sheet { min-height: 313mm; }
  .purchase6951-sheet-footer { right: 0; bottom: 0; left: 0; }
}

/* Sprint 6.9B.1 — retur pembelian dan supplier */
.return-b1-layout,
.supplier-b1-layout { display:grid; gap:20px; align-items:start; }
.return-b1-layout { grid-template-columns:minmax(0, .9fr) minmax(0, 1.1fr); }
.supplier-b1-layout { grid-template-columns:minmax(340px, .82fr) minmax(0, 1.18fr); }
.return-b1-section,
.return-b1-summary,
.return-b1-policy,
.return-b1-items-card,
.return-b1-extra,
.return-b1-detail-main,
.return-b1-meta-card,
.return-b1-action-card,
.return-b1-timeline-card,
.supplier-b1-form-card,
.supplier-b1-list-card { min-width:0; }
.return-b1-head,
.supplier-b1-form-head,
.supplier-b1-list-head { gap:16px; align-items:flex-start; }
.return-b1-receipts,
.return-b1-list,
.supplier-b1-list { display:grid; gap:10px; }
.return-b1-receipt-row,
.return-b1-list-row,
.supplier-b1-row { display:grid; gap:14px; align-items:center; border:1px solid var(--border); border-radius:var(--radius-sm); background:var(--surface-2); padding:14px 16px; }
.return-b1-receipt-row { grid-template-columns:minmax(0,1fr) auto; }
.return-b1-list-row { grid-template-columns:minmax(0,1fr) auto; transition:border-color .18s ease, background .18s ease, transform .18s ease; }
.return-b1-list-row:hover { border-color:var(--accent); background:var(--accent-soft); transform:translateY(-1px); }
.return-b1-receipt-row > div,
.return-b1-list-main,
.supplier-b1-row-main { display:grid; gap:3px; min-width:0; }
.return-b1-receipt-row span,
.return-b1-list-main span,
.supplier-b1-row-main span { color:var(--text-soft); }
.return-b1-receipt-row small,
.return-b1-list-main small,
.supplier-b1-row-main small { color:var(--muted); }
.return-b1-filter,
.supplier-b1-filter { display:flex; gap:6px; flex-wrap:wrap; margin:0 0 16px; }
.return-b1-filter a,
.supplier-b1-filter a { padding:7px 11px; border:1px solid var(--border); border-radius:999px; color:var(--muted); font-weight:700; font-size:12px; }
.return-b1-filter a:hover,
.supplier-b1-filter a:hover,
.return-b1-filter a.is-active,
.supplier-b1-filter a.is-active { border-color:var(--accent); background:var(--accent-soft); color:var(--accent-strong); }
.return-b1-form { display:grid; gap:16px; padding-bottom:88px; }
.return-b1-summary { display:flex; justify-content:space-between; gap:24px; align-items:flex-start; }
.return-b1-summary h2 { margin:3px 0; }
.return-b1-summary p { margin:0; color:var(--muted); }
.return-b1-summary-fields { display:grid; grid-template-columns:repeat(2,minmax(180px,1fr)); gap:12px; min-width:min(100%,460px); }
.return-b1-summary-fields label,
.return-b1-item-fields label { display:grid; gap:5px; }
.return-b1-summary-fields label > span,
.return-b1-item-fields label > span { color:var(--muted); font-size:12px; font-weight:800; }
.return-b1-policy { display:grid; grid-template-columns:minmax(220px,.7fr) minmax(0,1fr); gap:12px 24px; border-left:4px solid var(--info); }
.return-b1-policy > div { display:grid; gap:3px; }
.return-b1-policy > div span { color:var(--info); font-weight:800; }
.return-b1-policy ul { display:flex; gap:8px 18px; flex-wrap:wrap; margin:0; padding-left:20px; color:var(--text-soft); }
.return-b1-policy small { grid-column:1/-1; color:var(--muted); }
.return-b1-items { display:grid; gap:10px; }
.return-b1-item { display:grid; grid-template-columns:auto minmax(220px,1fr) minmax(420px,1.35fr); gap:12px 16px; align-items:start; border:1px solid var(--border); border-radius:var(--radius-sm); padding:14px; background:var(--surface-2); transition:border-color .18s ease, background .18s ease; }
.return-b1-item.is-selected { border-color:var(--accent); background:var(--accent-soft); }
.return-b1-item.is-disabled { opacity:.58; }
.return-b1-item-check { padding-top:3px; }
.return-b1-item-check input { width:18px; height:18px; accent-color:var(--accent); }
.return-b1-item-copy { display:grid; gap:3px; min-width:0; }
.return-b1-item-title { display:flex; gap:8px; align-items:center; flex-wrap:wrap; }
.return-b1-item-copy > span { color:var(--text-soft); }
.return-b1-item-copy small { color:var(--muted); }
.return-b1-item-fields { display:grid; grid-template-columns:minmax(100px,.55fr) minmax(150px,.9fr) minmax(170px,1fr); gap:10px; }
.return-b1-item-note { grid-column:2/-1; }
.return-b1-extra details,
.supplier-b1-details { border:1px solid var(--border); border-radius:var(--radius-sm); overflow:hidden; }
.return-b1-extra summary,
.supplier-b1-details summary { cursor:pointer; padding:13px 15px; font-weight:800; background:var(--surface-2); }
.return-b1-extra details[open] summary,
.supplier-b1-details[open] summary { border-bottom:1px solid var(--border); }
.return-b1-extra .form-grid { padding:15px; }
.return-b1-sticky { position:sticky; z-index:8; bottom:12px; display:flex; justify-content:space-between; align-items:center; gap:18px; padding:13px 16px; border:1px solid var(--border); border-radius:var(--radius); background:color-mix(in srgb, var(--surface) 94%, transparent); box-shadow:var(--shadow); backdrop-filter:blur(12px); }
.return-b1-sticky > div { display:grid; gap:2px; }
.return-b1-sticky span { color:var(--muted); font-size:12px; }
.return-b1-detail-grid { display:grid; grid-template-columns:minmax(0,1fr) minmax(280px,340px); gap:20px; align-items:start; }
.return-b1-document-head { display:flex; justify-content:space-between; gap:16px; align-items:flex-start; margin-bottom:18px; }
.return-b1-document-head h2 { margin:3px 0; }
.return-b1-document-head p { margin:0; color:var(--muted); }
.return-b1-document-items { display:grid; gap:10px; }
.return-b1-document-items article { display:grid; gap:3px; padding:13px 0; border-bottom:1px solid var(--border); }
.return-b1-document-items article:last-child { border-bottom:0; }
.return-b1-document-items article > div { display:flex; gap:8px; align-items:center; flex-wrap:wrap; }
.return-b1-document-items span,
.return-b1-document-items small { color:var(--muted); }
.return-b1-document-items p { margin:3px 0 0; }
.return-b1-detail-side { display:grid; gap:14px; }
.return-b1-meta-card h3,
.return-b1-action-card h3 { margin-top:0; }
.return-b1-meta-card dl { display:grid; gap:9px; margin:0; }
.return-b1-meta-card dl > div { display:grid; grid-template-columns:minmax(110px,.8fr) minmax(0,1.2fr); gap:10px; }
.return-b1-meta-card dt { color:var(--muted); }
.return-b1-meta-card dd { margin:0; font-weight:700; }
.return-b1-danger-card { border-color:color-mix(in srgb,var(--danger) 32%,var(--border)); }
.return-b1-action-card details summary { cursor:pointer; color:var(--danger); font-weight:800; }
.return-b1-action-card details form { margin-top:12px; }
.return-b1-timeline { display:grid; gap:12px; }
.return-b1-timeline > div { display:grid; grid-template-columns:12px minmax(0,1fr); gap:10px; }
.return-b1-timeline > div > span { width:10px; height:10px; margin-top:5px; border-radius:50%; background:var(--accent); box-shadow:0 0 0 4px var(--accent-soft); }
.return-b1-timeline > div > div { display:grid; gap:2px; padding-bottom:12px; border-bottom:1px solid var(--border); }
.return-b1-timeline small { color:var(--muted); }
.return-b1-timeline p { margin:3px 0 0; }

.supplier-b1-install-note { display:grid; gap:2px; }
.supplier-b1-form-card { position:sticky; top:calc(var(--topbar-height) + 18px); }
.supplier-b1-form-head h3,
.supplier-b1-list-head h3 { margin:2px 0; }
.supplier-b1-form-head p,
.supplier-b1-list-head p { margin:0; color:var(--muted); }
.supplier-b1-details-body { display:grid; gap:20px; padding:16px; }
.supplier-b1-details-body section { display:grid; gap:10px; }
.supplier-b1-details-body h4 { margin:0; }
.supplier-b1-details-body h4 small { color:var(--muted); font-weight:600; }
.supplier-b1-suffix { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; }
.supplier-b1-suffix .input { border-radius:var(--radius-sm) 0 0 var(--radius-sm); }
.supplier-b1-suffix span { align-self:stretch; display:grid; place-items:center; padding:0 12px; border:1px solid var(--border); border-left:0; border-radius:0 var(--radius-sm) var(--radius-sm) 0; background:var(--surface-3); color:var(--muted); font-weight:700; }
.supplier-b1-check { display:flex; gap:9px; align-items:center; min-height:40px; padding:8px 10px; border:1px solid var(--border); border-radius:var(--radius-sm); background:var(--surface-2); }
.supplier-b1-check input { width:17px; height:17px; accent-color:var(--accent); }
.supplier-b1-list-head { flex-wrap:wrap; }
.supplier-b1-list-head .supplier-b1-filter { margin:0; justify-content:flex-end; }
.supplier-b1-row { grid-template-columns:minmax(0,1fr) auto auto; }
.supplier-b1-row.is-inactive { opacity:.78; }
.supplier-b1-row-title { display:flex; gap:8px; align-items:center; flex-wrap:wrap; }
.supplier-b1-inactive-reason { color:var(--danger) !important; }
.supplier-b1-row-stats { display:flex; gap:6px; flex-wrap:wrap; justify-content:flex-end; }
.supplier-b1-row-stats span { padding:5px 8px; border-radius:999px; background:var(--surface-3); color:var(--muted); font-size:11px; font-weight:800; }
.supplier-b1-row-actions { display:flex; gap:6px; align-items:center; justify-content:flex-end; flex-wrap:wrap; }
.supplier-b1-row-actions form { margin:0; }
.supplier-b1-action-menu { position:relative; }
.supplier-b1-action-menu > summary { list-style:none; cursor:pointer; }
.supplier-b1-action-menu > summary::-webkit-details-marker { display:none; }
.supplier-b1-action-menu[open] > form { position:absolute; z-index:20; right:0; top:calc(100% + 8px); display:grid; gap:9px; width:260px; padding:13px; border:1px solid var(--border); border-radius:var(--radius-sm); background:var(--surface); box-shadow:var(--shadow); }
.supplier-b1-action-menu form label { display:grid; gap:5px; font-size:12px; font-weight:800; }
.supplier-b1-action-menu form p { margin:0; color:var(--muted); font-size:12px; }

@media (max-width:1180px) {
  .supplier-b1-layout { grid-template-columns:minmax(300px,.9fr) minmax(0,1.1fr); }
  .supplier-b1-row { grid-template-columns:minmax(0,1fr) auto; }
  .supplier-b1-row-actions { grid-column:1/-1; justify-content:flex-start; }
  .return-b1-item { grid-template-columns:auto minmax(0,1fr); }
  .return-b1-item-fields,
  .return-b1-item-note { grid-column:2/-1; }
}
@media (max-width:900px) {
  .return-b1-layout,
  .supplier-b1-layout,
  .return-b1-detail-grid { grid-template-columns:1fr; }
  .supplier-b1-form-card { position:static; }
  .return-b1-summary { display:grid; }
  .return-b1-summary-fields { min-width:0; width:100%; }
  .return-b1-policy { grid-template-columns:1fr; }
  .return-b1-policy small { grid-column:auto; }
}
@media (max-width:640px) {
  .return-b1-summary-fields,
  .return-b1-item-fields { grid-template-columns:1fr; }
  .return-b1-item { grid-template-columns:auto minmax(0,1fr); padding:12px; }
  .return-b1-item-fields,
  .return-b1-item-note { grid-column:1/-1; }
  .return-b1-sticky { bottom:6px; align-items:stretch; flex-direction:column; }
  .return-b1-sticky .btn { width:100%; }
  .return-b1-receipt-row,
  .return-b1-list-row,
  .supplier-b1-row { grid-template-columns:1fr; }
  .return-b1-receipt-row .btn { width:100%; }
  .supplier-b1-row-stats,
  .supplier-b1-row-actions { justify-content:flex-start; }
  .supplier-b1-action-menu[open] > form { position:fixed; inset:auto 14px 14px; width:auto; }
}

/* Sprint 6.9B.2 — penyelesaian retur supplier */
.return-b1-detail-hero {
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:18px;
  margin-bottom:20px;
}
.return-b1-detail-hero h2 { margin:3px 0; }
.return-b1-detail-hero p { margin:0; color:var(--muted); }
.return-b1-status-badge { flex:none; }
.return-b2-settlement-summary,
.return-b2-inbound-history,
.return-b2-inbound-card { min-width:0; }
.return-b2-settlement-summary .card-head { gap:14px; align-items:flex-start; }
.return-b2-summary-grid {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
  margin-top:14px;
}
.return-b2-summary-grid > div {
  display:grid;
  gap:3px;
  padding:11px 12px;
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  background:var(--surface-2);
}
.return-b2-summary-grid span { color:var(--muted); font-size:12px; }
.return-b2-summary-grid strong { overflow-wrap:anywhere; }
.return-b2-inline-note,
.return-b2-decision-help {
  margin:14px 0 0;
  padding:11px 12px;
  border:1px solid color-mix(in srgb,var(--info) 34%,var(--border));
  border-radius:var(--radius-sm);
  background:color-mix(in srgb,var(--info) 9%,var(--surface));
  color:var(--text-soft);
}
.return-b2-decision-help:empty { display:none; }
.return-b2-history-list { display:grid; gap:9px; }
.return-b2-history-list article {
  display:grid;
  gap:4px;
  padding:12px 0;
  border-bottom:1px solid var(--border);
}
.return-b2-history-list article:last-child { border-bottom:0; }
.return-b2-history-list article > div { display:flex; justify-content:space-between; gap:12px; }
.return-b2-history-list span,
.return-b2-history-list small { color:var(--muted); }
.return-b2-inbound-card { margin-top:20px; }
.return-b2-inbound-items,
.return-b2-returned-items { display:grid; gap:10px; }
.return-b2-inbound-items article {
  display:grid;
  grid-template-columns:minmax(220px,1.25fr) minmax(110px,.45fr) minmax(140px,.65fr) minmax(140px,.65fr) minmax(160px,.7fr);
  gap:10px;
  align-items:end;
  padding:14px;
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  background:var(--surface-2);
  transition:border-color .18s ease,background .18s ease;
}
.return-b2-returned-items article {
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(150px,.35fr);
  gap:14px;
  align-items:end;
  padding:14px;
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  background:var(--surface-2);
  transition:border-color .18s ease,background .18s ease;
}
.return-b2-inbound-items article.is-selected,
.return-b2-returned-items article.is-selected {
  border-color:var(--accent);
  background:var(--accent-soft);
}
.return-b2-inbound-copy,
.return-b2-returned-items article > div { display:grid; gap:4px; min-width:0; }
.return-b2-inbound-copy span,
.return-b2-returned-items article > div span { color:var(--muted); }
.return-b2-inbound-items label,
.return-b2-returned-items label { display:grid; gap:5px; min-width:0; }
.return-b2-inbound-items label > span,
.return-b2-returned-items label > span { color:var(--muted); font-size:12px; font-weight:800; }
.return-b2-form-footer {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:16px;
  padding-top:14px;
  border-top:1px solid var(--border);
}
.return-b2-form-footer span { color:var(--muted); }
.return-b2-close-rejected {
  margin-top:16px;
  border-top:1px solid var(--border);
  padding-top:14px;
}
.return-b2-close-rejected summary { cursor:pointer; color:var(--danger); font-weight:800; }
.return-b2-close-rejected form { margin-top:12px; max-width:640px; }

@media (max-width:1180px) {
  .return-b2-inbound-items article {
    grid-template-columns:minmax(220px,1fr) repeat(2,minmax(130px,.55fr));
  }
  .return-b2-inbound-copy { grid-column:1/-1; }
}
@media (max-width:900px) {
  .return-b2-inbound-items article { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .return-b2-inbound-copy { grid-column:1/-1; }
}
@media (max-width:640px) {
  .return-b1-detail-hero { display:grid; }
  .return-b2-summary-grid,
  .return-b2-inbound-items article,
  .return-b2-returned-items article { grid-template-columns:1fr; }
  .return-b2-form-footer { align-items:stretch; flex-direction:column; }
  .return-b2-form-footer .btn { width:100%; }
  .return-b2-history-list article > div { display:grid; }
}

/* Paket 6.0 - workspace Penjualan sederhana */
.sales60-tabs{margin:0 0 14px}.sales60-statusbar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 14px;margin-bottom:14px;border:1px solid var(--border);border-radius:14px;background:var(--surface);box-shadow:var(--shadow-sm)}.sales60-status-main,.sales60-status-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.sales60-status-main span{color:var(--text-muted);font-size:13px}.sales60-dot{width:9px;height:9px;border-radius:50%;background:var(--warning)}.sales60-dot.is-online{background:var(--success);box-shadow:0 0 0 4px color-mix(in srgb,var(--success) 18%,transparent)}.sales60-held-menu{position:relative}.sales60-held-menu>summary{list-style:none;cursor:pointer}.sales60-held-menu>summary::-webkit-details-marker{display:none}.sales60-held-panel{position:absolute;right:0;top:calc(100% + 8px);z-index:40;width:min(390px,88vw);max-height:420px;overflow:auto;padding:10px;border:1px solid var(--border);border-radius:14px;background:var(--surface);box-shadow:var(--shadow-lg)}.sales60-held-head{display:flex;justify-content:space-between;align-items:center;padding:4px 4px 10px}.sales60-held-head span{font-size:12px;color:var(--text-muted)}.sales60-held-item{display:grid;grid-template-columns:1fr auto;gap:8px;align-items:center;padding:9px;border-top:1px solid var(--border)}.sales60-held-item a{display:grid;gap:2px;text-decoration:none;color:inherit}.sales60-held-item span,.sales60-held-item small{color:var(--text-muted);font-size:12px}.sales60-rx-strip{display:flex;align-items:center;gap:14px;padding:12px 14px;margin-bottom:14px}.sales60-rx-strip>div:first-child{min-width:170px;display:grid}.sales60-rx-list{display:flex;gap:8px;overflow:auto;flex:1}.sales60-rx-list a{display:grid;min-width:190px;padding:8px 10px;border:1px solid var(--border);border-radius:11px;text-decoration:none;color:inherit;background:var(--surface-subtle)}.sales60-rx-list span{font-size:12px;color:var(--text-muted)}.sales60-resume-note{display:flex;justify-content:space-between;gap:12px;align-items:center}.sales60-pos-layout{min-height:570px}.sales60-checkout-row{display:flex;align-items:center;gap:10px}.sales60-checkout-row .pos51-checkout-summary{flex:1}.sales60-summary-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:14px}.sales60-summary-grid article{padding:16px;display:grid;gap:7px}.sales60-summary-grid span{font-size:13px;color:var(--text-muted)}.sales60-summary-grid strong{font-size:22px}.sales60-filter-form{display:grid;grid-template-columns:minmax(200px,2fr) repeat(4,minmax(125px,1fr));gap:10px;align-items:end;padding:0 0 14px}.sales60-filter-actions{display:flex;gap:8px;grid-column:1/-1}.sales60-result-meta{padding:8px 0;color:var(--text-muted);font-size:13px}.sales60-pagination{display:flex;align-items:center;justify-content:center;gap:12px;padding-top:14px}.sales60-pagination span{font-size:13px;color:var(--text-muted)}.sales60-shift-layout{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(300px,.75fr);gap:14px}.sales60-shift-main,.sales60-shift-side{display:grid;gap:14px;align-content:start}.sales60-cash-totals{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:4px 0 18px}.sales60-cash-totals>div{display:grid;gap:4px;padding:12px;border:1px solid var(--border);border-radius:12px;background:var(--surface-subtle)}.sales60-cash-totals span{font-size:12px;color:var(--text-muted)}.sales60-movement-list,.sales60-shift-history{display:grid}.sales60-movement-list>div,.sales60-shift-history>div{padding:10px 0;border-top:1px solid var(--border)}.sales60-movement-list>div:first-child,.sales60-shift-history>div:first-child{border-top:0}.sales60-movement-list p{margin:5px 0 2px}.sales60-movement-list small,.sales60-shift-history span,.sales60-shift-history small{display:block;color:var(--text-muted);font-size:12px}.empty-state.compact{padding:18px}.full-span{grid-column:1/-1}
@media(max-width:1100px){.sales60-summary-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.sales60-filter-form{grid-template-columns:repeat(2,minmax(0,1fr))}.sales60-shift-layout{grid-template-columns:1fr}.sales60-cash-totals{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){.sales60-statusbar,.sales60-rx-strip{align-items:stretch;flex-direction:column}.sales60-status-actions{display:grid;grid-template-columns:1fr 1fr}.sales60-status-actions .btn{justify-content:center}.sales60-held-panel{position:fixed;left:12px;right:12px;top:110px;width:auto}.sales60-rx-list{width:100%}.sales60-summary-grid,.sales60-filter-form,.sales60-cash-totals{grid-template-columns:1fr}.sales60-checkout-row{align-items:stretch;flex-direction:column}.sales60-checkout-row>.btn{width:100%}.sales60-resume-note{align-items:flex-start;flex-direction:column}}

/* Paket 6.1 - checkout terkendali */
.sales61-context-tools{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:10px}.sales61-disclosure{position:relative}.sales61-panel{position:absolute;left:0;bottom:calc(100% + 8px);z-index:35;width:min(430px,88vw);padding:14px;border:1px solid var(--border);border-radius:14px;background:var(--surface);box-shadow:var(--shadow-lg)}.sales61-panel.is-static{position:static;width:auto;margin-top:10px;box-shadow:none;background:var(--surface-subtle)}.sales61-panel-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px}.sales61-customer-fields,.sales61-discount-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.sales61-customer-results{display:grid;max-height:190px;overflow:auto;margin-top:6px;border-radius:10px}.sales61-customer-result{display:grid;gap:2px;width:100%;padding:9px 10px;border:0;border-bottom:1px solid var(--border);background:var(--surface-subtle);color:var(--text);text-align:left;cursor:pointer}.sales61-customer-result:hover,.sales61-customer-result:focus{background:var(--accent-soft)}.sales61-customer-result span,.sales61-customer-empty{font-size:12px;color:var(--text-muted)}.sales61-customer-empty{padding:9px 3px}.sales61-payment-dialog{width:min(660px,94vw)}.sales61-payment-summary{display:grid;gap:8px;padding:12px;margin:10px 0 14px;border:1px solid var(--border);border-radius:12px;background:var(--surface-subtle)}.sales61-payment-summary>div{display:flex;align-items:center;justify-content:space-between;gap:12px}.sales61-payment-summary .total{padding-top:8px;border-top:1px solid var(--border);font-size:17px}.sales61-payment-lines{display:grid;gap:8px;margin:10px 0}.sales61-payment-line{display:grid;grid-template-columns:minmax(125px,.8fr) minmax(130px,.9fr) minmax(180px,1.25fr) auto;gap:8px;align-items:center}.sales61-payment-line .icon-btn{justify-self:end}.sales61-approval{display:grid;gap:6px;padding:12px;margin:12px 0;border:1px solid color-mix(in srgb,var(--warning) 38%,var(--border));border-radius:12px;background:color-mix(in srgb,var(--warning) 9%,var(--surface))}.sales61-approval.approved{border-color:color-mix(in srgb,var(--success) 38%,var(--border));background:color-mix(in srgb,var(--success) 9%,var(--surface));color:var(--success)}.rx61-dynamic-summary{margin-top:0}.sales61-rx-discount>summary{list-style:none;cursor:pointer}.sales61-rx-discount>summary::-webkit-details-marker{display:none}.sale-meta-grid small{display:block;margin-top:3px;color:var(--text-muted);font-size:12px}
@media(max-width:760px){.sales61-panel{position:fixed;left:12px;right:12px;bottom:16px;width:auto;max-height:75vh;overflow:auto}.sales61-customer-fields,.sales61-discount-grid{grid-template-columns:1fr}.sales61-payment-line{grid-template-columns:1fr 1fr}.sales61-payment-line input:nth-of-type(1){grid-column:1/2}.sales61-payment-line input:nth-of-type(2){grid-column:1/-1}.sales61-payment-line .icon-btn{grid-column:2;grid-row:1;justify-self:end}.sales61-payment-dialog{width:96vw}}


/* Hotfix 6.1.1: status validasi checkout harus terlihat, bukan tombol hijau yang diam. */
.sales611-checkout-message{display:flex;align-items:flex-start;gap:8px;margin:12px 0;padding:11px 12px;border:1px solid color-mix(in srgb,var(--danger) 45%,var(--border));border-radius:12px;background:color-mix(in srgb,var(--danger) 9%,var(--surface));color:var(--danger);font-size:13px;line-height:1.45}
.sales611-checkout-message[hidden]{display:none!important}
[data-pos-submit].is-disabled{opacity:.58;cursor:not-allowed;filter:saturate(.55)}
[data-pos-submit][disabled]{opacity:.68;cursor:wait}

.sales61-panel .input.is-invalid{border-color:var(--danger);box-shadow:0 0 0 3px color-mix(in srgb,var(--danger) 14%,transparent)}

/* Paket 6.2 — finalisasi operasional Penjualan */
.inline-form { display:inline-flex; margin:0; }
.sales62-linked-rx {
  display:flex; align-items:center; gap:12px; margin:16px 0; padding:12px 14px;
  border:1px solid var(--border); border-radius:14px; color:inherit; text-decoration:none;
  background:var(--surface-soft, rgba(127,127,127,.06));
}
.sales62-linked-rx .icon { flex:0 0 auto; }
.sales62-linked-rx span { display:flex; flex-direction:column; gap:2px; }
.sales62-linked-rx small { color:var(--muted); }
.sales62-return-history-row { padding:14px 0; border-top:1px solid var(--border); }
.sales62-return-history-row:first-of-type { border-top:0; }
.sales62-return-head { display:flex; justify-content:space-between; gap:16px; align-items:flex-start; }
.sales62-return-head > div { display:flex; flex-direction:column; gap:3px; }
.sales62-return-history-row p { margin:8px 0; color:var(--muted); font-size:.9rem; }
.sales62-refund-chips { display:flex; flex-wrap:wrap; gap:7px; }
.sales62-refund-chips span {
  display:inline-flex; padding:6px 9px; border:1px solid var(--border); border-radius:999px;
  font-size:.78rem; color:var(--muted); background:var(--surface-soft, rgba(127,127,127,.06));
}
.sales62-return-estimate {
  display:flex; justify-content:space-between; align-items:center; padding:12px 14px;
  border:1px solid var(--border); border-radius:12px; background:var(--surface-soft, rgba(127,127,127,.06));
}
.sales62-original-refund { padding:12px 14px; border:1px solid var(--border); border-radius:12px; }
.sales62-original-refund > div { display:flex; justify-content:space-between; gap:12px; padding:5px 0; }
.sales62-audit { margin-top:20px; border-top:1px solid var(--border); padding-top:16px; }
.sales62-audit > summary { cursor:pointer; font-weight:750; display:flex; gap:8px; align-items:center; }
.sales62-audit-list { margin-top:14px; display:grid; gap:0; }
.sales62-audit-list > div { display:grid; grid-template-columns:14px 1fr; gap:10px; min-height:54px; }
.sales62-audit-dot { width:9px; height:9px; border-radius:50%; margin-top:5px; background:var(--primary); box-shadow:0 0 0 4px var(--surface-soft, rgba(127,127,127,.08)); }
.sales62-audit-list p { margin:0; display:flex; flex-direction:column; gap:3px; padding-bottom:14px; border-bottom:1px solid var(--border); }
.sales62-audit-list small,.sales62-audit-list em { color:var(--muted); font-size:.8rem; font-style:normal; }
.sales62-shift-row { position:relative; align-items:flex-start !important; gap:10px; }
.sales62-shift-row > div:first-child { min-width:0; }
.sales62-variance-actions { width:100%; margin-top:8px; }
.sales62-variance-actions > summary { list-style:none; }
.sales62-variance-actions > summary::-webkit-details-marker { display:none; }
.sales62-variance-panel { display:grid; gap:10px; padding:12px; margin-top:8px; border:1px solid var(--border); border-radius:12px; background:var(--surface); }
.sales62-variance-panel p { margin:0; color:var(--muted); font-size:.85rem; }
.sales62-variance-panel form { display:grid; gap:7px; }
.sales62-variance-preview { padding:9px 12px; border-radius:10px; font-size:.85rem; font-weight:700; }
.sales62-variance-preview.is-warning { background:rgba(245,158,11,.12); color:var(--warning, #b45309); border:1px solid rgba(245,158,11,.28); }
.sales62-variance-preview.is-ok { background:rgba(16,185,129,.1); color:var(--success, #047857); border:1px solid rgba(16,185,129,.24); }
@media (max-width:760px) {
  .sales62-return-head { flex-direction:column; gap:6px; }
  .sales62-linked-rx { align-items:flex-start; }
}


/* 8.8.0.10 — Shared UI utility completion.
   These semantic helpers were already used by multiple views but had no active CSS contract. */
.flash-warning {
  background: var(--warning-soft);
  color: var(--warning);
  border-color: color-mix(in srgb, var(--warning) 28%, var(--border));
}
.flash-info {
  background: color-mix(in srgb, var(--info) 10%, var(--surface));
  color: var(--info);
  border-color: color-mix(in srgb, var(--info) 25%, var(--border));
}
.badge-secondary { color: var(--muted); background: var(--surface-3); }

.form-grid.three-col { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.form-grid.four-col { grid-template-columns: repeat(4, minmax(0, 1fr)); }

.check-row {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  min-width: 0;
  cursor: pointer;
}
.check-row > input[type="checkbox"] {
  flex: 0 0 auto;
  width: 18px;
  height: 18px;
  margin: 2px 0 0;
  accent-color: var(--accent);
}
.check-row > span { min-width: 0; line-height: 1.45; }

.form-help {
  display: block;
  margin-top: 1px;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.45;
}

.input-with-suffix {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
  min-width: 0;
}
.input-with-suffix > span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
  white-space: nowrap;
}

@media (max-width: 1040px) {
  .form-grid.four-col { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  .form-grid.three-col,
  .form-grid.four-col { grid-template-columns: 1fr; }
}