/* CLENA BEAUTY | CONTRASTE UNIFICADO DOS TEMAS | 2026-10-15
   Autoridade unica para CORES de texto. Carregue por ultimo.
   Nao altera layout, IDs, tabelas, fluxo Supabase nem a pagina publica.
   Contraste WCAG AA de textos normais sobre os fundos oficiais dos 3 temas.
*/

/* Tokens semanticos de leitura. Contraste minimo dos textos: >= 4.5:1 */
html[data-beauty-theme="brisa"]{
  --read-title:#21323e;
  --read-body:#334852;
  --read-muted:#455d69;
  --read-placeholder:#556d7a;
  --read-accent:#17647c;
  --read-accent-rgb:23,100,124;
  --read-on-accent:#ffffff;
  --read-input:#ffffff;
  --read-panel:#ffffff;
  --read-raised:#eef4f6;
}
html[data-beauty-theme="areia"]{
  --read-title:#382d25;
  --read-body:#514132;
  --read-muted:#675441;
  --read-placeholder:#73604c;
  --read-accent:#92512f;
  --read-accent-rgb:146,81,47;
  --read-on-accent:#ffffff;
  --read-input:#fffdfa;
  --read-panel:#fffdfa;
  --read-raised:#f3ede4;
}
html[data-beauty-theme="grafite"]{
  --read-title:#f4f8fa;
  --read-body:#e1ebf1;
  --read-muted:#c7d6df;
  --read-placeholder:#c3d4dd;
  --read-accent:#74bcc5;
  --read-accent-rgb:116,188,197;
  --read-on-accent:#10232d;
  --read-input:#253440;
  --read-panel:#1d2a35;
  --read-raised:#263643;
}

/* A cor publica da loja continua separada do tema do PAINEL.
   Reatribui variaveis antigas apenas dentro dos componentes do editor. */
html[data-beauty-theme] :is(#app,#modal,#previewDrawer,#authGate,.mobile-bottom-nav,.toast-region){
  --primary:var(--read-accent);
  --primary-rgb:var(--read-accent-rgb);
  --primary-soft:var(--skin-soft);
  --primary-dark:var(--skin-accent-hover);
  --text:var(--read-title);
  --muted:var(--read-muted);
  --ui-text:var(--read-title);
  --ui-muted:var(--read-muted);
  color:var(--read-body);
}
html[data-beauty-theme] :is(.content,.editor-section,.modal-card,.drawer aside,.auth-card){
  color:var(--read-body)!important;
}

/* Blocos com superficies neutras: texto NUNCA herda branco do layout antigo. */
html[data-beauty-theme] :is(
  .panel,.item-card,.stats-grid article,.report-kpis article,
  .agenda-metric,.agenda-appointment-card,.table-wrap,.customer-list-wrap,
  .calendar-shell,.day-agenda,.day-row,.toggle-row,
  .finance-summary-card,.finance-month-card,.finance-filterbar,.finance-list-premium,
  .finance-ledger-row,.report-filter,.rank-row,.check-item,
  .service-form-section,.clena-theme-setting,.clena-share-helper,
  .auth-card,.modal-card,.modal-card header,.modal-footer
){
  color:var(--read-body)!important;
  border-color:var(--skin-border)!important;
}
html[data-beauty-theme] :is(.agenda-appointment-card,.screen-appointments .agenda-appointment-card){
  background:var(--read-panel)!important;
}
html[data-beauty-theme] :is(.agenda-appointment-card,.service-form-section,.day-row,.toggle-row){
  border-color:var(--skin-border)!important;
}
html[data-beauty-theme] :is(.customer-stat-cell,.customer-detail-field,.finance-detail-grid>div,.rank-row){
  color:var(--read-body)!important;background:var(--read-raised)!important;
  border-color:var(--skin-border)!important;
}

/* Titulos, nomes, valores, identificadores. */
html[data-beauty-theme] :is(
  .section-header h2,.section-header h3,.panel-head h3,
  .topbar h1,.topbar-title small,
  .hero-card h2,.item-main h4,.item-main strong,
  .stats-grid strong,.agenda-metric strong,
  .appointment-customer-line h4,.appointment-time strong,
  .appointment-meta h4,.day-agenda-head h3,
  .calendar-title-wrap h3,.calendar-day-number,
  .customer-name-table .customer-row-name,
  .customer-list-heading h2,.customer-identity strong,
  .customer-detail-heading h3,.customer-detail-field dd,
  .rank-row strong,.rank-row b,.report-kpis strong,
  .finance-main h4,.finance-value strong,.finance-due strong,
  .finance-ledger-description strong,.finance-list-header strong,
  .finance-ledger-head strong,.finance-summary-card strong,
  .finance-month-copy strong,.finance-detail-hero h3,.finance-detail-grid dd,
  .finance-month-control input,.finance-detail-hero strong,
  .service-section-head strong,.toggle-row b,.check-item b,
  .clena-theme-setting-header h3,.clena-theme-choice-label strong,
  .clena-theme-setting h3,.auth-card h2,
  .modal-card header h2,.drawer aside>header h3,.modal-card h3
){
  color:var(--read-title)!important;
  opacity:1!important;
}

/* Observacoes e legendas: cores secundarias ainda bem visiveis. */
html[data-beauty-theme] :is(
  .section-header p,.panel-head small,.eyebrow,
  .field small,.item-main p,.item-main small,
  .stats-grid small,.agenda-metric small,
  .day-agenda-head p,.appointment-meta p,.appointment-meta small,
  .appointment-time small,.appointment-customer-line p,
  .customer-list-heading p,.customer-identity small,
  .customer-contact-stack span,.customer-contact-stack small,
  .customer-mobile-label,.customer-detail-field dt,
  .finance-month-copy small,.finance-summary-card small,
  .finance-summary-card div>span,.finance-main p,.finance-main small,
  .finance-ledger-description small,.finance-ledger-date,
  .finance-ledger-head,.finance-list-header small,
  .finance-detail-grid dt,.finance-detail-hero small,
  .finance-due small,.finance-value small,
  .report-kpis small,.bar-row span,.rank-row small,
  .calendar-weekdays span,.calendar-filtered,
  .clena-theme-setting-header p,.clena-theme-choice-label small,
  .clena-theme-kicker,.auth-card-head p,
  .auth-security,.auth-verification-note,.auth-row,.auth-switch,
  .real-preview-empty,.real-preview-note,.clena-share-helper small,
  .helper-box,.empty-state p,.toggle-row small,.service-section-head small
){
  color:var(--read-muted)!important;
  opacity:1!important;
}
html[data-beauty-theme] :is(
  .field>span,.field>b,.auth-field>span,.quick-status>span,
  .payment-mode-grid b,.day-row>strong,.day-times label,
  .report-date-label,.finance-detail-field dt,.finance-form .field>span,
  .calendar-title-wrap small
){
  color:var(--read-body)!important;
  opacity:1!important;
}
html[data-beauty-theme] :is(
  .bar-row strong,.customer-stat-cell strong,.check-item strong,
  .check-item span,.calendar-more,.rank-row b,
  .customer-detail-field dd,.finance-detail-grid dd,.finance-ledger-amount
){
  opacity:1!important;
}
html[data-beauty-theme] .bar-row strong{color:var(--read-title)!important}
html[data-beauty-theme] .rank-row>span{
  background:var(--skin-soft)!important;
  color:var(--read-accent)!important;
}
html[data-beauty-theme] :is(.customer-row-trigger,.customer-row-name,.customer-name-table th){
  color:var(--read-title)!important;
}
html[data-beauty-theme] .customer-name-table th{
  background:var(--skin-alt)!important;color:var(--read-muted)!important;
}
html[data-beauty-theme] .customer-row-trigger>i,
html[data-beauty-theme] .finance-ledger-chevron,
html[data-beauty-theme] .calendar-more{
  color:var(--read-accent)!important;opacity:1!important;
}

/* Campos, selects nativos, placeholders, metadados e textos de digitacao. */
html[data-beauty-theme] :is(
  .field input,.field textarea,.field select,
  .toolbar input,.toolbar select,
  .search input,.finance-search input,.finance-select select,
  .calendar-filters input,.calendar-filters select,
  .day-times input,.quick-status select,
  .slug-input input,.finance-month-control input,
  .report-date-item input,
  #modalBody input,#modalBody select,#modalBody textarea,
  .auth-input input,.finance-form input,.finance-form select,.finance-form textarea
){
  background-color:var(--read-input)!important;
  color:var(--read-title)!important;
  -webkit-text-fill-color:var(--read-title)!important;
  caret-color:var(--read-accent)!important;
  border-color:var(--skin-border)!important;
  opacity:1!important;
}
html[data-beauty-theme] :is(input,textarea)::placeholder{
  color:var(--read-placeholder)!important;
  -webkit-text-fill-color:var(--read-placeholder)!important;
  opacity:1!important;
}
html[data-beauty-theme] :is(select,option,optgroup){
  color:var(--read-title)!important;
}
html[data-beauty-theme] :is(option,optgroup){
  background:var(--skin-surface)!important;
}
html[data-beauty-theme] :is(
  .field input,.field textarea,.field select,
  .finance-search input,.finance-select select,
  .finance-month-control input,.report-date-item input
):focus-visible{
  outline:2px solid var(--read-accent)!important;
  outline-offset:1px!important;
}
html[data-beauty-theme] :is(.search i,.finance-search>i,.finance-select>i,.finance-select-arrow,.calendar-search i){
  color:var(--read-muted)!important;opacity:1!important;
}
html[data-beauty-theme] .slug-input>span{
  background:var(--read-raised)!important;
  color:var(--read-body)!important;
  border-color:var(--skin-border)!important;
}
html[data-beauty-theme] .image-uploader{
  background-color:var(--read-raised)!important;border-color:var(--skin-border)!important;
}
html[data-beauty-theme] .image-uploader :is(span,small,b){
  color:var(--read-body)!important;
}
html[data-beauty-theme] .image-uploader i{color:var(--read-accent)!important}

/* Marca e botoes: contraste e herdanca de icones corretos no Grafite. */
html[data-beauty-theme] :is(
  .primary-btn,.auth-submit,.whatsapp-purple,.whatsapp-send-btn,
  #sendToClientsButton,.mobile-bottom-nav button.is-active
){
  background-color:var(--read-accent)!important;
  color:var(--read-on-accent)!important;
  -webkit-text-fill-color:var(--read-on-accent)!important;
}
html[data-beauty-theme] :is(
  .primary-btn,.auth-submit,.whatsapp-purple,.whatsapp-send-btn,
  #sendToClientsButton,.mobile-bottom-nav button.is-active
) :is(i,span,b,strong){
  color:inherit!important;-webkit-text-fill-color:inherit!important;
}
html[data-beauty-theme] :is(
  .secondary-btn,.text-btn,.calendar-nav-btn,.agenda-edit-btn,
  .item-actions button,.icon-btn,.customer-edit-btn
){
  background-color:var(--skin-soft)!important;color:var(--read-accent)!important;
  -webkit-text-fill-color:var(--read-accent)!important;
  border-color:var(--skin-line)!important;
}
html[data-beauty-theme] :is(
  .secondary-btn,.text-btn,.calendar-nav-btn,.agenda-edit-btn,
  .item-actions button,.icon-btn,.customer-edit-btn
) i{color:inherit!important}
html[data-beauty-theme] :is(
  .primary-btn:disabled,.secondary-btn:disabled,
  input:disabled,select:disabled,textarea:disabled
){
  opacity:1!important;
  background-color:var(--read-raised)!important;
  color:var(--read-muted)!important;
  -webkit-text-fill-color:var(--read-muted)!important;
  border-color:var(--skin-border)!important;
}
html[data-beauty-theme="grafite"] :is(.danger-btn,.item-actions button.is-danger){
  background:#4b2d3b!important;color:#ffd0d8!important;
  -webkit-text-fill-color:#ffd0d8!important;border-color:#765061!important;
}

/* Menus usam sempre texto legivel sobre suas superficies. */
html[data-beauty-theme] .sidebar{
  background:var(--skin-sidebar)!important;color:var(--skin-side-ink)!important;
}
html[data-beauty-theme] .sidebar :is(.brand,.business-mini strong,.business-mini small,.nav-item,.nav-item i,.back-link,.clena-autosave-label){
  color:var(--skin-side-ink)!important;opacity:1!important;
}
html[data-beauty-theme] .sidebar .nav-item.is-active,
html[data-beauty-theme] .sidebar .nav-item.is-active i{
  color:#ffffff!important;
}
html[data-beauty-theme] .topbar{
  background:var(--skin-surface)!important;color:var(--read-title)!important;
}
html[data-beauty-theme] :is(.topbar h1,.topbar-title small){
  color:var(--read-title)!important;
}
html[data-beauty-theme] .mobile-bottom-nav button:not(.is-active){
  color:var(--skin-side-ink)!important;opacity:1!important;
}
html[data-beauty-theme] .mobile-bottom-nav button:not(.is-active) :is(i,span){
  color:inherit!important;
}
html[data-beauty-theme] .profile-menu,
html[data-beauty-theme] .profile-menu button{
  background:var(--read-panel)!important;color:var(--read-title)!important;
}

/* Agenda: datas e nomes em contraste com cartoes e calendário. */
html[data-beauty-theme] :is(.calendar-toolbar,.day-agenda,.calendar-shell){
  background:var(--read-panel)!important;
  color:var(--read-body)!important;
}
html[data-beauty-theme] :is(.calendar-weekdays,.calendar-day.is-empty){
  background:var(--read-raised)!important;
}
html[data-beauty-theme] .calendar-day{
  background:var(--read-panel)!important;color:var(--read-title)!important;
}
html[data-beauty-theme] .calendar-day.is-selected{background:var(--skin-soft)!important}
html[data-beauty-theme] .calendar-day.is-today .calendar-day-number{
  background:var(--read-accent)!important;color:var(--read-on-accent)!important;
}
html[data-beauty-theme] :is(.calendar-day-number,.calendar-title-wrap h3,.appointment-time strong){
  color:var(--read-title)!important;
}
html[data-beauty-theme] :is(.appointment-time small,.appointment-meta small,.calendar-filtered){
  color:var(--read-muted)!important;
}
html[data-beauty-theme] .calendar-count{
  background:var(--skin-soft)!important;color:var(--read-accent)!important;
}
html[data-beauty-theme] .agenda-appointment-card .appointment-meta :is(h4,strong){
  color:var(--read-title)!important;
}

/* Relatorios: valores, graficos, periodos e rankings. */
html[data-beauty-theme] .screen-reports :is(.report-period-heading strong,.report-date-item input,.bar-row strong,.report-kpis strong,.rank-row strong){
  color:var(--read-title)!important;
}
html[data-beauty-theme] .screen-reports :is(.report-period-heading small,.report-date-label,.rank-row small,.bar-row span,.report-kpis small){
  color:var(--read-muted)!important;
}
html[data-beauty-theme] .screen-reports .report-date-item{
  background:var(--read-raised)!important;border-color:var(--skin-border)!important;
}
html[data-beauty-theme] .screen-reports .report-date-item input[type=date]{
  background:transparent!important;
  color:var(--read-title)!important;
  -webkit-text-fill-color:var(--read-title)!important;
}
html[data-beauty-theme] .screen-reports .report-period-heading i{
  color:var(--read-accent)!important;
}
html[data-beauty-theme] .screen-reports .bar-track{background:var(--skin-progress)!important}
html[data-beauty-theme] .screen-reports .bar-track i{background:var(--read-accent)!important}

/* Financeiro: proteger especificamente os seletores antigos com ID,
   preservando verde/vermelho de entradas e saidas. */
html[data-beauty-theme] #section-finance :is(
  .finance-month-copy small,.finance-summary-card small,
  .finance-summary-card div>span,.finance-ledger-description small,
  .finance-ledger-date,.finance-list-header small,
  .finance-detail-grid dt,.finance-detail-hero small,
  .finance-ledger-head
){
  color:var(--read-muted)!important;
  opacity:1!important;
}
html[data-beauty-theme] #section-finance :is(
  .finance-summary-card strong,.finance-ledger-description strong,
  .finance-list-header strong,.finance-month-control input,
  .finance-detail-grid dd
){
  color:var(--read-title)!important;opacity:1!important;
}
html[data-beauty-theme] #section-finance .finance-ledger-row{
  background:var(--read-panel)!important;color:var(--read-body)!important;
}
html[data-beauty-theme] #section-finance .finance-ledger-row:nth-child(even){
  background:var(--read-raised)!important;
}
html[data-beauty-theme] #section-finance .finance-ledger-row:hover,
html[data-beauty-theme] #section-finance .finance-ledger-row:focus-visible{
  background:var(--skin-soft)!important;
}
html[data-beauty-theme] #section-finance .finance-ledger-row.payable .finance-ledger-amount{
  color:var(--f-bad)!important;
}
html[data-beauty-theme] #section-finance .finance-ledger-row.receivable .finance-ledger-amount{
  color:var(--f-good)!important;
}
html[data-beauty-theme] #section-finance .finance-month-control input[type=month]{
  background:var(--read-input)!important;color:var(--read-title)!important;
  -webkit-text-fill-color:var(--read-title)!important;
}
html[data-beauty-theme] #section-finance :is(.finance-search input,.finance-select select){
  background:transparent!important;color:var(--read-title)!important;
  -webkit-text-fill-color:var(--read-title)!important;
}
html[data-beauty-theme] :is(.finance-detail,.finance-form){
  color:var(--read-body)!important;
}
html[data-beauty-theme] :is(.finance-detail-grid>div,.finance-extra-details,.finance-kind-switch label>span){
  background:var(--read-raised)!important;border-color:var(--skin-border)!important;
}
html[data-beauty-theme] .finance-form .finance-kind-switch input:checked+span{
  background:var(--skin-soft)!important;color:var(--read-accent)!important;
}

/* Janela de detalhes e edicao: fundo, rotulos e acoes legiveis em Grafite. */
html[data-beauty-theme] :is(.modal-card,.modal-card header,.modal-card #modalBody,.modal-footer,.drawer aside,.drawer aside>header){
  background:var(--read-panel)!important;color:var(--read-body)!important;
  border-color:var(--skin-border)!important;
}
html[data-beauty-theme] :is(.modal-card header h2,.drawer aside>header h3){
  color:var(--read-title)!important;
}
html[data-beauty-theme] .modal-card :is(.field>span,.field>b,.service-section-head strong){
  color:var(--read-body)!important;
}
html[data-beauty-theme] :is(.customer-detail-heading h3,.customer-detail-field dd,.finance-detail-grid dd){
  color:var(--read-title)!important;
}
html[data-beauty-theme] :is(.customer-detail-field dt,.finance-detail-grid dt){
  color:var(--read-muted)!important;
}
html[data-beauty-theme] .modal-card :is(.service-form-section,.finance-extra-details){
  background:var(--read-raised)!important;
  color:var(--read-body)!important;border-color:var(--skin-border)!important;
}
html[data-beauty-theme] .modal-card :is(.toggle-row span b,.toggle-row span small){
  color:var(--read-body)!important;opacity:1!important;
}

/* Informacoes auxiliares e estados mantem codificacao por cor. */
html[data-beauty-theme] .helper-box{
  background:var(--read-raised)!important;color:var(--read-body)!important;
  border-color:var(--skin-border)!important;
}
html[data-beauty-theme] .empty-state,
html[data-beauty-theme] .empty-state :is(p,span,small){
  color:var(--read-muted)!important;opacity:1!important;
}
html[data-beauty-theme] .check-item{
  background:var(--read-raised)!important;
  color:var(--read-body)!important;opacity:1!important;
}
html[data-beauty-theme] :is(.toggle-row,.day-row).is-closed,
html[data-beauty-theme] .day-row.is-closed :is(strong,span,label){
  color:var(--read-muted)!important;opacity:1!important;
}
/* Paleta de situacoes escura: status nao viram letra apagada sobre cinza. */
html[data-beauty-theme="grafite"] .badge{
  color:#dcf4e7!important;background:#234938!important;border-color:#326a50!important;
}
html[data-beauty-theme="grafite"] .badge.off{
  color:#e4edf3!important;background:#344552!important;border-color:#536575!important;
}
html[data-beauty-theme="grafite"] .badge.info{
  color:#cdeafa!important;background:#23455b!important;border-color:#456a7f!important;
}
html[data-beauty-theme="grafite"] .badge.pending{
  color:#ffe6b4!important;background:#574323!important;border-color:#876b3f!important;
}
html[data-beauty-theme="grafite"] :is(.slug-status.ok,.auth-message.success){
  color:#c7f1d9!important;
}
html[data-beauty-theme="grafite"] :is(.slug-status.error,.auth-message.error){
  color:#ffccd7!important;
}
html[data-beauty-theme="grafite"] .customer-detail-empty{
  color:var(--read-muted)!important;
}
html[data-beauty-theme] :is(.auth-form-panel,.auth-card){
  background:var(--skin-bg)!important;
}
html[data-beauty-theme] .auth-card{
  background:var(--read-panel)!important;
}
html[data-beauty-theme] .auth-card :is(h2,strong,b,span){
  color:var(--read-title)!important;
}
html[data-beauty-theme] .auth-card :is(p,small){
  color:var(--read-muted)!important;
}
html[data-beauty-theme] .auth-card .auth-submit :is(span,i){
  color:var(--read-on-accent)!important;
}

/* Impressao pode continuar com letras escuras no papel em todos os temas. */
@media print{
  html[data-beauty-theme] :is(.editor-section,.panel,.table-wrap,.report-kpis article){
    background:#ffffff!important;color:#18252f!important;
  }
  html[data-beauty-theme] :is(.editor-section h1,.editor-section h2,.editor-section h3,.editor-section strong,.editor-section p,.editor-section small){
    color:#18252f!important;
  }
}