/* ROB RUN CLANS — brand controls: dropdown (.dd) + day/time picker (.wh). OD 16.11.2026 */

/* ---------- dropdown ---------- */
.dd{position:relative;min-width:0}
.dd-t{display:flex;align-items:center;gap:12px;width:100%;height:54px;padding:0 16px 0 14px;background:var(--ink);border:0;box-shadow:inset 0 0 0 1px var(--line2);color:#fff;cursor:pointer;text-align:left;font:600 16px/1.15 var(--fb);transition:box-shadow .15s}
.dd-t:hover{box-shadow:inset 0 0 0 1px var(--txt2)}
.dd-t:focus-visible,.dd.open .dd-t{outline:0;box-shadow:inset 0 0 0 2px var(--acc)}
.dd-v{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dd-v small{margin-left:10px;font:500 12px/1 var(--fm);color:var(--mute)}
.dd-v.dd-ph{color:var(--mute)}
.dd-ic{flex:none;display:grid;place-items:center;width:32px;height:32px;background:var(--p3);font-size:17px;transform:skewX(-8deg)}
.dd-ch{flex:none;width:9px;height:9px;margin-top:-5px;border-right:2px solid var(--acc);border-bottom:2px solid var(--acc);transform:rotate(45deg);transition:transform .2s}
.dd.open .dd-ch{transform:rotate(225deg);margin-top:5px}
.dd-p{position:absolute;z-index:60;left:0;right:0;top:calc(100% + 6px);min-width:260px;background:var(--p1);box-shadow:inset 0 0 0 1px var(--line2),inset 0 4px 0 var(--acc),0 24px 50px rgba(0,0,0,.6);animation:ddin .16s ease-out}
.dd-s{display:flex;align-items:center;gap:10px;height:48px;margin:12px 12px 6px;padding:0 12px;background:var(--ink);box-shadow:inset 0 0 0 1px var(--line2);color:var(--mute)}
.dd-s:focus-within{box-shadow:inset 0 0 0 2px var(--acc);color:var(--acc)}
.dd-q{flex:1;min-width:0;height:100%;background:none;border:0;color:#fff;font:600 16px var(--fb);outline:0}
.dd-q::placeholder{color:var(--mute2)}
.dd-l{list-style:none;margin:0;padding:6px;max-height:330px;overflow:auto;overscroll-behavior:contain;outline:0;scrollbar-width:thin}
.dd-g{padding:12px 10px 6px;font:700 11px/1 var(--fm);letter-spacing:.16em;text-transform:uppercase;color:var(--acc)}
.dd-o{display:flex;align-items:center;gap:12px;min-height:46px;padding:6px 10px;cursor:pointer;color:var(--txt2)}
.dd-o .dd-ic{width:28px;height:28px;font-size:15px}
.dd-ot{display:flex;flex-direction:column;gap:3px;min-width:0}
.dd-ot b{font:700 15px/1.15 var(--fb);color:#fff;overflow-wrap:anywhere}
.dd-ot small{font:500 11px/1 var(--fm);color:var(--mute)}
.dd-o:hover{background:var(--p2)}
.dd-o.on{background:var(--p3);box-shadow:inset 3px 0 0 var(--acc)}
.dd-o[aria-selected="true"] b{color:var(--acc)}
.dd-o[aria-selected="true"]::after{content:"✓";margin-left:auto;font:900 18px/1 var(--fd);color:var(--acc)}
.dd-none{padding:18px 10px;text-align:center;color:var(--mute)}
/* small variant (board sort) */
.dd-sm .dd-t{height:44px;padding:0 14px 0 12px;font:800 16px/1 var(--fd);letter-spacing:.07em;text-transform:uppercase;box-shadow:inset 0 0 0 1px var(--line)}
.dd-sm .dd-p{min-width:220px;left:auto}
.dd-sm .dd-ot b{font:800 16px/1 var(--fd);letter-spacing:.06em;text-transform:uppercase}
.dd-sm .dd-o{min-height:42px}

/* ---------- day + time ---------- */
.wh{min-width:0;display:flex;flex-direction:column;gap:10px;padding:12px;background:var(--ink);box-shadow:inset 0 0 0 1px var(--line2);outline:0}
.wh[aria-invalid="true"]{box-shadow:inset 0 0 0 2px var(--mag)}
.wh-in{display:contents}
.wh-d{display:flex;gap:4px;overflow-x:auto;scrollbar-width:none;padding:2px;-webkit-mask-image:linear-gradient(90deg,#000 90%,transparent);mask-image:linear-gradient(90deg,#000 90%,transparent);padding-right:30px}
.wh-d::-webkit-scrollbar{display:none}
.wh-dc{flex:none;display:flex;flex-direction:column;align-items:center;gap:4px;width:62px;padding:9px 0 8px;border:0;background:var(--p2);color:var(--txt2);cursor:pointer;transition:transform .1s}
.wh-dc small{font:700 10px/1 var(--fm);letter-spacing:.1em;text-transform:uppercase}
.wh-dc b{font:900 28px/.9 var(--fs);color:#fff}
.wh-dc.we small:first-child{color:#FF6FB0}
.wh-dc:hover{background:var(--p3)}
.wh-dc:active{transform:scale(.95)}
.wh-dc[aria-checked="true"]{background:var(--acc);color:var(--acc-ink);transform:skewX(-6deg)}
.wh-dc[aria-checked="true"] b,.wh-dc[aria-checked="true"] small{color:var(--acc-ink)}
.wh-dc:focus-visible,.wh-qc:focus-visible,.wh-clk button:focus-visible{outline:2px solid #fff;outline-offset:2px}
.wh-t{display:flex;flex-wrap:wrap;align-items:center;gap:10px}
.wh-clk{display:flex;align-items:center;background:var(--p2)}
.wh-clk button{width:46px;height:56px;border:0;background:none;color:#fff;font:900 28px/1 var(--fd);cursor:pointer;touch-action:manipulation}
.wh-clk button:hover{background:var(--p3);color:var(--acc)}
.wh-clk button:active{transform:scale(.9)}
.wh-clk output{min-width:104px;text-align:center;font:900 44px/1 var(--fs);color:var(--acc);font-variant-numeric:tabular-nums;letter-spacing:.02em}
.wh-q{display:flex;flex-wrap:wrap;gap:4px;flex:1;min-width:0}
.wh-qc{height:36px;padding:0 11px;border:0;background:var(--p2);color:var(--txt2);cursor:pointer;font:700 14px/1 var(--fm)}
.wh-qc:hover:not([disabled]){background:var(--p3);color:#fff}
.wh-qc[aria-pressed="true"]{background:#fff;color:#121211}
.wh-qc.soon{font:800 14px/1 var(--fd);letter-spacing:.08em;text-transform:uppercase;background:transparent;box-shadow:inset 0 0 0 1px var(--acc);color:var(--acc)}
.wh-qc.soon:hover{background:var(--acc);color:var(--acc-ink)}
.wh-qc[disabled]{opacity:.3;cursor:not-allowed;text-decoration:line-through}
.wh-sum{margin:0;padding-top:10px;border-top:1px solid var(--line);font:500 13px/1.4 var(--fm);color:var(--mute)}
.wh-sum b{color:#fff;font-weight:700}
.wh-sum span{color:var(--acc)}
.wh-sum.bad{color:#FF6FB0}

@keyframes ddin{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.dd-p{animation:none}.wh-dc[aria-checked="true"]{transform:none}}
@media (max-width:720px){
  .dd-p{position:fixed;left:8px;right:8px;top:auto;bottom:8px;min-width:0;max-height:75vh;display:flex;flex-direction:column}
  .dd-p[hidden]{display:none}
  .dd-l{max-height:none;flex:1}
  .dd-sm .dd-p{left:8px}
  .wh{padding:10px}
  .wh-dc{width:56px}
  .wh-clk output{font-size:38px;min-width:92px}
  .wh-q{flex-basis:100%}
}
