/* PedidosClick V9.6.8 · UI unificada + auditoría total
   Regla semántica:
   - switch = activar/desactivar, mostrar/ocultar, habilitar/deshabilitar.
   - checkbox = selección múltiple, permisos, filtros, confirmaciones y acciones puntuales.
*/
:root{
  --pc-ui-orange:#F56B16;
  --pc-ui-orange-dark:#D94F0B;
  --pc-ui-orange-soft:#FFF3E8;
  --pc-ui-orange-line:#F5C69F;
  --pc-ui-text:#171717;
  --pc-ui-muted:#64748B;
  --pc-ui-line:#EADFD5;
  --pc-ui-ok:#16A34A;
  --pc-ui-danger:#DC2626;
  --pc-ui-shadow:0 10px 26px rgba(15,23,42,.08);
}

/* ---------- Botones ---------- */
.btn,button.btn,a.btn{
  border-radius:13px!important;
  min-height:42px;
  font-weight:800;
  line-height:1.12;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  transition:transform .14s ease,box-shadow .14s ease,background .14s ease,border-color .14s ease,opacity .14s ease;
}
.btn:hover:not(:disabled){transform:translateY(-1px);box-shadow:var(--pc-ui-shadow)}
.btn:active:not(:disabled){transform:translateY(0)}
.btn:disabled{cursor:not-allowed;opacity:.58;transform:none!important;box-shadow:none!important}
.btn-primary,.btn.primary{background:var(--pc-ui-orange)!important;border-color:var(--pc-ui-orange)!important;color:#fff!important}
.btn-primary:hover:not(:disabled),.btn.primary:hover:not(:disabled){background:var(--pc-ui-orange-dark)!important;border-color:var(--pc-ui-orange-dark)!important}
.btn-light,.btn.light,.btn-secondary{background:#fff!important;border:1px solid var(--pc-ui-line)!important;color:var(--pc-ui-text)!important}
.btn-soft{background:var(--pc-ui-orange-soft)!important;border:1px solid var(--pc-ui-orange-line)!important;color:#9A3412!important}
.btn-danger,.btn.danger{background:#FEE2E2!important;border:1px solid #FECACA!important;color:#991B1B!important}
.btn-ok,.btn.green,.btn.success{background:#DCFCE7!important;border:1px solid #BBF7D0!important;color:#166534!important}

/* ---------- Switch determinista ----------
   Se dibuja con background CSS sobre el propio input. No depende de
   ::before ni del span.slider heredado, por compatibilidad entre navegadores. */
input.pc-toggle-input[type="checkbox"],
label.switch>input.pc-toggle-input[type="checkbox"]{
  -webkit-appearance:none!important;
  appearance:none!important;
  display:inline-block!important;
  visibility:visible!important;
  opacity:1!important;
  position:relative!important;
  inset:auto!important;
  pointer-events:auto!important;
  width:52px!important;
  min-width:52px!important;
  max-width:52px!important;
  height:30px!important;
  min-height:30px!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  border-radius:999px!important;
  background-color:#CBD5E1!important;
  background-image:radial-gradient(circle at 15px 15px,#fff 0 11px,transparent 12px)!important;
  background-repeat:no-repeat!important;
  background-position:0 0!important;
  box-shadow:inset 0 0 0 1px rgba(15,23,42,.07)!important;
  outline:none!important;
  cursor:pointer!important;
  vertical-align:middle!important;
  flex:0 0 52px!important;
  transition:background-color .18s ease,background-image .18s ease,box-shadow .18s ease!important;
}
input.pc-toggle-input[type="checkbox"]:checked,
label.switch>input.pc-toggle-input[type="checkbox"]:checked{
  background-color:var(--pc-ui-ok)!important;
  background-image:radial-gradient(circle at 37px 15px,#fff 0 11px,transparent 12px)!important;
}
input.pc-toggle-input[type="checkbox"]:focus-visible,
label.switch>input.pc-toggle-input[type="checkbox"]:focus-visible{
  box-shadow:0 0 0 3px rgba(245,107,22,.18)!important;
}
input.pc-toggle-input[type="checkbox"]:disabled{opacity:.52!important;cursor:not-allowed!important}
input.pc-toggle-input[type="checkbox"]::before,
input.pc-toggle-input[type="checkbox"]::after{display:none!important;content:none!important}

/* Compatibilidad con el markup histórico <label class=switch><input><span class=slider>. */
label.switch{position:relative!important;margin:0;vertical-align:middle}
label.switch>input.pc-toggle-input[type="checkbox"] + .slider{display:none!important}
label.switch:has(>.slider){width:52px!important;min-width:52px!important;max-width:52px!important;height:30px!important;display:inline-flex!important;align-items:center!important;flex:0 0 52px!important}
label.switch.pc-toggle-label:not(:has(>.slider)){
  width:auto!important;min-width:0!important;max-width:none!important;height:auto!important;display:flex!important;align-items:center!important;gap:9px!important;flex:0 0 auto!important;
}

/* ---------- Etiquetas de switches ---------- */
label.pc-toggle-label,
label:has(>input.pc-toggle-input[type="checkbox"]){
  display:flex!important;
  align-items:center!important;
  gap:10px!important;
  width:auto;
  min-height:30px;
  cursor:pointer!important;
  font-weight:800;
  color:var(--pc-ui-text);
}
label.pc-toggle-label.pc-toggle-card{border:1px solid var(--pc-ui-line);border-radius:14px;padding:12px 13px;background:#fff}
label.pc-toggle-label.pc-toggle-complex,
label:has(>input.pc-toggle-input[type="checkbox"]):has(>small),
label:has(>input.pc-toggle-input[type="checkbox"]):has(>b){
  display:grid!important;
  grid-template-columns:52px minmax(0,1fr)!important;
  column-gap:11px!important;
  row-gap:2px!important;
  align-items:start!important;
}
label.pc-toggle-label.pc-toggle-complex>input.pc-toggle-input,
label:has(>input.pc-toggle-input[type="checkbox"]):has(>small)>input.pc-toggle-input,
label:has(>input.pc-toggle-input[type="checkbox"]):has(>b)>input.pc-toggle-input{grid-column:1!important;grid-row:1 / span 3!important}
label.pc-toggle-label.pc-toggle-complex>b,
label.pc-toggle-label.pc-toggle-complex>strong,
label.pc-toggle-label.pc-toggle-complex>span:not(.badge),
label:has(>input.pc-toggle-input[type="checkbox"]):has(>small)>b,
label:has(>input.pc-toggle-input[type="checkbox"]):has(>small)>strong,
label:has(>input.pc-toggle-input[type="checkbox"]):has(>small)>span:not(.badge){grid-column:2!important}
label.pc-toggle-label.pc-toggle-complex>small,
label:has(>input.pc-toggle-input[type="checkbox"]):has(>small)>small{
  grid-column:2!important;margin:1px 0 0!important;color:var(--pc-ui-muted)!important;font-weight:500!important;line-height:1.4!important;
}

/* ---------- Checkbox real ---------- */
input.pc-check-input[type="checkbox"]{
  -webkit-appearance:auto!important;
  appearance:auto!important;
  display:inline-block!important;
  visibility:visible!important;
  position:static!important;
  opacity:1!important;
  pointer-events:auto!important;
  width:18px!important;
  min-width:18px!important;
  max-width:18px!important;
  height:18px!important;
  min-height:18px!important;
  margin:0 7px 0 0!important;
  padding:0!important;
  border-radius:4px!important;
  accent-color:var(--pc-ui-orange)!important;
  cursor:pointer!important;
  vertical-align:-3px!important;
  box-shadow:none!important;
}
input.pc-check-input[type="checkbox"]:focus-visible{outline:2px solid rgba(245,107,22,.32);outline-offset:2px}

/* ---------- Tarjetas de ajustes ---------- */
.pc-setting-row{
  display:flex!important;
  align-items:center!important;
  gap:13px!important;
  width:100%!important;
  border:1px solid var(--pc-ui-orange-line)!important;
  background:#FFF9F3!important;
  border-radius:15px!important;
  padding:13px 14px!important;
}
.pc-setting-row>label.switch,.pc-setting-row>input.pc-toggle-input{flex:0 0 52px!important}
.pc-setting-copy{flex:1!important;min-width:0!important}
.pc-setting-copy>b,.pc-setting-copy>strong,.pc-setting-copy>small{display:block!important}
.pc-setting-copy>b,.pc-setting-copy>strong{font-size:1rem!important;line-height:1.25!important;color:var(--pc-ui-text)!important}
.pc-setting-copy>small{margin-top:3px!important;color:var(--pc-ui-muted)!important;line-height:1.38!important;font-weight:500!important}

/* Opciones de catálogo: switch + título + ayuda. */
.catalog-toggle-grid label:has(>input.pc-toggle-input){
  display:grid!important;
  grid-template-columns:52px minmax(0,1fr)!important;
  gap:3px 10px!important;
  align-items:start!important;
}
.catalog-toggle-grid label:has(>input.pc-toggle-input)>input{grid-column:1!important;grid-row:1 / span 2!important}
.catalog-toggle-grid label:has(>input.pc-toggle-input)>b,
.catalog-toggle-grid label:has(>input.pc-toggle-input)>small{grid-column:2!important;margin-left:0!important}
.field>label.pc-toggle-label{margin-bottom:7px!important}
.formgrid>label.pc-toggle-label,.grid>label.pc-toggle-label,.grid2>label.pc-toggle-label,.grid3>label.pc-toggle-label{align-self:start}

/* ---------- Estados ---------- */
.badge-ok,.badge.b-active{background:#DCFCE7!important;color:#166534!important}
.badge-off{background:#F1F5F9!important;color:#475569!important}
#cpUpdateBar.pc-update-toast{font-family:inherit}

@media(max-width:640px){
  .btn,button.btn,a.btn{min-height:40px}
  .pc-setting-row{align-items:flex-start!important}
}