/* ==========================================================================
   iAcondo — IDENTIDADE VISUAL
   Arquivo: /var/www/iacondo.net/public_html/css/identidade.css

   Cor da marca: VERDE-PETRÓLEO #0E6E63
   Escolhida em 08/09/2026 para o iAcondo deixar de usar o azul padrão do
   Bootstrap (#0d6efd), que é o mesmo de qualquer site sem identidade própria.

   COMO ESTE ARQUIVO FUNCIONA
   Ele é carregado por último, depois do Bootstrap, do style.css e do
   painel.css / public-site.css. Por isso consegue trocar a cor de tudo
   sem que nenhum dos outros arquivos precise ser alterado.

   COMO DESFAZER
   Basta apagar a linha que carrega este arquivo no includes/cabecalho.php.
   Nada mais precisa ser mexido — o site volta ao azul de antes.

   COMO TROCAR A COR NO FUTURO
   Altere apenas os valores do bloco "PALETA" logo abaixo.

   REVISAO DE 08/09/2026 (parte da tarde)
   Acrescentado o bloco 6, que corrige textos apagados demais para ler.
   Todos os numeros citados la foram medidos, nao estimados.
   ========================================================================== */


/* ---------------------------------------------------------------
   PALETA
   --------------------------------------------------------------- */
:root{
    /* Verde-petróleo — tema claro */
    --iacondo-marca:         #0E6E63;
    --iacondo-marca-clara:   #14887A;
    --iacondo-marca-escura:  #0A544B;
    --iacondo-marca-mais-escura:#08453E;
    --iacondo-marca-rgb:     14, 110, 99;

    /* Fundos suaves derivados da marca */
    --iacondo-marca-fundo:   #E4F1EF;
    --iacondo-marca-borda:   #B7DBD5;
}


/* ---------------------------------------------------------------
   1) PAINEL INTERNO  (painel.css usa as variáveis --iac-*)
   --------------------------------------------------------------- */
:root{
    --iac-primary:      #0E6E63;
    --iac-primary-2:    #14887A;
    --iac-primary-dark: #0A544B;
    --iac-primary-soft: rgba(14, 110, 99, .10);
    --iac-primary-glow: rgba(14, 110, 99, .20);

    /* Usado pelo painel.css em rgba(var(--iac-primary-rgb), X).
       É o que faz as bordas e sombras seguirem o tema claro/escuro. */
    --iac-primary-rgb: 14, 110, 99;

    /* Cinza do texto secundário do painel.
       O valor antigo era #6a7890. Medido sobre o branco do cartão,
       dava 4,43:1 — abaixo do mínimo de 4,5:1 exigido para texto
       normal. É a cor de quase todo texto de apoio do sistema:
       "text-muted" aparece 608 vezes nas telas internas.
       O valor abaixo dá 5,51:1 e continua sendo claramente um
       cinza secundário, sem competir com o texto principal. */
    --iac-muted: #5B6980;
}

/* No tema escuro o verde precisa clarear para continuar legível. */
html[data-iac-theme="dark"]{
    --iac-primary:      #4FB8A9;
    --iac-primary-2:    #6CCBBD;
    --iac-primary-dark: #2E9384;
    --iac-primary-soft: rgba(79, 184, 169, .16);
    --iac-primary-glow: rgba(79, 184, 169, .26);
    --iac-primary-rgb: 79, 184, 169;
}


/* ---------------------------------------------------------------
   2) SITE PÚBLICO  (public-site.css usa as variáveis --iacondo-*)
   --------------------------------------------------------------- */
:root{
    --iacondo-primary:      #0E6E63;
    --iacondo-primary-dark: #0A544B;
}

/* Três lugares do site público têm a cor escrita à mão, então
   precisam ser reescritos aqui. */
.signup-form-icon{
    background: linear-gradient(135deg, #0E6E63 0%, #17A08F 100%);
}

.iacondo-chip{
    background: #E4F1EF;
    color: #0A544B;
}

.iacondo-public-main .form-control:focus,
.iacondo-public-main .form-select:focus{
    border-color: #7FC4BA;
    box-shadow: 0 0 0 4px rgba(14, 110, 99, .12) !important;
}


/* ---------------------------------------------------------------
   3) BOOTSTRAP 5.3
   O Bootstrap vem do CDN com o azul embutido. Aqui trocamos as
   variáveis dele, que é a forma recomendada pela própria biblioteca.
   --------------------------------------------------------------- */
:root{
    --bs-primary:               #0E6E63;
    --bs-primary-rgb:           14, 110, 99;
    --bs-primary-text-emphasis: #08453E;
    --bs-primary-bg-subtle:     #E4F1EF;
    --bs-primary-border-subtle: #B7DBD5;

    --bs-link-color:            #0E6E63;
    --bs-link-color-rgb:        14, 110, 99;
    --bs-link-hover-color:      #0A544B;
    --bs-link-hover-color-rgb:  10, 84, 75;

    --bs-focus-ring-color:      rgba(14, 110, 99, .25);
}

/* Botão sólido */
.btn-primary{
    --bs-btn-bg:                   #0E6E63;
    --bs-btn-border-color:         #0E6E63;
    --bs-btn-hover-bg:             #0A544B;
    --bs-btn-hover-border-color:   #0A544B;
    --bs-btn-active-bg:            #08453E;
    --bs-btn-active-border-color:  #08453E;
    --bs-btn-disabled-bg:          #0E6E63;
    --bs-btn-disabled-border-color:#0E6E63;
    --bs-btn-focus-shadow-rgb:     14, 110, 99;
}

/* Botão vazado */
.btn-outline-primary{
    --bs-btn-color:                #0A544B;
    --bs-btn-border-color:         #0E6E63;
    --bs-btn-hover-bg:             #0E6E63;
    --bs-btn-hover-border-color:   #0E6E63;
    --bs-btn-active-bg:            #0A544B;
    --bs-btn-active-border-color:  #0A544B;
    --bs-btn-disabled-color:       #0E6E63;
    --bs-btn-disabled-border-color:#0E6E63;
    --bs-btn-focus-shadow-rgb:     14, 110, 99;
}

/* Utilitários de cor
   NÃO sobrescrever .text-primary, .bg-primary e .border-primary aqui.
   No Bootstrap 5.3 essas classes são montadas assim:
       background-color: rgba(var(--bs-primary-rgb), var(--bs-bg-opacity));
   As variáveis definidas acima já as deixam verdes, E preservam os
   utilitários de opacidade (bg-opacity-10, text-opacity-75 e afins).
   Escrever a cor chapada aqui quebrava esses utilitários: em 08/09/2026
   isso apagou os ícones da página inicial, porque o quadrado com
   "bg-primary bg-opacity-10" virava verde sólido e o ícone, que é
   "text-primary", ficava exatamente da mesma cor do fundo. */

/* Alertas */
.alert-primary{
    --bs-alert-color:        #08453E;
    --bs-alert-bg:           #E4F1EF;
    --bs-alert-border-color: #B7DBD5;
    --bs-alert-link-color:   #063A34;
}

/* Formulários */
.form-control:focus,
.form-select:focus{
    border-color: #7FC4BA;
    box-shadow: 0 0 0 .25rem rgba(14, 110, 99, .18);
}
.form-check-input:checked{
    background-color:#0E6E63;
    border-color:#0E6E63;
}
.form-check-input:focus{
    border-color:#7FC4BA;
    box-shadow: 0 0 0 .25rem rgba(14, 110, 99, .18);
}
.form-switch .form-check-input:focus{
    border-color:#7FC4BA;
}
.form-range::-webkit-slider-thumb{ background-color:#0E6E63; }
.form-range::-moz-range-thumb{ background-color:#0E6E63; }

/* Navegação, listas e paginação */
.nav-pills .nav-link.active,
.nav-pills .show > .nav-link{ background-color:#0E6E63; }
.list-group-item.active{
    background-color:#0E6E63;
    border-color:#0E6E63;
}
.dropdown-item.active,
.dropdown-item:active{ background-color:#0E6E63; }
.page-link{ color:#0E6E63; }
.page-item.active .page-link{
    background-color:#0E6E63;
    border-color:#0E6E63;
}

/* Progresso e carregamento */
.progress-bar{ background-color:#0E6E63; }
.spinner-border.text-primary,
.spinner-grow.text-primary{ color:#0E6E63 !important; }

/* Foco visível pelo teclado — acessibilidade */
.btn:focus-visible,
a:focus-visible,
button:focus-visible{
    outline: 2px solid #0E6E63;
    outline-offset: 2px;
}


/* ---------------------------------------------------------------
   4) A COR "INFO" DO BOOTSTRAP
   O Bootstrap tem duas cores azuladas. A "primary" foi trocada
   acima. A "info" era um ciano (#0dcaf0) usado em 40 lugares do
   sistema — avisos e etiquetas de status, como o selo "Verificando".
   Aqui ela vira um azul-petróleo, que conversa com a marca sem se
   confundir com ela nem com o verde de "sucesso".
   --------------------------------------------------------------- */
:root{
    --bs-info:               #2E7D8F;
    --bs-info-rgb:           46, 125, 143;
    --bs-info-text-emphasis: #1E5361;
    --bs-info-bg-subtle:     #E3EFF2;
    --bs-info-border-subtle: #B9D6DD;
}

/* Mesma regra vale aqui: --bs-info-rgb acima já pinta .text-info,
   .bg-info e .border-info, sem quebrar a opacidade. */

.btn-info{
    --bs-btn-bg:                   #2E7D8F;
    --bs-btn-border-color:         #2E7D8F;
    --bs-btn-color:                #fff;
    --bs-btn-hover-bg:             #256B7B;
    --bs-btn-hover-border-color:   #1E5361;
    --bs-btn-active-bg:            #1E5361;
    --bs-btn-active-border-color:  #1E5361;
    --bs-btn-focus-shadow-rgb:     46, 125, 143;
}

.alert-info{
    --bs-alert-color:        #1E5361;
    --bs-alert-bg:           #E3EFF2;
    --bs-alert-border-color: #B9D6DD;
    --bs-alert-link-color:   #16414C;
}

/* A etiqueta de status "Verificando" e as demais bg-info sobre fundo
   claro precisam de texto branco para continuarem legíveis. */
.badge.bg-info,
.badge.text-bg-info{ color:#fff !important; }


/* ---------------------------------------------------------------
   5) TEXTO DENTRO DE FAIXAS COLORIDAS

   O site público pinta TODO parágrafo de cinza e todo título grande
   de azul-escuro, sem olhar a cor do fundo:

       .iacondo-public-main p { color: var(--iacondo-muted); }

   Dentro de uma faixa colorida isso deixa o texto quase invisível.
   Medido na página inicial em 08/09/2026, antes desta correção:

       título    #172033 sobre #0E6E63  ->  contraste 2,66:1
       subtítulo #68758A sobre #0E6E63  ->  contraste 1,31:1

   A norma de acessibilidade pede no mínimo 4,5:1 para texto normal
   e 3:1 para texto grande. Havia um remendo no public-site.css para
   três faixas específicas, mas as seções comuns "bg-primary text-white"
   ficaram de fora — e são 30 arquivos.

   A regra abaixo devolve o branco para qualquer texto dentro de uma
   faixa de cor, sem tocar nos botões, que têm cor própria.
   --------------------------------------------------------------- */
.iacondo-public-main :is(.bg-primary, .bg-dark, .text-bg-primary, .iacondo-cta-section, .cta-band-reservas, .cta-band-chamados) {
    color: #fff;
}

.iacondo-public-main :is(.bg-primary, .bg-dark, .text-bg-primary, .iacondo-cta-section, .cta-band-reservas, .cta-band-chamados)
:is(h1, h2, h3, h4, h5, h6, p, li, .lead, .small, .display-1, .display-2, .display-3, .display-4, .display-5, .display-6) {
    color: #fff;
}

/* Texto secundário dentro da faixa: branco com leve transparência,
   ainda muito acima do mínimo de contraste. */
.iacondo-public-main :is(.bg-primary, .bg-dark, .text-bg-primary, .iacondo-cta-section)
:is(.text-muted, .text-secondary, .small.text-muted) {
    color: rgba(255, 255, 255, .86) !important;
}

/* Os botões dentro da faixa mantêm a cor deles. */
.iacondo-public-main :is(.bg-primary, .bg-dark, .text-bg-primary, .iacondo-cta-section) .btn-light,
.iacondo-public-main :is(.bg-primary, .bg-dark, .text-bg-primary, .iacondo-cta-section) .cta-btn-white {
    color: #0A544B !important;
}


/* ---------------------------------------------------------------
   6) TEXTOS APAGADOS DEMAIS PARA LER  (08/09/2026)

   Medição feita nas telas internas (painel), nos dois temas.
   A norma de acessibilidade pede 4,5:1 para texto normal.

   TEMA CLARO — o que estava errado
     .text-warning  #ffc107 sobre branco ....... 1,63:1   (invisível)
     --iac-muted    #6a7890 sobre o cartão ..... 4,43:1   (abaixo do mínimo)

   O amarelo do Bootstrap foi feito para ser FUNDO, não texto.
   Usado como cor de letra sobre branco ele praticamente some.
   Aparece assim em 9 telas (dispositivos, comunicados, marketing,
   gerenciar dispositivos, editar usuário...).

   TEMA ESCURO — o que estava errado
   O painel escuro é ligado por "data-iac-theme=dark", que é uma
   marcação do próprio iAcondo. O Bootstrap não sabe dela — ele só
   entende "data-bs-theme". Resultado: no escuro o Bootstrap continuava
   usando as cores do tema claro, e elas ficam fracas sobre fundo escuro:

     .text-success   #198754 sobre o painel escuro ... 3,37:1
     .text-danger    #dc3545 sobre o painel escuro ... 3,37:1
     .text-secondary #6c757d sobre o painel escuro ... 3,25:1
     --iac-red       #c0392b sobre o painel escuro ... 2,80:1

   Abaixo, cada uma dessas cores é trocada por uma versão que passa
   com folga. Os números novos estão anotados em cada linha.

   O QUE NÃO FOI MEXIDO, DE PROPÓSITO
   - .bg-warning e .badge.bg-warning continuam amarelos. Como FUNDO
     o amarelo funciona bem; o problema era só quando vira letra.
   - --iac-green (#137a56) continua igual: no painel ele é usado como
     fundo do botão "Salvar/Confirmar", com letra branca por cima
     (5,31:1). Clarear essa cor estragaria justamente esse botão.
   - .text-success no tema claro (4,53:1) já passa e ficou como estava.
   --------------------------------------------------------------- */

/* --- Tema claro --- */

/* Amarelo como letra: vira âmbar escuro. 5,28:1 sobre branco. */
.text-warning{ color:#9C5D00 !important; }

/* O ícone dentro de um badge amarelo continua escuro, como já era. */
.badge.bg-warning .text-warning,
.badge.text-bg-warning .text-warning{ color:inherit !important; }


/* --- Tema escuro do painel --- */
html[data-iac-theme="dark"]{
    /* Vermelho de "excluir/atenção". Antes 2,80:1, agora 6,91:1. */
    --iac-red: #FF8F85;
}

html[data-iac-theme="dark"] .text-success{ color:#5CD0A6 !important; }  /* 8,01:1 */
html[data-iac-theme="dark"] .text-danger { color:#FF8F85 !important; }  /* 6,91:1 */
html[data-iac-theme="dark"] .text-warning{ color:#E8AD4E !important; }  /* 7,64:1 */

html[data-iac-theme="dark"] .text-secondary,
html[data-iac-theme="dark"] .text-body-secondary{ color:#A7B5C8 !important; }  /* 7,32:1 */

/* Dentro de uma etiqueta colorida a letra continua sendo a da etiqueta. */
html[data-iac-theme="dark"] .badge .text-success,
html[data-iac-theme="dark"] .badge .text-danger,
html[data-iac-theme="dark"] .badge .text-warning,
html[data-iac-theme="dark"] .badge .text-secondary{ color:inherit !important; }

/* ===========================================================================
   7. Correcoes de uso encontradas testando o produto  (09/09/2026)
   =========================================================================== */

/* --- Link que virava botao invisivel ------------------------------------
   O .btn-link do Bootstrap 5.3 pega a cor de uma variavel propria dele
   (--bs-btn-color). Em algumas telas essa variavel nao chega, e o texto
   ficava branco no branco - o "Voltar para o login" simplesmente sumia.
   O .btn-link e usado em 6 paginas do site; esta regra vale para todas. */
.btn-link{
    --bs-btn-color:       var(--iac-primary, #0E6E63);
    --bs-btn-hover-color: var(--iac-primary-dark, #0A544B);
    color: var(--iac-primary, #0E6E63) !important;
}
.btn-link:hover,
.btn-link:focus{
    color: var(--iac-primary-dark, #0A544B) !important;
}
html[data-iac-theme="dark"] .btn-link,
html[data-iac-theme="dark"] .btn-link:hover{
    color: #7FD6C6 !important;
}

/* --- Aviso de pendencia nas abas do modulo ------------------------------
   A aba "TVs e agenda" nao dava nenhum sinal de que havia televisao
   esperando liberacao. O cliente autorizava a TV so quando lembrava de
   entrar ali. Agora a aba mostra a contagem e pisca. */
.iac-v3-module-tabs a{
    position: relative;
}
.iac-aba-alerta{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.35rem;
    height: 1.35rem;
    padding: 0 .35rem;
    margin-left: .45rem;
    border-radius: 999px;
    background: #C62828;
    color: #fff !important;
    font-size: .72rem;
    font-weight: 800;
    line-height: 1;
    vertical-align: middle;
    box-shadow: 0 0 0 0 rgba(198, 40, 40, .65);
    animation: iacPulsaAlerta 1.8s ease-out infinite;
}
@keyframes iacPulsaAlerta{
    0%   { box-shadow: 0 0 0 0    rgba(198, 40, 40, .65); }
    70%  { box-shadow: 0 0 0 .6rem rgba(198, 40, 40, 0); }
    100% { box-shadow: 0 0 0 0    rgba(198, 40, 40, 0); }
}

/* Quem prefere menos movimento na tela nao ve a pulsacao. */
@media (prefers-reduced-motion: reduce){
    .iac-aba-alerta{ animation: none; }
}

/* --- Dia do calendario de reservas clicavel ----------------------------- */
.reservas-calendar-day{
    position: relative;
}
.iac-dia-novo{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.5rem;
    height: 1.5rem;
    border-radius: 999px;
    border: 1px dashed var(--iac-primary, #0E6E63);
    color: var(--iac-primary, #0E6E63);
    font-size: .95rem;
    line-height: 1;
    text-decoration: none;
    opacity: 0;
    transition: opacity .15s ease-in-out;
}
.reservas-calendar-day:hover .iac-dia-novo,
.iac-dia-novo:focus{
    opacity: 1;
}
.iac-dia-novo:hover{
    background: var(--iac-primary, #0E6E63);
    color: #fff;
}

/* Em telas de toque nao existe "passar o mouse": o botao fica sempre visivel. */
@media (hover: none){
    .iac-dia-novo{ opacity: .65; }
}

/* --- Botão "Concluir" que só aparecia ao passar o mouse ------------------
   (09/09/2026)

   O tema do painel dá cor explícita a .btn-outline-primary, -secondary e
   -danger, mas nunca definiu o -success. Ele caía no padrão do Bootstrap e,
   dentro do painel, ficava sem contraste nenhum: o botão de concluir tarefa
   só aparecia quando o mouse passava por cima - e nesse ponto a pessoa já
   estava clicando às cegas.

   Aqui fechamos as três variantes que faltavam, para o mesmo buraco não
   voltar em outra tela. */
.iac-v3-body .btn-outline-success{
    color: var(--iac-green, #137a56);
    border-color: rgba(19, 122, 86, .45);
    background: transparent;
}
.iac-v3-body .btn-outline-success:hover,
.iac-v3-body .btn-outline-success:focus{
    color: #fff;
    background: var(--iac-green, #137a56);
    border-color: var(--iac-green, #137a56);
}

.iac-v3-body .btn-outline-warning{
    color: #9C5D00;
    border-color: rgba(156, 93, 0, .45);
    background: transparent;
}
.iac-v3-body .btn-outline-warning:hover,
.iac-v3-body .btn-outline-warning:focus{
    color: #fff;
    background: #9C5D00;
    border-color: #9C5D00;
}

.iac-v3-body .btn-outline-info{
    color: var(--iac-primary, #0E6E63);
    border-color: rgba(var(--iac-primary-rgb, 14, 110, 99), .40);
    background: transparent;
}
.iac-v3-body .btn-outline-info:hover,
.iac-v3-body .btn-outline-info:focus{
    color: #fff;
    background: var(--iac-primary, #0E6E63);
    border-color: var(--iac-primary, #0E6E63);
}

/* Tema escuro do painel: as mesmas três, com contraste sobre fundo escuro. */
html[data-iac-theme="dark"] .iac-v3-body .btn-outline-success{
    color: #5CD0A6;
    border-color: rgba(92, 208, 166, .45);
}
html[data-iac-theme="dark"] .iac-v3-body .btn-outline-success:hover{
    color: #06251C;
    background: #5CD0A6;
    border-color: #5CD0A6;
}
html[data-iac-theme="dark"] .iac-v3-body .btn-outline-warning{
    color: #E8AD4E;
    border-color: rgba(232, 173, 78, .45);
}
html[data-iac-theme="dark"] .iac-v3-body .btn-outline-info{
    color: #7FD6C6;
    border-color: rgba(127, 214, 198, .45);
}

/* --- Aviso de que a tarefa se repete ------------------------------------ */
.iac-tarefa-repete{
    display: inline-flex;
    align-items: center;
    gap: .25rem;
    margin-left: .4rem;
    padding: .1rem .45rem;
    border-radius: 999px;
    border: 1px solid rgba(var(--iac-primary-rgb, 14, 110, 99), .35);
    color: var(--iac-primary, #0E6E63);
    font-size: .68rem;
    font-weight: 700;
    white-space: nowrap;
    vertical-align: middle;
}
html[data-iac-theme="dark"] .iac-tarefa-repete{
    color: #7FD6C6;
    border-color: rgba(127, 214, 198, .35);
}

/* --- Cinco botões de chamada para ação que não existiam -----------------
   (09/09/2026)

   A classe .cta-btn-outline-white é usada nas faixas finais de cinco
   páginas comerciais — blog, demo, helpdesk, reservas e TV corporativa —
   nos botões de WhatsApp e "Ver preço". Ela NUNCA foi definida em CSS
   nenhum. O par dela, .cta-btn-white, existe; esta ficou de fora.

   Resultado: o botão saía sem borda e sem cor de fundo, com o texto
   herdando a cor da faixa. Numa faixa escura, texto claro sobre escuro
   ainda dá para ler; numa faixa clara, some. Em nenhum caso parece um
   botão - e é justamente o segundo caminho de conversão dessas páginas.

   É o botão secundário do par: fundo transparente, borda e texto brancos,
   e inverte no hover. */
.cta-btn-outline-white{
    color: #fff !important;
    background-color: transparent !important;
    border: 2px solid rgba(255, 255, 255, .85) !important;
    font-weight: 700;
}
.cta-btn-outline-white:hover,
.cta-btn-outline-white:focus{
    color: #0A544B !important;
    background-color: #fff !important;
    border-color: #fff !important;
}

/* Se algum dia essa faixa virar clara, o botão continua legível. */
.iacondo-public-main .bg-light .cta-btn-outline-white,
.iacondo-public-main .bg-white .cta-btn-outline-white{
    color: var(--iac-primary, #0E6E63) !important;
    border-color: var(--iac-primary, #0E6E63) !important;
}
.iacondo-public-main .bg-light .cta-btn-outline-white:hover,
.iacondo-public-main .bg-white .cta-btn-outline-white:hover{
    color: #fff !important;
    background-color: var(--iac-primary, #0E6E63) !important;
}