:root{
  /* Core theme */
  --page-bg:#f6f7ff;
  --bg:var(--page-bg);
  --panel:color-mix(in srgb,var(--surface) 55%,transparent);
  --text:#171a2b;
  --muted:#69708a;
  --accent:#7657e8;
  --accent-dark:#4f3bb7;
  --accent-soft:#eeeafd;
  --accent-secondary:#d94f8c;
  --on-accent:#ffffff;
  --border:#dde1f0;
  --success:#2f8f68;
  --danger:#c54861;
  --focus:rgba(118,87,232,.14);
  --shadow:0 12px 34px rgba(42,38,85,.10);
  --radius:20px;

  /* Shared shell / surfaces */
  --surface:#ffffff;
  --surface-94:rgba(255,255,255,.94);
  --surface-92:rgba(255,255,255,.92);
  --surface-90:rgba(255,255,255,.90);
  --surface-88:rgba(255,255,255,.88);
  --surface-84:rgba(255,255,255,.84);
  --surface-78:rgba(255,255,255,.78);
  --surface-76:rgba(255,255,255,.76);
  --surface-72:rgba(255,255,255,.72);
  --surface-68:rgba(255,255,255,.68);
  --surface-58:rgba(255,255,255,.58);
  --surface-52:rgba(255,255,255,.52);
  --surface-46:rgba(255,255,255,.46);
  --surface-44:rgba(255,255,255,.44);
  --surface-42:rgba(255,255,255,.42);
  --surface-clear:rgba(255,255,255,0);
  --chrome-bg:rgba(241,243,255,.96);
  --chrome-color:#DECEEB;
  --chrome-border:#d9ddef;
  --chrome-text:#5f6680;
  --chrome-hover:#ece9ff;
  --overlay:rgba(18,20,39,.58);
  --overlay-neutral:rgba(0,0,0,.50);
  --modal-shadow:0 24px 70px rgba(30,27,68,.24);
  --soft-shadow:0 3px 14px rgba(42,38,85,.06);
  --link:#4f3bb7;
  --chrome-bg-solid:#f1f3ff;
  --legal-shadow:rgba(42,38,85,.10);
  --footer-menu-shadow:rgba(23,26,43,.16);

  /* State colors */
  --success-bg:#e7f7ef;
  --success-bg-strong:#dff5e9;
  --success-text:#23734f;
  --warning-bg:#fff1c9;
  --warning-text:#715600;
  --info-bg:#ece9ff;
  --info-text:#5640c5;
  --danger-bg:#fde6eb;
  --danger-bg-soft:#fbe2e8;
  --danger-text:#9d334b;
  --danger-text-soft:#943046;
  --neutral-bg:#eef0f6;
  --neutral-text:#555d72;

  /* Secondary surfaces */
  --soft-panel:#f1f3ff;
  --soft-panel-2:#f7f6ff;
  --row-border:#e7e9f4;
  --reader-bg:#11131d;

  /* Gift-card presentation palette */
  --gift-bg-start:#f1eeff;
  --gift-bg-mid:#fff4f8;
  --gift-bg-end:#eef5ff;
  --gift-card-start:rgba(255,255,255,.985);
  --gift-card-end:rgba(247,244,255,.97);
  --gift-shadow:rgba(67,52,145,.16);
  --gift-decoration:rgba(118,87,232,.20);
  --gift-decoration-clear:rgba(118,87,232,0);
  --gift-accent-soft:rgba(118,87,232,.16);
  --gift-accent-clear:rgba(118,87,232,0);
  --gift-accent-faint:rgba(118,87,232,.13);
  --gift-accent-icon:rgba(118,87,232,.24);
  --gift-brand:#6547dc;
  --gift-title:#292546;
  --gift-border:#ded8f5;
  --gift-dedication-start:#f4f0ff;
  --gift-dedication-end:#fff4f8;
  --gift-message:#49445f;
  --gift-used-bg:#ececf3;
  --gift-used-text:#56596a;
  --gift-instruction:#4d5064;
  --gift-meta-text:#393c52;

  /* Registration / validation */
  --validation-danger:#b3263b;
  --validation-ring:rgba(179,38,59,.12);
  --validation-bg:rgba(179,38,59,.06);
  --separator:#dfe2f0;
  --hint-text:#7a8098;
  --registration-line:rgba(118,87,232,.16);
  --registration-border:rgba(118,87,232,.24);
  --registration-border-strong:rgba(118,87,232,.30);
  --registration-line-soft:rgba(118,87,232,.12);
  --registration-tint:rgba(118,87,232,.07);
  --black-08:rgba(0,0,0,.08);
  --black-24:rgba(0,0,0,.24);
  --black-25:rgba(0,0,0,.25);
  --soft-shadow-color:rgba(42,38,85,.06);
  --accent-shadow:rgba(79,59,183,.20);
  --accent-shadow-23:rgba(79,59,183,.23);
  --accent-shadow-25:rgba(79,59,183,.25);
  --soft-shadow-07:rgba(42,38,85,.07);
  --soft-shadow-13:rgba(42,38,85,.13);
  --black-25:rgba(0,0,0,.25);

  /* Business theme controls (custom values are applied by assets/theme.js) */
  --business-hue:253;
  --business-saturation:76%;
}

/* Optional per-business hue/saturation theme. Semantic state colors remain unchanged. */
:root[data-theme-custom="1"]{
  --accent:hsl(var(--business-hue) var(--business-saturation) 62.5%);
  --accent-dark:hsl(var(--business-hue) calc(var(--business-saturation) * .68) 47.5%);
  --accent-soft:color-mix(in srgb,var(--accent) 12%,white);
  --page-bg:color-mix(in srgb,var(--accent) 4%,white);
  --bg:var(--page-bg);
  --border:color-mix(in srgb,var(--accent) 18%,white);
  --focus:color-mix(in srgb,var(--accent) 14%,transparent);
  --shadow:0 12px 34px color-mix(in srgb,var(--accent-dark) 14%,transparent);
  --chrome-bg:color-mix(in srgb,var(--accent) 7%,white);
  --chrome-color:color-mix(in srgb,var(--accent) 26%,white);
  --chrome-border:color-mix(in srgb,var(--accent) 18%,white);
  --chrome-hover:color-mix(in srgb,var(--accent) 12%,white);
  --link:var(--accent-dark);
  --chrome-bg-solid:color-mix(in srgb,var(--accent) 7%,white);
  --soft-panel:color-mix(in srgb,var(--accent) 7%,white);
  --soft-panel-2:color-mix(in srgb,var(--accent) 4%,white);
  --row-border:color-mix(in srgb,var(--accent) 13%,white);
  --gift-bg-start:color-mix(in srgb,var(--accent) 10%,white);
  --gift-bg-mid:hsl(calc(var(--business-hue) + 70) var(--business-saturation) 97.8%);
  --gift-bg-end:hsl(calc(var(--business-hue) - 35) var(--business-saturation) 96.7%);
  --gift-shadow:color-mix(in srgb,var(--accent-dark) 20%,transparent);
  --gift-decoration:color-mix(in srgb,var(--accent) 20%,transparent);
  --gift-decoration-clear:color-mix(in srgb,var(--accent) 0%,transparent);
  --gift-accent-soft:color-mix(in srgb,var(--accent) 16%,transparent);
  --gift-accent-clear:color-mix(in srgb,var(--accent) 0%,transparent);
  --gift-accent-faint:color-mix(in srgb,var(--accent) 13%,transparent);
  --gift-accent-icon:color-mix(in srgb,var(--accent) 24%,transparent);
  --gift-brand:hsl(var(--business-hue) calc(var(--business-saturation) * .90) 57%);
  --gift-border:color-mix(in srgb,var(--accent) 24%,white);
  --gift-dedication-start:color-mix(in srgb,var(--accent) 8%,white);
  --gift-dedication-end:hsl(calc(var(--business-hue) + 70) var(--business-saturation) 97.8%);
  --registration-line:color-mix(in srgb,var(--accent) 16%,transparent);
  --registration-border:color-mix(in srgb,var(--accent) 24%,transparent);
  --registration-border-strong:color-mix(in srgb,var(--accent) 30%,transparent);
  --registration-line-soft:color-mix(in srgb,var(--accent) 12%,transparent);
  --registration-tint:color-mix(in srgb,var(--accent) 7%,transparent);
  --accent-shadow:color-mix(in srgb,var(--accent-dark) 20%,transparent);
  --accent-shadow-23:color-mix(in srgb,var(--accent-dark) 23%,transparent);
  --accent-shadow-25:color-mix(in srgb,var(--accent-dark) 25%,transparent);
}


/* Dark mode. The selected business hue/saturation also tint the dark surfaces.
   Semantic success / warning / danger colors intentionally remain unchanged. */
:root[data-mode="dark"]{
  --page-bg:hsl(var(--business-hue) calc(var(--business-saturation) * .24) 9%);
  --bg:var(--page-bg);
  --text:hsl(var(--business-hue) 18% 96%);
  --muted:hsl(var(--business-hue) 14% 72%);
  --accent:hsl(var(--business-hue) var(--business-saturation) 68%);
  --accent-dark:hsl(var(--business-hue) calc(var(--business-saturation) * .72) 78%);
  --accent-soft:hsl(var(--business-hue) calc(var(--business-saturation) * .36) 20%);
  --border:hsl(var(--business-hue) calc(var(--business-saturation) * .24) 25%);
  --focus:hsl(var(--business-hue) var(--business-saturation) 68% / .22);
  --shadow:0 12px 34px hsl(var(--business-hue) 30% 3% / .42);

  --surface:hsl(var(--business-hue) calc(var(--business-saturation) * .28) 14%);
  --surface-94:hsl(var(--business-hue) calc(var(--business-saturation) * .28) 14% / .94);
  --surface-92:hsl(var(--business-hue) calc(var(--business-saturation) * .28) 14% / .92);
  --surface-90:hsl(var(--business-hue) calc(var(--business-saturation) * .28) 14% / .90);
  --surface-88:hsl(var(--business-hue) calc(var(--business-saturation) * .28) 14% / .88);
  --surface-84:hsl(var(--business-hue) calc(var(--business-saturation) * .28) 14% / .84);
  --surface-78:hsl(var(--business-hue) calc(var(--business-saturation) * .28) 14% / .78);
  --surface-76:hsl(var(--business-hue) calc(var(--business-saturation) * .28) 14% / .76);
  --surface-72:hsl(var(--business-hue) calc(var(--business-saturation) * .28) 14% / .72);
  --surface-68:hsl(var(--business-hue) calc(var(--business-saturation) * .28) 14% / .68);
  --surface-58:hsl(var(--business-hue) calc(var(--business-saturation) * .28) 14% / .58);
  --surface-52:hsl(var(--business-hue) calc(var(--business-saturation) * .28) 14% / .52);
  --surface-46:hsl(var(--business-hue) calc(var(--business-saturation) * .28) 14% / .46);
  --surface-44:hsl(var(--business-hue) calc(var(--business-saturation) * .28) 14% / .44);
  --surface-42:hsl(var(--business-hue) calc(var(--business-saturation) * .28) 14% / .42);
  --surface-clear:hsl(var(--business-hue) calc(var(--business-saturation) * .28) 14% / 0);
  --chrome-bg:hsl(var(--business-hue) calc(var(--business-saturation) * .26) 12% / .96);
  --chrome-color:hsl(var(--business-hue) calc(var(--business-saturation) * .30) 13%);
  --chrome-border:hsl(var(--business-hue) calc(var(--business-saturation) * .24) 24%);
  --chrome-text:hsl(var(--business-hue) 14% 80%);
  --chrome-hover:hsl(var(--business-hue) calc(var(--business-saturation) * .30) 18%);
  --overlay:hsl(var(--business-hue) 24% 3% / .72);
  --overlay-neutral:rgba(0,0,0,.68);
  --modal-shadow:0 24px 70px hsl(var(--business-hue) 30% 3% / .58);
  --soft-shadow:0 3px 14px hsl(var(--business-hue) 30% 3% / .28);
  --link:var(--accent-dark);
  --chrome-bg-solid:hsl(var(--business-hue) calc(var(--business-saturation) * .26) 12%);
  --legal-shadow:hsl(var(--business-hue) 30% 3% / .34);
  --footer-menu-shadow:hsl(var(--business-hue) 30% 3% / .46);

  --soft-panel:hsl(var(--business-hue) calc(var(--business-saturation) * .30) 17%);
  --soft-panel-2:hsl(var(--business-hue) calc(var(--business-saturation) * .24) 12%);
  --row-border:hsl(var(--business-hue) calc(var(--business-saturation) * .22) 22%);
  --reader-bg:hsl(var(--business-hue) calc(var(--business-saturation) * .18) 6%);

  --gift-bg-start:hsl(var(--business-hue) calc(var(--business-saturation) * .34) 13%);
  --gift-bg-mid:hsl(calc(var(--business-hue) + 55) calc(var(--business-saturation) * .30) 16%);
  --gift-bg-end:hsl(calc(var(--business-hue) - 28) calc(var(--business-saturation) * .30) 15%);
  --gift-card-start:hsl(var(--business-hue) calc(var(--business-saturation) * .26) 17% / .985);
  --gift-card-end:hsl(var(--business-hue) calc(var(--business-saturation) * .22) 14% / .97);
  --gift-shadow:hsl(var(--business-hue) 30% 3% / .42);
  --gift-decoration:hsl(var(--business-hue) var(--business-saturation) 68% / .24);
  --gift-decoration-clear:hsl(var(--business-hue) var(--business-saturation) 68% / 0);
  --gift-accent-soft:hsl(var(--business-hue) var(--business-saturation) 68% / .20);
  --gift-accent-clear:hsl(var(--business-hue) var(--business-saturation) 68% / 0);
  --gift-accent-faint:hsl(var(--business-hue) var(--business-saturation) 68% / .15);
  --gift-accent-icon:hsl(var(--business-hue) var(--business-saturation) 68% / .30);
  --gift-brand:hsl(var(--business-hue) calc(var(--business-saturation) * .90) 72%);
  --gift-title:hsl(var(--business-hue) 18% 96%);
  --gift-border:hsl(var(--business-hue) calc(var(--business-saturation) * .28) 27%);
  --gift-dedication-start:hsl(var(--business-hue) calc(var(--business-saturation) * .32) 19%);
  --gift-dedication-end:hsl(calc(var(--business-hue) + 55) calc(var(--business-saturation) * .28) 20%);
  --gift-message:hsl(var(--business-hue) 14% 84%);
  --gift-used-bg:hsl(var(--business-hue) calc(var(--business-saturation) * .12) 20%);
  --gift-used-text:hsl(var(--business-hue) 10% 76%);
  --gift-instruction:hsl(var(--business-hue) 11% 78%);
  --gift-meta-text:hsl(var(--business-hue) 10% 84%);

  --separator:hsl(var(--business-hue) calc(var(--business-saturation) * .20) 24%);
  --hint-text:hsl(var(--business-hue) 13% 66%);
  --registration-line:hsl(var(--business-hue) var(--business-saturation) 68% / .20);
  --registration-border:hsl(var(--business-hue) var(--business-saturation) 68% / .28);
  --registration-border-strong:hsl(var(--business-hue) var(--business-saturation) 68% / .36);
  --registration-line-soft:hsl(var(--business-hue) var(--business-saturation) 68% / .15);
  --registration-tint:hsl(var(--business-hue) var(--business-saturation) 68% / .10);
  --soft-shadow-color:hsl(var(--business-hue) 30% 3% / .28);
  --accent-shadow:hsl(var(--business-hue) var(--business-saturation) 68% / .24);
  --accent-shadow-23:hsl(var(--business-hue) var(--business-saturation) 68% / .27);
  --accent-shadow-25:hsl(var(--business-hue) var(--business-saturation) 68% / .30);
  --soft-shadow-07:hsl(var(--business-hue) 30% 3% / .26);
  --soft-shadow-13:hsl(var(--business-hue) 30% 3% / .34);
}

:root[data-business]{
  background:var(--page-bg);
}

:root[data-business] body{
  background:var(--page-bg);
  transition:background .25s ease,color .25s ease;
}

:root[data-business] .topbar{
  box-shadow:0 3px 14px color-mix(in srgb,var(--accent-dark) 12%,transparent);
}

:root[data-business] input:focus,
:root[data-business] select:focus,
:root[data-business] textarea:focus{
  border-color:var(--accent);
  box-shadow:0 0 0 4px var(--focus);
}

:root[data-business] .primary{
  box-shadow:0 7px 18px color-mix(in srgb,var(--accent-dark) 24%,transparent);
}


*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  margin:0;
  min-width:280px;
  font-family:Arial,"Noto Sans Hebrew",sans-serif;
  background:var(--page-bg);
  color:var(--text);
  line-height:1.5;
  overflow-x:hidden;
}
a{color:var(--accent-dark)}
button,input,select,textarea{font:inherit}
button,.button,input,select,textarea{min-height:50px}
button,.button{-webkit-tap-highlight-color:transparent;touch-action:manipulation}

/* Shared mobile-first shell: admin, login, result and redemption pages */
.topbar{
  position:sticky;
  top:0;
  z-index:20;
  min-height:62px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  padding:10px max(14px,env(safe-area-inset-right)) 10px max(14px,env(safe-area-inset-left));
  background:var(--surface-94);
  border-bottom:1px solid var(--border);
  box-shadow:0 3px 14px var(--soft-shadow-color);
  backdrop-filter:blur(12px);
}
.topbar div{display:grid;gap:0;min-width:0}
.topbar strong{font-size:1.02rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.business-selector{
  width:auto;
  min-width:132px;
  min-height:38px;
  padding:6px 32px 6px 10px;
  border-radius:11px;
  font-size:1rem;
  font-weight:800;
  background:var(--surface);
}
.topbar span{font-size:.78rem;color:var(--muted)}
.topbar>a{
  flex:0 0 auto;
  min-height:42px;
  display:inline-flex;
  align-items:center;
  padding:8px 12px;
  border-radius:12px;
  background:var(--accent-soft);
  text-decoration:none;
  font-weight:700;
}
.container{
  width:100%;
  max-width:1120px;
  margin:0 auto;
  padding:14px max(12px,env(safe-area-inset-right)) calc(26px + env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left));
  display:grid;
  gap:14px;
}
.panel,.auth-card,.result-card{
  width:100%;
  min-width:0;
  background:var(--panel);
  border:1px solid var(--border);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
  padding:18px 14px;
  overflow:hidden;
}
h1,h2{margin:0;line-height:1.2}
h1{font-size:clamp(1.55rem,7vw,2.25rem)}
h2{font-size:1.26rem}
.muted{color:var(--muted)}
.panel-heading{display:flex;align-items:flex-start;gap:11px;margin-bottom:18px}
.panel-heading.compact{margin:0}
.panel-heading p{margin:4px 0 0;color:var(--muted);font-size:.9rem}
.panel-icon{
  flex:0 0 40px;
  width:40px;
  height:40px;
  border-radius:13px;
  display:grid;
  place-items:center;
  background:var(--accent-soft);
  color:var(--accent-dark);
  font-size:1.35rem;
  font-weight:800;
}

/* Forms always begin as one phone-width column */
.form-grid,.stack{display:grid;grid-template-columns:minmax(0,1fr);gap:15px}
.wide{grid-column:auto}

/* Create gift card: first four fields two-per-row on mobile */
@media(max-width:639px){
  .create-panel .form-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .create-panel .form-grid > label.wide,
  .create-panel .form-grid > .form-spa-banner.wide,
  .create-panel .form-grid > .actions.wide{
    grid-column:1 / -1;
    width:100%;
  }

  .create-panel .form-grid > .actions.wide{
    display:block;
    margin-top:16px;
  }

  .create-panel .form-grid > .actions.wide button{
    width:100%;
  }
}
label{min-width:0;display:grid;gap:7px;font-weight:700;font-size:.94rem}
input,select,textarea{
  display:block;
  width:100%;
  min-width:0;
  border:1px solid var(--border);
  border-radius:14px;
  padding:12px 13px;
  background:var(--surface);
  color:var(--text);
  font-size:16px;
  outline:none;
  transition:border-color .15s,box-shadow .15s;
}
input:focus,select:focus,textarea:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--focus)}
textarea{resize:vertical;min-height:104px}
.input-action,.actions,.filters,.inline-search,.section-heading,.row-actions{display:grid;grid-template-columns:minmax(0,1fr);gap:10px;align-items:stretch}
.button,button{
  width:100%;
  border:0;
  border-radius:14px;
  padding:12px 15px;
  text-decoration:none;
  cursor:pointer;
  display:inline-flex;
  justify-content:center;
  align-items:center;
  text-align:center;
  font-weight:800;
}
.primary{background:var(--accent);color:var(--surface);box-shadow:0 7px 18px var(--accent-shadow)}
.primary:active{background:var(--accent-dark);transform:translateY(1px)}
.request-container{max-width:720px;padding-top:28px}
.request-panel{padding:clamp(20px,5vw,36px)}
.form-spa-banner{
  width:100%;
  margin:0 auto 20px;
  overflow:hidden;
  border-radius:16px;
}
.form-spa-banner img{
  display:block;
  width:100%;
  height:auto;
}
.request-spa-banner{margin-bottom:22px}
.create-spa-banner{margin-bottom:5px}
.request-heading{text-align:center;margin-bottom:24px}
.request-heading p{max-width:520px;margin:10px auto 0}
.request-form{grid-template-columns:repeat(2,minmax(0,1fr))}
.request-form .wide{grid-column:1/-1}
.optional{font-weight:400;color:var(--muted)}
.request-note{margin:0;padding:12px;border-radius:12px;background:var(--accent-soft);color:var(--muted);font-size:.9rem}
.request-success{text-align:center;padding:22px 0}
.request-success p{max-width:480px;margin:14px auto 0;color:var(--muted)}
.request-success-icon{width:68px;height:68px;margin:0 auto 18px;border-radius:50%;display:grid;place-items:center;background:var(--success-bg-strong);color:var(--success);font-size:2rem;font-weight:900}
.request-admin-nav{display:flex!important;grid-auto-flow:column;gap:8px}
.request-admin-nav a{min-height:42px;display:inline-flex;align-items:center;padding:8px 12px;border-radius:12px;background:var(--accent-soft);text-decoration:none;font-weight:700}
.request-data{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:0 0 20px}
.request-data>div{padding:12px;border-radius:14px;background:var(--accent-soft)}
.request-data .wide{grid-column:1/-1}
.request-data dt{font-size:.82rem;color:var(--muted);font-weight:700}.request-data dd{margin:4px 0 0;font-weight:700}
.request-status-form{display:grid;grid-template-columns:minmax(0,1fr) minmax(150px,.5fr);gap:10px;align-items:end}
.status.new{background:var(--warning-bg);color:var(--warning-text)}.status.contacted{background:var(--info-bg);color:var(--info-text)}.status.completed{background:var(--success-bg-strong);color:var(--success)}.status.cancelled{background:var(--danger-bg-soft);color:var(--danger-text-soft)}
@media(max-width:560px){.request-form,.request-data{grid-template-columns:1fr}.request-status-form{grid-template-columns:1fr}.request-form .wide,.request-data .wide{grid-column:auto}}
.secondary{background:var(--accent-soft);color:var(--text)}
.actions{margin-top:16px}
.section-heading{margin-bottom:16px}
.filters{
  padding:12px;
  border-radius:16px;
  background:color-mix(in srgb,var(--accent-soft) 58%,var(--surface-68));
  grid-template-columns:minmax(0,1.55fr) minmax(0,.85fr);
}
.filters input{min-width:0}

.filters > input,
.filters > select{
  width:100%;
  min-width:0;
}

.filters > .date-range,
.filters > .search-actions{
  grid-column:1 / -1;
}

/* preserve existing rows */
.search-actions{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
}
.reset-button{
  background:var(--surface);
  border:1px solid var(--border);
  color:var(--text);
}
.date-range{display:flex!important;flex-direction:row!important;align-items:flex-end;gap:8px;width:100%}
.date-range label{flex:1 1 0;min-width:0;font-size:.84rem;color:var(--muted)}
.date-range input{width:100%;min-width:0;padding-inline:7px;font-size:14px}
.search-button{
  margin-top:2px;
  background:var(--accent);
  color:var(--surface);
}
.search-button:disabled{
  opacity:.42;
  cursor:not-allowed;
}
.search-placeholder{padding:22px 14px;border:1px dashed var(--border);border-radius:16px;background:color-mix(in srgb,var(--accent-soft) 58%,var(--surface-68));color:var(--muted);text-align:center;font-weight:700}
.search-message{margin-top:0}
.manual-lookup-label{
  display:flex;
  align-items:center;
  gap:10px;
  width:100%;
  color:var(--muted);
  font-size:.9rem;
  font-weight:700;
}

.manual-lookup-label::before,
.manual-lookup-label::after{
  content:"";
  flex:1;
  height:1px;
  background:var(--border);
}

.manual-lookup-label span{
  flex:0 0 auto;
}

.card-number-input{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  width:100%;
}

.card-number-input span{
  flex:0 0 auto;
  font-weight:800;
  color:var(--text);
}

.card-number-input input{
  width:110px;
  min-width:110px;
  max-width:110px;
  text-align:center;
  direction:ltr;
}

.card-number-input input::placeholder{
  color:var(--muted);
  opacity:.55;
}

.inline-search{margin-top:14px}

/* Existing cards are real cards on phones; no horizontal table */
.table-wrap{
    width:100%;
    max-height:calc(100svh - 330px);
    min-height:180px;
    overflow-y:auto;
    overflow-x:hidden;
    padding-inline-end:4px;
    padding-bottom:8px;
    overscroll-behavior:contain;
    -webkit-overflow-scrolling:touch;
}

table,thead,tbody,tr,th,td{display:block;width:100%}
thead{display:none}
table{min-width:0;border:0;border-collapse:separate}
tbody{display:grid;gap:12px}
tr{
  min-width:0;
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:18px;
  padding:13px 14px;
  box-shadow:0 5px 16px var(--soft-shadow-color);
}
td{
  min-width:0;
  display:grid;
  grid-template-columns:88px minmax(0,1fr);
  align-items:start;
  gap:12px;
  text-align:start;
  padding:9px 0;
  border-bottom:1px solid var(--row-border);
  overflow-wrap:anywhere;
}
td:last-child{border-bottom:0;padding-bottom:0}
td::before{content:attr(data-label);color:var(--muted);font-size:.84rem;font-weight:700;text-align:start}
td[dir="ltr"]{direction:ltr;text-align:left}
.row-actions{grid-template-columns:repeat(3,minmax(0,1fr));padding-top:12px}
.row-actions::before{display:none}
.row-actions a,.row-actions button{
  min-height:44px;
  width:100%;
  padding:7px;
  border:1px solid var(--border);
  border-radius:12px;
  background:var(--accent-soft);
  display:flex;
  align-items:center;
  justify-content:center;
  text-decoration:none;
  font-weight:800;
  color:var(--accent-dark);
  font-size:1.05rem;
}
.row-actions .check-action{background:var(--surface);border-color:var(--accent)}
.row-actions .share-action{background:color-mix(in srgb,var(--accent-soft) 68%,var(--surface))}
.card-share-modal[hidden]{display:none!important}
.card-share-modal{
  position:fixed;
  inset:0;
  z-index:1100;
  display:grid;
  place-items:center;
  padding:16px;
  background:var(--overlay);
  backdrop-filter:blur(4px);
}
.card-share-card{
  position:relative;
  width:min(480px,100%);
  max-height:calc(100svh - 32px);
  overflow:auto;
  padding:25px 20px 20px;
  border:1px solid var(--border);
  border-radius:22px;
  background:var(--surface);
  box-shadow:0 24px 70px var(--black-24);
}
.card-share-card h2{margin:0 38px 4px 0;text-align:center}
.card-share-card > .muted{text-align:center;margin:0 0 17px}
.card-share-close{
  position:absolute;
  top:12px;
  right:12px;
  width:36px;
  min-height:36px;
  padding:0;
  border-radius:50%;
  background:var(--accent-soft);
  color:var(--accent-dark);
  font-size:1.45rem;
  line-height:1;
}
.card-share-destinations{display:grid;gap:10px}
.card-share-option{
  display:grid;
  justify-items:start;
  gap:3px;
  text-align:right;
}
.card-share-option span{font-size:.84rem;font-weight:400;opacity:.88;overflow-wrap:anywhere}
.card-share-option:disabled{opacity:.45;cursor:not-allowed;box-shadow:none}
.card-share-option.is-selected{border-color:var(--accent);box-shadow:0 0 0 3px var(--focus)}
.card-share-phone{
  display:grid;
  gap:10px;
  margin-top:16px;
  padding-top:15px;
  border-top:1px solid var(--border);
}
.card-share-phone label{display:grid;gap:7px}
.card-share-field-title{display:flex;align-items:center;justify-content:space-between;gap:12px}
.card-share-clear{
  width:auto;
  min-height:0;
  padding:2px 0;
  border:0;
  background:transparent;
  color:var(--accent-dark);
  font-size:.88rem;
  font-weight:800;
  text-decoration:underline;
  box-shadow:none;
}
.card-share-whatsapp:disabled{opacity:.42;cursor:not-allowed;box-shadow:none}
.card-share-native{margin-top:10px}
.status{display:inline-flex;width:max-content;max-width:100%;padding:6px 10px;border-radius:999px;background:var(--neutral-bg);white-space:nowrap;font-size:.88rem;font-weight:800}
.status.active{background:var(--success-bg);color:var(--success-text)}
.status.used{background:var(--neutral-bg);color:var(--neutral-text)}
.status.cancelled,.status.expired{background:var(--danger-bg);color:var(--danger-text)}
.alert{padding:13px 15px;border-radius:14px;margin-bottom:0;font-weight:700}
.alert.success{background:var(--success-bg);color:var(--success-text)}.alert.error{background:var(--danger-bg);color:var(--danger-text)}
.empty{display:block!important;text-align:center;color:var(--muted);padding:18px 8px!important}
.empty::before{display:none}

/* Login, creation confirmation and redemption verification */
.center-page{
  min-height:100svh;
  display:grid;
  align-items:center;
  padding:14px max(12px,env(safe-area-inset-right)) calc(14px + env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left));
}
.auth-card,.result-card{max-width:620px;margin:auto}
.auth-card form,.result-card form{width:100%}
.success-mark{width:60px;height:60px;border-radius:50%;display:grid;place-items:center;background:var(--success-bg);color:var(--success);font-size:31px;margin-bottom:16px}
.verify-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:10px;margin:18px 0}
.verify-grid>div{min-width:0;background:var(--soft-panel);border:1px solid var(--border);padding:13px;border-radius:14px;display:grid;gap:5px;overflow-wrap:anywhere}
.verify-grid span{font-size:.84rem;color:var(--muted)}
.danger-action{width:100%;font-size:1.05rem}
.link-danger{background:transparent;color:var(--danger);padding-inline:0;margin-top:8px}

/* Public customer gift-card page: premium mobile-first presentation */
.gift-page{
  min-height:100svh;
  display:block;
  padding:10px max(10px,env(safe-area-inset-right)) calc(18px + env(safe-area-inset-bottom)) max(10px,env(safe-area-inset-left));
}
.gift-card-public{
  position:relative;
  isolation:isolate;
  width:100%;
  max-width:540px;
  min-height:calc(100svh - 28px - env(safe-area-inset-bottom));
  margin:0 auto;
  text-align:center;
  background:linear-gradient(180deg,var(--gift-card-start),var(--gift-card-end));
  border:1px solid var(--surface-92);
  border-radius:28px;
  padding:25px 16px 20px;
  box-shadow:0 22px 60px var(--gift-shadow);
  overflow:hidden;
}
.gift-decoration{position:absolute;z-index:-1;border-radius:50%;pointer-events:none}
.gift-decoration-top{width:180px;height:180px;top:-98px;left:-62px;background:radial-gradient(circle,var(--gift-decoration),var(--gift-decoration-clear) 70%)}
.gift-decoration-bottom{width:230px;height:230px;right:-120px;bottom:-118px;background:radial-gradient(circle,var(--gift-accent-faint),var(--gift-accent-clear) 70%)}
.gift-header{display:grid;justify-items:center;gap:4px}
.gift-spa-banner,.result-spa-banner{
  display:block;
  width:100%;
  height:auto;
  object-fit:contain;
  border-radius:20px;
}
.gift-spa-banner{margin:0 auto 8px}
.result-spa-banner{margin:0 auto 18px}
.gift-brand-icon{
  width:54px;height:54px;border-radius:50%;display:grid;place-items:center;
  background:linear-gradient(145deg,var(--gift-brand),var(--accent-dark));color:var(--surface);font-size:1.45rem;
  box-shadow:0 8px 22px var(--accent-shadow-25)
}
.brand{
  margin-top:7px;
  font-weight:900;
  letter-spacing:.045em;
  font-size:1.25rem;
  color:var(--accent-dark)
}
.gift-title{margin:0;color:var(--muted);font-size:.87rem;letter-spacing:.08em}
.gift-hero{padding:20px 0 13px}
.recipient-label{margin:0 0 3px;color:var(--muted);font-size:.9rem;font-weight:700}
.gift-card-public h1{font-size:clamp(2rem,10vw,3rem);overflow-wrap:anywhere;color:var(--gift-title)}
.amount{
  font-size:2.2rem;
  line-height:1;
  font-weight:900;
  color:var(--accent-dark);
  margin:17px 0 4px;
  direction:ltr
}
.amount .currency{font-size:.56em;vertical-align:.18em;margin-right:.08em}
.dedication{
  position:relative;margin:7px 0 18px;padding:19px 16px 17px;
  border:1px solid var(--gift-border);border-radius:20px;background:linear-gradient(145deg,var(--gift-dedication-start),var(--gift-dedication-end));
  box-shadow:inset 0 1px 0 var(--surface-90)
}
.dedication>i{position:absolute;top:11px;right:14px;color:var(--gift-accent-icon);font-size:1.25rem}
.message{margin:0;padding:7px 4px 0;font-size:1rem;line-height:1.75;overflow-wrap:anywhere;color:var(--gift-message)}
.treatment{
  position:relative;gap:9px;background:linear-gradient(135deg,var(--accent),var(--accent-dark));
  color:var(--surface);margin:0 0 18px;min-height:54px;border-radius:16px;
  box-shadow:0 9px 22px var(--accent-shadow-23)
}
.treatment:hover{color:var(--surface)}
.treatment-arrow{font-size:.78rem;opacity:.72;margin-inline-start:auto}
.gift-redemption{display:grid;justify-items:center;gap:14px}
.public-status{display:inline-flex;align-items:center;gap:7px;border-radius:999px;padding:8px 15px;font-weight:900;font-size:.92rem}
.public-status.active{background:var(--success-bg);color:var(--success-text)}
.public-status.used{background:var(--gift-used-bg);color:var(--gift-used-text)}
.public-status.cancelled,.public-status.expired{background:var(--danger-bg);color:var(--danger-text)}
.qr-panel{width:100%;padding:16px 12px 15px;border:1px solid var(--border);border-radius:22px;background:var(--surface);box-shadow:0 8px 24px var(--soft-shadow-07)}
.scan-instruction{margin:0;color:var(--gift-instruction);font-size:.92rem;font-weight:800}
.scan-instruction i{color:var(--accent)}
.qr{display:flex;justify-content:center;margin:15px auto 11px;max-width:100%;overflow:hidden}
.qr img,.qr canvas{display:block;width:min(62vw,225px)!important;max-width:100%;height:auto!important;border:10px solid var(--surface);border-radius:17px;box-shadow:0 7px 22px var(--soft-shadow-13)}
.qr-note{margin:0;color:var(--muted);font-size:.79rem}
.used-note{width:100%;margin:0;padding:16px;border-radius:17px;background:var(--soft-panel-2);color:var(--muted);font-weight:700}
.used-note i{margin-left:5px}
.card-meta{display:grid;grid-template-columns:minmax(0,1fr);gap:9px;margin:18px 0 0;padding:0;border:0}
.card-meta div{display:grid;justify-items:center;gap:5px;padding:12px;border:1px solid var(--border);border-radius:15px;background:var(--soft-panel);min-width:0}
.card-meta dt{color:var(--muted);text-align:center;font-size:.8rem;font-weight:700}
.card-meta dt i{margin-left:4px;color:var(--accent)}
.card-meta dd{margin:0;font-weight:900;text-align:center;overflow-wrap:anywhere;color:var(--gift-meta-text)}
.gift-footer{
    margin-top:22px;
    padding-top:16px;
    border-top:1px solid var(--border);
    display:flex;
    flex-direction:column;
    gap:14px;
}

.gift-footer-title{
    display:flex;
    justify-content:center;
    align-items:center;
    gap:8px;
    color:var(--accent-dark);
    font-size:.92rem;
    font-weight:800;
}

.gift-footer-title i{
    font-size:.8rem;
}

.business-links{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:10px;
}

.business-links a{
    flex:1;
    min-height:48px;

    display:flex;
    justify-content:center;
    align-items:center;

    border:1px solid var(--border);
    border-radius:14px;

    background:var(--soft-panel);
    color:var(--accent-dark);
    text-decoration:none;

    transition:.18s ease;
}

.business-links a:hover{
    background:var(--accent-soft);
    transform:translateY(-1px);
}

.business-links a i{
    font-size:1.2rem;
}

.business-links a:active{
    transform:scale(.97);
}
.gift-card-public.status-used .amount,.gift-card-public.status-cancelled .amount,.gift-card-public.status-expired .amount{filter:grayscale(1);opacity:.58}

/* Camera scanner */
#reader{width:100%;max-width:500px;margin:14px auto;overflow:hidden;border:1px solid var(--border);border-radius:18px;background:var(--reader-bg)}
#reader video{display:block;width:100%!important;max-width:100%!important;height:auto!important}
#reader__dashboard_section_csr button{width:auto;max-width:100%;margin:6px auto}


[hidden]{
  display:none !important;
}

/* Only after phone layout is complete do wider layouts expand */
@media(min-width:640px){
  .container{padding:22px 20px 42px;gap:20px}
  .panel,.auth-card,.result-card{padding:25px}
  .form-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .wide{grid-column:1/-1}
  .input-action{grid-template-columns:minmax(0,1fr) auto}
  .input-action .button,.input-action button{width:auto}
  .actions{display:flex;flex-wrap:wrap}
  .actions .button,.actions button{width:auto}
  .inline-search{grid-template-columns:minmax(0,1fr) auto}
  .inline-search button{width:auto}
  .verify-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .gift-page{display:grid;place-items:center;padding:22px}
  .gift-card-public{min-height:0;padding:38px 30px 25px;border-radius:34px}
  .card-meta{grid-template-columns:repeat(2,minmax(0,1fr))}
  .qr img,.qr canvas{width:230px!important}
}

@media(min-width:900px){
  .topbar{padding:14px 32px}.topbar div{display:flex;gap:10px;align-items:center}.topbar span{font-size:.95rem}
  .container{padding:28px 20px 60px;gap:24px}
  .section-heading{display:block}
  .filters{display:grid;grid-template-columns:minmax(240px,2fr) minmax(160px,1fr) auto;align-items:end;padding:0;background:transparent}
  .filters>input{min-width:0}.filters button,.filters select{width:100%}
  .date-range{grid-column:1/-1;max-width:520px}
  .search-button{min-width:110px}
  .table-wrap{max-height:65vh;overflow:auto;padding-inline-end:6px}
  table{display:table;min-width:820px;border-collapse:collapse}
  thead{display:table-header-group}tbody{display:table-row-group}
  tr{display:table-row;background:transparent;border:0;border-radius:0;padding:0;box-shadow:none}
  th,td{display:table-cell;width:auto;text-align:right;padding:13px;border-bottom:1px solid var(--border)}
  th{color:var(--muted);font-size:.9rem}
  td::before{display:none}
  .row-actions{display:flex;gap:8px;white-space:nowrap;padding-top:13px}
  .row-actions a,.row-actions button{
    min-height:38px;
    width:38px;
    flex:0 0 38px;
    padding:7px;
    border:1px solid var(--border);
    border-radius:10px;
    background:var(--accent-soft);
    display:inline-flex;
    align-items:center;
    justify-content:center;
    color:var(--accent-dark);
  }
  .row-actions .check-action{background:var(--surface);border-color:var(--accent);}
  thead th{position:sticky;top:0;z-index:2;background:var(--surface)}
}

/* Admin business-theme refinement: shared shell */
:root[data-business] .topbar{
  background:var(--chrome-bg);
  border-bottom-color:var(--chrome-border);
  box-shadow:0 3px 14px var(--soft-shadow-color);
}
:root[data-business] .topbar span{color:var(--muted)}
:root[data-business] .topbar > a{background:var(--surface);color:var(--accent-dark)}
:root[data-business] .topbar > a:hover{background:var(--chrome-hover)}

:root[data-business] .business-selector{
  background:var(--surface-94);
  border-color:var(--surface-58);
  color:var(--accent-dark);
}

:root[data-business] .container > .panel{
  background:var(--surface-52);
  border-color:color-mix(in srgb,var(--accent) 22%,transparent);
  box-shadow:0 12px 32px color-mix(in srgb,var(--accent-dark) 9%,transparent);
  backdrop-filter:blur(5px);
  -webkit-backdrop-filter:blur(5px);
}

.login-separator{
  width:100%;
  height:2px;
  margin:16px 0 20px;
  border-radius:999px;
  background:var(--accent);
}

/* Public gift card business themes */
:root[data-business] .gift-page{
  background:
    radial-gradient(circle at 15% 8%,var(--surface-72) 0,var(--surface-clear) 26%),
    radial-gradient(circle at 88% 92%,color-mix(in srgb,var(--accent) 22%,transparent) 0,transparent 34%),
    /*linear-gradient(145deg,var(--surface) 0%,var(--page-bg) 48%,color-mix(in srgb,var(--accent-soft) 78%,var(--accent)) 100%);*/
}

:root[data-business] .gift-card-public{
  background:linear-gradient(180deg,var(--surface-46),color-mix(in srgb,var(--accent-soft) 18%,var(--surface-44)));
  border-color:color-mix(in srgb,var(--accent) 18%,var(--surface-92));
  box-shadow:0 22px 60px color-mix(in srgb,var(--accent-dark) 20%,transparent);
}

:root[data-business] .gift-decoration-top{
  background:radial-gradient(circle,color-mix(in srgb,var(--accent) 26%,transparent),transparent 70%);
}

:root[data-business] .gift-decoration-bottom{
  background:radial-gradient(circle,color-mix(in srgb,var(--accent-dark) 16%,transparent),transparent 70%);
}

:root[data-business] .gift-brand-icon{
  background:linear-gradient(145deg,var(--accent),var(--accent-dark));
  box-shadow:0 8px 22px color-mix(in srgb,var(--accent-dark) 25%,transparent);
}

:root[data-business] .gift-card-public h1,
:root[data-business] .message,
:root[data-business] .scan-instruction,
:root[data-business] .card-meta dd{
  color:var(--text);
}

:root[data-business] .dedication{
  border-color:var(--border);
  background:linear-gradient(145deg,var(--surface-88),color-mix(in srgb,var(--accent-soft) 48%,var(--surface-84)));
}

:root[data-business] .dedication > i{
  color:color-mix(in srgb,var(--accent-dark) 28%,transparent);
}

:root[data-business] .treatment{
  box-shadow:0 9px 22px color-mix(in srgb,var(--accent-dark) 23%,transparent);
}

:root[data-business] .qr-panel{
  border-color:var(--border);
  background:var(--surface-78);
  box-shadow:0 8px 24px color-mix(in srgb,var(--accent-dark) 9%,transparent);
}

:root[data-business] .card-meta div,
:root[data-business] .business-links a{
  background:color-mix(in srgb,var(--accent-soft) 46%,var(--surface-76));
}

:root[data-business] .used-note{
  background:color-mix(in srgb,var(--accent-soft) 42%,var(--surface-76));
}

/* Redemption page business theme */
:root[data-business] .center-page .result-card{
  background:var(--surface-42);
  border-color:color-mix(in srgb,var(--accent) 22%,transparent);
  box-shadow:0 18px 50px color-mix(in srgb,var(--accent-dark) 12%,transparent);
}

:root[data-business] .verify-grid > div{
  background:color-mix(in srgb,var(--accent-soft) 42%,var(--surface-72));
}

/* Created confirmation page business theme */
:root[data-business] .center-page .result-card{
  background:var(--surface-42);
  border-color:color-mix(in srgb,var(--accent) 22%,transparent);
  box-shadow:0 18px 50px color-mix(in srgb,var(--accent-dark) 12%,transparent);
}



/* Global Gift Cards project identity */
.project-logo{
  display:block;
  width:auto;
  aspect-ratio:1;
  object-fit:contain;
}
.project-logo-login{
  width:112px;
  margin:0 auto 8px;
}
.topbar-brand{
  display:flex!important;
  align-items:center;
  gap:10px!important;
  min-width:0;
}
.topbar-business{
  display:grid!important;
  gap:0!important;
  min-width:0;
}
.project-logo-admin{
  width:44px;
  flex:0 0 44px;
  border-radius:12px;
}

/* Gift Cards logo placement across front-end pages */
.project-logo-card{
  width:96px;
  height:96px;
  margin:0 auto 4px;
  border-radius:22px;
}

.project-logo-result{
  width:92px;
  height:92px;
  margin:0 auto 14px;
  border-radius:20px;
}

.topbar-brand{
  display:flex!important;
  align-items:center;
  gap:10px!important;
}

.topbar-business{
  display:flex!important;
  align-items:center;
}
