/* ───────────── Coupons, Promos & Manager Console ─────────────
   Coupon field + promo popup ship on the customer site; the .adm-* console is
   /admin only. Reuses the theme tokens from styles.css (--brand-accent,
   --gold-leaf, --char-black, --linen-white) and the kitchen login gate (.kv /
   .kvlogin). */

/* ── Coupon field (cart drawer + checkout) ── */
.cpn{
  display:flex; align-items:center; gap:8px; flex-wrap:wrap;
  margin:14px 0; padding:10px 12px; border-radius:10px;
  border:1px dashed rgba(255,255,255,.18); background:rgba(255,255,255,.03);
}
.cpn__tag{ display:flex; color:var(--gold-leaf); flex:0 0 auto; }
.cpn__input{
  flex:1 1 120px; min-width:0; height:34px; padding:0 10px;
  border:1px solid rgba(255,255,255,.16); border-radius:8px;
  background:rgba(0,0,0,.25); color:var(--linen-white);
  font-size:14px; letter-spacing:.08em; text-transform:uppercase; outline:none;
}
.cpn__input::placeholder{ letter-spacing:normal; text-transform:none; opacity:.5; }
.cpn__input:focus{ border-color:var(--gold-leaf); }
.cpn__apply{
  height:34px; padding:0 16px; border-radius:8px; flex:0 0 auto;
  background:var(--brand-accent); color:#fff; font-weight:600; font-size:14px;
}
.cpn__apply:disabled{ opacity:.4; cursor:not-allowed; }
.cpn__err{ flex:1 0 100%; color:#ff9b9b; font-size:13px; }

.cpn--on{ border-style:solid; border-color:rgba(201,168,76,.5); background:rgba(201,168,76,.08); }
.cpn__info{ flex:1 1 auto; min-width:0; }
.cpn__code{ font-weight:700; letter-spacing:.06em; display:flex; align-items:center; gap:8px; }
.cpn__save{ color:var(--gold-leaf); font-weight:600; letter-spacing:0; }
.cpn__meta{ font-size:13px; opacity:.85; display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin-top:2px; }
.cpn__badge{
  font-size:11px; padding:1px 7px; border-radius:999px;
  background:rgba(255,255,255,.1); letter-spacing:.02em;
}
.cpn__badge--left{ background:rgba(139,26,26,.35); color:#ffd9d9; }
.cpn__x{ flex:0 0 auto; width:28px; height:28px; display:flex; align-items:center; justify-content:center;
  border-radius:8px; opacity:.7; }
.cpn__x:hover{ background:rgba(255,255,255,.1); opacity:1; }

/* Temporarily-closed-branch notice on checkout. */
.ck-closed{
  display:flex; align-items:center; gap:10px; margin:0 auto 18px; max-width:1100px;
  padding:11px 15px; border-radius:10px; font-size:14px;
  background:rgba(139,26,26,.14); border:1px solid rgba(139,26,26,.4); color:#ffd9d9;
}
.ck-closed svg{ flex:0 0 auto; }
/* Hard-blocked state: every branch is closed, so no order can be placed. */
.ck-closed--all{
  background:rgba(139,26,26,.22); border-color:rgba(139,26,26,.6); color:#fff; font-weight:600;
}

/* A "you're saving" discount line in the totals blocks. */
.totals-row--save, .ck-side__row--save{ color:var(--gold-leaf); }
.totals-row--save span:first-child, .ck-side__row--save span:first-child{
  display:flex; align-items:center; gap:6px;
  min-width:0; flex:1 1 auto;          /* let the long coupon label shrink, not shove */
}
/* Keep the discount amount on ONE line: without nowrap the "−" broke away from
   the ฿ figure and wrapped to its own row ("−" then "฿200" underneath). */
.totals-row--save span:last-child, .ck-side__row--save span:last-child{
  display:flex; align-items:center; gap:1px;
  flex:0 0 auto; white-space:nowrap;
}

/* ── Promo popup ── */
.promo-pop{ display:flex; align-items:center; justify-content:center; }
.promo-pop__card{
  position:relative; width:min(420px, 92vw); max-height:90vh; overflow:auto;
  background:var(--char-black); border:1px solid rgba(201,168,76,.35);
  border-radius:18px; box-shadow:0 30px 90px rgba(0,0,0,.6);
}
.promo-pop .modal__close{
  position:absolute; top:12px; right:12px; z-index:2; width:34px; height:34px;
  display:flex; align-items:center; justify-content:center; border-radius:50%;
  background:rgba(0,0,0,.45); color:#fff; backdrop-filter:blur(6px);
}
.promo-pop__ribbon{
  position:absolute; top:14px; left:14px; z-index:2;
  display:inline-flex; align-items:center; gap:6px; padding:5px 12px;
  border-radius:999px; background:var(--brand-accent); color:#fff;
  font-size:12px; font-weight:700; letter-spacing:.06em; text-transform:uppercase;
}
/* Swipeable horizontal carousel — one promo card per panel, snap left/right. */
.promo-pop__track{
  display:flex; overflow-x:auto; overflow-y:hidden;
  scroll-snap-type:x mandatory; -webkit-overflow-scrolling:touch;
  scrollbar-width:none;
}
.promo-pop__track::-webkit-scrollbar{ display:none; }
.promo-pop__promo{ flex:0 0 100%; min-width:0; scroll-snap-align:start; }
/* Dot pager under the carousel (only when 2+ promos). */
.promo-pop__dots{ display:flex; justify-content:center; align-items:center; gap:7px; padding:12px 0 2px; }
.promo-pop__dot{
  width:8px; height:8px; padding:0; border:0; cursor:pointer; border-radius:50%;
  background:rgba(201,168,76,.3); transition:width .2s, background .2s;
}
.promo-pop__dot.is-on{ width:22px; border-radius:4px; background:var(--gold-leaf); }
.promo-pop__img{ height:200px; overflow:hidden; }        /* default = M */
.promo-pop__img img{ width:100%; height:100%; object-fit:cover; display:block; }
/* Per-promo size (S / M / L) — how large the banner shows to customers. */
.promo-pop__promo--s .promo-pop__img{ height:120px; }
.promo-pop__promo--m .promo-pop__img{ height:200px; }
.promo-pop__promo--l .promo-pop__img{ height:300px; }
.promo-pop__body{ padding:20px 22px 22px; }
.promo-pop__title{ font-family:var(--serif); font-size:26px; line-height:1.15; margin:0 0 8px; }
.promo-pop__promo--s .promo-pop__title{ font-size:21px; }
.promo-pop__promo--l .promo-pop__title{ font-size:30px; }
.promo-pop__desc{ opacity:.82; font-size:15px; margin:0 0 16px; }
.promo-pop__later{ display:block; width:100%; margin:6px 0 12px; padding:8px; opacity:.6; font-size:14px; }
.promo-pop__later:hover{ opacity:1; }

/* ── Manager console ── */
.adm{ min-height:100vh; background:var(--char-black); color:var(--linen-white); padding-bottom:60px; }
.adm__head{
  position:sticky; top:0; z-index:5; display:flex; align-items:center; justify-content:space-between;
  gap:16px; padding:14px 20px; background:rgba(10,8,6,.9); backdrop-filter:blur(12px);
  border-bottom:1px solid rgba(255,255,255,.08); flex-wrap:wrap;
}
.adm__head-left{ display:flex; align-items:center; gap:12px; }
/* Brand wordmark in the console header (replaces the old text "KOBE"). Height
   matches the kitchen board's header mark so the two consoles read as one system.
   .kvlogin__logo-img (the login screen's mark) is already styled in styles-extra.css. */
.adm__logo-img{ height:26px; width:auto; display:block; }
.adm__title{ font-size:15px; opacity:.7; letter-spacing:.04em; }
.adm__local{ font-size:11px; padding:2px 9px; border-radius:999px; background:rgba(201,168,76,.18); color:var(--gold-leaf); }
.adm__head-right{ display:flex; align-items:center; gap:8px; }
.adm__btn{ height:34px; padding:0 14px; display:inline-flex; align-items:center; border-radius:8px;
  background:rgba(255,255,255,.08); font-size:14px; }
.adm__btn:hover{ background:rgba(255,255,255,.14); }
.adm__btn--ghost{ background:transparent; border:1px solid rgba(255,255,255,.16); }

.adm__tabs{ display:flex; gap:4px; padding:14px 20px 0; max-width:900px; margin:0 auto; }
.adm__tab{ padding:10px 20px; border-radius:10px 10px 0 0; font-size:15px; font-weight:600; opacity:.55;
  border-bottom:2px solid transparent; }
.adm__tab.is-on{ opacity:1; background:rgba(255,255,255,.05); border-bottom-color:var(--brand-accent); }

.adm__body{ max-width:900px; margin:0 auto; padding:18px 20px; }
.adm-sec{ display:flex; flex-direction:column; gap:14px; }
.adm-note{ display:flex; align-items:center; gap:10px; padding:12px 14px; border-radius:10px;
  background:rgba(255,255,255,.04); font-size:14px; opacity:.85; }
.adm-note svg{ color:var(--gold-leaf); flex:0 0 auto; }
.adm-empty{ padding:40px; text-align:center; opacity:.5; }

/* Cards + forms */
.adm-card{ border:1px solid rgba(255,255,255,.1); border-radius:12px; background:rgba(255,255,255,.03); padding:16px; }
.adm-card__h{ font-weight:700; font-size:15px; margin-bottom:12px; letter-spacing:.02em; }
.adm-form__grid{ display:grid; grid-template-columns:repeat(auto-fill, minmax(150px,1fr)); gap:10px; }
.adm-fld{ display:flex; flex-direction:column; gap:4px; font-size:12px; }
.adm-fld--wide{ grid-column:span 2; }
.adm-fld--sm{ max-width:100px; }
.adm-fld>span{ opacity:.65; letter-spacing:.02em; }

/* ── Type-ahead dish picker (replaces a flat <select> of the whole menu) ───── */
.adm-pick{ position:relative; }
.adm-pick__input{ width:100%; }
.adm-pick__menu{
  position:absolute; z-index:30; top:calc(100% + 4px); left:0; right:0;
  max-height:340px; overflow-y:auto;
  background:#181310; border:1px solid rgba(201,168,76,.28); border-radius:9px;
  box-shadow:0 14px 34px rgba(0,0,0,.55);
}
/* Category header inside the picker so the full 100+ item menu is browsable. */
.adm-pick__cat{
  position:sticky; top:0; z-index:1;
  padding:7px 12px 4px; font-size:11px; letter-spacing:.05em; text-transform:uppercase;
  color:var(--gold-leaf); background:#181310; opacity:.9;
  border-bottom:1px solid rgba(201,168,76,.14);
}
.adm-pick__opt{
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  width:100%; padding:9px 12px; text-align:left; font-size:13px;
  background:none; border:0; color:var(--linen-white); cursor:pointer;
}
.adm-pick__opt:hover{ background:rgba(201,168,76,.12); }
.adm-pick__opt.is-on{ background:rgba(201,168,76,.18); color:var(--gold-leaf); }
.adm-pick__price{ opacity:.55; font-size:12px; flex:0 0 auto; }
.adm-pick__empty{ padding:10px 12px; font-size:12px; opacity:.55; }

/* ── Owner image / banner uploader ────────────────────────────────────────── */
.adm-img{ margin-top:10px; }
.adm-img__drop{
  display:inline-flex; align-items:center; gap:8px; cursor:pointer;
  padding:9px 14px; border-radius:9px; font-size:12px;
  background:rgba(255,255,255,.03); border:1px dashed rgba(201,168,76,.38);
  color:var(--gold-leaf); transition:background .15s, border-color .15s;
}
.adm-img__drop:hover{ background:rgba(201,168,76,.10); border-color:var(--gold-leaf); }
.adm-img__drop.is-busy{ opacity:.6; pointer-events:none; }
.adm-img__preview{ position:relative; display:inline-block; }
.adm-img__preview img{
  display:block; max-width:220px; max-height:130px; width:auto; height:auto;
  border-radius:9px; border:1px solid rgba(201,168,76,.30); object-fit:cover;
}
.adm-img__x{
  position:absolute; top:-8px; right:-8px; width:24px; height:24px;
  display:flex; align-items:center; justify-content:center; cursor:pointer;
  border-radius:50%; background:#2a1b16; border:1px solid rgba(201,168,76,.45);
  color:var(--linen-white);
}
.adm-img__x:hover{ background:#8b1a1a; }
.adm-img__hint{ font-size:11px; opacity:.45; margin-top:5px; }
.adm-img__err{ font-size:11px; color:#e5484d; margin-top:5px; }

/* Owner artwork on the checkout branch-closure notice. */
.ck-closed__art{
  flex:0 0 auto; width:64px; height:44px; object-fit:cover;
  border-radius:6px; border:1px solid rgba(139,26,26,.45);
}

/* ── Promo preset chips ───────────────────────────────────────────────────── */
.adm-presets{ display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin-bottom:16px; }
.adm-presets__label{ font-size:12px; opacity:.55; margin-right:2px; }
.adm-preset{
  padding:6px 12px; border-radius:999px; font-size:12px; cursor:pointer;
  background:rgba(201,168,76,.10); border:1px solid rgba(201,168,76,.32);
  color:var(--gold-leaf); transition:background .15s, border-color .15s;
}
.adm-preset:hover{ background:rgba(201,168,76,.22); border-color:var(--gold-leaf); }
.adm-promo__hint{ font-size:11px; opacity:.45; margin:2px 0 8px; }
.adm-promo__popup{ display:flex; align-items:center; gap:16px; flex-wrap:wrap; margin-top:6px; }

/* S / M / L popup-size segmented control */
.adm-size{ display:inline-flex; align-items:center; gap:6px; }
.adm-size__label{ font-size:12px; opacity:.55; }
.adm-size__opt{
  width:30px; height:26px; cursor:pointer; font-size:12px; font-weight:600;
  border-radius:6px; border:1px solid rgba(201,168,76,.30);
  background:rgba(255,255,255,.03); color:var(--linen-white); opacity:.7;
}
.adm-size__opt.is-on{ background:var(--gold-leaf); color:#1a120b; border-color:var(--gold-leaf); opacity:1; }
.adm-size__opt:hover{ opacity:1; }

/* ── Promo popup preview action ───────────────────────────────────────────── */
.adm-note--action{ display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; }
.adm-preview-btn{
  flex:0 0 auto; display:inline-flex; align-items:center; gap:7px; cursor:pointer;
  padding:8px 14px; border-radius:8px; font-size:13px;
  background:var(--gold-leaf); color:#1a120b; border:0; font-weight:600;
}
.adm-preview-btn:hover{ filter:brightness(1.08); }

/* ── Store branch: daily hours + temporary-closure blocks ─────────────────── */
.adm-store__block{ margin-top:12px; }
.adm-store__blockh{ font-size:11px; letter-spacing:.04em; text-transform:uppercase; opacity:.5; margin-bottom:6px; }
.adm-store__row{ display:flex; flex-wrap:wrap; align-items:flex-end; gap:12px; }
.adm-linkbtn{
  background:none; border:0; cursor:pointer; padding:0 0 6px;
  font-size:12px; color:var(--gold-leaf); text-decoration:underline;
}
.adm-linkbtn:hover{ color:var(--linen-white); }
.adm-fld input, .adm-fld select{
  height:36px; padding:0 10px; border-radius:8px; font-size:14px; outline:none;
  border:1px solid rgba(255,255,255,.16); background:rgba(0,0,0,.25); color:var(--linen-white);
}
.adm-fld input:focus, .adm-fld select:focus{ border-color:var(--gold-leaf); }
.adm-err{ color:#ff9b9b; font-size:13px; margin-top:10px; }
.adm-form__actions{ display:flex; gap:10px; align-items:center; margin-top:14px; }
.adm-add{ display:inline-flex; align-items:center; gap:7px; height:38px; padding:0 18px; border-radius:9px;
  background:var(--brand-accent); color:#fff; font-weight:600; font-size:14px; margin-top:12px; }
.adm-add:hover{ filter:brightness(1.1); }
.adm-add--block{ width:100%; justify-content:center; border:1px dashed rgba(255,255,255,.2); background:transparent; color:inherit; }
.adm-add--block:hover{ background:rgba(255,255,255,.05); }
.adm-cancel{ height:38px; padding:0 16px; border-radius:9px; background:rgba(255,255,255,.08); font-size:14px; margin-top:12px; }

/* Rows */
.adm-list{ display:flex; flex-direction:column; gap:10px; }
.adm-row{ display:flex; align-items:flex-start; justify-content:space-between; gap:14px;
  padding:14px 16px; border-radius:12px; border:1px solid rgba(255,255,255,.1);
  background:rgba(255,255,255,.03); transition:opacity .15s, border-color .15s; }
.adm-row--off{ opacity:.5; }
.adm-row--down{ border-color:rgba(139,26,26,.55); background:rgba(139,26,26,.1); opacity:1; }
.adm-row__main{ flex:1 1 auto; min-width:0; display:flex; flex-direction:column; gap:6px; }
.adm-row__code{ font-weight:700; font-size:16px; letter-spacing:.03em; display:flex; align-items:baseline; gap:10px; flex-wrap:wrap; }
.adm-row__val{ font-size:12px; font-weight:600; opacity:.7; letter-spacing:.02em; padding:2px 8px; border-radius:999px; background:rgba(255,255,255,.08); }
.adm-row__sub{ font-size:14px; opacity:.78; }
.adm-row__tags{ display:flex; gap:8px; flex-wrap:wrap; }
.adm-tag{ display:inline-flex; align-items:center; gap:4px; font-size:12px; padding:2px 9px; border-radius:999px;
  background:rgba(255,255,255,.07); }
.adm-tag--warn{ background:rgba(139,26,26,.35); color:#ffd9d9; }
.adm-row__act{ display:flex; align-items:center; gap:10px; flex:0 0 auto; }
.adm-row__state{ font-size:12px; opacity:.6; min-width:32px; text-align:right; }
.adm-del{ width:30px; height:30px; display:flex; align-items:center; justify-content:center; border-radius:8px;
  background:rgba(255,255,255,.06); opacity:.7; }
.adm-del:hover{ background:rgba(139,26,26,.4); opacity:1; }

/* Switch */
.adm-sw{ position:relative; width:42px; height:24px; border-radius:999px; background:rgba(255,255,255,.18);
  transition:background .15s; flex:0 0 auto; }
.adm-sw.is-on{ background:#2e9e5b; }
.adm-sw i{ position:absolute; top:3px; left:3px; width:18px; height:18px; border-radius:50%; background:#fff;
  box-shadow:0 1px 3px rgba(0,0,0,.4); transition:transform .15s; }
.adm-sw.is-on i{ transform:translateX(18px); }

/* Stores + promos specifics */
.adm-store__state{ font-size:13px; font-weight:600; }
.adm-store__state.is-up{ color:#7fd8a0; }
.adm-store__state.is-down{ color:#ff9b9b; }
.adm-store__fields{ display:grid; grid-template-columns:1fr 1fr auto; gap:10px; margin-top:8px; }
.adm-promo__rule{ font-size:14px; opacity:.82; }
.adm-promo__edit{ display:flex; gap:10px; flex-wrap:wrap; margin-top:6px; }
.adm-promo__edit .adm-fld{ min-width:120px; }
.adm-inline{ display:inline-flex; align-items:center; gap:8px; font-size:13px; opacity:.85; margin-top:8px; }

@media (max-width:600px){
  .adm-row{ flex-direction:column; }
  .adm-row__act{ align-self:flex-end; }
  .adm-store__fields{ grid-template-columns:1fr; }
  .adm-fld--wide{ grid-column:span 1; }
}

/* Light theme touch-ups */
:root[data-theme="light"] .adm,
:root[data-theme="light"] .promo-pop__card{ background:#FBF8F2; color:#241c17; }
:root[data-theme="light"] .adm__head{ background:rgba(251,248,242,.92); border-bottom-color:rgba(0,0,0,.1); }
:root[data-theme="light"] .adm-row,
:root[data-theme="light"] .adm-card{ border-color:rgba(0,0,0,.12); background:rgba(0,0,0,.02); }
:root[data-theme="light"] .adm-fld input,
:root[data-theme="light"] .adm-fld select,
:root[data-theme="light"] .cpn__input{ background:#fff; color:#241c17; border-color:rgba(0,0,0,.18); }
:root[data-theme="light"] .cpn__input{ color:#241c17; }
