/* Phase 1 accessibility fix: readable form controls in dark theme */
html[data-theme="dark"] input,
html[data-theme="dark"] select,
html[data-theme="dark"] textarea,
body.dark input,
body.dark select,
body.dark textarea,
[data-theme="dark"] input,
[data-theme="dark"] select,
[data-theme="dark"] textarea {
  background-color: #111827 !important;
  color: #f8fafc !important;
  border-color: #64748b !important;
  color-scheme: dark;
}

html[data-theme="dark"] input::placeholder,
html[data-theme="dark"] textarea::placeholder,
body.dark input::placeholder,
body.dark textarea::placeholder,
[data-theme="dark"] input::placeholder,
[data-theme="dark"] textarea::placeholder {
  color: #cbd5e1 !important;
  opacity: 1;
}

html[data-theme="dark"] select option,
body.dark select option,
[data-theme="dark"] select option {
  background: #111827;
  color: #f8fafc;
}

html[data-theme="dark"] input:focus,
html[data-theme="dark"] select:focus,
html[data-theme="dark"] textarea:focus,
body.dark input:focus,
body.dark select:focus,
body.dark textarea:focus,
[data-theme="dark"] input:focus,
[data-theme="dark"] select:focus,
[data-theme="dark"] textarea:focus {
  outline: 3px solid rgba(139, 124, 255, .45);
  outline-offset: 2px;
  border-color: #a78bfa !important;
}

html[data-theme="dark"] input[type="date"]::-webkit-calendar-picker-indicator,
body.dark input[type="date"]::-webkit-calendar-picker-indicator,
[data-theme="dark"] input[type="date"]::-webkit-calendar-picker-indicator {
  filter: invert(1);
  opacity: .9;
}

/* Also protect controls when the browser is using a dark color scheme. */
@media (prefers-color-scheme: dark) {
  html:not([data-theme="light"]) input,
  html:not([data-theme="light"]) select,
  html:not([data-theme="light"]) textarea {
    background-color: #111827;
    color: #f8fafc;
    border-color: #64748b;
    color-scheme: dark;
  }
  html:not([data-theme="light"]) input::placeholder,
  html:not([data-theme="light"]) textarea::placeholder {
    color: #cbd5e1;
    opacity: 1;
  }
}


/* HowLongKit responsive global navigation */
.hlk-header{position:sticky;top:0;z-index:1000;background:var(--header-bg,#111827);border-bottom:1px solid rgba(148,163,184,.22)}
.hlk-nav{max-width:1120px;margin:auto;padding:.75rem 1rem;display:flex;align-items:center;gap:1rem}
.hlk-brand{font-weight:800;font-size:1.25rem;text-decoration:none;margin-right:auto}
.hlk-menu{display:flex;align-items:center;gap:.25rem}
.hlk-menu>a,.hlk-drop>summary{display:block;padding:.65rem .7rem;border-radius:.65rem;text-decoration:none;cursor:pointer;list-style:none}
.hlk-drop>summary::-webkit-details-marker{display:none}
.hlk-drop{position:relative}
.hlk-drop-menu{position:absolute;right:0;top:calc(100% + .35rem);min-width:235px;padding:.45rem;background:#111827;border:1px solid #475569;border-radius:.8rem;box-shadow:0 14px 35px rgba(0,0,0,.28)}
.hlk-drop-menu a{display:block;padding:.65rem .75rem;border-radius:.55rem;text-decoration:none;color:#f8fafc}
.hlk-drop-menu a:hover,.hlk-drop-menu a:focus{background:#1f2937}
.hlk-mobile-toggle{display:none;background:transparent;border:1px solid #64748b;border-radius:.65rem;padding:.55rem .7rem;color:inherit;font:inherit;cursor:pointer}
@media(max-width:760px){
 .hlk-nav{flex-wrap:wrap}
 .hlk-mobile-toggle{display:block}
 .hlk-menu{display:none;width:100%;flex-direction:column;align-items:stretch}
 .hlk-menu.hlk-open{display:flex}
 .hlk-menu>a,.hlk-drop>summary{padding:.8rem}
 .hlk-drop-menu{position:static;min-width:0;margin:.25rem 0 .5rem .75rem;box-shadow:none}
}


/* Theme-toggle navigation patch */
.hlk-theme-slot{display:flex;align-items:center;margin-left:.25rem}
.hlk-theme-slot button{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;padding:.55rem;border:1px solid #64748b;border-radius:.75rem;background:transparent;color:inherit;cursor:pointer;font:inherit}
@media(max-width:760px){
 .hlk-theme-slot{margin-left:auto}
 .hlk-mobile-toggle{order:3}
 .hlk-menu{order:4}
}

/* Mobile DOB keyboard patch */
.field-hint{display:block;margin-top:7px;font-size:.85rem;opacity:.72}
input[aria-invalid="true"]{outline:2px solid #e35d6a;outline-offset:2px}
#a{font-variant-numeric:tabular-nums;color:var(--text,#f4f6ff);-webkit-text-fill-color:currentColor;opacity:1}
#a::placeholder{color:var(--muted,#aeb6cc);-webkit-text-fill-color:var(--muted,#aeb6cc);opacity:1}