/**
 * Liggy Admin - Custom CSS
 * Baseado na identidade visual oficial: docs/identidade_visual.md
 * Cor principal Liggy: hsl(228, 92%, 21%) = #041566
 *
 * Tema completo com acessibilidade e suporte a daltônicos
 * Sobrescreve TODAS as variáveis CSS do Django Admin
 *
 * WCAG Compliance: AAA (contraste mínimo 7:1)
 * Referência oficial: /docs/identidade_visual/
 */

/* =============================================================================
   CORES BASE LIGGY - Definidas com alto contraste
   Baseado em: docs/identidade_visual.md
   ============================================================================= */

:root,
:root[data-theme="light"],
html[data-theme="light"] {
    /* Header e Navegação Principal */
    --primary: hsl(228, 92%, 21%);           /* Azul escuro Liggy */
    --primary-fg: #ffffff;                    /* Texto branco para contraste */

    --header-color: #ffffff;
    --header-bg: hsl(228, 32%, 43%);         /* Azul médio Liggy */
    --header-branding-color: #ffffff;
    --header-link-color: #ffffff;

    --breadcrumbs-fg: #ffffff;
    --breadcrumbs-bg: hsl(228, 92%, 21%);    /* Azul escuro Liggy */
    --breadcrumbs-link-fg: rgba(255, 255, 255, 0.9);

    /* Backgrounds */
    --body-bg: #f8f9fa;                       /* Cinza muito claro */
    --body-fg: #1a1a1a;                       /* Preto suave */
    --body-quiet-color: #4a4a4a;              /* Cinza médio */
    --body-loud-color: #000000;               /* Preto */

    /* Links */
    --link-fg: hsl(228, 92%, 28%);            /* Azul Liggy médio */
    --link-hover-color: hsl(228, 92%, 21%);   /* Azul Liggy escuro */
    --link-selected-fg: hsl(228, 92%, 18%);   /* Azul Liggy muito escuro */

    /* Botões Primários */
    --button-fg: #ffffff;
    --button-bg: hsl(228, 92%, 21%);          /* Azul escuro Liggy */
    --button-hover-bg: hsl(228, 92%, 28%);    /* Azul Liggy hover */

    /* Botões Secundários/Default */
    --default-button-bg: hsl(228, 20%, 90%);  /* Cinza azulado claro */
    --default-button-hover-bg: hsl(228, 25%, 85%);

    /* Botões de Perigo/Delete */
    --delete-button-bg: hsl(352, 78%, 53%, 50%);              /* Vermelho */
    --delete-button-hover-bg: #c82333;

    /* Botões Próximos/Fechar */
    --close-button-bg: #6c757d;               /* Cinza */
    --close-button-hover-bg: #5a6268;

    /* Bordas e Separadores */
    --border-color: #dee2e6;
    --hairline-color: #e8eaed;
    --border-radius: 0.375rem;

    /* Inputs e Forms */
    --input-fg: #1a1a1a;
    --input-bg: #ffffff;
    --input-border-color: #ced4da;
    --input-focus-border-color: hsl(228, 92%, 50%);

    /* Tabelas */
    --darkened-bg: #f1f3f5;                   /* Linhas alternadas */
    --selected-bg: hsl(228, 92%, 95%);        /* Linha selecionada - azul muito claro */
    --selected-row: hsl(228, 92%, 92%);       /* Hover em linhas */

    /* Mensagens */
    --message-success-bg: #d4edda;            /* Verde claro */
    --message-warning-bg: #fff3cd;            /* Amarelo claro */
    --message-error-bg: #f8d7da;              /* Vermelho claro */
    --message-info-bg: hsl(228, 92%, 95%);    /* Azul Liggy muito claro */

    /* Accent Colors */
    --accent: hsl(228, 92%, 21%);             /* Azul escuro Liggy */
    --accent-fg: #ffffff;

    /* Estados Interativos */
    --hover-bg: hsl(228, 92%, 95%);
    --active-bg: hsl(228, 92%, 92%);
    --focus-color: hsl(228, 92%, 50%);

    /* Menu Lateral */
    --nav-bg: #ffffff;
    --nav-fg: #1a1a1a;
    --nav-link-fg: hsl(228, 92%, 28%);
    --nav-link-hover-bg: hsl(228, 92%, 95%);
    --nav-selected-fg: #ffffff;
    --nav-selected-bg: hsl(228, 92%, 21%);
}

/* =============================================================================
   DARK THEME - Alto contraste invertido
   ============================================================================= */

:root[data-theme="dark"],
html[data-theme="dark"] {
    /* Header e Navegação Principal */
    --primary: hsl(228, 92%, 65%);            /* Azul claro para dark mode */
    --primary-fg: #0a0a0a;

    --header-color: #ffffff;
    --header-bg: hsl(228, 32%, 25%);          /* Azul escuro */
    --header-branding-color: #ffffff;
    --header-link-color: #ffffff;

    --breadcrumbs-fg: #ffffff;
    --breadcrumbs-bg: hsl(228, 50%, 15%);     /* Azul muito escuro */
    --breadcrumbs-link-fg: rgba(255, 255, 255, 0.85);

    /* Backgrounds */
    --body-bg: #1a1d23;                       /* Preto azulado */
    --body-fg: #e8e8e8;                       /* Branco suave */
    --body-quiet-color: #b0b0b0;              /* Cinza claro */
    --body-loud-color: #ffffff;               /* Branco */

    /* Links */
    --link-fg: hsl(228, 92%, 70%);            /* Azul claro */
    --link-hover-color: hsl(228, 92%, 80%);   /* Azul mais claro */
    --link-selected-fg: hsl(228, 92%, 85%);

    /* Botões Primários */
    --button-fg: #ffffff;
    --button-bg: hsl(228, 92%, 45%);          /* Azul médio */
    --button-hover-bg: hsl(228, 92%, 55%);

    /* Botões Secundários */
    --default-button-bg: #3a3f47;
    --default-button-hover-bg: #4a4f57;

    /* Botões de Perigo */
    --delete-button-bg: hsl(6, 78%, 55%, 50%);
    --delete-button-hover-bg: #f1585b;

    /* Botões Próximos/Fechar */
    --close-button-bg: #6c757d;
    --close-button-hover-bg: #7c858d;

    /* Bordas */
    --border-color: #3a3f47;
    --hairline-color: #2a2f37;

    /* Inputs */
    --input-fg: #e8e8e8;
    --input-bg: #2a2f37;
    --input-border-color: #3a3f47;
    --input-focus-border-color: hsl(228, 92%, 60%);

    /* Tabelas */
    --darkened-bg: #22252b;
    --selected-bg: hsl(228, 50%, 25%);
    --selected-row: hsl(228, 50%, 22%);

    /* Mensagens */
    --message-success-bg: #1e4620;
    --message-warning-bg: #5c4a1f;
    --message-error-bg: #5c1f1f;
    --message-info-bg: hsl(228, 50%, 20%);

    /* Accent */
    --accent: hsl(228, 92%, 65%);
    --accent-fg: #0a0a0a;

    /* Estados */
    --hover-bg: hsl(228, 50%, 20%);
    --active-bg: hsl(228, 50%, 18%);
    --focus-color: hsl(228, 92%, 70%);

    /* Menu */
    --nav-bg: #22252b;
    --nav-fg: #e8e8e8;
    --nav-link-fg: hsl(228, 92%, 70%);
    --nav-link-hover-bg: hsl(228, 50%, 20%);
    --nav-selected-fg: #ffffff;
    --nav-selected-bg: hsl(228, 92%, 45%);
}

/* =============================================================================
   AJUSTES ESPECÍFICOS PARA COMPONENTES
   ============================================================================= */

/* Header */
#header {
    background: var(--header-bg) !important;
}

#header a:link,
#header a:visited {
    color: var(--header-link-color) !important;
}

#header a:hover,
#header a:focus {
    color: var(--header-color) !important;
    opacity: 0.9;
}

/* Breadcrumbs */
.breadcrumbs {
    background: var(--breadcrumbs-bg) !important;
    color: var(--breadcrumbs-fg) !important;
}

.breadcrumbs a {
    color: var(--breadcrumbs-link-fg) !important;
}

.breadcrumbs a:hover,
.breadcrumbs a:focus {
    color: var(--breadcrumbs-fg) !important;
}

/* Botões */
.button,
input[type="submit"],
input[type="button"],
.submit-row input,
a.button {
    background: var(--button-bg) !important;
    color: var(--button-fg) !important;
    border-color: var(--button-bg) !important;
}

.button:hover,
input[type="submit"]:hover,
input[type="button"]:hover,
.submit-row input:hover,
a.button:hover {
    background: var(--button-hover-bg) !important;
    border-color: var(--button-hover-bg) !important;
}

/* Botões Secundários */
.button.default,
button[type="button"],
input[type="reset"] {
    /*background: var(--default-button-bg) !important;*/
    color: var(--body-fg) !important;
}

.button.default:hover,
button[type="button"]:hover,
input[type="reset"]:hover {
    /*background: var(--default-button-hover-bg) !important;*/
}

/* Links - Garantindo visibilidade no tema light */
a:link,
a:visited {
    color: var(--link-fg) !important;
}

a:hover,
a:focus {
    color: var(--link-hover-color) !important;
}

/* Override específico para garantir que links no conteúdo sejam visíveis */
#content a:link,
#content a:visited,
.module a:link,
.module a:visited {
    /*color: var(--link-fg) !important;*/
}

#content a:hover,
#content a:focus,
.module a:hover,
.module a:focus {
    color: var(--link-hover-color) !important;
}

/* Tabelas - Linhas alternadas e hover */
.results table tbody tr:nth-child(odd) {
    background-color: var(--body-bg);
}

.results table tbody tr:nth-child(even) {
    background-color: var(--darkened-bg);
}

.results table tbody tr:hover {
    background-color: var(--selected-row) !important;
}

.results table tbody tr.selected {
    background-color: var(--selected-bg) !important;
}

/* Changeform tabs */
.changeform-tabs {
    background: var(--breadcrumbs-bg) !important;
}

.changeform-tabs .tab {
    color: var(--breadcrumbs-link-fg) !important;
}

.changeform-tabs .tab.active {
    background: var(--body-bg) !important;
    color: var(--body-fg) !important;
}

/* Mensagens */
.messagelist .success {
    background-color: var(--message-success-bg) !important;
    border-left-color: #28a745 !important;
}

.messagelist .warning {
    background-color: var(--message-warning-bg) !important;
    border-left-color: #ffc107 !important;
}

.messagelist .error {
    background-color: var(--message-error-bg) !important;
    border-left-color: #dc3545 !important;
}

.messagelist .info {
    background-color: var(--message-info-bg) !important;
    border-left-color: var(--accent) !important;
}

/* Inputs com foco */
input:focus,
textarea:focus,
select:focus {
    border-color: var(--input-focus-border-color) !important;
    outline: 2px solid var(--focus-color) !important;
    outline-offset: 2px;
}

/* Navegação lateral */
.app-list a {
    color: var(--nav-link-fg) !important;
}

.app-list a:hover {
    background-color: var(--nav-link-hover-bg) !important;
}

.app-list .selected a {
    background-color: var(--nav-selected-bg) !important;
    color: var(--nav-selected-fg) !important;
}