/*
 * Tema dos painéis Filament, no visual do Alina: fundo cinza-azulado, cards
 * brancos translúcidos com cantos de 20px e sombra suave, menu com pílula no
 * item ativo, selos com borda e rodapé branco. Carregado depois do CSS do
 * Filament (que fica em @layer), então estas regras prevalecem. A cor primária
 * continua sendo a de cada cooperativa (variáveis --primary-* do Filament).
 */

:root {
    --pp-bg: #eef2f5;
    --pp-text: #082f32;
    --pp-heading: #0f1e3c;
    --pp-surface: rgba(255, 255, 255, 0.65);
    --pp-surface-solid: #fff;
    --pp-border: rgba(120, 115, 110, 0.2);
    --pp-shadow: 0 2.5px 10px rgba(15, 30, 60, 0.1);
    --pp-grid-line: rgba(15, 30, 60, 0.2);
    --pp-radius: 20px;
    --pp-radius-sm: 12px;
    /* O 700 da paleta é o tom da cor escolhida pela cooperativa; o 600 sai mais claro. */
    --pp-accent: var(--primary-700);
    /* Fundo sólido com texto branco */
    --pp-fill: var(--primary-700);
}

.dark {
    --pp-text: rgb(229 231 235);
    --pp-heading: #fff;
    --pp-surface: rgb(255 255 255 / 0.04);
    --pp-surface-solid: var(--gray-900);
    --pp-border: rgb(255 255 255 / 0.1);
    --pp-shadow: 0 2.5px 10px rgb(0 0 0 / 0.35);
    --pp-grid-line: rgb(255 255 255 / 0.12);
    --pp-accent: var(--primary-400);
    --pp-fill: var(--primary-600);
}

/* Fundo e texto */
html:not(.dark) .fi-body {
    background-color: var(--pp-bg);
}

.fi-body {
    color: var(--pp-text);
}

/* Barra do topo: branca, com os ícones em círculos contornados */
html:not(.dark) .fi-topbar {
    background-color: #fff;
}

.fi-topbar {
    box-shadow: 0 1px 0 var(--pp-border);
}

.fi-topbar .fi-icon-btn {
    border: 1px solid var(--pp-border);
    border-radius: 9999px;
}

.fi-global-search-field .fi-input-wrp {
    border-radius: 18px;
}

/* Menu lateral: degradê claro da cor da cooperativa e item ativo em pílula */
html:not(.dark) .fi-sidebar {
    background: linear-gradient(180deg, color-mix(in oklab, var(--primary-500) 12%, #fff) 0, #fff 18rem);
}

.fi-sidebar {
    border-right: 1px solid var(--pp-border);
}

.fi-sidebar-header {
    background: transparent;
    box-shadow: none;
}

.fi-sidebar-group-label {
    font-size: 0.9375rem;
    font-weight: 600;
    color: var(--pp-text);
}

.fi-sidebar-item-btn {
    border-radius: var(--pp-radius-sm);
}

.fi-sidebar-item-label {
    font-size: 0.9375rem;
}

.fi-sidebar-item.fi-active > .fi-sidebar-item-btn {
    background-color: color-mix(in oklab, var(--pp-accent) 10%, transparent);
    box-shadow: inset 3px 0 0 var(--pp-accent);
}

.fi-sidebar-item.fi-active > .fi-sidebar-item-btn .fi-sidebar-item-label,
.fi-sidebar-item.fi-active > .fi-sidebar-item-btn .fi-icon {
    color: var(--pp-accent);
    font-weight: 600;
}

/* Títulos e trilha de navegação */
.fi-header-heading {
    font-size: 1.5rem;
    font-weight: 600;
    letter-spacing: normal;
    color: var(--pp-heading);
}

.fi-breadcrumbs-item:last-child .fi-breadcrumbs-item-label {
    color: var(--pp-accent);
}

/* Os rótulos dos recursos ficam em minúsculas ("contas a pagar"); no título e na trilha, só a primeira letra sobe. */
.fi-breadcrumbs-item-label {
    display: inline-block;
}

.fi-header-heading::first-letter,
.fi-breadcrumbs-item-label::first-letter {
    text-transform: uppercase;
}

/* Cards: seções, tabelas, indicadores e a caixa de login */
.fi-section:not(.fi-section-not-contained):not(.fi-aside),
.fi-ta-ctn,
.fi-wi-stats-overview-stat,
.fi-simple-main {
    background-color: var(--pp-surface);
    border-radius: var(--pp-radius);
    box-shadow: var(--pp-shadow), 0 0 0 1px var(--pp-border);
}

.fi-section.fi-compact:not(.fi-section-not-contained):not(.fi-aside) {
    border-radius: 14px;
}

.fi-section.fi-secondary:not(.fi-section-not-contained):not(.fi-aside) {
    background-color: rgba(15, 30, 60, 0.03);
}

.dark .fi-section.fi-secondary:not(.fi-section-not-contained):not(.fi-aside) {
    background-color: rgb(255 255 255 / 0.03);
}

.fi-ta-header-cell {
    font-weight: 700;
    color: var(--pp-heading);
}

.fi-modal-window {
    border-radius: var(--pp-radius);
}

.fi-dropdown-panel {
    border-radius: var(--pp-radius-sm);
}

/* Botões, campos e selos */
.fi-btn {
    border-radius: 0.375rem;
}

/*
 * Botões coloridos sólidos com texto branco, como no Alina. Quando o 600 da
 * paleta não dá contraste com branco, o Filament troca para fundo claro e
 * texto escuro (fi-bg-color-400); aqui o fundo vai para o 700, que dá.
 */
html:not(.dark) .fi-btn.fi-color.fi-bg-color-400,
html:not(.dark) .fi-btn.fi-color.fi-bg-color-400 > .fi-icon {
    color: #fff;
}

html:not(.dark) .fi-btn.fi-color.fi-bg-color-400 {
    background-color: var(--color-700);
}

html:not(.dark) .fi-btn.fi-color.fi-bg-color-400:hover {
    background-color: var(--color-800);
}

.fi-input-wrp {
    border-radius: 0.625rem;
}

.fi-badge {
    border-radius: 6px;
    font-weight: 600;
}

.fi-badge.fi-color {
    --tw-ring-color: color-mix(in oklab, var(--color-500) 45%, transparent);
}

/* Rodapé */
.pp-footer {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem 1rem;
    align-items: center;
    justify-content: space-between;
    margin-top: 1.5rem;
    padding: 0.75rem 1rem;
    background-color: var(--pp-surface-solid);
    box-shadow: var(--pp-shadow);
    font-size: 0.875rem;
    color: var(--pp-text);
}

.pp-footer-brand {
    color: var(--pp-accent);
    font-weight: 600;
}

/* Na tela de login o rodapé é só uma linha de texto */
.fi-simple-layout .pp-footer {
    justify-content: center;
    background-color: transparent;
    box-shadow: none;
}

/* Aviso de paciente com nome parecido, abaixo do nome no cadastro */
.pp-similar-patients {
    margin-top: .5rem;
    padding: .6rem .8rem;
    border: 1px solid color-mix(in oklab, var(--warning-500) 45%, transparent);
    border-radius: 10px;
    background: color-mix(in oklab, var(--warning-500) 10%, transparent);
    font-size: .8125rem;
}
.pp-similar-patients p { font-weight: 600; }
.pp-similar-patients ul { margin-top: .25rem; padding-left: 1.1rem; list-style: disc; }
.pp-similar-patients a { color: var(--pp-accent, var(--primary-700)); text-decoration: underline; }

/* Mapa do endereço do paciente (LocationPicker) */
.pp-location-picker { display: flex; flex-direction: column; gap: .6rem; }
.pp-location-map {
    position: relative;
    z-index: 0;
    isolation: isolate;
    height: 320px;
    border: 1px solid var(--pp-border, rgba(120, 115, 110, .2));
    border-radius: 12px;
    overflow: hidden;
}
.pp-location-actions { display: flex; flex-wrap: wrap; gap: .5rem 1rem; align-items: center; }
.pp-location-link { font-size: .875rem; font-weight: 600; color: var(--pp-accent, var(--primary-700)); text-decoration: underline; }
.pp-location-hint { font-size: .8125rem; opacity: .75; }

/* Mapa para escolher o profissional (ProfessionalMapPicker) */
.pp-pro-map { display: flex; flex-direction: column; gap: .6rem; }
.pp-pro-map-warning { padding: .6rem .8rem; border: 1px solid color-mix(in oklab, var(--warning-500) 45%, transparent); border-radius: 10px; background: color-mix(in oklab, var(--warning-500) 12%, transparent); font-size: .8125rem; }
.pp-pro-map-body { display: grid; grid-template-columns: minmax(0, 1fr) 18rem; gap: .75rem; }
.pp-pro-map-canvas { position: relative; z-index: 0; isolation: isolate; height: 380px; border: 1px solid var(--pp-border, rgba(120, 115, 110, .2)); border-radius: 12px; overflow: hidden; }
.pp-pro-map-list { display: flex; flex-direction: column; gap: .4rem; max-height: 380px; overflow-y: auto; }
.pp-pro-map-item { display: grid; grid-template-columns: auto 1fr auto; gap: .55rem; align-items: center; width: 100%; padding: .5rem .65rem; text-align: left; border: 1px solid var(--pp-border, rgba(120, 115, 110, .25)); border-radius: 10px; background: var(--pp-surface-solid, transparent); font-size: .8125rem; }
.pp-pro-map-item:hover:not(:disabled) { border-color: var(--pp-fill, var(--primary-700)); }
.pp-pro-map-item.is-selected { border-color: var(--pp-fill, var(--primary-700)); box-shadow: 0 0 0 2px color-mix(in oklab, var(--pp-fill, var(--primary-700)) 35%, transparent); }
.pp-pro-map-item:disabled { opacity: .55; cursor: not-allowed; }
.pp-pro-map-item strong { display: block; }
.pp-pro-map-item small { display: block; font-size: .75rem; opacity: .75; }
.pp-pro-map-item b { font-size: .75rem; white-space: nowrap; }
.pp-pro-map-empty, .pp-pro-map-footer { font-size: .8125rem; opacity: .75; }
.pp-pro-map-legend { display: flex; flex-wrap: wrap; gap: .35rem 1rem; align-items: center; font-size: .75rem; }
.pp-pro-map-legend span { display: inline-flex; gap: .35rem; align-items: center; }
.pp-pro-map-note { opacity: .7; }
.pp-pro-dot { display: inline-block; width: .7rem; height: .7rem; border-radius: 999px; border: 2px solid var(--pp-dot, #64748b); background: var(--pp-dot, #64748b); }
.pp-pro-team { --pp-dot: #2563eb; }
.pp-pro-available { --pp-dot: #16a34a; }
.pp-pro-busy { --pp-dot: #94a3b8; }
.pp-pro-outside { --pp-dot: #16a34a; }
.pp-pro-outside .pp-pro-dot { background: transparent; }
.pp-pro-dot.pp-pro-patient { --pp-dot: #dc2626; }
.pp-pro-patient-pin span { display: block; width: 22px; height: 22px; border: 3px solid #fff; border-radius: 999px; background: #dc2626; box-shadow: 0 1px 4px rgba(0, 0, 0, .45); }
@media (max-width: 767px) {
    .pp-pro-map-body { grid-template-columns: 1fr; }
    .pp-pro-map-canvas { height: 300px; }
}

/* Candidatura: documentos da cooperativa, cartões de valores e revisão */
.pp-candidate-doc { max-height: 18rem; overflow-y: auto; padding: .9rem 1rem; border: 1px solid var(--pp-border, rgba(120, 115, 110, .25)); border-radius: 10px; background: color-mix(in oklab, var(--pp-fill, var(--primary-700)) 4%, transparent); font-size: .875rem; line-height: 1.6; }
.pp-candidate-doc p, .pp-rich p { margin-bottom: .6rem; }
.pp-candidate-doc ul, .pp-rich ul { padding-left: 1.2rem; list-style: disc; margin-bottom: .6rem; }
.pp-candidate-doc ol, .pp-rich ol { padding-left: 1.2rem; list-style: decimal; margin-bottom: .6rem; }
.pp-candidate-doc table, .pp-rich table { width: 100%; margin-bottom: .75rem; border-collapse: collapse; font-size: .8125rem; }
.pp-candidate-doc th, .pp-candidate-doc td, .pp-rich th, .pp-rich td { padding: .4rem .5rem; border-bottom: 1px solid var(--pp-border, rgba(120, 115, 110, .25)); text-align: left; }
.pp-candidate-doc th, .pp-rich th { background: color-mix(in oklab, var(--pp-fill, var(--primary-700)) 8%, transparent); }
.pp-candidate-doc td p, .pp-candidate-doc th p, .pp-rich td p, .pp-rich th p { margin: 0; }
.pp-values-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(15rem, 100%), 1fr)); gap: .75rem; }
.pp-value-card { padding: 1rem; border-radius: 12px; background: color-mix(in oklab, var(--pp-fill, var(--primary-700)) 6%, transparent); }
.pp-value-card strong { display: block; margin-bottom: .25rem; }
.pp-value-card p { font-size: .875rem; opacity: .8; }
.pp-value-emoji { display: block; margin-bottom: .35rem; font-size: 1.5rem; line-height: 1; }
.pp-review { display: grid; gap: 1rem; }
.pp-review section { padding: 1rem; border: 1px solid var(--pp-border, rgba(120, 115, 110, .25)); border-radius: 12px; }
.pp-review h3 { margin-bottom: .6rem; font-weight: 700; }
.pp-review dl { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(14rem, 100%), 1fr)); gap: .5rem 1rem; }
.pp-review dt { font-size: .75rem; opacity: .65; }
.pp-review dd { font-size: .875rem; overflow-wrap: anywhere; }
.pp-review-line { display: block; }
.pp-review-missing { margin-top: .6rem; color: #dc2626; font-weight: 600; font-size: .875rem; }

/* Candidatura: telas iniciais */
.pp-intro { display: grid; gap: 1rem; }
.pp-intro-card { padding: 1.5rem; border-radius: 16px; background: var(--pp-surface-solid, #fff); box-shadow: 0 0 0 1px var(--pp-border, rgba(120, 115, 110, .2)), 0 8px 24px rgba(15, 30, 60, .06); }
.pp-intro-title { display: flex; gap: .5rem; align-items: center; margin-bottom: 1rem; font-size: 1.25rem; font-weight: 700; }
.pp-intro-icon { width: 1.5rem; height: 1.5rem; color: var(--pp-accent, var(--primary-700)); }
.pp-rich { font-size: .9375rem; line-height: 1.65; }
.pp-intro-accept { display: flex; gap: .6rem; align-items: flex-start; margin-top: 1.25rem; font-weight: 600; }
.pp-intro-nav { display: flex; flex-wrap: wrap; gap: .75rem; align-items: center; justify-content: space-between; font-size: .875rem; }
.pp-intro-nav > div { display: flex; gap: .5rem; }

/* Candidatura: progresso salvo */
.pp-progress { display: grid; gap: .4rem; }
.pp-progress-head { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; justify-content: space-between; font-size: .8125rem; }
.pp-saved-badge { display: inline-flex; gap: .35rem; align-items: center; padding: .2rem .65rem; border-radius: 999px; background: color-mix(in oklab, var(--pp-fill, var(--primary-700)) 8%, transparent); opacity: .85; }
.pp-saved-icon { width: 1rem; height: 1rem; }
.pp-progress-bar { height: 6px; border-radius: 999px; background: color-mix(in oklab, var(--pp-fill, var(--primary-700)) 12%, transparent); overflow: hidden; }
.pp-progress-bar i { display: block; height: 100%; border-radius: 999px; background: var(--pp-fill, var(--primary-700)); transition: width .3s; }
.pp-editing-notice { display: flex; gap: .6rem; align-items: flex-start; padding: .75rem 1rem; border: 1px solid color-mix(in oklab, #d97706 45%, transparent); border-radius: 12px; background: color-mix(in oklab, #d97706 10%, transparent); font-size: .875rem; font-weight: 600; }
.pp-editing-icon { width: 1.25rem; height: 1.25rem; flex: none; color: #d97706; }

/* Candidatura: portal "Minha candidatura" */
.pp-portal { display: grid; gap: 1rem; }
.pp-portal-header { display: flex; flex-wrap: wrap; gap: .75rem; align-items: center; justify-content: space-between; }
.pp-portal-header p { font-size: .875rem; opacity: .75; }
.pp-portal-actions { display: flex; flex-wrap: wrap; gap: .5rem; }
.pp-portal-nav { display: flex; flex-wrap: wrap; gap: .5rem; }
.pp-portal-nav a { padding: .3rem .8rem; border-radius: 999px; font-size: .8125rem; font-weight: 600; background: color-mix(in oklab, var(--pp-fill, var(--primary-700)) 10%, transparent); }
.pp-portal-status { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(10rem, 100%), 1fr)); gap: .75rem; }
.pp-portal-status > div, .pp-portal-card { padding: 1rem; border: 1px solid var(--pp-border, rgba(120, 115, 110, .25)); border-radius: 12px; }
.pp-portal-status > div { display: grid; gap: .3rem; align-content: start; }
.pp-portal-status small, .pp-portal-profile dt { font-size: .75rem; opacity: .65; }
.pp-portal-card h3 { font-weight: 700; margin-bottom: .6rem; }
.pp-portal-profile { display: flex; flex-wrap: wrap; gap: 1rem; align-items: center; }
.pp-portal-profile dl { flex: 1; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(13rem, 100%), 1fr)); gap: .5rem 1rem; }
.pp-portal-profile dd { font-size: .875rem; overflow-wrap: anywhere; }
.pp-portal-photo, .pp-portal-avatar { width: 4.5rem; height: 4.5rem; border-radius: 999px; flex: none; }
.pp-portal-photo { object-fit: cover; }
.pp-portal-avatar { display: grid; place-items: center; font-weight: 700; font-size: 1.25rem; color: #fff; background: var(--pp-fill, var(--primary-700)); }
.pp-portal-result p { font-size: .875rem; }
.pp-portal-result.is-approved { border-color: color-mix(in oklab, #16a34a 45%, transparent); background: color-mix(in oklab, #16a34a 8%, transparent); }
.pp-portal-result.is-rejected { border-color: color-mix(in oklab, #64748b 45%, transparent); background: color-mix(in oklab, #64748b 8%, transparent); }
.pp-portal-details summary { display: flex; flex-wrap: wrap; gap: .25rem 1rem; align-items: baseline; cursor: pointer; list-style: none; margin-bottom: .75rem; }
.pp-portal-details summary h3 { margin: 0; }
.pp-portal-details summary span, .pp-portal-muted { font-size: .8125rem; opacity: .65; }
.pp-portal-split { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(20rem, 100%), 1fr)); gap: 1rem; }
.pp-portal-file { display: grid; gap: .1rem; padding: .6rem .75rem; border-radius: 10px; margin-bottom: .5rem; background: color-mix(in oklab, var(--pp-fill, var(--primary-700)) 6%, transparent); }
.pp-portal-file span { font-size: .875rem; overflow-wrap: anywhere; text-decoration: underline; }
.pp-portal-file small, .pp-portal-history time { font-size: .75rem; opacity: .65; }
.pp-portal-history { display: grid; gap: .6rem; padding-left: 1rem; border-left: 2px solid color-mix(in oklab, var(--pp-fill, var(--primary-700)) 35%, transparent); }
.pp-portal-history li { display: grid; gap: .1rem; font-size: .875rem; }
.pp-portal-footer { display: grid; gap: .4rem; font-size: .875rem; opacity: .9; }