/* Agenda por Equipos — estilos base */
:root {
    --ag-azul: #1d4e89;
    --ag-azul-oscuro: #143a66;
    --ag-fondo: #f4f6f9;
    --ag-lateral: 248px;
    --bs-primary: #1d4e89;
    --bs-primary-rgb: 29, 78, 137;
    --bs-link-color: #1d4e89;
    --bs-link-color-rgb: 29, 78, 137;
}

body { background: var(--ag-fondo); }

.btn-primary {
    --bs-btn-bg: var(--ag-azul);
    --bs-btn-border-color: var(--ag-azul);
    --bs-btn-hover-bg: var(--ag-azul-oscuro);
    --bs-btn-hover-border-color: var(--ag-azul-oscuro);
    --bs-btn-active-bg: var(--ag-azul-oscuro);
}

/* Menú lateral */
.app-lateral {
    width: var(--ag-lateral);
    /* !important: offcanvas-lg de Bootstrap deja el fondo transparente en pantallas grandes */
    background: var(--ag-azul-oscuro) !important;
    color: #fff;
}
.login .form-control::placeholder { text-transform: none; }
@media (min-width: 992px) {
    .app-lateral { position: fixed; inset: 0 auto 0 0; overflow-y: auto; }
    .app-contenido { margin-left: var(--ag-lateral); }
}
.app-marca { display: flex; align-items: center; gap: .75rem; padding: 1.25rem 1.25rem 1rem; }
.app-marca > i { font-size: 1.75rem; }
.app-marca strong { display: block; font-size: 1.1rem; line-height: 1.1; }
.app-marca small { opacity: .7; font-size: .8rem; }
.app-menu { padding: .5rem .75rem 1.5rem; }
.app-menu-item {
    display: flex; align-items: center; gap: .75rem;
    padding: .55rem .75rem; border-radius: .5rem;
    color: rgba(255, 255, 255, .85); text-decoration: none; font-size: .925rem;
}
.app-menu-item:hover { background: rgba(255, 255, 255, .08); color: #fff; }
.app-menu-item.activo { background: rgba(255, 255, 255, .16); color: #fff; font-weight: 600; }
.app-menu-item.deshabilitado { color: rgba(255, 255, 255, .4); cursor: default; }
.app-menu-item.deshabilitado:hover { background: none; }
.app-menu-item .badge { margin-left: auto; background: rgba(255, 255, 255, .12); font-weight: 500; }
.app-menu-separador {
    margin: 1rem .75rem .35rem; font-size: .7rem; letter-spacing: .06em;
    text-transform: uppercase; color: rgba(255, 255, 255, .5);
}

/* Barra superior y contenido */
.app-barra {
    display: flex; align-items: center; gap: .5rem;
    height: 64px; padding: 0 1.5rem; background: #fff;
    border-bottom: 1px solid #e3e7ee; position: sticky; top: 0; z-index: 10;
}
.app-titulo { font-size: 1.15rem; margin: 0; font-weight: 600; }
.app-usuario { display: flex; align-items: center; gap: .5rem; border: 0; }
.app-avatar {
    width: 34px; height: 34px; border-radius: 50%;
    display: inline-flex; align-items: center; justify-content: center;
    background: var(--ag-azul); color: #fff; font-weight: 600;
}
.app-principal { padding: 1.5rem; }
@media (max-width: 575.98px) {
    .app-barra { padding: 0 1rem; }
    .app-principal { padding: 1rem; }
}

.tarjeta-dato {
    background: #fff; border-radius: .75rem; padding: 1rem 1.25rem;
    box-shadow: 0 1px 2px rgba(16, 24, 40, .06);
}
.tarjeta-dato span { display: block; font-size: .8rem; color: #6b7280; }
.tarjeta-dato strong { font-size: 1.75rem; }

/* Pantalla de acceso */
.login {
    min-height: 100vh; display: flex; flex-direction: column;
    align-items: center; justify-content: center; padding: 1rem;
    background: linear-gradient(160deg, var(--ag-azul-oscuro), var(--ag-azul));
}
.login-caja {
    width: 100%; max-width: 380px; background: #fff;
    border-radius: 1rem; padding: 2rem; box-shadow: 0 10px 30px rgba(0, 0, 0, .2);
}
.login-marca { text-align: center; margin-bottom: 1.5rem; }
.login-marca i { font-size: 2.5rem; color: var(--ag-azul); }
.login-marca h1 { font-size: 1.35rem; margin: .5rem 0 .25rem; font-weight: 700; }
.login-marca p { color: #6b7280; margin: 0; font-size: .9rem; }
.login-pie { color: rgba(255, 255, 255, .7); font-size: .8rem; margin-top: 1.5rem; }

/* Utilidades */
.min-w-0 { min-width: 0; }
.punto { display: inline-block; width: 10px; height: 10px; border-radius: 50%; flex: none; vertical-align: middle; }
.campana-menu { width: 320px; max-width: 90vw; }
.no-leida { background: #f1f6fd; }
.card-header { border-bottom-color: #eef1f5; }
.table > thead th { font-size: .78rem; text-transform: uppercase; letter-spacing: .03em; color: #6b7280; font-weight: 600; background: #fafbfc; }
.nav-tabs .nav-link { color: #4b5563; }
.nav-tabs .nav-link.active { font-weight: 600; }

/* Calendario */
.fc { --fc-border-color: #e5e8ee; --fc-today-bg-color: #f1f6fd; --fc-button-bg-color: #1d4e89; --fc-button-border-color: #1d4e89;
      --fc-button-hover-bg-color: #143a66; --fc-button-active-bg-color: #143a66; --fc-button-active-border-color: #143a66; font-size: .9rem; }
.fc .fc-toolbar-title { font-size: 1.15rem; text-transform: capitalize; }
.fc .fc-button { text-transform: capitalize; padding: .3rem .6rem; }
@media (max-width: 575.98px) { .fc .fc-toolbar { flex-wrap: wrap; gap: .5rem; } .fc .fc-toolbar-title { font-size: 1rem; } }
.fc-event { cursor: pointer; }
.evento-cancelado .fc-event-title { text-decoration: line-through; }
.evento-ocupado { background-image: repeating-linear-gradient(45deg, rgba(255,255,255,.25) 0 6px, transparent 6px 12px) !important; cursor: default; }
.evento-pendiente { border-style: dashed !important; opacity: .75; }
.evento-realizado { opacity: .6; }
.leyenda { display: inline-block; padding: 0 .4rem; margin-right: .4rem; border-radius: .25rem; font-size: .75rem; background: #e9eef5; }
.leyenda.evento-pendiente { border: 1px dashed #1d4e89; }
.leyenda.evento-ocupado { background-color: #9aa5b1; color: #fff; }
.leyenda.evento-realizado { opacity: .6; background: #1d4e89; color: #fff; }

/* Tom Select alineado con Bootstrap */
.ts-wrapper.multi .ts-control > div { background: #e9eef5; border-radius: .25rem; }
.fc a { text-decoration: none; color: inherit; }
