/* Shared merchant console tokens and components. */
:root {
  --green: #24734d;
  --line: #e6e9ed;
  --muted: #697586;
  --text: #202939;
  --canvas: #f3f5f8;
  --surface: #fff;
  --primary-soft: #eaf5ef;
  --radius: 8px;
  --control-height: 36px;
  color: var(--text);
  background: var(--canvas);
  font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Microsoft YaHei", sans-serif;
  -webkit-font-smoothing: antialiased;
  font-variant-numeric: tabular-nums;
}
body { color:var(--text); line-height:1.5; }
button { min-height:var(--control-height); padding:7px 15px; border-radius:6px; font-size:13px; font-weight:500; transition:background .15s,border-color .15s; }
button:hover { background:#1c603f; }
button:disabled { opacity:1; color:#a3abb7; background:#f5f6f8; border-color:var(--line); }
button.ghost { color:#475467; border-color:#d8dde5; background:#fff; }
button.ghost:hover { color:var(--green); border-color:#85b79c; background:#f6fbf8; }
button:focus-visible,a:focus-visible { outline:2px solid #24734d; outline-offset:3px; }
input,select,textarea { color:var(--text); border-color:#d8dde5; border-radius:6px; padding:7px 11px; font-size:13px; min-height:var(--control-height); }
input::placeholder,textarea::placeholder { color:#98a2b3; }
input:focus,select:focus,textarea:focus { border-color:var(--green); box-shadow:0 0 0 3px #24734d12; }
input[type=checkbox] { min-height:0; accent-color:var(--green); }
input[type=file] { padding:6px; background:#fafbfc; }
input[type=file]::file-selector-button { padding:5px 10px; border:0; border-radius:4px; margin-right:10px; color:#475467; background:#e9edf2; cursor:pointer; }
label { color:#344054; font-size:13px; margin:16px 0; font-weight:500; }
label input,label select,label textarea { margin-top:6px; }
h3 { font-size:15px; color:#283546; margin-bottom:16px; }
p,.muted { color:var(--muted); line-height:1.7; }
.sidebar { width:216px; border-color:var(--line); }
.brand { height:72px; padding:0 22px; gap:10px; border-bottom:1px solid var(--line); margin-bottom:24px; }
.brand-mark { width:34px; height:36px; border-radius:8px; background:var(--green); font-size:20px; }
.brand strong { font-size:15px; color:#263648; }
.brand div > span { font-size:11px; margin-top:2px; color:#98a2b3; }
.nav-label { padding:0 24px 12px; color:#98a2b3; }
nav { padding:0 12px; gap:5px; }
nav button { height:44px; min-height:44px; padding:10px 14px; border-radius:6px; color:#536174; font-size:14px; gap:12px; }
nav button:hover { background:#f4f6f8; color:#344054; }
nav button.selected { color:var(--green); background:var(--primary-soft); font-weight:600; }
.nav-icon,.selected .nav-icon { color:inherit; }
.nav-icon svg { width:18px; height:18px; }
.nav-arrow { font-size:17px; }
.sidebar-bottom { margin: auto 22px 20px; font-size:11px; color:#667085; }
.sidebar-bottom div { color:#98a2b3; }
.workspace-topbar { left:216px; height:64px; padding:0 24px; background:#fff; backdrop-filter:none; }
.breadcrumb { gap:12px; color:#98a2b3; }
.breadcrumb strong { color:#344054; font-weight:600; }
#session { color:#475467; font-size:12px; }
.operator { background:#f2f4f7; color:#667085; }
.workspace-main { margin-left:216px; padding:84px 24px 24px; }
.workspace-footer { color:#98a2b3; margin-top:24px; }
.panel,.card { border-radius:var(--radius); padding:20px; background:var(--surface); border-color:var(--line); box-shadow:none; }
.data-surface { background:#fff; border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; }
.filter-bar { padding:16px 20px; gap:12px; border:0; border-radius:0; background:#fff; min-height:70px; }
.filter-bar input[type=search] { width:300px; max-width:360px; padding-left:33px; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' stroke='%2398a2b3' stroke-width='1.6'%3E%3Ccircle cx='7' cy='7' r='4.5'/%3E%3Cpath d='m10.5 10.5 3.5 3.5'/%3E%3C/svg%3E"); background-position:11px center; background-repeat:no-repeat; }
.filter-bar select { width:144px; flex-shrink:0; }
.filter-count { font-size:12px; color:#98a2b3; white-space:nowrap; }
.list-actions { gap:8px; }
.data-surface > .table-wrap { border:0; border-top:1px solid var(--line); border-radius:0; }
.table-wrap { border-color:var(--line); border-radius:6px; }
th,td { padding:14px 20px; color:#475467; border-bottom-color:#edf0f3; font-size:13px; }
th { background:#f8fafc; color:#667085; font-size:12px; font-weight:500; height:44px; padding-top:11px; padding-bottom:11px; }
tbody tr:hover { background:#f8fbfa; }
td strong { color:#344054; font-weight:500; }
td .muted { font-size:11px; margin-top:3px; color:#98a2b3; }
.table-product { gap:12px; }
.table-product img,.product-initial { width:40px; height:40px; border-radius:6px; border:1px solid #edf0f3; }
.product-initial { color:#608772; background:#edf5f0; font-size:17px; }
button.table-action { border:0; min-height:28px; padding:3px 7px; color:var(--green); background:transparent; }
button.table-action:hover { background:var(--primary-soft); border:0; }
.state-pill,.badge { display:inline-flex; align-items:center; gap:5px; padding:3px 8px; font-size:11px; font-weight:500; border-radius:4px; background:#eaf6ef; color:#28764d; line-height:1.6; }
.state-pill::before { content:""; width:5px; height:5px; background:currentColor; border-radius:50%; }
.state-pill.off { background:#f2f4f7; color:#7b8797; }
.pagination { border:0; border-top:1px solid var(--line); border-radius:0; padding:14px 20px; min-height:60px; color:#98a2b3; }
.pagination .pager-buttons { gap:12px; }
.pagination button { min-height:30px; padding:4px 10px; font-size:12px; }
.empty { border:0; border-radius:0; padding:64px 20px; color:#98a2b3; background:#fff; }
.empty::before { content:""; display:block; width:40px; height:32px; border:2px solid #d8dfe7; border-top:7px solid #e9edf2; border-radius:5px; margin:0 auto 16px; }
.data-surface > .cards { gap:16px; padding:20px; background:#fafbfc; grid-template-columns:repeat(auto-fit,minmax(290px,1fr)); }
.order-card { display:flex; flex-direction:column; min-width:0; padding:18px; }
.order-card .row { margin:0 0 14px; }
.order-card .status { font-size:12px; }
.order-card .total { font-size:22px; font-weight:600; color:#243344; }
.order-card > .muted { font-size:12px; overflow-wrap:anywhere; }
.order-card ul { margin:16px 0; padding:12px 0; border-top:1px solid #f0f2f5; border-bottom:1px solid #f0f2f5; list-style:none; }
.order-card li { color:#344054; padding:3px 0; line-height:1.7; }
.order-card li .muted { display:block; font-size:12px; }
.order-card hr { display:none; }
.order-card > p { margin:14px 0 0; padding-top:14px; border-top:1px solid #f0f2f5; font-size:12px; }
.order-card .actions { margin-top:16px; }
.order-card[data-order-state=paid] .status { background:#fff4df; color:#a06413; }
.order-card[data-order-state=preparing] .status,.order-card[data-order-state=delivering] .status { background:#edf3ff; color:#3265b8; }
.order-card[data-order-state=refund_pending] .status { background:#fff0ec; color:#bd533b; }
.order-card[data-order-state=refunded] .status,.order-card[data-order-state=cancelled] .status,.order-card[data-order-state=pending_payment] .status { background:#f0f2f5; color:#788493; }
#content[data-view=reviews] .cards { grid-template-columns:repeat(auto-fit,minmax(340px,1fr)); }
#content[data-view=reviews] .card textarea { min-height:88px; }
.standalone-toolbar,.marketing-filter { border:1px solid var(--line); border-radius:var(--radius); margin-bottom:16px; }
.rules-layout { max-width:none; }
.rules-layout form { padding:24px; }
.rules-layout label { max-width:620px; }
#content[data-view=settings] > .cards { grid-template-columns:1fr; }
.store-settings > label:not([hidden]) { margin-top:4px; min-width:240px; max-width:360px; }
.settings-section { border-top-color:var(--line); margin-top:24px; padding-top:24px; }
.week-row { padding:13px 0; border-bottom-color:#edf0f3; }
.time-slot input { min-height:32px; }
#report-filter { margin-bottom:16px; }
#report-filter > .row { justify-content:flex-start; align-items:flex-end; flex-wrap:wrap; gap:12px; margin:0; }
#report-filter label { margin:0; width:190px; }
#report-filter p { margin:12px 0 0; font-size:12px; }
#report-filter .list-actions { margin-left:auto; }
.inline-alert { padding:11px 16px; border:1px solid #f3dfb0; background:#fffaf0; border-radius:6px; color:#94681d; font-size:12px; }
.inline-alert strong { font-weight:400; }
#content > .cards.metric-grid { grid-template-columns:repeat(4,minmax(150px,1fr)); gap:16px; margin:16px 0; }
.metric-grid .card { padding:18px 20px; }
.metric-grid .muted { font-size:12px; }
#content .metric-grid article > h2 { color:#243344; font-size:26px; font-weight:600; letter-spacing:0; margin:10px 0 0; }
.report-section { margin-bottom:16px; }
.report-section > h3 { padding-bottom:14px; margin-bottom:16px; border-bottom:1px solid #edf0f3; }
.report-section > p:last-child { margin-bottom:0; }
.report-section > .table-wrap { border-radius:6px; }
.report-section .stats { margin-bottom:0; gap:10px; }
.report-section .stats span { background:#f8fafc; padding:8px 14px; color:#667085; border-radius:5px; }
.product-dialog,.ui-dialog { color:var(--text); border:0; border-radius:10px; padding:24px; width:min(720px,calc(100vw - 32px)); max-height:88vh; box-shadow:0 20px 80px #10182830; }
.product-dialog::backdrop,.ui-dialog::backdrop { background:#10182865; backdrop-filter:none; }
.dialog-header { top:-24px; margin:-4px 0 20px; padding:4px 0 16px; border-color:var(--line); }
.product-dialog h2,.ui-dialog h2 { font-size:17px; color:#243344; letter-spacing:0; font-weight:600; }
.dialog-close { min-height:30px; height:30px; width:30px; padding:0; color:#98a2b3; font-size:22px; }
.dialog-message:empty,#edit-error:empty { display:none; }
.dialog-message,#edit-error { color:#c6473c; background:#fff3f1; padding:10px 12px; border-radius:6px; }
.ui-dialog form > button { display:block; margin-left:auto; }
.product-dialog #edit-product > h2 { padding-bottom:16px; border-bottom:1px solid var(--line); }
.product-dialog #edit-product > .row { padding-top:16px; border-top:1px solid var(--line); margin:20px 0 0; gap:8px; }
#notice { top:76px; border-color:var(--line); border-radius:6px; box-shadow:0 6px 24px #10182814; color:#344054; }
#login { border-radius:10px; }
.login-mark { background:var(--green); }
@media(min-width:1650px) { .workspace-main { padding-left:32px; padding-right:32px; } }
@media(max-width:1100px) { #content > .cards.metric-grid { grid-template-columns:repeat(3,minmax(130px,1fr)); } }
@media(max-width:1000px) and (min-width:701px) { .sidebar { width:184px; } .workspace-topbar { left:184px; } .workspace-main { margin-left:184px; padding-left:20px; padding-right:20px; } .brand { padding-left:16px; } }
@media(max-width:700px) {
 .sidebar { width:68px; } .brand { padding:0 16px; height:64px; margin-bottom:16px; }
 nav button { font-size:0; padding:10px 4px; } nav .nav-icon { width:20px; }
 .workspace-topbar { left:68px; height:64px; padding:0 14px; }
 .workspace-main { margin-left:68px; padding:80px 12px 20px; }
 .filter-bar { padding:14px; gap:10px; } .filter-bar input[type=search],.filter-bar select { width:100%; max-width:none; }
 .filter-bar .list-actions { margin-left:auto; flex-wrap:wrap; }
 .data-surface > .cards,#content[data-view=reviews] .cards { grid-template-columns:minmax(0,1fr); padding:12px; gap:12px; }
 .pagination { padding:12px; gap:12px; flex-wrap:wrap; }
 #content > .cards.metric-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
 .metric-grid .card { padding:14px; } #content .metric-grid article > h2 { font-size:20px; }
 #report-filter label { width:100%; } #report-filter .list-actions { margin-left:0; }
 .store-settings > label:not([hidden]) { display:block; min-width:0; max-width:none; margin-right:0; }
 .panel,.card,.rules-layout form { padding:16px; }
 .product-dialog,.ui-dialog { padding:20px; } .dialog-header { top:-20px; }
 #notice { left:50%; }
}
@media(prefers-reduced-motion:reduce) { * { transition:none !important; scroll-behavior:auto !important; } }
.form-footer { grid-column:1 / -1; display:flex; flex-direction:row-reverse; gap:8px; border-top:1px solid var(--line); margin-top:20px; padding-top:16px; }
.form-footer button { margin:0; }
.filter-bar > button:not(.ghost) { order:3; }
button.ghost:disabled,button.ghost:disabled:hover { color:#a3abb7; background:#f7f8fa; border-color:var(--line); }
.section-toolbar { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:16px; padding-bottom:16px; border-bottom:1px solid var(--line); }
.section-toolbar h3 { margin:0; }
#point-rules { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 24px; }
#point-rules > h3,#point-rules > p { grid-column:1 / -1; }
#point-rules > button { grid-column:1 / -1; justify-self:end; margin-top:16px; }
#content[data-view=settings] #coupon { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 24px; }
#coupon > h3,#coupon > p { grid-column:1 / -1; }
#coupon > button { grid-column:1 / -1; justify-self:end; }
@media(max-width:700px) { #point-rules,#content[data-view=settings] #coupon { grid-template-columns:1fr; } }

.community-qr-preview { display:block; width:180px; height:180px; object-fit:contain; padding:10px; border:1px solid var(--line); border-radius:8px; margin:16px 0; background:#fff; }
.community-form-actions { display:flex; gap:8px; margin-top:20px; }
#community-settings label { max-width:640px; }

/* Keep all management modules usable on shorter screens. */
.sidebar nav { overflow-y:auto; min-height:0; flex:1; padding-bottom:12px; }
.sidebar-bottom { flex-shrink:0; padding-top:12px; }

.member-identity{display:flex;align-items:center;gap:12px;min-width:160px}.member-avatar{display:block;width:40px;height:40px;object-fit:cover;flex-shrink:0;border-radius:50%;background:#f3f5f4;border:1px solid #e8ece9}.member-identity strong{display:block;font-size:14px;font-weight:600}.member-identity .muted{display:block;margin-top:3px;font-size:12px}.member-detail-identity{margin-bottom:20px}.member-detail-identity .member-avatar{width:64px;height:64px}.member-detail-identity strong{font-size:18px}
