:root {
  --ink: #241b1a;
  --muted: #74808b;
  --line: #eee4e1;
  --soft: #fff7f4;
  --paper: #ffffff;
  --teal: #c84b3f;
  --teal-dark: #a7342c;
  --teal-soft: #fdeceb;
  --orange: #f28c28;
  --orange-soft: #fff3e2;
  --red: #d35c50;
  --red-soft: #fceceb;
  --shadow: 0 10px 26px rgba(139, 55, 42, 0.07);
  font-family: "DM Sans", "Noto Sans SC", sans-serif;
  color: var(--ink);
  background: #ffffff;
}
* { box-sizing: border-box; }
body { margin: 0; min-width: 1160px; background: #ffffff; }
button, input, select, textarea { font: inherit; }
button { cursor: pointer; }
.app-shell { display: grid; grid-template-columns: 246px minmax(0, 1fr); min-height: 100vh; }
.sidebar { position: sticky; top: 0; height: 100vh; overflow: hidden; background: linear-gradient(160deg, #b92f2b 0%, #e45b32 48%, #f59b3d 100%); color: #fff; padding: 28px 16px 20px; display: flex; flex-direction: column; border-right: 1px solid #c94d36; z-index: 5; }
.brand { display: flex; align-items: center; gap: 10px; padding: 0 12px 28px; min-width: 0; }
.brand-logos { display: flex; align-items: center; gap: 5px; flex-shrink: 0; }
.brand-logo { width: 32px; height: 32px; border-radius: 9px; background: #fff; display: grid; place-items: center; overflow: hidden; border: 1px solid rgba(255,255,255,.82); box-shadow: 0 3px 8px rgba(105,28,17,.14); }
.brand-logo img { display: block; width: 100%; height: 100%; object-fit: contain; }
.brand-logo-bay { width: 42px; }
.brand-logo-bay img { width: 100%; height: 100%; object-fit: cover; }
.brand-title { min-width: 0; max-width: 126px; font-size: 13px; line-height: 1.4; font-weight: 700; color: #fff; letter-spacing: .1px; }
.brand-sub { font-size: 10px; color: rgba(255,255,255,.76); margin-top: 2px; }
.nav-label { color: rgba(255,255,255,.72); font-size: 11px; letter-spacing: 1px; padding: 14px 13px 8px; text-transform: uppercase; }
.nav-item { border: 0; background: transparent; color: rgba(255,255,255,.86); width: 100%; padding: 12px 13px; border-radius: 8px; text-align: left; display: flex; align-items: center; gap: 11px; font-size: 13px; margin: 2px 0; }
.nav-item:hover { background: rgba(255,255,255,.14); color: #fff; }
.nav-item.active { background: rgba(255,255,255,.2); color: #fff; box-shadow: inset 3px 0 0 #fff4d6; }
.nav-count { margin-left:auto; background:#f97316; color:#fff; border-radius:10px; min-width:18px; height:18px; display:grid; place-items:center; font-size:10px; }
.nav-icon { width: 19px; text-align: center; font-size: 15px; opacity: .9; }
.side-spacer { flex: 1; }
.side-user { border-top: 1px solid rgba(255,255,255,.25); padding: 16px 12px 0; display: flex; gap: 10px; align-items: center; }
.avatar { width: 33px; height: 33px; border-radius: 50%; display: grid; place-items: center; background: #ffe1d7; color: #9f2117; font-size: 12px; font-weight: 700; }
.side-user strong { color: #fff; font-size: 12px; display:block; }
.side-user small { color: rgba(255,255,255,.72); font-size: 10px; }
.main { min-width: 0; background:#ffffff; }
.topbar { height: 74px; background: var(--paper); border-bottom: 1px solid var(--line); display: flex; align-items: center; justify-content: space-between; padding: 0 32px; }
.crumb { color: var(--muted); font-size: 12px; }
.crumb b { color: var(--ink); font-weight: 600; }
.top-actions { display:flex; align-items:center; gap: 18px; }
.role-pill { display: flex; align-items: center; gap: 8px; color: var(--muted); font-size: 12px; }
.role-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--orange); }
.icon-btn { border: 0; background: transparent; color: var(--muted); position: relative; padding: 8px; border-radius: 7px; font-size: 17px; }
.icon-btn:hover { background: var(--soft); color: var(--teal); }
.badge-dot { position: absolute; top: 4px; right: 2px; height: 6px; width: 6px; background: var(--orange); border: 1px solid white; border-radius: 50%; }
.page { padding: 28px 32px 40px; max-width: 1600px; min-height:calc(100vh - 74px); background:linear-gradient(180deg,#ffffff 0%,#ffffff 78%,#fff8f5 100%); }
.page-head { padding-bottom:20px; border-bottom:1px solid #f2e2dd; background:linear-gradient(90deg,#ffffff 0%,#fffaf8 100%); }
.page-head { display:flex; justify-content:space-between; align-items:flex-start; margin-bottom: 24px; }
.eyebrow { color: var(--teal); font-size: 11px; font-weight: 700; letter-spacing: 1.5px; text-transform: uppercase; margin-bottom: 8px; }
h1 { font-size: 26px; line-height:1.2; margin:0 0 8px; letter-spacing: -.6px; }
.page-head p { margin: 0; color: var(--muted); font-size: 13px; }
.head-actions { display: flex; gap: 9px; align-items:center; }
.btn { height: 36px; border-radius: 7px; padding: 0 14px; border: 1px solid var(--line); background: white; color: var(--ink); font-size:12px; display:inline-flex; align-items:center; gap:7px; }
.btn:hover { border-color: #e1a093; color: var(--teal-dark); }
.btn-primary { border-color: var(--teal); background: var(--teal); color: white; }
.btn-primary:hover { background: var(--teal-dark); color:white; }
.btn-quiet { background: var(--soft); border-color: transparent; }
.btn-danger { color: var(--red); background: var(--red-soft); border-color: transparent; }
.btn-small { height: 30px; padding: 0 10px; font-size: 11px; }
.stats-grid { display:grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin-bottom: 22px; }
.stat-card { background: var(--paper); border:1px solid var(--line); border-radius: 9px; padding: 18px 18px 16px; box-shadow: var(--shadow); position: relative; overflow:hidden; }
.stat-card::after { content:""; position:absolute; right:-26px; top:-34px; width:84px; height:84px; border-radius:50%; background: var(--orange-soft); opacity:.8; }
.stat-top { display:flex; align-items:center; justify-content:space-between; margin-bottom: 15px; }
.stat-label { color: var(--muted); font-size: 12px; }
.stat-icon { width:30px; height:30px; border-radius:8px; background: var(--teal-soft); color:var(--teal); display:grid; place-items:center; font-size:14px; }
.stat-value { font-size: 27px; font-weight: 700; letter-spacing: -1px; }
.stat-meta { color: #b85d2f; font-size:11px; margin-top: 5px; }
.panel { background: var(--paper); border:1px solid var(--line); border-radius: 9px; box-shadow: var(--shadow); }
.panel-head { padding: 17px 18px; border-bottom:1px solid var(--line); display:flex; justify-content:space-between; align-items:center; }
.panel-title { font-size: 14px; font-weight: 700; }
.panel-sub { color:var(--muted); font-size:11px; margin-top:4px; }
.panel-body { padding: 18px; }
.organization-panel { overflow:hidden; }
.org-list { padding: 14px 18px 10px; }
.org-row { display:flex; align-items:center; justify-content:space-between; gap:18px; padding:14px 2px; border-bottom:1px solid var(--line); }
.org-row:last-child { border-bottom:0; }
.org-row-main { display:flex; align-items:flex-start; gap:10px; min-width:0; }
.org-row-main > div { min-width:0; }
.org-row-main b { display:block; font-size:12px; }
.org-row-main small { display:block; color:var(--muted); font-size:10px; margin-top:3px; }
.org-description { display:block; color:#a07870; font-size:10px; margin-top:5px; max-width:430px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.org-row-actions { display:flex; align-items:center; gap:8px; flex-shrink:0; }
.org-avatar { width:30px; height:30px; border-radius:9px; background:#eef8f7; color:#277b76; }
.org-avatar-root { background:#fff0df; color:#b26725; }
.org-permission-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px 14px; padding:10px 12px; border:1px solid var(--line); border-radius:7px; background:#fffaf8; }
.org-permission-grid label { display:flex; align-items:center; gap:7px; color:var(--ink); font-size:12px; }
.org-brand-section { padding: 4px 0 13px; border-bottom:1px solid var(--line); }
.org-brand-section + .org-brand-section { padding-top:16px; }
.org-brand-section:last-child { border-bottom:0; padding-bottom:0; }
.org-brand-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:0 2px 8px; }
.org-brand-name { display:flex; align-items:center; gap:9px; min-width:0; }
.org-brand-name > div { min-width:0; }
.org-brand-name b { display:block; font-size:12px; }
.org-brand-name small { display:block; color:var(--muted); font-size:10px; margin-top:3px; }
.brand-badge { width:27px; height:27px; border-radius:8px; display:grid; place-items:center; flex-shrink:0; background:var(--teal-soft); color:var(--teal-dark); font-size:11px; font-weight:700; }
.brand-badge.orange { background:var(--orange-soft); color:#a76225; }
.brand-badge.red { background:#fde4e2; color:#b64339; }
.org-brand-rows { padding-left:36px; }
.permission-section-heading { display:flex; align-items:baseline; justify-content:space-between; gap:10px; margin-bottom:8px; }
.permission-section-heading label { color:var(--ink); font-size:12px; font-weight:600; }
.permission-section-heading span { color:var(--muted); font-size:10px; }
.permission-groups { display:flex; flex-direction:column; gap:16px; }
.permission-group { padding:10px 11px 12px; border:1px solid var(--line); border-radius:9px; background:#fffaf8; }
.permission-group-head { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:0 1px 9px; }
.permission-group-head b { display:block; color:var(--ink); font-size:12px; }
.permission-group-head small { display:block; color:var(--muted); font-size:10px; margin-top:3px; }
.permission-group-head > span { color:#a07870; font-size:10px; white-space:nowrap; }
.permission-choice-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.permission-choice { display:grid; grid-template-columns:18px 28px minmax(0,1fr); align-items:center; gap:8px; min-height:58px; padding:9px 10px; border:1px solid var(--line); border-radius:8px; background:#fff; color:var(--ink); cursor:pointer; transition:border-color .15s,background .15s,box-shadow .15s; white-space:normal !important; }
.permission-choice:hover { border-color:#e1a093; background:#fffaf8; }
.permission-choice:has(input:checked) { border-color:#e7a095; background:#fff5f1; box-shadow:0 0 0 2px rgba(200,75,63,.08); }
.permission-choice input { width:15px; height:15px; margin:0; accent-color:var(--teal); }
.permission-choice-icon { width:27px; height:27px; border-radius:7px; display:grid; place-items:center; background:#f4f7f7; color:#718184; font-size:12px; font-weight:700; }
.permission-choice:has(input:checked) .permission-choice-icon { background:var(--teal-soft); color:var(--teal-dark); }
.permission-choice-copy { min-width:0; }
.permission-choice-copy b { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:11px; }
.permission-choice-copy small { display:block; margin-top:3px; color:var(--muted); font-size:9px; line-height:1.35; }
.org-member-add { display:flex; align-items:center; gap:9px; }
.org-member-add .control { flex:1; }
.org-member-note { color:var(--muted); font-size:10px; white-space:nowrap; }
.org-member-current { margin-top:9px; padding:10px 11px; border:1px solid #f1e5e1; border-radius:8px; background:#fffdfc; }
.org-member-current > span { display:block; color:var(--muted); font-size:10px; margin-bottom:6px; }
.org-member-current > div { display:flex; flex-wrap:wrap; gap:6px; }
.org-member-pending { background:#fffaf5; border-color:#f3dfc8; }
.org-member-pending[hidden] { display:none; }
.member-chip { display:inline-flex; align-items:center; gap:6px; padding:5px 8px; border:1px solid #f0d7d1; border-radius:6px; background:#fff; color:var(--ink); font-size:11px; }
.member-chip small { color:var(--muted); font-size:9px; }
.member-chip-admin { justify-content:space-between; flex:1 1 235px; min-width:220px; gap:12px; }
.member-chip-admin > span:first-child { min-width:0; }
.member-chip-admin b, .member-chip-admin small { display:block; }
.member-role-toggle { display:inline-flex; align-items:center; gap:5px; flex-shrink:0; color:var(--muted); font-size:10px; white-space:nowrap; cursor:pointer; }
.member-role-toggle input { width:14px; height:14px; margin:0; accent-color:var(--teal); }
.member-chip:has(.member-role-toggle input:checked) { border-color:#e4ad9f; background:#fff7f4; }
.account-enabled-toggle { display:flex !important; align-items:center; gap:8px; min-height:38px; padding:8px 10px; border:1px solid var(--line); border-radius:7px; background:#fffaf8; color:var(--ink); font-size:12px; }
.account-enabled-toggle input { width:15px; height:15px; accent-color:var(--teal); }
.import-actions { margin:14px 0; }
.import-file-label { cursor:pointer; }
.import-result { min-height:56px; padding:12px; border:1px dashed var(--line); border-radius:8px; background:#fffaf8; font-size:11px; line-height:1.7; }
.import-result.success { border-color:#b7d9ce; background:#f4fbf8; color:#367466; }
.import-result.error { border-color:#efc2ba; background:#fff6f3; color:#a4473b; }
.permission-tag { display:inline-flex; align-items:center; gap:4px; margin:2px 4px 2px 0; padding:3px 7px; border-radius:5px; background:var(--teal-soft); color:var(--teal-dark); font-size:10px; white-space:nowrap; }
.permission-tag-dot { width:5px; height:5px; border-radius:50%; background:var(--orange); }
.catalog-maintenance-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:22px; }
.catalog-maintenance-head { background:linear-gradient(180deg,#fffdfc 0%,#fffaf8 100%); }
.catalog-maintenance-head .btn { color:var(--teal-dark); background:#fff; border-color:#efd8d2; }
.catalog-maintenance-head .btn:hover { background:var(--teal-soft); border-color:#e7b2a9; }
.catalog-maintenance-panel .panel-body[hidden] { display:none; }
.catalog-maintenance-column { min-width:0; }
.catalog-maintenance-title { display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:8px; }
.catalog-option-list { display:flex; flex-direction:column; gap:6px; max-height:220px; overflow:auto; padding-right:3px; }
.catalog-option-row { display:flex; align-items:center; justify-content:space-between; gap:8px; min-height:34px; padding:5px 7px; border:1px solid var(--line); border-radius:6px; background:#fff; color:var(--ink); font-size:12px; }
.catalog-option-row:hover { border-color:#e6b1a5; background:#fffaf8; }
.catalog-option-actions { display:flex; align-items:center; gap:5px; flex-shrink:0; }
.catalog-maintenance-hint { margin-top:9px; color:#a07870; font-size:10px; line-height:1.45; }
.table-sort { border:0; background:transparent; color:inherit; font:inherit; font-weight:600; padding:0; cursor:pointer; white-space:nowrap; }
.table-sort:hover, .table-sort.active { color:var(--teal); }
.grid-2 { display:grid; grid-template-columns: 1.2fr .8fr; gap: 18px; }
.sample-form-layout { display:grid; grid-template-columns:minmax(0,1.36fr) minmax(360px,.64fr); gap:18px; align-items:start; }
.sample-entry-panel { min-width:0; }
.sample-recent-column { min-width:0; }
.sample-notice { margin-bottom:14px; background:#fff9f5; border-color:#f0d6cd; color:#8b5147; }
.sample-section-heading { display:flex; align-items:baseline; justify-content:space-between; gap:12px; margin-bottom:8px; }
.sample-section-heading label { display:block; font-size:11px; color:var(--muted); }
.sample-section-heading span { color:#a07870; font-size:10px; }
.sample-line { border:1px solid #f0e1dc; border-radius:8px; background:#fffdfc; padding:13px 14px 14px; margin-bottom:10px; }
.sample-line:focus-within { border-color:#e7b1a7; box-shadow:0 0 0 3px rgba(200,75,63,.06); }
.sample-line-head { display:flex; align-items:flex-start; justify-content:space-between; gap:10px; margin-bottom:12px; }
.sample-line-head b { display:block; font-size:12px; }
.sample-line-head small { display:block; margin-top:3px; color:var(--muted); font-size:10px; }
.sample-line-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:13px 14px; }
.sample-line-preview-field { min-width:0; }
.sample-line-preview { min-height:34px; border:1px solid var(--line); border-radius:6px; background:#fff; padding:5px 8px; display:flex; align-items:center; gap:8px; color:var(--ink); font-size:11px; overflow:hidden; }
.sample-line-preview > div:last-child { min-width:0; flex:1 1 auto; }
.sample-line-preview b { display:block; overflow-wrap:anywhere; white-space:normal; font-size:11px; line-height:1.45; }
.sample-line-preview small { display:block; margin-top:3px; color:var(--muted); font-size:9px; }
.sample-line-preview-pic { width:28px; height:28px; border-radius:6px; overflow:hidden; flex:0 0 auto; display:grid; place-items:center; background:#fff0e9; color:var(--teal); font-size:10px; }
.sample-line-preview-pic img { width:100%; height:100%; object-fit:cover; }
.sample-product-picker { position:relative; }
.sample-product-picker .autocomplete-menu { max-height:286px; overflow:auto; }
.sample-product-picker .auto-option { padding:9px 10px; align-items:flex-start; min-height:58px; }
.sample-product-picker .auto-option > span:last-child { min-width:0; flex:1 1 auto; }
.sample-product-picker .auto-option b { display:block; max-width:none; overflow-wrap:anywhere; white-space:normal; font-size:11px; line-height:1.45; }
.sample-product-picker .auto-option small { font-size:10px; }
.sample-product-picker .product-pic { flex:0 0 auto; }
.auto-empty { padding:12px 10px; color:var(--muted); font-size:11px; }
.sample-form-actions { display:flex; justify-content:flex-end; gap:8px; padding-top:2px; }
.sample-recent-panel .table-wrap { max-height:560px; }
.sample-recent-panel table { min-width:420px; }
.sample-recent-panel th { text-transform:none; letter-spacing:0; font-size:10px; }
.sample-recent-product { display:flex; align-items:center; gap:8px; min-width:150px; }
.sample-recent-product > span:last-child { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.sample-recent-product small { display:block; margin-top:3px; color:var(--muted); font-size:9px; }
@media (max-width: 1050px) { .sample-form-layout { grid-template-columns:1fr; } .sample-recent-column { display:grid; grid-template-columns:minmax(230px,.7fr) minmax(0,1.3fr); gap:14px; align-items:start; } .sample-notice { margin-bottom:0; } }
@media (max-width: 760px) { .sample-line-grid, .sample-recent-column { grid-template-columns:1fr; } .sample-section-heading { align-items:flex-start; flex-direction:column; gap:3px; } }
.grid-3 { display:grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.activity-list { display:flex; flex-direction:column; }
.activity { display:grid; grid-template-columns: 32px 1fr auto; gap:10px; padding: 13px 0; border-bottom:1px solid var(--line); align-items:center; }
.activity:last-child { border-bottom:0; padding-bottom:0; }
.activity:first-child { padding-top:0; }
.activity .avatar { width:32px; height:32px; font-size:10px; }
.activity-main { font-size:12px; }
.activity-main b { font-weight:600; }
.activity-main span { color:var(--muted); }
.activity-time { color:var(--muted); font-size:10px; }
.tag { border-radius: 4px; padding: 3px 7px; font-size:10px; background: var(--teal-soft); color:var(--teal-dark); white-space:nowrap; }
.tag.orange { background: var(--orange-soft); color: #a76225; }
.tag.red { background: #fde4e2; color: #b64339; }
.tag.gray { background: #eef1f2; color:#778188; }
.bar-chart { height: 180px; display:flex; align-items:flex-end; gap:18px; padding: 18px 16px 26px; }
.bar-wrap { flex:1; height:100%; display:flex; align-items:flex-end; justify-content:center; position:relative; }
.bar { width: 28px; min-height: 8px; border-radius: 5px 5px 2px 2px; background: var(--teal); position:relative; }
.bar:nth-child(even) { background: var(--orange); }
.bar-label { position:absolute; bottom:-22px; font-size:10px; color:var(--muted); }
.bar-value { position:absolute; top:-17px; font-size:9px; color:var(--muted); }
.toolbar { display:flex; gap:9px; align-items:center; flex-wrap:wrap; }
.application-summary-filterbar { display:flex; align-items:center; gap:9px; flex-wrap:wrap; padding:12px 18px; border-bottom:1px solid var(--line); background:#fffdfc; }
.application-summary-filterbar .control[type="date"] { width:142px; }
.application-summary-panel table { min-width:1180px; }
.application-products { min-width:220px; max-width:360px; line-height:1.65; white-space:normal; }
.application-order-table { min-width:1120px; }
.application-order-table td { vertical-align:top; }
.application-item-list { min-width:320px; display:flex; flex-direction:column; gap:7px; }
.application-item-line { display:flex; align-items:center; gap:9px; min-height:46px; padding:7px 8px; border:1px solid #f1e1dc; border-radius:7px; background:#fffdfc; }
.application-item-line + .application-item-line { margin-top:0; }
.application-item-main { min-width:0; flex:1 1 auto; }
.application-item-main b { display:block; color:var(--ink); font-size:11px; line-height:1.45; overflow-wrap:anywhere; }
.application-item-main small { display:block; margin-top:3px; color:var(--muted); font-size:9px; line-height:1.45; overflow-wrap:anywhere; }
.application-item-qty { flex:0 0 auto; color:var(--ink); font-size:11px; font-variant-numeric:tabular-nums; }
.application-item-actions { display:flex; flex:0 0 auto; gap:5px; }
.application-status-date { display:block; margin-top:5px; color:var(--muted); font-size:9px; white-space:nowrap; }
.application-recent-list { display:flex; flex-direction:column; gap:10px; max-height:560px; overflow:auto; }
.application-recent-order { padding:10px; border:1px solid #f0e1dc; border-radius:8px; background:#fffdfc; }
.application-recent-head { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; margin-bottom:8px; }
.application-recent-head span { min-width:0; }
.application-recent-head b, .application-recent-head small { display:block; }
.application-recent-head b { font-size:11px; }
.application-recent-head small { margin-top:3px; color:var(--muted); font-size:9px; }
.application-recent-head strong { color:var(--teal-dark); font-size:11px; white-space:nowrap; }
.application-recent-order .application-item-list { min-width:0; }
.application-recent-order .application-item-line { min-height:40px; padding:5px 7px; }
.application-recent-order .product-pic { width:28px; height:28px; }
.arrival-products-preview { padding:10px; border:1px solid var(--line); border-radius:8px; background:#fffaf8; }
.arrival-application-summary { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; margin-bottom:9px; padding-bottom:9px; border-bottom:1px solid #f0ded8; }
.arrival-application-summary b, .arrival-application-summary small { display:block; }
.arrival-application-summary small { margin-top:3px; color:var(--muted); font-size:10px; }
.arrival-application-summary strong { color:var(--teal-dark); white-space:nowrap; }
.arrival-products-preview .application-item-list { min-width:0; max-height:260px; overflow:auto; }
.receipt-reminder-panel { display:flex; align-items:center; gap:14px; margin-bottom:18px; padding:15px 16px; border:1px solid #f2b8a9; border-left:4px solid var(--red); border-radius:8px; background:#fff8f5; box-shadow:0 8px 22px rgba(143,29,20,.08); }
.receipt-reminder-icon { width:34px; height:34px; flex:0 0 34px; display:grid; place-items:center; border-radius:50%; background:var(--red); color:#fff; font-weight:800; }
.receipt-reminder-copy { min-width:180px; display:flex; flex-direction:column; gap:3px; }
.receipt-reminder-copy b { color:var(--ink); font-size:13px; }
.receipt-reminder-copy span { color:var(--muted); font-size:11px; }
.receipt-reminder-actions { margin-left:auto; display:flex; flex-wrap:wrap; justify-content:flex-end; gap:7px; }
.mandatory-receipt-modal { border-top:4px solid var(--red); }
.receipt-modal-summary { display:flex; justify-content:space-between; align-items:center; gap:12px; padding:12px 14px; margin-bottom:12px; border-radius:7px; background:#fff5ef; }
.receipt-modal-summary div { display:flex; flex-direction:column; gap:3px; }
.receipt-modal-summary span { color:var(--muted); font-size:11px; }
.receipt-modal-summary strong { color:var(--red); font-size:16px; white-space:nowrap; }
.receipt-modal-notice { margin:14px 0 0; }
.scrap-workflow-strip { display:flex; align-items:center; justify-content:center; gap:16px; margin-bottom:18px; padding:13px 16px; border:1px solid var(--line); border-radius:8px; background:#fff; color:var(--muted); font-size:11px; }
.scrap-workflow-strip span { display:flex; align-items:center; gap:7px; color:var(--ink); font-weight:600; }
.scrap-workflow-strip i { width:24px; height:24px; display:grid; place-items:center; border-radius:50%; background:#fff0e9; color:var(--red); font-style:normal; font-weight:700; }
.scrap-workflow-strip b { color:#e2b1a5; }
.scrap-approval-queue { margin:0 14px 14px; border:2px solid #ef9f8d; border-radius:8px; background:#fff7f3; overflow:hidden; box-shadow:0 8px 20px rgba(143,29,20,.09); }
.scrap-approval-queue-head { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:13px 14px; border-bottom:1px solid #f2c8bc; background:linear-gradient(90deg,#fff0ea 0%,#fff9f6 100%); }
.scrap-approval-queue-head h3 { margin:5px 0 2px; color:#79261d; font-size:14px; }
.scrap-approval-queue-head p { margin:0; color:#9a655c; font-size:10px; }
.scrap-approval-queue-head > strong { min-width:34px; height:34px; display:grid; place-items:center; border-radius:50%; background:var(--red); color:#fff; font-size:15px; }
.scrap-attention-label { padding:3px 7px; border-radius:4px; background:#d74a3a; color:#fff; font-size:9px; font-weight:700; }
.scrap-approval-cards { padding:10px; display:grid; gap:8px; }
.scrap-approval-card { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:12px; padding:11px; border:1px solid #f0d0c7; border-radius:7px; background:#fff; }
.scrap-approval-card-copy { min-width:0; display:flex; flex-direction:column; gap:3px; }
.scrap-approval-card-copy b { color:var(--ink); font-size:12px; }
.scrap-approval-card-copy span { color:#7b514a; font-size:10px; }
.scrap-approval-card-copy small { overflow:hidden; color:var(--muted); font-size:10px; text-overflow:ellipsis; white-space:nowrap; }
.scrap-approval-cta { min-height:36px; padding:8px 13px; box-shadow:0 5px 12px rgba(180,35,24,.2); white-space:nowrap; }
.scrap-approval-button { min-height:34px; font-weight:700; box-shadow:0 4px 10px rgba(180,35,24,.18); }
.scrap-application-table tr.scrap-row-attention > td { background:#fff8f4; }
.scrap-application-table tr.scrap-row-attention > td:first-child { box-shadow:inset 4px 0 0 var(--red); }
.admin-approval-queue { margin-bottom:18px; border:2px solid #ef9f8d; border-radius:8px; background:#fff7f3; overflow:hidden; box-shadow:0 9px 24px rgba(143,29,20,.1); }
.admin-approval-queue-head { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:14px 16px; border-bottom:1px solid #f2c8bc; background:linear-gradient(90deg,#ffede6 0%,#fff9f6 100%); }
.admin-approval-queue-head h3 { margin:5px 0 2px; color:#79261d; font-size:15px; }
.admin-approval-queue-head p { margin:0; color:#956158; font-size:10px; }
.admin-approval-queue-head > strong { min-width:38px; height:38px; display:grid; place-items:center; border-radius:50%; background:var(--red); color:#fff; font-size:16px; }
.admin-attention-label { padding:3px 8px; border-radius:4px; background:#d74a3a; color:#fff; font-size:9px; font-weight:700; }
.admin-approval-cards { max-height:360px; padding:10px; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; overflow:auto; }
.admin-approval-card { min-width:0; display:flex; align-items:center; gap:12px; padding:12px; border:1px solid #f0d0c7; border-radius:7px; background:#fff; }
.admin-approval-card-copy { min-width:0; flex:1; display:flex; flex-direction:column; gap:3px; }
.admin-approval-card-copy > div { display:flex; align-items:center; gap:6px; }
.admin-approval-card-copy > div b { color:var(--ink); font-size:11px; }
.admin-approval-card-copy > strong { overflow:hidden; color:#752a21; font-size:12px; text-overflow:ellipsis; white-space:nowrap; }
.admin-approval-card-copy > span, .admin-approval-card-copy > small { overflow:hidden; color:var(--muted); font-size:10px; text-overflow:ellipsis; white-space:nowrap; }
.admin-approval-actions { flex:0 0 auto; display:flex; flex-direction:column; gap:6px; }
.admin-approval-actions .btn { min-width:88px; min-height:32px; font-weight:700; }
tr.approval-row-attention > td { background:#fff8f4; }
tr.approval-row-attention > td:first-child { box-shadow:inset 4px 0 0 var(--red); }
@media (max-width: 760px) { .receipt-reminder-panel { align-items:flex-start; flex-wrap:wrap; } .receipt-reminder-actions { width:100%; margin-left:48px; justify-content:flex-start; } .scrap-workflow-strip { align-items:flex-start; flex-direction:column; gap:8px; } .scrap-workflow-strip > b { display:none; } }
@media (max-width: 760px) { .scrap-approval-card { grid-template-columns:1fr; } .scrap-approval-cta { width:100%; } }
@media (max-width: 980px) { .admin-approval-cards { grid-template-columns:1fr; } }
@media (max-width: 620px) { .admin-approval-card { align-items:stretch; flex-direction:column; } .admin-approval-actions { flex-direction:row; } .admin-approval-actions .btn { flex:1; } }
@media (max-width:760px) { .application-item-actions { flex-direction:column; } .application-item-list { min-width:280px; } }
.separated-summary-grid { display:grid; grid-template-columns:1fr; }
.separated-summary-section, .application-type-section { min-width:0; padding:16px 18px 18px; }
.separated-summary-section + .separated-summary-section, .application-type-section + .application-type-section { border-top:1px solid var(--line); }
.separated-summary-head, .application-type-head { min-height:38px; margin-bottom:10px; display:flex; align-items:center; justify-content:space-between; gap:12px; }
.separated-summary-head h3, .application-type-head h3 { margin:0; font-size:13px; color:var(--ink); }
.separated-summary-head p, .application-type-head p { margin:3px 0 0; color:var(--muted); font-size:10px; }
.separated-summary-section table { min-width:720px; }
.coupon-summary-section, .coupon-application-section { background:#fffdfb; }
.bulk-delete-warning { max-height:190px; overflow:auto; line-height:1.8; }
@media (min-width: 1320px) {
  .separated-summary-grid { grid-template-columns:1fr 1fr; }
  .separated-summary-section + .separated-summary-section { border-top:0; border-left:1px solid var(--line); }
}
.control { height:34px; border:1px solid var(--line); border-radius:6px; background:#fff; padding:0 10px; color:var(--ink); font-size:12px; outline:none; }
.control:focus { border-color:#d88978; box-shadow:0 0 0 3px rgba(180,35,24,.1); }
.search { width: 220px; padding-left:31px; background: white url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%2374808b' stroke-width='2'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-4-4'/%3E%3C/svg%3E") no-repeat 10px center; }
.table-wrap { overflow:auto; max-height:min(58vh, 560px); overscroll-behavior:contain; scrollbar-color:#e4aaa0 #fff7f4; scrollbar-width:thin; }
table { width:100%; border-collapse:collapse; min-width: 740px; }
th { text-align:left; font-size:10px; text-transform:uppercase; letter-spacing:.6px; color:#87939a; padding: 11px 12px; background:#fafbfb; border-bottom:1px solid var(--line); white-space:nowrap; position:sticky; top:0; z-index:2; }
.col-resizer { position:absolute; right:0; top:0; width:7px; height:100%; cursor:col-resize; opacity:0; }
th { position:sticky; }
th:hover .col-resizer { opacity:1; background:#b9d6d2; }
td { padding: 13px 12px; font-size:12px; border-bottom:1px solid var(--line); vertical-align:middle; }
tr:last-child td { border-bottom:0; }
tr:hover td { background:#fbfdfd; }
.product-cell { display:flex; align-items:center; gap:10px; min-width:180px; }
.product-pic { width:34px; height:34px; border-radius:7px; object-fit:cover; background:#fff0e9; display:grid; place-items:center; color:var(--teal); font-weight:700; font-size:11px; overflow:hidden; }
.product-pic img { width:100%; height:100%; object-fit:cover; }
.product-name { font-weight:600; font-size:12px; }
.product-code { color:var(--muted); font-size:10px; margin-top:3px; }
.muted { color:var(--muted); }
.num { font-variant-numeric: tabular-nums; }
.form-grid { display:grid; grid-template-columns: repeat(2, 1fr); gap: 14px; }
.form-grid .full { grid-column:1/-1; }
.field label { display:block; font-size:11px; color:var(--muted); margin-bottom:6px; }
.field label em { color:var(--red); font-style:normal; }
.field input, .field select, .field textarea { width:100%; border:1px solid var(--line); border-radius:6px; background:#fff; padding: 9px 10px; color:var(--ink); outline:none; font-size:12px; }
.field textarea { min-height:72px; resize:vertical; }
.field input:focus, .field select:focus, .field textarea:focus { border-color:#d88978; box-shadow:0 0 0 3px rgba(180,35,24,.1); }
.autocomplete { position:relative; }
.autocomplete-menu { position:absolute; z-index:20; left:0; right:0; top:100%; margin-top:4px; background:#fff; border:1px solid var(--line); border-radius:7px; box-shadow:var(--shadow); overflow:hidden; display:none; }
.autocomplete-menu.show { display:block; }
.auto-option { padding:10px; display:flex; gap:9px; align-items:center; border-bottom:1px solid #f0f2f2; cursor:pointer; }
.auto-option:last-child { border-bottom:0; }
.auto-option:hover { background:#fff7f4; }
.auto-option small { display:block; color:var(--muted); margin-top:2px; }
.modal-backdrop { position:fixed; inset:0; background:rgba(55,25,21,.32); backdrop-filter:blur(3px) saturate(.96); display:flex; align-items:center; justify-content:center; z-index:50; padding:20px; overflow-y:auto; }
.modal { width:var(--modal-width, min(700px, 100%)); height:var(--modal-height, auto); min-width:min(360px, calc(100vw - 40px)); min-height:220px; max-width:calc(100vw - 40px); max-height:calc(100vh - 40px); display:flex; flex-direction:column; background:#fffdfc; border:1px solid rgba(226,211,206,.9); border-radius:13px; box-shadow:0 22px 58px rgba(69,28,20,.16); overflow:hidden; resize:both; }
.modal.modal-size-narrow { --modal-width:min(480px, calc(100vw - 40px)); }
.modal.modal-size-standard { --modal-width:min(700px, calc(100vw - 40px)); }
.modal.modal-size-wide { --modal-width:min(960px, calc(100vw - 40px)); }
.modal-size-tools { display:flex; align-items:center; gap:3px; margin-left:auto; margin-right:8px; }
.modal-size-tools button { width:24px; height:24px; padding:0; border:1px solid transparent; border-radius:5px; background:transparent; color:var(--muted); font-size:12px; line-height:1; }
.modal-size-tools button:hover, .modal-size-tools button.active { color:var(--teal-dark); background:var(--teal-soft); border-color:#efc8c0; }
.modal-head { padding:20px 22px; display:flex; justify-content:space-between; align-items:flex-start; border-bottom:1px solid #f1e6e2; background:linear-gradient(180deg,#fffdfc 0%,#fffaf8 100%); }
.modal-head h2 { margin:0; font-size:18px; }
.modal-head p { color:var(--muted); margin:5px 0 0; font-size:11px; }
.modal-body { padding:20px 22px; overflow-y:auto; min-height:0; flex:1 1 auto; scrollbar-color:#e4aaa0 #fff7f4; scrollbar-width:thin; }
.modal-foot { padding:14px 22px; border-top:1px solid #f1e6e2; display:flex; justify-content:flex-end; gap:8px; flex:0 0 auto; background:#fffdfc; }
.notice { background:#fff7f4; border:1px solid #f2d0c7; border-radius:7px; padding:12px 13px; font-size:11px; line-height:1.7; color:#8f3a2d; margin-bottom:16px; }
.notice strong { color:var(--teal-dark); }
.tabs { display:flex; gap:5px; border-bottom:1px solid var(--line); margin-bottom:18px; }
.tab { border:0; background:transparent; padding:10px 13px; color:var(--muted); font-size:12px; border-bottom:2px solid transparent; }
.tab.active { color:var(--teal); border-bottom-color:var(--teal); font-weight:600; }
.segmented { display:inline-flex; background:var(--soft); border-radius:7px; padding:3px; gap:2px; }
.segment { border:0; background:transparent; color:var(--muted); border-radius:5px; padding:6px 12px; font-size:11px; }
.segment.active { background:#fff; color:var(--teal-dark); box-shadow:0 1px 3px rgba(0,0,0,.08); font-weight:600; }
.empty { padding:40px; text-align:center; color:var(--muted); font-size:12px; }
.notice-card { background:#fff5eb; border:1px solid #f5c99f; border-radius:8px; padding:13px; color:#8a4a1c; font-size:11px; line-height:1.6; }
.progress { height:7px; background:#eef1f1; border-radius:10px; overflow:hidden; }
.progress span { display:block; height:100%; background:var(--teal); border-radius:10px; }
.metric-row { display:flex; justify-content:space-between; align-items:center; font-size:11px; padding:10px 0; border-bottom:1px solid var(--line); }
.metric-row:last-child { border:0; }
.switch { width:36px; height:20px; border-radius:20px; border:0; background:#cbd6d5; position:relative; }
.switch::after { content:""; position:absolute; top:3px; left:3px; width:14px; height:14px; border-radius:50%; background:white; transition:.2s; }
.switch.on { background:var(--teal); }
.switch.on::after { left:19px; }
.hide { display:none !important; }
.toast-region { position:fixed; right:24px; bottom:24px; z-index:100; display:flex; flex-direction:column; gap:8px; }
.toast { background:#6d1a13; color:white; padding:11px 14px; border-radius:7px; box-shadow:0 10px 25px rgba(91,25,18,.2); font-size:12px; display:flex; align-items:center; gap:8px; animation:toast-in .25s ease-out; }
.toast span { width:18px; height:18px; border-radius:50%; display:grid; place-items:center; background:#ffb27a; color:#6d1a13; font-size:11px; font-weight:700; }
.toast.error { background:#8f1d14; }
.toast.error span { background:#ffc1b5; color:#8f1d14; }
@keyframes toast-in { from { transform:translateY(8px); opacity:0; } to { transform:none; opacity:1; } }
@media (max-width: 1250px) { .page { padding:24px; } .topbar { padding:0 24px; } .stats-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 760px) { .catalog-maintenance-grid { grid-template-columns:1fr; gap:16px; } .permission-choice-grid { grid-template-columns:1fr; } .org-brand-rows { padding-left:0; } .org-brand-heading { align-items:flex-start; } .org-member-add { align-items:stretch; flex-direction:column; } .org-member-note { white-space:normal; } }
@media (max-width: 520px) { .modal-backdrop { padding:10px; } .modal { min-width:calc(100vw - 20px); max-width:calc(100vw - 20px); max-height:calc(100vh - 20px); } .modal.modal-size-narrow, .modal.modal-size-standard, .modal.modal-size-wide { --modal-width:calc(100vw - 20px); } }

.auth-shell { min-height:100vh; display:flex; align-items:center; justify-content:center; padding:24px; background:#fff7f4; }
.auth-card { width:min(440px,100%); background:#fff; border:1px solid #f0d8d2; border-radius:12px; box-shadow:0 18px 48px rgba(91,25,18,.14); padding:32px; }
.auth-brand { margin-bottom:28px; }
.auth-card h1 { margin:8px 0 8px; font-size:28px; }
.auth-desc { color:var(--muted); font-size:13px; line-height:1.7; margin:0 0 22px; }
.auth-hint { margin-top:18px; padding:10px 12px; border-radius:6px; background:#fff4ec; color:#8a4a1c; font-size:11px; line-height:1.7; }
.auth-error { margin-top:12px; padding:9px 11px; border-radius:6px; background:var(--red-soft); color:#a95050; font-size:12px; }

/* Keep account and permission controls readable at compact modal widths. */
.modal .form-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 18px; }
.modal .field { min-width: 0; }
.modal label:has(input[type="checkbox"]) { white-space: nowrap; }
.modal .field.full > div[style*="grid-template-columns"] { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 10px 14px !important; }
.modal .field.full > div[style*="grid-template-columns"] label { line-height: 1.35; }
.modal .modal-head h2 { color: var(--ink); }
.modal .modal-foot .btn-primary { box-shadow: 0 5px 12px rgba(180,35,24,.18); }
.btn:focus-visible, .control:focus-visible, .nav-item:focus-visible, .tab:focus-visible, .icon-btn:focus-visible { outline: 3px solid rgba(249,115,22,.28); outline-offset: 2px; }
