/* VIOLA gold theme — independent visual layer v9.7.2 */
:root{
  color-scheme:dark;
  --viola-page:#060503;
  --viola-surface:rgba(9,7,4,.92);
  --viola-surface-2:rgba(16,12,6,.94);
  --viola-surface-3:rgba(30,21,8,.78);
  --viola-text:#fff2cf;
  --viola-muted:rgba(255,242,207,.66);
  --viola-accent:#e9bc55;
  --viola-accent-2:#fff0bd;
  --viola-line:rgba(233,188,85,.42);
  --viola-line-strong:#f4cf78;
  --viola-button:linear-gradient(180deg,#50340f 0%,#241605 100%);
    --viola-button-text:#ffe2a0;
  --viola-danger:#d84d4d;
  --viola-shadow:rgba(0,0,0,.58);
  --viola-glow:rgba(233,188,85,.24);
  --bg:var(--viola-page);
  --panel:var(--viola-surface);
  --panel2:var(--viola-surface-2);
  --text:var(--viola-text);
  --muted:var(--viola-muted);
  --line:var(--viola-line);
  --line2:var(--viola-line-strong);
  --gold:var(--viola-accent);
  --gold2:var(--viola-accent-2);
  --gold3:var(--viola-accent);
  --cream:var(--viola-text);
  --shadow:var(--viola-shadow);
  --setup-page-bg:var(--viola-page);
  --setup-surface:var(--viola-surface);
  --setup-surface-strong:var(--viola-surface-2);
  --setup-surface-soft:var(--viola-surface-3);
  --setup-line:var(--viola-line);
  --setup-line-soft:var(--viola-line);
  --setup-line-strong:var(--viola-line-strong);
  --setup-accent:var(--viola-accent);
  --setup-accent-2:var(--viola-accent-2);
  --setup-text:var(--viola-text);
  --setup-muted:var(--viola-muted);
  --setup-button-bg:var(--viola-button);
  --setup-button-text:var(--viola-button-text);
  --setup-shadow:0 28px 84px var(--viola-shadow);
}
html,body{background:var(--viola-page)!important;color:var(--viola-text)!important}
body{color-scheme:dark!important}
.bg,.viola-wood-background{
  background-color:var(--viola-page)!important;
  background-image:url("./background.webp?v=9.8.50")!important;
  background-position:center!important;
  background-size:100% 100%!important;
  background-repeat:no-repeat!important;
  background-attachment:fixed!important;
  filter:none!important;
}
body::after{content:none!important}
body>main,body>.app{position:relative;z-index:1}
@media(max-width:900px) and (orientation:portrait){
  .bg,.viola-wood-background{background-image:url("./background-mobile.webp?v=9.8.50")!important}
}
.viola-wood-background::after{background:rgba(0,0,0,0)!important}
.frame{display:none!important}
::selection{background:var(--viola-accent)!important;color:var(--viola-button-text)!important}
*{scrollbar-color:var(--viola-line-strong) transparent}

/* surfaces */
.panel,.card,.auth.panel,.home.panel,.terms-shell,.terms-card,.result,.invalid-invite,
.nav-item,.quick-card,.stat,.row,.table-card,.menu-category-card,.menu-item-row,
.setting-switch,.theme-choice,.side-note,.menu-section,.featured,.item,.featured-card,.cat-btn,.guest,
.cart-line,.cart-sheet,.share-card,.join-request-review,.join-request-summary>div,.check-card,
.editor-card,.editor-panel{
  color:var(--viola-text)!important;
  background:var(--viola-surface)!important;
  border-color:var(--viola-line)!important;
  box-shadow:0 18px 56px var(--viola-shadow),inset 0 1px 0 rgba(255,255,255,.035)!important;
}
.sidebar,.owner-top,.client-top,.top{background-color:var(--viola-surface)!important;border-color:var(--viola-line)!important;backdrop-filter:none!important}
.access-screen{background:color-mix(in srgb,var(--viola-surface) 58%,transparent)!important;border-color:var(--viola-line)!important;box-shadow:0 24px 70px var(--viola-shadow)!important}
.access-screen::before{opacity:.72!important}
+.panel,.card,.auth.panel,.home.panel,.terms-shell,.terms-card,.sidebar,.owner-top,.client-top,.top,
.featured,.menu-section,.access-screen,.editor-card,.editor-panel{
  box-shadow:
    0 22px 62px var(--viola-shadow),
    inset 0 1px 0 rgba(255,255,255,.045),
    inset 0 0 0 6px var(--viola-surface),
    inset 0 0 0 7px color-mix(in srgb,var(--viola-line) 48%,transparent)!important;
}
.modal-overlay,.editor-backdrop{background:rgba(0,0,0,.72)!important;backdrop-filter:blur(8px)!important}

/* text */
h1,h2,h3,h4,strong,b,.title-serif,.viola-word,.viola-role-card__title,.panel-title h1,.cart h2,
.section-title,.featured h2,.item h3,.featured-card h3,.nav-copy b,.quick-card b,.stat strong,
.price,.menu-thumb,.editor-head h3{color:var(--viola-text)!important}
p,small,.muted,.top-subtitle,.nav-copy small,.quick-card small,.viola-role-card__text,
.settings-copy,.settings-account,.section-count,.item p,.featured p,.cart-footer p,.eyebrow,
.nav-section-title{color:var(--viola-muted)!important}
.viola-subtitle,.gold-divider,.access-footer b,.brand .eyebrow{color:var(--viola-accent-2)!important}
.gold-divider::before,.gold-divider::after,.access-footer>span,.section-line,.featured-head::after{background:var(--viola-line-strong)!important}

/* controls */
.primary,.waiter-btn,.add,.mobile-cart,.lang button.active,.viola-setup-lang-button.active,
.setting-switch input:checked + .switch-track{
  color:var(--viola-button-text)!important;
  background:var(--viola-button)!important;
  border-color:var(--viola-line-strong)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.12),inset 0 0 0 4px color-mix(in srgb,var(--viola-surface-2) 66%,transparent),inset 0 0 0 5px color-mix(in srgb,var(--viola-line) 32%,transparent),0 12px 30px color-mix(in srgb,var(--viola-shadow) 72%,var(--viola-glow))!important;
}
.primary:hover,.waiter-btn:hover,.add:hover,.mobile-cart:hover{filter:brightness(1.08)!important;border-color:var(--viola-accent-2)!important}
.ghost,.icon-btn,.viola-global-back,.viola-setup-back,.viola-setup-lang-switch,.lang,.table-chip,
.auth .links a,.nav button,.nav a,.badge,.owner-status,.table-status,.table-chip,.theme-choice{
  color:var(--viola-text)!important;
  background:var(--viola-surface-2)!important;
  border-color:var(--viola-line)!important;
}
.ghost:hover,.icon-btn:hover,.viola-global-back:hover,.viola-setup-back:hover,.auth .links a:hover,
.nav button:hover,.nav a:hover,.nav button.active,.nav a.active,.nav-item:hover,.nav-item.active,.quick-card:hover,
.cat-btn:hover,.cat-btn.active,.theme-choice:hover,.theme-choice.is-active{
  color:var(--viola-text)!important;
  background:var(--viola-surface-3)!important;
  border-color:var(--viola-line-strong)!important;
  box-shadow:0 0 0 1px color-mix(in srgb,var(--viola-line-strong) 20%,transparent),0 10px 28px var(--viola-glow)!important;
}
.nav-item.active::before{background:var(--viola-accent)!important;box-shadow:0 0 18px var(--viola-glow)!important}
.nav-ico,.quick-icon,.brand-icon-wrap,.menu-thumb,.item-media{color:var(--viola-accent-2)!important;background:var(--viola-surface-2)!important;border-color:var(--viola-line)!important}
.nav-arrow,.price,.section-count,.table-chip strong,.total strong{color:var(--viola-accent-2)!important}
input,select,textarea{color:var(--viola-text)!important;background:var(--viola-surface-2)!important;border-color:var(--viola-line)!important}
input:focus,select:focus,textarea:focus{border-color:var(--viola-line-strong)!important;box-shadow:0 0 0 3px var(--viola-glow)!important;outline:none!important}
::placeholder{color:color-mix(in srgb,var(--viola-muted) 72%,transparent)!important}
.danger{background:color-mix(in srgb,var(--viola-danger) 30%,var(--viola-surface-2))!important;border-color:var(--viola-danger)!important;color:var(--viola-text)!important}

/* setup and role cards */
.viola-role-card{color:var(--viola-text)!important;background:var(--viola-surface)!important;border-color:var(--viola-line)!important;box-shadow:0 18px 44px var(--viola-shadow)!important}
.viola-role-card:hover,.viola-role-card:focus-visible{background:var(--viola-surface-3)!important;border-color:var(--viola-line-strong)!important;box-shadow:0 0 0 1px color-mix(in srgb,var(--viola-line-strong) 25%,transparent),0 20px 52px var(--viola-shadow),0 0 24px var(--viola-glow)!important}
.viola-role-card__visual,.viola-owner-hero{background:var(--viola-surface-2)!important;border-color:var(--viola-line)!important}
.viola-role-card__visual::after{border-color:var(--viola-line)!important}
.viola-setup-lang-button{color:var(--viola-muted)!important}

/* client */
.waiter-btn{text-shadow:none!important}
.cat-btn span,.section-count{color:var(--viola-muted)!important}
.cart-head{border-color:var(--viola-line)!important}
.success,.toast{color:var(--viola-button-text)!important;background:var(--viola-button)!important;border-color:var(--viola-line-strong)!important}

/* owner and staff */
.owner-brand,.brand,.head,.cart-head{border-color:var(--viola-line)!important}
.switch-track{background:var(--viola-surface-3)!important;border-color:var(--viola-line)!important}
.setting-switch input:checked + .switch-track span{background:var(--viola-button-text)!important}
.volume-row input[type="range"]{accent-color:var(--viola-accent)!important}
.settings-status{color:var(--viola-accent-2)!important}
.settings-status.is-error{color:var(--viola-danger)!important}

/* notifications and counters */
.viola-notification-toggle,.viola-notification-panel,.viola-notification-alert{color:var(--viola-text)!important;background:var(--viola-surface-2)!important;border-color:var(--viola-line)!important}
.viola-notification-mark{color:var(--viola-button-text)!important;background:var(--viola-button)!important;border-color:var(--viola-line-strong)!important}
.viola-notification-count,.nav-notification-badge{background:var(--viola-danger)!important;color:#fff!important;border-color:color-mix(in srgb,var(--viola-danger) 55%,#fff)!important}
.viola-notification-count[hidden],.nav-notification-badge[hidden]{display:none!important}

/* terms */
.terms-document section,.terms-summary article,.terms-details>div,.terms-columns>div,.terms-steps li,
.terms-price-row,.terms-note,.terms-legal-note,.terms-toc a{color:var(--viola-text)!important;background:var(--viola-surface)!important;border-color:var(--viola-line)!important}
.terms-toc a:hover{background:var(--viola-surface-3)!important;border-color:var(--viola-line-strong)!important}

/* Setup reference: premium black and gold */
.viola-access-page[data-viola-theme="gold"] .access-screen{background:rgba(0,0,0,.12)}
.viola-access-page[data-viola-theme="gold"] .viola-word{color:#e9bd63;text-shadow:0 0 24px rgba(233,189,99,.16)}
.viola-access-page[data-viola-theme="gold"] .viola-subtitle{color:#d8a944}
.viola-access-page[data-viola-theme="gold"] .access-header h1{font-family:var(--setup-font-ui);font-weight:650;color:#f5f1e8}
.viola-access-page[data-viola-theme="gold"] .viola-role-card{min-height:304px;grid-template-rows:150px auto 1fr;border-radius:22px;border-color:rgba(224,173,58,.68);background:rgba(8,7,5,.90);box-shadow:0 24px 56px rgba(0,0,0,.46),inset 0 1px 0 rgba(255,224,150,.05)}
.viola-access-page[data-viola-theme="gold"] .viola-role-card::before{inset:10px;border-radius:17px;border-color:rgba(230,184,78,.16)}
.viola-access-page[data-viola-theme="gold"] .viola-role-card::after{top:auto;bottom:-6px;background:#181006;border-color:#e4b446}
.viola-access-page[data-viola-theme="gold"] .viola-role-card__visual{width:148px;height:148px;border:0;border-radius:24px;border-color:rgba(238,195,92,.64);background:transparent;box-shadow:inset 0 0 0 1px rgba(255,233,177,.05),0 14px 28px rgba(0,0,0,.34)}
.viola-access-page[data-viola-theme="gold"] .viola-role-card__visual::after{display:none}
.viola-access-page[data-viola-theme="gold"] .viola-role-card__icon{width:144px;height:144px;border-radius:22px}
.viola-access-page[data-viola-theme="gold"] .viola-role-card__title{font-family:var(--setup-font-ui);font-weight:600;color:#f3d889}
.viola-access-page[data-viola-theme="gold"] .viola-role-card__text{color:rgba(245,240,224,.72)}
[data-viola-role-icon]{filter:none!important}


/* Gold role images are finished assets: no nested card, clipping or extra frame. */
[data-viola-role-icon],.brand-icon,.role-hero,.viola-role-card__icon{object-fit:contain!important;object-position:center!important;overflow:visible!important;background:transparent!important;border:0!important;box-shadow:none!important;filter:drop-shadow(0 10px 18px rgba(0,0,0,.28))!important}
.brand-icon-wrap,.viola-role-card__visual,.viola-owner-hero{overflow:visible!important}
.owner-page .owner-brand .brand-icon,.staff-role-page .brand-icon,.staff-auth-page .brand-icon{padding:0!important}
