.icon { display: inline-block; width: 19px; height: 19px; flex: 0 0 auto; vertical-align: middle; }
.nav-icon { display: grid; place-items: center; width: 22px !important; height: 22px; }
.nav-icon .icon { width: 18px; height: 18px; }
.stat-icon .icon { width: 21px; height: 21px; }
.button .icon { width: 16px; height: 16px; }
.dish-thumb.placeholder .icon { width: 22px; height: 22px; }
.demo-accounts {
  display: grid;
  gap: 4px;
  margin-top: 18px;
  padding: 12px 14px;
  border-radius: 10px;
  background: #f6f8f7;
  color: #798481;
  font-size: 11px;
}
.demo-accounts strong { color: var(--ink); }
.brand small {
  display: block;
  color: #9aa5a2;
  font: 600 9px 'DM Sans';
  letter-spacing: .08em;
  text-transform: uppercase;
  margin-top: 2px;
}
.portal-logo { width: 37px; height: 37px; border-radius: 10px; font-size: 15px; }
.restaurant-portal .sidebar nav a.active {
  background: color-mix(in srgb, var(--portal-brand) 11%, white);
  color: var(--portal-brand);
}
.restaurant-portal .sidebar nav a b,
.portal-button { background: var(--portal-brand); color: #fff; }
.restaurant-portal .eyebrow { color: var(--portal-brand); }
.restaurant-portal .eyebrow.light { color: #9ee7d4; }
.restaurant-welcome {
  background: linear-gradient(125deg, #142f2b, color-mix(in srgb, var(--portal-brand) 30%, #173d36));
}
.restaurant-welcome .pulse-orbit { width: 180px; height: 180px; }
.restaurant-welcome .pulse-orbit span { font-size: 23px; }
.storefront-link {
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: #f1f6f4;
  border-radius: 10px;
  padding: 12px 13px;
  margin-bottom: 14px;
  font-size: 12px;
  font-weight: 700;
  color: #37645a;
}
.dashboard-grid {
  display: grid;
  grid-template-columns: 1.4fr 1fr;
  gap: 17px;
  margin-bottom: 30px;
}
.section-head.inline { margin: 0 0 22px; }
.bar-chart {
  height: 220px;
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  align-items: end;
  gap: 13px;
}
.bar-column {
  height: 100%;
  display: grid;
  grid-template-rows: 20px 1fr 20px;
  text-align: center;
  gap: 6px;
  min-width: 0;
}
.bar-value { font-size: 9px; color: #87918e; white-space: nowrap; overflow: hidden; }
.bar-track {
  height: 100%;
  background: #f2f5f4;
  border-radius: 7px 7px 3px 3px;
  display: flex;
  align-items: end;
  overflow: hidden;
}
.bar-track i {
  display: block;
  width: 100%;
  background: var(--portal-brand);
  border-radius: 7px 7px 3px 3px;
  min-height: 4px;
}
.bar-column small { font-size: 10px; color: #87918e; }
.ranking { display: grid; }
.ranking > div {
  display: grid;
  grid-template-columns: 28px 1fr auto;
  align-items: center;
  gap: 10px;
  padding: 11px 0;
  border-bottom: 1px solid var(--line);
}
.ranking > div:last-child { border-bottom: 0; }
.ranking > div > b {
  display: grid;
  place-items: center;
  width: 24px;
  height: 24px;
  border-radius: 7px;
  background: #f2f5f4;
  font-size: 10px;
}
.ranking span { display: grid; }
.ranking strong { font-size: 12px; }
.ranking small { color: var(--muted); font-size: 10px; }
.ranking em { font-style: normal; font-weight: 700; font-size: 11px; }
.empty-state { color: var(--muted); font-size: 13px; }
.compact-orders { grid-template-columns: repeat(3, 1fr); }
.access-card {
  display: flex;
  align-items: center;
  gap: 13px;
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 15px;
  margin-top: 20px;
}
.access-card .avatar {
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: #17322e;
  color: #fff;
  font-size: 11px;
}
.access-card > div { display: grid; flex: 1; }
.access-card small { color: var(--muted); font-size: 11px; }
.form-grid label > small { color: var(--muted); font-weight: 400; }
.security-form { max-width: 520px; margin-top: 24px; }
.security-list { list-style: none; padding: 0; margin: 18px 0 0; display: grid; gap: 12px; color: #467164; font-size: 13px; }
.security-panel { margin-top: 22px; }
.security-panel h2 { margin: 7px 0 22px; }
.menu-builder { display: grid; grid-template-columns: minmax(0,1fr) 410px; gap: 25px; align-items: start; }
.dish-form-panel { position: sticky; top: 130px; }
.dish-form-panel h2 { margin: 7px 0 22px; }
.rich-menu-list .dish-thumb { width: 58px; height: 58px; border-radius: 10px; object-fit: cover; flex: 0 0 auto; }
.rich-menu-list .dish-thumb.placeholder { display: grid; place-items: center; background: #f0f4f2; color: #89938f; }
.image-preview { width: 100%; height: 180px; border-radius: 10px; object-fit: cover; margin-bottom: 4px; }
.allergen-line { color: #a76d28 !important; margin-top: 3px; }
.choice-field { border: 0; padding: 0; margin: 0; }
.choice-field legend { font-size: 13px; font-weight: 700; margin-bottom: 9px; }
.chip-options { display: flex; flex-wrap: wrap; gap: 7px; max-height: 160px; overflow: auto; }
.chip-options label { display: block; }
.chip-options input { position: absolute; opacity: 0; pointer-events: none; }
.chip-options span { display: block; border: 1px solid var(--line); border-radius: 30px; padding: 7px 10px; color: #697572; font-size: 10px; cursor: pointer; }
.chip-options input:checked + span { background: color-mix(in srgb,var(--portal-brand) 12%,white); border-color: var(--portal-brand); color: var(--portal-brand); font-weight: 700; }
.management-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; margin-top: 24px; }
.management-grid h3 { margin: 7px 0 15px; }
.tag-list { display: flex; flex-wrap: wrap; gap: 7px; margin-bottom: 16px; }
.tag-list span { background: #f2f5f4; border-radius: 30px; padding: 6px 10px; font-size: 11px; }
.inline-create { display: grid; grid-template-columns: 1fr auto; gap: 8px; }
.management-panel{margin-top:24px;padding:0;overflow:hidden}.management-heading{padding:24px 26px 20px;border-bottom:1px solid var(--line)}.management-heading h2{margin:6px 0}.management-heading p{margin:0;color:var(--muted)}.management-columns{display:grid;grid-template-columns:1fr 1fr}.manage-group{padding:24px 26px;min-width:0}.manage-group+.manage-group{border-left:1px solid var(--line)}.manage-group-head{display:grid;gap:15px;margin-bottom:16px}.manage-group-head h3{margin:0 0 3px}.manage-group-head p{margin:0;color:var(--muted);font-size:12px}.compact-create input{min-height:43px}.management-list{display:grid;gap:9px}.management-row{padding:11px;border:1px solid var(--line);border-radius:12px;background:#fafcfb}.management-edit{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px}.management-edit label{display:block}.management-edit input{width:100%;background:#fff}.management-meta{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:7px 3px 0;color:var(--muted);font-size:11px}.management-meta form{margin:0}.text-danger{border:0;background:transparent;padding:3px;color:#b83c31;font-size:11px;font-weight:800}.text-danger:disabled{color:#aab2b0;cursor:not-allowed}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.small-copy { font-size: 12px; }
.empty-state-card { border: 1px dashed #d9dfdd; border-radius: 12px; padding: 30px; color: var(--muted); text-align: center; font-size: 13px; }
.promotion-layout { display: grid; grid-template-columns: minmax(0,1fr) 410px; gap: 25px; align-items: start; }
.promotion-list { display: grid; gap: 10px; }
.promotion-card { display: flex; align-items: center; justify-content: space-between; gap: 20px; background: #fff; border: 1px solid var(--line); border-radius: 13px; padding: 18px; }
.promotion-card h3 { margin: 9px 0 3px; font-size: 16px; }
.promotion-card p { margin: 0 0 5px; color: #66736f; font-size: 12px; }
.promotion-card small { color: var(--muted); }
.date-fields,.buy-pay-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.button:disabled { opacity: .45; cursor: not-allowed; }
[hidden] { display: none !important; }
.food-card.with-image { padding: 0; overflow: hidden; }
.food-image { width: 100%; height: 190px; object-fit: cover; }
.food-card-content { padding: 20px; display: flex; flex-direction: column; justify-content: space-between; gap: 18px; flex: 1; }
.promo-badge { display: inline-flex; padding: 4px 8px; border-radius: 30px; background: #fff0e8; color: #df5728; font-size: 9px; font-weight: 800; margin-bottom: 8px; }
.store-allergens { display: block; color: #a17238; font-size: 9px; margin-top: 8px; line-height: 1.4; }
.store-price { display: grid; justify-items: end; white-space: nowrap; }
.store-price del { color: #9ca4a1; font-size: 10px; }
.store-price strong { font-size: 14px; }

@supports not (color: color-mix(in srgb, red, white)) {
  .restaurant-portal .sidebar nav a.active { background: #f4f1ed; }
  .restaurant-welcome { background: linear-gradient(125deg, #142f2b, #23584e); }
}

@media (max-width: 1050px) {
  .dashboard-grid { grid-template-columns: 1fr; }
  .compact-orders { grid-template-columns: 1fr 1fr; }
  .menu-builder,.promotion-layout { grid-template-columns: 1fr; }
  .dish-form-panel { position: static; }
}

@media (max-width: 760px) {
  .compact-orders { grid-template-columns: 1fr; }
  .bar-chart { gap: 6px; }
  .bar-value { display: none; }
  .restaurant-welcome .pulse-orbit { display: none; }
  .management-grid { grid-template-columns: 1fr; }
  .management-columns{grid-template-columns:1fr}.manage-group+.manage-group{border-left:0;border-top:1px solid var(--line)}
  .inline-create { grid-template-columns: 1fr; }
  .food-image { height: 165px; }
}
body,h1,h2,h3,.brand{font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
.table-intro{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(280px,.8fr);gap:32px;align-items:end;margin-bottom:18px}.table-intro h2{margin:7px 0 8px}.table-intro p{color:var(--muted);margin:0;max-width:680px}.table-create{display:grid;grid-template-columns:1fr 1fr;gap:12px}.table-create .button{grid-column:1/-1}.security-hint{padding:14px 18px;margin-bottom:18px;border:1px solid #bfe7da;border-radius:12px;background:#effbf7;color:#245c4c;font-size:14px}.table-qr-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.table-qr-card{background:#fff;border:1px solid var(--line);border-radius:16px;padding:20px;box-shadow:var(--shadow)}.table-qr-card>header{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:17px}.table-qr-card h3{font-size:21px;margin:3px 0}.table-qr-card header p{margin:0;color:var(--muted)}.table-state{font-size:12px;font-weight:800;color:#8b9693}.is-open .table-state{color:#16865e}.table-enabled{font-size:11px;font-weight:800;padding:5px 9px;border-radius:999px;background:#eef2f1;color:#65716e}.table-qr-body{display:grid;grid-template-columns:190px minmax(0,1fr);gap:20px;align-items:center}.table-qr-body>img{display:block;width:190px;height:190px;border:1px solid var(--line);border-radius:12px}.table-actions{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:14px}.table-actions form{margin:0}.fixed-table{padding:12px 14px;border-radius:10px;background:#eef8f4;color:#245c4c}.login-shell{width:min(100% - 32px,620px);margin:auto}.login-body{min-height:100vh;display:grid;place-items:center}.login-card{background:#fff;padding:38px;border-radius:20px;box-shadow:var(--shadow)}.login-brand{display:flex;align-items:center;gap:10px;margin-bottom:28px}.login-card h1{margin:8px 0 12px}.login-card p{color:var(--muted);line-height:1.6}
@media(max-width:960px){.table-intro,.table-qr-grid{grid-template-columns:1fr}.table-qr-body{grid-template-columns:160px minmax(0,1fr)}.table-qr-body>img{width:160px;height:160px}}
@media(max-width:600px){.table-create,.table-qr-body{grid-template-columns:1fr}.table-qr-body>img{width:190px;height:190px;margin:auto}.table-actions{align-items:stretch}.table-actions>*{flex:1}.table-actions .button,.table-actions .tiny-button{width:100%}}