/**
 * SGRH - Custom Theme Colors
 * Sistema de Gestión de Recursos Humanos
 * SPB Company - Custom Color Scheme
 */

/* ===================================
   FUENTE PERSONALIZADA
   =================================== */

@font-face {
    font-family: 'Plantagenet Cherokee';
    src: url('../fonts/Plantagenet Cherokee.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

:root {
    /* Fuente para títulos */
    --font-headings: 'Plantagenet Cherokee', system-ui, -apple-system, sans-serif;
    /* ===================================
       COLORES PRINCIPALES DEL PROYECTO
       =================================== */

    /* Primary Color - Verde SPB */
    --color-primary: #469D61;
    --color-primary-dark: #3a8350;
    --color-primary-light: #5db478;
    --color-primary-lighter: #d4ead9;
    --color-primary-rgb: 70, 157, 97;

    /* Secondary Color - Naranja */
    --color-secondary: #CD6A15;
    --color-secondary-dark: #a85511;
    --color-secondary-light: #e07f2e;
    --color-secondary-lighter: #f5dcc8;
    --color-secondary-rgb: 205, 106, 21;

    /* Tertiary Color - Marrón */
    --color-tertiary: #83542B;
    --color-tertiary-dark: #6b4523;
    --color-tertiary-light: #9d6737;
    --color-tertiary-lighter: #e4d5c8;
    --color-tertiary-rgb: 131, 84, 43;

    /* ===================================
       COLORES COMPLEMENTARIOS
       =================================== */

    /* Success - Verde (usando el primary) */
    --color-success: var(--color-primary);
    --color-success-dark: var(--color-primary-dark);
    --color-success-light: var(--color-primary-light);

    /* Warning - Naranja (usando el secondary) */
    --color-warning: var(--color-secondary);
    --color-warning-dark: var(--color-secondary-dark);
    --color-warning-light: var(--color-secondary-light);

    /* Info - Azul */
    --color-info: #3498db;
    --color-info-dark: #2980b9;
    --color-info-light: #5dade2;
    --color-info-lighter: #d6eaf8;

    /* Danger - Rojo */
    --color-danger: #e74c3c;
    --color-danger-dark: #c0392b;
    --color-danger-light: #ec7063;
    --color-danger-lighter: #fadbd8;

    /* ===================================
       COLORES NEUTROS
       =================================== */

    --color-dark: #2c3e50;
    --color-light: #ecf0f1;
    --color-white: #ffffff;
    --color-black: #000000;

    /* Grises */
    --color-gray-100: #f8f9fa;
    --color-gray-200: #e9ecef;
    --color-gray-300: #dee2e6;
    --color-gray-400: #ced4da;
    --color-gray-500: #adb5bd;
    --color-gray-600: #6c757d;
    --color-gray-700: #495057;
    --color-gray-800: #343a40;
    --color-gray-900: #212529;

    /* ===================================
       SOBRESCRITURA DE BOOTSTRAP
       =================================== */

    /* Bootstrap Color Overrides */
    --bs-primary: var(--color-primary);
    --bs-primary-rgb: var(--color-primary-rgb);
    --bs-secondary: var(--color-secondary);
    --bs-secondary-rgb: var(--color-secondary-rgb);
    --bs-success: var(--color-primary);
    --bs-success-rgb: var(--color-primary-rgb);
    --bs-warning: var(--color-secondary);
    --bs-warning-rgb: var(--color-secondary-rgb);
    --bs-info: var(--color-info);
    --bs-danger: var(--color-danger);

    /* Links */
    --bs-link-color: var(--color-primary);
    --bs-link-hover-color: var(--color-primary-dark);
}

/* ===================================
   CLASES AUXILIARES - BACKGROUNDS
   =================================== */

.bg-primary {
    background-color: var(--color-primary) !important;
}

.bg-secondary {
    background-color: var(--color-secondary) !important;
}

.bg-tertiary {
    background-color: var(--color-tertiary) !important;
    color: var(--color-white) !important;
}

.bg-success {
    background-color: var(--color-success) !important;
}

.bg-warning {
    background-color: var(--color-warning) !important;
    color: var(--color-white) !important;
}

/* ===================================
   CLASES AUXILIARES - TEXT COLORS
   =================================== */

.text-primary {
    color: var(--color-primary) !important;
}

.text-secondary {
    color: var(--color-secondary) !important;
}

.text-tertiary {
    color: var(--color-tertiary) !important;
}

.text-success {
    color: var(--color-success) !important;
}

.text-warning {
    color: var(--color-warning) !important;
}

/* ===================================
   CLASES AUXILIARES - BORDERS
   =================================== */

.border-primary {
    border-color: var(--color-primary) !important;
}

.border-secondary {
    border-color: var(--color-secondary) !important;
}

.border-tertiary {
    border-color: var(--color-tertiary) !important;
}

/* ===================================
   BOTONES PERSONALIZADOS
   =================================== */

.btn-primary {
    background-color: var(--color-primary);
    border-color: var(--color-primary);
    color: var(--color-white);
}

.btn-primary:hover,
.btn-primary:focus {
    background-color: var(--color-primary-dark);
    border-color: var(--color-primary-dark);
    color: var(--color-white);
}

.btn-secondary {
    background-color: var(--color-secondary);
    border-color: var(--color-secondary);
    color: var(--color-white);
}

.btn-secondary:hover,
.btn-secondary:focus {
    background-color: var(--color-secondary-dark);
    border-color: var(--color-secondary-dark);
    color: var(--color-white);
}

.btn-tertiary {
    background-color: var(--color-tertiary);
    border-color: var(--color-tertiary);
    color: var(--color-white);
}

.btn-tertiary:hover,
.btn-tertiary:focus {
    background-color: var(--color-tertiary-dark);
    border-color: var(--color-tertiary-dark);
    color: var(--color-white);
}

.btn-success {
    background-color: var(--color-success);
    border-color: var(--color-success);
}

.btn-success:hover,
.btn-success:focus {
    background-color: var(--color-success-dark);
    border-color: var(--color-success-dark);
}

.btn-warning {
    background-color: var(--color-warning);
    border-color: var(--color-warning);
    color: var(--color-white);
}

.btn-warning:hover,
.btn-warning:focus {
    background-color: var(--color-warning-dark);
    border-color: var(--color-warning-dark);
    color: var(--color-white);
}

/* Outline Buttons */
.btn-outline-primary {
    color: var(--color-primary);
    border-color: var(--color-primary);
}

.btn-outline-primary:hover,
.btn-outline-primary:focus {
    background-color: var(--color-primary);
    border-color: var(--color-primary);
    color: var(--color-white);
}

.btn-outline-secondary {
    color: var(--color-secondary);
    border-color: var(--color-secondary);
}

.btn-outline-secondary:hover,
.btn-outline-secondary:focus {
    background-color: var(--color-secondary);
    border-color: var(--color-secondary);
    color: var(--color-white);
}

.btn-outline-tertiary {
    color: var(--color-tertiary);
    border-color: var(--color-tertiary);
}

.btn-outline-tertiary:hover,
.btn-outline-tertiary:focus {
    background-color: var(--color-tertiary);
    border-color: var(--color-tertiary);
    color: var(--color-white);
}

/* ===================================
   BADGES & ALERTS
   =================================== */

.badge.bg-primary {
    background-color: var(--color-primary) !important;
}

.badge.bg-secondary {
    background-color: var(--color-secondary) !important;
}

.badge.bg-tertiary {
    background-color: var(--color-tertiary) !important;
}

.alert-primary {
    color: var(--color-primary-dark);
    background-color: var(--color-primary-lighter);
    border-color: var(--color-primary-light);
}

.alert-secondary {
    color: var(--color-secondary-dark);
    background-color: var(--color-secondary-lighter);
    border-color: var(--color-secondary-light);
}

.alert-tertiary {
    color: var(--color-tertiary-dark);
    background-color: var(--color-tertiary-lighter);
    border-color: var(--color-tertiary-light);
}

/* ===================================
   LINKS
   =================================== */

a {
    color: var(--color-primary);
    text-decoration: none;
}

a:hover {
    color: var(--color-primary-dark);
    text-decoration: underline;
}

/* ===================================
   NAVBAR PERSONALIZADO
   =================================== */

.navbar-dark.bg-success {
    background-color: var(--color-primary) !important;
}

.navbar-dark .navbar-brand:hover,
.navbar-dark .navbar-brand:focus {
    color: var(--color-primary-lighter);
}

/* ===================================
   FORMULARIOS
   =================================== */

.form-control:focus,
.form-select:focus {
    border-color: var(--color-primary-light);
    box-shadow: 0 0 0 0.25rem rgba(var(--color-primary-rgb), 0.25);
}

.form-check-input:checked {
    background-color: var(--color-primary);
    border-color: var(--color-primary);
}

/* ===================================
   TABLAS
   =================================== */

.table-primary {
    --bs-table-bg: var(--color-primary-lighter);
    --bs-table-border-color: var(--color-primary-light);
}

.table-secondary {
    --bs-table-bg: var(--color-secondary-lighter);
    --bs-table-border-color: var(--color-secondary-light);
}

.table-tertiary {
    --bs-table-bg: var(--color-tertiary-lighter);
    --bs-table-border-color: var(--color-tertiary-light);
}

/* ===================================
   UTILITIES
   =================================== */

/* Hover Effects */
.hover-primary:hover {
    background-color: var(--color-primary-lighter) !important;
}

.hover-secondary:hover {
    background-color: var(--color-secondary-lighter) !important;
}

.hover-tertiary:hover {
    background-color: var(--color-tertiary-lighter) !important;
}

/* Gradient Backgrounds */
.bg-gradient-primary {
    background: linear-gradient(135deg, var(--color-primary) 0%, var(--color-primary-dark) 100%);
}

.bg-gradient-secondary {
    background: linear-gradient(135deg, var(--color-secondary) 0%, var(--color-secondary-dark) 100%);
}

.bg-gradient-tertiary {
    background: linear-gradient(135deg, var(--color-tertiary) 0%, var(--color-tertiary-dark) 100%);
}

/* Card Headers */
.card-header-primary {
    background-color: var(--color-primary);
    color: var(--color-white);
}

.card-header-secondary {
    background-color: var(--color-secondary);
    color: var(--color-white);
}

.card-header-tertiary {
    background-color: var(--color-tertiary);
    color: var(--color-white);
}

/* ===================================
   TIPOGRAFÍA - TÍTULOS
   =================================== */

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
    font-family: var(--font-headings);
}

/* Navbar brand también usa la fuente de títulos */
.navbar-brand {
    font-family: var(--font-headings);
}

/* Opcional: card headers también pueden usar la fuente */
.card-header {
    font-family: var(--font-headings);
}