/* ============================================================
   SIGA — UTN FRTDF  |  Identidad visual institucional
   Azul oscuro  : #1E3A6E  (sidebar, brand bar)
   Azul primario: #4472C4  (navbar accent, links)
   Naranja UTN  : #F28C28  (buttons, active items)
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;600;700;800&family=Inter:wght@400;500;600&display=swap');

/* ── CSS variables ─────────────────────────────────────────── */
:root {
    --siga-primary:       #4472C4;
    --siga-dark:          #1E3A6E;
    --siga-accent:        #F28C28;
    --siga-accent-hover:  #D4760E;
    --siga-body-bg:       #F4F6F9;
    --siga-card-shadow:   0 2px 10px rgba(0, 0, 0, 0.08);
    --siga-radius:        12px;
    --siga-radius-sm:     8px;
}

/* ── Base typography ────────────────────────────────────────── */
body {
    font-family: 'Inter', sans-serif !important;
}

h1, h2, h3, h4, h5, h6,
.content-header h1,
.brand-text,
.card-title {
    font-family: 'Montserrat', sans-serif !important;
}

/* ── Body / content background ──────────────────────────────── */
body,
.wrapper,
.content-wrapper {
    background-color: var(--siga-body-bg) !important;
}

/* ── Sidebar ────────────────────────────────────────────────── */
.main-sidebar,
.main-sidebar::before {
    background-color: var(--siga-dark) !important;
}

/* Active nav item */
.sidebar-dark-primary .nav-sidebar > .nav-item > .nav-link.active,
.sidebar-dark-primary .nav-sidebar > .nav-item.menu-open > .nav-link {
    background-color: var(--siga-accent) !important;
    color: #fff !important;
    border-radius: var(--siga-radius-sm) !important;
}

/* Hover */
.sidebar-dark-primary .nav-sidebar > .nav-item > .nav-link:hover {
    background-color: rgba(255, 255, 255, 0.1) !important;
    color: #fff !important;
    border-radius: var(--siga-radius-sm) !important;
}

/* Section headers */
.sidebar-dark-primary .nav-header {
    color: rgba(255, 255, 255, 0.45) !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: .65rem !important;
    letter-spacing: .12em !important;
    text-transform: uppercase !important;
}

/* Sidebar nav links */
.sidebar-dark-primary .nav-sidebar .nav-link {
    color: rgba(255, 255, 255, 0.85) !important;
    border-radius: var(--siga-radius-sm) !important;
    margin: 2px 8px !important;
}

/* Sidebar scrollbar */
.sidebar .nav-sidebar {
    padding: 4px 0;
}

/* ── Brand / logo bar ────────────────────────────────────────── */
.brand-link,
.main-header.navbar .brand-link {
    background-color: rgba(0, 0, 0, 0.25) !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
    color: #fff !important;
}

.brand-link .brand-text {
    color: #fff !important;
    font-family: 'Montserrat', sans-serif !important;
    font-weight: 700 !important;
    letter-spacing: .02em !important;
}

.brand-link .brand-image {
    border-radius: 4px !important;
}

/* ── Top navbar ─────────────────────────────────────────────── */
.main-header.navbar {
    background-color: #fff !important;
    border-bottom: 3px solid var(--siga-accent) !important;
    box-shadow: 0 1px 6px rgba(0, 0, 0, 0.08) !important;
}

.main-header .navbar-nav .nav-link {
    color: var(--siga-dark) !important;
}

.main-header .navbar-nav .nav-link:hover {
    color: var(--siga-accent) !important;
}

/* Hamburger / sidebar toggle */
.nav-item .nav-link[data-widget="pushmenu"] {
    color: var(--siga-dark) !important;
}

/* ── Primary buttons ─────────────────────────────────────────── */
.btn-primary {
    background-color: var(--siga-accent) !important;
    border-color: var(--siga-accent) !important;
    color: #fff !important;
    border-radius: var(--siga-radius-sm) !important;
    font-weight: 600 !important;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-primary.active {
    background-color: var(--siga-accent-hover) !important;
    border-color: var(--siga-accent-hover) !important;
    color: #fff !important;
}

/* Secondary button polish */
.btn-secondary,
.btn-default {
    border-radius: var(--siga-radius-sm) !important;
}

.btn-success,
.btn-danger,
.btn-warning,
.btn-info,
.btn-dark {
    border-radius: var(--siga-radius-sm) !important;
}

/* Small buttons */
.btn-sm {
    border-radius: 6px !important;
}

/* ── Cards ───────────────────────────────────────────────────── */
.card {
    border-radius: var(--siga-radius) !important;
    box-shadow: var(--siga-card-shadow) !important;
    border: none !important;
    background-color: var(--siga-card-bg, #fff) !important;
}

.card .card-header {
    border-radius: calc(var(--siga-radius) - 1px) calc(var(--siga-radius) - 1px) 0 0 !important;
    border-bottom: 1px solid rgba(0, 0, 0, 0.06) !important;
    background-color: #fff !important;
}

/* Card outline variants */
.card-outline.card-primary {
    border-top: 3px solid var(--siga-accent) !important;
    border-left: none !important;
    border-right: none !important;
    border-bottom: none !important;
}

.card-outline.card-secondary {
    border-top: 3px solid var(--siga-dark) !important;
    border-left: none !important;
    border-right: none !important;
    border-bottom: none !important;
}

.card-outline.card-info {
    border-top: 3px solid var(--siga-primary) !important;
    border-left: none !important;
    border-right: none !important;
    border-bottom: none !important;
}

.card-outline.card-success {
    border-top: 3px solid #28a745 !important;
}

.card-outline.card-warning {
    border-top: 3px solid var(--siga-accent) !important;
}

.card-outline.card-danger {
    border-top: 3px solid #dc3545 !important;
}

/* ── Info boxes ──────────────────────────────────────────────── */
.info-box {
    border-radius: var(--siga-radius) !important;
    box-shadow: var(--siga-card-shadow) !important;
}

.info-box-icon.bg-primary,
.info-box-icon.bg-blue {
    background-color: var(--siga-dark) !important;
    border-radius: var(--siga-radius) 0 0 var(--siga-radius) !important;
}

.info-box-icon.bg-info {
    background-color: var(--siga-primary) !important;
    border-radius: var(--siga-radius) 0 0 var(--siga-radius) !important;
}

.info-box-icon.bg-warning {
    background-color: var(--siga-accent) !important;
    border-radius: var(--siga-radius) 0 0 var(--siga-radius) !important;
}

/* ── Badges ──────────────────────────────────────────────────── */
.badge-primary {
    background-color: var(--siga-dark) !important;
}

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

/* ── Nav tabs ────────────────────────────────────────────────── */
.nav-tabs .nav-link.active {
    border-top: 3px solid var(--siga-accent) !important;
    color: var(--siga-dark) !important;
    font-weight: 600 !important;
    font-family: 'Montserrat', sans-serif !important;
}

.nav-tabs .nav-link:hover {
    color: var(--siga-accent) !important;
}

/* ── Links ───────────────────────────────────────────────────── */
a {
    color: var(--siga-primary);
}

a:hover {
    color: var(--siga-dark);
}

/* ── Content header ─────────────────────────────────────────── */
.content-header h1 {
    color: var(--siga-dark) !important;
    font-size: 1.35rem !important;
    font-weight: 700 !important;
}

/* ── Auth pages ─────────────────────────────────────────────── */
.login-page,
.register-page {
    background: linear-gradient(150deg, var(--siga-dark) 0%, var(--siga-primary) 100%) !important;
}

.login-box {
    width: 380px !important;
}

.register-box {
    width: 520px !important;
}

.login-box .card,
.register-box .card {
    border-radius: var(--siga-radius) !important;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3) !important;
    overflow: hidden;
}

/* Logo area centrado y apilado verticalmente */
.login-logo a,
.register-logo a {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
    color: #fff !important;
    text-decoration: none !important;
    gap: 4px;
}

/* Imagen de marca — no recortada, proporcional */
.login-logo a > img,
.register-logo a > img {
    display: block !important;
    max-width: 200px !important;
    width: 100% !important;
    height: auto !important;
    margin-bottom: 4px;
}

/* SIGA en negrita */
.login-logo a > b,
.register-logo a > b {
    font-size: 1.5rem;
    font-family: 'Montserrat', sans-serif;
    font-weight: 800;
    letter-spacing: .03em;
    line-height: 1.1;
}

/* Subtítulo centrado */
.login-logo small,
.register-logo small {
    display: block;
    font-size: .72rem;
    font-weight: 400;
    color: rgba(255, 255, 255, 0.8);
    letter-spacing: .05em;
    text-align: center;
    line-height: 1.4;
}

/* Auth card header */
.card.card-outline.card-primary > .card-header {
    background-color: var(--siga-dark) !important;
    color: #fff !important;
    border-bottom: none !important;
}

.card-outline.card-primary .card-header h1.login-box-msg,
.login-box-msg {
    color: var(--siga-dark) !important;
    font-family: 'Montserrat', sans-serif !important;
    font-weight: 600 !important;
    font-size: 1.05rem !important;
}

/* iCheck primary color */
.icheck-primary > input:first-child:checked + label::before,
.icheck-primary > input:first-child:checked + input[type="hidden"] + label::before {
    background-color: var(--siga-accent) !important;
    border-color: var(--siga-accent) !important;
}

/* ── Form controls ───────────────────────────────────────────── */
.form-control:focus {
    border-color: var(--siga-accent) !important;
    box-shadow: 0 0 0 0.2rem rgba(242, 140, 40, 0.2) !important;
}

/* ── Tables ──────────────────────────────────────────────────── */
.table-hover tbody tr:nth-child(even) {
    background-color: #f8fafd;
}

.table-success td,
td.table-success {
    background-color: #d4edda !important;
}

/* ── QR card ────────────────────────────────────────────────── */
.qr-container {
    text-align: center;
    padding: 1.5rem;
}

.qr-container img,
.qr-container canvas,
.qr-container svg {
    max-width: 240px;
    border: 4px solid var(--siga-dark);
    border-radius: var(--siga-radius-sm);
    padding: 8px;
    background: #fff;
}

/* ── Footer ─────────────────────────────────────────────────── */
.main-footer {
    background-color: #fff !important;
    border-top: 1px solid #e0e7ef !important;
    color: #8898a9 !important;
    font-size: .78rem !important;
    text-align: center !important;
    padding: .6rem 1rem !important;
}

/* ── Flash / alert auto-dismiss ─────────────────────────────── */
.alert-autohide {
    transition: opacity .5s ease;
}

.alert-autohide.fading {
    opacity: 0;
}

/* ── Sidebar brand text ──────────────────────────────────────── */
.sidebar-dark-primary .sidebar-brand-text {
    color: #fff !important;
}

/* Ocultar subtítulo en sidebar — solo se muestra en auth pages */
.brand-link .brand-text small {
    display: none !important;
}

/* ── Breadcrumb ──────────────────────────────────────────────── */
.breadcrumb-item.active {
    color: var(--siga-dark) !important;
}

.breadcrumb-item + .breadcrumb-item::before {
    color: #aab4c0 !important;
}

/* ── Pagination ──────────────────────────────────────────────── */
.page-item.active .page-link {
    background-color: var(--siga-accent) !important;
    border-color: var(--siga-accent) !important;
    color: #fff !important;
}

.page-link {
    color: var(--siga-dark) !important;
    border-radius: 6px !important;
}

.page-link:hover {
    color: var(--siga-accent) !important;
    background-color: #f0f4fa !important;
}