:root {
    --pinar-azul: #0b2e59;
    --pinar-azul-claro: #1c5da8;
    --pinar-teal: #14877e;
    --pinar-gris: #f4f6f9;
    --pinar-verde: #1e8e3e;
    --pinar-amarillo: #f2a900;
    --pinar-rojo: #d93025;
}

body {
    background-color: var(--pinar-gris);
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}

.pinar-navbar {
    background: linear-gradient(90deg, var(--pinar-azul) 0%, var(--pinar-azul-claro) 100%);
}

.pinar-navbar .navbar-brand {
    font-weight: 600;
    letter-spacing: .5px;
}

.pinar-sidebar {
    background-color: #ffffff;
    min-height: calc(100vh - 56px);
    border-right: 1px solid #e3e6ea;
}

.pinar-sidebar .nav-link {
    color: #333;
    border-radius: .375rem;
    padding: .55rem .9rem;
    font-size: .92rem;
}

.pinar-sidebar .nav-link.active,
.pinar-sidebar .nav-link:hover {
    background-color: var(--pinar-azul-claro);
    color: #fff;
}

.pinar-sidebar .nav-header {
    text-transform: uppercase;
    font-size: .72rem;
    font-weight: 700;
    color: #8a94a6;
    padding: 1rem .9rem .25rem;
}

.card-kpi {
    border: none;
    border-radius: .6rem;
    box-shadow: 0 1px 4px rgba(0, 0, 0, .08);
}

.badge-semaforo-Verde { background-color: var(--pinar-verde); color: #fff; }
.badge-semaforo-Amarillo { background-color: var(--pinar-amarillo); color: #1a1a1a; }
.badge-semaforo-Rojo { background-color: var(--pinar-rojo); color: #fff; }

.dot-semaforo {
    display: inline-block;
    width: .65rem;
    height: .65rem;
    border-radius: 50%;
    margin-right: .35rem;
}
.dot-Verde { background-color: var(--pinar-verde); }
.dot-Amarillo { background-color: var(--pinar-amarillo); }
.dot-Rojo { background-color: var(--pinar-rojo); }

.table-pinar thead {
    background-color: var(--pinar-azul);
    color: #fff;
}

.table-pinar thead th {
    font-size: .8rem;
    text-transform: uppercase;
    letter-spacing: .03em;
    vertical-align: middle;
}

.stat-card {
    border-radius: .75rem;
    padding: 1.1rem 1.25rem;
    color: #fff;
}

.stat-card .stat-value {
    font-size: 1.9rem;
    font-weight: 700;
}

.stat-card.bg-azul { background: linear-gradient(135deg, var(--pinar-azul), var(--pinar-azul-claro)); }
.stat-card.bg-teal { background: linear-gradient(135deg, #0d5c56, var(--pinar-teal)); }
.stat-card.bg-verde { background: linear-gradient(135deg, #145c2c, var(--pinar-verde)); }
.stat-card.bg-rojo { background: linear-gradient(135deg, #8f1c14, var(--pinar-rojo)); }

.login-wrapper {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, var(--pinar-azul) 0%, var(--pinar-teal) 100%);
}

.login-card {
    max-width: 420px;
    width: 100%;
    border: none;
    border-radius: .8rem;
}

.form-label {
    font-weight: 600;
    font-size: .85rem;
}

.required-field::after {
    content: " *";
    color: var(--pinar-rojo);
}
