/* ===== TEMA VIDRO (GLASSMORPHISM) =====
   Fundos translúcidos com blur
   Bordas finas luminosas
   Sombras suaves
   Cantos bem arredondados
*/
[data-tema="vidro"] {
  --bg: #f0f4f8;
  --bg-deep: #e8eef5;
  --surface: rgba(255, 255, 255, 0.9);    /* More opaque for contrast */
  --surface-2: rgba(255, 255, 255, 0.96);  /* Even more opaque for mc-ico contrast */
  --surface-3: rgba(255, 255, 255, 0.99);
  --surface-hover: rgba(255, 255, 255, 0.99);
  --ink: #1a2332;
  --ink-muted: #3a4a62;           /* Darker for 4.5:1 on surface */
  --ink-dim: #5a6a82;             /* Darker for 4.5:1 on surface */
  --line: rgba(148, 163, 184, 0.4);   /* More opaque */
  --line-bright: rgba(56, 189, 248, 0.7);
  --brand: #0284c7;               /* Darker for 4.5:1 on white */
  --brand-2: #8b5cf6;
  --brand-gradient: linear-gradient(135deg, var(--brand), var(--brand-2));
  --accent: #0369a1;              /* Even darker azul sky for 4.5:1 on surface-2 */
  --accent-ink: #fff;
  --accent-bg: rgba(2, 132, 199, 0.15);   /* More opaque */
  --accent-border: rgba(2, 132, 199, 0.5);
  --accent-cyan: #0891b2;         /* Darker ciano */
  --accent-violet: #7c3aed;       /* Darker violeta */
  --accent-dim: rgba(2, 132, 199, 0.15);
  --accent-cyan-dim: rgba(8, 145, 178, 0.15);
  --accent-violet-dim: rgba(124, 58, 237, 0.15);
  --danger: #c0392b;              /* Darker red for 4.5:1 on white */
  --danger-ink: #fff;
  --danger-bg: rgba(192, 57, 43, 0.15);
  --danger-border: rgba(192, 57, 43, 0.5);
  --warning: #b45309;             /* Darker amber for 4.5:1 with white text */
  --warning-ink: #fff;
  --warning-bg: rgba(180, 83, 9, 0.15);
  --warning-border: rgba(180, 83, 9, 0.5);
  --info: #005ea2;   /* Darker for 4.5:1 with white text */
  --info-ink: #fff;
  --info-bg: #005ea2;   /* Fully opaque for guaranteed 4.5:1 contrast with white text */
  --info-border: rgba(0, 94, 162, 0.5);
  --violet: #7c3aed;
  --violet-ink: #fff;
  --violet-bg: rgba(124, 58, 237, 0.15);
  --violet-border: rgba(124, 58, 237, 0.5);
  --focus: #0284c7;
  --focus-ring: rgba(2, 132, 199, 0.3);
  --shadow-sm: 0 2px 8px rgba(15, 23, 42, 0.06);
  --shadow-md: 0 8px 32px rgba(15, 23, 42, 0.08);
  --shadow-lg: 0 20px 48px rgba(15, 23, 42, 0.1);
  --shadow-xl: 0 24px 56px rgba(15, 23, 42, 0.12);
  --shadow-inner: inset 0 1px 0 rgba(255,255,255,0.8), inset 0 -1px 0 rgba(15,23,42,0.03);
  --shadow-glow: 0 0 32px rgba(2, 132, 199, 0.2);
  --radius-sm: 10px;
  --radius-md: 14px;
  --radius-lg: 20px;
  --radius-xl: 28px;
  --radius-full: 999px;
  --transition-fast: 150ms cubic-bezier(0.2, 0.7, 0.2, 1);
  --transition-base: 200ms cubic-bezier(0.2, 0.7, 0.2, 1);
  --transition-slow: 300ms cubic-bezier(0.2, 0.7, 0.2, 1);
  --font: 'Inter', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --font-mono: 'JetBrains Mono', 'Fira Code', monospace;
  --fs-xs: 12px;
  --fs-sm: 14px;
  --fs-md: 16px;
  --fs-lg: 20px;
  --fs-xl: 28px;
  --fs-2xl: 36px;
  --lh-tight: 1.2;
  --lh-normal: 1.45;
  --lh-relaxed: 1.6;
  --space-xs: 4px;
  --space-sm: 8px;
  --space-md: 16px;
  --space-lg: 24px;
  --space-xl: 32px;
  --space-2xl: 48px;
  --card-padding-mobile: 16px;
  --card-padding-desktop: 22px;
  --card-gap: 12px;
  --blur-sm: blur(8px);
  --blur-md: blur(16px);
  --blur-lg: blur(24px);
  /* Legacy aliases for backward compatibility */
  --panel: var(--surface);
  --panel-elevated: var(--surface-2);
  --panel-hover: var(--surface-hover);
  --success: #16a34a;            /* Darker green for 4.5:1 on white */
  --success-dim: rgba(22, 163, 74, 0.15);
  --success-light: rgba(22, 163, 74, 0.2);
  --success-medium: rgba(22, 163, 74, 0.4);
  --bad: var(--danger);
  --warn: var(--warning);
  --acc: var(--accent);
  --blue: var(--info);
  --mute: var(--ink-muted);
  --warn-ink: var(--warning-ink);
  --acc-ink: var(--accent-ink);
}

/* Background com textura sutil */
[data-tema="vidro"] body {
  background:
    radial-gradient(ellipse 80% 50% at 20% -10%, rgba(56, 189, 248, 0.12), transparent 60%),
    radial-gradient(ellipse 60% 40% at 80% 10%, rgba(139, 92, 246, 0.1), transparent 55%),
    linear-gradient(180deg, var(--bg) 0%, var(--bg-deep) 100%);
  background-attachment: fixed;
}

/* Glass base - todos os cards */
[data-tema="vidro"] section,
[data-tema="vidro"] .box,
[data-tema="vidro"] .module-card,
[data-tema="vidro"] .stat,
[data-tema="vidro"] .module-stat,
[data-tema="vidro"] .pf-card,
[data-tema="vidro"] .notif-item,
[data-tema="vidro"] .notification-panel section,
[data-tema="vidro"] .cn-link,
[data-tema="vidro"] .cn-ok,
[data-tema="vidro"] .unid-card,
[data-tema="vidro"] .asg-dir-card,
[data-tema="vidro"] .asg-group,
[data-tema="vidro"] .asg-unidades,
[data-tema="vidro"] .asg-names,
[data-tema="vidro"] .asg-detail,
[data-tema="vidro"] .treino-card,
[data-tema="vidro"] .prob-card,
[data-tema="vidro"] .om-card,
[data-tema="vidro"] .lv-item,
[data-tema="vidro"] .lv-foto,
[data-tema="vidro"] .lv-prev,
[data-tema="vidro"] .asg-orfas,
[data-tema="vidro"] .asg-orfa,
[data-tema="vidro"] .asg-semhoje,
[data-tema="vidro"] .cfg-preview,
[data-tema="vidro"] .settings-main,
[data-tema="vidro"] .settings-nav {
  background: var(--panel) !important;
  backdrop-filter: var(--blur-md) !important;
  -webkit-backdrop-filter: var(--blur-md) !important;
  border: 1px solid var(--line) !important;
  border-radius: var(--radius-lg) !important;
  box-shadow:
    var(--shadow-md),
    var(--shadow-inner) !important;
  transition: all var(--transition-base) !important;
}

/* Hover glass */
[data-tema="vidro"] section:hover,
[data-tema="vidro"] .box:hover,
[data-tema="vidro"] .module-card:hover,
[data-tema="vidro"] .stat:hover,
[data-tema="vidro"] .module-stat:hover,
[data-tema="vidro"] .pf-card:hover,
[data-tema="vidro"] .notif-item:hover,
[data-tema="vidro"] .unid-card:hover,
[data-tema="vidro"] .asg-dir-card:hover,
[data-tema="vidro"] .asg-group:hover,
[data-tema="vidro"] .treino-card:hover,
[data-tema="vidro"] .prob-card:hover,
[data-tema="vidro"] .om-card:hover,
[data-tema="vidro"] .lv-item:hover,
[data-tema="vidro"] .lv-foto:hover,
[data-tema="vidro"] .lv-prev:hover,
[data-tema="vidro"] .asg-orfa:hover {
  background: var(--panel-hover) !important;
  border-color: var(--line-bright) !important;
  box-shadow:
    var(--shadow-lg),
    var(--shadow-inner),
    var(--shadow-glow) !important;
  transform: translateY(-4px) !important;
}

/* Selected/active state */
[data-tema="vidro"] .asg-dir-card.on,
[data-tema="vidro"] .module-card.on,
[data-tema="vidro"] .module-subnav button.on,
[data-tema="vidro"] .topnav button.on,
[data-tema="vidro"] .unid-card.on,
[data-tema="vidro"] .normas-chip.on {
  background: var(--surface-3) !important;
  border-color: var(--accent) !important;
  box-shadow:
    var(--shadow-md),
    var(--shadow-inner),
    0 0 0 1px var(--accent) inset !important;
  transform: translateY(-2px) !important;
}

/* Botões glass */
[data-tema="vidro"] button {
  border-radius: var(--radius-md) !important;
  font-weight: 600 !important;
  transition: all var(--transition-fast) !important;
  min-height: 44px !important;
  backdrop-filter: var(--blur-sm) !important;
  -webkit-backdrop-filter: var(--blur-sm) !important;
}

[data-tema="vidro"] button.main,
[data-tema="vidro"] button[data-module-action="asg-rot-apply"],
[data-tema="vidro"] button[data-module-action="asg-copy"],
[data-tema="vidro"] button[data-module-action="asg-local-add"],
[data-tema="vidro"] .auth-google {
  background: linear-gradient(135deg, var(--accent), var(--accent-violet)) !important;
  border: none !important;
  color: #fff !important;
  font-weight: 700 !important;
  box-shadow:
    var(--shadow-md),
    0 0 24px rgba(14, 165, 233, 0.3) !important;
}

[data-tema="vidro"] button.main:hover,
[data-tema="vidro"] button.main:focus-visible {
  background: linear-gradient(135deg, var(--accent-violet), var(--accent-cyan)) !important;
  box-shadow:
    var(--shadow-lg),
    0 0 32px rgba(14, 165, 233, 0.4),
    0 0 48px rgba(139, 92, 246, 0.2) !important;
  transform: translateY(-2px) scale(1.01) !important;
}

[data-tema="vidro"] button.main:active {
  transform: translateY(0) scale(0.98) !important;
}

[data-tema="vidro"] button.in {
  background: var(--success-dim) !important;
  border: 1px solid rgba(34, 197, 94, 0.4) !important;
  color: var(--success) !important;
  backdrop-filter: var(--blur-sm) !important;
}

[data-tema="vidro"] button.in:hover {
  background: var(--success) !important;
  color: #fff !important;
  box-shadow: 0 0 24px rgba(34, 197, 94, 0.4) !important;
}

[data-tema="vidro"] button.out,
[data-tema="vidro"] button.danger,
[data-tema="vidro"] .asg-del-lista {
  background: var(--danger-dim) !important;
  border: 1px solid rgba(239, 68, 68, 0.4) !important;
  color: var(--danger) !important;
  backdrop-filter: var(--blur-sm) !important;
}

[data-tema="vidro"] button.out:hover,
[data-tema="vidro"] button.danger:hover,
[data-tema="vidro"] .asg-del-lista:hover {
  background: var(--danger) !important;
  color: #fff !important;
  box-shadow: 0 0 24px rgba(239, 68, 68, 0.4) !important;
}

[data-tema="vidro"] button.link {
  color: var(--accent) !important;
  background: transparent !important;
  border: none !important;
}

[data-tema="vidro"] button.link:hover {
  color: var(--accent-violet) !important;
  text-decoration: underline !important;
}

[data-tema="vidro"] button:disabled {
  opacity: 0.4 !important;
  cursor: not-allowed !important;
  transform: none !important;
}

[data-tema="vidro"] button:focus-visible {
  outline: 2px solid var(--accent) !important;
  outline-offset: 2px !important;
}

/* Botões pequenos */
[data-tema="vidro"] .mover,
[data-tema="vidro"] .actions button:not(.main):not(.in):not(.out):not(.danger):not(.link) {
  background: var(--panel) !important;
  border: 1px solid var(--line) !important;
  color: var(--ink) !important;
  backdrop-filter: var(--blur-sm) !important;
  min-width: 40px !important;
}

[data-tema="vidro"] .mover:hover,
[data-tema="vidro"] .actions button:not(.main):not(.in):not(.out):not(.danger):not(.link):hover {
  border-color: var(--accent) !important;
  background: var(--panel-hover) !important;
  color: var(--accent) !important;
}

/* Inputs glass */
[data-tema="vidro"] input,
[data-tema="vidro"] select,
[data-tema="vidro"] textarea {
  background: var(--panel) !important;
  backdrop-filter: var(--blur-sm) !important;
  -webkit-backdrop-filter: var(--blur-sm) !important;
  border: 1px solid var(--line) !important;
  border-radius: var(--radius-sm) !important;
  color: var(--ink) !important;
  font-family: var(--font-sans) !important;
  padding: 14px 16px !important;
  transition: all var(--transition-fast) !important;
  min-height: 48px !important;
}

[data-tema="vidro"] input::placeholder,
[data-tema="vidro"] textarea::placeholder {
  color: var(--ink-dim) !important;
}

[data-tema="vidro"] input:focus,
[data-tema="vidro"] select:focus,
[data-tema="vidro"] textarea:focus {
  border-color: var(--accent) !important;
  box-shadow:
    0 0 0 3px var(--focus-ring),
    var(--shadow-inner) !important;
  outline: none !important;
  background: var(--panel-hover) !important;
}

[data-tema="vidro"] label {
  color: var(--ink-muted) !important;
  font-weight: 600 !important;
  font-size: 0.8rem !important;
}

/* Select */
[data-tema="vidro"] select {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%237a8a9e' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right 14px center !important;
  padding-right: 44px !important;
  appearance: none !important;
}

/* Tabelas glass */
[data-tema="vidro"] table {
  border-collapse: separate !important;
  border-spacing: 0 !important;
  width: 100% !important;
}

[data-tema="vidro"] th {
  background: var(--panel) !important;
  backdrop-filter: var(--blur-md) !important;
  -webkit-backdrop-filter: var(--blur-md) !important;
  border-bottom: 1px solid var(--line) !important;
  color: var(--ink-dim) !important;
  font-weight: 600 !important;
  font-size: 0.7rem !important;
  text-transform: uppercase !important;
  letter-spacing: 0.08em !important;
  padding: 14px 16px !important;
  position: sticky !important;
  top: 0 !important;
  z-index: 1 !important;
}

[data-tema="vidro"] td {
  border-bottom: 1px solid var(--line) !important;
  padding: 14px 16px !important;
  color: var(--ink) !important;
  vertical-align: middle !important;
  transition: background var(--transition-fast) !important;
}

[data-tema="vidro"] tr:hover td {
  background: var(--accent-dim) !important;
}

[data-tema="vidro"] tr:last-child td {
  border-bottom: none !important;
}

/* Status pills glass */
[data-tema="vidro"] .st,
[data-tema="vidro"] .tag,
[data-tema="vidro"] .module-status,
[data-tema="vidro"] .asg-dir-turnos,
[data-tema="vidro"] .pend-row b,
[data-tema="vidro"] .pf-tag {
  border-radius: 999px !important;
  padding: 6px 14px !important;
  font-size: 0.7rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.02em !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  backdrop-filter: var(--blur-sm) !important;
  -webkit-backdrop-filter: var(--blur-sm) !important;
}

[data-tema="vidro"] .st.aprovada,
[data-tema="vidro"] .st.ativas,
[data-tema="vidro"] .pf-tag:not(.bad) {
  background: var(--success-dim) !important;
  color: var(--success) !important;
  border: 1px solid rgba(34, 197, 94, 0.3) !important;
}

[data-tema="vidro"] .st.pendente,
[data-tema="vidro"] .st.recusada,
[data-tema="vidro"] .pf-tag.bad {
  background: var(--danger-dim) !important;
  color: var(--danger) !important;
  border: 1px solid rgba(239, 68, 68, 0.3) !important;
}

[data-tema="vidro"] .tag {
  background: var(--warning-dim) !important;
  color: var(--warning) !important;
  border: 1px solid rgba(245, 158, 11, 0.3) !important;
}

/* Topbar glass */
[data-tema="vidro"] header.topbar {
  background: var(--panel) !important;
  backdrop-filter: var(--blur-lg) !important;
  -webkit-backdrop-filter: var(--blur-lg) !important;
  border: 1px solid var(--line) !important;
  border-bottom-color: var(--line-bright) !important;
  box-shadow:
    var(--shadow-md),
    var(--shadow-inner) !important;
}

[data-tema="vidro"] .brand-logo {
  background: linear-gradient(135deg, var(--accent), var(--accent-violet)) !important;
  box-shadow:
    0 0 24px rgba(14, 165, 233, 0.3),
    inset 0 1px 0 rgba(255,255,255,0.3) !important;
}

[data-tema="vidro"] .brand-name {
  background: linear-gradient(90deg, var(--accent), var(--accent-cyan), var(--accent-violet)) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
}

[data-tema="vidro"] .topnav button {
  color: var(--ink-muted) !important;
  background: transparent !important;
  border: 1px solid transparent !important;
  border-radius: var(--radius-md) !important;
  padding: 12px 18px !important;
  font-weight: 600 !important;
}

[data-tema="vidro"] .topnav button:hover {
  background: var(--panel) !important;
  backdrop-filter: var(--blur-sm) !important;
  color: var(--ink) !important;
}

[data-tema="vidro"] .topnav button.on {
  background: var(--surface-2) !important;
  backdrop-filter: var(--blur-md) !important;
  border-color: rgba(14, 165, 233, 0.4) !important;
  color: var(--accent) !important;
  box-shadow:
    inset 0 0 0 1px rgba(14, 165, 233, 0.3),
    0 0 24px rgba(14, 165, 233, 0.15) !important;
}

[data-tema="vidro"] .topnav button.on::after {
  background: var(--accent) !important;
  box-shadow: 0 0 12px var(--accent) !important;
}

[data-tema="vidro"] .topnav button svg {
  color: var(--ink-dim) !important;
  opacity: 0.8 !important;
}

[data-tema="vidro"] .topnav button.on svg,
[data-tema="vidro"] .topnav button:hover svg {
  color: var(--accent) !important;
  opacity: 1 !important;
}

[data-tema="vidro"] .user-txt b {
  color: var(--ink) !important;
}

[data-tema="vidro"] .user-txt small {
  color: var(--accent) !important;
}

[data-tema="vidro"] .avatar {
  background: linear-gradient(135deg, var(--accent), var(--accent-violet)) !important;
  border: 2px solid rgba(255,255,255,0.3) !important;
}

/* Notification bell glass */
[data-tema="vidro"] .notification-bell {
  background: var(--panel) !important;
  backdrop-filter: var(--blur-sm) !important;
  border-color: var(--line) !important;
  color: var(--ink-muted) !important;
}

[data-tema="vidro"] .notification-bell:hover {
  background: var(--panel-hover) !important;
  border-color: var(--accent) !important;
  color: var(--accent) !important;
}

[data-tema="vidro"] .notification-count {
  background: var(--danger) !important;
  box-shadow: 0 0 16px var(--danger) !important;
}

/* Module cards hub glass */
[data-tema="vidro"] .module-card {
  border-radius: var(--radius-xl) !important;
  padding: 32px !important;
  min-height: 220px !important;
}

[data-tema="vidro"] .module-card::before {
  height: 3px !important;
  background: linear-gradient(90deg, transparent, var(--accent), transparent) !important;
  opacity: 0.6 !important;
}

[data-tema="vidro"] .mc-ico {
  background: var(--surface-3) !important;
  backdrop-filter: var(--blur-sm) !important;
  border: 1px solid var(--line) !important;
  color: var(--accent) !important;
  border-radius: var(--radius-md) !important;
}

[data-tema="vidro"] .module-card:hover .mc-ico {
  background: var(--accent) !important;
  color: #fff !important;
  border-color: var(--accent) !important;
  box-shadow: 0 0 24px rgba(14, 165, 233, 0.4) !important;
}

/* Checklist hero glass */
[data-tema="vidro"] .asg-hero {
  background:
    radial-gradient(ellipse 60% 40% at 15% -10%, rgba(14, 165, 233, 0.08), transparent 70%),
    radial-gradient(ellipse 50% 40% at 90% -5%, rgba(139, 92, 246, 0.06), transparent 70%),
    var(--bg) !important;
}

[data-tema="vidro"] .asg-start {
  background: linear-gradient(135deg, var(--accent), var(--accent-violet)) !important;
  box-shadow:
    var(--shadow-lg),
    0 0 32px rgba(14, 165, 233, 0.4) !important;
}

[data-tema="vidro"] .asg-start-in .asg-play {
  color: #fff !important;
}

/* Names/detail panels glass */
[data-tema="vidro"] .asg-names {
  background: var(--panel) !important;
  backdrop-filter: var(--blur-lg) !important;
  -webkit-backdrop-filter: var(--blur-lg) !important;
  border-color: var(--line) !important;
  box-shadow: var(--shadow-lg), var(--shadow-inner) !important;
}

[data-tema="vidro"] .asg-names-header {
  border-bottom-color: var(--line) !important;
  background: rgba(255,255,255,0.3) !important;
  backdrop-filter: var(--blur-md) !important;
}

[data-tema="vidro"] .asg-names-header input {
  background: var(--panel) !important;
  border-color: var(--line) !important;
}

[data-tema="vidro"] .asg-dir-card.on {
  background: var(--panel-elevated) !important;
  border-color: var(--accent) !important;
  box-shadow:
    var(--shadow-md),
    inset 0 0 0 1px var(--accent) !important;
}

[data-tema="vidro"] .asg-group {
  border-radius: var(--radius-lg) !important;
}

[data-tema="vidro"] .asg-head {
  border-bottom: 1px solid var(--line) !important;
  padding-bottom: 14px !important;
  margin-bottom: 14px !important;
}

[data-tema="vidro"] .asg-unid select {
  border-color: var(--line) !important;
}

[data-tema="vidro"] .asg-unid.falta select {
  border-color: var(--warning) !important;
}

[data-tema="vidro"] .asg-unid .on {
  background: var(--success) !important;
  border-color: var(--success) !important;
  color: #fff !important;
}

[data-tema="vidro"] .asg-semhoje {
  background: var(--accent-cyan-dim) !important;
  border-color: rgba(34, 211, 238, 0.4) !important;
  color: var(--ink) !important;
}

[data-tema="vidro"] .asg-semhoje b {
  color: var(--accent-cyan) !important;
}

[data-tema="vidro"] .asg-orfas {
  border-style: dashed !important;
  border-color: var(--line) !important;
  background: var(--panel) !important;
}

[data-tema="vidro"] .asg-orfas summary {
  color: var(--accent) !important;
}

[data-tema="vidro"] .asg-orfa {
  background: var(--panel) !important;
  border-color: var(--line) !important;
}

[data-tema="vidro"] .asg-del-lista {
  border-color: rgba(239, 68, 68, 0.4) !important;
}

/* Forms glass */
[data-tema="vidro"] .module-form {
  gap: 18px !important;
}

[data-tema="vidro"] .module-form .field {
  margin-bottom: 0 !important;
}

[data-tema="vidro"] .module-form input,
[data-tema="vidro"] .module-form select,
[data-tema="vidro"] .module-form textarea {
  padding: 16px 18px !important;
}

/* Stats glass */
[data-tema="vidro"] .stat,
[data-tema="vidro"] .module-stat {
  background: var(--panel) !important;
  backdrop-filter: var(--blur-md) !important;
  border-radius: var(--radius-lg) !important;
  padding: 24px !important;
}

[data-tema="vidro"] .stat b,
[data-tema="vidro"] .module-stat strong {
  color: var(--accent) !important;
}

[data-tema="vidro"] .stat span,
[data-tema="vidro"] .module-stat span {
  color: var(--ink-dim) !important;
}

/* Progress bars glass */
[data-tema="vidro"] .bar .trk,
[data-tema="vidro"] .treino-bar,
[data-tema="vidro"] .asg-prog {
  background: var(--panel) !important;
  backdrop-filter: var(--blur-sm) !important;
  border-radius: 999px !important;
  border: 1px solid var(--line) !important;
}

[data-tema="vidro"] .bar i,
[data-tema="vidro"] .treino-bar i,
[data-tema="vidro"] .asg-prog i {
  background: linear-gradient(90deg, var(--accent), var(--accent-cyan)) !important;
  border-radius: 999px !important;
  box-shadow: 0 0 16px var(--accent) !important;
}

/* Treino cards glass */
[data-tema="vidro"] .treino-card {
  background: var(--panel) !important;
  backdrop-filter: var(--blur-md) !important;
  border-color: var(--line) !important;
  border-radius: var(--radius-lg) !important;
}

[data-tema="vidro"] .treino-card.feito {
  border-color: rgba(34, 197, 94, 0.4) !important;
  background: var(--success-dim) !important;
}

[data-tema="vidro"] .treino-n {
  background: var(--accent-dim) !important;
  color: var(--accent) !important;
  border: 1px solid var(--line) !important;
}

[data-tema="vidro"] .treino-card.feito .treino-n {
  background: var(--success) !important;
  color: #fff !important;
  border-color: var(--success) !important;
}

[data-tema="vidro"] .treino-op {
  background: var(--panel) !important;
  backdrop-filter: var(--blur-sm) !important;
  border-color: var(--line) !important;
  border-radius: var(--radius-md) !important;
}

[data-tema="vidro"] .treino-op.certa {
  border-color: rgba(34, 197, 94, 0.4) !important;
  background: var(--success-dim) !important;
}

[data-tema="vidro"] .treino-op.errada {
  border-color: rgba(239, 68, 68, 0.4) !important;
  background: var(--danger-dim) !important;
}

/* Settings glass */
[data-tema="vidro"] .settings-nav {
  background: var(--panel) !important;
  backdrop-filter: var(--blur-md) !important;
  border-color: var(--line) !important;
}

[data-tema="vidro"] .settings-nav button {
  color: var(--ink-muted) !important;
  background: transparent !important;
}

[data-tema="vidro"] .settings-nav button:hover {
  background: var(--panel) !important;
  color: var(--ink) !important;
}

[data-tema="vidro"] .settings-nav button.on {
  background: var(--accent-dim) !important;
  color: var(--accent) !important;
  border-left: 3px solid var(--accent) !important;
  border-radius: 0 var(--radius-md) var(--radius-md) 0 !important;
}

[data-tema="vidro"] .settings-link {
  background: var(--panel) !important;
  backdrop-filter: var(--blur-sm) !important;
  border-radius: var(--radius-md) !important;
  border: 1px solid var(--line) !important;
}

[data-tema="vidro"] .settings-link:hover {
  border-color: var(--accent) !important;
  background: var(--panel-hover) !important;
}

[data-tema="vidro"] .switch .knob {
  background: var(--line) !important;
}

[data-tema="vidro"] .switch input:checked + .knob {
  background: linear-gradient(135deg, var(--accent), var(--accent-violet)) !important;
}

[data-tema="vidro"] .cfg-preview {
  border-style: dashed !important;
  border-color: var(--line) !important;
  background: var(--panel) !important;
  backdrop-filter: var(--blur-sm) !important;
}

[data-tema="vidro"] .pv-logo {
  background: linear-gradient(135deg, var(--accent), var(--accent-violet)) !important;
}

[data-tema="vidro"] .pv-btn {
  background: linear-gradient(135deg, var(--accent), var(--accent-violet)) !important;
}

/* Modal glass */
[data-tema="vidro"] .cn-scan-frame {
  border-color: rgba(14, 165, 233, 0.6) !important;
  box-shadow: 0 0 0 100vmax rgba(0,0,0,0.4), 0 0 32px rgba(14, 165, 233, 0.3) !important;
}

[data-tema="vidro"] .cn-scan-btn {
  background: linear-gradient(135deg, var(--accent), var(--accent-violet)) !important;
}

/* Notif toast glass */
[data-tema="vidro"] .notif-toast {
  background: var(--panel-elevated) !important;
  backdrop-filter: var(--blur-lg) !important;
  border-color: var(--accent) !important;
  box-shadow: var(--shadow-lg), var(--shadow-glow) !important;
}

/* Loading skeleton glass */
[data-tema="vidro"] .skeleton {
  background: linear-gradient(90deg, var(--panel) 25%, var(--panel-hover) 50%, var(--panel) 75%) !important;
  background-size: 200% 100% !important;
  animation: vidro-shimmer 1.8s infinite !important;
  border-radius: var(--radius-sm) !important;
  border: 1px solid var(--line) !important;
}

@keyframes vidro-shimmer {
  0% { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}

/* Scrollbar glass */
[data-tema="vidro"] ::-webkit-scrollbar {
  width: 8px !important;
  height: 8px !important;
}

[data-tema="vidro"] ::-webkit-scrollbar-track {
  background: transparent !important;
}

[data-tema="vidro"] ::-webkit-scrollbar-thumb {
  background: var(--line) !important;
  border-radius: 4px !important;
  border: 2px solid transparent !important;
  background-clip: padding-box !important;
  backdrop-filter: var(--blur-sm) !important;
}

[data-tema="vidro"] ::-webkit-scrollbar-thumb:hover {
  background: var(--accent) !important;
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
  [data-tema="vidro"] *,
  [data-tema="vidro"] *::before,
  [data-tema="vidro"] *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}

/* Mobile adjustments */
@media (max-width: 800px) {
  [data-tema="vidro"] .asg-split {
    grid-template-columns: 1fr !important;
  }
  [data-tema="vidro"] .asg-names {
    position: sticky !important;
    top: 90px !important;
    max-height: 280px !important;
    height: auto !important;
  }
  [data-tema="vidro"] .module-card {
    min-height: auto !important;
    padding: 24px !important;
  }
  [data-tema="vidro"] .topnav button {
    padding: 10px 12px !important;
    font-size: 0.85rem !important;
  }
}

/* Theme selector cards */
[data-tema="vidro"] .tema-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)) !important;
  gap: 16px !important;
  margin-top: 16px !important;
}

[data-tema="vidro"] .tema-card {
  background: var(--panel) !important;
  backdrop-filter: var(--blur-md) !important;
  -webkit-backdrop-filter: var(--blur-md) !important;
  border: 1px solid var(--line) !important;
  border-radius: var(--radius-lg) !important;
  padding: 20px !important;
  cursor: pointer !important;
  transition: all var(--transition-base) !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
  text-align: left !important;
  box-shadow: var(--shadow-md), var(--shadow-inner) !important;
}

[data-tema="vidro"] .tema-card:hover {
  background: var(--panel-hover) !important;
  border-color: var(--line-bright) !important;
  box-shadow:
    var(--shadow-lg),
    var(--shadow-inner),
    var(--shadow-glow) !important;
  transform: translateY(-4px) !important;
}

[data-tema="vidro"] .tema-card.on {
  background: var(--panel-elevated) !important;
  border-color: var(--accent) !important;
  box-shadow:
    var(--shadow-md),
    var(--shadow-inner),
    0 0 0 1px var(--accent) inset !important;
  transform: translateY(-2px) !important;
}

[data-tema="vidro"] .tema-ico {
  font-size: 2.5rem !important;
  line-height: 1 !important;
  background: linear-gradient(135deg, var(--accent), var(--accent-violet)) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
}

[data-tema="vidro"] .tema-nome {
  font-size: 1.1rem !important;
  font-weight: 700 !important;
  color: var(--ink) !important;
}

[data-tema="vidro"] .tema-desc {
  font-size: 0.8rem !important;
  color: var(--ink-dim) !important;
  line-height: 1.4 !important;
}

[data-tema="vidro"] .switch input:checked + .knob::after {
  background: #fff !important;
}