:root{font-family:system-ui,-apple-system,sans-serif;color:#3f3333;background:#fff8f5}*{box-sizing:border-box}body{margin:0}main{max-width:1120px;margin:auto;padding:20px}header,.toolbar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;justify-content:space-between}header{margin-bottom:24px}h1{margin:4px 0;font-size:2rem}h2{font-size:1.2rem}small{color:#826e6a}.panel,.stats article{background:white;border:1px solid #f0ded6;border-radius:16px;padding:18px;margin-bottom:18px;box-shadow:0 4px 20px #6e38200a}button{background:#a95364;color:white;border:0;border-radius:9px;padding:10px 14px;cursor:pointer;font-weight:600}button:hover{filter:brightness(.94)}button:disabled{opacity:.5;cursor:not-allowed}input,select,textarea{width:100%;padding:10px;border:1px solid #d7c7c1;border-radius:8px;font:inherit;background:white}label{display:block;font-weight:600;margin:12px 0}label input,label select,label textarea{display:block;margin-top:5px;font-weight:400}.stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.stats article{display:grid;gap:6px}.stats strong{font-size:1.8rem}.weekdays,.calendar{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:5px}.weekdays{text-align:center;padding:12px}.calendar{margin-bottom:20px}.day{min-height:106px;text-align:left;background:#fff;border:1px solid #ecdcd5;color:#3f3333;border-radius:10px;padding:8px;display:flex;flex-direction:column;gap:5px;overflow:hidden}.day:hover{filter:none;border-color:#a95364}.day.selected{outline:3px solid #a95364}.day.closed{background:#ffd9d9;border-color:#da7777}.day.other{opacity:.35}.day .count{font-size:.75rem;color:#665}.day .reason{font-size:.72rem;overflow-wrap:anywhere}.dots{display:flex;gap:3px;flex-wrap:wrap}.dot{height:10px;width:10px;border-radius:50%;display:inline-block}.azul{background:#579ce9}.lila{background:#a27cda}.verde{background:#62b781}.amarillo{background:#f4cb54}.rojo{background:#e76d6d}.rosa{background:#e9a2bf}.appointment{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px;border-bottom:1px solid #eee}.appointment>div:first-child{display:flex;align-items:center;gap:10px}.appointment .dot{flex:none;width:15px;height:15px}.appointment small{display:block}.actions{display:flex;gap:5px;flex-wrap:wrap}.actions button{font-size:.8rem;padding:7px}dialog{border:0;border-radius:16px;box-shadow:0 15px 80px #0004;width:min(640px,94vw);max-height:90vh}dialog::backdrop{background:#211a1a99}.two{display:grid;grid-template-columns:1fr 1fr;gap:12px}.error{color:#b00020}#message{position:fixed;bottom:15px;right:15px;background:#473638;color:white;padding:12px;border-radius:8px;max-width:90vw}#message:empty{display:none}@media(max-width:620px){main{padding:10px}.day{min-height:72px;padding:4px;font-size:.8rem}.day .reason{font-size:.6rem}.stats strong{font-size:1.4rem}.two{grid-template-columns:1fr}.appointment{align-items:flex-start;flex-direction:column}}

/* Vista diaria de prueba: solo cambia la presentación, no los datos. */
.day-timeline{margin-top:12px}.timeline-tip{color:#796b68;font-size:.9rem}.day-closed-banner{background:#ffe3e3;border:1px solid #e9a0a0;border-radius:10px;padding:12px}.timeline-hours{position:relative;min-width:0}.timeline-row{height:66px;display:grid;grid-template-columns:78px minmax(0,1fr);border-top:1px solid #f0e6e0}.timeline-time{font-size:.82rem;color:#857571;padding:6px 10px 0 0;text-align:right}.timeline-slot{border-left:1px solid #dfd2ca;cursor:pointer}.timeline-slot:hover{background:#fdf3ef}.timeline-events{position:absolute;inset:0;pointer-events:none}.timeline-event{position:absolute;height:60px;border-radius:9px;border-left:5px solid #765a5a;box-shadow:0 2px 6px #0002;display:flex;align-items:stretch;overflow:hidden;pointer-events:auto;min-width:0}.timeline-event.azul{background:#d9eafd;border-color:#579ce9}.timeline-event.lila{background:#e9dffa;border-color:#a27cda}.timeline-event.verde{background:#def2e6;border-color:#62b781}.timeline-event.amarillo{background:#fff1c5;border-color:#e7b833}.timeline-event.rojo{background:#ffe0e0;border-color:#e76d6d}.timeline-event.rosa{background:#ffe4ee;border-color:#e9a2bf}.timeline-event-main{min-width:0;flex:1;background:transparent;color:#322b2b;text-align:left;padding:7px 9px;display:flex;flex-direction:column;justify-content:center;gap:3px}.timeline-event-main strong,.timeline-event-main span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.timeline-event-main span{font-size:.76rem}.timeline-event-actions{display:flex;flex-direction:column;justify-content:center;gap:3px;padding:3px}.timeline-event-actions button{font-size:.7rem;padding:4px 6px;background:#73545d}.timeline-outside{display:grid;gap:6px;margin:15px 0}.outside-cita{text-align:left}.timeline-event-main:hover{filter:none;background:#ffffff50}@media(max-width:620px){.timeline-row{grid-template-columns:54px minmax(0,1fr)}.timeline-time{font-size:.7rem;padding-right:6px}.timeline-event{height:60px}.timeline-event-main{padding:5px}.timeline-event-main strong{font-size:.76rem}.timeline-event-main span{font-size:.66rem}.timeline-event-actions button{font-size:.61rem;padding:3px}.timeline-event-actions{padding:2px}}

.timeline-hours{--timeline-gutter:78px}@media(max-width:620px){.timeline-hours{--timeline-gutter:54px}}

/* Resumen e historial mensual: no modifica los registros de la agenda. */
.income-panel{margin:0 0 20px}.income-head{display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap}.income-head h2{margin:4px 0}.income-total{display:block;font-size:2rem;color:#35744c;font-variant-numeric:tabular-nums}.income-note{font-size:.85rem;color:#796b68;margin:6px 0 0}.income-months{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:10px;margin-top:12px}.income-month{background:#fff9f6;border:1px solid #ead5ca;color:#403535;text-align:left;display:grid;gap:5px;padding:14px}.income-month strong{font-size:1.3rem;color:#35744c}.income-month small{color:#796b68}.income-month-current{outline:2px solid #a95364}#incomeHistory{margin-top:18px;padding-top:14px;border-top:1px solid #f0ded6}#incomeHistory h3{margin:0;font-size:1rem}@media(max-width:620px){.income-total{font-size:1.65rem}.income-months{grid-template-columns:repeat(2,minmax(0,1fr))}.income-month{padding:9px}}

/* Historial mensual siempre en una única fila, desplazable con flechas y gesto táctil. */
.income-months-carousel{display:grid;grid-template-columns:44px minmax(0,1fr) 44px;align-items:center;gap:10px;margin-top:12px;min-width:0}
.income-months-carousel .income-months{display:flex;flex-wrap:nowrap;gap:10px;margin:0;min-width:0;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scroll-behavior:smooth;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;scrollbar-width:thin;padding:3px 3px 7px}
.income-months-carousel .income-month{flex:0 0 220px;min-width:0;scroll-snap-align:start;align-content:start;white-space:normal}
.income-months-arrow{display:flex;align-items:center;justify-content:center;height:48px;min-width:0;padding:0;font-size:1.55rem;line-height:1}
.income-months-carousel .income-months:focus-visible,.income-months-arrow:focus-visible{outline:3px solid #a95364;outline-offset:2px}
@media(max-width:620px){.income-months-carousel{grid-template-columns:36px minmax(0,1fr) 36px;gap:5px}.income-months-carousel .income-months{gap:7px}.income-months-carousel .income-month{flex-basis:min(220px,75vw)}.income-months-arrow{height:44px;font-size:1.2rem}}

/* Observaciones visibles debajo del nombre sin abrir el editor. */
.timeline-row{height:110px}
.timeline-event{height:104px}
.timeline-event-main{justify-content:flex-start;gap:4px;overflow:hidden}
.timeline-event-main strong{flex:none}
.timeline-event-main .timeline-observation{display:block;white-space:pre-wrap;overflow-wrap:anywhere;overflow-y:auto;max-height:3.7em;line-height:1.23;font-size:.82rem;font-weight:600;color:#573a45;flex:0 1 auto;min-height:0;scrollbar-width:thin}
.timeline-event-main .timeline-event-detail{flex:none;font-size:.75rem}
.outside-cita{display:flex;flex-direction:column;align-items:flex-start;gap:4px;white-space:pre-wrap;overflow-wrap:anywhere}
.outside-observation{font-weight:600;line-height:1.4;color:#fff}
@media(max-width:620px){.timeline-event{height:104px}.timeline-event-main{gap:3px}.timeline-event-main .timeline-observation{font-size:.74rem;max-height:4.2em}.timeline-event-main .timeline-event-detail{font-size:.65rem}}

.month-count-box{display:flex;align-items:baseline;gap:9px;flex-wrap:wrap;margin-top:10px;padding:10px 12px;background:#fff9f6;border:1px solid #ead5ca;border-radius:12px}.month-count-box span{font-weight:600}.month-count-box strong{font-size:1.55rem;font-variant-numeric:tabular-nums;color:#403535}.month-count-box small{color:#796b68}

/* Historial por nombre/teléfono: sin modificaciones de citas ni llamadas de búsqueda. */
.client-search-dialog{width:min(680px,94vw);padding:20px}.client-search-header{display:flex;align-items:center;justify-content:space-between;gap:12px}.client-search-header h2{margin:0}.client-search-dialog label{margin:16px 0 6px}.client-search-results{display:grid;gap:9px;max-height:55vh;overflow:auto;margin-top:12px}.client-search-hint{color:#796b68;font-size:.9rem}.client-search-item{display:grid;gap:4px;text-align:left;background:#fff9f6;color:#403535;border:1px solid #ead5ca;padding:12px;white-space:normal}.client-search-item strong{font-size:1rem}.client-search-item span{font-size:.9rem}.client-search-item small{color:#73545d;font-weight:700}.client-search-item:hover{border-color:#a95364;filter:none}.search-highlight{outline:4px solid #a95364;outline-offset:2px;z-index:1}@media(max-width:620px){.client-search-dialog{padding:14px}}

/* Importador de copias: controles explícitos y confirmación. */
.import-dialog{width:min(680px,96vw);padding:22px}.import-dialog fieldset{border:1px solid #ead5ca;border-radius:10px;padding:12px}.import-dialog legend{font-weight:700}.import-dialog input[type=radio],.import-dialog input[type=checkbox]{width:auto;display:inline;margin-right:8px}.import-dialog fieldset label,.import-check{display:flex;align-items:flex-start;gap:5px;font-size:.93rem;font-weight:400}.import-dialog #importSummary{padding:12px;background:#fff8f5;border-radius:10px;overflow-wrap:anywhere}.import-dialog .toolbar{margin-top:18px}.import-dialog button{margin:4px 0}

/* Acciones por cita: botón accesible arriba y menú modal fuera de las tarjetas. */
.timeline-event{isolation:isolate}
.timeline-event:focus-within,.timeline-event:hover{z-index:3}
.timeline-event-main{padding-right:96px}
.timeline-event-actions{position:absolute;top:6px;right:6px;z-index:2;display:block;flex:none;padding:8px 9px;min-width:77px;min-height:36px;border-radius:8px;background:#73545d;color:white;font-size:.76rem;line-height:1.1;white-space:nowrap;box-shadow:0 1px 4px #0003}
.timeline-event-actions:focus-visible,.outside-actions:focus-visible{outline:3px solid #253d69;outline-offset:2px}
.outside-cita-row{display:flex;gap:8px;align-items:stretch;min-width:0}
.outside-cita-row .outside-cita{flex:1;min-width:0}
.outside-actions{align-self:center;white-space:nowrap;background:#73545d}
.cita-actions-dialog{width:min(410px,94vw);padding:22px}
.cita-actions-dialog h2{margin:0 0 6px}
.cita-actions-info{margin:0 0 16px;overflow-wrap:anywhere;color:#65545a}
.cita-actions-list{display:grid;gap:9px}
.cita-actions-list button{min-height:46px;text-align:left;padding:12px 16px}
.cita-actions-list .danger-action{background:#a72e45}
.cita-actions-list .cancel-action{background:#eee7e4;color:#44363b;text-align:center}
@media(max-width:620px){.timeline-event-main{padding-right:82px}.timeline-event-actions{top:5px;right:4px;min-width:73px;min-height:38px;padding:9px 5px;font-size:.7rem}.outside-actions{padding:9px 7px;font-size:.75rem}}

/* Móvil: nombres completos y Acciones al inicio de la tarjeta.
   La cita siguiente puede solaparse con el extremo inferior; no colocar allí controles. */
@media(max-width:620px){
 .timeline-row{height:156px}
 .timeline-event{height:150px}
 .timeline-event-main{padding:49px 7px 7px;gap:4px;overflow:hidden}
 .timeline-event-main strong{white-space:normal;overflow:visible;text-overflow:clip;overflow-wrap:anywhere;line-height:1.2;font-size:.82rem}
 .timeline-event-main .timeline-observation{max-height:2.4em;min-height:0}
 .timeline-event-actions{top:5px;bottom:auto;right:5px;min-height:38px}
}

/* En móviles, cada cita tiene su propia altura dentro de la media hora.
   Las filas se amplían en JavaScript cuando coinciden dos o más citas. */
@media(max-width:620px){
 .timeline-row{height:184px}
 .timeline-event{height:178px}
 .timeline-event-main{padding:49px 7px 7px;min-height:0}
 .timeline-event-main strong{white-space:normal;overflow:visible;text-overflow:clip;overflow-wrap:anywhere}
 .timeline-event-actions{top:5px;right:5px;bottom:auto}
}

/* Solo el dia y la fecha flotan cuando el encabezado original sale de pantalla.
   No se fijan los botones ni se modifica el horario de las citas. */
.floating-day-date{position:fixed;top:max(8px, env(safe-area-inset-top));left:50%;transform:translateX(-50%);z-index:40;max-width:calc(100vw - 20px);width:max-content;padding:10px 16px;border:1px solid #e7cfc5;border-radius:14px;background:#fffaf7;color:#403535;box-shadow:0 5px 18px #43332a25;font-size:clamp(.87rem,2.5vw,1.06rem);font-weight:750;line-height:1.25;text-align:center;overflow-wrap:anywhere;pointer-events:none}
.floating-day-date[hidden]{display:none}

/* Aviso real de conexión: se consulta a la propia base D1, no solo la señal del móvil. */
.connection-banner{position:fixed;z-index:100;top:max(6px, env(safe-area-inset-top));left:50%;transform:translateX(-50%);width:max-content;max-width:calc(100vw - 20px);padding:10px 14px;border-radius:11px;box-shadow:0 3px 14px #0003;text-align:center;font-weight:700;font-size:.9rem;pointer-events:none}
.connection-banner[hidden],.save-status[hidden],#verifySave[hidden]{display:none}
.connection-banner.checking{background:#fff0ca;color:#653e00;border:1px solid #d8af62}
.connection-banner.offline{background:#a51d31;color:white;border:1px solid #8d0d25}
.save-status{padding:11px;border-radius:9px;background:#fff0ca;color:#593b00;border:1px solid #d9b36a;font-weight:700;white-space:pre-wrap}
.save-status.error{background:#ffe1e3;color:#8b1730;border-color:#e49aa5}
#verifySave{width:100%;margin:0 0 12px;background:#775165}


/* Panel Mi jornada: vista de solo lectura, responsive y con nombres completos. */
.my-day-panel[hidden]{display:none}.my-day-panel{border:2px solid #dfb7ad;background:#fffdfa}.my-day-header{display:flex;align-items:flex-start;justify-content:space-between;flex-wrap:wrap;gap:12px}.my-day-header h2{font-size:1.35rem;margin:4px 0}.my-day-subtitle{color:#786969;font-size:.88rem;margin:4px 0}.my-day-head-actions{display:flex;flex-wrap:wrap;gap:8px}.my-day-close{background:#785c63}.my-day-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:16px 0}.my-day-stats>div{display:grid;gap:5px;background:#fff4ef;border:1px solid #ecd6cc;border-radius:10px;padding:12px}.my-day-stats span{font-size:.78rem;color:#65585a}.my-day-stats strong{font-size:1.55rem;font-variant-numeric:tabular-nums}.my-day-money{display:flex;flex-wrap:wrap;gap:12px;background:#f3f8f1;padding:12px;border-radius:9px;font-size:.93rem}.my-day-appointments{display:grid;gap:10px;margin:15px 0}.my-day-appointments h3{font-size:1.05rem;margin:4px 0}.my-day-card{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;border:1px solid #ead8cf;background:white;border-radius:11px;padding:13px;min-width:0}.my-day-card-details{display:flex;flex:1;min-width:0;flex-direction:column;gap:6px;overflow-wrap:anywhere}.my-day-card-details strong{font-size:1rem;white-space:normal}.my-day-card-details>span:not(.my-day-status){font-size:.85rem;color:#5b5050}.my-day-status{width:fit-content;max-width:100%;font-size:.77rem;font-weight:700;padding:4px 8px;border-radius:7px;background:#eee;color:#453938}.my-day-status.status-azul{background:#d9eafd}.my-day-status.status-lila{background:#e9dffa}.my-day-status.status-verde{background:#def2e6}.my-day-status.status-amarillo{background:#fff1c5}.my-day-status.status-rojo{background:#ffe0e0}.my-day-status.status-rosa{background:#ffe4ee}.my-day-note{margin:0;color:#68545d;font-size:.81rem;white-space:pre-wrap;overflow-wrap:anywhere}.my-day-card>button{flex:none;min-height:42px;align-self:flex-start}.my-day-calendar{width:100%;margin-top:5px}.my-day-empty{background:#fff4ef;border-radius:9px;padding:15px}@media(max-width:620px){.my-day-stats{grid-template-columns:repeat(2,minmax(0,1fr))}.my-day-card{flex-direction:column}.my-day-card>button{align-self:flex-end}.my-day-head-actions button{padding:9px 10px}}

/* Cambio rápido de color desde la jornada y el menú Acciones. */
.status-dialog{width:min(430px,94vw);padding:22px}.status-choices{display:grid;gap:9px;margin:15px 0}.status-choice{display:flex;align-items:center;gap:12px;text-align:left;background:#fff9f6;color:#3f3333;border:1px solid #e6d6ce;min-height:48px}.status-choice:disabled{opacity:.6}.status-choice .dot{width:19px;height:19px;flex:none;border-radius:50%}.status-quick-button{border:1px solid #d5c6bf;text-align:left;color:#332f31;cursor:pointer;font-size:.77rem;padding:7px 10px;min-height:35px}.status-quick-button:hover{filter:brightness(.96)}.status-dialog .cancel-action{background:#eee7e4;color:#44363b;width:100%}

/* Navegación accesible por fecha, en teléfono y escritorio. */
.my-day-navigation{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:8px}
.my-day-navigation .my-day-subtitle{flex:1;min-width:145px;text-align:center;font-weight:700;color:#503c42}
.my-day-navigation button{white-space:nowrap;padding:9px 11px}
.my-day-navigation-shortcuts{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px;align-items:center}
.my-day-date-picker:not([hidden]){max-width:170px}
@media(max-width:620px){.my-day-navigation{gap:6px}.my-day-navigation .my-day-subtitle{min-width:100%;order:-1;margin:3px 0}.my-day-navigation button{flex:1;font-size:.88rem}}

/* El importe cobrado se añade DEBAJO de los puntitos originales, sin sustituirlos. */
.day .day-collected{display:block;max-width:100%;font-size:.77rem;font-weight:750;line-height:1.25;color:#287445;font-variant-numeric:tabular-nums;overflow-wrap:anywhere;margin-top:2px}
@media(max-width:620px){.day{min-height:91px}.day .day-collected{font-size:.67rem;letter-spacing:-.02em}.day .dots{gap:2px}.day .dot{width:8px;height:8px}}

/* El importe cobrado se destaca únicamente en la tarjeta superior. */
#collected{color:#35744c;font-variant-numeric:tabular-nums}

/* Contador desplegable en la misma fila; menú superpuesto. */
.stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;overflow:visible}.stats>article{min-width:0}.period-stat{position:relative;padding:0!important;overflow:visible}.period-toggle{width:100%;height:100%;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:6px;text-align:left;background:transparent;color:inherit;border:0;border-radius:inherit;padding:14px;box-shadow:none}.period-toggle:hover{background:#fff6f0;filter:none}.period-toggle span{font-size:.9rem}.period-toggle strong{color:#35744c;font-variant-numeric:tabular-nums}.period-toggle small{color:#796b68;font-size:.73rem}.period-menu{position:absolute;right:0;top:calc(100% + 6px);z-index:40;width:min(310px,88vw);padding:14px;background:#fff;border:1px solid #ead5ca;border-radius:12px;box-shadow:0 12px 30px #0003;display:grid;gap:8px}.period-menu[hidden]{display:none}.period-menu label{font-size:.8rem;color:#695b5b}.period-menu select{width:100%;min-width:0;padding:9px;border:1px solid #d7c5bd;border-radius:8px;background:white;color:#382d2d}.period-menu button{margin-top:4px}@media(max-width:620px){.stats{gap:5px}.stats>article{padding:8px!important}.stats>article span{font-size:.69rem}.stats strong,.period-toggle strong{font-size:clamp(.83rem,3.6vw,1.4rem)!important;overflow-wrap:anywhere}.stats small,.period-toggle small{font-size:.62rem}.period-stat{padding:0!important}.period-toggle{padding:8px;gap:4px}.period-menu{right:0}}

.header-actions{display:flex;gap:8px;align-items:center}.staff-button{white-space:nowrap}
#staffGate{max-width:520px;margin:24px auto}.staff-create{display:grid;grid-template-columns:1.5fr 1fr 1fr auto;gap:10px;align-items:end}
.staff-users{display:grid;gap:10px;margin-top:14px}.staff-user{display:grid;grid-template-columns:1.4fr .9fr 1fr auto;gap:8px;align-items:center;padding:10px;border:1px solid #ead5ca;border-radius:12px;background:#fffaf7}
.staff-user.inactive{opacity:.6}.staff-user input,.staff-user select{min-width:0}.staff-user-actions{display:flex;gap:6px;flex-wrap:wrap}
body.role-tech .stats,body.role-tech .income-panel,body.role-tech #export,body.role-tech #importBackup,body.role-tech .my-day-money,body.role-tech .day-collected{display:none!important}
body.role-tech #importeField{display:none!important}
.performed-by{font-size:.75rem;color:#6e625e;font-weight:600}
@media(max-width:720px){.staff-create,.staff-user{grid-template-columns:1fr}.header-actions{gap:4px}.staff-button{max-width:48vw;overflow:hidden;text-overflow:ellipsis}}