/* Optional date picker. Native input remains visible and validatable. */
@layer components {
  .r-calendar-field {display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:calc(.5rem * var(--r-density));}
  .r-calendar-field>.r-input {min-width:0;}
  .r-calendar-trigger {white-space:nowrap;font-size:calc(.875rem * var(--r-font-scale));}
  .r-calendar-dialog {width:min(440px,calc(100% - 2rem));max-height:calc(100dvh - 2rem);overflow:auto;border:1px solid var(--r-border);border-radius:var(--r-radius);padding:calc(1.5rem * var(--r-density));background:var(--r-surface);color:var(--r-text);box-shadow:0 1rem 4rem color-mix(in srgb,var(--r-text) 20%,transparent);}
  .r-calendar-dialog::backdrop {background:color-mix(in srgb,var(--r-text) 35%,transparent);}
  .r-calendar-dialog[open] {animation:r-scale var(--r-duration) var(--r-ease);}
  .r-calendar-title {font-size:calc(1.25rem * var(--r-font-scale));font-weight:600;margin:0;}
  .r-calendar-header {display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:calc(.75rem * var(--r-density));align-items:center;margin-block:calc(1rem * var(--r-density));}
  .r-calendar-month {text-align:center;font-size:calc(1rem * var(--r-font-scale));font-weight:600;margin:0;}
  .r-calendar-month-button {padding:calc(.25rem * var(--r-density)) calc(.65rem * var(--r-density));font-size:calc(1.5rem * var(--r-font-scale));line-height:1.1;}
  .r-calendar-grid {border-collapse:separate;border-spacing:calc(.2rem * var(--r-density));width:100%;table-layout:fixed;}
  .r-calendar-grid th {font-size:calc(.75rem * var(--r-font-scale));font-weight:500;color:var(--r-muted);text-align:center;padding-block:calc(.4rem * var(--r-density));}
  .r-calendar-grid td {padding:0;text-align:center;}
  .r-calendar-day {display:block;width:100%;min-height:calc(2rem * var(--r-font-scale));padding:calc(.4rem * var(--r-density)) calc(.1rem * var(--r-density));border:1px solid transparent;border-radius:var(--r-radius);background:transparent;color:var(--r-text);font-size:calc(.875rem * var(--r-font-scale));line-height:1.2;}
  .r-calendar-day[data-r-outside-month=true] {color:var(--r-muted);}
  .r-calendar-day:hover:not(:disabled) {background:var(--r-subtle);border-color:var(--r-border);}
  .r-calendar-grid [aria-selected=true]>.r-calendar-day {background:var(--r-accent);color:var(--r-on-accent);border-color:var(--r-accent);font-weight:600;}
  .r-calendar-day[aria-current=date] {text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:3px;}
  .r-calendar-day:disabled {opacity:.35;cursor:not-allowed;}
  .r-calendar-help {font-size:calc(.75rem * var(--r-font-scale));color:var(--r-muted);line-height:1.6;margin-block:calc(.75rem * var(--r-density));}
  .r-calendar-notice {font-size:calc(.875rem * var(--r-font-scale));color:var(--r-muted);margin-block:calc(.75rem * var(--r-density));}
  .r-calendar-notice:empty {display:none;}
  .r-calendar-actions {display:flex;align-items:center;flex-wrap:wrap;gap:calc(.5rem * var(--r-density));padding-block-start:calc(.75rem * var(--r-density));border-top:1px solid var(--r-border);}
  .r-calendar-actions .r-button {font-size:calc(.8rem * var(--r-font-scale));padding:calc(.5rem * var(--r-density)) calc(.75rem * var(--r-density));}
  .r-calendar-actions .r-button:last-child {margin-inline-start:auto;}
  @media(max-width:500px) {.r-calendar-field {grid-template-columns:1fr;}.r-calendar-trigger {justify-self:start;}}
  @media(prefers-reduced-motion:reduce) {.r-calendar-dialog[open] {animation:none;}}
}
