/* Controles propios de dosmesas: sustituyen a los del navegador (selectores, fechas, horas, colores, interruptores, casillas y diálogos).
   Funcionan con los temas del panel y del CMS (usan --solid, --ink, --accent, --line-2, --fill) y con la web pública. Las piezas se montan en ui.js. */

/* ---------- Botón de los campos propios (selector, fecha, hora, color) ---------- */
.pk{position:relative;display:block}.pk.is-auto{display:inline-block;min-width:150px;vertical-align:middle}
.pk-native{position:absolute!important;inset:0;width:100%;height:100%;opacity:0;pointer-events:none}
.pk-v{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;min-height:46px;padding:11px 14px;border:1px solid var(--line-2,rgba(28,25,21,.18));border-radius:var(--r,12px);background:var(--solid,#fffdf9);color:var(--ink,#1c1915);font:500 1rem/1.3 'Onest',var(--sans,system-ui),sans-serif;text-align:left;cursor:pointer;transition:border-color .2s,box-shadow .2s}
.pk-v>span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pk-v.is-empty{color:var(--muted,#7a7266)}
.pk-v::after{content:"";flex:none;width:7px;height:7px;margin:0 2px 3px 0;border-right:1.5px solid #8a8174;border-bottom:1.5px solid #8a8174;transform:rotate(45deg);transition:transform .25s}
.pk-v[aria-expanded=true]::after{transform:rotate(-135deg) translate(-2px,-2px)}
.pk.is-date .pk-v::after,.pk.is-time .pk-v::after,.pk.is-color .pk-v::after{display:none}
.pk-v:hover{border-color:#bdb2a0}.pk-v:focus-visible,.pk-v[aria-expanded=true]{outline:none;border-color:var(--accent,#b8341c);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent,#b8341c) 16%,transparent)}
.pk-v:disabled,.pk.is-off .pk-v{opacity:.5;cursor:not-allowed}
.pk-ic{flex:none;width:18px;height:18px;color:var(--muted,#7a7266);margin-right:-2px}.pk-ic+span{flex:1}
.pk-sw{flex:none;width:22px;height:22px;border-radius:7px;box-shadow:inset 0 0 0 1px rgba(0,0,0,.18)}

/* ---------- Ventana flotante (lista, calendario, reloj, color) ---------- */
.pk-pop{position:fixed;z-index:200;box-sizing:border-box;overflow:auto;padding:6px;border-radius:18px;background:var(--solid,#fffdf9);color:var(--ink,#1c1915);box-shadow:0 26px 56px -22px rgba(28,25,21,.5),0 0 0 1px rgba(28,25,21,.08);animation:pk-in .22s cubic-bezier(.2,.8,.2,1);scrollbar-width:thin;overscroll-behavior:contain;font:500 .98rem/1.3 'Onest',var(--sans,system-ui),sans-serif}
.pk-pop.is-up{animation-name:pk-in-up}
@keyframes pk-in{from{opacity:0;transform:translateY(-6px) scale(.985)}}@keyframes pk-in-up{from{opacity:0;transform:translateY(6px) scale(.985)}}
.pk-list{display:flex;flex-direction:column;gap:2px}
:where(.pk-pop) button{font:inherit;color:var(--ink,#1c1915);cursor:pointer}
.pk-opt{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;padding:12px 14px;border:0;border-radius:12px;background:none;text-align:left;transition:background .15s}
.pk-opt:hover,.pk-opt:focus-visible{background:var(--fill,#f4ede2);outline:none}
.pk-opt.is-on{background:color-mix(in srgb,var(--accent,#b8341c) 11%,transparent);color:var(--accent,#b8341c);font-weight:650}
.pk-opt.is-on::after{content:"";flex:none;width:6px;height:11px;margin-right:3px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg) translate(-2px,-2px)}
.pk-opt:disabled{opacity:.4;cursor:not-allowed}
.pk-cap{margin:8px 10px 2px;font:750 .66rem/1 'Onest',system-ui,sans-serif;letter-spacing:.09em;text-transform:uppercase;color:var(--muted,#7a7266)}
/* Móvil: calendario, reloj y color suben desde abajo como una hoja */
.pk-back{position:fixed;inset:0;z-index:199;background:rgba(28,25,21,.38);animation:pk-fade .2s}
@keyframes pk-fade{from{opacity:0}}
.pk-pop.is-sheet{left:0!important;right:0!important;top:auto!important;bottom:0!important;width:auto!important;max-height:86vh!important;border-radius:22px 22px 0 0;padding:10px 14px calc(14px + env(safe-area-inset-bottom));animation:pk-sheet .28s cubic-bezier(.2,.8,.2,1)}
@keyframes pk-sheet{from{transform:translateY(40px);opacity:0}}
.pk-grab{width:38px;height:4px;border-radius:4px;background:var(--line-2,rgba(28,25,21,.2));margin:0 auto 10px}
.pk-foot{display:flex;justify-content:space-between;gap:8px;padding:8px 4px 2px}
.pk-link{border:0;background:none;padding:8px 10px;border-radius:10px;color:var(--accent,#b8341c);font-weight:650}
.pk-link:hover{background:var(--fill,#f4ede2)}
.pk-btn{border:0;border-radius:12px;background:var(--ink,#1c1915);color:#fffdf9;padding:10px 18px;font-weight:650}

/* ---------- Calendario ---------- */
.pk-cal{width:300px;max-width:100%;margin:0 auto}
.pk-cal-h{display:flex;align-items:center;justify-content:space-between;gap:4px;margin:2px 0 8px}
.pk-cal-t{flex:1;border:0;background:none;border-radius:10px;padding:8px;font:600 1.02rem/1 var(--serif,Georgia,serif);text-align:center;text-transform:capitalize}
.pk-cal-t:hover{background:var(--fill,#f4ede2)}
.pk-nav{display:grid;place-items:center;width:36px;height:36px;border:0;border-radius:50%;background:var(--fill,#f4ede2);transition:background .15s}
.pk-nav:hover{background:var(--fill-2,#ebe1d1)}.pk-nav:disabled{opacity:.3;cursor:default}
.pk-nav svg{width:16px;height:16px}.pk-nav.is-prev svg{transform:rotate(180deg)}
.pk-cal-w,.pk-cal-g{display:grid;grid-template-columns:repeat(7,1fr);gap:2px;text-align:center}
.pk-cal-w span{padding:4px 0;font:700 .68rem/1 'Onest',system-ui,sans-serif;letter-spacing:.06em;text-transform:uppercase;color:var(--muted,#7a7266)}
.pk-day{aspect-ratio:1;width:100%;max-width:40px;justify-self:center;border:0;border-radius:50%;background:none;font-size:.92rem;font-variant-numeric:tabular-nums;transition:background .15s,color .15s}
.pk-day:hover:not(:disabled),.pk-day:focus-visible{background:var(--fill,#f4ede2);outline:none}
.pk-day.is-today{box-shadow:inset 0 0 0 1.5px var(--accent,#b8341c);color:var(--accent,#b8341c);font-weight:700}
.pk-day.is-on{background:var(--accent,#b8341c);color:#fff;box-shadow:none}
.pk-day:disabled{color:#c9c0b2;cursor:default}
.pk-day.is-out{opacity:.35}
.pk-grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;padding:4px}
.pk-cell{padding:12px 0;border:0;border-radius:12px;background:var(--fill,#f4ede2);font-weight:600;text-transform:capitalize;transition:background .15s,color .15s}
.pk-cell:hover{background:var(--fill-2,#ebe1d1)}.pk-cell.is-on{background:var(--accent,#b8341c);color:#fff}.pk-cell:disabled{opacity:.35;cursor:default}

/* ---------- Reloj: horas y minutos ---------- */
.pk-time{width:300px;max-width:100%;margin:0 auto}
.pk-time-v{margin:2px 0 6px;text-align:center;font:600 2rem/1.1 var(--serif,Georgia,serif);font-variant-numeric:tabular-nums}
.pk-time-g{display:grid;gap:6px;padding:2px 4px 6px}.pk-time-g.is-h{grid-template-columns:repeat(6,1fr)}.pk-time-g.is-m{grid-template-columns:repeat(6,1fr)}
.pk-tc{padding:10px 0;border:0;border-radius:11px;background:var(--fill,#f4ede2);font-weight:600;font-variant-numeric:tabular-nums;transition:background .15s,color .15s}
.pk-tc:hover{background:var(--fill-2,#ebe1d1)}.pk-tc.is-on{background:var(--accent,#b8341c);color:#fff}
.pk-dt{display:grid;gap:8px}
@media (min-width:700px){.pk-dt.is-wide{width:620px;grid-template-columns:auto auto}.pk-dt.is-wide .pk-time{border-left:1px solid var(--line-2,rgba(28,25,21,.12));padding-left:14px}}

/* ---------- Color ---------- */
.pk-col{width:290px;max-width:100%;margin:0 auto}
.pk-sv{position:relative;height:160px;border-radius:14px;touch-action:none;cursor:crosshair;background:linear-gradient(to top,#000,transparent),linear-gradient(to right,#fff,hsl(var(--h,0),100%,50%))}
.pk-hue{position:relative;height:14px;margin:12px 2px 4px;border-radius:99px;touch-action:none;cursor:pointer;background:linear-gradient(to right,#f00,#ff0,#0f0,#0ff,#00f,#f0f,#f00)}
.pk-knob{position:absolute;width:20px;height:20px;margin:-10px 0 0 -10px;border-radius:50%;border:3px solid #fff;box-shadow:0 0 0 1px rgba(0,0,0,.3),0 2px 6px rgba(0,0,0,.3);pointer-events:none}
.pk-hue .pk-knob{top:50%}
.pk-hex{display:flex;align-items:center;gap:10px;margin:10px 2px 6px}
.pk-hex .pk-sw{width:36px;height:36px;border-radius:10px}
.pk-hex input{flex:1;min-width:0;padding:10px 12px;border:1px solid var(--line-2,rgba(28,25,21,.18));border-radius:11px;background:var(--solid,#fffdf9);color:var(--ink,#1c1915);font:600 1rem/1 ui-monospace,Menlo,monospace;text-transform:uppercase}
.pk-sws{display:grid;grid-template-columns:repeat(8,1fr);gap:7px;margin:10px 2px 4px}
.pk-swb{aspect-ratio:1;border:0;border-radius:9px;box-shadow:inset 0 0 0 1px rgba(0,0,0,.18);transition:transform .15s}
.pk-swb:hover{transform:scale(1.12)}.pk-swb.is-on{box-shadow:0 0 0 2px var(--solid,#fff),0 0 0 4px var(--ink,#1c1915)}

/* ---------- Diálogo de confirmación y de aviso ---------- */
.pk-dlg-b{position:fixed;inset:0;z-index:300;display:grid;place-items:center;padding:20px;background:rgba(28,25,21,.45);animation:pk-fade .18s}
.pk-dlg{width:min(380px,100%);box-sizing:border-box;padding:24px 22px 18px;border-radius:22px;background:var(--solid,#fffdf9);color:var(--ink,#1c1915);box-shadow:0 30px 70px -20px rgba(28,25,21,.6);animation:pk-in .22s cubic-bezier(.2,.8,.2,1);font:500 1rem/1.45 'Onest',var(--sans,system-ui),sans-serif}
.pk-dlg p{margin:0 0 18px;font-size:1.05rem}.pk-dlg code{display:block;margin:0 0 16px;padding:10px;border-radius:10px;background:var(--fill,#f4ede2);word-break:break-all;font-size:.85rem}
.pk-dlg-a{display:flex;justify-content:flex-end;gap:8px}
.pk-dlg-a button{padding:11px 18px;border:0;border-radius:12px;font:650 .96rem/1 'Onest',system-ui,sans-serif;cursor:pointer}
.pk-dlg-a .is-no{background:var(--fill,#f4ede2);color:var(--ink,#1c1915)}.pk-dlg-a .is-yes{background:var(--ink,#1c1915);color:#fffdf9}
.pk-dlg-a button:focus-visible{outline:2px solid var(--accent,#b8341c);outline-offset:2px}

/* ---------- Interruptores y casillas (en lugar de los de iOS) ---------- */
.app .check input[type=checkbox],.adm .check input[type=checkbox],.app .pb-item input[type=checkbox],.app td>input[type=checkbox],.switch input,.check.is-sw input[type=checkbox]{-webkit-appearance:none;appearance:none;box-sizing:border-box;flex:none;width:42px;min-width:42px;height:24px;min-height:24px;max-height:24px;padding:0;border:0;margin:0;border-radius:9px;background:var(--fill-2,#e6dece);box-shadow:inset 0 0 0 1.5px var(--line-2,rgba(28,25,21,.2));position:relative;cursor:pointer;transition:background-color .22s,box-shadow .22s}
.app .check input[type=checkbox]::after,.adm .check input[type=checkbox]::after,.app .pb-item input[type=checkbox]::after,.app td>input[type=checkbox]::after,.switch input::after,.check.is-sw input[type=checkbox]::after{content:"";position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:6px;background:#fffdf9;box-shadow:0 1px 2px rgba(28,25,21,.3),0 0 0 .5px rgba(28,25,21,.12);transition:transform .24s cubic-bezier(.2,.8,.2,1)}
.app .check input[type=checkbox]:checked,.adm .check input[type=checkbox]:checked,.app .pb-item input[type=checkbox]:checked,.app td>input[type=checkbox]:checked,.switch input:checked,.check.is-sw input[type=checkbox]:checked{background:var(--ink,#1c1915);box-shadow:inset 0 0 0 1.5px var(--ink,#1c1915)}
.app .check input[type=checkbox]:checked::after,.adm .check input[type=checkbox]:checked::after,.app .pb-item input[type=checkbox]:checked::after,.app td>input[type=checkbox]:checked::after,.switch input:checked::after,.check.is-sw input[type=checkbox]:checked::after{transform:translateX(18px)}
.app .check input[type=checkbox]:focus-visible,.adm .check input[type=checkbox]:focus-visible,.app .pb-item input[type=checkbox]:focus-visible,.app td>input[type=checkbox]:focus-visible,.switch input:focus-visible{outline:2px solid var(--accent,#b8341c);outline-offset:2px}
.app .check input[type=checkbox]:disabled,.adm .check input[type=checkbox]:disabled,.app .pb-item input[type=checkbox]:disabled,.app td>input[type=checkbox]:disabled,.switch input:disabled{opacity:.4;cursor:not-allowed}
/* Casillas y botones de opción de los formularios (web pública, club, demo…) */
.check input[type=checkbox]:not(.app .check input):not(.adm .check input):not(.app .pb-item input),.pb-item input[type=checkbox]:not(.app .pb-item input),.field input[type=checkbox]:not(.app .check input):not(.adm .check input):not(.app .pb-item input):not(.switch input):not(.app td>input),.field input[type=radio],.check input[type=radio]{-webkit-appearance:none;appearance:none;flex:none;width:21px;height:21px;margin:1px 0 0;border:1.5px solid var(--line-2,rgba(28,25,21,.35));border-radius:7px;background:var(--solid,#fffdf9);position:relative;cursor:pointer;transition:background-color .18s,border-color .18s}
.check input[type=radio],.field input[type=radio]{border-radius:50%}
.check input[type=checkbox]:not(.app .check input):not(.adm .check input):not(.app .pb-item input):checked,.pb-item input[type=checkbox]:not(.app .pb-item input):checked,.field input[type=checkbox]:not(.app .check input):not(.adm .check input):not(.app .pb-item input):not(.switch input):not(.app td>input):checked{background:var(--ink,#1c1915);border-color:var(--ink,#1c1915)}
.check input[type=checkbox]:not(.app .check input):not(.adm .check input):not(.app .pb-item input):checked::after,.pb-item input[type=checkbox]:not(.app .pb-item input):checked::after,.field input[type=checkbox]:not(.app .check input):not(.adm .check input):not(.app .pb-item input):not(.switch input):not(.app td>input):checked::after{content:"";position:absolute;left:6px;top:2.5px;width:5px;height:10px;border:solid #fffdf9;border-width:0 2px 2px 0;transform:rotate(45deg)}
.check input[type=radio]:checked,.field input[type=radio]:checked{border-color:var(--ink,#1c1915);background:radial-gradient(circle,var(--ink,#1c1915) 0 4.5px,transparent 5.5px)}
.check input[type=checkbox]:not(.app .check input):not(.adm .check input):not(.app .pb-item input):focus-visible,.pb-item input[type=checkbox]:not(.app .pb-item input):focus-visible,.field input[type=checkbox]:not(.app .check input):not(.adm .check input):not(.app .pb-item input):not(.switch input):not(.app td>input):focus-visible,.field input[type=radio]:focus-visible,.check input[type=radio]:focus-visible{outline:2px solid var(--accent,#b8341c);outline-offset:2px}
input[type=file]::file-selector-button{border:0;border-radius:9px;background:var(--ink,#1c1915);color:#fffdf9;font:600 .85rem 'Onest',system-ui,sans-serif;padding:7px 13px;margin-right:10px;cursor:pointer}
@media (prefers-reduced-motion:reduce){.pk-pop,.pk-dlg,.pk-dlg-b,.pk-back{animation:none}.pk-v::after,.pk-v{transition:none}}

/* ---------- Contraseña con ojo para mostrarla ---------- */
.site-pw{position:relative}.site-pw input{padding-right:46px}
.site-pw-t{position:absolute;right:4px;top:50%;transform:translateY(-50%);display:grid;place-items:center;width:38px;height:38px;min-height:0;padding:0;border:0;border-radius:10px;background:none;color:var(--muted,#7a7266);cursor:pointer}
.site-pw-t:hover{color:var(--ink,#1c1915);background:rgba(28,25,21,.05)}.site-pw-t:focus-visible{outline:2px solid var(--accent,#b8341c);outline-offset:1px}
.site-pw-t svg{width:19px;height:19px}.site-pw-t .is-hide,.site-pw-t[aria-pressed=true] .is-show{display:none}.site-pw-t[aria-pressed=true] .is-hide{display:inline}

/* Campos numéricos y de búsqueda sin los controles del navegador */
input[type=number]{-moz-appearance:textfield;appearance:textfield}
input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration{-webkit-appearance:none;appearance:none}

/* Con hidden, estos avisos no se ven (un .notice oculto se veía como una cápsula vacía) */
.notice[hidden],.bk-dep[hidden],.err[hidden]{display:none}
#bk-done h2{display:flex;align-items:center;font-size:1.05rem;margin-bottom:14px}
#bk-done h2 span{display:inline-grid;place-items:center;flex:none;width:26px;height:26px;border-radius:50%;background:var(--ok,#15692c);color:#fff;margin-right:10px}
#bk-done h2 span svg{width:15px;height:15px;stroke-width:2.6}
