/* The language picker.
 *
 * Almost nothing here. It sits in the theme's microwidget slot, so its color,
 * its type and the space around it are the theme's already - writing them again
 * would only mean a picker that stops matching the header the day somebody
 * changes the header. What is left is the arrangement, which the theme has no
 * opinion about. */

.dstr-pick{ display:inline-flex; align-items:center; gap:.5em; }

/* EN / ES, side by side, with the one you are reading standing out. Opacity
   rather than a color of its own: it dims against whatever the header is,
   including a header that changes color over a photograph. */
.dstr-inline .dstr-one{ text-decoration:none; opacity:.55; transition:opacity .15s ease; }
.dstr-inline .dstr-one:hover,
.dstr-inline .dstr-one:focus-visible{ opacity:1; }
.dstr-inline .dstr-one.is-on{ opacity:1; font-weight:600; }

/* A rule between them, drawn by the gap rather than by an element, so there is
   nothing extra in the markup for a screen reader to read out. */
.dstr-inline .dstr-one + .dstr-one{ padding-left:.6em; border-left:1px solid currentColor; border-left-color:color-mix(in srgb, currentColor 30%, transparent); }

.dstr-drop{ margin:0; }
.dstr-drop select{ font:inherit; color:inherit; }

/* Shown only where the select cannot submit itself. */
.dstr-drop .dstr-go{ font:inherit; }
.dstr-drop[data-dstr-ready] .dstr-go{ display:none; }