/* ============================================================
   SAGA — Sistema Automatizado para la Gestión de Archivos
   Custom Styles — Bootstrap 5 complement
   Paleta institucional:
     #009885  Primario  (verde-azul)
     #C90166  Acento    (magenta)
     #AE192D  Énfasis   (rojo)
     #010101  Oscuro    (casi negro)
     #D3C2B4  Neutro    (beige cálido)
   ============================================================ */

/* ----- Variables Bootstrap — Override ----- */
:root {
    --bs-primary:          #009885;
    --bs-primary-rgb:      0, 152, 133;
    --bs-danger:           #AE192D;
    --bs-danger-rgb:       174, 25, 45;
    --bs-link-color:       #009885;
    --bs-link-hover-color: #007a6a;

    /* Variables institucionales propias */
    --saga-primary:   #009885;
    --saga-pink:      #C90166;
    --saga-red:       #AE192D;
    --saga-dark:      #010101;
    --saga-beige:     #D3C2B4;
    --saga-primary-light: rgba(0, 152, 133, .12);
    --saga-pink-light:    rgba(201, 1, 102, .12);
    --saga-red-light:     rgba(174, 25, 45, .12);
}

/* ----- Layout ----- */
body {
    background-color: #f4f6f9;
    font-family: 'Segoe UI', system-ui, -apple-system, sans-serif;
    color: #1a1a1a;
}

.navbar-brand img {
    height: 36px;
    width: auto;
}

/* Navbar — usa bg-primary que ya toma --bs-primary */
.navbar.bg-primary {
    background-color: var(--saga-primary) !important;
}

/* Navbar active link */
.navbar .nav-link.active,
.navbar .nav-link:focus {
    font-weight: 600;
}

/* ----- Bootstrap button — primary override ----- */
.btn-primary {
    background-color: var(--saga-primary);
    border-color: var(--saga-primary);
    color: #fff;
}
.btn-primary:hover,
.btn-primary:focus {
    background-color: #007a6a;
    border-color: #007a6a;
    color: #fff;
}
.btn-outline-primary {
    color: var(--saga-primary);
    border-color: var(--saga-primary);
}
.btn-outline-primary:hover {
    background-color: var(--saga-primary);
    border-color: var(--saga-primary);
    color: #fff;
}

/* Danger override */
.btn-danger,
.btn-outline-danger:hover {
    background-color: var(--saga-red);
    border-color: var(--saga-red);
}
.btn-outline-danger {
    color: var(--saga-red);
    border-color: var(--saga-red);
}

/* ----- Utility — colores institucionales ----- */
.bg-inst-primary   { background-color: var(--saga-primary) !important; }
.bg-inst-pink      { background-color: var(--saga-pink)    !important; }
.bg-inst-red       { background-color: var(--saga-red)     !important; }
.bg-inst-dark      { background-color: var(--saga-dark)    !important; }
.bg-inst-beige     { background-color: var(--saga-beige)   !important; }

.bg-inst-primary-light { background-color: var(--saga-primary-light) !important; }
.bg-inst-pink-light    { background-color: var(--saga-pink-light)    !important; }
.bg-inst-red-light     { background-color: var(--saga-red-light)     !important; }

.text-inst-primary { color: var(--saga-primary) !important; }
.text-inst-pink    { color: var(--saga-pink)    !important; }
.text-inst-red     { color: var(--saga-red)     !important; }
.text-inst-dark    { color: var(--saga-dark)    !important; }
.text-inst-beige   { color: var(--saga-beige)   !important; }

.border-inst-primary { border-color: var(--saga-primary) !important; }
.border-inst-pink    { border-color: var(--saga-pink)    !important; }
.border-inst-red     { border-color: var(--saga-red)     !important; }

.btn-outline-inst-pink {
    color: var(--saga-pink);
    border-color: var(--saga-pink);
    background: transparent;
}
.btn-outline-inst-pink:hover {
    background-color: var(--saga-pink);
    border-color: var(--saga-pink);
    color: #fff;
}
.btn-outline-inst-red {
    color: var(--saga-red);
    border-color: var(--saga-red);
    background: transparent;
}
.btn-outline-inst-red:hover {
    background-color: var(--saga-red);
    border-color: var(--saga-red);
    color: #fff;
}

/* ----- Cards ----- */
.card {
    border-radius: .625rem;
}

.card-header {
    background-color: #fff;
    border-bottom: 2px solid #e9ecef;
    font-weight: 600;
}

/* Dashboard stat cards */
.stat-card {
    border-left: 4px solid;
    transition: transform .15s ease, box-shadow .15s ease;
}
.stat-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 .5rem 1rem rgba(0,0,0,.1) !important;
}
.stat-card .stat-icon {
    opacity: .15;
    font-size: 3rem;
    position: absolute;
    right: 1rem;
    top: 50%;
    transform: translateY(-50%);
}
.stat-card-primary   { border-left-color: var(--saga-primary); }
.stat-card-pink      { border-left-color: var(--saga-pink);    }
.stat-card-red       { border-left-color: var(--saga-red);     }
.stat-card-beige     { border-left-color: var(--saga-beige);   }
.stat-card-dark      { border-left-color: var(--saga-dark);    }
/* Legacy aliases */
.stat-card-warning   { border-left-color: var(--saga-primary); }
.stat-card-success   { border-left-color: var(--saga-pink);    }
.stat-card-danger    { border-left-color: var(--saga-red);     }
.stat-card-info      { border-left-color: #0dcaf0; }
.stat-card-secondary { border-left-color: var(--saga-dark);    }

/* ----- Tables ----- */
.table th {
    font-size: .8125rem;
    text-transform: uppercase;
    letter-spacing: .03em;
    color: #495057;
    white-space: nowrap;
}

.table td {
    vertical-align: middle;
    font-size: .9rem;
}

/* Row states */
tr.row-caducado td {
    background-color: #fff3cd !important;
}
tr.row-prestado td {
    background-color: #cff4fc !important;
}
tr.row-baja td {
    background-color: #f8d7da !important;
    text-decoration: line-through;
    opacity: .75;
}

/* ----- Badges de estado de expediente ----- */
.badge-tramite       { background-color: var(--saga-primary); }
.badge-concentracion { background-color: var(--saga-pink);    }
.badge-historico     { background-color: var(--saga-red);     }
.badge-baja          { background-color: var(--saga-dark);    }

/* ----- Forms ----- */
.form-label {
    font-weight: 500;
    font-size: .875rem;
}

.form-section-title {
    font-size: .75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .06em;
    color: #6c757d;
    border-bottom: 2px solid var(--saga-beige);
    padding-bottom: .4rem;
    margin-bottom: 1rem;
}

/* Required asterisk */
.required::after {
    content: ' *';
    color: var(--saga-red);
}

/* Focus ring institucional */
.form-control:focus,
.form-select:focus {
    border-color: var(--saga-primary);
    box-shadow: 0 0 0 .2rem rgba(0, 152, 133, .25);
}

/* ----- jsTree ----- */
#arbol-clasificacion {
    min-height: 300px;
    max-height: 600px;
    overflow-y: auto;
    border: 1px solid #dee2e6;
    border-radius: .375rem;
    padding: .5rem;
    background: #fff;
}

.jstree-default .jstree-clicked {
    background: var(--saga-primary-light);
    border-radius: 4px;
}

/* ----- Flatpickr ----- */
.flatpickr-input[readonly] {
    background-color: #fff;
    cursor: pointer;
}

/* ----- DataTables ----- */
div.dataTables_wrapper div.dataTables_filter input,
div.dataTables_wrapper div.dataTables_length select {
    border: 1px solid #ced4da;
    border-radius: .375rem;
    padding: .25rem .5rem;
}

/* ----- Alerts / Flash Messages ----- */
.alert-flash {
    position: fixed;
    top: 1rem;
    right: 1rem;
    z-index: 1090;
    min-width: 280px;
    max-width: 420px;
    box-shadow: 0 .25rem .75rem rgba(0,0,0,.15);
    animation: slideIn .3s ease;
}

@keyframes slideIn {
    from { transform: translateX(120%); opacity: 0; }
    to   { transform: translateX(0);    opacity: 1; }
}

/* ----- Classification info badge ----- */
.clasificado-badge {
    font-size: .7rem;
    padding: .2em .5em;
}

/* ----- Dropdown activo ----- */
.dropdown-item.active,
.dropdown-item:active {
    background-color: var(--saga-primary-light);
    color: var(--saga-primary);
}

/* ----- Print helpers ----- */
@media print {
    .no-print, .btn, .navbar, footer { display: none !important; }
    .card { border: none !important; box-shadow: none !important; }
}

/* ----- Misc ----- */
.text-truncate-2 {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.cursor-pointer { cursor: pointer; }

.fs-7  { font-size: .8125rem; }
.fs-8  { font-size: .75rem; }

/* Breadcrumb */
.breadcrumb-item + .breadcrumb-item::before {
    content: '›';
}

/* Footer */
footer {
    border-top-color: var(--saga-beige) !important;
    color: #6c757d;
}