/* daterange.css — HubSpot-style date range picker, ported from the ads dashboard.
   Same file in every dashboard; each page maps its own tokens onto the --dr-* vars.
   Defaults below are the ads dashboard's palette. */
.daterange{
  position:relative;text-transform:none;letter-spacing:normal;
  --_bg:var(--dr-bg,#142033); --_pop:var(--dr-pop,#18263c); --_line:var(--dr-line,#233247);
  --_ink:var(--dr-ink,#E8EDF4); --_muted:var(--dr-muted,#7C8BA3); --_faint:var(--dr-faint,#56657e);
  --_accent:var(--dr-accent,#F2A93B); --_on-ink:var(--dr-accent-ink,#1c1303); --_on-sub:var(--dr-accent-sub,#5c4410);
  --_mono:var(--dr-mono,"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace);
}
.dr-trigger{
  display:flex;align-items:center;gap:10px;min-width:236px;cursor:pointer;text-align:left;
  background:var(--_bg);color:var(--_ink);border:1px solid var(--_line);border-radius:9px;
  padding:8px 12px;font-family:inherit;font-size:13.5px;
}
.dr-trigger:hover{border-color:var(--_faint)}
.dr-trigger:focus-visible{outline:2px solid var(--_accent);outline-offset:1px}
.dr-trigger[aria-expanded="true"]{border-color:var(--_accent)}
.dr-label{font-weight:600;white-space:nowrap}
.dr-sub{color:var(--_muted);font-size:12px;font-family:var(--_mono);white-space:nowrap}
.dr-caret{margin-left:auto;color:var(--_muted);font-size:10px;transition:transform .18s ease}
.dr-trigger[aria-expanded="true"] .dr-caret{transform:rotate(180deg)}
.dr-pop{
  position:absolute;top:calc(100% + 8px);left:0;z-index:30;min-width:252px;
  background:var(--_pop);border:1px solid var(--_line);border-radius:12px;
  box-shadow:var(--dr-shadow,0 16px 40px -24px rgba(0,0,0,.8));padding:8px;
}
.dr-pop[hidden],.dr-custom[hidden],.dr-note[hidden]{display:none}
.dr-presets{display:flex;flex-direction:column;gap:1px}
.dr-presets button{
  display:flex;justify-content:space-between;align-items:center;gap:16px;
  background:transparent;color:var(--_ink);border:0;border-radius:7px;
  padding:8px 11px;text-align:left;cursor:pointer;font-family:inherit;font-size:13px;
}
.dr-presets button .dr-rng{color:var(--_faint);font-size:11px;font-family:var(--_mono)}
.dr-presets button:hover{background:var(--_bg)}
.dr-presets button.on{background:var(--_accent);color:var(--_on-ink);font-weight:600}
.dr-presets button.on .dr-rng{color:var(--_on-sub)}
.dr-custom{display:flex;gap:10px;margin-top:8px;padding-top:10px;border-top:1px solid var(--_line)}
.dr-custom label{display:flex;flex-direction:column;gap:5px}
.dr-custom label>span{font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--_muted)}
.dr-custom input[type=date]{
  min-width:132px;background:var(--_bg);color:var(--_ink);border:1px solid var(--_line);border-radius:8px;
  padding:7px 10px;font:inherit;font-size:13px;color-scheme:var(--dr-scheme,dark);
}
.dr-note{margin-top:8px;padding:9px 11px 3px;border-top:1px solid var(--_line);color:var(--_muted);font-size:12px;line-height:1.45;max-width:290px}
@media (max-width:520px){
  .dr-trigger{min-width:0;width:100%}
  .dr-pop{left:0;right:auto;max-width:calc(100vw - 32px)}
}
