@layer ocp-interface-safety {
  /* Se retiran los bloques explicativos; los avisos operativos del gerente siguen disponibles. */
  html body #attendancePeriodNotice,html body #managerHub .manager-hub-copy {display:none!important}
  html body #accessNotice[data-company-selected] {display:none!important}
  html body #managerHub {background:none!important;border:0!important;box-shadow:none!important;padding:0!important;margin:0!important;min-height:0!important}
  html body #managerHub:has(.manager-hub-actions.hidden) {display:none!important}
  html body #managerHub .manager-hub-actions:not(.hidden) {display:flex!important;flex-wrap:wrap!important;gap:8px!important;padding:0!important;margin:0 0 12px!important}
  #mobileMonthButton {display:none!important}
  .ocp-month-dialog {box-sizing:border-box!important;width:min(420px,calc(100vw - 32px))!important;max-height:calc(100dvh - 32px)!important;overflow:auto!important;border:1px solid #b8d0de!important;border-radius:8px!important;padding:18px!important;background:#fff!important;color:#193e51!important;box-shadow:0 20px 70px #00192755!important}
  .ocp-month-dialog::backdrop {background:#071e2aa8!important;backdrop-filter:blur(2px)!important}
  .ocp-month-dialog header {display:grid!important;grid-template-columns:minmax(0,1fr) 40px!important;gap:10px!important;align-items:start!important;margin:0 0 16px!important;padding:0!important;background:none!important;color:inherit!important;border:0!important}
  .ocp-month-dialog h2 {margin:4px 0 0!important;font-size:20px!important;color:inherit!important}
  .ocp-month-dialog small {font-size:10px!important;letter-spacing:.09em!important;color:inherit!important}
  .ocp-month-dialog .ocp-month-x {width:40px!important;height:40px!important;min-width:40px!important;padding:0!important;font-size:25px!important}
  .ocp-month-dialog select {box-sizing:border-box!important;width:100%!important;min-width:0!important;margin:5px 0 14px!important;padding:10px!important;font-size:16px!important;background:#f3f8fb!important;color:#193e51!important;border:1px solid #bed4e2!important;border-radius:6px!important}
  .ocp-month-grid {display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:7px!important}
  .ocp-month-grid button {box-sizing:border-box!important;min-width:0!important;min-height:44px!important;padding:8px 4px!important;font-size:13px!important;font-weight:600!important;background:#edf6fa!important;color:#194e66!important;border:1px solid #c6dfec!important;border-radius:6px!important}
  .ocp-month-grid button[aria-pressed=true] {background:#0b5471!important;color:#fff!important;border-color:#0b5471!important}
  .ocp-month-dialog footer {display:flex!important;justify-content:space-between!important;gap:10px!important;padding-top:16px!important}
  .ocp-month-dialog footer button {min-height:42px!important;padding:8px 14px!important}
  html[data-theme=dark] .ocp-month-dialog {background:#101c24!important;color:#f0f7fb!important;border-color:#557687!important}
  html[data-theme=dark] .ocp-month-dialog select {background:#172b36!important;color:#edf6fc!important;border-color:#587b8e!important}
  html[data-theme=dark] .ocp-month-grid button {background:#1b3543!important;color:#e2f3fc!important;border-color:#50788c!important}
  html[data-theme=dark] .ocp-month-grid button[aria-pressed=true] {background:#a8e1fa!important;color:#13394b!important;border-color:#c4edff!important}
  @media(max-width:900px) {
    html.ocp-mobile-ficha-open body {position:fixed!important;top:var(--ocp-saved-scroll,0)!important;left:0!important;right:0!important;width:100%!important;overflow:hidden!important}
    html body #employeeDetailPanel.employee-floating-open {display:flex!important;flex-direction:column!important;animation:none!important;transition:none!important;padding:5px!important}
    html body #employeeDetailPanel.employee-floating-open>.employee-floating-heading {
      position:relative!important;top:auto!important;flex:0 0 auto!important;
      width:100%!important;margin:0!important;padding:10px!important;
      grid-template-columns:minmax(0,1fr) 40px!important;gap:8px!important;
      box-shadow:none!important;border-bottom:1px solid var(--line,#c5d9e4)!important;
    }
    html body #employeeDetailPanel.employee-floating-open>.employee-panel-scroll {
      position:relative!important;inset:auto!important;flex:1 1 auto!important;
      width:100%!important;max-width:100%!important;min-height:0!important;
      margin:0!important;padding:12px 10px!important;scroll-padding-top:12px!important;
    }
    html body #employeeDetailPanel .employee-floating-identity strong {max-width:100%!important;font-size:15px!important;line-height:1.3!important}
    html body #employeeDetailPanel .employee-floating-identity small {font-size:10px!important}
    html body #closeEmployeeDetails {width:40px!important;height:40px!important;min-width:40px!important}
    html body #employeeRecordControls {grid-template-columns:minmax(0,1fr) minmax(92px,112px)!important;align-items:end!important;gap:8px!important}
    html body #employeeRecordControls #saveEmp {font-size:12px!important;min-height:42px!important;padding:7px!important;margin:0!important;white-space:normal!important;overflow-wrap:normal!important}
    html body #employeeRecordControls select {height:42px!important;font-size:16px!important;padding:6px!important}
    html body #employeeRecordControls label {font-size:11px!important}
    html body #employeeDetailPanel .employee-actions {display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important}
    html body #employeeDetailPanel .employee-actions button {width:100%!important;min-height:42px!important;padding:8px!important;font-size:13px!important;margin:0!important}
    html body #employeeDetailPanel #deleteEmp {grid-column:1/-1!important}
    html body #app>.toolbar .month-picker {grid-template-columns:auto 32px minmax(0,1fr) 32px!important;column-gap:6px!important;isolation:isolate}
    html.ocp-month-dialog-ready body #app>.toolbar .month-picker #month {position:absolute!important;width:1px!important;height:1px!important;min-height:0!important;max-width:1px!important;clip-path:inset(50%)!important;overflow:hidden!important;opacity:0!important;pointer-events:none!important;padding:0!important;border:0!important}
    html.ocp-month-dialog-ready body #app>.toolbar .month-picker #mobileMonthButton {display:flex!important;grid-column:3!important;grid-row:1!important;align-items:center!important;justify-content:space-between!important;gap:6px!important;width:100%!important;min-width:0!important;max-width:100%!important;min-height:42px!important;padding:7px 9px!important;margin:0!important;overflow:hidden!important;contain:inline-size!important}
    html body #mobileMonthButton span {min-width:0!important;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;font-size:14px!important}
    html body #app>.toolbar .month-picker #mobileMonthButton {background:#fff!important;color:#173d50!important;-webkit-text-fill-color:#173d50!important;border:1px solid #b8d0df!important}
    html[data-theme=dark] body #app>.toolbar .month-picker #mobileMonthButton {background:#172b36!important;color:#eef6fc!important;-webkit-text-fill-color:#eef6fc!important;border-color:#56788a!important}
    html body #mobileMonthButton span {color:inherit!important;-webkit-text-fill-color:currentColor!important}
    html body #mobileMonthButton svg {width:17px!important;height:17px!important;flex:0 0 17px;fill:none!important;stroke:currentColor!important;stroke-width:1.8!important}
    html body #personalCalendar>.tabletop {display:grid!important;grid-template-columns:minmax(0,1fr)!important;width:100%!important;gap:10px!important}
    html body #personalCalendar .calendar-nav {display:grid!important;grid-template-columns:38px minmax(0,1fr) 38px!important;align-items:center!important;gap:6px!important;width:100%!important;max-width:100%!important;margin:0!important}
    html body #personalCalendar .calendar-nav strong {min-width:0!important;width:100%!important;text-align:center!important;font-size:14px!important;line-height:1.35!important;white-space:normal!important}
    html body #personalCalendar .calendar-nav button {width:38px!important;min-width:38px!important;min-height:42px!important;height:42px!important;padding:4px!important;margin:0!important}
    html body input:is([type=date],[type=time]) {display:block!important;appearance:none!important;-webkit-appearance:none!important;contain:inline-size!important;inline-size:100%!important;min-inline-size:0!important;max-inline-size:100%!important}
    html body input::-webkit-datetime-edit {min-width:0!important;max-width:100%!important;padding:0!important}
    html body :is(.field,.formgrid,.shift-form,.reminder-form) {min-width:0!important;max-width:100%!important}
    html body #welcomeScreen .wc-nav {position:relative!important;top:auto!important;backdrop-filter:none!important;transform:none!important}
    html body #welcomeScreen :is(.wc-product,.wc-demo-content,.wc-demo-tabs,.wc-demo-heading,.wc-demo-week,.wc-feature) {min-width:0!important;max-width:100%!important;box-sizing:border-box!important}
    html body #welcomeScreen .wc-product {width:100%!important;justify-self:center!important;margin:0!important;transform:none!important}
    html body #welcomeScreen .wc-product::before {display:none!important}
    html body #welcomeScreen .wc-demo-week {display:grid!important;grid-template-columns:repeat(7,minmax(0,1fr))!important;gap:4px!important;width:100%!important;margin-inline:0!important}
    html body #welcomeScreen .wc-demo-week>div {min-width:0!important;text-align:center!important}
    html body #welcomeScreen .wc-demo-week strong {display:grid!important;place-items:center!important;aspect-ratio:1!important;min-height:0!important;height:auto!important;width:100%!important;margin:8px 0 0!important;padding:0!important;font-size:15px!important}
    html body #welcomeScreen :is(.wc-btn,.wc-card-action,.wc-demo-tabs button) {max-width:100%!important;min-width:0!important;min-height:42px!important;box-sizing:border-box!important}
    html body #welcomeScreen .wc-demo-tabs {display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:6px!important}
    html body #welcomeScreen .wc-demo-heading {flex-wrap:wrap!important;gap:8px!important}
    html body #welcomeScreen .wc-demo-heading>div {min-width:0!important;max-width:100%!important}
  }
  @media(max-width:600px) {
    html body #employeeDetailPanel .formgrid>.field:has(input[type=date]),html body #app .shift-form>.field:has(input[type=date]) {grid-column:1/-1!important}
    html body #welcomeScreen .wc-nav {display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:12px!important;padding:14px 20px!important}
    html body #welcomeScreen .wc-nav-actions {display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;width:100%!important;margin:0!important;gap:8px!important}
    html body #welcomeScreen .wc-nav-actions button {width:100%!important;justify-content:center!important;font-size:12px!important;padding:9px!important}
    html body #welcomeScreen .wc-feature {padding:20px!important}
    html body #welcomeScreen .wc-feature h3 {font-size:24px!important;line-height:1.25!important}
  }
}

