/* Claymorphism theme. Active only when <html data-ui="clay">; remove the setting value to return to glass. */
html[data-ui="clay"]{color-scheme:light;--bg:#e9e4fb;--ink:#2a2152;--muted:#5b5285;--accent:#5a3bd6;--line:rgba(110,90,190,.16);--glass:#f6f3ff;--radius:28px;--clay-raised:12px 14px 28px rgba(110,90,190,.26),inset -7px -7px 14px rgba(120,95,200,.15),inset 7px 7px 14px #fff;--clay-soft:6px 8px 16px rgba(110,90,190,.22),inset -4px -4px 8px rgba(120,95,200,.14),inset 4px 4px 8px #fff;--clay-pressed:inset 4px 4px 9px rgba(110,90,190,.2),inset -4px -4px 9px #fff;background:#e9e4fb;color:var(--ink)}
html[data-ui="clay"] body{background:#e9e4fb!important;color:var(--ink)}
html[data-ui="clay"] .background-film,html[data-ui="clay"] #atmosphere{display:none!important}
/* Every text colour from the dark theme gives way, so nothing light sits on the light surfaces. */
html[data-ui="clay"] #app *,html[data-ui="clay"] #modal *{color:var(--ink)}
html[data-ui="clay"] #app :is(small,.consent,th,.eyebrow,.nav-caption,.footer,.breadcrumb,.hero p,.auth p,.stat-footer span,.card-small,.exchange span,.page-title p),html[data-ui="clay"] #modal :is(small,.consent,th){color:var(--muted)!important}
html[data-ui="clay"] #app :is(.sidebar,.topbar,.panel,.stat,.hero,.document-card,.setting-card,.auth-copy,.auth-art,.demo-banner,.receipt-tab,.glass-card),html[data-ui="clay"] dialog{background:#f6f3ff!important;border:0!important;border-radius:28px;box-shadow:var(--clay-raised)!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
html[data-ui="clay"] dialog::backdrop{background:rgba(70,55,130,.35)}
html[data-ui="clay"] .hero:before{border-color:rgba(109,79,224,.2)}
html[data-ui="clay"] #app :is(.brand-mark,.stat-icon,.icon-button,.quick,.exchange,.custom-list article,.sidebar-note,.profile,.provider-status span,.file-row){background:#efeafe!important;border:0!important;border-radius:20px;box-shadow:var(--clay-soft)!important}
html[data-ui="clay"] #modal :is(.custom-list article,.scan-result,.note,.payout-summary,.payout-net,.settlement-details){background:#efeafe!important;border:0!important;border-radius:20px;box-shadow:var(--clay-pressed)!important}
html[data-ui="clay"] :is(#app,#modal) :is(.button,button.button){background:#ffe3a8!important;color:#4a3300!important;border:0!important;border-radius:20px;min-height:44px;box-shadow:6px 8px 16px rgba(190,140,50,.3),inset -4px -4px 8px rgba(170,110,20,.24),inset 4px 4px 8px rgba(255,255,255,.7)!important;filter:none!important}
html[data-ui="clay"] :is(#app,#modal) :is(.button.dark,.button:not(.secondary):not(.small)){background:#6d4fe0!important;color:#fff!important;box-shadow:6px 8px 16px rgba(90,60,200,.4),inset -4px -4px 8px rgba(40,10,130,.35),inset 4px 4px 8px rgba(255,255,255,.35)!important}
html[data-ui="clay"] :is(#app,#modal) :is(.button.dark,.button:not(.secondary):not(.small)) *{color:#fff!important}
html[data-ui="clay"] :is(#app,#modal) .button.secondary *,html[data-ui="clay"] :is(#app,#modal) .button.small *{color:#4a3300!important}
html[data-ui="clay"] #app .sidebar .nav-item{background:none;border:0;border-radius:18px;box-shadow:none}
html[data-ui="clay"] #app .sidebar .nav-item:hover{background:#efeafe}
html[data-ui="clay"] #app .sidebar .nav-item.active{background:#6d4fe0!important;color:#fff!important;box-shadow:6px 8px 14px rgba(90,60,200,.35),inset 3px 3px 6px rgba(255,255,255,.3)!important}
html[data-ui="clay"] #app .sidebar .nav-item.active *{color:#fff!important}
html[data-ui="clay"] :is(#app,#modal) :is(input,select,textarea){background:#efeafe!important;color:var(--ink)!important;border:0!important;border-radius:16px;box-shadow:var(--clay-pressed)!important}
html[data-ui="clay"] :is(#app,#modal) :is(input,textarea)::placeholder{color:var(--muted)}
html[data-ui="clay"] :is(#app,#modal) :is(table,tr,td,th){border-color:var(--line)!important;background:transparent}
html[data-ui="clay"] :is(#app,#modal) .upload-box{background:#efeafe!important;border:2px dashed rgba(109,79,224,.4)!important;border-radius:20px;box-shadow:none!important}
html[data-ui="clay"] :is(#app,#modal) .badge{backdrop-filter:none;-webkit-backdrop-filter:none;border:0!important;font-weight:700}
html[data-ui="clay"] :is(#app,#modal) .badge.pending_accept,html[data-ui="clay"] :is(#app,#modal) .badge.in_process{background:#ffe9ae!important;color:#5b4200!important}
html[data-ui="clay"] :is(#app,#modal) .badge.at_office{background:#cfe0ff!important;color:#143a80!important}
html[data-ui="clay"] :is(#app,#modal) .badge.claimed{background:#ffd6b3!important;color:#6e3300!important}
html[data-ui="clay"] :is(#app,#modal) .badge.completed{background:#c7f3da!important;color:#0d5230!important}
html[data-ui="clay"] :is(#app,#modal) .badge.rejected,html[data-ui="clay"] :is(#app,#modal) .badge.cancelled{background:#ffd2d2!important;color:#7a1414!important}
html[data-ui="clay"] :is(#app,#modal) .badge.reversed{background:#e3e1ec!important;color:#3c3952!important}
html[data-ui="clay"] #modal .timeline .stage{backdrop-filter:none;-webkit-backdrop-filter:none}
html[data-ui="clay"] #modal .timeline .stage i{background:#e3ddf8;color:var(--muted)}
html[data-ui="clay"] #modal .timeline .stage.done i{background:#7fdcae;color:#07391f}
html[data-ui="clay"] #modal .timeline .stage.current i{background:#6d4fe0;color:#fff;box-shadow:inset 2px 2px 4px rgba(255,255,255,.4)}
html[data-ui="clay"] .bar{background:#6d4fe0}html[data-ui="clay"] .bar.soft{background:#c9bdf3}
html[data-ui="clay"] #toast{background:#2a2152;color:#fff;border-radius:18px}
html[data-ui="clay"] .boot,html[data-ui="clay"] .boot p{color:var(--ink);background:#e9e4fb}
@media (prefers-reduced-motion:reduce){html[data-ui="clay"] .hero:before{animation:none}}
