/* Logo 3x más grande (como pediste) */
.brand-logo{
  height:84px; width:auto; display:block; object-fit:contain;
  margin-top:-10px; margin-bottom:-10px;
}
@media (max-width: 767.98px){
  .brand-logo{ height:48px; margin-top:-5px; margin-bottom:-5px; }
}

/* Topbar elevación y colores por tema */
.nav-elevated{
  background:#ffffff;
  box-shadow: 0 1px 0 rgba(0,0,0,.06);
}
[data-bs-theme="dark"] .nav-elevated{
  background:#0b0f14 !important;
  box-shadow: inset 0 -1px 0 rgba(255,255,255,.12);
}

/* Navbar toggler visible en dark */
.navbar-toggler{ border-color: rgba(0,0,0,.1); }
[data-bs-theme="dark"] .navbar-toggler{ border-color: rgba(255,255,255,.25); }
.navbar-toggler-icon{
  filter: invert(0);
}
[data-bs-theme="dark"] .navbar-toggler-icon{
  filter: invert(1);
}


<style>
  .fc-event-avatar{
    width:16px; height:16px; border-radius:50%;
    object-fit:cover; margin-right:6px; vertical-align:-2px;
    box-shadow: 0 0 0 1px rgba(0,0,0,.08);
  }
  .fc-event-wrap{
    display:flex; align-items:center; gap:6px;
  }
  .fc-event-time { font-weight:600; margin-right:4px; }
</style>


/* Nav superior: link activo con texto e icono en blanco */
.navbar .nav-link.active,
.nav .nav-link.active {
  color: #fff !important;
  background-color: var(--bs-primary) !important;
  border-color: var(--bs-primary) !important;
}
.navbar .nav-link.active .bi,
.nav .nav-link.active .bi {
  color: #fff !important;
}

/* Por si usas botones outline como pestañas de menú */
.btn-outline-primary.active,
.btn-outline-primary:active,
.btn-check:checked + .btn-outline-primary {
  color: #fff !important;
  background-color: var(--bs-primary) !important;
  border-color: var(--bs-primary) !important;
}
.btn-outline-primary.active .bi,
.btn-check:checked + .btn-outline-primary .bi {
  color: #fff !important;
}

/* Igual para outline-secondary si lo usas para el menú */
.btn-outline-secondary.active,
.btn-outline-secondary:active,
.btn-check:checked + .btn-outline-secondary {
  color: #fff !important;
  background-color: var(--bs-secondary) !important;
  border-color: var(--bs-secondary) !important;
}
.btn-outline-secondary.active .bi,
.btn-check:checked + .btn-outline-secondary .bi {
  color: #fff !important;
}

/* ===== iCal-like look ===== */
:root{
  --ical-bg: #f7f8fa;
  --ical-grid: rgba(0,0,0,.06);
  --ical-header: #ffffff;
  --ical-title: #0b1220;
  --ical-muted: #6b7280;
  --ical-today: #0a84ff; /* azul iOS */
  --ical-event-bg: #e6f0ff;
  --ical-event-text: #0b1220;
}

[data-bs-theme="dark"]{
  --ical-bg: #0b0f14;
  --ical-grid: rgba(255,255,255,.08);
  --ical-header: #0f141b;
  --ical-title: #e5e7eb;
  --ical-muted: #94a3b8;
  --ical-today: #0a84ff;
  --ical-event-bg: #1a2332;
  --ical-event-text: #e5e7eb;
}

/* Cabecera estilo iCal */
.fc .fc-toolbar.fc-header-toolbar{
  padding: .4rem .25rem .6rem;
  border-bottom: 1px solid var(--ical-grid);
  background: var(--ical-header);
  border-radius: .6rem .6rem 0 0;
}
.fc .fc-toolbar-title{
  font-weight: 600;
  color: var(--ical-title);
  text-transform: capitalize; /* Octubre 2025 */
}
.fc .fc-button{
  border-radius: .6rem;
  border: 1px solid var(--ical-grid);
  background: transparent;
  color: var(--ical-title);
}
.fc .fc-button:hover{ background: rgba(0,0,0,.03); }
[data-bs-theme="dark"] .fc .fc-button:hover{ background: rgba(255,255,255,.06); }
.fc .fc-button-primary:not(:disabled).fc-button-active,
.fc .fc-button-primary:focus{
  box-shadow: none;
}

/* Mes: rejilla muy limpia */
.fc .fc-daygrid,
.fc .fc-timegrid{
  background: var(--ical-bg);
  border-radius: 0 0 .6rem .6rem;
  border: 1px solid var(--ical-grid);
}
.fc-theme-standard td, .fc-theme-standard th{
  border-color: var(--ical-grid);
}

/* Encabezado de días (Lun Mar ...) */
.fc .fc-col-header-cell-cushion{
  color: var(--ical-muted);
  font-weight: 600;
}

/* “Hoy”: círculo azul alrededor del número (iCal style) */
.fc .fc-daygrid-day.fc-day-today .fc-daygrid-day-number{
  background: var(--ical-today);
  color: #fff !important;
  border-radius: 999px;
  padding: .15rem .45rem;
}
.fc .fc-daygrid-day-number{
  color: var(--ical-title);
  font-weight: 500;
}

/* Eventos “pill” redondeados, colores suaves */
.fc .fc-daygrid-event{
  border: 0;
  border-radius: .6rem;
  padding: .15rem .4rem;
  background: var(--ical-event-bg);
  color: var(--ical-event-text);
}
.fc .fc-daygrid-event:hover{ filter: brightness(0.97); }

/* Vista semana/día: líneas finas y horas más claras */
.fc .fc-timegrid-slot{
  height: 2.2rem;
  border-color: var(--ical-grid);
}
.fc .fc-timegrid-axis-cushion{
  color: var(--ical-muted);
  font-size: .85rem;
}

/* All-day pill */
.fc .fc-daygrid-day-events{
  padding: .25rem .35rem .4rem;
}

/* Lista (Agenda) más “Apple-like” */
.fc .fc-list{
  border: 1px solid var(--ical-grid);
  border-radius: .6rem;
}
.fc .fc-list-day-cushion{
  background: var(--ical-header);
  color: var(--ical-title);
  font-weight: 600;
}
.fc .fc-list-event:hover td{
  background: rgba(0,0,0,.02);
}
[data-bs-theme="dark"] .fc .fc-list-event:hover td{
  background: rgba(255,255,255,.04);
}

/* Tipografía del calendario (macOS-like) */
.fc{
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, system-ui, sans-serif;
  font-size: .95rem;
}


/* Nav links con estado activo que SÍ cambia en dark */
.nav-link{
  padding:.5rem .75rem;
  border-radius:.5rem;
}
.nav-link.active{
  background: rgba(13,110,253,.12);
  color:#0d6efd !important;
}
[data-bs-theme="dark"] .nav-link.active{
  background: rgba(59,130,246,.18);
  color:#93c5fd !important;
}

/* Tablas/cards en dark (coherentes) */
[data-bs-theme="dark"] .card{ background:#0b0f14; border-color:rgba(255,255,255,.08) }
[data-bs-theme="dark"] .table{
  --bs-table-bg: transparent;
  --bs-table-striped-bg: rgba(255,255,255,.03);
  --bs-table-striped-color: #e2e8f0;
  --bs-table-hover-bg: rgba(255,255,255,.06);
  --bs-table-hover-color: #e2e8f0;
  color:#e2e8f0;
}
[data-bs-theme="dark"] .table thead{ background: rgba(255,255,255,.06); }
[data-bs-theme="dark"] .table, 
[data-bs-theme="dark"] .table td, 
[data-bs-theme="dark"] .table th{ border-color: rgba(255,255,255,.10) !important; }

/* Botones suaves */
.btn{ border-radius:.6rem; }
.form-control,.form-select{ border-radius:.6rem; }


<style>
  /* Limitar el ancho máximo y centrar contenido */
  .main-container {
    max-width: 1920px;
    margin: 0 auto; /* centrado horizontal */
  }

  /* Opcional: para que las tarjetas no se vean muy anchas */
  .card {
    border-radius: 0.75rem;
  }

  /* Evita scroll horizontal por desbordes */
  body {
    overflow-x: hidden;
  }

  /* Mejorar legibilidad en monitores grandes */
  @media (min-width: 1400px) {
    .container-fluid {
      padding-left: 3rem;
      padding-right: 3rem;
    }
  }
</style>

/* Centra todo select dentro del módulo de Documentos */
#docsFilters select,
#docModal select {
  text-align: center;
  text-align-last: center; /* centra también la opción seleccionada */
}

#docsFilters select.form-select-sm,
#docsFilters button,
#docsFilters a.btn-link {
  vertical-align: middle;
}

#docsFilters {
  width: 100%;
  justify-content: center;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.avatar { border-radius: 50%; object-fit: cover; object-position: center; display:inline-block; }
.avatar-xs { width: 24px; height: 24px; }
.avatar-sm { width: 32px; height: 32px; }
.avatar-md { width: 48px; height: 48px; }
.avatar-lg { width: 72px; height: 72px; }

.avatar-preview { width: 72px; height: 72px; border-radius: 50%; object-fit: cover; object-position: center; border:1px solid var(--border); }
