/* ============================================================
   CENTRAL DE AULAS — Camada visual "Avance Olímpico"
   Módulo unificado: Ao Vivo + Biblioteca (gravadas) + Monitoria.
   Escopo: #view-aulas / #view-aovivo / #view-monitoria + classes .ca-*
   Temas: body:not(.theme-light) = ESCURO | body.theme-light = CLARO
   Cores herdadas de #avanceBrandHardening: --av-roxo / --av-ouro
   Sub-fase 1 (fundação): cabeçalho da marca + barra de abas.
   ============================================================ */

/* ---- Tipografia da marca ---- */
#view-aulas, #view-aovivo, #view-monitoria{
  font-family:'Inter', system-ui, -apple-system, "Segoe UI", sans-serif;
}
#view-aulas h1, #view-aulas h2, #view-aulas h3, #view-aulas h4,
#view-aovivo h1, #view-aovivo h2, #view-aovivo h3, #view-aovivo h4,
#view-monitoria h1, #view-monitoria h2, #view-monitoria h3, #view-monitoria h4{
  font-family:'Poppins','Inter',sans-serif; letter-spacing:.01em;
}

/* ============================================================
   Cabeçalho da Central (faixa roxa com logo + subtítulo)
   Injetado por aulas-central-abas.js no topo de cada view.
   ============================================================ */
.ca-header{
  display:flex; align-items:center; gap:14px;
  background:linear-gradient(135deg,#5B1F7E,#3C1457);
  border-radius:18px; padding:16px 20px; border:none; margin-bottom:14px;
}
.ca-header .ca-headtext{ flex:1; min-width:0; }
.ca-header h2{ color:#fff !important; font-size:20px; font-weight:600; margin:0; }
.ca-header p{ color:rgba(255,255,255,.72) !important; margin:2px 0 0; font-size:12.5px; }
.ca-logo{
  width:44px; height:44px; border-radius:12px; background:rgba(255,255,255,.14);
  display:flex; align-items:center; justify-content:center; position:relative; flex:0 0 auto;
}
.ca-logo b{ color:#fff; font-family:'Poppins',sans-serif; font-size:23px; line-height:1; }
.ca-logo::after{
  content:""; position:absolute; left:9px; bottom:10px; width:12px; height:3px;
  background:var(--av-ouro); border-radius:1px;
}

/* ============================================================
   Barra de abas (Ao Vivo | Biblioteca | Monitoria)
   Pílulas com a marca; sobrescreve o azul Tailwind do estado ativo.
   ============================================================ */
.ca-tab-strip{
  display:flex; flex-wrap:wrap; align-items:center; gap:6px;
  background:rgba(255,255,255,.04) !important;
  border:1px solid rgba(255,255,255,.08) !important;
  border-radius:16px !important; padding:6px !important; margin-bottom:18px;
}
.ca-tab-btn{
  padding:9px 18px !important; border-radius:11px !important;
  font-size:12.5px !important; font-weight:600 !important; letter-spacing:.02em;
  text-transform:none !important; color:#b9adc7 !important;
  background:transparent !important; border:none !important;
  display:inline-flex; align-items:center; gap:8px; cursor:pointer;
  transition:background .15s ease, color .15s ease;
}
.ca-tab-btn:hover{ color:#fff !important; background:rgba(255,255,255,.06) !important; }
.ca-tab-btn i{ font-size:13px; }
/* estado ativo (JS marca com .bg-blue-600) */
.ca-tab-strip .ca-tab-btn.bg-blue-600{
  background:var(--av-roxo) !important; color:#fff !important;
  box-shadow:inset 0 -2px 0 var(--av-ouro);
}

/* ---- Tema claro ---- */
body.theme-light .ca-tab-strip{
  background:#F3F1F6 !important; border-color:#E4E0EC !important;
}
body.theme-light .ca-tab-btn{ color:#6b6480 !important; }
body.theme-light .ca-tab-btn:hover{ color:var(--av-roxo) !important; background:#EAE5F1 !important; }
body.theme-light .ca-tab-strip .ca-tab-btn.bg-blue-600{ color:#fff !important; }

/* ============================================================
   Destaque "Ao Vivo" (hero) no topo da Biblioteca — sub-fase 2
   ============================================================ */
#view-aulas .ca-hero{ display:flex; gap:16px; align-items:center; border-radius:16px; padding:16px 18px; margin-bottom:18px; }
#view-aulas .ca-hero--live{ background:#1f1430; border:1px solid rgba(212,175,55,.25); }
#view-aulas .ca-hero--next{ background:rgba(255,255,255,.03); border:1px solid rgba(255,255,255,.08); }
#view-aulas .ca-hero-body{ flex:1; min-width:0; }
#view-aulas .ca-hero-badges{ display:flex; gap:8px; align-items:center; flex-wrap:wrap; margin-bottom:10px; }
#view-aulas .ca-hero-live{ display:inline-flex; align-items:center; gap:6px; background:#E0533F; color:#fff; font-size:11px; font-weight:700; padding:4px 11px; border-radius:999px; }
#view-aulas .ca-hero-soon{ display:inline-flex; align-items:center; gap:6px; color:var(--av-ouro); font-size:12px; font-weight:600; }
#view-aulas .ca-hero-title{ font-size:19px; font-weight:600; color:#fff !important; margin:0 0 4px; }
#view-aulas .ca-hero-meta{ color:rgba(255,255,255,.65) !important; font-size:13px; margin:0 0 14px; }
#view-aulas .ca-hero-cta{ background:var(--av-roxo); color:#fff; border:none; border-radius:11px; padding:11px 18px; font-size:13px; font-weight:600; display:inline-flex; align-items:center; gap:8px; cursor:pointer; transition:filter .15s ease; }
#view-aulas .ca-hero-cta:hover{ filter:brightness(1.1); }
#view-aulas .ca-hero-cta--ghost{ background:rgba(255,255,255,.1); }
#view-aulas .ca-hero-thumb{ width:200px; height:112px; border-radius:12px; background:#3a1659; display:flex; align-items:center; justify-content:center; position:relative; flex:0 0 auto; color:rgba(255,255,255,.5); font-size:30px; }
#view-aulas .ca-hero-thumb--next{ background:#2b2440; }
#view-aulas .ca-hero-tag{ position:absolute; left:8px; top:8px; background:#E0533F; color:#fff; font-size:10px; font-weight:700; padding:2px 7px; border-radius:6px; }
@media (max-width:680px){
  #view-aulas .ca-hero{ flex-direction:column-reverse; align-items:stretch; }
  #view-aulas .ca-hero-thumb{ width:100%; }
}
body.theme-light #view-aulas .ca-hero--live{ background:#FBF6FF; border-color:rgba(212,175,55,.5); }
body.theme-light #view-aulas .ca-hero--next{ background:#F7F5FA; border-color:#E4E0EC; }
body.theme-light #view-aulas .ca-hero-title{ color:var(--av-roxo) !important; }
body.theme-light #view-aulas .ca-hero-meta{ color:#6b6480 !important; }
body.theme-light #view-aulas .ca-hero-cta--ghost{ background:rgba(91,31,126,.1); color:var(--av-roxo); }
body.theme-light #view-aulas .ca-hero-thumb{ background:#EBDFF6; color:#9b7ec0; }
body.theme-light #view-aulas .ca-hero-thumb--next{ background:#EEE9F4; }

/* ============================================================
   Cards da Biblioteca — vídeo (miniatura) e pasta — sub-fase 3
   ============================================================ */
#view-aulas .ca-vcard{ background:#211a2b; border:1px solid rgba(255,255,255,.06); border-radius:14px; overflow:hidden; display:flex; flex-direction:column; padding:0 !important; transition:border-color .15s ease, transform .15s ease; }
#view-aulas .ca-vcard:hover{ border-color:rgba(155,111,212,.5); transform:translateY(-2px); }
#view-aulas .ca-vcard-thumb{ position:relative; width:100%; aspect-ratio:16/9; border:none; padding:0; margin:0; background:#2b2440; cursor:pointer; display:flex; align-items:center; justify-content:center; overflow:hidden; }
#view-aulas .ca-vcard-img{ width:100%; height:100%; object-fit:cover; transition:transform .25s ease; }
#view-aulas .ca-vcard-thumb:hover .ca-vcard-img{ transform:scale(1.05); }
#view-aulas .ca-vcard-play{ position:absolute; width:44px; height:44px; border-radius:50%; background:rgba(0,0,0,.45); color:#fff; display:flex; align-items:center; justify-content:center; font-size:15px; transition:background .15s ease; }
#view-aulas .ca-vcard-thumb:hover .ca-vcard-play{ background:var(--av-roxo); }
#view-aulas .ca-vcard-dur{ position:absolute; right:8px; bottom:8px; background:rgba(0,0,0,.72); color:#fff; font-size:11px; padding:2px 7px; border-radius:6px; }
#view-aulas .ca-vcard-body{ padding:11px 13px; display:flex; flex-direction:column; gap:5px; }
#view-aulas .ca-vcard-title{ font-size:14px; font-weight:600; color:#fff !important; margin:0; line-height:1.3; cursor:pointer; }
#view-aulas .ca-vcard-title:hover{ color:#d9c2ef !important; }
#view-aulas .ca-vcard-meta{ font-size:11.5px; color:rgba(255,255,255,.55) !important; margin:0; }
#view-aulas .ca-vcard-foot{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin-top:3px; }
#view-aulas .ca-vcard-rating{ display:inline-flex; align-items:center; gap:4px; color:var(--av-ouro); font-size:11.5px; font-weight:600; }
#view-aulas .ca-vcard-tag{ background:rgba(91,31,126,.32); color:#d9c2ef; font-size:10.5px; padding:2px 8px; border-radius:99px; }
#view-aulas .ca-vcard-flag{ margin-left:auto; background:transparent; border:none; color:rgba(255,255,255,.32); cursor:pointer; font-size:12px; padding:2px 4px; }
#view-aulas .ca-vcard-flag:hover{ color:#E0533F; }

#view-aulas .ca-fcard{ background:#211a2b; border:1px solid rgba(255,255,255,.06); border-radius:14px; overflow:hidden; padding:0 !important; transition:border-color .15s ease; }
#view-aulas .ca-fcard:hover{ border-color:rgba(212,175,55,.4); }
#view-aulas .ca-fcard-btn{ width:100%; display:flex; align-items:center; gap:13px; padding:15px; background:transparent; border:none; cursor:pointer; text-align:left; }
#view-aulas .ca-fcard-icon{ width:46px; height:46px; border-radius:12px; background:rgba(212,175,55,.14); color:var(--av-ouro); display:flex; align-items:center; justify-content:center; font-size:19px; flex:0 0 auto; }
#view-aulas .ca-fcard-info{ flex:1; min-width:0; display:flex; flex-direction:column; gap:2px; }
#view-aulas .ca-fcard-label{ font-size:10px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--av-ouro); }
#view-aulas .ca-fcard-title{ font-size:15px; font-weight:600; color:#fff; }
#view-aulas .ca-fcard-desc{ font-size:12px; color:rgba(255,255,255,.55); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
#view-aulas .ca-fcard-count{ font-size:11px; color:rgba(255,255,255,.5); }
#view-aulas .ca-fcard-chev{ color:rgba(255,255,255,.35); flex:0 0 auto; }

/* tema claro — cards */
body.theme-light #view-aulas .ca-vcard,
body.theme-light #view-aulas .ca-fcard{ background:#fff; border-color:#E4E0EC; }
body.theme-light #view-aulas .ca-vcard-title,
body.theme-light #view-aulas .ca-fcard-title{ color:#1F1F1F !important; }
body.theme-light #view-aulas .ca-vcard-meta{ color:#6b6480 !important; }
body.theme-light #view-aulas .ca-vcard-thumb{ background:#EBDFF6; }
body.theme-light #view-aulas .ca-vcard-play{ background:rgba(91,31,126,.55); }
body.theme-light #view-aulas .ca-vcard-tag{ background:rgba(91,31,126,.1); color:var(--av-roxo); }
body.theme-light #view-aulas .ca-vcard-flag{ color:#b0a8bd; }
body.theme-light #view-aulas .ca-fcard-desc,
body.theme-light #view-aulas .ca-fcard-count{ color:#8a8398; }

/* ============================================================
   "Continue assistindo" (prateleira) + faixa de Monitoria — sub-fase 4
   ============================================================ */
#view-aulas .ca-shelf{ margin-bottom:18px; }
#view-aulas .ca-shelf-head{ display:flex; align-items:center; justify-content:space-between; margin-bottom:10px; }
#view-aulas .ca-shelf-title{ font-size:15px; font-weight:600; color:#fff !important; margin:0; display:flex; align-items:center; gap:8px; }
#view-aulas .ca-shelf-title i{ color:var(--av-ouro); font-size:13px; }
#view-aulas .ca-shelf-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(190px,1fr)); gap:12px; }
body.theme-light #view-aulas .ca-shelf-title{ color:#1F1F1F !important; }

#view-aulas .ca-moni-band{ display:flex; align-items:center; gap:14px; background:#241830; border:1px solid rgba(255,255,255,.07); border-left:3px solid var(--av-ouro); border-radius:14px; padding:15px 16px; margin-top:20px; }
#view-aulas .ca-moni-icon{ width:44px; height:44px; border-radius:12px; background:var(--av-roxo); color:#fff; display:flex; align-items:center; justify-content:center; font-size:20px; flex:0 0 auto; }
#view-aulas .ca-moni-text{ flex:1; min-width:0; }
#view-aulas .ca-moni-title{ font-size:14px; font-weight:600; color:#fff; }
#view-aulas .ca-moni-sub{ font-size:12px; color:rgba(255,255,255,.6); margin-top:2px; }
#view-aulas .ca-moni-cta{ background:var(--av-roxo); color:#fff; border:none; border-radius:11px; padding:10px 18px; font-size:13px; font-weight:600; cursor:pointer; flex:0 0 auto; transition:filter .15s ease; white-space:nowrap; }
#view-aulas .ca-moni-cta:hover{ filter:brightness(1.1); }
@media (max-width:680px){
  #view-aulas .ca-moni-band{ flex-direction:column; align-items:flex-start; }
  #view-aulas .ca-moni-cta{ width:100%; }
}
body.theme-light #view-aulas .ca-moni-band{ background:#F7F5FA; border-color:#E4E0EC; border-left-color:var(--av-ouro); }
body.theme-light #view-aulas .ca-moni-title{ color:#1F1F1F; }
body.theme-light #view-aulas .ca-moni-sub{ color:#6b6480; }

/* ============================================================
   Aba AO VIVO (#view-aovivo) — harmonização da marca (CSS-only) — sub-fase 5
   Unifica as superfícies cinza do Tailwind e deixa o "Entrar" roxo.
   ============================================================ */
#view-aovivo [class*="bg-gray-800"]{ background:#211a2b !important; }
#view-aovivo [class*="bg-gray-900"]{ background:rgba(255,255,255,.02) !important; }
#view-aovivo [class*="bg-gray-950"]{ background:rgba(255,255,255,.04) !important; }
#view-aovivo .aovivo-card{ border-color:rgba(255,255,255,.06) !important; border-radius:16px !important; transition:border-color .15s ease, transform .15s ease; }
#view-aovivo .aovivo-card:hover{ border-color:rgba(155,111,212,.5) !important; transform:translateY(-2px); }
#view-aovivo .aovivo-card .text-blue-300{ color:var(--av-ouro) !important; }
#view-aovivo .aovivo-card-actions button[onclick^="abrirSalaAoVivo"]{ background:var(--av-roxo) !important; border-color:transparent !important; }
#view-aovivo .aovivo-card-actions button[onclick^="abrirSalaAoVivo"]:hover{ filter:brightness(1.1); }
#view-aovivo .aovivo-card-actions button[onclick^="abrirGravacaoAoVivo"]{ background:var(--av-roxo) !important; }
body.theme-light #view-aovivo [class*="bg-gray-800"]{ background:#fff !important; }
body.theme-light #view-aovivo [class*="bg-gray-900"]{ background:#FAF8FC !important; }
body.theme-light #view-aovivo [class*="bg-gray-950"]{ background:#F3F1F6 !important; }
body.theme-light #view-aovivo .aovivo-card{ border-color:#E4E0EC !important; }
body.theme-light #view-aovivo .aovivo-card .text-blue-300{ color:#9A7B12 !important; }

/* ============================================================
   Aba MONITORIA (#view-monitoria) — harmonização da marca — sub-fase 5
   Mantém o acento colorido por sala; unifica superfície + "Entrar" roxo.
   ============================================================ */
#view-monitoria #gridSalasMonitoria > div{ background:#211a2b !important; border-radius:16px !important; transition:border-color .15s ease, transform .15s ease; }
#view-monitoria #gridSalasMonitoria > div:hover{ transform:translateY(-2px); }
#view-monitoria #gridSalasMonitoria button[onclick*="entrarSalaMonitoria"]{ background:var(--av-roxo) !important; border-radius:12px !important; }
#view-monitoria #gridSalasMonitoria button[onclick*="entrarSalaMonitoria"]:hover{ filter:brightness(1.1); }
body.theme-light #view-monitoria #gridSalasMonitoria > div{ background:#fff !important; }

/* ============================================================
   Modal "Assistir aula" (#modalVisualizadorGenerico) — polimento
   ============================================================ */
#modalVisualizadorGenerico > .relative{ background:#17121d !important; border-color:rgba(255,255,255,.08) !important; border-radius:18px !important; max-width:1080px !important; }
.ca-watch{ background:#17121d; color:#F4F1F8; }
.ca-watch-head{ display:flex; align-items:flex-start; justify-content:space-between; gap:14px; padding:18px 20px; border-bottom:1px solid rgba(255,255,255,.07); }
.ca-watch-head-text{ min-width:0; }
.ca-watch-badges{ display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin-bottom:10px; }
.ca-watch-badge{ font-size:10.5px; font-weight:700; text-transform:uppercase; letter-spacing:.04em; padding:4px 10px; border-radius:999px; background:rgba(255,255,255,.08); color:#c9bcd6; }
.ca-watch-badge--live{ background:#E0533F; color:#fff; }
.ca-watch-badge--rec{ background:rgba(91,31,126,.45); color:#e7d6f7; }
.ca-watch-title{ font-size:22px; font-weight:600; color:#fff !important; margin:0; line-height:1.2; font-family:'Poppins','Inter',sans-serif; }
.ca-watch-sub{ font-size:12.5px; color:rgba(255,255,255,.55); margin:5px 0 0; }
.ca-watch-close{ width:40px; height:40px; border-radius:11px; background:rgba(255,255,255,.08); color:#fff; border:none; cursor:pointer; flex:0 0 auto; font-size:16px; transition:background .15s ease; }
.ca-watch-close:hover{ background:#E0533F; }
.ca-watch-body{ display:grid; grid-template-columns:minmax(0,1fr) 380px; }
.ca-watch-main{ padding:18px 20px; display:flex; flex-direction:column; gap:16px; min-width:0; }
.ca-watch-desc{ background:rgba(255,255,255,.03); border:1px solid rgba(255,255,255,.06); border-radius:14px; padding:14px 16px; }
.ca-watch-desc h4{ font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.08em; color:var(--av-ouro); margin:0 0 8px; }
.ca-watch-desc p{ font-size:14px; color:rgba(255,255,255,.8); white-space:pre-wrap; line-height:1.6; margin:0; }
.ca-watch-aside{ border-left:1px solid rgba(255,255,255,.07); padding:18px 20px; display:flex; flex-direction:column; gap:14px; background:rgba(0,0,0,.18); min-width:0; }
@media (max-width:900px){ .ca-watch-body{ grid-template-columns:1fr; } .ca-watch-aside{ border-left:none; border-top:1px solid rgba(255,255,255,.07); } }
/* harmoniza superfícies/realces internos (player fica preto) */
#modalVisualizadorGenerico [class*="bg-gray-800"],
#modalVisualizadorGenerico [class*="bg-gray-900"],
#modalVisualizadorGenerico [class*="bg-gray-950"]{ background:rgba(255,255,255,.04) !important; }
#modalVisualizadorGenerico .text-blue-300,
#modalVisualizadorGenerico .text-blue-200{ color:var(--av-ouro) !important; }
/* tema claro */
body.theme-light #modalVisualizadorGenerico > .relative{ background:#fff !important; border-color:#E4E0EC !important; }
body.theme-light .ca-watch{ background:#fff; color:#1F1F1F; }
body.theme-light .ca-watch-title{ color:#1F1F1F !important; }
body.theme-light .ca-watch-sub{ color:#6b6480; }
body.theme-light .ca-watch-head{ border-color:#ECE8F2; }
body.theme-light .ca-watch-badge{ background:#F1EFF4; color:#6b6480; }
body.theme-light .ca-watch-desc{ background:#F7F5FA; border-color:#ECE8F2; }
body.theme-light .ca-watch-desc p{ color:#3a3646; }
body.theme-light .ca-watch-aside{ background:#FAF8FC; border-color:#ECE8F2; }
body.theme-light .ca-watch-close{ background:#F1EFF4; color:#1F1F1F; }
body.theme-light #modalVisualizadorGenerico [class*="bg-gray-800"],
body.theme-light #modalVisualizadorGenerico [class*="bg-gray-900"],
body.theme-light #modalVisualizadorGenerico [class*="bg-gray-950"]{ background:#F4F2F7 !important; }

/* ============================================================
   Organização da Biblioteca — barra de filtros + toolbar — polimento
   ============================================================ */
#view-aulas .ca-filterbar{ background:rgba(255,255,255,.03) !important; border-color:rgba(255,255,255,.07) !important; border-radius:14px !important; }
#view-aulas .ca-filterbar select,
#view-aulas .ca-filterbar input{ background:rgba(255,255,255,.05) !important; border-color:rgba(255,255,255,.1) !important; border-radius:10px !important; }
#view-aulas .ca-toolbar{ display:flex; flex-direction:column; gap:10px; background:rgba(255,255,255,.03); border:1px solid rgba(255,255,255,.07); border-radius:14px; padding:12px 14px; margin-bottom:14px; }
#view-aulas .ca-toolbar-row{ display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:10px; }
#view-aulas .ca-toolbar-nav{ min-width:0; }
#view-aulas .ca-toolbar-title{ font-size:16px; font-weight:600; color:#fff !important; margin:3px 0 0; }
#view-aulas .ca-toolbar-actions{ display:flex; flex-wrap:wrap; gap:8px; align-items:center; }
#view-aulas .ca-toolbar-btn{ padding:8px 14px; border-radius:10px; background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.1); color:#d9cfe4; font-size:12px; font-weight:600; cursor:pointer; transition:background .15s ease; }
#view-aulas .ca-toolbar-btn:hover{ background:rgba(255,255,255,.1); }
#view-aulas .ca-toolbar-btn--gold{ background:var(--av-ouro); color:#3a2c00; border-color:transparent; }
#view-aulas .ca-toolbar-btn--gold:hover{ filter:brightness(1.05); background:var(--av-ouro); }
#view-aulas .ca-toolbar-hint{ font-size:11.5px; color:#c9bcd6; background:rgba(91,31,126,.18); border:1px solid rgba(91,31,126,.3); border-radius:10px; padding:8px 12px; }
body.theme-light #view-aulas .ca-filterbar{ background:#F7F5FA !important; border-color:#E4E0EC !important; }
body.theme-light #view-aulas .ca-filterbar select,
body.theme-light #view-aulas .ca-filterbar input{ background:#fff !important; border-color:#E4E0EC !important; }
body.theme-light #view-aulas .ca-toolbar{ background:#F7F5FA; border-color:#E4E0EC; }
body.theme-light #view-aulas .ca-toolbar-title{ color:#1F1F1F !important; }
body.theme-light #view-aulas .ca-toolbar-btn{ background:#fff; border-color:#E4E0EC; color:#5b5470; }
body.theme-light #view-aulas .ca-toolbar-hint{ color:var(--av-roxo); background:rgba(91,31,126,.08); border-color:rgba(91,31,126,.2); }

/* ============================================================
   Modal SALA AO VIVO (#modalAoVivo) — redesign (sempre escuro: foco vídeo/chat)
   ============================================================ */
#modalAoVivo > .relative{ background:#17121d !important; border-color:rgba(255,255,255,.08) !important; border-radius:18px !important; }
#modalAoVivo [class*="bg-gray-950"],
#modalAoVivo [class*="bg-gray-900"],
#modalAoVivo [class*="bg-gray-800"]{ background:rgba(255,255,255,.03) !important; }
#modalAoVivo [class*="border-gray-7"],
#modalAoVivo [class*="border-gray-8"]{ border-color:rgba(255,255,255,.08) !important; }
#modalAoVivo #aoVivoModalTitulo{ font-family:'Poppins','Inter',sans-serif; }
#modalAoVivo button[onclick^="registrarPresenca"],
#modalAoVivo button[onclick^="enviarMensagem"]{ background:var(--av-roxo) !important; border-radius:11px !important; }
#modalAoVivo button[onclick^="registrarPresenca"]:hover,
#modalAoVivo button[onclick^="enviarMensagem"]:hover{ filter:brightness(1.1); }
#modalAoVivo #aoVivoInput{ border-radius:11px !important; }
#modalAoVivo #aoVivoInput:focus{ border-color:var(--av-roxo) !important; }
#modalAoVivo #aoVivoMensagens .bg-blue-600{ background:var(--av-roxo) !important; }
#modalAoVivo #aoVivoMensagens .bg-gray-800{ background:rgba(255,255,255,.07) !important; }
#modalAoVivo #aoVivoControlesGestao{ background:rgba(91,31,126,.12) !important; border-color:rgba(155,111,212,.3) !important; }