.header-logo-principal { height: 34px !important; max-width: 122px !important; }
.header-logo-principal { height: 46px !important; max-width: 180px !important; }:root {
  --usal-green-950: #063a2d;
  --usal-green-900: #074c3a;
  --usal-green-800: #075f47;
  --usal-green-700: #087554;
  --usal-green-600: #09845f;
  --usal-green-100: #dff3eb;
  --usal-green-50: #eff9f5;
  --usal-gold-500: #e7b51f;
  --usal-gold-100: #fff4cc;
  --usal-ink: #16231e;
  --usal-muted: #64736c;
  --usal-line: #dce7e1;
  --usal-surface: #ffffff;
  --usal-canvas: #f3f7f5;
  --usal-danger: #bf3d46;
  --usal-radius-sm: 9px;
  --usal-radius: 14px;
  --usal-radius-lg: 20px;
  --usal-shadow-sm: 0 2px 8px rgba(6, 58, 45, 0.07);
  --usal-shadow: 0 10px 30px rgba(6, 58, 45, 0.10);
  --usal-focus: 0 0 0 3px rgba(9, 132, 95, 0.18);
}

html { scroll-behavior: smooth; }

body {
  background: var(--usal-canvas) !important;
  color: var(--usal-ink);
  font-family: "Oswald", Arial, sans-serif !important;
  font-size: 14px;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
}

button,
input,
select,
textarea,
.btn,
.form-control,
.custom-select,
.dropdown-menu,
.select2-container,
.dataTables_wrapper {
  font-family: "Oswald", Arial, sans-serif !important;
}

a { color: var(--usal-green-700); }
a:hover { color: var(--usal-green-900); }

h1, h2, h3, h4, h5, h6,
.card-title, .info-box-number {
  color: var(--usal-ink);
  font-family: inherit;
  font-weight: 700;
  letter-spacing: -0.025em;
}

h2 { font-size: clamp(1.55rem, 2.5vw, 2rem); }
h3 { font-size: 1.25rem; }
.text-muted { color: var(--usal-muted) !important; font-size: inherit; }

.content-wrapper {
  background:
    radial-gradient(circle at 95% 0%, rgba(9, 132, 95, 0.08), transparent 30rem),
    var(--usal-canvas) !important;
}

.content-header { padding: 1.5rem 0 0.35rem; }
.content-header h2:empty { display: none; }
.content > .container-fluid,
.content-header > .container-fluid {
  max-width: 1480px;
  padding-left: clamp(1rem, 2.5vw, 2.25rem);
  padding-right: clamp(1rem, 2.5vw, 2.25rem);
}

/* Barra superior */
.main-header.navbar {
  min-height: 64px;
  background: rgba(255, 255, 255, 0.94) !important;
  border-bottom: 1px solid var(--usal-line) !important;
  box-shadow: 0 4px 18px rgba(6, 58, 45, 0.05);
  backdrop-filter: blur(12px);
}

.main-header .nav-link {
  align-items: center;
  border-radius: 10px;
  color: var(--usal-green-900) !important;
  display: flex;
  justify-content: center;
  margin: 0 2px;
  min-height: 42px;
  min-width: 42px;
  transition: background-color .18s ease, transform .18s ease;
}

.main-header .nav-link:hover { background: var(--usal-green-50); transform: translateY(-1px); }
.header-logo-principal { height: 42px !important; max-width: 176px !important; }
.navbar-badge { border: 2px solid #fff; font-size: .65rem !important; }
.dropdown-menu { border: 1px solid var(--usal-line); border-radius: var(--usal-radius); box-shadow: var(--usal-shadow); overflow: hidden; }
.dropdown-item { padding: .7rem 1rem; }
.dropdown-item:hover { background: var(--usal-green-50); }

/* Navegación lateral */
.main-sidebar {
  background: linear-gradient(180deg, var(--usal-green-950) 0%, #032b22 100%) !important;
  box-shadow: 8px 0 30px rgba(2, 35, 27, .14) !important;
}

.brand-link {
  border-bottom-color: var(--usal-line) !important;
  min-height: 64px !important;
  padding: .65rem .8rem !important;
}

.brand-link .brand-image { box-shadow: 0 5px 14px rgba(6, 58, 45, .18); margin-left: 0; }
.brand-text { font-size: .86rem; font-weight: 800 !important; letter-spacing: .04em; }
.user-panel { border-bottom-color: rgba(255,255,255,.10) !important; margin: .7rem .55rem 1rem !important; padding: .5rem .35rem 1rem !important; }
.user-panel .info { font-size: .78rem; line-height: 1.45; overflow: hidden; padding-left: .7rem; text-overflow: ellipsis; }
.user-panel .image img { border: 2px solid rgba(255,255,255,.78); box-shadow: 0 4px 12px rgba(0,0,0,.2); }

.nav-sidebar { padding: 0 .5rem 1rem; }
.nav-sidebar .nav-item { margin-bottom: 3px; }
.nav-sidebar .nav-link {
  border-radius: 10px;
  color: rgba(255,255,255,.78) !important;
  margin-bottom: 2px;
  padding: .66rem .8rem;
  transition: background-color .16s ease, color .16s ease, transform .16s ease;
}

.nav-sidebar .nav-link:hover { background: rgba(255,255,255,.09) !important; color: #fff !important; transform: translateX(2px); }
.nav-sidebar > .nav-item > .nav-link.active {
  background: transparent !important;
  box-shadow: none !important;
  color: var(--usal-gold-500) !important;
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .10em;
  margin-top: .55rem;
  text-transform: uppercase;
}

.nav-sidebar .nav-treeview { padding-left: .2rem; }
.nav-sidebar .nav-treeview .nav-link { padding-left: 1rem; }
.nav-sidebar .nav-treeview .nav-link.active {
  background: rgba(255,255,255,.13) !important;
  box-shadow: inset 3px 0 0 var(--usal-gold-500) !important;
  color: #fff !important;
  font-weight: 600;
}

.nav-sidebar .nav-icon { font-size: .92rem !important; width: 1.45rem !important; }

/* Superficies */
.card,
.info-box,
.small-box {
  background: var(--usal-surface);
  border: 1px solid rgba(220, 231, 225, .9) !important;
  border-radius: var(--usal-radius-lg) !important;
  box-shadow: var(--usal-shadow-sm) !important;
  overflow: hidden;
  transition: box-shadow .2s ease, transform .2s ease;
}

.card:hover, .info-box:hover { box-shadow: var(--usal-shadow) !important; }
.card-header {
  background: rgba(239, 249, 245, .72);
  border-bottom: 1px solid var(--usal-line) !important;
  padding: 1rem 1.2rem;
}

.card-header:first-child { border-radius: var(--usal-radius-lg) var(--usal-radius-lg) 0 0; }
.card-body { padding: clamp(1rem, 2vw, 1.35rem); }
.info-box { min-height: 102px; }
.info-box-icon { border-radius: 15px !important; margin: 10px; width: 70px !important; }
.info-box-content { padding: .8rem .7rem .8rem .15rem; }
.info-box-text { color: var(--usal-muted); font-size: .78rem; font-weight: 700; letter-spacing: .045em; text-transform: uppercase; }
.info-box-number { font-size: 1.45rem; }
.content-header .info-box-number {
  color: var(--usal-muted);
  font-size: .88rem;
  font-weight: 500;
  line-height: 1.35;
  white-space: normal;
}

.content-header a { color: inherit; text-decoration: none; }
.content-header a .info-box:hover { transform: translateY(-3px); }
.quick-link-card {
  align-items: center;
  background: #fff;
  border: 1px solid var(--usal-line);
  border-radius: var(--usal-radius-lg);
  box-shadow: var(--usal-shadow-sm);
  color: var(--usal-ink) !important;
  display: flex;
  gap: .85rem;
  min-height: 102px;
  margin-bottom: 1rem;
  overflow: hidden;
  padding: .9rem;
  position: relative;
  text-decoration: none !important;
  transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}

.quick-link-card::before {
  background: var(--quick-accent);
  content: "";
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 4px;
}

.quick-link-map { --quick-accent: #16806d; --quick-soft: #e2f4ee; }
.quick-link-price { --quick-accent: #d6a20a; --quick-soft: #fff3c7; }
.quick-link-use { --quick-accent: #3156b8; --quick-soft: #e8edff; }
.quick-link-useful { --quick-accent: #c94747; --quick-soft: #fdeaea; }
.quick-link-card:hover {
  border-color: var(--quick-accent);
  box-shadow: var(--usal-shadow);
  color: var(--usal-ink) !important;
  transform: translateY(-3px);
}

.quick-card-icon {
  align-items: center;
  background: var(--quick-soft);
  border-radius: 14px;
  color: var(--quick-accent);
  display: flex;
  flex: 0 0 54px;
  font-size: 1.25rem;
  height: 54px;
  justify-content: center;
}

.quick-card-content { display: flex; flex: 1 1 auto; flex-direction: column; min-width: 0; }
.quick-card-content strong { color: var(--usal-ink); font-size: .95rem; font-weight: 800; letter-spacing: -.015em; }
.quick-card-content small { color: var(--usal-muted); font-size: .76rem; line-height: 1.35; margin-top: .15rem; }
.quick-card-arrow {
  align-items: center;
  border-radius: 50%;
  color: var(--quick-accent);
  display: flex;
  flex: 0 0 28px;
  height: 28px;
  justify-content: center;
  transition: background-color .2s ease, transform .2s ease;
}

.quick-link-card:hover .quick-card-arrow { background: var(--quick-soft); transform: translateX(2px); }
.stops-wide-layout { max-width: none; width: 100%; }
.stop-card-anchor .card {
  transition: box-shadow .25s ease, outline-color .25s ease, transform .25s ease;
}
.stop-card-anchor.stop-card-highlight .card {
  box-shadow: 0 0 0 4px rgba(0, 132, 87, .2), 0 14px 30px rgba(0, 77, 51, .18) !important;
  outline: 3px solid var(--usal-green-700);
  outline-offset: 2px;
  transform: translateY(-2px);
}
.direction-title {
  border-radius: 10px;
  font-size: 1.2rem;
  font-weight: 800;
  letter-spacing: .06em;
  margin: 0 0 1rem;
  padding: .7rem 1rem;
  text-align: center;
}
.direction-title-ida {
  background: var(--usal-green-100);
  border: 1px solid #b9dfd0;
  color: var(--usal-green-950);
}
.return-hours-block {
  background: rgba(255,255,255,.82);
  border: 1px solid var(--usal-line);
  border-radius: var(--usal-radius);
  box-shadow: var(--usal-shadow-sm);
  margin: .25rem 0 1.5rem;
  padding: 1.15rem;
  width: 100%;
}
.return-hours-title {
  color: #dc2424;
  font-size: 1.2rem;
  font-weight: 800;
}
.return-hours-list { gap: .45rem; }
.return-hours-list .return-hour-badge {
  background: #fff !important;
  border: 1px solid #e4e9e6;
  color: var(--usal-ink) !important;
  font-size: 1.08rem !important;
  margin: 0 !important;
  min-width: 96px;
  padding: .65rem .85rem !important;
}
.app-card-header { background: var(--usal-green-800) !important; color: #fff; font-weight: 700; }
.app-card-header * { color: #fff; }
.section-title { align-items: center; display: flex; margin: 1.6rem 0 1rem; }

.app-welcome {
  align-items: center;
  background: linear-gradient(120deg, var(--usal-green-950), var(--usal-green-700));
  border-radius: var(--usal-radius-lg);
  box-shadow: var(--usal-shadow);
  color: rgba(255,255,255,.82);
  display: flex;
  margin: .4rem 0 1.4rem;
  overflow: hidden;
  padding: clamp(1.15rem, 3vw, 2rem);
  position: relative;
}

.app-welcome::after {
  background: radial-gradient(circle, rgba(231,181,31,.25), transparent 68%);
  content: "";
  height: 220px;
  position: absolute;
  right: -55px;
  top: -90px;
  width: 220px;
}

.app-welcome h1 { color: #fff; font-size: clamp(1.45rem, 3vw, 2rem); margin: 0 0 .3rem; }
.app-welcome p { margin: 0; max-width: 680px; }

/* Filtros */
.filters-panel {
  background: rgba(255,255,255,.88);
  border: 1px solid var(--usal-line);
  border-radius: var(--usal-radius);
  box-shadow: var(--usal-shadow-sm);
  margin-bottom: 1.25rem;
  padding: 1rem;
}

.filters-panel-compact { max-width: 520px; }
.filters-actions { display: flex; justify-content: flex-end; margin-bottom: .7rem; }
.filters-heading {
  align-items: center;
  border-bottom: 1px solid #edf2ef;
  display: flex;
  justify-content: space-between;
  margin-bottom: .85rem;
  padding-bottom: .7rem;
}

.filters-heading > div { align-items: center; color: var(--usal-green-950); display: flex; font-weight: 750; gap: .55rem; }
.filters-heading i { color: var(--usal-green-700); }
.filters-clear {
  background: var(--usal-green-50);
  border-radius: 999px;
  color: var(--usal-green-800);
  font-size: .72rem;
  font-weight: 700;
  padding: .35rem .65rem;
  text-decoration: none !important;
}

.filters-clear:hover { background: var(--usal-green-100); color: var(--usal-green-950); }
.filters-grid { display: grid; gap: .8rem; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); }
.filter-field { display: block; margin: 0; }
.filter-field > span:first-child {
  color: var(--usal-muted);
  display: block;
  font-size: .7rem;
  font-weight: 800;
  letter-spacing: .055em;
  margin: 0 0 .35rem .15rem;
  text-transform: uppercase;
}

.filter-select-wrap { display: block; position: relative; }
.filter-select-wrap::after {
  color: var(--usal-green-700);
  content: "\f078";
  font-family: "Font Awesome 5 Free";
  font-size: .72rem;
  font-weight: 900;
  pointer-events: none;
  position: absolute;
  right: .9rem;
  top: 50%;
  transform: translateY(-50%);
}

.filter-select-wrap select {
  appearance: none;
  background: #fff !important;
  border-color: #cbdad2;
  cursor: pointer;
  font-weight: 600;
  padding: .55rem 2.35rem .55rem .8rem;
  width: 100%;
}

.filter-select-wrap select:hover { border-color: var(--usal-green-600); }

/* Botones y controles */
.btn {
  border-radius: var(--usal-radius-sm);
  font-weight: 650;
  letter-spacing: -.01em;
  min-height: 38px;
  padding: .48rem .9rem;
  transition: box-shadow .18s ease, transform .18s ease, background-color .18s ease;
}

.btn:hover { transform: translateY(-1px); }
.btn:focus, .btn.focus { box-shadow: var(--usal-focus) !important; }
.btn-sm { min-height: 32px; padding: .34rem .7rem; }
.btn-primary, .btn-success, .bg-success, .bg-primary {
  background-color: var(--usal-green-700) !important;
  border-color: var(--usal-green-700) !important;
}

.btn-primary:hover, .btn-success:hover { background-color: var(--usal-green-900) !important; border-color: var(--usal-green-900) !important; }
.btn-outline-info { border-color: var(--usal-green-700); color: var(--usal-green-700); }
.btn-outline-info:hover { background: var(--usal-green-700); border-color: var(--usal-green-700); color: #fff; }
.btn-danger { background: var(--usal-danger); border-color: var(--usal-danger); }
.btn-warning, .bg-warning { background: var(--usal-gold-500) !important; border-color: var(--usal-gold-500) !important; color: #302400 !important; }

.form-control,
.custom-select,
.select2-container--bootstrap4 .select2-selection {
  background-color: #fff;
  border: 1px solid #cfdcd5;
  border-radius: 10px;
  color: var(--usal-ink);
  min-height: 42px;
  transition: border-color .16s ease, box-shadow .16s ease;
}

.form-control:focus,
.custom-select:focus,
.select2-container--bootstrap4.select2-container--focus .select2-selection {
  border-color: var(--usal-green-600);
  box-shadow: var(--usal-focus);
}

label { color: #34453e; font-weight: 650; }
.input-group-text { background: var(--usal-green-50); border-color: #cfdcd5; color: var(--usal-green-900); font-weight: 650; }
.custom-control-input:checked ~ .custom-control-label::before { background-color: var(--usal-green-700); border-color: var(--usal-green-700); }

/* Mensajes, etiquetas y tablas */
.alert { border: 0; border-left: 4px solid currentColor; border-radius: var(--usal-radius); box-shadow: var(--usal-shadow-sm); }
.alert-info { background: #eaf5fa; color: #215f78; }
.alert-success { background: var(--usal-green-100); color: var(--usal-green-950); }
.alert-warning { background: var(--usal-gold-100); color: #6b5100; }
.alert-danger { background: #fbeaec; color: #8e2d35; }
.badge { border-radius: 999px !important; font-weight: 700 !important; padding: .38em .68em !important; }
.badge-success { background: var(--usal-green-700) !important; }
.badge-warning { background: var(--usal-gold-500) !important; color: #332600 !important; }

.table-responsive { border-radius: var(--usal-radius); padding: .35rem !important; }
.table { color: #293a33; margin-bottom: 0; }
.table thead th {
  background: var(--usal-green-50);
  border-bottom: 1px solid var(--usal-line);
  border-top: 0;
  color: var(--usal-green-950);
  font-size: .75rem;
  font-weight: 800;
  letter-spacing: .045em;
  padding: .85rem .75rem;
  text-transform: uppercase;
}

.table td { border-top-color: #e9f0ec; padding: .8rem .75rem; vertical-align: middle; }
.table-hover tbody tr:hover { background: var(--usal-green-50); }
.list-group { border-radius: var(--usal-radius); box-shadow: var(--usal-shadow-sm); overflow: hidden; }
.list-group-item { border-color: var(--usal-line); padding: .9rem 1rem; }
.list-group-item.font-weight-bold { background: var(--usal-green-50); border-left: 4px solid var(--usal-green-700); }

/* Modales */
.modal-content { border: 0; border-radius: 20px; box-shadow: 0 24px 70px rgba(2, 35, 27, .28); }
.modal-header { border-bottom: 1px solid var(--usal-line); padding: 1.15rem 1.3rem; }
.modal-footer { border-top: 1px solid var(--usal-line); padding: 1rem 1.3rem; }
.modal-backdrop.show { opacity: .62; }

/* Calendario */
.fc .fc-toolbar { gap: .75rem; margin-bottom: 1.2rem; }
.fc .fc-button-primary {
  background: var(--usal-green-700) !important;
  border-color: var(--usal-green-700) !important;
  border-radius: 9px !important;
  box-shadow: none !important;
  font-weight: 650;
}

.fc .fc-button-primary:hover,
.fc .fc-button-primary:not(:disabled).fc-button-active { background: var(--usal-green-900) !important; }
.fc .fc-daygrid-day, .fc-theme-standard td, .fc-theme-standard th { border-color: var(--usal-line); }
.fc .fc-col-header-cell { background: var(--usal-green-50); padding: .55rem 0; }
.fc .fc-daygrid-day-number { color: var(--usal-ink); font-weight: 650; padding: .45rem; }
.fc .fc-day-today { background: var(--usal-gold-100) !important; }
.fc .fc-event { border: 0 !important; border-radius: 8px !important; box-shadow: 0 2px 7px rgba(6,58,45,.10); }
.event-row-multiple, .event-row-diaria { border-radius: 12px !important; box-shadow: 0 2px 8px rgba(6,58,45,.06); padding: .9rem 1rem !important; }
.event-row-pasada { filter: saturate(.65); opacity: .82; }

/* Pie e interacción auxiliar */
.main-footer { background: #fff; border-top: 1px solid var(--usal-line); color: var(--usal-muted); font-size: .78rem; padding: 1rem clamp(1rem, 2.5vw, 2.25rem); }
#scrollToTop {
  align-items: center;
  background: var(--usal-green-800) !important;
  border: 3px solid #fff;
  bottom: 22px !important;
  box-shadow: 0 8px 24px rgba(6,58,45,.24);
  color: #fff !important;
  display: none;
  font-size: 14px !important;
  height: 46px;
  justify-content: center;
  padding: 0 !important;
  right: 22px !important;
  width: 46px;
}

#scrollToTop:hover { background: var(--usal-green-950) !important; transform: translateY(-2px); }

@media (max-width: 767.98px) {
  .content-header { padding-top: 1rem; }
  .content > .container-fluid, .content-header > .container-fluid { padding-left: .8rem; padding-right: .8rem; }
  .card, .info-box, .small-box { border-radius: 15px !important; }
  .card-body { padding: .9rem; }
  .header-logo-principal { height: 46px !important; max-width: 180px !important; }
  .main-header.navbar { min-height: 64px; padding-left: .3rem; padding-right: .3rem; }
  .main-header .nav-link { min-height: 38px; min-width: 38px; padding-left: .6rem !important; padding-right: .6rem !important; }
  .fc .fc-toolbar { align-items: stretch; flex-direction: column; }
  .fc .fc-toolbar-chunk { display: flex; justify-content: center; }
  .fc .fc-button { font-size: .82rem; padding: .45rem .62rem; }
  .event-row-multiple, .event-row-diaria { align-items: flex-start !important; flex-direction: column; gap: .65rem; }
  .event-row-multiple > div:last-child, .event-row-diaria > div:last-child { width: 100%; }
  .event-row-multiple .btn, .event-row-diaria .btn { width: 100%; }
  .modal-dialog { margin: .5rem; }
  .modal-content { border-radius: 16px; }
  h2 { font-size: 1.45rem; }
  .app-welcome { padding: 1.1rem; }
  .app-welcome p { font-size: .82rem; }
  .filters-panel { padding: .8rem; }
  .filters-grid { grid-template-columns: 1fr; }
  .direction-title { font-size: 1.05rem; }
  .return-hours-title { font-size: 1.05rem; }
  .return-hours-list .return-hour-badge { flex: 1 1 calc(50% - .45rem); min-width: 0; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; }
}