/*
 * datetime-field.css — styles for the shared admin date/datetime picker (PMDate).
 * Self-contained: does not rely on Tailwind utility classes so it can't break if
 * the utility layer changes. Light/dark via html.dark.
 */
.pmdt-root{
  --pmdt-card:#ffffff; --pmdt-card2:#f8fafc; --pmdt-border:#e2e8f0; --pmdt-border2:#cbd5e1;
  --pmdt-text:#0f172a; --pmdt-muted:#64748b; --pmdt-faint:#94a3b8;
  --pmdt-accent:#4f46e5; --pmdt-accent-ink:#ffffff; --pmdt-accent-weak:#eef2ff; --pmdt-accent-line:#c7d2fe;
  --pmdt-mono:ui-monospace,"SF Mono","Cascadia Mono",Menlo,Consolas,monospace;
  --pmdt-shadow:0 16px 40px rgba(2,6,23,.24);
}
html.dark .pmdt-root{
  --pmdt-card:#0f172a; --pmdt-card2:#131c2e; --pmdt-border:#243044; --pmdt-border2:#334155;
  --pmdt-text:#e6edf6; --pmdt-muted:#93a1b5; --pmdt-faint:#64748b;
  --pmdt-accent:#818cf8; --pmdt-accent-ink:#0b1120; --pmdt-accent-weak:#1c1e3a; --pmdt-accent-line:#3730a3;
  --pmdt-shadow:0 16px 40px rgba(0,0,0,.5);
}

/* keep the native input in the DOM (form-serialized) but out of view */
.pmdt-native{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;
  overflow:hidden!important;clip:rect(0 0 0 0)!important;white-space:nowrap!important;border:0!important}

.pmdt-root{position:relative;display:block;font-family:inherit}
.pmdt-trigger{width:100%;text-align:left;font:inherit;font-size:14px;color:var(--pmdt-text);
  background:var(--pmdt-card);border:1px solid var(--pmdt-border2);border-radius:10px;padding:9px 12px;cursor:pointer;
  display:flex;align-items:center;justify-content:space-between;gap:10px}
.pmdt-trigger:hover{border-color:var(--pmdt-accent)}
.pmdt-trigger:focus-visible{outline:2px solid var(--pmdt-accent);outline-offset:1px}
.pmdt-trigger .pmdt-val{font-family:var(--pmdt-mono);font-variant-numeric:tabular-nums}
.pmdt-trigger.pmdt-empty .pmdt-val{color:var(--pmdt-faint);font-family:inherit}
.pmdt-trigger .pmdt-ico{color:var(--pmdt-faint);flex:none}

.pmdt-pop{position:absolute;z-index:60;top:calc(100% + 8px);left:0;width:300px;max-width:92vw;
  background:var(--pmdt-card);border:1px solid var(--pmdt-border2);border-radius:14px;box-shadow:var(--pmdt-shadow);
  padding:14px;display:none}
.pmdt-root.pmdt-open .pmdt-pop{display:block}
.pmdt-pop.pmdt-up{top:auto;bottom:calc(100% + 8px)}
.pmdt-pop.pmdt-right{left:auto;right:0}

.pmdt-quick{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:12px}
.pmdt-quick button{font:inherit;font-size:12px;font-weight:600;padding:5px 9px;border-radius:8px;
  border:1px solid var(--pmdt-border);background:var(--pmdt-card2);color:var(--pmdt-muted);cursor:pointer}
.pmdt-quick button:hover{border-color:var(--pmdt-accent);color:var(--pmdt-accent)}

.pmdt-cal-h{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}
.pmdt-cal-h .pmdt-m{font-weight:700;font-size:14px;color:var(--pmdt-text)}
.pmdt-cal-h button{border:0;background:none;color:var(--pmdt-muted);cursor:pointer;font-size:17px;padding:2px 9px;border-radius:6px;line-height:1}
.pmdt-cal-h button:hover{background:var(--pmdt-card2);color:var(--pmdt-text)}
.pmdt-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:2px}
.pmdt-grid .pmdt-dow{font-size:10px;text-transform:uppercase;letter-spacing:.05em;color:var(--pmdt-faint);text-align:center;font-weight:700;padding:4px 0}
.pmdt-grid .pmdt-day{font:inherit;font-size:13px;border:0;background:none;color:var(--pmdt-text);padding:6px 0;border-radius:8px;cursor:pointer;font-variant-numeric:tabular-nums}
.pmdt-grid .pmdt-day:hover{background:var(--pmdt-accent-weak);color:var(--pmdt-accent)}
.pmdt-grid .pmdt-day.pmdt-sel{background:var(--pmdt-accent);color:var(--pmdt-accent-ink);font-weight:700}
.pmdt-grid .pmdt-day.pmdt-out{color:var(--pmdt-faint);opacity:.5}
.pmdt-grid .pmdt-day.pmdt-today{box-shadow:inset 0 0 0 1px var(--pmdt-accent-line)}

/* time control */
.pmdt-time{margin-top:14px;padding-top:14px;border-top:1px solid var(--pmdt-border);display:flex;align-items:center;justify-content:center;gap:6px}
.pmdt-stack{display:flex;flex-direction:column;align-items:center;gap:5px}
.pmdt-chev{border:1px solid var(--pmdt-border2);background:var(--pmdt-card);color:var(--pmdt-muted);width:62px;height:22px;border-radius:8px;cursor:pointer;font-size:11px;display:flex;align-items:center;justify-content:center;flex:none;padding:0}
.pmdt-chev:hover{border-color:var(--pmdt-accent);color:var(--pmdt-accent);background:var(--pmdt-accent-weak)}
.pmdt-chev:active{background:var(--pmdt-accent);color:var(--pmdt-accent-ink)}
.pmdt-seg{position:relative;width:70px;height:92px;border:1px solid var(--pmdt-border2);border-radius:14px;background:var(--pmdt-card2);
  overflow:hidden;touch-action:none;-webkit-user-select:none;user-select:none;cursor:grab}
.pmdt-seg:active{cursor:grabbing}
.pmdt-seg.pmdt-drag{border-color:var(--pmdt-accent);box-shadow:0 0 0 3px var(--pmdt-accent-weak)}
.pmdt-band{position:absolute;left:7px;right:7px;top:31px;height:30px;border-radius:8px;background:var(--pmdt-accent-weak);opacity:.55;pointer-events:none}
.pmdt-ghost{position:absolute;left:0;right:0;text-align:center;font-family:var(--pmdt-mono);font-variant-numeric:tabular-nums;font-size:15px;color:var(--pmdt-faint);opacity:.5;pointer-events:none}
.pmdt-ghost.pmdt-up{top:8px}.pmdt-ghost.pmdt-dn{bottom:8px}
.pmdt-num{position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);width:100%;text-align:center;border:0;background:none;
  font-family:var(--pmdt-mono);font-variant-numeric:tabular-nums;font-size:34px;font-weight:750;color:var(--pmdt-text);padding:0;-moz-appearance:textfield}
.pmdt-num::-webkit-outer-spin-button,.pmdt-num::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.pmdt-num:focus{outline:none;color:var(--pmdt-accent)}
.pmdt-colon{font-size:30px;font-weight:750;color:var(--pmdt-faint);align-self:center}
.pmdt-ampm{display:flex;flex-direction:column;gap:5px;margin-left:3px}
.pmdt-ampm button{width:46px;padding:11px 0;border:1px solid var(--pmdt-border2);background:var(--pmdt-card);color:var(--pmdt-muted);
  font:inherit;font-weight:700;font-size:12px;font-family:var(--pmdt-mono);border-radius:10px;cursor:pointer}
.pmdt-ampm button.pmdt-on{background:var(--pmdt-accent);border-color:var(--pmdt-accent);color:var(--pmdt-accent-ink)}
.pmdt-ampm button:not(.pmdt-on):hover{border-color:var(--pmdt-accent);color:var(--pmdt-accent)}
.pmdt-snaps{display:flex;gap:6px;justify-content:center;margin-top:12px}
.pmdt-snaps button{font:inherit;font-size:12px;font-weight:600;padding:5px 10px;border-radius:8px;border:1px solid var(--pmdt-border);background:var(--pmdt-card);color:var(--pmdt-muted);cursor:pointer}
.pmdt-snaps button:hover{border-color:var(--pmdt-accent);color:var(--pmdt-accent)}

.pmdt-foot{display:flex;justify-content:space-between;align-items:center;margin-top:14px;padding-top:12px;border-top:1px solid var(--pmdt-border)}
.pmdt-tz{font-size:11px;color:var(--pmdt-faint)}
.pmdt-clear{font:inherit;font-size:12px;font-weight:600;color:var(--pmdt-muted);background:none;border:0;cursor:pointer;padding:2px 4px}
.pmdt-clear:hover{color:var(--pmdt-accent)}
.pmdt-done{font:inherit;font-size:12.5px;font-weight:700;color:var(--pmdt-accent-ink);background:var(--pmdt-accent);border:1px solid var(--pmdt-accent);border-radius:8px;padding:6px 14px;cursor:pointer}

@media (prefers-reduced-motion:reduce){.pmdt-root *{transition:none!important}}
