/* REZO LASH — calm customer account identity aligned with the booking flow */
:root{
  --account-green:#053f31;
  --account-green-2:#0a6b4b;
  --account-gold:#d5b891;
  --account-gold-soft:#f2d8a4;
  --account-ink:#35271f;
  --account-text:#5e493b;
  --account-muted:#806d60;
  --account-soft:#fbf6ef;
  --account-cream:#fffaf7;
  --account-line:rgba(116,83,55,.12);
  --account-shadow:0 22px 60px rgba(74,47,27,.075);
}

*{box-sizing:border-box}
body{
  background:
    radial-gradient(circle at 85% 0,rgba(213,184,145,.18),transparent 32%),
    linear-gradient(180deg,#fffaf7 0%,#fff 54%,#fbf6ef 100%)!important;
  color:var(--account-ink)!important;
}

/* Shared page frame */
.bookings-page,.loyalty-page{
  min-height:calc(100vh - 160px)!important;
  padding:calc(var(--rezo-fixed-header-height,112px) + 20px) 5vw 54px!important;
}
.bookings-shell,.loyalty-shell{
  width:min(1180px,100%)!important;
  max-width:1180px!important;
  margin:0 auto!important;
  gap:20px!important;
}
.bookings-card,.loyalty-shell .panel,.loyalty-card,#host>.empty{
  border:1px solid var(--account-line)!important;
  border-radius:30px!important;
  box-shadow:var(--account-shadow)!important;
}
.eyebrow{
  display:inline-flex!important;
  width:max-content!important;
  margin:0 0 8px!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  color:#967d68!important;
  font-size:11px!important;
  font-weight:1000!important;
  letter-spacing:.2em!important;
}
.bookings-card h1,.bookings-card h2,.loyalty-shell h1,.loyalty-shell h2,#host>.empty h2{
  color:var(--account-ink)!important;
}
.primary,.btn.dark{
  border:0!important;
  background:linear-gradient(135deg,var(--account-green),var(--account-green-2))!important;
  color:#fff7e8!important;
  box-shadow:0 13px 28px rgba(5,63,49,.20)!important;
}
.primary:hover,.btn.dark:hover{transform:translateY(-1px)!important;filter:brightness(1.02)!important}
.ghost,.btn.light{
  border:1px solid rgba(116,83,55,.16)!important;
  background:#fff!important;
  color:#5a4335!important;
  box-shadow:none!important;
}
.ghost:hover,.btn.light:hover{background:#fffaf5!important;border-color:rgba(7,96,70,.22)!important;color:#075c42!important}

/* Bookings */
.bookings-hero{
  padding:26px!important;
  overflow:hidden!important;
  background:
    radial-gradient(circle at 88% 110%,rgba(213,184,145,.22),transparent 42%),
    linear-gradient(135deg,#fff 0%,#fffaf7 66%,#fbf2e8 100%)!important;
  border-color:var(--account-line)!important;
  box-shadow:var(--account-shadow)!important;
}
.bookings-hero::before{
  height:4px!important;
  background:linear-gradient(90deg,var(--account-green),var(--account-gold),var(--account-green-2))!important;
}
.bookings-hero::after{display:none!important}
.bookings-hero h1{
  margin:0 0 9px!important;
  font-size:clamp(30px,4vw,44px)!important;
  color:var(--account-ink)!important;
  letter-spacing:0!important;
}
.bookings-hero p{color:var(--account-muted)!important;font-weight:650!important;line-height:1.85!important}
.bookings-count-badge{
  min-width:145px!important;
  min-height:116px!important;
  border:1px solid rgba(5,63,49,.18)!important;
  border-radius:25px!important;
  background:linear-gradient(135deg,var(--account-green),var(--account-green-2))!important;
  color:#fff7e8!important;
  box-shadow:0 14px 30px rgba(5,63,49,.18)!important;
}
.bookings-count-badge::before{color:rgba(242,216,164,.52)!important}
.bookings-count-badge b{color:var(--account-gold-soft)!important;font-size:40px!important}
.bookings-count-badge small{color:#fff7e8!important;opacity:.86!important}
.bookings-login{
  margin-top:20px!important;
  padding:12px!important;
  border:1px solid rgba(116,83,55,.09)!important;
  border-radius:21px!important;
  background:rgba(255,255,255,.72)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9)!important;
}
.bookings-login input{
  min-height:52px!important;
  border:1px solid rgba(116,83,55,.17)!important;
  border-radius:17px!important;
  background:#fff!important;
  color:#3f3027!important;
  font-weight:850!important;
}
.bookings-login input:focus{
  outline:0!important;
  border-color:var(--account-green-2)!important;
  box-shadow:0 0 0 4px rgba(10,107,75,.10)!important;
}
label:has(#rememberCustomer){color:var(--account-muted)!important;font-weight:850!important}
#rememberCustomer{accent-color:var(--account-green-2)!important}
.msg{color:#9a5d49!important}
.bookings-actions{margin-top:16px!important}
.stats-card,.bookings-card#area{
  padding:24px!important;
  background:rgba(255,255,255,.96)!important;
}
.stats-head,.bookings-list-head{margin-bottom:18px!important}
.stats-head h2,.bookings-list-head h2{margin:0!important;color:var(--account-ink)!important}
.customer-stats{gap:12px!important}
.customer-stat{
  min-height:124px!important;
  padding:16px!important;
  border:1px solid rgba(116,83,55,.10)!important;
  border-radius:21px!important;
  background:linear-gradient(135deg,#fff,#fffaf7)!important;
  box-shadow:0 10px 25px rgba(74,47,27,.045)!important;
  transition:transform .16s ease,border-color .16s ease!important;
}
.customer-stat::before{
  top:auto!important;
  right:16px!important;
  bottom:0!important;
  width:42px!important;
  height:3px!important;
  border-radius:999px 999px 0 0!important;
  background:linear-gradient(90deg,var(--account-green),var(--account-gold))!important;
}
.customer-stat:nth-child(n)::before{background:linear-gradient(90deg,var(--account-green),var(--account-gold))!important}
.customer-stat:hover{transform:translateY(-1px)!important;border-color:rgba(7,96,70,.18)!important;box-shadow:0 13px 28px rgba(74,47,27,.06)!important}
.customer-stat small{color:#9a8678!important}
.customer-stat b{color:var(--account-ink)!important}
.customer-stat.green b{color:#075c42!important}
.customer-stat span{color:var(--account-muted)!important}
.booking-list{gap:13px!important}
.booking-card{
  padding:18px!important;
  border:1px solid rgba(116,83,55,.11)!important;
  border-radius:24px!important;
  background:linear-gradient(135deg,#fff,#fffaf7)!important;
  box-shadow:0 12px 30px rgba(74,47,27,.05)!important;
  transition:transform .16s ease,border-color .16s ease!important;
}
.booking-card:hover{transform:translateY(-1px)!important;border-color:rgba(7,96,70,.18)!important;box-shadow:0 15px 34px rgba(74,47,27,.065)!important}
.booking-card::before{
  width:6px!important;
  background:linear-gradient(180deg,var(--account-green),var(--account-green-2))!important;
}
.booking-card.completed::before{background:linear-gradient(180deg,var(--account-gold),#b78d59)!important}
.booking-title b{color:var(--account-ink)!important;font-size:21px!important}
.booking-title small{color:#9a8678!important}
.status-soft{
  border:1px solid rgba(7,92,66,.12)!important;
  background:#eef9f4!important;
  color:#075c42!important;
  box-shadow:none!important;
}
.status-soft.done{background:#fff7e8!important;color:#8a5d24!important;border-color:rgba(138,93,36,.12)!important}
.status-soft.wait{background:#fbf6ef!important;color:#806d60!important;border-color:rgba(116,83,55,.10)!important}
.booking-meta{gap:9px!important}
.meta{
  padding:11px 12px!important;
  border:1px solid rgba(116,83,55,.08)!important;
  border-radius:16px!important;
  background:#fff!important;
  box-shadow:none!important;
}
.meta small{color:#9a8678!important}
.meta b{color:var(--account-ink)!important}
.booking-note{
  border:1px solid rgba(116,83,55,.08)!important;
  border-radius:16px!important;
  background:var(--account-soft)!important;
  color:var(--account-muted)!important;
}
.remaining-payment-box{
  border-color:rgba(7,92,66,.14)!important;
  background:linear-gradient(135deg,#eff9f4,#fff)!important;
  box-shadow:none!important;
}
.remaining-payment-copy b{color:#075c42!important}
.remaining-payment-btn{background:linear-gradient(135deg,var(--account-green),var(--account-green-2))!important;box-shadow:0 12px 24px rgba(5,63,49,.16)!important}
.empty{
  border:1px dashed rgba(116,83,55,.16)!important;
  border-radius:22px!important;
  background:#fffaf7!important;
  color:var(--account-muted)!important;
  box-shadow:none!important;
}

/* Loyalty */
#host{width:min(1180px,100%);margin:0 auto}
.loyalty-shell{
  grid-template-columns:minmax(310px,.82fr) minmax(0,1.18fr)!important;
  align-items:start!important;
}
.loyalty-shell .panel{
  padding:24px!important;
  overflow:hidden!important;
  background:rgba(255,255,255,.96)!important;
}
.loyalty-shell .panel::before{
  height:4px!important;
  background:linear-gradient(90deg,var(--account-green),var(--account-gold),var(--account-green-2))!important;
}
.loyalty-shell .panel h1{margin:0 0 10px!important}
.loyalty-shell .panel p{color:var(--account-muted)!important;line-height:1.85!important}
.data-grid{gap:9px!important;margin-top:16px!important}
.data-row{
  padding:12px 13px!important;
  border:1px solid rgba(116,83,55,.09)!important;
  border-radius:16px!important;
  background:linear-gradient(135deg,#fff,#fffaf7)!important;
  box-shadow:none!important;
}
.data-row:hover{transform:none!important;border-color:rgba(7,96,70,.14)!important}
.data-row small{color:#9a8678!important}
.data-row b{color:var(--account-ink)!important}
.actions{gap:9px!important;margin-top:16px!important}
.actions .btn{min-height:49px;display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box}
.loyalty-card{
  padding:26px!important;
  overflow:hidden!important;
  background:
    radial-gradient(circle at 13% 8%,rgba(255,255,255,.12),transparent 27%),
    radial-gradient(circle at 90% 100%,rgba(242,216,164,.18),transparent 36%),
    linear-gradient(145deg,var(--account-green) 0%,#07553f 54%,var(--account-green-2) 100%)!important;
  color:#fff7e8!important;
  border:1px solid rgba(5,63,49,.24)!important;
  box-shadow:0 24px 65px rgba(5,63,49,.22)!important;
}
.loyalty-card:before{background:rgba(255,255,255,.06)!important}
.loyalty-card:after{background:radial-gradient(circle,rgba(242,216,164,.18),transparent 64%)!important}
.loyalty-card .brand-mark b,.loyalty-card .brand-mark small,.loyalty-card .customer-name,.loyalty-card .customer-no{color:#fff7e8!important}
.loyalty-card .brand-mark small{opacity:.75!important}
.loyalty-card .rewards{color:var(--account-gold-soft)!important;letter-spacing:2.5px!important}
.loyalty-card .customer-name{font-size:32px!important;margin:20px 0 8px!important;text-shadow:none!important}
.loyalty-card .customer-no{
  padding:8px 13px!important;
  border:1px solid rgba(255,255,255,.16)!important;
  background:rgba(255,255,255,.08)!important;
  box-shadow:none!important;
}
.loyalty-card .stats{gap:9px!important;margin:18px 0!important}
.loyalty-card .stat{
  padding:13px!important;
  border:1px solid rgba(255,255,255,.13)!important;
  border-radius:17px!important;
  background:rgba(255,255,255,.08)!important;
  box-shadow:none!important;
  backdrop-filter:blur(7px)!important;
}
.loyalty-card .stat small{color:rgba(255,247,232,.72)!important}
.loyalty-card .stat b{color:#fff7e8!important;font-size:21px!important}
.loyalty-card .progress-box{
  padding:14px!important;
  border:1px solid rgba(255,255,255,.13)!important;
  border-radius:20px!important;
  background:rgba(255,255,255,.08)!important;
  box-shadow:none!important;
}
.loyalty-card .progress-head,.loyalty-card .reward-note{color:#fff7e8!important}
.loyalty-card .reward-note{opacity:.78!important}
.loyalty-card .bar{height:12px!important;background:rgba(255,255,255,.15)!important}
.loyalty-card .bar span{background:linear-gradient(90deg,var(--account-gold),var(--account-gold-soft))!important;box-shadow:none!important}
.loyalty-card .barcode-wrap{grid-template-columns:176px 1fr!important;gap:12px!important}
.loyalty-card .qr{
  width:176px!important;
  height:176px!important;
  padding:10px!important;
  border:4px solid rgba(255,255,255,.14)!important;
  border-radius:23px!important;
  box-shadow:0 14px 30px rgba(0,0,0,.12)!important;
}
.loyalty-card .qr img{width:148px!important;height:148px!important}
.loyalty-card .pin{
  padding:15px!important;
  border:1px solid rgba(255,255,255,.13)!important;
  border-radius:20px!important;
  background:rgba(255,255,255,.08)!important;
  box-shadow:none!important;
}
.loyalty-card .pin small,.loyalty-card .timer,.loyalty-card .barcode-no{color:#fff7e8!important}
.loyalty-card .pin strong{color:var(--account-gold-soft)!important;text-shadow:none!important}
.loyalty-card .fake-barcode{background:repeating-linear-gradient(90deg,#fff7e8 0 3px,transparent 3px 6px,#fff7e8 6px 8px,transparent 8px 13px)!important;opacity:.48!important}
#host>.empty{
  max-width:720px!important;
  padding:28px!important;
  background:rgba(255,255,255,.96)!important;
  text-align:center!important;
}
#host>.empty p{color:var(--account-muted)!important}
#host>.empty .data-grid{text-align:right!important}
#host>.empty input{
  border-color:rgba(116,83,55,.17)!important;
  border-radius:15px!important;
  background:#fff!important;
  color:var(--account-ink)!important;
}
#host>.empty input:focus{outline:0!important;border-color:var(--account-green-2)!important;box-shadow:0 0 0 4px rgba(10,107,75,.10)!important}
#loRememberCustomer{accent-color:var(--account-green-2)!important}

footer{background:#fffaf7!important;border-top:1px solid rgba(116,83,55,.09)!important;color:var(--account-muted)!important}
footer strong{color:var(--account-ink)!important}

@media(max-width:900px){
  .bookings-page,.loyalty-page{
    padding:calc(var(--rezo-fixed-header-height,112px) + 18px) 14px 40px!important;
  }
  .bookings-shell,.loyalty-shell{gap:15px!important}
  .bookings-hero{padding:20px!important}
  .bookings-count-badge{min-height:88px!important;min-width:0!important}
  .customer-stats{grid-template-columns:1fr 1fr!important}
  .booking-meta{grid-template-columns:1fr 1fr!important}
  .loyalty-shell{grid-template-columns:1fr!important}
  .loyalty-card{order:-1}
}

@media(max-width:620px){
  .bookings-page,.loyalty-page{padding-inline:10px!important}
  .bookings-card,.loyalty-shell .panel,.loyalty-card,#host>.empty{border-radius:24px!important}
  .bookings-card,.stats-card,.bookings-card#area,.loyalty-shell .panel{padding:18px!important}
  .bookings-hero h1{font-size:28px!important}
  .bookings-hero p{font-size:13.5px!important}
  .bookings-login{padding:8px!important;border-radius:18px!important}
  .customer-stats,.booking-meta{grid-template-columns:1fr!important}
  .customer-stat{min-height:102px!important;border-radius:19px!important}
  .booking-card{padding:16px!important;border-radius:21px!important}
  .booking-top{display:grid!important}
  .primary,.ghost,.bookings-login input,.actions .btn{width:100%!important}
  .loyalty-card{padding:19px!important}
  .loyalty-card .customer-name{font-size:26px!important}
  .loyalty-card .stats{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:6px!important}
  .loyalty-card .stat{padding:10px 7px!important;text-align:center!important}
  .loyalty-card .stat small{font-size:10px!important;line-height:1.45!important}
  .loyalty-card .stat b{font-size:16px!important;line-height:1.45!important}
  .loyalty-card .barcode-wrap{grid-template-columns:1fr!important}
  .loyalty-card .qr{margin:auto!important}
  .loyalty-card .pin strong{font-size:32px!important}
  #host>.empty{padding:21px!important}
}

@media(max-width:390px){
  .loyalty-card .stats{grid-template-columns:1fr!important}
  .loyalty-card .stat{text-align:right!important}
}