/* NALDERN mobile UX hardening — 2026-09-14
   Goals: keep phone portrait/landscape behavior consistent, keep the worker CTA visible,
   preserve the city field, and prevent registration/auth surfaces from overflowing. */

.mobile-header-worker-cta{display:none}

/* Treat phone landscape and small tablets as compact navigation too. */
@media (max-width:900px){
  .site-header .header-inner{
    height:64px!important;
    gap:8px!important;
    width:calc(100% - 24px)!important;
    max-width:calc(100% - 24px)!important;
  }
  .desktop-nav{display:none!important}
  .header-actions{margin-left:auto!important;gap:7px!important;min-width:0!important}
  .header-actions>.account-chip,
  .header-actions>.inline-form,
  .header-actions>.header-message-link,
  .header-actions>.header-register-link,
  .header-actions>.text-button{display:none!important}
  .mobile-menu-button{
    display:grid!important;
    place-items:center!important;
    flex:0 0 42px!important;
    width:42px!important;
    height:42px!important;
    padding:0!important;
    border-radius:11px!important;
    border:1px solid var(--line)!important;
    background:#fff!important;
    color:var(--ink)!important;
  }
  .mobile-header-worker-cta{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:40px;
    padding:8px 11px;
    border:1px solid rgba(23,107,100,.30);
    border-radius:10px;
    background:#F3FAF7;
    color:#176B64;
    font-size:11px;
    line-height:1.1;
    font-weight:850;
    white-space:nowrap;
  }

  /* Home search keeps the same essential fields in portrait and landscape. */
  .home-search-simple{
    grid-template-columns:minmax(0,1fr) minmax(145px,.62fr) auto!important;
  }
  .home-search-simple .home-city-field{display:flex!important}

  /* Registration should remain a single, contained column on phones/tablets. */
  .auth-premium-grid{
    grid-template-columns:minmax(0,1fr)!important;
    width:100%!important;
    max-width:620px!important;
    margin-inline:auto!important;
  }
  .auth-visual{display:none!important}
  .auth-form-card,
  .auth-form-card form,
  .auth-form-card .form-group,
  .auth-form-card .password-control,
  .auth-role-grid,
  .account-choice-block,
  .worker-role-confirm,
  .founding-register-card,
  .request-ready-note,
  .referral-invite-note,
  .legal-check{min-width:0!important;max-width:100%!important}
  .auth-form-card{width:100%!important;overflow:hidden}
  .auth-role-grid,.auth-role-grid-prominent{grid-template-columns:minmax(0,1fr)!important}
  .role-option,.role-option span,.role-option-prominent,.role-option-prominent span{min-width:0!important;max-width:100%!important}
  .role-option span,.role-option-prominent span,.worker-role-confirm p,.founding-register-card p,.legal-check span{overflow-wrap:anywhere}
  .password-control{width:100%!important}
  .password-control .input{min-width:0!important;width:100%!important}
}

@media (max-width:680px){
  /* The language choices already live in the hamburger menu; use the scarce
     header space for the acquisition CTA instead. */
  .header-actions>.language-switcher{display:none!important}
  .brand{min-width:0!important;flex:1 1 auto}
  .brand-copy{min-width:0!important}
  .brand-copy>span{white-space:nowrap}

  .home-search-simple{
    grid-template-columns:minmax(0,1fr)!important;
    padding:6px!important;
  }
  .home-search-simple .field-inline{
    width:100%!important;
    min-width:0!important;
    border-right:0!important;
    border-bottom:1px solid #E4ECE8!important;
  }
  .home-search-simple .home-city-field{display:flex!important}
  .home-search-simple .button{width:100%!important}

  .auth-page{padding:20px 0 44px!important;overflow-x:hidden}
  .auth-page>.shell{width:calc(100% - 20px)!important;max-width:calc(100% - 20px)!important}
  .auth-form-card{padding:20px 16px!important;border-radius:18px!important}
  .auth-form-card h1{
    font-size:clamp(30px,9vw,38px)!important;
    line-height:1.06!important;
    overflow-wrap:anywhere;
  }
  .auth-form-card .input,
  .auth-form-card select,
  .auth-form-card textarea{font-size:16px!important}
  .account-choice-heading{display:grid!important;grid-template-columns:auto minmax(0,1fr)!important}
  .worker-role-confirm{grid-template-columns:34px minmax(0,1fr)!important}
  .password-control .input{padding-right:78px!important}
  .password-toggle{
    right:6px!important;
    max-width:70px!important;
    padding:7px 8px!important;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
  }
  .legal-check{width:100%!important;padding:12px!important}
  .legal-check span{min-width:0!important}

  /* Make the next onboarding step equally safe after a worker signs up. */
  .worker-onboarding-shell{width:calc(100% - 20px)!important;max-width:calc(100% - 20px)!important}
  .worker-onboarding-top,.onboarding-founding-card,.worker-onboarding-progress,.onboarding-card,.onboarding-action-bar{max-width:100%!important;min-width:0!important}
  .onboarding-time-pill,.onboarding-founding-meta,.onboarding-selected-count{white-space:normal!important}
  .onboarding-action-bar .button{min-width:0!important;width:100%!important}
}

@media (max-width:390px){
  .site-header .header-inner{width:calc(100% - 18px)!important;max-width:calc(100% - 18px)!important}
  .brand-symbol,.brand-symbol-img{width:34px!important;height:34px!important;flex-basis:34px!important}
  .brand-copy>span{font-size:16px!important}
  .mobile-header-worker-cta{font-size:10.5px;padding:7px 9px;min-height:38px}
  .mobile-menu-button{width:40px!important;height:40px!important;flex-basis:40px!important}
}

@media (max-width:680px){
  /* First-click traffic often lands inside an in-app browser. Keep consent visible
     without covering a large part of the registration form. */
  .cookie-banner{
    left:8px!important;
    right:8px!important;
    bottom:8px!important;
    padding:8px 9px!important;
    gap:6px!important;
    border-radius:12px!important;
  }
  .cookie-banner strong{font-size:11.5px!important}
  .cookie-banner p{
    font-size:9.5px!important;
    line-height:1.25!important;
    display:-webkit-box;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:2;
    overflow:hidden;
  }
  .cookie-actions{display:grid!important;grid-template-columns:1fr 1fr!important;gap:6px!important;width:100%!important}
  .cookie-actions form,.cookie-actions button{width:100%!important}
  .cookie-banner .button-small{min-height:34px!important;padding:6px 8px!important;font-size:10px!important}
}

/* Logged-in mobile users must always have an obvious sign-out action in the hamburger menu. */
@media (max-width:900px){
  .mobile-logout-form{width:100%;margin:0}
  .mobile-logout-button{
    width:100%;
    display:block;
    text-align:left;
    padding:12px 10px;
    border:0;
    border-bottom:1px solid rgba(255,255,255,.06);
    background:transparent;
    color:inherit;
    font:inherit;
    font-weight:700;
  }
}

/* Registration reliability: visible feedback when mobile browsers block invalid forms. */
.register-inline-error{display:block;margin:2px 0 4px;padding:11px 13px;border-radius:12px;border:1px solid rgba(255,111,111,.35);background:rgba(117,28,28,.22);color:#ffd8d8;font-size:13px;line-height:1.4;font-weight:700}
.register-inline-error[hidden]{display:none!important}
#register-form [aria-invalid="true"]{outline:2px solid rgba(255,111,111,.72);outline-offset:2px}
#register-submit[disabled]{opacity:.78;cursor:wait}