/* Canje Vecino — colores de la Corporación (mismos de Clínica Jurídica) */
:root {
    --navy: #1B3A6B;
    --navy-oscuro: #12284b;
    --gold: #C9A84C;
    --gold-claro: #F5E6C0;
    --fondo: #F0F4F8;
    --texto: #16222e;
    --texto-suave: #52606d;
    --bs-primary: #1B3A6B;
    --bs-primary-rgb: 27, 58, 107;
    --bs-link-color: #1B3A6B;
    --bs-link-color-rgb: 27, 58, 107;
}

body { background: var(--fondo); color: var(--texto); }

.btn-primary { --bs-btn-bg: var(--navy); --bs-btn-border-color: var(--navy);
    --bs-btn-hover-bg: var(--navy-oscuro); --bs-btn-hover-border-color: var(--navy-oscuro);
    --bs-btn-active-bg: var(--navy-oscuro); --bs-btn-disabled-bg: var(--navy); }
.btn-outline-primary { --bs-btn-color: var(--navy); --bs-btn-border-color: var(--navy);
    --bs-btn-hover-bg: var(--navy); --bs-btn-hover-border-color: var(--navy);
    --bs-btn-active-bg: var(--navy); }
.btn-gold { background: var(--gold); border-color: var(--gold); color: #1d1600; font-weight: 600; }
.btn-gold:hover { background: #b8963a; border-color: #b8963a; color: #1d1600; }

/* ---- Portal público ---- */
.portal-header { background: var(--navy); color: #fff; padding: 1rem 0; }
.portal-header img { height: 44px; }
.portal-hero { background: linear-gradient(135deg, var(--navy) 0%, #2a5394 100%); color: #fff;
    padding: 2.5rem 0 4.5rem; }
.portal-hero h1 { font-weight: 700; }
.portal-hero .lead { color: rgba(255,255,255,.85); }
.portal-cuerpo { margin-top: -3rem; }

.tarjeta-convenio { border: 0; border-radius: 14px; box-shadow: 0 4px 18px rgba(27,58,107,.10);
    transition: transform .15s, box-shadow .15s; height: 100%; }
.tarjeta-convenio:hover { transform: translateY(-3px); box-shadow: 0 8px 26px rgba(27,58,107,.16); }
.tarjeta-convenio .logo { height: 110px; display: flex; align-items: center; justify-content: center;
    background: #fff; border-bottom: 1px solid #e6ebf0; border-radius: 14px 14px 0 0; padding: 1rem; }
.tarjeta-convenio .logo img { max-height: 78px; max-width: 80%; object-fit: contain; }
.tarjeta-convenio .logo .sin-logo { font-size: 1.6rem; font-weight: 700; color: var(--navy); }
.etiqueta-marca { color: var(--gold); font-weight: 700; text-transform: uppercase; font-size: .78rem; letter-spacing: .06em; }

.caja { background: #fff; border-radius: 14px; box-shadow: 0 4px 18px rgba(27,58,107,.10); padding: 1.75rem; }

.codigo-entregado { background: var(--gold-claro); border: 2px dashed var(--gold); border-radius: 12px;
    padding: 1.25rem; text-align: center; }
.codigo-entregado .codigo { font-family: ui-monospace, Consolas, monospace; font-size: 1.9rem;
    font-weight: 700; letter-spacing: .08em; color: var(--navy); word-break: break-all; }

.portal-footer { color: var(--texto-suave); font-size: .875rem; padding: 2rem 0; }

/* ---- Panel ---- */
.panel-nav { background: var(--navy); }
.panel-nav .navbar-brand img { height: 34px; }
.panel-nav .nav-link { color: rgba(255,255,255,.8); }
.panel-nav .nav-link:hover, .panel-nav .nav-link.active { color: #fff; }
.panel-nav .nav-link.active { box-shadow: inset 0 -3px 0 var(--gold); }

.kpi { background: #fff; border-radius: 12px; padding: 1rem 1.25rem; box-shadow: 0 2px 10px rgba(27,58,107,.07); height: 100%; }
.kpi .valor { font-size: 1.9rem; font-weight: 700; color: var(--texto); line-height: 1.1; }
.kpi .etiqueta { color: var(--texto-suave); font-size: .85rem; }

.card { border: 0; border-radius: 12px; box-shadow: 0 2px 10px rgba(27,58,107,.07); }
.card-header { background: #fff; border-bottom: 1px solid #e6ebf0; font-weight: 600; border-radius: 12px 12px 0 0 !important; }
.grafico { position: relative; height: 260px; }
.table thead th { font-size: .8rem; text-transform: uppercase; letter-spacing: .03em; color: var(--texto-suave); }
.logo-mini { height: 32px; max-width: 70px; object-fit: contain; }