/* Calendario screens (app/views/fibbel-ui/calendario-de-citas-para-fisioterapeutas.php).
   Reproduces react-big-calendar 1.x CSS + fibbel_frontend/src/index.css calendar overrides (.rbc-*, .calendario-*),
   CustomEvents.jsx inline styles, MUI 6 Dialog/Switch/Accordion defaults and the react-modal config overlay. */

/* --- Shared MUI pieces --- */
body.exp-feature-problema .fx-app{position:relative}
body.exp-feature-problema .fx-app .fxk-mui{font-family:"Roboto","Helvetica","Arial",sans-serif}
body.exp-feature-problema .fx-app .fxk-backdrop{position:absolute;inset:0;z-index:20;background:rgba(0,0,0,.5);display:flex;align-items:center;justify-content:center}
body.exp-feature-problema .fx-app .fxk-dialog{display:flex;flex-direction:column;width:calc(100% - 64px);max-width:900px;max-height:calc(100% - 64px);margin:32px;overflow:hidden;background:#fff;color:rgba(0,0,0,.87);border-radius:4px;box-shadow:0 11px 15px -7px rgba(0,0,0,.2),0 24px 38px 3px rgba(0,0,0,.14),0 9px 46px 8px rgba(0,0,0,.12);font-family:"Roboto","Helvetica","Arial",sans-serif}
body.exp-feature-problema .fx-app .fxk-dialog-title{flex:0 0 auto;padding:16px 24px;font-size:1.25rem;font-weight:500;line-height:1.6;letter-spacing:.0075em}
body.exp-feature-problema .fx-app .fxk-dialog-content{flex:1 1 auto;overflow:hidden;padding:16px 24px}
body.exp-feature-problema .fx-app .fxk-dividers{border-top:1px solid rgba(0,0,0,.12);border-bottom:1px solid rgba(0,0,0,.12)}
body.exp-feature-problema .fx-app .fxk-dialog-actions{flex:0 0 auto;display:flex;align-items:center;justify-content:flex-end;gap:8px;padding:8px}
body.exp-feature-problema .fx-app .fxk-tf-small{min-height:40px;padding:8.5px 14px}
body.exp-feature-problema .fx-app .fxk-full{width:100%}
body.exp-feature-problema .fx-app .fxk-label{font-family:"Roboto","Helvetica","Arial",sans-serif;font-size:1rem;line-height:1.5;letter-spacing:.00938em}
body.exp-feature-problema .fx-app .fxk-fcl{display:inline-flex;align-items:center;margin-left:-11px;margin-right:16px}
body.exp-feature-problema .fx-app .fxk-switch{position:relative;display:inline-flex;flex-shrink:0;width:58px;height:38px;padding:12px}
body.exp-feature-problema .fx-app .fxk-switch-track{width:100%;height:100%;border-radius:7px;background:#000;opacity:.38}
body.exp-feature-problema .fx-app .fxk-switch-thumb{position:absolute;top:9px;left:9px;width:20px;height:20px;border-radius:50%;background:#fff;box-shadow:0 2px 1px -1px rgba(0,0,0,.2),0 1px 1px 0 rgba(0,0,0,.14),0 1px 3px 0 rgba(0,0,0,.12)}
body.exp-feature-problema .fx-app .fxk-switch-on .fxk-switch-track{background:#1976d2;opacity:.5}
body.exp-feature-problema .fx-app .fxk-switch-on .fxk-switch-thumb{left:29px;background:#1976d2}

/* --- Calendario.jsx header (h1.calendario-h1, #calendar-share-link, .addCita, filters) --- */
body.exp-feature-problema .fx-app .fxk-share{text-align:center;margin:5px}
body.exp-feature-problema .fx-app .fxk-link{color:#0000ee;text-decoration:underline}
body.exp-feature-problema .fx-app .fxk-addcita{display:flex;gap:10px;margin-bottom:20px;justify-content:center;align-items:center;flex-wrap:wrap}
body.exp-feature-problema .fx-app .fxk-btn-purple{background:#f3e5f5;border-color:#9c27b0;color:#9c27b0}
body.exp-feature-problema .fx-app .fxk-btn-blue{background:#e3f2fd;border-color:#1976d2;color:#1976d2}
body.exp-feature-problema .fx-app .fxk-btn-orange{background:#fff3e0;border-color:#ef6c00;color:#ef6c00}
body.exp-feature-problema .fx-app .fxk-btn-orange .fx-chip{margin-left:8px;height:20px;font-size:.75rem;background:#ef6c00;color:#fff}
body.exp-feature-problema .fx-app .fxk-btn .fx-ic{font-size:18px}
body.exp-feature-problema .fx-app .fxk-config{padding:10px}
body.exp-feature-problema .fx-app .fxk-filters{display:flex;flex-direction:row;align-items:center;gap:12px;flex-wrap:wrap;justify-content:center;margin-bottom:8px;width:100%}
body.exp-feature-problema .fx-app .fxk-filters .fx-tf{width:260px}
body.exp-feature-problema .fx-app .fxk-ib-44{width:44px;height:44px;padding:5px}
body.exp-feature-problema .fx-app .fxk-config-btn{display:flex;justify-content:flex-end;width:100%}

/* --- react-big-calendar toolbar + time grid (calendario-div padding 15px) --- */
body.exp-feature-problema .fx-app .fxk-cal{padding:15px}
body.exp-feature-problema .fx-app .rbc-toolbar{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;margin-bottom:10px;font-size:16px}
body.exp-feature-problema .fx-app .rbc-toolbar-label{flex-grow:1;padding:0 10px;text-align:center;font-weight:bold}
body.exp-feature-problema .fx-app .rbc-btn-group{display:inline-flex;white-space:nowrap}
body.exp-feature-problema .fx-app .rbc-btn-group+.rbc-btn-group{margin-left:10px}
body.exp-feature-problema .fx-app .rbc-tb-btn{display:inline-flex;align-items:center;justify-content:center;height:29px;margin:0;border:1px solid #ccc;padding:0 1rem;border-radius:0;line-height:normal;white-space:nowrap;background:#0A2463;color:#fff}
body.exp-feature-problema .fx-app .rbc-tb-btn+.rbc-tb-btn{margin-left:-1px}
body.exp-feature-problema .fx-app .rbc-tb-btn:first-child{border-radius:4px 0 0 4px}
body.exp-feature-problema .fx-app .rbc-tb-btn:last-child{border-radius:0 4px 4px 0}
body.exp-feature-problema .fx-app .rbc-tb-btn.rbc-active{box-shadow:inset 0 3px 5px rgba(0,0,0,.125);border-color:#adadad}
body.exp-feature-problema .fx-app .rbc-tb-ib{width:42px;padding:0}
body.exp-feature-problema .fx-app .rbc-tb-ib .fx-ic{font-size:18px}
body.exp-feature-problema .fx-app .rbc-time-view{display:flex;flex-direction:column;width:100%;border:1px solid #ddd;background:transparent}
body.exp-feature-problema .fx-app .rbc-time-header{display:flex;flex:0 0 auto}
body.exp-feature-problema .fx-app .rbc-time-header-gutter,body.exp-feature-problema .fx-app .rbc-time-gutter{flex:none;width:52px;white-space:nowrap;text-align:right;color:#0A2463;font-weight:bold}
body.exp-feature-problema .fx-app .rbc-time-header-content{flex:1;display:flex;flex-direction:column;min-width:0;border-left:1px solid #ddd}
body.exp-feature-problema .fx-app .rbc-time-header-cell{display:flex;min-height:20px;border-bottom:1px solid #ddd}
body.exp-feature-problema .fx-app .rbc-header{flex:1 0 0%;overflow:hidden;white-space:nowrap;padding:0 3px;text-align:center;font-weight:bold;font-size:90%;color:#0A2463}
body.exp-feature-problema .fx-app .rbc-header+.rbc-header{border-left:1px solid #ddd}
body.exp-feature-problema .fx-app .rbc-allday-cell{display:flex;height:20px;background:rgb(249,249,249)}
body.exp-feature-problema .fx-app .rbc-allday-cell span{flex:1 0 0%}
body.exp-feature-problema .fx-app .rbc-allday-cell span+span{border-left:1px solid #ddd}
body.exp-feature-problema .fx-app .rbc-time-content{display:flex;align-items:flex-start;width:100%;border-top:2px solid #ddd;position:relative}
body.exp-feature-problema .fx-app .rbc-day-slot{position:relative;flex:1 0 0%;min-width:0;border-left:1px solid #ddd}
body.exp-feature-problema .fx-app .rbc-day-slot.rbc-today{background:#eaf6ff}
body.exp-feature-problema .fx-app .rbc-timeslot-group{min-height:80px;display:flex;flex-direction:column;border-bottom:1px solid #ddd}
body.exp-feature-problema .fx-app .rbc-time-slot{flex:1 0 0;display:flex;flex-direction:column;justify-content:center}
body.exp-feature-problema .fx-app .rbc-day-slot .rbc-time-slot{border-top:1px solid #f7f7f7}
body.exp-feature-problema .fx-app .rbc-label{padding:0 5px;font-size:16px}
body.exp-feature-problema .fx-app .hour-label{font-size:10px;margin-left:8px;color:rgb(177,177,177);line-height:1.1}
body.exp-feature-problema .fx-app .rbc-events-container{position:absolute;top:0;bottom:0;left:0;right:0;margin:0 5px!important}
body.exp-feature-problema .fx-app .rbc-event{position:absolute;display:flex;flex-flow:column wrap;align-items:flex-start;overflow:hidden;min-height:20px;padding:2px 5px;border-radius:0;color:#fff;box-sizing:border-box}
body.exp-feature-problema .fx-app .rbc-event-label{flex:none;padding-right:5px;font-size:80%;white-space:nowrap}
body.exp-feature-problema .fx-app .rbc-event-content{width:100%;flex:1 1 0;line-height:1;min-height:1em}
body.exp-feature-problema .fx-app .fxk-ev{border-radius:4px;color:#fff}
body.exp-feature-problema .fx-app .fxk-ev-title{font-weight:400;line-height:1.2;margin-top:4px;font-size:.9em}
body.exp-feature-problema .fx-app .fxk-ev-sub{font-size:.7em;color:#fff;margin-top:3px}
body.exp-feature-problema .fx-app .fxk-ev-icons{position:absolute;top:2px;right:2px;z-index:2;display:flex;gap:4px;align-items:center;justify-content:center}
body.exp-feature-problema .fx-app .fxk-st{display:inline-flex;align-items:center;justify-content:center;width:14px;height:14px;border-radius:50%;background:#fff;border:2px solid currentColor;font-size:1.125rem}
body.exp-feature-problema .fx-app .fxk-st .fx-ic{font-size:inherit}
body.exp-feature-problema .fx-app .fxk-inv{display:inline-flex;align-items:center;justify-content:center;width:10px;height:10px;border-radius:50%;background:#fff;border:2px solid currentColor;margin:0 5px}
body.exp-feature-problema .fx-app .fxk-inv .fx-ic{font-size:1.25rem}
body.exp-feature-problema .fx-app .fxk-ev-bl,body.exp-feature-problema .fx-app .fxk-ev-br{position:absolute;bottom:0;display:inline-flex;padding:8px;font-size:1.5rem}
body.exp-feature-problema .fx-app .fxk-ev-bl{left:0;color:#dadada}
body.exp-feature-problema .fx-app .fxk-ev-br{right:0;color:#afd7ff}

/* --- Huecos Libres view (Calendario.jsx CustomHuecosLibresView) --- */
body.exp-feature-problema .fx-app .fxk-huecos{padding:16px}
body.exp-feature-problema .fx-app .fxk-h5{font-family:"Roboto","Helvetica","Arial",sans-serif;font-size:1.5rem;font-weight:400;line-height:1.334;text-align:center;margin-bottom:24px}
body.exp-feature-problema .fx-app .fxk-paper3{box-shadow:0 3px 3px -2px rgba(0,0,0,.2),0 3px 4px 0 rgba(0,0,0,.14),0 1px 8px 0 rgba(0,0,0,.12)}
body.exp-feature-problema .fx-app .fxk-slots th{font-weight:bold;font-size:1.1rem;padding:16px;background:#f5f5f5}
body.exp-feature-problema .fx-app .fxk-slots td{padding:12px 16px}
body.exp-feature-problema .fx-app .fxk-slots tbody tr:nth-of-type(even) td{background:#fafafa}
body.exp-feature-problema .fx-app .fxk-slots .fxk-c{text-align:center}
body.exp-feature-problema .fx-app .fxk-sub1{font-size:1rem;line-height:1.75;font-weight:500}
body.exp-feature-problema .fx-app .fxk-body1{display:block;font-size:1rem;line-height:1.5;font-weight:500}
body.exp-feature-problema .fx-app .fxk-caption{display:block;font-size:.75rem;line-height:1.66;color:rgba(0,0,0,.6)}
body.exp-feature-problema .fx-app .fxk-price{color:#1976d2}
body.exp-feature-problema .fx-app .fxk-pag{margin-top:16px;display:flex;justify-content:space-between;align-items:center;font-size:.875rem;color:rgba(0,0,0,.6)}
body.exp-feature-problema .fx-app .fxk-btn-dis{color:rgba(0,0,0,.26);border-color:rgba(0,0,0,.12)}

/* --- Modificar Cita dialog (Calendario.jsx edit Dialog, AppointmentPaymentsEditor.jsx) --- */
body.exp-feature-problema .fx-app .fxk-edit-title{display:flex;justify-content:space-between;align-items:center;padding:16px 24px 8px}
body.exp-feature-problema .fx-app .fxk-h6{font-size:1.25rem;font-weight:bold;line-height:1.6;color:#0A2463}
body.exp-feature-problema .fx-app .fxk-std{width:100%;margin-bottom:20px}
body.exp-feature-problema .fx-app .fxk-std .fx-tf-label{top:0;font-size:.75rem}
body.exp-feature-problema .fx-app .fxk-addpac{width:100%;display:flex;align-items:center;justify-content:center;margin-top:4px}
body.exp-feature-problema .fx-app .fxk-grid{display:grid;grid-template-columns:1fr 1fr;row-gap:25px;column-gap:16px;margin-top:20px}
body.exp-feature-problema .fx-app .fxk-span2{grid-column:1 / -1}
body.exp-feature-problema .fx-app .fxk-estado{display:flex;align-items:flex-start;gap:10px;flex-wrap:wrap}
body.exp-feature-problema .fx-app .fxk-estado .fx-tf{flex:1 1 240px;border:2px solid #2196F3}
body.exp-feature-problema .fx-app .fxk-pay{display:grid;grid-template-columns:36px minmax(0,1fr);gap:8px}
body.exp-feature-problema .fx-app .fxk-pay-row{display:grid;grid-template-columns:minmax(120px,1.4fr) minmax(70px,.7fr) minmax(130px,1fr) minmax(120px,1fr) 32px;gap:8px;align-items:center}
body.exp-feature-problema .fx-app .fxk-pay-row .fx-tf{min-width:0}
body.exp-feature-problema .fx-app .fxk-cb{display:inline-flex;padding:9px;color:rgba(0,0,0,.6)}

/* --- ConfiguracionCalendario react-modal + ConfigAccordionSection --- */
body.exp-feature-problema .fx-app .fxk-overlay{position:absolute;inset:0;z-index:20;background:rgba(0,0,0,.75)}
body.exp-feature-problema .fx-app .fxk-modal{position:absolute;top:40px;left:40px;right:40px;bottom:40px;max-width:1000px;margin:0 auto;overflow:hidden;padding:20px;background:#fff;border:1px solid #ccc;border-radius:4px}
body.exp-feature-problema .fx-app .fxk-acc{margin-bottom:16px;border:1px solid rgba(0,0,0,.12);border-radius:8px;overflow:hidden;background:#fff;box-shadow:0 2px 1px -1px rgba(0,0,0,.2),0 1px 1px 0 rgba(0,0,0,.14),0 1px 3px 0 rgba(0,0,0,.12)}
body.exp-feature-problema .fx-app .fxk-acc-sum{display:flex;align-items:center;min-height:48px;padding:0 16px;background:#fafafa}
body.exp-feature-problema .fx-app .fxk-acc-title{flex:1;margin:12px 0;font-size:1.25rem;font-weight:500;line-height:1.6;letter-spacing:.0075em;color:#0A2463}
body.exp-feature-problema .fx-app .fxk-acc-sum .fx-ic{color:rgba(0,0,0,.54)}
body.exp-feature-problema .fx-app .fxk-acc-open .fxk-acc-sum .fx-ic{transform:rotate(180deg)}
body.exp-feature-problema .fx-app .fxk-acc-det{padding:16px 16px 16px}
body.exp-feature-problema .fx-app .fxk-body2{font-size:.875rem;line-height:1.43;letter-spacing:.01071em}
body.exp-feature-problema .fx-app .fxk-muted{color:rgba(0,0,0,.6)}
body.exp-feature-problema .fx-app .fxk-mb2{margin-bottom:16px}
body.exp-feature-problema .fx-app .fxk-grid2{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-bottom:24px}
body.exp-feature-problema .fx-app .fxk-grid2 .fx-helper{white-space:normal}
body.exp-feature-problema .fx-app .fxk-center{display:flex;justify-content:center;margin-top:16px}
