/* ── USABILITY LAYER ──
   Loaded after responsive.css on purpose: it raises the floor on text
   size, tap-target size and interaction feedback across every component
   without touching their layout rules. */

/* ── Readable text ── */
::placeholder{color:var(--text-sub-dark);opacity:1}
.hh-subtitle{font-size:16px}
.pcard-meta{font-size:13px}
.ptag{font-size:12px}
.inq-form-group label{font-size:13px;color:var(--text)}
.drow-label{font-size:14px}
.drow-val{font-size:15px;font-weight:400}
/* Mobile drawer: every label was 13px/400 — hard to read and to tell
   apart from its own hint text. */
.mmn-brand{font-weight:700}
.mmn-section-label{font-size:12px;font-weight:600}
.mmn-nav-row{min-height:48px;padding:8px 1.25rem}
.mmn-nav-row:hover{background:var(--page-bg)}
.mmn-nav-row-title{font-size:15px;font-weight:500}
.mmn-nav-row-hint{font-size:12px}
.mmn-row-label{font-size:15px;font-weight:500}
.mmn-settings-row{min-height:48px}
.mqt-title{font-size:14px;font-weight:600}
.mqt-sub{font-size:12px}
.mmn-guest-card .mgc-title{font-size:14px;font-weight:600}
.mmn-guest-card .mgc-sub{font-size:12px}
.mmn-guest-signin-btn{font-size:13px;min-height:36px}
.mmn-account-card .mac-name{font-size:14px;font-weight:600}
.mmn-account-card .mac-sub{font-size:12px}
.mmn-logout-btn{min-height:36px;font-size:13px}
.mmn-about-btn{font-size:14px;min-height:40px}
.mbn-btn{font-size:12px;min-height:56px}

/* ── Comfortable tap / click targets ── */
.pcard-btn{width:40px;height:40px}
.mfs-close-btn,.inq-close,.mmn-close,.theme-toggle-btn{width:36px;height:36px}
.mmn-close:hover{background:var(--border);color:var(--text)}
.lang-btn,.lang-pill-btn{min-height:32px;font-size:13px}
.mfs-seg-btn{min-height:36px;font-size:13px;font-weight:600}
.mfs-select,.mfs-range-input{min-height:44px}
.mfs-btn-secondary,.mfs-btn-primary{min-height:44px;font-size:15px}
.inq-cancel,.inq-send,.success-close-btn,.email-lookup-btn{min-height:40px;font-weight:600}
.send-email-btn,.reg-wiz-back-btn,.reg-wiz-next-btn{min-height:44px}
.back-btn{min-height:40px;font-size:14px;color:var(--text);background:var(--btn-secondary);border-color:transparent;box-shadow:none}
.back-btn:hover{background:var(--btn-secondary-hover)}
.option-row,.csel-opt{min-height:40px}

/* ── Native selects had appearance:none but no arrow, so they read as
   plain text boxes — give them a visible dropdown chevron. ── */
.inq-form-group select{padding-right:34px;cursor:pointer;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%2365676B' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='5 8 10 13 15 8'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 11px center;background-size:16px}
:root[data-theme="dark"] .inq-form-group select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%23B0B3B8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='5 8 10 13 15 8'/%3E%3C/svg%3E")}

/* ── Clear calls to action + interaction feedback ── */
.send-email-btn{border-color:transparent;color:var(--link-light)}
.send-email-btn:hover{background:var(--info-bg-hover)}
.dpage-report-link:hover{text-decoration:underline}
button:disabled,.btn:disabled{cursor:not-allowed}
/* Fields that failed validation also say so with a red ring, not just a
   tinted background. */
.field-error{box-shadow:0 0 0 1px var(--danger)}
/* Anchors / scrollIntoView targets shouldn't hide under the sticky navbar. */
html{scroll-padding-top:76px}

@media(max-width:640px){
  /* responsive.css shrinks card text to 10–12px on phones; keep it legible. */
  .pcard-name{font-size:14px}
  .pcard-meta{font-size:12px}
  .ptag{font-size:11.5px}
  .pcard-btn{width:44px;height:44px}
  .navbar-inner .hamburger{flex-basis:44px;width:44px;height:44px;line-height:44px}
  .mobile-search-btn{width:42px;height:38px}
  .filter-mobile-toggle{min-height:48px;font-weight:400}
  .ai-suggest-btn-mobile{min-height:44px}
  .hh-subtitle{font-size:15px}
  html{scroll-padding-top:64px}
}

/* ── Respect "reduce motion": drop decorative movement, keep spinners. ── */
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{transition-duration:.01ms!important}
  .confirm-box,.success-modal,.mobile-menu-sheet,.toast,.skel{animation:none}
  .pcard:hover,.lcard:hover,.step-card:hover{transform:none}
}
