/* Recivo 2.0.4.6 RC6 - canonical customer visual layer with independent views and scanner lifecycle repair.
   Purpose: one final design-token layer matching the approved wireframe without changing business logic. */
:root{
  color-scheme:light;
  --r-bg:#F8FAFC;--r-surface:#FFFFFF;--r-surface-2:#F2F7F6;--r-brand-soft:#E8F7F4;
  --r-brand:#0F5F59;--r-brand-strong:#0A4D48;--r-accent:#2EC4B6;
  --r-text:#1F2937;--r-muted:#6B7280;--r-border:#DDE7E5;--r-danger:#B42318;--r-warning:#A16207;
  --r-shadow:0 10px 28px rgba(31,41,55,.065);--r-shadow-float:0 18px 52px rgba(31,41,55,.14);
  --wire-brand:var(--r-brand);--wire-brand-soft:var(--r-brand-soft);--wire-ink:var(--r-text);--wire-muted:var(--r-muted);--wire-border:var(--r-border);--wire-surface:var(--r-bg);--wire-card:var(--r-surface);
  --bg:var(--r-bg);--bg2:var(--r-bg);--panel:var(--r-surface);--panel2:var(--r-surface-2);--ink:var(--r-text);--muted:var(--r-muted);--jade:var(--r-brand);--jade2:var(--r-brand);--jade-soft:var(--r-brand-soft);--line:var(--r-border);--danger:var(--r-danger);
}
:root[data-theme="dark"]{
  color-scheme:dark;
  --r-bg:#0F171A;--r-surface:#152126;--r-surface-2:#1B2A30;--r-brand-soft:#183B39;
  --r-brand:#6EE4CF;--r-brand-strong:#8CECD9;--r-accent:#2EC4B6;
  --r-text:#F8FAFC;--r-muted:#AAB4C0;--r-border:#2A3A40;--r-danger:#F48B7E;--r-warning:#F2C46D;
  --r-shadow:0 12px 30px rgba(0,0,0,.22);--r-shadow-float:0 22px 60px rgba(0,0,0,.36);
  --wire-brand:var(--r-brand);--wire-brand-soft:var(--r-brand-soft);--wire-ink:var(--r-text);--wire-muted:var(--r-muted);--wire-border:var(--r-border);--wire-surface:var(--r-bg);--wire-card:var(--r-surface);
  --bg:var(--r-bg);--bg2:var(--r-bg);--panel:var(--r-surface);--panel2:var(--r-surface-2);--ink:var(--r-text);--muted:var(--r-muted);--jade:var(--r-brand);--jade2:var(--r-brand);--jade-soft:var(--r-brand-soft);--line:var(--r-border);--danger:var(--r-danger);
}
@media(prefers-color-scheme:dark){:root[data-theme="system"]{
  color-scheme:dark;
  --r-bg:#0F171A;--r-surface:#152126;--r-surface-2:#1B2A30;--r-brand-soft:#183B39;
  --r-brand:#6EE4CF;--r-brand-strong:#8CECD9;--r-accent:#2EC4B6;--r-text:#F8FAFC;--r-muted:#AAB4C0;--r-border:#2A3A40;--r-danger:#F48B7E;--r-warning:#F2C46D;
  --wire-brand:var(--r-brand);--wire-brand-soft:var(--r-brand-soft);--wire-ink:var(--r-text);--wire-muted:var(--r-muted);--wire-border:var(--r-border);--wire-surface:var(--r-bg);--wire-card:var(--r-surface);
  --bg:var(--r-bg);--bg2:var(--r-bg);--panel:var(--r-surface);--panel2:var(--r-surface-2);--ink:var(--r-text);--muted:var(--r-muted);--jade:var(--r-brand);--jade2:var(--r-brand);--jade-soft:var(--r-brand-soft);--line:var(--r-border);--danger:var(--r-danger);
}}
html,body{background:var(--r-bg)!important;color:var(--r-text)!important}
body{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;background-image:none!important}
.topbar{background:color-mix(in srgb,var(--r-surface) 96%,transparent)!important;color:var(--r-text)!important;border-bottom:1px solid var(--r-border)!important;box-shadow:none!important;backdrop-filter:blur(16px)}
.recivo-brand,.topbar .brand{color:var(--r-text)!important;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;font-weight:850!important;letter-spacing:-.045em!important}
.topbar .ghost,.app-menu-toggle{background:var(--r-surface)!important;color:var(--r-text)!important;border:1px solid var(--r-border)!important;box-shadow:none!important}
.panel,.metric-card,.points-card,.offer-card,.receipt-accordion,.modal-card,.secondary-details{background:var(--r-surface)!important;color:var(--r-text)!important;border-color:var(--r-border)!important;box-shadow:none!important}
.panel h1,.panel h2,.panel h3,.home-hero h1,.receipt-head h2{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;color:var(--r-text)!important}
.eyebrow{color:var(--r-brand)!important}
.muted,.optional,.microcopy{color:var(--r-muted)!important}
input,select,textarea{background:var(--r-surface)!important;color:var(--r-text)!important;border-color:var(--r-border)!important}
input:focus,select:focus,textarea:focus{border-color:var(--r-brand)!important;box-shadow:0 0 0 3px color-mix(in srgb,var(--r-brand) 17%,transparent)!important}
button{background:var(--r-brand)!important;color:#fff!important;box-shadow:none!important}
button.secondary{background:var(--r-surface-2)!important;color:var(--r-text)!important;border:1px solid var(--r-border)!important}
button.ghost{background:transparent!important;color:var(--r-text)!important;border:1px solid var(--r-border)!important}
button.danger{background:var(--r-danger)!important;color:#fff!important}
.notice{background:color-mix(in srgb,var(--r-warning) 13%,var(--r-surface))!important;color:var(--r-text)!important;border:1px solid color-mix(in srgb,var(--r-warning) 34%,var(--r-border))!important}
/* Home: match approved wireframe hierarchy. */
#tab-home{max-width:580px;margin:0 auto}
.wire-home-head{padding:10px 2px 14px!important}.wire-home-head h1{color:var(--r-text)!important}.wire-home-head p{color:var(--r-muted)!important}
.wire-quick-grid{gap:10px!important;margin-bottom:12px!important}.wire-quick-grid button{min-height:92px!important;border-radius:16px!important;background:var(--r-brand-soft)!important;color:var(--r-brand)!important;border:1px solid transparent!important}.wire-quick-grid button.secondary{background:color-mix(in srgb,var(--r-brand-soft) 72%,var(--r-surface))!important;color:var(--r-brand)!important;border-color:transparent!important}.wire-quick-grid strong{font-size:15px!important}
.purchase-insight-panel{padding:14px!important;border-radius:17px!important;background:var(--r-surface)!important;border:1px solid var(--r-border)!important;margin-bottom:10px!important}.purchase-insight-grid{gap:8px!important}.compact-insight{padding:12px!important;border-radius:14px!important;background:var(--r-brand-soft)!important;border:1px solid color-mix(in srgb,var(--r-brand) 9%,var(--r-border))!important}.compact-insight span,.compact-insight small{color:var(--r-muted)!important}.compact-insight strong{color:var(--r-text)!important}
.recent-purchases-panel{background:transparent!important;border:0!important;padding:8px 2px!important}.wire-home-purchase{color:var(--r-text)!important;border-bottom-color:var(--r-border)!important}.wire-home-purchase:hover{background:var(--r-surface-2)!important}.merchant-mark{background:var(--r-brand-soft)!important;color:var(--r-brand)!important}
.text-action{background:transparent!important;color:var(--r-brand)!important;border:0!important;padding:5px!important;min-height:auto!important}
#homeAttentionPanel{background:var(--r-surface)!important;border:1px solid var(--r-border)!important}
.attention-row{color:var(--r-text)!important;border-bottom-color:var(--r-border)!important}
/* Purchases */
#tab-purchases{max-width:720px;margin:0 auto}.purchases-primary-panel{background:transparent!important;border:0!important;padding:8px 0!important}.purchase-title-row h1{color:var(--r-text)!important}
.purchase-search-wire,.wire-month-row input,.wire-calendar-btn,.wire-filter-row button{background:var(--r-surface)!important;border-color:var(--r-border)!important;color:var(--r-text)!important}.wire-filter-row button{color:var(--r-muted)!important}.wire-filter-row button.active-filter{background:var(--r-brand)!important;color:#fff!important;border-color:var(--r-brand)!important}.wire-receipt-list{background:var(--r-surface)!important;border-color:var(--r-border)!important}.receipt-date-group>h3{background:var(--r-surface-2)!important;color:var(--r-muted)!important;border-color:var(--r-border)!important}.receipt-card,.wire-receipt-row .receipt-summary{background:var(--r-surface)!important;color:var(--r-text)!important;border-color:var(--r-border)!important}.receipt-card strong,.wire-receipt-copy strong{color:var(--r-text)!important}.receipt-card small,.wire-receipt-copy small{color:var(--r-muted)!important}.receipt-inline-detail{background:var(--r-surface-2)!important;border-color:var(--r-border)!important}
/* Scan + pass: fit compact phones without clipping. */
.wire-scan-shell{max-width:520px!important;margin:0 auto 10px!important}.wire-scan-head h1{color:var(--r-text)!important}.scan-back,.scan-help{color:var(--r-text)!important}.scan-help{border-color:var(--r-border)!important}.wire-scan-modes{background:var(--r-surface-2)!important;border:1px solid var(--r-border)!important;gap:4px!important}.wire-scan-modes button{background:transparent!important;color:var(--r-muted)!important}.wire-scan-modes button.active{background:var(--r-surface)!important;color:var(--r-brand)!important;box-shadow:0 1px 4px rgba(31,41,55,.08)!important}.wire-camera-frame{height:clamp(280px,50dvh,500px)!important;background:#111820!important;border:1px solid var(--r-border)!important}.wire-camera-frame .scanner-box{background:#111820!important}.wire-scanner-state{background:rgba(15,23,26,.82)!important}.scan-corners{background:linear-gradient(var(--r-accent),var(--r-accent)) left top/34px 3px no-repeat,linear-gradient(var(--r-accent),var(--r-accent)) left top/3px 34px no-repeat,linear-gradient(var(--r-accent),var(--r-accent)) right top/34px 3px no-repeat,linear-gradient(var(--r-accent),var(--r-accent)) right top/3px 34px no-repeat,linear-gradient(var(--r-accent),var(--r-accent)) left bottom/34px 3px no-repeat,linear-gradient(var(--r-accent),var(--r-accent)) left bottom/3px 34px no-repeat,linear-gradient(var(--r-accent),var(--r-accent)) right bottom/34px 3px no-repeat,linear-gradient(var(--r-accent),var(--r-accent)) right bottom/3px 34px no-repeat!important}.wire-camera-trigger{background:var(--r-surface)!important;border-color:var(--r-text)!important;box-shadow:0 0 0 4px var(--r-surface)!important}.wire-scan-foot{color:var(--r-muted)!important}
.pass-card{width:min(100%,440px)!important;max-height:calc(100dvh - 170px)!important;overflow:auto!important;padding:16px!important;background:var(--r-surface)!important;border-color:var(--r-border)!important}.pass-card .notice{display:none!important}.pass-qr{width:min(70vw,40dvh,290px)!important;min-width:0!important;min-height:0!important;aspect-ratio:1/1!important;background:#fff!important;padding:10px!important;border-radius:18px!important}.pass-qr img,.pass-qr canvas{width:100%!important;height:100%!important;object-fit:contain!important}
/* Bottom nav */
.customer-primary-nav{background:color-mix(in srgb,var(--r-surface) 96%,transparent)!important;border-color:var(--r-border)!important;box-shadow:0 12px 30px rgba(31,41,55,.14)!important}.customer-primary-nav button{background:transparent!important;color:var(--r-muted)!important}.customer-primary-nav button.active{background:transparent!important;color:var(--r-brand)!important}.customer-primary-nav button[data-tab="scan"] .nav-glyph{background:#374151!important;color:#fff!important}.customer-primary-nav button[data-tab="scan"].active .nav-glyph{background:var(--r-brand)!important}
/* Drawer */
.app-drawer{background:var(--r-surface)!important;color:var(--r-text)!important;border-color:var(--r-border)!important}.drawer-head,.drawer-profile{border-color:var(--r-border)!important}.drawer-head strong,.drawer-icon{color:var(--r-text)!important}.drawer-section>small,.drawer-section button em,.drawer-profile span{color:var(--r-muted)!important}.drawer-section button{background:transparent!important;color:var(--r-text)!important}.drawer-section button:hover,.drawer-section button.active{background:var(--r-surface-2)!important;color:var(--r-brand)!important}.drawer-theme-control{background:var(--r-surface-2)!important;border-color:var(--r-border)!important}.drawer-theme-control button.active{background:var(--r-surface)!important;color:var(--r-brand)!important}.drawer-count{background:var(--r-brand)!important}
/* Secondary/detail screens */
.offer-card,.saved-card-tile,.match-card,.warranty-card,.notification-card,.business-row,.activity-row,.catalog-card{background:var(--r-surface)!important;color:var(--r-text)!important;border-color:var(--r-border)!important}.chip,.source-badge.verified,.beta-pill,.beta-inline{background:var(--r-brand-soft)!important;color:var(--r-brand)!important}.points-inline,.points-earned,.points-positive,.benefit{color:var(--r-brand)!important}.notification-card.unread{border-left:3px solid var(--r-accent)!important}.modal{background:rgba(15,23,26,.48)!important}.modal-card{box-shadow:var(--r-shadow-float)!important}
/* Compact handset tuning (Honor X9d / Fold outer class). */
@media(max-width:390px){
  main{padding-left:10px!important;padding-right:10px!important}.topbar{padding-left:10px!important;padding-right:10px!important}.recivo-brand{font-size:23px!important}.brand-mark{width:29px!important;height:29px!important}
  .wire-quick-grid button{min-height:84px!important;padding:12px 8px!important}.purchase-insight-panel{padding:11px!important}.compact-insight{padding:10px!important}.compact-insight strong{font-size:19px!important}.wire-home-head h1{font-size:29px!important}
  .wire-scan-head{height:46px!important}.wire-scan-modes button{font-size:10.5px!important;padding:5px 2px!important}.wire-camera-frame{height:clamp(250px,45dvh,390px)!important}.wire-scanner-state{left:7px!important;right:7px!important;bottom:7px!important}.wire-camera-trigger{width:56px!important;height:56px!important;margin:9px auto 5px!important}.wire-camera-trigger span{width:42px!important;height:42px!important}.pass-card{max-height:calc(100dvh - 155px)!important;margin:8px auto!important;padding:12px!important}.pass-qr{width:min(72vw,36dvh,245px)!important}
  .customer-primary-nav{left:8px!important;right:8px!important;bottom:calc(7px + env(safe-area-inset-bottom))!important;padding:6px!important}.customer-primary-nav button{font-size:9.5px!important;padding-left:2px!important;padding-right:2px!important}
}
/* Fold/tablet inner screen: keep content focused instead of stretching edge-to-edge. */
@media(min-width:760px){#tab-home{max-width:680px}.wire-scan-shell{max-width:600px}.pass-card{max-width:540px}.pass-qr{width:min(42vw,44dvh,340px)!important}}
@media(min-width:1100px){#tab-home{max-width:720px}.purchases-primary-panel{max-width:800px;margin:auto}.wire-scan-shell{max-width:620px}}

/* Latest navigation decision: Rewards/Vouchers are Home shortcuts; bottom nav stays focused on Home, Purchases and Scan. */
.rc5-home-shortcuts{grid-template-columns:repeat(2,1fr)!important;gap:8px!important;margin:0 0 12px!important}.rc5-home-shortcuts button{min-height:66px!important;border:1px solid var(--r-border)!important;border-radius:14px!important;background:var(--r-surface)!important;color:var(--r-text)!important;box-shadow:none!important}.rc5-home-shortcuts button>span{color:var(--r-brand)!important}.rc5-home-shortcuts small{color:var(--r-text)!important;font-weight:750!important}.customer-primary-nav button[data-tab="scan"]>span:last-child{display:none!important}
@media(max-width:760px){.customer-primary-nav{grid-template-columns:repeat(3,1fr)!important}.customer-primary-nav button[data-tab="scan"] .nav-glyph{margin-top:-14px!important}.rc5-home-shortcuts{grid-template-columns:repeat(2,1fr)!important}}

/* RC6 structural navigation + scanner lifecycle correction */
.customer-primary-nav{align-items:center!important}
.customer-primary-nav button{align-self:stretch!important;transform:none!important}
.customer-primary-nav button[data-tab="scan"]{transform:none!important;top:auto!important}
.customer-primary-nav button[data-tab="scan"] .nav-glyph{margin-top:0!important;transform:none!important;width:38px!important;height:38px!important;box-shadow:none!important}
@media(max-width:760px){
  .customer-primary-nav{grid-template-columns:repeat(3,1fr)!important;align-items:center!important;min-height:64px!important}
  .customer-primary-nav button{min-height:52px!important;align-content:center!important}
  .customer-primary-nav button[data-tab="scan"] .nav-glyph{margin-top:0!important}
}
.wire-camera-trigger{display:none!important}
.wire-scanner-state{justify-content:center!important;min-height:42px!important}
.wire-scanner-state small{display:block!important;text-align:center!important;width:100%!important}
.receipt-offer-stage{max-width:760px!important;margin:0 auto!important}
.receipt-offer-stage .external-coupon-scan{margin-top:0!important}
#tab-warranty,#tab-vouchers,#tab-rewards,#tab-notifications,#tab-account,#tab-preferences,#tab-appearance,#tab-household,#tab-pay{max-width:760px;margin:0 auto}
.compact-section-intro{padding:14px 16px!important;margin-bottom:12px!important}.compact-section-intro h1{margin:0 0 4px!important}.compact-section-intro p{margin:0!important}
.appearance-theme-control{max-width:420px;margin-top:16px}
.notification-page{max-height:none!important;overflow:visible!important}
#tab-vouchers .rewards-owned-panel,#tab-vouchers #savedCouponsPanel{margin-top:12px!important}
#tab-rewards .rewards-points-details{margin-top:12px!important}
#tab-account>.panel,#tab-preferences>.panel,#tab-household>.panel,#tab-appearance>.panel,#tab-warranty>.panel,#tab-notifications>.panel{margin-bottom:12px!important}

/* RC7 controlled drawer backdrop repair. The backdrop is a <button>; override the global themed button fill. */
.drawer-backdrop{background:rgba(7,16,13,.56)!important;color:transparent!important;border:0!important;box-shadow:none!important;filter:none!important}
:root[data-theme="light"] .drawer-backdrop{background:rgba(31,41,55,.34)!important}
@media(prefers-color-scheme:light){:root[data-theme="system"] .drawer-backdrop{background:rgba(31,41,55,.34)!important}}

/* RC8 quick customer navigation fix: Rewards / Offers / Vouchers stay together on Home. */
.rc5-home-shortcuts{grid-template-columns:repeat(3,1fr)!important}
@media(max-width:760px){.rc5-home-shortcuts{grid-template-columns:repeat(3,1fr)!important}}

/* RC18 physical-mobile visibility repair.
   Root cause: the final canonical button rule used !important brand fill/white text.
   Customer Quality cards are <button> elements and theme choices are buttons, so the
   generic rule overrode their intended surface/text colors on physical mobile themes. */
.drawer-theme-control button,
.appearance-theme-control button{
  background:transparent!important;
  color:var(--r-text)!important;
  border:1px solid transparent!important;
  box-shadow:none!important;
}
.drawer-theme-control button.active,
.appearance-theme-control button.active{
  background:var(--r-surface)!important;
  color:var(--r-brand)!important;
  border-color:var(--r-border)!important;
}
.quality-case-card{
  background:var(--r-surface)!important;
  color:var(--r-text)!important;
  border-color:var(--r-border)!important;
  text-align:left!important;
  box-shadow:none!important;
  filter:none!important;
}
.quality-case-card:hover,
.quality-case-card:focus-visible{
  background:var(--r-surface-2)!important;
  color:var(--r-text)!important;
  border-color:var(--r-brand)!important;
  filter:none!important;
}
.quality-case-card.safety{border-left-color:var(--r-danger)!important}
.quality-case-card strong{
  display:block!important;
  color:var(--r-text)!important;
}
.quality-case-card small{
  display:block!important;
  color:var(--r-muted)!important;
  margin-top:2px!important;
}
.quality-case-card p{
  color:var(--r-text)!important;
  margin:9px 0 4px!important;
}
.quality-badge{
  background:var(--r-surface-2)!important;
  color:var(--r-text)!important;
  border:1px solid var(--r-border)!important;
  white-space:nowrap!important;
}
.quality-badge.safety{
  background:color-mix(in srgb,var(--r-danger) 14%,var(--r-surface))!important;
  color:var(--r-danger)!important;
  border-color:color-mix(in srgb,var(--r-danger) 38%,var(--r-border))!important;
}
@media(max-width:760px){
  main{padding-bottom:calc(150px + env(safe-area-inset-bottom))!important}
  .quality-case-card{padding:14px!important}
  .quality-case-card .row{gap:7px!important}
}

/* RC19 auth separation + merchant-referral registration */
.auth-single-shell{
  width:min(1040px,100%);
  margin:4vh auto 0;
  display:grid;
  grid-template-columns:minmax(0,1.05fr) minmax(340px,.95fr);
  gap:24px;
  align-items:start;
}
.auth-brand-panel{min-height:420px;display:flex;flex-direction:column;justify-content:center;background:radial-gradient(circle at 100% 0,var(--r-brand-soft) 0,transparent 48%),var(--r-surface)!important}
.auth-card{max-width:520px;width:100%;justify-self:end}
.auth-card form{margin:0}
.auth-card h2{margin-top:6px}
.auth-primary,.auth-create{width:100%}
.auth-link,.auth-back{
  display:inline-flex!important;
  width:auto!important;
  background:transparent!important;
  color:var(--r-brand)!important;
  border:0!important;
  box-shadow:none!important;
  padding:10px 0!important;
}
.auth-back{margin-bottom:6px!important}
.auth-divider{display:flex;align-items:center;gap:12px;margin:14px 0;color:var(--r-muted)}
.auth-divider::before,.auth-divider::after{content:"";height:1px;background:var(--r-border);flex:1}
.auth-assurance,.referral-context{
  margin-top:22px;padding:14px 16px;border:1px solid var(--r-border);border-radius:14px;background:var(--r-surface-2);display:grid;gap:4px;color:var(--r-text)
}
.referral-context.valid{border-color:var(--r-brand);background:color-mix(in srgb,var(--r-brand) 8%,var(--r-surface))}
.auth-assurance small,.referral-context small,.auth-message{color:var(--r-muted)}
.terms-check{display:flex!important;grid-template-columns:auto 1fr!important;align-items:flex-start;gap:10px!important;font-weight:600!important}
.terms-check input{width:auto!important;margin-top:3px}
.auth-message{min-height:22px;margin:12px 0 0}
@media(max-width:760px){
  .auth-single-shell{grid-template-columns:1fr;margin:12px auto 0;gap:12px}
  .auth-brand-panel{min-height:auto;padding:18px!important}
  .auth-brand-panel h1{font-size:34px!important}
  .auth-card{max-width:none;justify-self:stretch}
}