/* =====================================================
   PSAO Corporate Theme — Radzen sobre standard-base.css
   Skin dos componentes Radzen no estilo Corporate UI
   Dashboard (Creative Tim) com a paleta PSAO.
   Fonte de verdade: .agents/skills/design_system.md
   Carregado depois de app.css — vence conflitos legados.
   ===================================================== */

/* ============ 1. Tokens ============ */
:root {
    /* standard-base.css não define esta variável (só vem no theme completo
       standard.css, que não carregamos) — sem ela o glyph do .rzi (ex.: "check"
       do checkbox) fica em fonte normal em vez do ícone, e não aparece. */
    --rz-icon-font-family: "Material Symbols";

    /* Paleta */
    --rz-primary: var(--psao-primary);
    --rz-on-primary: #ffffff;
    --rz-primary-light: color-mix(in srgb, var(--rz-primary) 85%, white);
    --rz-primary-lighter: color-mix(in srgb, var(--rz-primary) 12%, white);
    --rz-primary-dark: color-mix(in srgb, var(--rz-primary) 88%, black);
    --rz-primary-darker: color-mix(in srgb, var(--rz-primary) 72%, black);
    --rz-on-primary-light: #ffffff;
    --rz-on-primary-lighter: var(--rz-primary-dark);
    --rz-secondary: #64748b;
    --rz-on-secondary: #ffffff;
    --rz-secondary-light: color-mix(in srgb, var(--rz-secondary) 85%, white);
    --rz-secondary-lighter: color-mix(in srgb, var(--rz-secondary) 12%, white);
    --rz-secondary-dark: color-mix(in srgb, var(--rz-secondary) 85%, black);
    --rz-secondary-darker: color-mix(in srgb, var(--rz-secondary) 70%, black);
    --rz-success: var(--psao-success);
    --rz-warning: var(--psao-warning);
    --rz-danger: var(--psao-error);
    --rz-error: var(--psao-error);
    --rz-info: var(--psao-info);

    /* Superfícies e texto */
    --rz-body-background-color: var(--psao-bg-light);
    --rz-layout-body-background-color: var(--psao-bg-light);
    --rz-base-background-color: #ffffff;
    --rz-text-color: var(--psao-text-primary);
    --rz-text-title-color: var(--psao-text-primary);
    --rz-text-secondary-color: var(--psao-text-secondary);
    --rz-text-tertiary-color: var(--psao-text-tertiary);
    --rz-text-disabled-color: var(--psao-text-tertiary);
    --rz-border-color: var(--psao-border);
    --rz-border-normal: 1px solid var(--rz-border-color);

    /* Tipografia */
    --rz-text-font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    --rz-body-font-size: 0.875rem;

    /* Raios (design system: controlos 6px, cards 8px, modais 12px) */
    --rz-border-radius: 6px;
    --rz-card-border-radius: 8px;

    /* Sombras (base rgba(12,26,36,*) do template Corporate UI) */
    --rz-shadow-xs: 0 0.125rem 5px -0.0625rem rgba(12, 26, 36, 0.10), 0 0.0625rem 0.0625rem 0 rgba(12, 26, 36, 0.04);
    --rz-shadow-lg: 0 0.5rem 1.5rem -0.25rem rgba(12, 26, 36, 0.15), 0 0.5rem 0.6275rem -0.3125rem rgba(12, 26, 36, 0.06);
    --rz-card-shadow: var(--rz-shadow-xs);

    /* Botões */
    --rz-button-border-radius: 6px;
    --rz-button-shadow: 0 1px 2px 0 rgba(12, 26, 36, 0.06);
    --rz-button-hover-shadow: 0 3px 5px -1px rgba(0, 0, 0, 0.09), 0 2px 3px -1px rgba(0, 0, 0, 0.07);
    --rz-button-active-shadow: 0 1px 2px 0 rgba(12, 26, 36, 0.10);
    --rz-button-focus-shadow: 0 0 0 3px color-mix(in srgb, var(--rz-primary) 15%, transparent);
    --rz-button-hover-gradient: none;
    --rz-button-focus-gradient: none;
    --rz-button-active-gradient: none;
    --rz-button-base-background-color: var(--psao-bg-gray);
    --rz-button-base-color: #374151;
    --rz-button-disabled-opacity: 0.65;

    /* Inputs */
    --rz-input-background-color: #ffffff;
    --rz-input-border: 1px solid var(--psao-border);
    --rz-input-border-radius: 6px;
    --rz-input-shadow: 0 1px 2px 0 rgba(12, 26, 36, 0.06);
    --rz-input-hover-border: 1px solid var(--psao-border-light);
    --rz-input-hover-shadow: 0 1px 2px 0 rgba(12, 26, 36, 0.06);
    --rz-input-focus-border: 1px solid var(--rz-primary);
    --rz-input-focus-shadow: 0 0 0 3px rgba(37, 99, 235, 0.12);
    --rz-input-focus-outline: none;
    --rz-input-min-height: 40px;
    --rz-input-placeholder-color: var(--psao-text-tertiary);
    --rz-input-disabled-background-color: var(--psao-bg-light);
    --rz-input-disabled-color: var(--psao-text-tertiary);
    --rz-input-disabled-border: 1px solid var(--psao-border);
    --rz-input-disabled-opacity: 1;

    /* Form field (labels estáticos por cima — ver secção 5) */
    --rz-form-field-label-color: #374151;
    --rz-form-field-label-focus-color: #374151;
    --rz-form-field-helper-padding: 0.25rem 0 0 0.125rem;
    --rz-form-field-margin-block: 0;
    --rz-form-field-margin-inline: 0;

    /* Checkbox / radio / switch */
    --rz-checkbox-checked-background-color: var(--rz-primary);
    --rz-checkbox-checked-hover-background-color: var(--psao-primary-dark);
    --rz-checkbox-checked-color: #ffffff;
    --rz-checkbox-checked-hover-color: #ffffff;
    --rz-checkbox-checked-border: 1px solid var(--rz-primary);
    --rz-checkbox-border-radius: 4px;
    --rz-switch-background-color: var(--psao-border);
    --rz-switch-checked-background-color: var(--rz-primary);
    --rz-switch-circle-background-color: #ffffff;
    --rz-switch-checked-circle-background-color: #ffffff;

    /* DataGrid */
    --rz-grid-header-background-color: var(--psao-bg-light);
    --rz-grid-header-color: var(--psao-text-secondary);
    --rz-grid-header-font-size: 0.75rem;
    --rz-grid-header-font-weight: 600;
    --rz-grid-header-text-transform: uppercase;
    --rz-grid-cell-font-size: 0.875rem;
    --rz-grid-filter-font-size: 0.875rem;
    --rz-grid-stripe-background-color: #fafafa;
    --rz-grid-hover-background-color: var(--psao-bg-gray);
    --rz-grid-selected-background-color: rgba(37, 99, 235, 0.08);
    --rz-grid-selected-color: var(--psao-text-primary);
    --rz-grid-frozen-cell-background-color: #ffffff;
    --rz-grid-detail-template-background-color: transparent;

    /* Pager */
    --rz-pager-numeric-button-background-color: transparent;
    --rz-pager-numeric-button-color: var(--psao-text-secondary);
    --rz-pager-numeric-button-hover-background-color: var(--psao-bg-gray);
    --rz-pager-numeric-button-hover-color: var(--psao-text-primary);
    --rz-pager-numeric-button-selected-background-color: var(--rz-primary);
    --rz-pager-numeric-button-selected-color: #ffffff;
    --rz-pager-summary-color: var(--psao-text-secondary);
    --rz-pager-button-border-radius: 6px;

    /* Tabs (estilo pills do template) */
    --rz-tabs-border: none;
    --rz-tabs-tab-background-color: transparent;
    --rz-tabs-tab-color: var(--psao-text-secondary);
    --rz-tabs-tab-hover-background-color: rgba(255, 255, 255, 0.6);
    --rz-tabs-tab-hover-color: var(--psao-text-primary);
    --rz-tabs-tab-selected-background-color: #ffffff;
    --rz-tabs-tab-selected-color: var(--psao-text-primary);
    --rz-tabs-tab-font-weight: 600;
    --rz-tabs-tab-text-transform: none;
    --rz-tabs-tab-padding-block: 0.5rem;
    --rz-tabs-tab-padding-inline: 1rem;

    /* Dialog */
    --rz-dialog-border-radius: 12px;
    --rz-dialog-shadow: 0 20px 25px rgba(0, 0, 0, 0.15);
    --rz-dialog-background-color: #ffffff;
    --rz-dialog-title-font-size: 1.125rem;
    --rz-dialog-title-font-weight: 600;
    --rz-dialog-mask-background-color: rgba(0, 0, 0, 0.5);

    /* Dropdown / popup panels */
    --rz-dropdown-open-background-color: #ffffff;
    --rz-dropdown-panel-border: 1px solid var(--psao-border);
    --rz-dropdown-panel-shadow: var(--rz-shadow-lg);
    --rz-dropdown-item-padding: 0.5rem 0.75rem;
    --rz-dropdown-item-font-size: 0.875rem;
    --rz-dropdown-item-hover-background-color: var(--psao-bg-gray);
    --rz-dropdown-item-hover-color: var(--psao-text-primary);
    --rz-dropdown-item-selected-background-color: rgba(37, 99, 235, 0.10);
    --rz-dropdown-item-selected-color: var(--rz-primary);
    --rz-dropdown-item-selected-hover-background-color: rgba(37, 99, 235, 0.16);
    --rz-dropdown-item-selected-hover-color: var(--rz-primary);

    /* Notificações (estilo soft do design system) */
    --rz-notification-border-radius: 8px;
    --rz-notification-shadow: var(--rz-shadow-lg);
    --rz-notification-success-background-color: #ecfdf5;
    --rz-notification-success-color: #065f46;
    --rz-notification-success-icon-color: var(--psao-success);
    --rz-notification-error-background-color: #fef2f2;
    --rz-notification-error-color: #991b1b;
    --rz-notification-error-icon-color: var(--psao-error);
    --rz-notification-warning-background-color: #fffbeb;
    --rz-notification-warning-color: #92400e;
    --rz-notification-warning-icon-color: var(--psao-warning);
    --rz-notification-info-background-color: #f5f3ff;
    --rz-notification-info-color: #5b21b6;
    --rz-notification-info-icon-color: var(--psao-info);

    /* Badges */
    --rz-badge-text-transform: uppercase;
    --rz-badge-font-size: 0.6875rem;
    --rz-badge-font-weight: 600;
    --rz-badge-border-radius: 4px;

    /* Tooltip */
    --rz-tooltip-background-color: var(--psao-text-primary);
    --rz-tooltip-color: #ffffff;
    --rz-tooltip-border-radius: 6px;
    --rz-tooltip-font-size: 0.75rem;

    /* Botão de exportação Excel (ExcelExportButton.razor) — CTA escuro como nas prints */
    --rz-export-color: #1e293b;
    --rz-text-export-color: #ffffff;

    /* Botões dos diálogos de confirmação/eliminação (DeleteDialog.razor) */
    --rz-confirm-color: var(--psao-error);
    --rz-confirm-text-color: #ffffff;
    --rz-dialog-cancel-color: var(--psao-bg-gray);
    --rz-dialog-cancel-text-color: #374151;
}

/* ============ 2. Tipografia base ============ */
body {
    font-weight: 400;
    color: var(--rz-text-color);
}

/* ============ 2b. Banda de topo em gradiente azul (prints) ============ */
.main-content {
    position: relative;
}

.main-content:not(.auth-main-wrapper)::before {
    content: "";
    position: absolute;
    inset: 0 0 auto 0;
    height: 210px;
    background: url("/images/header.png") center center / cover no-repeat;
    pointer-events: none;
    z-index: 0;
}

.main-content > * {
    position: relative;
    z-index: 1;
}

/* Logo da sidebar com o tamanho do design (o corporate limita a 2rem) */
.sidenav .navbar-brand-img.big-size {
    max-height: 40px;
    height: 40px;
    width: auto !important;
    max-width: calc(100% - 1rem);
}

/* Sidebar mais compacta */
.sidenav .sidenav-header {
    height: 4rem;
    flex-shrink: 0;
}

/* Só a zona do meio do menu tem scroll — header e footer ficam fixos */
.sidenav.navbar-expand-xs {
    display: flex !important;
    flex-direction: column;
    overflow-y: hidden !important;
}

.sidenav .sidenav-body {
    display: flex !important;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: 0;
    height: auto !important;
    overflow: visible !important;
}

.sidenav .sidenav-scroll {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto !important;
}

.sidenav .sidenav-footer {
    flex-shrink: 0;
}

.sidenav .navbar-nav > .nav-item {
    margin-bottom: 0.125rem !important;
}

.sidenav .env-summary-item,
.sidenav .user-summary-item {
    margin-bottom: 0.25rem !important;
}

.sidenav hr.horizontal {
    margin: 0.5rem 0 !important;
}

/* Conteúdo colado à sidebar (sem faixa branca entre ambos) */
.sidenav.fixed-start:not(.d-lg-none) ~ .main-content {
    margin-left: 230px;
}

@media (min-width: 1200px) {
    .g-sidenav-hidden .navbar-vertical.fixed-start ~ .main-content {
        margin-left: 6rem;
    }
}

/* Navbar transparente sobre a banda, título e breadcrumb a branco */
.navbar-main {
    background: transparent !important;
    box-shadow: none !important;
}

.navbar-main .text-color,
.navbar-main .breadcrumb-item,
.navbar-main .breadcrumb-item a,
.navbar-main .breadcrumb-item span {
    color: rgba(255, 255, 255, 0.8) !important;
}

.navbar-main .breadcrumb-item + .breadcrumb-item::before {
    color: rgba(255, 255, 255, 0.6) !important;
}

.page-title-breadcrumb .breadcrumb-item:last-child {
    color: #ffffff !important;
    font-size: 1.125rem;
    font-weight: 600;
}

.navbar-main .sidenav-toggler-inner .sidenav-toggler-line {
    background-color: #ffffff !important;
}

/* Card "glass" translúcido sobre a banda (stat cards das prints) */
.rz-card.glass-card,
.card.glass-card {
    background: rgba(255, 255, 255, 0.72);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 1px solid rgba(255, 255, 255, 0.6);
}

.rz-text-h1, .rz-text-h2, .rz-text-h3, .rz-text-h4, .rz-text-h5, .rz-text-h6,
.rz-text-subtitle1, .rz-text-subtitle2 {
    color: var(--psao-text-primary);
    letter-spacing: -0.01em;
}

.rz-text-h5 { font-size: 1.25rem; font-weight: 600; }
.rz-text-h6 { font-size: 1rem; font-weight: 600; }
.rz-text-subtitle1 { font-size: 0.9375rem; font-weight: 600; }
.rz-text-subtitle2 { font-size: 0.875rem; font-weight: 600; }
.rz-text-body1 { font-size: 0.875rem; color: var(--psao-text-primary); }
.rz-text-body2 { font-size: 0.8125rem; color: var(--psao-text-secondary); }

/* ============ 3. Cards ============ */
.rz-card {
    background: #ffffff;
    border: 1px solid var(--psao-border);
    border-radius: var(--rz-card-border-radius);
    box-shadow: var(--rz-card-shadow);
}

/* ============ 4. Botões ============ */
.rz-button {
    font-size: var(--rz-body-font-size);
    letter-spacing: -0.0125rem;
    text-transform: none;
}

.rz-button-md {
    padding: 0.5rem 1.25rem;
    font-weight: 600;
}

.rz-button-md.rz-button-icon-only,
.rz-button-md.rz-pager-element {
    padding: 0.5rem;
}

.rz-button-lg {
    border-radius: 8px;
    font-size: 0.875rem;
    padding: 0.875rem 2rem;
}

/* CTAs primários escuros (slate) como nas prints: Guardar / Exportar / Sign in */
.rz-button.rz-primary,
.rz-button.rz-primary.rz-shade-default {
    background-color: var(--psao-sidenav-active);
    color: #ffffff;
}

.rz-button.rz-primary:enabled:hover { background-color: #111827; }
.rz-button.rz-primary:enabled:active { background-color: #0b1220; }

/* Secundário = botão branco com borda (ex.: "+ Linha", "Ver Todas") */
.rz-button.rz-secondary,
.rz-button.rz-secondary.rz-shade-default {
    background-color: #ffffff;
    color: #374151;
    border: 1px solid var(--psao-border);
}

.rz-button.rz-secondary:enabled:hover {
    background-color: #ffffff;
    border-color: var(--psao-text-secondary);
    color: var(--psao-text-primary);
}

.rz-button.rz-danger:enabled:hover { background-color: color-mix(in srgb, var(--rz-danger) 88%, black); }
.rz-button.rz-danger:enabled:active { background-color: color-mix(in srgb, var(--rz-danger) 78%, black); }
.rz-button.rz-success:enabled:hover { background-color: color-mix(in srgb, var(--rz-success) 88%, black); }
.rz-button.rz-warning:enabled:hover { background-color: color-mix(in srgb, var(--rz-warning) 88%, black); }
.rz-button.rz-info:enabled:hover { background-color: color-mix(in srgb, var(--rz-info) 88%, black); }
.rz-button.rz-base:enabled:hover { background-color: var(--psao-border); }

/* Light = botão "branco" com borda subtil, texto escuro */
.rz-button.rz-light,
.rz-button.rz-light.rz-shade-default {
    background-color: #ffffff;
    color: #374151;
    border: 1px solid var(--psao-border);
}

.rz-button.rz-light:enabled:hover {
    background-color: #ffffff;
    border-color: var(--psao-text-secondary);
    color: var(--psao-text-primary);
}

.rz-timepicker .rz-button-md { text-transform: none; }

/* ============ 5. Form field — label estático por cima ============ */
.rz-form-field {
    width: 100%;
}

/* Reserva espaço para a label acima da caixa do input */
.rz-form-field:has(> .rz-form-field-content > .rz-form-field-label) {
    padding-block-start: 1.4rem;
}

.rz-form-field .rz-form-field-label {
    position: absolute;
    inset-block-start: -1.4rem !important;
    inset-inline-start: 0.125rem !important;
    transform: none !important;
    padding: 0;
    max-width: 100%;
    font-size: 0.8125rem !important;
    font-weight: 600;
    line-height: 1.25rem;
    color: var(--rz-form-field-label-color) !important;
    background: transparent !important;
    transition: none;
}

.rz-form-field.rz-state-focused .rz-form-field-label,
.rz-form-field .invalid ~ .rz-form-field-label {
    color: var(--rz-form-field-label-color) !important;
}

.rz-state-disabled .rz-form-field-content > .rz-form-field-label {
    color: var(--psao-text-tertiary) !important;
}

/* Labels vazias (campos sem título) não reservam espaço nem renderizam */
.rz-form-field .rz-form-field-label:empty {
    display: none;
}

/* Texto dos inputs */
.rz-form-field-content,
.rz-textbox,
.rz-textarea,
.rz-dropdown,
.rz-multiselect,
.rz-numeric,
.rz-colorpicker,
.rz-datepicker > .rz-inputtext,
.rz-spinner {
    font-size: 0.875rem;
    color: var(--psao-text-primary);
}

.rz-form-field-content ::placeholder {
    color: var(--psao-text-tertiary);
}

/* Mensagens de validação */
.rz-message.rz-messages-error {
    font-size: 0.75rem;
    color: var(--psao-error);
}

/* ============ 6. Checkbox / Radio / Switch ============ */
.rz-chkbox-box {
    border-radius: var(--rz-checkbox-border-radius);
}

.rz-chkbox-box:not(.rz-state-active) {
    border: 1px solid var(--psao-border-light);
    background: #ffffff;
}

/* Switch compacto (base standard traz 3rem × 1.8rem — demasiado grande).
   O nudge de 2px para baixo alinha opticamente com o texto ao lado (o
   line-box do texto tem mais espaço abaixo da linha de base do que acima). */
.rz-switch {
    vertical-align: middle;
    width: 2.25rem;
    min-width: 2.25rem;
    height: 1.25rem;
    margin-top: 2px;
}

.rz-switch .rz-switch-circle:before {
    width: 0.875rem;
    height: 0.875rem;
    inset-inline-start: 0.1875rem;
    margin-block-start: -0.4375rem;
}

.rz-switch.rz-switch-checked .rz-switch-circle:before {
    transform: translateX(1rem);
}

/* ============ 7. DataGrid ============ */
.rz-data-grid {
    border-radius: var(--rz-card-border-radius);
}

.rz-grid-table thead th {
    letter-spacing: 0.04em;
    border-bottom: 1px solid var(--psao-border);
}

.rz-grid-table thead th .rz-column-title {
    color: var(--psao-text-secondary);
}

.rz-grid-table td {
    border-bottom: 1px solid var(--psao-bg-gray);
    color: var(--psao-text-primary);
}

.rz-grid-table tbody tr:last-child td {
    border-bottom: 0;
}

.rz-density-compact .rz-grid-table td {
    padding: 0.3125rem 0.625rem;
}

.rz-density-compact .rz-grid-table thead th {
    padding: 0.375rem 0.625rem;
}

.rz-grid-table td,
.rz-grid-table th {
    line-height: 1.35;
}

/* Scrollbars azuis nas tabelas (prints) */
.rz-data-grid ::-webkit-scrollbar {
    height: 8px;
    width: 8px;
}

.rz-data-grid ::-webkit-scrollbar-thumb {
    background: var(--psao-primary-light);
    border-radius: 4px;
}

.rz-data-grid ::-webkit-scrollbar-track {
    background: var(--psao-bg-gray);
    border-radius: 4px;
}

/* Pager */
.rz-pager {
    border: none;
    background: transparent;
    padding: 0.5rem 0.25rem 0.125rem;
    font-size: 0.8125rem;
}

.rz-pager .rz-pager-element {
    border-radius: var(--rz-pager-button-border-radius);
    font-weight: 500;
    box-shadow: none;
}

/* ============ 8. Tabs (pills) ============ */
.rz-tabview-nav {
    background: rgba(255, 255, 255, 0.55);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 1px solid rgba(255, 255, 255, 0.6);
    border-radius: 8px;
    padding: 0.25rem;
    gap: 0.25rem;
}

.rz-tabview-top > .rz-tabview-nav li,
.rz-tabview-nav li {
    border: none !important;
    border-radius: 6px;
    background-color: transparent;
}

.rz-tabview-nav li a {
    border-radius: 6px;
    font-size: 0.875rem;
}

.rz-tabview-nav li:hover:not(.rz-tabview-selected):not(.rz-state-disabled) {
    border-radius: 6px;
}

.rz-tabview-nav .rz-tabview-selected {
    background-color: #ffffff;
    box-shadow: var(--rz-shadow-xs);
    border-radius: 6px;
}

/* Sem barra de tinta/acento herdado */
.rz-tabview.rz-tabview-top > .rz-tabview-nav .rz-tabview-selected {
    border-bottom: none;
}

/* Conteúdo (search bar / tabela) mais colado às tabs */
.tabs-layout-shell {
    margin-bottom: -0.5rem;
}

/* Sem scrollbar visível por baixo das tabs (mantém o scroll por gesto/roda) */
.tabs-layout-shell .rz-tabview-nav {
    scrollbar-width: none;
}

.tabs-layout-shell .rz-tabview-nav::-webkit-scrollbar {
    display: none;
}

.rz-tabview,
.rz-tabview-panels {
    background: transparent;
}

/* ============ 9. Dialog ============ */
.rz-dialog-titlebar {
    padding: 1.25rem 1.5rem;
    border-bottom: 1px solid var(--psao-border);
}

.rz-dialog-title {
    color: var(--psao-text-primary);
}

.rz-dialog-content {
    padding: 1.5rem;
    color: var(--psao-text-primary);
}

/* Dialog lateral mantém cantos direitos rentes à borda */
.rz-dialog-side {
    border-radius: 0;
}

.rz-dialog-side .rz-dialog-titlebar {
    border-bottom: 1px solid var(--psao-border);
}

/* Confirm dialog */
.rz-dialog-confirm-buttons {
    gap: 0.5rem;
}

/* ============ 10. Notificações ============ */
.rz-notification-item {
    border: 1px solid rgba(0, 0, 0, 0.04);
    border-inline-start: 4px solid transparent;
    align-items: center;
}

.rz-notification-success .rz-notification-item { border-inline-start-color: var(--psao-success); }
.rz-notification-error .rz-notification-item { border-inline-start-color: var(--psao-error); }
.rz-notification-warn .rz-notification-item { border-inline-start-color: var(--psao-warning); }
.rz-notification-info .rz-notification-item { border-inline-start-color: var(--psao-info); }

.rz-notification-title {
    font-weight: 600;
    font-size: 0.875rem;
}

/* ============ 11. Popups / overlay panels ============ */
.rz-popup,
.rz-overlaypanel {
    background: #ffffff;
    border: 1px solid var(--psao-border);
    border-radius: 8px;
    box-shadow: var(--rz-shadow-lg);
}

.rz-dropdown-panel,
.rz-multiselect-panel,
.rz-autocomplete-panel {
    border-radius: 8px;
    overflow: hidden;
}

.rz-dropdown-items li,
.rz-multiselect-items li,
.rz-dropdown-item,
.rz-multiselect-item {
    border-radius: 6px;
    margin: 0.125rem 0.25rem;
}

.rz-dropdown-items li.rz-state-highlight,
.rz-multiselect-items li.rz-state-highlight,
.rz-dropdown-item.rz-state-highlight,
.rz-dropdown-items li:hover,
.rz-multiselect-items li:hover {
    border-radius: 6px !important;
}

.rz-dropdown-filter-container {
    padding: 0.5rem;
    border-bottom: 1px solid var(--psao-border);
}

/* Calendário do datepicker */
.rz-datepicker-group {
    border-radius: 8px;
}

/* ============ 12. Badges ============ */
.rz-badge {
    line-height: 1.2;
    padding: 0.3125rem 0.625rem;
}

.rz-badge-success { background: #d1fae5; color: #065f46; }
.rz-badge-danger { background: #fee2e2; color: #991b1b; }
.rz-badge-warning { background: #fef3c7; color: #92400e; }
.rz-badge-info { background: #ede9fe; color: #5b21b6; }
.rz-badge-primary { background: #dbeafe; color: #1e40af; }
.rz-badge-secondary { background: var(--psao-bg-gray); color: #374151; }
.rz-badge-light { background: var(--psao-bg-light); color: var(--psao-text-secondary); }

/* ============ 13. Skeleton / loading ============ */
.rz-skeleton {
    background-color: var(--psao-bg-gray);
    border-radius: 6px;
}

/* ============ 14. Acessibilidade — foco visível ============ */
.rz-button:focus-visible {
    outline: 2px solid var(--rz-primary);
    outline-offset: 2px;
}

/* ============ 15. Stat card (Components/Card/StatCard.razor) ============ */
.stat-card {
    display: flex;
    align-items: center;
    gap: 1rem;
    background: #ffffff;
    border: 1px solid var(--psao-border);
    border-radius: var(--rz-card-border-radius);
    box-shadow: var(--rz-card-shadow);
    padding: 1.125rem 1.25rem;
    height: 100%;
    min-height: 5.25rem;
}

.stat-card-icon {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    background: var(--rz-primary-lighter);
    border-radius: 10px;
    color: var(--rz-primary);
    font-size: 1.0625rem;
}

.stat-card-body {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
}

.stat-card-label {
    font-size: 0.8125rem;
    color: var(--psao-text-secondary);
    margin: 0;
    line-height: 1.3;
}

.stat-card-value {
    font-size: clamp(1.25rem, 1.35vw + 0.85rem, 1.75rem);
    font-weight: 700;
    color: var(--psao-text-primary);
    margin: 0;
    letter-spacing: -0.02em;
    line-height: 1.15;
    overflow-wrap: anywhere;
}

/* ============ 16. Sidebar — ícones e secções compactos ============ */
.sidenav .section-group-label {
    padding: 0.75rem 1rem 0.375rem;
    margin: 0;
    font-size: 0.6875rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.4);
}

.sidenav .menu-item-icon {
    width: 1.375rem;
    height: 1.375rem;
    background: transparent !important;
    border-radius: 0;
    color: rgba(255, 255, 255, 0.55);
    flex-shrink: 0;
}

.sidenav .menu-item-icon i {
    font-size: 1rem;
    color: inherit !important;
}

.sidenav .nav-link:hover .menu-item-icon,
.sidenav .nav-link.active .menu-item-icon {
    color: #ffffff;
}

.sidenav .menu-item-link {
    padding-right: 0.75rem;
}

.sidenav .menu-item-label {
    font-size: 0.8125rem;
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.sidenav .nav-link[data-bs-toggle="collapse"]::after {
    flex-shrink: 0;
    margin-left: 0.5rem !important;
}

.g-sidenav-hidden .sidenav .section-group-label,
.g-sidenav-hidden .sidenav .menu-item-label,
.g-sidenav-hidden .sidenav .username-text {
    display: none !important;
}

/* ============ Sidebar recolhida (icon-only) ============ */
/* NOTA: a lógica de recolhida/hover está centralizada em app.css
   ("SIDEBAR COLLAPSED MODE FIXES") para evitar duas fontes de verdade
   a competir pelas mesmas classes (.g-sidenav-hidden .navbar-vertical). */

/* Logout: apenas ícone, sem chrome de botão */
.logout-icon-btn.rz-button {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    color: rgba(255, 255, 255, 0.65) !important;
    width: 2rem;
    height: 2rem;
    min-width: 2rem;
    min-height: 2rem;
    padding: 0 !important;
    border-radius: 6px;
}

.logout-icon-btn.rz-button:enabled:hover {
    background: rgba(255, 255, 255, 0.1) !important;
    color: #ffffff !important;
}

/* ============ 17. Tabs — reforço de contraste do selecionado ============ */
.rz-tabview-nav li a,
.rz-tabview-nav li button {
    color: var(--psao-text-secondary);
    font-weight: 500;
}

.rz-tabview-nav .rz-tabview-selected {
    box-shadow: var(--rz-shadow-xs), inset 0 0 0 1px rgba(37, 99, 235, 0.12);
}

.rz-tabview-nav .rz-tabview-selected a,
.rz-tabview-nav .rz-tabview-selected button {
    color: var(--psao-primary) !important;
    font-weight: 700;
}

/* ============ 18. Checkbox — estado selecionado bem visível ============ */
/* Um form-field a envolver um checkbox/switch/radio não deve parecer uma caixa de texto:
   remove a borda/sombra/anel de foco do container, deixando o próprio controlo mostrar
   claramente o seu estado (senão o "input" gigante ofusca a caixinha pequena lá dentro). */
.rz-form-field:has(.rz-chkbox) .rz-form-field-content,
.rz-form-field:has(.rz-switch) .rz-form-field-content,
.rz-form-field:has(.rz-radiobutton) .rz-form-field-content {
    border: none !important;
    box-shadow: none !important;
    background: transparent !important;
}

.rz-chkbox-box {
    box-shadow: none !important;
}

.rz-chkbox-box.rz-state-active {
    background-color: var(--rz-primary) !important;
    border: 1px solid var(--rz-primary) !important;
    box-shadow: none !important;
}

.rz-chkbox-box.rz-state-active .rzi {
    color: #ffffff !important;
    font-size: 0.9375rem;
}

/* ============ 19. Botões de ação quadrados (IconButton sem texto) ============ */
.icon-only-btn.rz-button {
    width: 2.2rem;
    height: 2.2rem;
    min-width: 2.2rem;
    min-height: 2.2rem;
    padding: 0 !important;
}

.icon-only-btn.rz-button-xs {
    width: 1.6875rem;
    height: 1.6875rem;
    min-width: 1.6875rem;
    min-height: 1.6875rem;
}

.icon-only-btn.rz-button-sm {
    width: 2rem;
    height: 2rem;
    min-width: 2rem;
    min-height: 2rem;
}

.icon-only-btn i {
    margin: 0;
    line-height: 1;
}

.rz-chkbox-box.rz-state-active .rzi {
    color: var(--psao-text-primary) !important;
}
/* Sidebar counter pill (e.g. Validações: erros por resolver do ano ativo). */
.menu-item-badge {
    margin-left: auto;
    background-color: #dc2626;
    color: #fff;
    font-size: 0.7rem;
    font-weight: 700;
    line-height: 1;
    padding: 0.25rem 0.5rem;
    border-radius: 999px;
    min-width: 1.4rem;
    text-align: center;
}

/* ============ 20. Dashboard (Pages/Home.razor) ============ */
.stat-card-sublabel {
    font-size: 0.8125rem;
    color: var(--psao-text-secondary);
    white-space: nowrap;
}

.stat-card {
    position: relative;
}

.stat-card.has-action .stat-card-body {
    padding-right: 2.25rem;
}

.stat-card-action {
    position: absolute;
    top: 0.75rem;
    right: 0.75rem;
}

.dash-card-title {
    font-weight: 700;
    color: var(--psao-text-primary);
    margin: 0;
}

.dash-list-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.7rem 0.25rem;
    border-bottom: 1px solid var(--psao-border);
}

.dash-list-item:last-child {
    border-bottom: none;
}

.dash-list-item-name {
    font-weight: 600;
    color: var(--psao-text-primary);
    margin: 0;
}

.dash-badge {
    border-radius: 999px;
    font-size: 0.72rem;
    font-weight: 700;
    padding: 0.25rem 0.7rem;
    white-space: nowrap;
}

.dash-badge.ok {
    background: #dcfce7;
    color: #15803d;
    border: 1px solid #bbf7d0;
}

.dash-badge.err {
    background: #fee2e2;
    color: #b91c1c;
    border: 1px solid #fecaca;
}

.dash-notification-item {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.85rem 0.25rem 0.85rem 0.9rem;
    border-bottom: 1px solid var(--psao-border);
    border-left: 3px solid transparent;
}

.dash-notification-item:last-child {
    border-bottom: none;
}

.dash-notification-item.err {
    border-left-color: var(--psao-error);
}

.dash-notification-item.ok {
    border-left-color: var(--psao-success);
}

.dash-notification-item .dash-notification-heading {
    font-weight: 600;
    color: var(--psao-text-primary);
    margin: 0 0 0.1rem 0;
}

.dash-notification-item .dash-notification-message {
    color: var(--psao-text-secondary);
    font-size: 0.85rem;
    margin: 0 0 0.2rem 0;
}

.dash-notification-item .dash-notification-meta {
    color: var(--psao-text-tertiary);
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.dash-empty {
    color: var(--psao-text-tertiary);
    padding: 1rem 0.25rem;
}