/*
  date_picker_et.css — Estonian date picker (ISSUE #328) presentation rules.

  These are the classes static/js/date-picker-et.js injects at runtime, not
  server-rendered markup — moved out of article_feed.css (ISSUE #417) into
  one shared file both shells load, since the console now enhances the same
  date_range_filter form the public feed already did. Server-rendered
  markup around the picker (.pm-fil-date-wrap*, .pm-date-picker, .pm-dp-row,
  .pm-dp-field, .pm-dp-lbl, .pm-dp-sep, .pm-dp-actions, .pm-dp-cancel,
  .pm-dp-apply, the .pm-dp-enhanced popover) stays in article_feed.css — it
  is public-page layout, not the picker's own presentation (KB-0182).

  Loaded via:
    - public: {{ use_css("article_feed", "date_picker_et") }} in
      components/public/date_range.html
    - admin: a direct <link> in admin_base.html (no use_css registry there)
*/

.pm-dp-input {
    font-family: inherit;
    font-size: var(--fs-sm);
    color: var(--text);
    background: var(--pm-surface);
    border: 1px solid var(--div);
    outline: none;
    transition: border-color var(--dur-fast);
}

.pm-dp-input:focus { border-color: var(--navy); }

.pm-dp-input:focus-visible {
    outline: 2px solid var(--navy);
    outline-offset: 2px;
}

/* ISSUE #328 — the Estonian, Monday-first calendar built by
   static/js/date-picker-et.js on first focus into the panel. The
   pp.kk.aaaa format hint (#pm-dp-hint) stays in the DOM for
   aria-describedby but is visually-hidden — the visible
   input's placeholder carries the format visually instead. */
.pm-dp-msg { font-size: var(--fs-2xs); color: var(--red-700); margin-top: var(--sp-4xs); } /* A11Y: --red-700 on --pm-surface = 6.47:1, KB-0019's danger-text token */

/* Colour is not the only invalid cue: aria-invalid, the message text and
   aria-describedby all carry it. --red on --pm-surface = 4.83:1, >=3:1 for
   a non-text boundary. */
.pm-dp-input.is-invalid { border-color: var(--red); }

.pm-dp-cal { margin-top: var(--sp-md); }
.pm-dp-cal-head { margin-bottom: var(--sp-2xs); }
.pm-dp-cap { font-size: var(--fs-sm); color: var(--text); } /* --text on --pm-surface = 15.46:1 */

.pm-dp-nav {
    background: none;
    border: 0;
    cursor: pointer;
    color: var(--text2); /* A11Y: 5.95:1; glyph also clears the 3:1 non-text bar */
    font-size: var(--fs-xs);
    min-width: 24px;
    min-height: 24px;
}

.pm-dp-nav:hover { color: var(--navy); } /* 11.63:1 */

.pm-dp-nav:focus-visible {
    outline: 2px solid var(--navy);
    outline-offset: 2px;
}

.pm-dp-wd {
    font-size: var(--fs-2xs);
    color: var(--text2); /* A11Y: 5.95:1 -- not --text3 (2.54:1) */
    font-weight: 600;
    /* Bootstrap Reboot sets th{text-align:inherit}, which drops the browser's
       centred default and left-aligns the header off its column. */
    text-align: center;
}

.pm-dp-grid {
    width: 100%;
    table-layout: fixed;            /* 7 equal columns, no colgroup needed --
                                        this is a scope clarification of
                                        KB-0102 (its colgroup rule targets
                                        public SSR data tables with unevenly
                                        weighted columns), not an override */
    border-collapse: separate;
    border-spacing: var(--sp-5xs);
}

.pm-dp-day, .pm-dp-day-empty {
    /* One-off element dimension (documented literal exception, cf.
       .pm-art-thumb): keeps the WCAG 2.5.8 target at 33x30 inside the 280px
       popover while fitting 6 week rows without a scroller. line-height is
       banned in this file, so text-align + vertical-align do the centring
       instead -- do not put display:flex on a <td>, it collapses the table
       formatting context and the row with it. */
    height: 30px;
    text-align: center;
    vertical-align: middle;
}

.pm-dp-day { font-size: var(--fs-xs); color: var(--text); cursor: pointer; border-radius: var(--radius-sm); } /* 15.46:1 */

.pm-dp-day:hover { background: var(--div-2); } /* --text on --div-2 = 13.90:1; hover is pointer-only feedback */

/* --navy-50 alone is 1.07:1 -- deliberately supplementary. The 1px --navy
   underline (11.63:1) is the high-contrast, shape-based cue that carries
   WCAG 1.4.1/1.4.11 on its own; text on --navy-50 = 14.39:1. */
.pm-dp-day.is-in-range { background: var(--navy-50); box-shadow: inset 0 -1px 0 0 var(--navy); }

/* Ring 11.63:1; the non-colour cue is also in the accessible name (", täna"). */
.pm-dp-day.is-today { box-shadow: inset 0 0 0 1px var(--navy); }

/* Precedence over is-today/is-in-range: box-shadow:none so a selected today
   shows the fill, not a ring inside a fill. --pm-surface on --navy = 11.63:1. */
.pm-dp-day.is-sel { background: var(--navy); color: var(--pm-surface); box-shadow: none; }

/* -2px (inset), not the file's usual +2px: in a 7-column 2px-gutter grid a
   positive offset overlaps the neighbouring cells and clips at the popover
   edge. */
.pm-dp-day:focus-visible { outline: 2px solid var(--navy); outline-offset: -2px; }