/* Web del salón — capa encima de styles.css (paleta cálida oscura común). */
/* Los rellenos con alfa usan el triplete rgb real de --acento/--error (no
   color-mix: styles.css no lo usa en ningún sitio y hay Mac viejos de por medio). */
.oculto { display: none !important; }
.salon-cabecera { display: flex; align-items: center; gap: 12px; padding: 10px 14px; }
.salon-titulo { font-weight: 700; font-size: 18px; }
.salon-tabs { display: flex; gap: 6px; flex: 1; }
.tab { padding: 6px 14px; border-radius: 999px; border: 1px solid rgba(255,255,255,.12); background: transparent; color: inherit; cursor: pointer; }
.tab.activo { background: rgba(200,106,67,.25); border-color: rgba(200,106,67,.6); }
.chip-quien { padding: 6px 12px; border-radius: 999px; border: 1px solid rgba(200,106,67,.6); background: rgba(200,106,67,.15); color: inherit; cursor: pointer; }
.btn-salir { background: transparent; border: none; color: inherit; opacity: .6; cursor: pointer; }
.dialogo { border: none; border-radius: 14px; padding: 18px; background: var(--panel); color: var(--texto); min-width: 320px; }
.dialogo::backdrop { background: rgba(0,0,0,.55); }
.lista-quien { display: grid; gap: 8px; margin-top: 10px; }
.opcion-quien { padding: 12px; border-radius: 10px; border: 1px solid rgba(255,255,255,.12); background: transparent; color: inherit; font-size: 16px; cursor: pointer; }
.opcion-quien:hover { background: rgba(200,106,67,.15); }
.dia-columnas { display: flex; gap: 10px; padding: 0 14px 14px; align-items: flex-start; }
.dia-columna { flex: 1; min-width: 0; }
.dia-columna h3 { text-align: center; margin: 6px 0; font-size: 14px; }
.selector-empleada { display: flex; gap: 6px; padding: 0 14px 8px; }
#calendario-semana { padding: 0 14px 14px; }
.fc .fc-timegrid-slot { height: 2.2em; }         /* tacto táctil/ratón cómodo */
.error { color: var(--error); min-height: 1.2em; }
.salon-error-catalogo { padding: 0 14px 8px; min-height: 0; }
.salon-error-catalogo:empty { display: none; }
.form-cita { display: grid; gap: 10px; min-width: 380px; }
.form-cita label { display: grid; gap: 4px; font-size: 13px; }
.form-cita input, .form-cita select { padding: 8px; border-radius: 8px; border: 1px solid rgba(255,255,255,.15); background: rgba(255,255,255,.05); color: inherit; }
.linea-serv { display: flex; align-items: center; gap: 6px; padding: 6px 8px; border-radius: 8px; background: rgba(200,106,67,.12); margin: 3px 0; font-size: 13px; }
.linea-serv .nombre-serv { font-weight: 600; }
.quitar-serv { margin-left: auto; border: none; background: transparent; color: inherit; opacity: .6; cursor: pointer; font-size: 12px; line-height: 1; padding: 2px 6px; border-radius: 6px; }
.quitar-serv:hover { opacity: 1; background: rgba(215,106,90,.25); color: var(--error); }
.botonera { display: flex; gap: 8px; justify-content: flex-end; flex-wrap: wrap; }
.botonera button { padding: 8px 14px; border-radius: 8px; border: 1px solid rgba(255,255,255,.15); background: rgba(200,106,67,.2); color: inherit; cursor: pointer; }
.cita-apagada { text-decoration: line-through; opacity: .55; }