:root{
  --bg:#f7f1ed;
  --panel:#ffffff;
  --text:#2d2320;
  --muted:#786a65;
  --accent:#9c6555;
  --accent-dark:#75463b;
  --accent-soft:#f1e5e0;
  --border:#e7d9d3;
  --success:#26734d;
  --danger:#a83838;
  --shadow:0 10px 28px rgba(68,43,34,.10);
  --radius:20px;
}

/* Business color themes — matched to Appointment Reminder */
:root[data-business="pnina"]{
  --bg:#edf9fa;
  --page-bg:#edf9fa;
  --page-glow:rgba(0,213,226,.24);
  --text:#111b1d;
  --muted:#607174;
  --accent:#00b9c7;
  --accent-dark:#007f8a;
  --accent-soft:#dcf7f9;
  --border:#bfe5e8;
  --focus:rgba(0,185,199,.17);
  --shadow:0 18px 50px rgba(0,76,83,.15);
  --icon-shadow:rgba(0,119,130,.22);
}

:root[data-business="head"]{
  --bg:#fff3f8;
  --page-bg:#fff3f8;
  --page-glow:rgba(233,30,99,.22);
  --text:#2b1d23;
  --muted:#7a5a67;
  --accent:#e91e63;
  --accent-dark:#c2185b;
  --accent-soft:#fde7ef;
  --border:#f5c7d9;
  --focus:rgba(233,30,99,.17);
  --shadow:0 18px 50px rgba(180,25,80,.15);
  --icon-shadow:rgba(180,25,80,.22);
}

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

:root[data-business] body{
  background:
    radial-gradient(circle at 88% 8%,var(--page-glow),transparent 36%),
    radial-gradient(circle at 8% 92%,color-mix(in srgb,var(--accent) 10%,transparent),transparent 32%),
    linear-gradient(155deg,#fff 0%,var(--page-bg) 100%);
  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:linear-gradient(180deg,#fff 0,#f7f1ed 180px);
  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:rgba(255,255,255,.94);
  border-bottom:1px solid var(--border);
  box-shadow:0 3px 14px rgba(68,43,34,.06);
  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:#fff;
}
.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:#fff;
  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 rgba(156,101,85,.14)}
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:#fff;box-shadow:0 7px 18px rgba(117,70,59,.20)}
.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:#e2f5eb;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:#fff0bd;color:#715600}.status.contacted{background:#e3efff;color:#24588f}.status.completed{background:#e2f5eb;color:#26734d}.status.cancelled{background:#f9dddd;color:#8b2929}
@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%,rgba(255,255,255,.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:#fff;
  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:#fff;
}
.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%,rgba(255,255,255,.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:#fff;
  border:1px solid var(--border);
  border-radius:18px;
  padding:13px 14px;
  box-shadow:0 5px 16px rgba(68,43,34,.06);
}
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 #f0e6e2;
  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:#fff;border-color:var(--accent)}
.row-actions .share-action{background:color-mix(in srgb,var(--accent-soft) 68%,#fff)}
.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:rgba(8,27,30,.58);
  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:#fff;
  box-shadow:0 24px 70px rgba(0,0,0,.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:#eee;white-space:nowrap;font-size:.88rem;font-weight:800}
.status.active{background:#dff4e8;color:#216641}
.status.used{background:#eee;color:#555}
.status.cancelled,.status.expired{background:#f8dede;color:#8d2d2d}
.alert{padding:13px 15px;border-radius:14px;margin-bottom:0;font-weight:700}
.alert.success{background:#dff4e8;color:#216641}.alert.error{background:#f8dede;color:#8d2d2d}
.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:#dff4e8;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:#faf7f5;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));
  background:
    radial-gradient(circle at 15% 8%,rgba(255,255,255,.72) 0,rgba(255,255,255,0) 26%),
    radial-gradient(circle at 88% 92%,rgba(156,101,85,.18) 0,rgba(156,101,85,0) 34%),
    linear-gradient(145deg,#f7e9e3 0,#e9d8d0 46%,#cfb7ad 100%);
}
.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,rgba(255,255,255,.985),rgba(255,251,249,.97));
  border:1px solid rgba(255,255,255,.92);
  border-radius:28px;
  padding:25px 16px 20px;
  box-shadow:0 22px 60px rgba(73,41,30,.24);
  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,rgba(213,177,163,.38),rgba(213,177,163,0) 70%)}
.gift-decoration-bottom{width:230px;height:230px;right:-120px;bottom:-118px;background:radial-gradient(circle,rgba(156,101,85,.16),rgba(156,101,85,0) 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,#a96f5e,#75463b);color:#fff;font-size:1.45rem;
  box-shadow:0 8px 22px rgba(117,70,59,.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:#352723}
.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 #eadbd5;border-radius:20px;background:linear-gradient(145deg,#fffaf8,#f8eeea);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9)
}
.dedication>i{position:absolute;top:11px;right:14px;color:rgba(156,101,85,.28);font-size:1.25rem}
.message{margin:0;padding:7px 4px 0;font-size:1rem;line-height:1.75;overflow-wrap:anywhere;color:#4a3933}
.treatment{
  position:relative;gap:9px;background:linear-gradient(135deg,var(--accent),var(--accent-dark));
  color:#fff;margin:0 0 18px;min-height:54px;border-radius:16px;
  box-shadow:0 9px 22px rgba(117,70,59,.23)
}
.treatment:hover{color:#fff}
.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:#dff4e8;color:#216641}
.public-status.used{background:#ece9e7;color:#58504d}
.public-status.cancelled,.public-status.expired{background:#f8dede;color:#8d2d2d}
.qr-panel{width:100%;padding:16px 12px 15px;border:1px solid var(--border);border-radius:22px;background:#fff;box-shadow:0 8px 24px rgba(68,43,34,.07)}
.scan-instruction{margin:0;color:#4d403b;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 #fff;border-radius:17px;box-shadow:0 7px 22px rgba(68,43,34,.13)}
.qr-note{margin:0;color:var(--muted);font-size:.79rem}
.used-note{width:100%;margin:0;padding:16px;border-radius:17px;background:#faf5f2;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:#faf7f5;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:#3e302b}
.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:#faf7f5;
    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:#111}
#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:#fff;border-color:var(--accent);}
  thead th{position:sticky;top:0;z-index:2;background:var(--panel)}
}

/* Admin business-theme refinement: dominant header + translucent sections */
:root[data-business] .topbar{
  background:var(--accent);
  border-bottom-color:color-mix(in srgb,var(--accent-dark) 28%,transparent);
  box-shadow:0 5px 18px color-mix(in srgb,var(--accent-dark) 24%,transparent);
}

:root[data-business] .topbar span{
  color:rgba(255,255,255,.88);
}

:root[data-business] .topbar > a{
  background:rgba(255,255,255,.20);
  color:#fff;
}

:root[data-business] .topbar > a:hover{
  background:rgba(255,255,255,.30);
}

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

:root[data-business] .container > .panel{
  background:rgba(255,255,255,.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 uses the fixed Pnina Spa theme */
:root[data-business="pnina"] .center-page .auth-card{
  background:rgba(255,255,255,.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);
  backdrop-filter:blur(7px);
  -webkit-backdrop-filter:blur(7px);
}

.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%,rgba(255,255,255,.72) 0,rgba(255,255,255,0) 26%),
    radial-gradient(circle at 88% 92%,color-mix(in srgb,var(--accent) 22%,transparent) 0,transparent 34%),
    linear-gradient(145deg,#fff 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,rgba(255,255,255,.46),color-mix(in srgb,var(--accent-soft) 18%,rgba(255,255,255,.44)));
  border-color:color-mix(in srgb,var(--accent) 18%,rgba(255,255,255,.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,rgba(255,255,255,.88),color-mix(in srgb,var(--accent-soft) 48%,rgba(255,255,255,.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:rgba(255,255,255,.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%,rgba(255,255,255,.76));
}

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

/* Redemption page business theme */
:root[data-business] .center-page .result-card{
  background:rgba(255,255,255,.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%,rgba(255,255,255,.72));
}

/* Created confirmation page business theme */
:root[data-business] .center-page .result-card{
  background:rgba(255,255,255,.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;
}