/* Consecuencias visuales de disponibilidad en agenda. */
[hidden]{display:none!important}
.app-page[hidden],#agenda[hidden]{display:none!important}
@media(max-width:760px){body.mobile-menu-open .sidebar{display:flex;position:fixed;inset:0 auto 0 0;width:min(84vw,300px);z-index:1000;box-shadow:12px 0 35px rgba(15,48,47,.28)}}
.column{position:relative}.availability-block{position:absolute;left:0;right:0;z-index:0;display:grid;place-items:start center;align-content:start;padding-top:14px;background:repeating-linear-gradient(135deg,rgba(70,86,89,.16) 0,rgba(70,86,89,.16) 8px,rgba(70,86,89,.23) 8px,rgba(70,86,89,.23) 16px);color:#46585a;font-size:10px;font-weight:850;letter-spacing:.02em;pointer-events:none;overflow:hidden}.availability-block span{padding:4px 7px;border-radius:5px;background:rgba(245,248,248,.86);text-align:center}.employee-exceptions{margin-top:18px;padding-top:15px;border-top:1px solid #e3ecea}.employee-exceptions h3{font-size:14px;margin:0 0 4px}.employee-exceptions p{font-size:11px;color:var(--muted);margin:0 0 10px}.employee-exceptions>div{display:grid;grid-template-columns:1fr 1fr auto;gap:7px}.employee-exceptions input,.employee-exceptions select{border:1px solid #cfdfdc;border-radius:7px;padding:9px;background:white;min-width:0}.employee-exceptions ul{list-style:none;margin:12px 0 0;padding:0;display:grid;gap:4px}.employee-exceptions li{display:grid;grid-template-columns:1fr 1fr 22px;align-items:center;gap:7px;border-radius:7px;background:#f5f9f8;padding:7px 9px;font-size:11px}.employee-exceptions li b{color:#516866}.employee-exceptions li button{border:0;background:transparent;color:#af5149;font-size:16px}.employee-exceptions .empty-exception{display:block;color:var(--muted)}@media(max-width:760px){.employee-exceptions>div{grid-template-columns:1fr}.employee-exceptions .secondary-button{width:100%}}

/* Lectura precisa de la agenda: cuartos de hora, hora actual y preselección. */
.agenda-body .slot-lines {
  background:
    repeating-linear-gradient(to bottom, transparent 0, transparent calc(var(--hour-height) / 4 - 1px), rgba(69,91,89,.08) calc(var(--hour-height) / 4 - 1px), rgba(69,91,89,.08) calc(var(--hour-height) / 4)),
    repeating-linear-gradient(to bottom, transparent 0, transparent calc(var(--hour-height) - 1px), rgba(51,76,73,.32) calc(var(--hour-height) - 1px), rgba(51,76,73,.32) var(--hour-height));
}

/* Las citas canceladas permanecen visibles y se identifican de forma inequívoca. */
.appointment.status-cancelled{
  background:#252827!important;
  border-color:#090a0a!important;
  color:#fff!important;
  box-shadow:0 3px 9px rgba(0,0,0,.22);
}
.appointment.status-cancelled b::before{color:#fff!important}
.appointment.status-cancelled small,
.appointment.status-cancelled em,
.appointment.status-cancelled .appointment-time{color:#fff!important;opacity:.82}
.agenda-current-time,.agenda-hover-time { position:absolute;left:82px;right:0;height:0;pointer-events:none;z-index:4; }
.agenda-current-time { border-top:2px solid #278bea;filter:drop-shadow(0 1px 1px rgba(39,139,234,.18)); }
.agenda-current-time::before { content:'';position:absolute;left:-5px;top:-5px;width:8px;height:8px;border-radius:50%;background:#278bea; }
.agenda-current-time span,.agenda-hover-time span { position:absolute;top:0;transform:translate(-50%,-50%);border-radius:5px;padding:3px 6px;color:#fff;font-size:10px;font-weight:800;line-height:1;white-space:nowrap;box-shadow:0 2px 7px rgba(22,70,67,.18); }
.agenda-current-time span { left:0;transform:translate(-100%,-50%);background:#278bea;border-radius:5px 0 0 5px; }
.agenda-hover-time { display:none;border-top:1px dashed rgba(20,123,112,.72); }
.agenda-hover-time.is-visible { display:block; }
.agenda-hover-time span { background:#147b70; }
.week-body { position:relative; }
.week-hover-time { position:absolute;right:0;height:0;display:none;border-top:1px dashed rgba(20,123,112,.72);pointer-events:none;z-index:4; }
.week-hover-time.is-visible { display:block; }
.week-hover-time span { position:absolute;top:0;transform:translate(-50%,-50%);border-radius:5px;padding:3px 6px;background:#147b70;color:#fff;font-size:10px;font-weight:800;line-height:1;white-space:nowrap;box-shadow:0 2px 7px rgba(22,70,67,.18); }

#appointmentConflictDialog{padding:0;width:min(92vw,500px);color:var(--ink)}
.conflict-dialog{padding:27px}.conflict-dialog h2{margin:3px 0 8px;font-size:22px}.conflict-dialog>p:not(.eyebrow){margin:0;color:var(--muted);line-height:1.45}.conflict-list{display:grid;gap:8px;margin:18px 0;padding:0;list-style:none}.conflict-list li{position:relative;padding:11px 12px 11px 38px;border:1px solid #efd39a;border-radius:9px;background:#fff8e8;color:#654d1f;font-size:12px;font-weight:700}.conflict-list li::before{content:'!';position:absolute;left:13px;top:9px;display:grid;place-items:center;width:17px;height:17px;border-radius:50%;background:#eaa73c;color:white;font-size:11px}.conflict-actions{display:flex;justify-content:flex-end;gap:9px;margin-top:20px}
#appointmentForm{width:min(94vw,560px)}.appointment-timing-row{grid-template-columns:1.15fr .85fr .85fr 1fr}.appointment-resize-handle{position:absolute;left:5px;right:5px;bottom:0;height:8px;z-index:5;cursor:ns-resize;touch-action:none;border:0;background:transparent}.appointment-resize-handle::after{content:'';position:absolute;left:50%;bottom:2px;width:28px;height:2px;transform:translateX(-50%);border-radius:2px;background:currentColor;opacity:.18;transition:opacity .15s}.appointment:hover .appointment-resize-handle::after,.appointment.is-resizing .appointment-resize-handle::after{opacity:.62}.appointment.is-resizing{cursor:ns-resize;box-shadow:0 0 0 2px rgba(20,123,112,.28),0 5px 14px rgba(25,61,61,.16)}.appointment.is-resizing .appointment-time{display:block;position:absolute;right:5px;bottom:9px;padding:3px 5px;border-radius:4px;background:rgba(255,255,255,.92);opacity:1;font-size:9px;box-shadow:0 1px 4px rgba(23,57,59,.15)}
.appointment.overlap-pair{padding-left:6px;padding-right:5px}.appointment.overlap-many{padding:4px 3px;border-left-width:3px;gap:1px}.appointment.overlap-many b{font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.appointment.overlap-many small{font-size:9px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.appointment.overlap-many .appointment-resize-handle::after{width:18px}
.week-appointment.overlap-pair{padding-left:5px;padding-right:4px}.week-appointment.overlap-many{padding:4px 3px;border-left-width:3px}.week-appointment.overlap-many b,.week-appointment.overlap-many small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.week-appointment.overlap-many.status-completed b{padding-right:0}.week-appointment.overlap-many.status-completed::after{content:'✓'!important;right:3px!important;bottom:3px!important;padding:1px 4px!important}
.appointment-form-error{margin:14px 0 0;padding:10px 12px;border:1px solid #efc7a1;border-radius:8px;background:#fff5e9;color:#8a4f1d;font-size:12px;font-weight:750;line-height:1.4}.appointment-form-error[hidden]{display:none}
@media(max-width:760px){.appointment-timing-row{grid-template-columns:1fr 1fr}.appointment-timing-row label:last-child{grid-column:auto}.appointment-resize-handle{height:12px}.appointment-resize-handle::after{opacity:.4}}

/* Distribución de agenda de alta densidad: conserva toda la información y prioriza la cuadrícula. */
@media (min-width:761px) {
  .app-shell:has(#agenda:not([hidden])) { grid-template-columns:210px minmax(0,1fr); }
  .app-shell:has(#agenda:not([hidden])) .sidebar { padding:17px 10px 13px; }
  .app-shell:has(#agenda:not([hidden])) .brand { padding:0 8px 18px; }
  .app-shell:has(#agenda:not([hidden])) .sidebar nav { gap:2px; }
  .app-shell:has(#agenda:not([hidden])) .nav-item { padding:9px 10px; }
  .app-shell:has(#agenda:not([hidden])) .profile { margin-top:10px;padding:8px 9px; }
  .app-shell:has(#agenda:not([hidden])) .topbar { height:58px;padding:0 22px; }

  #agenda.agenda-page { display:grid;grid-template-columns:minmax(360px,.8fr) minmax(570px,1.2fr);align-items:center;gap:10px 22px;padding:14px 18px 0; }
  #agenda>.page-title { min-width:0;margin:0;align-items:center;gap:16px; }
  #agenda>.page-title h1 { font-size:22px;white-space:nowrap; }
  #agenda>.page-title .eyebrow { font-size:9px;margin-bottom:2px; }
  #agenda>.page-title .primary-button { flex:0 0 auto;padding:9px 13px;font-size:12px; }
  #agenda>.calendar-tools { min-width:0;margin:0;gap:12px; }
  #agenda .date-navigation { min-width:0; }
  #agenda .date-navigation button,#agenda .view-picker button { padding:6px 9px;font-size:11px; }
  #agenda .date-navigation strong { min-width:0;margin-left:4px;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
  #agenda .view-picker { flex:0 0 auto; }
  #agenda>.agenda-workspace,#agenda>.weekly-workspace,#agenda>.agenda-legend { grid-column:1 / -1; }
  #agenda>.agenda-workspace,#agenda>.weekly-workspace { margin-top:1px; }

  #agenda .agenda-workspace,#agenda .agenda-workspace:has(.agenda-selector[hidden]),#agenda .weekly-workspace { grid-template-columns:168px minmax(0,1fr);gap:10px; }
  #agenda .agenda-side-panel { gap:9px; }
  #agenda .mini-calendar { padding:8px 8px;border-radius:10px; }
  #agenda .mini-calendar-header { margin-bottom:6px;font-size:11px; }
  #agenda .calendar-days { gap:1px; }
  #agenda .calendar-days button { min-height:24px;font-size:10px; }
  #agenda .agenda-selector { padding:11px 10px;border-radius:10px; }
  #agenda .selector-title { margin-bottom:9px; }
  #agenda .agenda-selector fieldset { padding:9px 0 5px; }
  #agenda .agenda-selector label { padding:4px 1px;font-size:11px; }
  #agenda .manage-list { padding-top:10px;font-size:10px; }

  #agenda .agenda-card,#agenda .weekly-calendar { border-radius:10px; }
  #agenda .professional-head { min-height:54px;padding:7px 10px; }
  #agenda .professional-head .avatar,#agenda .resource-symbol { width:29px;height:29px;font-size:11px; }
  #agenda .professional-head b { font-size:12px; }
  #agenda .professional-head small { font-size:9px; }
  #agenda .agenda-body { --day-height:max(555px, calc(100vh - 210px));height:var(--day-height); }
  #agenda .agenda-legend { min-height:27px;padding:6px 4px;font-size:10px; }
  #agenda .week-body { height:max(555px,calc(100vh - 210px)); }
}

@media (min-width:761px) and (max-width:1120px) {
  .app-shell:has(#agenda:not([hidden])) { grid-template-columns:188px minmax(0,1fr); }
  #agenda.agenda-page { grid-template-columns:1fr;padding-inline:12px; }
  #agenda>.page-title,#agenda>.calendar-tools { grid-column:1; }
  #agenda>.calendar-tools { margin-top:-2px; }
  #agenda .agenda-workspace,#agenda .agenda-workspace:has(.agenda-selector[hidden]),#agenda .weekly-workspace { grid-template-columns:150px minmax(0,1fr); }
  #agenda .agenda-body { --day-height:max(540px, calc(100vh - 220px)); }
}

/* En pantallas intermedias el menú se convierte en una barra de iconos para ceder espacio a la agenda. */
@media (min-width:761px) and (max-width:980px) {
  .app-shell,.app-shell:has(#agenda:not([hidden])){grid-template-columns:72px minmax(0,1fr)}
  .sidebar,.app-shell:has(#agenda:not([hidden])) .sidebar{padding:15px 8px 12px}
  .brand,.app-shell:has(#agenda:not([hidden])) .brand{justify-content:center;padding:0 0 20px}
  .brand>span:last-child{display:none}
  .nav-item,.app-shell:has(#agenda:not([hidden])) .nav-item{justify-content:center;gap:0;padding:10px 0;font-size:0}
  .nav-item span{width:auto;font-size:19px}
  .profile{display:flex;justify-content:center;padding:8px;margin-top:10px}
  .profile b,.profile small{display:none}
  .topbar,.app-shell:has(#agenda:not([hidden])) .topbar{padding-inline:14px}
  #agenda .agenda-workspace,#agenda .agenda-workspace:has(.agenda-selector[hidden]),#agenda .weekly-workspace{grid-template-columns:138px minmax(0,1fr)}
}

@media(max-width:760px){
  body.mobile-menu-open::after{content:'';position:fixed;inset:0;z-index:999;background:rgba(9,40,39,.35)}
  body.mobile-menu-open .sidebar{z-index:1000;width:min(82vw,280px)}
  #agenda>.page-title{gap:10px}
  #agenda>.page-title h1{max-width:62vw;white-space:normal}
  #agenda .calendar-tools{display:flex;align-items:flex-start;gap:9px;flex-wrap:wrap}
  #agenda .date-navigation{flex:1 1 100%;margin:0}
  #agenda .view-picker{margin-left:auto}
  #agenda .weekly-workspace{display:block}
  #agenda .week-selector{display:grid;grid-template-columns:minmax(220px,1fr) minmax(220px,1fr);gap:8px;margin-bottom:10px;overflow-x:auto;padding-bottom:3px}
  #agenda .week-selector .mini-calendar{grid-row:1 / span 3;margin:0}
  #agenda .week-selector .selector-title{border-bottom:1px solid var(--line);border-radius:10px;padding:10px}
  #agenda .week-selector fieldset{border:1px solid var(--line);border-radius:10px;padding:8px 10px}
  #agenda .week-selector-help{display:none}
  #agenda .weekly-calendar{overflow-x:auto}
  #agenda .week-grid{min-width:720px;grid-template-columns:52px repeat(7,minmax(94px,1fr))}
  #agenda .week-head>*{min-height:51px;font-size:14px}
  #agenda .week-body{height:720px}
  #agenda .week-appointment{left:3px;right:3px;padding:4px}
}
@media(max-width:480px){
  .topbar{padding-inline:10px}.location small{display:none}.location b{max-width:135px;display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  #agenda.agenda-page{padding:14px 8px 0}
  #agenda>.page-title h1{font-size:20px}
  #agenda>.page-title .primary-button{padding:9px 10px}
  #agenda .agenda-head,#agenda .agenda-body{min-width:500px}
}