/* ============================================================
   Livel — TEMA POR ANDAR (floor theme)
   Fonte ÚNICA das cores de andar do Design System Livel v2.
   1º Studio ROXO #632465 · 2º Pilates DOURADO #D4A017 · 3º Funcional LARANJA #FF914D

   Aplica-se a qualquer container com data-floor:
     .crm-module (Agenda) · #view-aval (Aula-avaliação)
     #view-pil / #view-func (Acompanhamento) · #view-coord (CRM) · body (nav)

   Regra "roxo lidera": a cor do andar tinge fundo, bordas e rótulos —
   NUNCA o botão de ação primário, que permanece roxo em todos os andares.
   ============================================================ */

/* --- Paleta ------------------------------------------------ */
/* --floor      cor sólida do andar (linhas, medidores, ícones)
   --floor-ink  variante escura, legível como texto sobre branco
   --floor-dim  preenchimento translúcido (cabeçalhos, hovers)
   --floor-bg   FUNDO do módulo — é o que dá a identidade do andar
   --floor-soft fundo dos painéis laterais (quase branco, mesma família)
   --floor-brd  bordas e réguas tingidas                              */

[data-floor]{--floor:#632465;--floor-ink:#632465;--floor-dim:rgba(99,36,101,.13);--floor-bg:#F0E6F1;--floor-soft:#FBF6FB;--floor-brd:rgba(99,36,101,.20)}
[data-floor="studio"]{--floor:#632465;--floor-ink:#632465;--floor-dim:rgba(99,36,101,.13);--floor-bg:#F0E6F1;--floor-soft:#FBF6FB;--floor-brd:rgba(99,36,101,.20)}
[data-floor="pilates"]{--floor:#D4A017;--floor-ink:#7D5B0C;--floor-dim:rgba(212,160,23,.20);--floor-bg:#F8EFD4;--floor-soft:#FDF9EC;--floor-brd:rgba(155,114,9,.26)}
[data-floor="funcional"]{--floor:#FF914D;--floor-ink:#B04A0E;--floor-dim:rgba(255,145,77,.20);--floor-bg:#FCEADA;--floor-soft:#FFF8F2;--floor-brd:rgba(176,74,14,.22)}
/* CRM sem andar selecionado: fundo neutro (cinza), acentos roxos — como hoje */
[data-floor="all"]{--floor:#632465;--floor-ink:#632465;--floor-dim:rgba(99,36,101,.10);--floor-bg:#FAF9F5;--floor-soft:#fff;--floor-brd:rgba(81,77,66,.14)}

/* --- Fundo dos módulos ------------------------------------- */
#view-aval[data-floor],#view-pil[data-floor],#view-func[data-floor],#view-coord[data-floor]{
  background:var(--floor-bg);transition:background-color .35s ease
}
/* os painéis deixam o fundo do andar transparecer */
#view-aval .panel-center,#view-pil .panel-center,#view-func .layout-func,#view-coord .panel-center{background:transparent}
#view-aval .panel-left,#view-aval .panel-right,
#view-pil .panel-left,#view-pil .panel-right,
#view-func .panel-left,
#view-coord .panel-left,#view-coord .panel-right{
  background:var(--floor-soft);border-color:var(--floor-brd);
  transition:background-color .35s ease,border-color .35s ease
}
/* rótulos de secção acompanham o andar */
#view-aval .sec,#view-pil .sec,#view-func .sec,#view-coord .sec{color:var(--floor-ink)}

/* --- Aula-avaliação ---------------------------------------- */
#view-aval .eval-context-bar{
  background:color-mix(in srgb,var(--floor-bg) 42%,#fff);
  border-bottom-color:var(--floor-brd);
  transition:background-color .35s ease,border-color .35s ease
}
#view-aval .eval-context-eyebrow{color:var(--floor-ink)}
#view-aval .pr-h{color:var(--floor-ink)}
#view-aval .pr-h::after{background:var(--floor-brd)}
/* O boneco anatómico é um bitmap com fundo branco chapado. Sobre o fundo tingido
   do andar isso lia-se como dois retângulos brancos soltos. Solução: uma única
   placa branca (com canto arredondado e borda do andar) que acolhe as duas vistas —
   o branco da imagem funde-se com o do cartão e o quadrado desaparece.
   Fade não serve aqui: a figura quase toca as margens do bitmap e as mãos seriam comidas. */
#view-aval .bodies-wrap{
  max-width:512px;background:#fff;border:1px solid var(--floor-brd);border-radius:18px;
  padding:14px 10px;box-shadow:0 3px 16px rgba(42,38,34,.05);
  transition:border-color .35s ease
}

/* --- Acompanhamento: Pilates (2º) --------------------------- */
#view-pil .pil-card{border-color:var(--floor-brd)}
#view-pil .pil-card-h::after,#view-pil .pr-h::after{background:var(--floor-brd)}
#view-pil .pr-h{color:var(--floor-ink)}

/* --- Acompanhamento: Funcional (3º) ------------------------- */
/* NB: .func-status-card mantém a barra lateral laranja sólida — não tocar. */
#view-func .func-kpi,#view-func .func-profile{border-color:var(--floor-brd)}

/* --- CRM ---------------------------------------------------- */
#view-coord .coord-command-center,#view-coord .sales-briefing-queue{
  background:transparent;border-bottom-color:var(--floor-brd);transition:border-color .35s ease
}
#view-coord .coord-command-eyebrow{color:var(--floor-ink)}
#view-coord .coord-command-title::after{color:var(--floor)}

/* --- Barra superior: fio da cor do andar -------------------- */
body[data-floor] .nav::after{
  content:'';position:absolute;left:0;right:0;bottom:0;height:3px;
  background:var(--floor);transition:background-color .35s ease
}
/* --- Navegação inferior (mobile): aba activa na cor do andar --- */
body[data-floor] .mob-tab.active{color:var(--floor-ink)}
body[data-floor] .mob-tab.active::before{background:var(--floor)}

@media(prefers-reduced-motion:reduce){
  #view-aval[data-floor],#view-pil[data-floor],#view-func[data-floor],#view-coord[data-floor],
  #view-aval .eval-context-bar,#view-aval .panel-left,#view-aval .panel-right,
  #view-pil .panel-left,#view-pil .panel-right,#view-func .panel-left,
  #view-coord .panel-left,#view-coord .panel-right,
  #view-coord .coord-command-center,body[data-floor] .nav::after{transition:none}
}