/*
 * Nek Humsafar responsive foundation
 * Loaded last so legacy page-specific CSS keeps its visual design while this
 * layer only corrects sizing, wrapping and small-screen layout behaviour.
 */
html { max-width: 100%; overflow-x: clip; }
body { min-width: 0; max-width: 100%; overflow-x: clip; }
img, picture, video, canvas, svg, iframe { max-width: 100%; }
img, video { height: auto; }
input, select, textarea, button { max-width: 100%; }
:where(p, li, td, th, a, span, strong, small, label) { overflow-wrap: anywhere; }
:where(.app-shell, .main, .content, .view, .card, .panel, .wrap, .container, section, article, aside, form, fieldset) { min-width: 0; }

/* Public marketing website */
body.nh-public-site .container,
body.nh-public-site .section-inner,
body.nh-public-site .footer-inner { width: min(100% - 32px, 1180px); }
body.nh-public-site .mobile-drawer { max-width: 100vw; overflow-y: auto; overscroll-behavior: contain; }

@media (max-width: 900px) {
  body.nh-public-site { padding-bottom: max(72px, env(safe-area-inset-bottom)); }
  body.nh-public-site header.site-header .nav { width: min(100% - 28px, 1180px); }
  body.nh-public-site :where(.hero-grid, .about-grid, .contact-grid, .story-grid, .membership-grid, .footer-grid) {
    grid-template-columns: minmax(0, 1fr) !important;
  }
  body.nh-public-site :where(.features-grid, .steps-grid, .stats-grid, .values-grid, .faq-grid) {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  body.nh-public-site :where(.hero-content, .hero-copy, .section-copy, .cta-content) { max-width: none; }
  body.nh-public-site .register-progress { overflow: hidden; }
  body.nh-public-site .register-steps { grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 2px; }
  body.nh-public-site .register-steps button { min-width: 0; padding-inline: 1px; }
  body.nh-public-site .register-steps button small {
    display: block;
    max-width: 100%;
    margin-top: 6px;
    overflow: hidden;
    overflow-wrap: normal;
    word-break: normal;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-size: clamp(7px, 1.35vw, 10px);
    line-height: 1.2;
  }
  body.nh-public-site .register-steps button span { flex: none; }
}

@media (max-width: 640px) {
  body.nh-public-site .container,
  body.nh-public-site .section-inner,
  body.nh-public-site .footer-inner { width: min(100% - 24px, 1180px); }
  body.nh-public-site header.site-header .nav { width: calc(100% - 24px); gap: 8px; }
  body.nh-public-site header.site-header .brand { min-width: 0; }
  body.nh-public-site header.site-header .brand-text { min-width: 0; }
  body.nh-public-site header.site-header .brand-name { white-space: nowrap; font-size: clamp(17px, 5vw, 22px); }
  body.nh-public-site header.site-header .nav-actions { margin-left: auto; gap: 7px; }
  body.nh-public-site header.site-header .nh-header-register-btn { padding-inline: 12px; white-space: nowrap; }
  body.nh-public-site :where(.features-grid, .steps-grid, .stats-grid, .values-grid, .faq-grid, .membership-grid) {
    grid-template-columns: minmax(0, 1fr) !important;
  }
  body.nh-public-site :where(.hero-actions, .cta-actions, .form-actions, .contact-actions) { display: flex; flex-wrap: wrap; }
  body.nh-public-site :where(.hero-actions, .cta-actions) > :where(a, button) { flex: 1 1 180px; text-align: center; justify-content: center; }
  body.nh-public-site :where(h1, .hero-title) { font-size: clamp(2rem, 10vw, 3.25rem) !important; }
  body.nh-public-site :where(h2, .section-title) { font-size: clamp(1.65rem, 8vw, 2.5rem) !important; }
  body.nh-public-site :where(.hero, section) { scroll-margin-top: 82px; }
  body.nh-public-site .mobile-drawer { top: var(--nh-header-height, 72px); max-height: calc(100dvh - var(--nh-header-height, 72px)); }
  body.nh-public-site .register-main { min-width: 0; }
  body.nh-public-site .register-heading {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: start;
    gap: 12px;
  }
  body.nh-public-site .register-heading > div:first-child { min-width: 0; }
  body.nh-public-site .register-heading h2 { font-size: clamp(25px, 8vw, 31px); overflow-wrap: normal; }
  body.nh-public-site .completion-widget { align-self: start; }
  body.nh-public-site .register-progress { padding-inline: 8px; }
  body.nh-public-site .register-steps button:after {
    left: calc(50% + 16px);
    right: calc(-50% + 16px);
  }
  body.nh-public-site .register-grid { grid-template-columns: minmax(0, 1fr) !important; }
  body.nh-public-site .register-grid .span-2 { grid-column: auto; }
  body.nh-public-site .register-actions { gap: 8px; }
  body.nh-public-site .register-actions .button { min-width: 0; flex: 1 1 120px; }
}

@media (max-width: 420px) {
  body.nh-public-site .phone-combo,
  body.nh-public-site .otp-actions { grid-template-columns: minmax(0, 1fr) !important; }
  body.nh-public-site .otp-actions > * { grid-column: auto !important; }
  body.nh-public-site .photo-slots { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body.nh-public-site .registration-benefits article { grid-template-columns: 42px minmax(0, 1fr); padding-inline: 12px; }
  body.nh-public-site .register-steps button small { display: none; }
  body.nh-public-site .register-progress { padding-bottom: 14px; }
  body.nh-public-site .register-heading { grid-template-columns: minmax(0, 1fr) 48px; }
  body.nh-public-site .completion-widget > b { width: 48px; height: 48px; font-size: 11px; }
}

/* Simple legal/information pages */
body.nh-public-basic .wrap,
body.nh-public-basic .nav { width: min(100% - 32px, 1080px); }
@media (max-width: 520px) {
  body.nh-public-basic .wrap,
  body.nh-public-basic .nav { width: calc(100% - 24px); }
  body.nh-public-basic .links { width: 100%; gap: 8px 14px; }
  body.nh-public-basic .hero h1 { font-size: clamp(2rem, 11vw, 3rem); }
  body.nh-public-basic :where(.card, .panel) { padding: 16px; }
}

/* Member application */
.nh-member .app-shell,
.nh-member .main,
.nh-member .content,
.nh-member .view { width: 100%; min-width: 0; }
.nh-member :where(.toolbar, .section-title, .result-heading, .filter-actions, .profile-actions, .member-profile-toolbar) { min-width: 0; }
.nh-member :where(.modal, .modal-card, .dialog, [role="dialog"]) { max-width: calc(100vw - 24px); max-height: calc(100dvh - 24px); }
.nh-member :where(.table-wrap, .table-responsive, .payments) { max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }

@media (max-width: 950px) {
  .nh-member .content { padding-inline: clamp(12px, 3vw, 24px); }
  .nh-member .home-layout,
  .nh-member .discovery-layout { grid-template-columns: minmax(0, 1fr) !important; }
  .nh-member .home-rail { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .nh-member .discovery-layout > :where(aside, div) { width: 100%; min-width: 0; }
  .nh-member .filter-card { position: static; max-height: none; }
  .nh-member :where(.plans, .metrics) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 700px) {
  .nh-member { padding-bottom: calc(74px + env(safe-area-inset-bottom)); }
  .nh-member .topbar { min-width: 0; padding-inline: 12px; gap: 8px; }
  .nh-member .topbar-title { min-width: 0; }
  .nh-member .topbar-title h1 { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .nh-member .topbar-actions { margin-left: auto; min-width: 0; gap: 6px; }
  .nh-member .language-label { display: none; }
  .nh-member .user-chip { width: auto; min-width: 44px; padding: 4px; }
  .nh-member .user-chip > span:not(.avatar):not(.user-chip-chevron) { display: none; }
  .nh-member .user-chip-chevron { display: none; }
  .nh-member .member-account-menu { position: fixed; top: 64px; right: 10px; left: auto; width: min(290px, calc(100vw - 20px)); }
  .nh-member .content { padding-inline: 12px; }
  .nh-member :where(.home-rail, .plans, .metrics, .form-grid, .settings-grid, .profile-grid, .detail-grid, .editor-grid) {
    grid-template-columns: minmax(0, 1fr) !important;
  }
  .nh-member :where(.discovery-tabs, .result-heading, .section-title, .member-profile-toolbar, .shortlist-toolbar, .shortlist-toolbar-actions) {
    align-items: stretch; flex-wrap: wrap; gap: 10px;
  }
  .nh-member :where(.discovery-tabs, .result-heading, .shortlist-toolbar) > * { min-width: 0; }
  .nh-member :where(.toolbar, .discovery-tabs .toolbar, .shortlist-chips-group) {
    max-width: 100%; overflow-x: auto; overscroll-behavior-inline: contain; scrollbar-width: thin;
  }
  .nh-member :where(.toolbar, .discovery-tabs .toolbar, .shortlist-chips-group) > * { flex: 0 0 auto; }
  .nh-member .shortlist-toolbar-actions { width: 100%; }
  .nh-member .shortlist-search-mini { flex: 1 1 100%; width: 100%; }
  .nh-member .shortlist-sort-wrap { flex: 1 1 180px; }
  .nh-member .journey-banner { grid-template-columns: minmax(0, 1fr) !important; height: auto; }
  .nh-member :where(.filter-actions, .form-actions, .profile-actions) { display: flex; flex-wrap: wrap; }
  .nh-member :where(.filter-actions, .form-actions) > :where(button, .btn) { flex: 1 1 130px; }
  .nh-member :where(.modal, .modal-card, .dialog, [role="dialog"]) { overflow-y: auto; }
  .nh-member .member-bottom-nav { width: 100%; max-width: 100%; left: 0; right: 0; bottom: 0; border-radius: 18px 18px 0 0; padding-bottom: env(safe-area-inset-bottom); }
}

@media (max-width: 480px) {
  .nh-member .content { padding-inline: 10px; }
  .nh-member :where(.card, .panel, .rail-card, .filter-card) { max-width: 100%; }
  .nh-member :where(.profiles:not(.horizontal-profiles), .shortlist-profiles-grid, .photo-grid, .photos-grid) {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px;
  }
  .nh-member .profiles.horizontal-profiles { max-width: 100%; overflow-x: auto; }
  .nh-member .profiles.horizontal-profiles > * { min-width: min(82vw, 300px); }
  .nh-member .member-bottom-nav button { min-width: 0; padding-inline: 2px; font-size: 10px; }
  .nh-member :where(input, select, textarea) { font-size: 16px; }
}

/* Login and password recovery */
@media (max-width: 760px) {
  body.nh-login .login-page,
  body.nh-auth .login-page { min-height: 100dvh; grid-template-columns: minmax(0, 1fr) !important; }
  body.nh-login .login-visual,
  body.nh-auth .login-visual { min-height: auto; padding: 32px 20px; }
  body.nh-login .auth-side,
  body.nh-auth .auth-side { padding: 20px 12px; }
  body.nh-login .auth-card,
  body.nh-auth .auth-card { width: min(100%, 520px); padding: clamp(18px, 5vw, 30px); }
  body.nh-login input,
  body.nh-auth input { font-size: 16px; }
}

/* Admin application */
.nh-admin .main,
.nh-admin .page,
.nh-admin .panel,
.nh-admin .card { min-width: 0; }
.nh-admin :where(.table-wrap, .payments, .dt-container) { max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }

@media (max-width: 1000px) {
  .nh-admin .cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .nh-admin :where(.grid-main, .grid-lower) { grid-template-columns: minmax(0, 1fr); }
  .nh-admin .filters { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 760px) {
  .nh-admin .page { padding: 12px; }
  .nh-admin .topbar { width: 100%; }
  .nh-admin .topbar .title,
  .nh-admin .topbar .subtitle { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .nh-admin :where(.cards, .filters, .verify, .mini-stats, .banner, .banner-features) {
    grid-template-columns: minmax(0, 1fr) !important;
  }
  .nh-admin :where(.panel-head, .page-head, .dt-layout-row, .inline-form, .dt-export-bar) {
    flex-wrap: wrap; gap: 10px;
  }
  .nh-admin .inline-form { min-width: 0; width: 100%; }
  .nh-admin .inline-form > * { flex: 1 1 120px; }
  .nh-admin .banner { height: auto; padding: 20px; }
  .nh-admin .verify { justify-items: center; }
  .nh-admin .pagination-wrap { overflow-x: auto; }
  .nh-admin .pagination-wrap nav { min-width: 0 !important; flex-wrap: wrap; }
  .nh-admin .admin-menu { max-width: calc(100vw - 28px); }
  .nh-admin :where(input, select, textarea) { font-size: 16px; }
}

@media (max-width: 420px) {
  .nh-admin .page { padding: 10px; }
  .nh-admin :where(.panel, .table-wrap, .card) { padding: 12px; }
  .nh-admin .quick-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px 8px; }
  .nh-admin .auth-card { padding: 20px 16px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}
