/* VoicerInn Windows | Sistema de temas de interface completo | 2026-10-12
   Exclusivo C# + WebView2. Carregado APÓS todos os CSS existentes.
   Tokens para fundo, painéis, modais, formulários, botões e componentes.
   NÃO redefine cores de status, badges especiais, cosméticos nem efeitos de usuários.
*/
body {
  --ui-primary:var(--accent-a,#20d5ff);
  --ui-primary-ink:#06121b;
  --ui-shadow:rgba(0,0,0,.32);
  --ui-selection:color-mix(in srgb,var(--accent-a) 17%,var(--ui-raised));
  --ui-selection-border:color-mix(in srgb,var(--accent-a) 58%,var(--ui-border));
  --ui-hover:color-mix(in srgb,var(--accent-a) 9%,var(--ui-raised));
  --ui-focus:color-mix(in srgb,var(--accent-a) 80%,white);
  --ui-background-aura:color-mix(in srgb,var(--accent-a) 7%,transparent);
  --ui-background-aura-secondary:color-mix(in srgb,var(--accent-b) 5%,transparent);
  --ui-modal-overlay:rgba(0,0,0,.66);
}
body[data-theme-mode="dark"][data-palette="aurora"]{--ui-bg:#090b18;--ui-sidebar:#0e1225;--ui-main:#0b1020;--ui-panel:#11172b;--ui-raised:#171f35;--ui-field:#111a2c;--ui-border:#263350;--ui-border-strong:#314162;--ui-text:#e9eeff;--ui-muted:#a8b4d0;--ui-caption:#8191b1;}
body[data-theme-mode="dark"][data-palette="ocean"]{--ui-bg:#06121b;--ui-sidebar:#091e2b;--ui-main:#071823;--ui-panel:#0d2734;--ui-raised:#123342;--ui-field:#0b2735;--ui-border:#224758;--ui-border-strong:#336577;--ui-text:#e3f7fc;--ui-muted:#a2c7d1;--ui-caption:#7ea6b4;}
body[data-theme-mode="dark"][data-palette="emerald"]{--ui-bg:#071510;--ui-sidebar:#0b2119;--ui-main:#091a14;--ui-panel:#102920;--ui-raised:#16372b;--ui-field:#0f2b22;--ui-border:#245342;--ui-border-strong:#33705b;--ui-text:#e6f7ec;--ui-muted:#abcdb9;--ui-caption:#82a995;}
body[data-theme-mode="dark"][data-palette="sunset"]{--ui-bg:#1b100f;--ui-sidebar:#281817;--ui-main:#201411;--ui-panel:#301d1a;--ui-raised:#3a2520;--ui-field:#2d1d1a;--ui-border:#654139;--ui-border-strong:#865747;--ui-text:#fff1e8;--ui-muted:#d9b6a6;--ui-caption:#b79084;}
body[data-theme-mode="dark"][data-palette="rose"]{--ui-bg:#170d1b;--ui-sidebar:#211226;--ui-main:#1c1021;--ui-panel:#291831;--ui-raised:#35203b;--ui-field:#2a1b32;--ui-border:#573a60;--ui-border-strong:#77507d;--ui-text:#f9eafa;--ui-muted:#cdb1d2;--ui-caption:#ab8eaf;}
body[data-theme-mode="dark"][data-palette="ice"]{--ui-bg:#101a24;--ui-sidebar:#162432;--ui-main:#131f2b;--ui-panel:#1b2d3b;--ui-raised:#223748;--ui-field:#1b2c3a;--ui-border:#38556a;--ui-border-strong:#4a7086;--ui-text:#edf7ff;--ui-muted:#b6cadb;--ui-caption:#92aabd;}
body[data-theme-mode="dark"][data-palette="graphite"]{--ui-bg:#121315;--ui-sidebar:#1d1f22;--ui-main:#18191c;--ui-panel:#24272b;--ui-raised:#2d3136;--ui-field:#24282d;--ui-border:#42484e;--ui-border-strong:#5c636a;--ui-text:#f0f2f3;--ui-muted:#bfc5ca;--ui-caption:#979fa8;}
body[data-theme-mode="light"][data-palette="aurora"]{--ui-bg:#f0f2fa;--ui-sidebar:#e8ecf8;--ui-main:#f7f8fd;--ui-panel:#ffffff;--ui-raised:#f2f4fd;--ui-field:#fff;--ui-border:#cbd2e7;--ui-border-strong:#aab6d9;--ui-text:#222940;--ui-muted:#53607b;--ui-caption:#66718a;}
body[data-theme-mode="light"][data-palette="ocean"]{--ui-bg:#ecf8fa;--ui-sidebar:#e3f4f7;--ui-main:#f3fbfc;--ui-panel:#ffffff;--ui-raised:#eaf8fa;--ui-field:#fff;--ui-border:#bbdfe6;--ui-border-strong:#97cedb;--ui-text:#17363e;--ui-muted:#486e78;--ui-caption:#5f858e;}
body[data-theme-mode="light"][data-palette="emerald"]{--ui-bg:#edf7f0;--ui-sidebar:#e4f3e8;--ui-main:#f6fbf6;--ui-panel:#ffffff;--ui-raised:#eaf7ef;--ui-field:#fff;--ui-border:#bfdccc;--ui-border-strong:#8fc3a7;--ui-text:#1a3929;--ui-muted:#507262;--ui-caption:#648676;}
body[data-theme-mode="light"][data-palette="sunset"]{--ui-bg:#fff3eb;--ui-sidebar:#ffeadc;--ui-main:#fff9f5;--ui-panel:#ffffff;--ui-raised:#fff1e7;--ui-field:#fff;--ui-border:#ebccb7;--ui-border-strong:#d9a782;--ui-text:#493024;--ui-muted:#7e5b48;--ui-caption:#9a7664;}
body[data-theme-mode="light"][data-palette="rose"]{--ui-bg:#faf0f9;--ui-sidebar:#f3e8f5;--ui-main:#fdf7fd;--ui-panel:#ffffff;--ui-raised:#f7edf8;--ui-field:#fff;--ui-border:#e2cae8;--ui-border-strong:#c9a5d4;--ui-text:#422849;--ui-muted:#765a7d;--ui-caption:#907097;}
body[data-theme-mode="light"][data-palette="ice"]{--ui-bg:#f1f7fa;--ui-sidebar:#e5f1f7;--ui-main:#f9fcfe;--ui-panel:#ffffff;--ui-raised:#f0f7fa;--ui-field:#fff;--ui-border:#c8dae4;--ui-border-strong:#a4c4d5;--ui-text:#283e4b;--ui-muted:#5a7788;--ui-caption:#708c9d;}
body[data-theme-mode="light"][data-palette="graphite"]{--ui-bg:#f3f4f5;--ui-sidebar:#eceef0;--ui-main:#f8f9fa;--ui-panel:#ffffff;--ui-raised:#f0f1f2;--ui-field:#fff;--ui-border:#d3d7db;--ui-border-strong:#aeb4ba;--ui-text:#24272b;--ui-muted:#636b73;--ui-caption:#7f878e;}

/* Compatibilidade com os nomes de variáveis antigos usados em telas secundárias. */
body[data-theme-mode] {
  --bg:var(--ui-bg);
  --panel:var(--ui-panel);
  --panel2:var(--ui-raised);
  --line:var(--ui-border);
  --text:var(--ui-text);
  --muted:var(--ui-muted);
  --surface:var(--ui-bg);
  --surface-1:var(--ui-sidebar);
  --surface-2:var(--ui-panel);
  --surface-3:var(--ui-raised);
  --surface-glass:var(--ui-panel);
  --text-main:var(--ui-text);
  --text-soft:var(--ui-muted);
  --line-theme:var(--ui-border);
  color:var(--ui-text);
  background:var(--ui-bg);
}
body[data-theme-mode="light"]{--ui-shadow:rgba(17,32,48,.14);--ui-modal-overlay:rgba(25,35,50,.42);color-scheme:light}
body[data-theme-mode="dark"]{color-scheme:dark}
body[data-theme-mode]::after {background:radial-gradient(ellipse at 82% 12%,var(--ui-background-aura),transparent 55%),radial-gradient(ellipse at 6% 94%,var(--ui-background-aura-secondary),transparent 50%)}

/* Shell: todas as regiões estruturais acompanham o tema, não só os destaques. */
body[data-theme-mode] .app {color:var(--ui-text)}
body[data-theme-mode] .sidebar,
body[data-theme-mode] .members-pane{background:var(--ui-sidebar)!important;border-color:var(--ui-border)!important;color:var(--ui-text)}
body[data-theme-mode] .main{background:var(--ui-main)!important;color:var(--ui-text)}
body[data-theme-mode] .topbar,
body[data-theme-mode] .section-head,
body[data-theme-mode] .members-head,
body[data-theme-mode] .friends-mini{background:var(--ui-sidebar)!important;border-color:var(--ui-border)!important}
body[data-theme-mode] .section-head,
body[data-theme-mode] .members-head small,
body[data-theme-mode] .channel-head small,
body[data-theme-mode] .brand span,
body[data-theme-mode] .system,
body[data-theme-mode] .msg-time,
body[data-theme-mode] .member-state,
body[data-theme-mode] .voice-help p{color:var(--ui-caption)}
body[data-theme-mode] .channel,
body[data-theme-mode] .member,
body[data-theme-mode] .people-row{color:var(--ui-muted)}
body[data-theme-mode] .channel:hover,
body[data-theme-mode] .member:hover,
body[data-theme-mode] .people-row:hover,
body[data-theme-mode] .mini:hover{background:var(--ui-hover)!important;color:var(--ui-text)}
body[data-theme-mode] .channel.active,
body[data-theme-mode] .dm-list-panel .channel.active,
body[data-theme-mode] .settings-nav button.active{background:var(--ui-selection)!important;border-color:var(--ui-selection-border)!important;color:var(--ui-text)!important;box-shadow:inset 3px 0 0 var(--ui-primary)}
body[data-theme-mode] .subchannels{border-color:var(--ui-border)}
body[data-theme-mode] .channel .count,
body[data-theme-mode] .members-head span{background:var(--ui-field);border:1px solid var(--ui-border);color:var(--ui-muted)}
body[data-theme-mode] .connection-card,
body[data-theme-mode] .connection-card-v1,
body[data-theme-mode] .media-status-bar,
body[data-theme-mode] .voice-dock,
body[data-theme-mode] .voice-dock.disconnected,
body[data-theme-mode] .voice-member,
body[data-theme-mode] .vi352-panel,
body[data-theme-mode] .hub-panel,
body[data-theme-mode] .hub-card,
body[data-theme-mode] .setting-block,
body[data-theme-mode] .private-room-card,
body[data-theme-mode] .diag-card,
body[data-theme-mode] .file-card,
body[data-theme-mode] .game-card,
body[data-theme-mode] .lb-card,
body[data-theme-mode] .vi363-panel{background:var(--ui-panel)!important;border-color:var(--ui-border)!important;color:var(--ui-text)}
body[data-theme-mode] .hub-card:hover,
body[data-theme-mode] .game-card:hover{background:var(--ui-hover)!important;border-color:var(--ui-selection-border)!important}
body[data-theme-mode] .hub-card small,
body[data-theme-mode] .setting-block-head small{color:var(--ui-muted)}
body[data-theme-mode] .messages{color:var(--ui-text)}
body[data-theme-mode] .msg-body,
body[data-theme-mode] .msg-name:not(.admin),
body[data-theme-mode] .member-name,
body[data-theme-mode] .brand strong{color:var(--ui-text)}
body[data-theme-mode] .voice-copy small{color:var(--ui-caption)}
body[data-theme-mode] .composer,
body[data-theme-mode] #chatForm.composer.v1-composer{background:var(--ui-field)!important;border-color:var(--ui-border)!important}
body[data-theme-mode] .composer textarea,
body[data-theme-mode] #chatForm.composer.v1-composer textarea{color:var(--ui-text)!important;background:transparent!important}
body[data-theme-mode] textarea::placeholder,
body[data-theme-mode] input::placeholder{color:var(--ui-caption);opacity:1}

/* Modais, preferências, páginas e menus devem ser do mesmo tema. */
body[data-theme-mode] .modal-card,
body[data-theme-mode] .settings-card,
body[data-theme-mode] .settings-card-v4,
body[data-theme-mode] .social-modal,
body[data-theme-mode] .screen-card,
body[data-theme-mode] .call-card,
body[data-theme-mode] .profile-peek-card:not(.has-profile-background),
body[data-theme-mode] .profile-hover-card:not(.has-profile-background),
body[data-theme-mode] .app-notification,
body[data-theme-mode] .settings-layout,
body[data-theme-mode] .settings-content{background:var(--ui-panel)!important;border-color:var(--ui-border)!important;color:var(--ui-text)}
body[data-theme-mode] .modal{background:var(--ui-modal-overlay)}
body[data-theme-mode] .settings-nav,
body[data-theme-mode] .settings-head,
body[data-theme-mode] .settings-footer,
body[data-theme-mode] .modal-head{background:var(--ui-sidebar)!important;border-color:var(--ui-border)!important;color:var(--ui-text)}
body[data-theme-mode] .settings-nav button{background:transparent!important;color:var(--ui-muted)!important}
body[data-theme-mode] .settings-nav button:hover{background:var(--ui-hover)!important;color:var(--ui-text)!important}
body[data-theme-mode] .settings-title,
body[data-theme-mode] .settings-title strong,
body[data-theme-mode] .setting-block-head strong,
body[data-theme-mode] .modal-head strong{color:var(--ui-text)}
body[data-theme-mode] .settings-title small,
body[data-theme-mode] .modal-head small,
body[data-theme-mode] .setting-note,
body[data-theme-mode] .settings-nav button small{color:var(--ui-muted)}
body[data-theme-mode] :is(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]),select,textarea){background-color:var(--ui-field)!important;border-color:var(--ui-border)!important;color:var(--ui-text)!important}
body[data-theme-mode] select option{background:var(--ui-field);color:var(--ui-text)}
body[data-theme-mode] :is(input,select,textarea):focus-visible{outline:2px solid var(--ui-focus);outline-offset:1px}
body[data-theme-mode] input[type="checkbox"],body[data-theme-mode] input[type="radio"],body[data-theme-mode] input[type="range"]{accent-color:var(--ui-primary)}
body[data-theme-mode] .theme-mode,
body[data-theme-mode] .theme-preview,
body[data-theme-mode] .background-preview{background:var(--ui-raised)!important;border-color:var(--ui-border)!important;color:var(--ui-text)}
body[data-theme-mode] .theme-mode.active{background:var(--ui-selection)!important;border-color:var(--ui-selection-border)!important}

/* Botões: superfícies sólidas, discretas, sem degradê ciano + rosa.
   Os controles de estado crítico e os cosméticos pessoais continuam distintos. */
body[data-theme-mode] button{transition:background-color .16s ease,border-color .16s ease,box-shadow .16s ease,color .16s ease}
body[data-theme-mode] :is(.primary,.composer button[type="submit"],#chatForm button[type="submit"],.settings-footer .primary){background:var(--ui-primary)!important;color:var(--ui-primary-ink)!important;border:1px solid transparent!important;box-shadow:none!important;text-shadow:none!important;font-weight:750}
body[data-theme-mode] :is(.primary,.composer button[type="submit"],#chatForm button[type="submit"]):not(:disabled):hover{background:color-mix(in srgb,var(--ui-primary) 78%,var(--ui-text))!important;box-shadow:0 0 0 2px color-mix(in srgb,var(--ui-primary) 18%,transparent)!important}
body[data-theme-mode] :is(.ghost,.voice-controls button,.voice-icon-btn,.icon-action,.friend-search button,.settings-footer button:not(.primary),.scale-presets button,.theme-package-actions button,.secondary-file,.vi363-panel button){background:var(--ui-raised)!important;border:1px solid var(--ui-border)!important;color:var(--ui-text)!important;box-shadow:none!important;text-shadow:none!important}
body[data-theme-mode] :is(.ghost,.voice-controls button,.voice-icon-btn,.icon-action,.friend-search button,.settings-footer button:not(.primary),.scale-presets button,.theme-package-actions button,.vi363-panel button):not(:disabled):hover{background:var(--ui-hover)!important;border-color:var(--ui-selection-border)!important}
body[data-theme-mode] :is(.voice-controls button.active,.voice-icon-btn.active){background:var(--ui-selection)!important;border-color:var(--ui-selection-border)!important;color:var(--ui-text)!important}
body[data-theme-mode] :is(.danger,.danger-lite,.voice-controls .danger){background:color-mix(in srgb,#dd5366 14%,var(--ui-panel))!important;border-color:color-mix(in srgb,#dd5366 52%,var(--ui-border))!important;color:#ff9aab!important}
body[data-theme-mode="light"] :is(.danger,.danger-lite,.voice-controls .danger){color:#9e293b!important}
body[data-theme-mode] #chatForm.composer.v1-composer > .composer-attach{background:var(--ui-raised)!important;border-color:var(--ui-border)!important;color:var(--ui-text)!important}
body[data-theme-mode] #chatForm.composer.v1-composer > .composer-attach:hover{background:var(--ui-hover)!important;color:var(--ui-primary)!important}
body[data-theme-mode] button:focus-visible{outline:2px solid var(--ui-focus);outline-offset:2px}
body[data-theme-mode] button:disabled{opacity:.48;cursor:not-allowed}

/* Layer for optional user wallpaper, retains existing image and opacity setting. */
body[data-theme-mode].has-user-bg .sidebar,
body[data-theme-mode].has-user-bg .members-pane{background:rgb(from var(--ui-sidebar) r g b / var(--user-panel-alpha))!important}
body[data-theme-mode].has-user-bg .main{background:rgb(from var(--ui-main) r g b / var(--user-panel-alpha))!important}
body[data-theme-mode].has-user-bg .topbar,
body[data-theme-mode].has-user-bg .section-head{background:rgb(from var(--ui-sidebar) r g b / var(--user-panel-alpha))!important}

/* Live preview in appearance settings. Decorative only, accessible descriptions adjacent. */
.vi-theme-sample{display:flex;gap:5px;padding:9px;margin-top:8px;border-radius:10px;background:var(--ui-main);border:1px solid var(--ui-border);align-items:center}
.vi-theme-sample>span{display:block;width:19px;height:19px;border-radius:6px;border:1px solid var(--ui-border-strong)}
.vi-theme-sample .sample-sidebar{background:var(--ui-sidebar)}
.vi-theme-sample .sample-panel{background:var(--ui-panel)}
.vi-theme-sample .sample-raised{background:var(--ui-raised)}
.vi-theme-sample .sample-accent{background:var(--ui-primary);border-color:var(--ui-primary)}
.vi-theme-sample small{margin-left:7px;font-size:11px;color:var(--ui-muted)}
@media(prefers-reduced-motion:reduce){body[data-theme-mode] button{transition:none}}
/* Painéis de navegação e ações que antes continuavam azul-roxo independentemente da paleta. */
body[data-theme-mode] .right-pane-tabs,
body[data-theme-mode] .people-search,
body[data-theme-mode] .hub-panel-head{background:var(--ui-sidebar)!important;border-color:var(--ui-border)!important;color:var(--ui-text)}
body[data-theme-mode] .right-pane-tab{background:var(--ui-raised)!important;border-color:var(--ui-border)!important;color:var(--ui-muted)!important;box-shadow:none!important}
body[data-theme-mode] .right-pane-tab:hover{background:var(--ui-hover)!important;color:var(--ui-text)!important}
body[data-theme-mode] .right-pane-tab.active{background:var(--ui-selection)!important;border-color:var(--ui-selection-border)!important;color:var(--ui-text)!important;box-shadow:inset 0 -2px 0 var(--ui-primary)!important}
body[data-theme-mode] .right-pane-tab b{background:var(--ui-field);color:var(--ui-text)}
body[data-theme-mode] .hub-icon{background:var(--ui-selection)!important;border-color:var(--ui-selection-border)!important;color:var(--ui-primary)!important}
body[data-theme-mode] .people-search button{background:var(--ui-raised)!important;border-color:var(--ui-border)!important;color:var(--ui-text)!important}
body[data-theme-mode] .people-search button:hover{background:var(--ui-hover)!important;border-color:var(--ui-selection-border)!important}
body[data-theme-mode] .media-status-bar:hover{background:var(--ui-hover)!important;border-color:var(--ui-selection-border)!important}
body[data-theme-mode] .vi352-library,
body[data-theme-mode] .vi352-detail-panel,
body[data-theme-mode] .vi352-game-panel{border-color:var(--ui-border);color:var(--ui-text)}
/* Central de bots e comandos /ticket: painéis harmonizados com o restante do Windows. */
body[data-theme-mode] .vi24-overlay{background:var(--ui-modal-overlay)!important;color:var(--ui-text)!important}
body[data-theme-mode] .vi24-panel,
body[data-theme-mode] #vi304CommandPanel,
body[data-theme-mode] #vi24SlashSuggestions{background:var(--ui-panel)!important;border-color:var(--ui-border)!important;color:var(--ui-text)!important}
body[data-theme-mode] .vi24-panel header,
body[data-theme-mode] .vi24-panel footer,
body[data-theme-mode] #vi24Nav{background:var(--ui-sidebar);border-color:var(--ui-border)}
body[data-theme-mode] .vi24-bot,
body[data-theme-mode] .vi24-guide,
body[data-theme-mode] .vi24-credential{background:var(--ui-raised)!important;border-color:var(--ui-border)!important;color:var(--ui-text)!important}
body[data-theme-mode] .vi24-bot-icon{background:var(--ui-selection)!important;color:var(--ui-primary)!important}
body[data-theme-mode] .vi24-panel :is(button:not(.primary):not(.danger),input,textarea,select){background:var(--ui-field)!important;border-color:var(--ui-border)!important;color:var(--ui-text)!important}
body[data-theme-mode] .vi24-panel button:not(.primary):hover,
body[data-theme-mode] #vi24SlashSuggestions button:hover{background:var(--ui-hover)!important;border-color:var(--ui-selection-border)!important}
body[data-theme-mode] #vi24Nav button.active{background:var(--ui-selection)!important;border-color:var(--ui-selection-border)!important;box-shadow:inset 0 -2px 0 var(--ui-primary)}
body[data-theme-mode] .vi24-panel :is(header p,small,.vi24-hint),
body[data-theme-mode] .vi24-bot-name p,
body[data-theme-mode] .vi24-fields label{color:var(--ui-muted)!important}
body[data-theme-mode] #vi304CommandPanel header strong{color:var(--ui-text)}
body[data-theme-mode] #vi24SlashSuggestions button{color:var(--ui-text)}