/* Nordic Homebase — Nordic Form System v1.0
   Build 008F.2 · Custom Date & Time Picker
   Continue and expand. Never redesign. */

.nordic-picker-field{cursor:pointer;caret-color:transparent}
.nordic-picker-field:focus{cursor:pointer}

.nordic-picker-backdrop{
  position:fixed;inset:0;z-index:1200;display:grid;place-items:center;padding:20px;
  background:rgba(3,11,14,.54);backdrop-filter:blur(12px) saturate(115%);
  -webkit-backdrop-filter:blur(12px) saturate(115%);
  opacity:0;pointer-events:none;transition:opacity .18s ease;
}
.nordic-picker-backdrop.open{opacity:1;pointer-events:auto}
.nordic-picker{
  width:min(440px,calc(100vw - 28px));max-height:min(720px,calc(100vh - 32px));overflow:auto;
  border:1px solid color-mix(in srgb,var(--accent) 26%,var(--line));border-radius:24px;
  background:linear-gradient(145deg,color-mix(in srgb,var(--solid) 92%,transparent),color-mix(in srgb,var(--panel) 86%,transparent));
  box-shadow:0 28px 80px rgba(0,0,0,.34),inset 0 1px 0 rgba(255,255,255,.12);
  transform:translateY(10px) scale(.985);transition:transform .18s ease;
}
.nordic-picker-backdrop.open .nordic-picker{transform:none}
.nordic-picker-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:18px 18px 12px}
.nordic-picker-title{margin:0;font-size:1.12rem}
.nordic-picker-close{display:grid;place-items:center;width:36px;height:36px;border-radius:12px;border:1px solid var(--line);background:color-mix(in srgb,var(--solid) 72%,transparent);color:var(--text);font-size:1.3rem;cursor:pointer}
.nordic-picker-body{padding:0 18px 18px}
.nordic-picker-toolbar{display:grid;grid-template-columns:42px 1fr 42px;align-items:center;gap:8px;margin-bottom:12px}
.nordic-picker-toolbar button,.nordic-picker-chip,.nordic-time-option{
  border:1px solid var(--line);background:color-mix(in srgb,var(--solid) 72%,transparent);color:var(--text);cursor:pointer;
  transition:border-color .15s ease,background .15s ease,transform .15s ease,box-shadow .15s ease;
}
.nordic-picker-toolbar button:hover,.nordic-picker-chip:hover,.nordic-time-option:hover{border-color:color-mix(in srgb,var(--accent) 52%,var(--line));background:color-mix(in srgb,var(--accent) 9%,var(--solid));transform:translateY(-1px)}
.nordic-picker-nav{width:42px;height:42px;border-radius:13px;font-size:1.35rem}
.nordic-picker-month{font-weight:750;text-align:center;text-transform:capitalize}
.nordic-picker-weekdays,.nordic-picker-days{display:grid;grid-template-columns:repeat(7,1fr);gap:6px}
.nordic-picker-weekdays{margin-bottom:6px}
.nordic-picker-weekdays span{padding:6px 0;text-align:center;color:var(--muted);font-size:.72rem;font-weight:700;text-transform:uppercase}
.nordic-picker-day{aspect-ratio:1;border:1px solid transparent;border-radius:12px;background:transparent;color:var(--text);cursor:pointer;font-weight:650}
.nordic-picker-day:hover{border-color:color-mix(in srgb,var(--accent) 42%,var(--line));background:color-mix(in srgb,var(--accent) 9%,transparent)}
.nordic-picker-day.outside{opacity:.34}
.nordic-picker-day.today{box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--accent) 56%,transparent)}
.nordic-picker-day.selected{background:var(--accent);color:white;box-shadow:0 8px 20px color-mix(in srgb,var(--accent) 28%,transparent)}
.nordic-picker-actions{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:16px;padding-top:14px;border-top:1px solid var(--line)}
.nordic-picker-actions-group{display:flex;gap:8px;flex-wrap:wrap}
.nordic-picker-chip{min-height:38px;padding:8px 12px;border-radius:12px;font-weight:650}
.nordic-picker-chip.primary{background:var(--accent);border-color:transparent;color:white}
.nordic-time-shell{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.nordic-time-column{min-width:0}
.nordic-time-column h4{margin:0 0 8px;color:var(--muted);font-size:.76rem;text-transform:uppercase;letter-spacing:.08em}
.nordic-time-options{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;max-height:310px;overflow:auto;padding-right:3px}
.nordic-time-option{min-height:42px;border-radius:11px;font-weight:700}
.nordic-time-option.selected{background:var(--accent);border-color:transparent;color:white;box-shadow:0 8px 18px color-mix(in srgb,var(--accent) 24%,transparent)}
.nordic-picker-value{padding:13px 14px;margin-bottom:14px;border:1px solid color-mix(in srgb,var(--accent) 22%,var(--line));border-radius:15px;background:color-mix(in srgb,var(--accent) 7%,var(--solid));text-align:center;font-size:1.35rem;font-weight:800;letter-spacing:.04em}

@media(max-width:520px){
  .nordic-picker-backdrop{padding:0;align-items:end}
  .nordic-picker{width:100%;max-height:88vh;border-radius:24px 24px 0 0}
  .nordic-picker-days{gap:3px}
  .nordic-time-options{grid-template-columns:repeat(2,1fr)}
}
@media(prefers-reduced-motion:reduce){.nordic-picker-backdrop,.nordic-picker{transition:none}}