/* Konsilito v2 layer for the PWA: glowing white mark, one gold metal button system (dark theme only) */
@keyframes kvSheen { 0% { left: -70%; } 22% { left: 130%; } 100% { left: 130%; } }
@keyframes kvMark { 0%,100% { filter: drop-shadow(0 0 6px rgba(255,255,255,.85)) drop-shadow(0 0 18px rgba(255,255,255,.35)); } 50% { filter: drop-shadow(0 0 9px #fff) drop-shadow(0 0 28px rgba(255,255,255,.5)); } }

html:not([data-theme="light"]) {
    --bg-primary: #07070D;
    --accent: #F4C969;
    --accent-hover: #FFE3A3;
    --accent-dim: rgba(244,201,105,.10);
    --accent-glow: rgba(245,166,35,.28);
}

/* logo: white glowing mark, no tile or gold rim */
html body :is(.login-avatar, .splash-logo, .sidebar-brand img) { border-radius: 0 !important; background: none !important; box-shadow: none !important; object-fit: contain; animation: kvMark 4s ease-in-out infinite; }
html body .ga-mark { background: none !important; box-shadow: none !important; border: 0 !important; }
html body .ga-mark::before, html body .ga-mark::after { display: none !important; }

/* login screen: dark with a soft gold glow */
html:not([data-theme="light"]) body #login {
    background: radial-gradient(ellipse 60% 45% at 50% 30%, rgba(245,166,35,.10), transparent 70%), #07070D !important;
}

/* primary: dark base, gold metal rim, glow */
html:not([data-theme="light"]) body :is(.login-btn, .login-btn-tg, .send-btn.active, .kv-btn,
  #settings-page button[style*="background:var(--accent)"], #settings-pane button[style*="background:var(--accent)"],
  [id$="-modal"] button[style*="background:var(--accent)"], #local-computer-block button, #about-block > button) {
    position: relative; overflow: hidden; isolation: isolate;
    color: #FFE3A3 !important; text-shadow: 0 0 10px rgba(255,200,90,.6); font-weight: 600 !important;
    background: linear-gradient(180deg, rgba(255,214,130,.16), rgba(245,166,35,.05)) padding-box,
                linear-gradient(#0D0B10, #0D0B10) padding-box,
                linear-gradient(140deg, #FFF1C1, #F4C969 35%, #B07A16 60%, #FFE6A0) border-box !important;
    border: 1px solid transparent !important; border-radius: 12px !important;
    box-shadow: 0 0 16px rgba(245,166,35,.38), 0 0 40px rgba(245,166,35,.12), inset 0 0 14px rgba(245,166,35,.2) !important;
    transition: transform .2s ease, box-shadow .3s ease, filter .3s ease;
}
html:not([data-theme="light"]) body :is(.login-btn, .login-btn-tg, .kv-btn, #local-computer-block button, #about-block > button):hover {
    transform: translateY(-1px); filter: brightness(1.08);
    box-shadow: 0 0 24px rgba(245,166,35,.6), 0 0 60px rgba(245,166,35,.22), inset 0 0 20px rgba(245,166,35,.32) !important;
}
html:not([data-theme="light"]) body :is(.login-btn, .login-btn-tg, .kv-btn)::after {
    content: ''; position: absolute; top: 0; left: -70%; width: 45%; height: 100%; pointer-events: none;
    background: linear-gradient(105deg, transparent, rgba(255,240,200,.24), transparent); transform: skewX(-20deg);
    animation: kvSheen 4.8s ease-in-out infinite;
}
html:not([data-theme="light"]) body .send-btn.active { color: #FFE3A3 !important; }
html:not([data-theme="light"]) body .send-btn.active svg { stroke: #FFE3A3; }

/* secondary: same shape, thin rim */
html:not([data-theme="light"]) body :is(.st-btn, .ws-btn, .mon-btn:not(.stop), .new-chat-btn) {
    border-radius: 12px !important; color: #F6D88A !important;
    background: linear-gradient(#0C0B12, #0C0B12) padding-box, linear-gradient(140deg, rgba(255,241,193,.7), rgba(200,144,31,.55) 45%, rgba(138,90,14,.5) 55%, rgba(255,230,160,.7)) border-box !important;
    border: 1px solid transparent !important; box-shadow: 0 0 10px rgba(245,166,35,.12) !important;
}

/* selected tabs and pills: glass with gold rim, never flat orange */
html:not([data-theme="light"]) body :is(.auth-tab.active, .tier-tab.active, .st-item.active) {
    background: rgba(245,166,35,.08) !important; color: #FFE3A3 !important;
    box-shadow: inset 0 0 0 1px rgba(244,201,105,.45), 0 0 12px rgba(245,166,35,.15) !important;
}

/* cards: dark glass */
html:not([data-theme="light"]) body :is(.billing-limits, .login-card) {
    background: rgba(14,13,20,.72) !important; border: 1px solid rgba(244,201,105,.14) !important;
}

/* stop agent: red rim */
html body :is(.mon-btn.stop, #stop-agent-btn) { color: #FFD7D7 !important; border: 1px solid rgba(240,82,79,.55) !important; background: rgba(60,12,14,.55) !important; box-shadow: 0 0 14px rgba(240,82,79,.25) !important; border-radius: 12px !important; }

@media (prefers-reduced-motion: reduce) {
    html body :is(.login-avatar, .splash-logo, .sidebar-brand img), html body :is(.login-btn, .login-btn-tg, .kv-btn)::after { animation: none !important; }
}

/* header: top-up as a small metal button, chat mark glows white */
html:not([data-theme="light"]) body .hdr-topup {
    color: #FFE3A3 !important; font-weight: 600; border-radius: 8px !important;
    background: linear-gradient(180deg, rgba(255,214,130,.16), rgba(245,166,35,.05)) padding-box,
                linear-gradient(#0D0B10, #0D0B10) padding-box,
                linear-gradient(140deg, #FFF1C1, #F4C969 35%, #B07A16 60%, #FFE6A0) border-box !important;
    border: 1px solid transparent !important; box-shadow: 0 0 10px rgba(245,166,35,.3) !important;
}
html body .chat-header-avatar { border-radius: 0 !important; background: none !important; box-shadow: none !important; object-fit: contain; animation: kvMark 4s ease-in-out infinite; }

/* form fields in settings and modals: dark glass, gold focus */
html:not([data-theme="light"]) body :is(#settings-page, [id$="-modal"]) :is(input[type="text"], input[type="date"], input:not([type]), textarea, select) {
    background: rgba(10,10,16,.85) !important; color: var(--text-primary) !important; color-scheme: dark;
    border: 1px solid rgba(244,201,105,.18) !important; border-radius: 10px !important;
}
html:not([data-theme="light"]) body :is(#settings-page, [id$="-modal"]) :is(input, textarea, select):focus {
    outline: none; border-color: rgba(244,201,105,.55) !important; box-shadow: 0 0 0 3px rgba(245,166,35,.12) !important;
}

/* line icons (icons.js) */
.kv-ico { width: 1.15em; height: 1.15em; flex-shrink: 0; vertical-align: -.2em; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.billing-limits-title .kv-ico { margin-right: .5em; }
:is(.st-item, .integ-group > summary) > span:first-child { display: inline-flex; color: var(--accent); }
:is(.st-item, .integ-group > summary) > span:first-child .kv-ico { width: 18px; height: 18px; }
.cap-card > div:first-child .kv-ico { width: 22px; height: 22px; color: var(--accent); }
html:not([data-theme="light"]) body :is(.st-item > span:first-child, .integ-group > summary > span:first-child, .billing-limits-title, .cap-card > div:first-child) .kv-ico { filter: drop-shadow(0 0 4px rgba(245,166,35,.55)); }
.st-item.active > span:first-child .kv-ico { filter: drop-shadow(0 0 7px rgba(245,166,35,.85)); }
#kv .kv-card-ico .kv-ico { width: 56px; height: 56px; stroke-width: 1.3; color: var(--accent); }
