/* Shared visual repair layer for public pages, authentication and dashboards. */
:root {
  --ux-primary: #7c3aed;
  --ux-primary-deep: #6d28d9;
  --ux-primary-bright: #8b5cf6;
  --ux-primary-rgb: 124, 58, 237;
  --ux-accent: #16a273;
  --ux-focus: 0 0 0 3px rgba(8, 124, 240, .18);
  --ux-radius: 14px;
}

html[data-theme="light"] {
  color-scheme: light;
  --ux-primary: #7c3aed;
  --ux-primary-deep: #6d28d9;
  --ux-primary-bright: #8b5cf6;
  --ux-primary-rgb: 124, 58, 237;
  --ux-focus: 0 0 0 3px rgba(124, 58, 237, .18);
  --ux-page: #f3f8fc;
  --ux-surface: #ffffff;
  --ux-surface-soft: #edf5fb;
  --ux-text: #102a43;
  --ux-text-soft: #405c73;
  --ux-muted: #687f93;
  --ux-border: #cedeea;
}

html[data-theme="dark"] {
  color-scheme: dark;
  --ux-primary: #3b82f6;
  --ux-primary-deep: #2563eb;
  --ux-primary-bright: #60a5fa;
  --ux-primary-rgb: 59, 130, 246;
  --ux-focus: 0 0 0 3px rgba(59, 130, 246, .22);
  --ux-page: #020b14;
  --ux-surface: #0a1a2c;
  --ux-surface-soft: #071727;
  --ux-text: #f4f9fd;
  --ux-text-soft: #b8cad8;
  --ux-muted: #91aabd;
  --ux-border: #24445d;
}

/* Public navigation: stable contrast before and after scroll. */
.nav-modern {
  background: color-mix(in srgb, var(--ux-page) 82%, transparent);
  border-bottom-color: color-mix(in srgb, var(--ux-border) 72%, transparent);
  backdrop-filter: blur(18px) saturate(145%);
  -webkit-backdrop-filter: blur(18px) saturate(145%);
}

.nav-modern .nav-inner { min-width: 0; }
.nav-brand { min-width: 0; flex-shrink: 0; }
.nav-links { min-width: 0; }
.nav-links a {
  color: var(--ux-text-soft) !important;
  font-weight: 700;
}
.nav-links a:hover,
.nav-links a.active {
  color: var(--ux-text) !important;
}
.nav-actions { min-width: 0; flex-shrink: 0; }
.theme-toggle,
.nav-burger {
  color: var(--ux-text) !important;
  background: color-mix(in srgb, var(--ux-surface) 82%, transparent) !important;
  border-color: var(--ux-border) !important;
}

/* Keystone language selector: compact, legible and touch friendly. */
.lang-switcher {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 3px;
  min-height: 40px;
  margin: 0 2px !important;
  padding: 4px 5px 4px 34px;
  border: 1px solid var(--ux-border);
  border-radius: 12px;
  background: color-mix(in srgb, var(--ux-surface) 82%, transparent);
  box-shadow: 0 6px 18px rgba(8, 52, 84, .07);
}
.lang-switcher::before {
  content: "\f0ac";
  position: absolute;
  left: 11px;
  top: 50%;
  transform: translateY(-50%);
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  color: var(--ux-muted);
  font-size: 12px;
}
[dir="rtl"] .lang-switcher { padding: 4px 34px 4px 5px; }
[dir="rtl"] .lang-switcher::before { left: auto; right: 11px; }
.lang-switcher .lang-item {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 31px;
  min-height: 30px;
  padding: 4px 7px;
  border: 0;
  border-radius: 8px;
  color: var(--ux-muted) !important;
  font-size: 11px;
  font-weight: 850;
  line-height: 1;
  letter-spacing: .04em;
}
.lang-switcher .lang-item:hover {
  color: var(--ux-primary-deep) !important;
  background: rgba(var(--ux-primary-rgb), .09) !important;
}
.lang-switcher .lang-item.lang-active {
  color: #fff !important;
  background: linear-gradient(135deg, var(--ux-primary), var(--ux-primary-bright)) !important;
  box-shadow: 0 5px 13px rgba(var(--ux-primary-rgb), .25);
}

/* Drawer always stays inside the viewport, including RTL and narrow phones. */
.mobile-drawer,
.drawer-backdrop {
  display: none !important;
}
.mobile-drawer {
  right: 0 !important;
  left: auto !important;
  width: min(88vw, 360px) !important;
  max-width: 100vw !important;
  overflow-x: hidden !important;
  overscroll-behavior: contain;
}
.drawer-header,
.drawer-body { width: 100%; min-width: 0; }
.drawer-brand { min-width: 0; }
.drawer-brand span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.drawer-body .lang-switcher {
  display: flex;
  width: 100%;
  margin: 8px 0 !important;
  justify-content: center;
}

/* Authentication pages follow the website theme, not the OS theme. */
body:has(.auth-page) .nav-modern {
  background: color-mix(in srgb, var(--ux-page) 88%, transparent) !important;
  border-bottom: 1px solid color-mix(in srgb, var(--ux-border) 82%, transparent) !important;
  box-shadow: 0 10px 36px rgba(7, 45, 74, .1) !important;
}
body:has(.auth-page) .footer-modern { display: none; }
.auth-page {
  isolation: isolate;
  min-height: 100dvh !important;
  padding: 116px 20px 42px !important;
  overflow: hidden !important;
  background:
    radial-gradient(circle at 18% 22%, rgba(var(--ux-primary-rgb), .18), transparent 31%),
    radial-gradient(circle at 82% 78%, rgba(22, 162, 115, .13), transparent 32%),
    var(--ux-page) !important;
  color: var(--ux-text);
}
.auth-page::before,
.auth-page::after {
  content: "";
  position: absolute;
  z-index: -1;
  width: clamp(260px, 35vw, 520px);
  aspect-ratio: 1;
  border-radius: 45% 55% 62% 38%;
  filter: blur(4px);
  pointer-events: none;
}
.auth-page::before {
  inset-inline-start: -12%;
  top: 14%;
  background: linear-gradient(145deg, rgba(var(--ux-primary-rgb),.16), rgba(var(--ux-primary-rgb),.04));
  transform: rotate(18deg);
}
.auth-page::after {
  inset-inline-end: -14%;
  bottom: -16%;
  background: linear-gradient(145deg, rgba(22,162,115,.13), rgba(var(--ux-primary-rgb),.04));
  transform: rotate(-22deg);
}
.auth-card {
  width: min(100%, 470px) !important;
  max-width: 470px !important;
  padding: 38px 38px 34px !important;
  border: 1px solid color-mix(in srgb, var(--ux-border) 78%, transparent);
  border-radius: 24px !important;
  background: color-mix(in srgb, var(--ux-surface) 92%, transparent) !important;
  color: var(--ux-text) !important;
  box-shadow: 0 24px 70px rgba(3, 34, 57, .16) !important;
  backdrop-filter: blur(22px) saturate(120%);
  -webkit-backdrop-filter: blur(22px) saturate(120%);
}
html[data-theme="dark"] .auth-card {
  box-shadow: 0 28px 80px rgba(0, 0, 0, .42) !important;
}
.auth-brand { margin-bottom: 28px !important; }
.auth-brand-logo {
  width: 74px !important;
  height: 74px !important;
  margin-bottom: 16px !important;
  border-radius: 20px !important;
  object-fit: contain !important;
  filter: drop-shadow(0 12px 22px rgba(var(--ux-primary-rgb), .25));
}
.auth-brand h1 { color: var(--ux-text) !important; font-size: 22px !important; }
.auth-brand p { color: var(--ux-muted) !important; }
.auth-field label { color: var(--ux-text-soft) !important; }
.auth-field input[type="text"],
.auth-field input[type="email"],
.auth-field input[type="password"],
.auth-field input[type="tel"] {
  height: 50px !important;
  border: 1px solid var(--ux-border) !important;
  border-radius: 13px !important;
  background: var(--ux-surface-soft) !important;
  color: var(--ux-text) !important;
  caret-color: var(--ux-primary);
}
.auth-field input::placeholder { color: var(--ux-muted) !important; opacity: .82; }
.auth-field input:focus {
  border-color: var(--ux-primary) !important;
  background: color-mix(in srgb, var(--ux-surface-soft) 88%, var(--ux-primary) 12%) !important;
  box-shadow: var(--ux-focus) !important;
}
.auth-field input.auth-input-valid {
  border-color: #16a273 !important;
  background: color-mix(in srgb, var(--ux-surface) 88%, rgba(22,162,115,.16)) !important;
}
.auth-field input.auth-input-error {
  border-color: #dc2626 !important;
  background: color-mix(in srgb, var(--ux-surface) 88%, rgba(220,38,38,.12)) !important;
}
.auth-pw-toggle { color: var(--ux-muted) !important; }
.auth-pw-toggle:hover { color: var(--ux-primary) !important; }
.auth-remember,
.auth-check-row,
.auth-footer { color: var(--ux-muted) !important; }
.auth-btn-primary {
  height: 50px !important;
  border-radius: 13px !important;
  background: linear-gradient(135deg, var(--ux-primary-deep), var(--ux-primary) 62%, #18a6d8) !important;
  box-shadow: 0 12px 25px rgba(var(--ux-primary-rgb), .24);
}
.auth-btn-secondary,
.auth-social-btn {
  border-color: var(--ux-border) !important;
  background: var(--ux-surface) !important;
  color: var(--ux-text-soft) !important;
}
.auth-btn-secondary:hover,
.auth-social-btn:hover {
  border-color: var(--ux-primary) !important;
  background: rgba(var(--ux-primary-rgb), .08) !important;
  color: var(--ux-primary-deep) !important;
}
.auth-divider::before,
.auth-divider::after { background: var(--ux-border) !important; }
.auth-divider span,
.auth-optional { color: var(--ux-muted) !important; }
html[data-theme="dark"] .auth-forgot,
html[data-theme="dark"] .auth-footer a,
html[data-theme="dark"] .auth-check-row a { color: #6bb7ff; }

/* The featured pricing card keeps readable text in day mode. */
html[data-theme="light"] .price-card.popular {
  background: linear-gradient(155deg, var(--ux-primary-deep) 0%, var(--ux-primary) 58%, #137f72 100%) padding-box,
              linear-gradient(135deg, #35a7ff, #4ee0b1) border-box !important;
  color: #fff !important;
  box-shadow: 0 24px 60px rgba(var(--ux-primary-rgb), .24) !important;
}
html[data-theme="light"] .price-card.popular :is(h3,.amount,.amount small,ul li) {
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
}
html[data-theme="light"] .price-card.popular ul li::before { color: #b9ffe3 !important; }

/* Customer portal is a single application shell: sidebar + integrated topbar. */
body.customer-portal-page > :is(.nav-modern,.mega-menu,.drawer-backdrop,.mobile-drawer) { display: none !important; }
body.customer-portal-page .app-shell,
body.customer-portal-page .app-main { min-height: 100dvh; }
body.customer-portal-page .ps-shell { min-height: 100dvh; }
body.customer-portal-page .ps-sidebar {
  top: 0;
  height: 100dvh;
}
body.customer-portal-page .ps-topbar { top: 0; }
.ps-brand > a { display: flex; align-items: center; gap: 11px; min-width: 0; }
.ps-brand-logo {
  width: 42px !important;
  height: 42px !important;
  filter: drop-shadow(0 7px 12px rgba(var(--ux-primary-rgb), .2));
}
.ps-user { overflow: hidden; }
.ps-user::before {
  content: "\f2bd";
  flex: 0 0 38px;
  width: 38px;
  height: 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 12px;
  background: linear-gradient(135deg, var(--ux-primary), var(--ux-primary-bright));
  color: #fff;
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
}
.ps-user-meta span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ps-topbar {
  min-height: 68px;
  background: color-mix(in srgb, var(--k-surface) 88%, transparent) !important;
  backdrop-filter: blur(16px) saturate(130%);
  -webkit-backdrop-filter: blur(16px) saturate(130%);
}
.ps-topbar-title { color: var(--k-text); }
.ps-content { min-width: 0; }

/* Shared light-mode form repair for every admin/customer child page. */
html[data-theme="light"] :is(.dashboard-content,.main-content,.ps-page) {
  color: var(--ux-text);
}
html[data-theme="light"] :where(.dashboard-content,.main-content,.ps-page)
  :is(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),select,textarea) {
  border-color: var(--ux-border) !important;
  background: var(--ux-surface-soft) !important;
  color: var(--ux-text) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.72);
}
html[data-theme="light"] :where(.dashboard-content,.main-content,.ps-page)
  :is(input,select,textarea)::placeholder { color: var(--ux-muted) !important; opacity: .9; }
html[data-theme="light"] :where(.dashboard-content,.main-content,.ps-page)
  :is(input,select,textarea):focus {
  border-color: var(--ux-primary) !important;
  background: color-mix(in srgb, var(--ux-surface-soft) 90%, var(--ux-primary) 10%) !important;
  box-shadow: var(--ux-focus) !important;
}
html[data-theme="light"] :where(.dashboard-content,.main-content,.ps-page)
  :is(label,.form-label,.help-text,.helptext,.text-muted,.muted) { color: var(--ux-text-soft) !important; }
html[data-theme="light"] :where(.dashboard-content,.main-content,.ps-page)
  :is(.form-card,.dashboard-panel,.content-card,.settings-card,.report-card,.mail-card,.delete-card,.sa-card,.ks-panel,.ks-card,.cs-panel,.cs-card) {
  background: var(--ux-surface) !important;
  border-color: var(--ux-border) !important;
}

@media (max-width: 960px) {
  .nav-links { display: none !important; }
  .nav-actions .hide-sm,
  .nav-actions > .lang-switcher { display: none !important; }
  .nav-burger { display: inline-flex !important; align-items: center; justify-content: center; flex: 0 0 42px; }
  .nav-modern .nav-inner { gap: 10px; padding-inline: max(14px, env(safe-area-inset-left)); }
  .mobile-drawer { display: flex !important; }
  .drawer-backdrop { display: block !important; }
}

@media (max-width: 880px) {
  body.customer-portal-page .ps-sidebar {
    top: 0 !important;
    height: 100dvh !important;
  }
  body.customer-portal-page .ps-topbar { display: flex; }
  .ps-topbar-user { display: none !important; }
  .ps-topbar-actions { margin-inline-start: auto; }
  .ps-panel-fab { display: none !important; }
}

@media (max-width: 560px) {
  .nav-brand { gap: 7px; }
  .nav-brand .keystoneseller-logo { width: 32px !important; height: 32px !important; }
  .nav-brand .keystoneseller-wordmark { max-width: 148px; overflow: hidden; text-overflow: ellipsis; font-size: 15px; }
  .theme-toggle,
  .nav-burger { width: 42px !important; height: 42px !important; flex-basis: 42px; }
  .auth-page { padding: 94px 12px 20px !important; align-items: flex-start !important; }
  .auth-card { padding: 28px 20px 25px !important; border-radius: 20px !important; }
  .auth-brand-logo { width: 64px !important; height: 64px !important; }
  .auth-row { align-items: stretch !important; }
  .auth-row > * { width: 100%; }
  .auth-forgot { white-space: normal !important; }
  .ps-topbar { padding: 8px 12px !important; }
  .ps-topbar-title { max-width: min(46vw, 190px); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
}

@media (prefers-reduced-motion: reduce) {
  .auth-page::before,
  .auth-page::after { transform: none; }
}

/* Complete dashboard theme bridge: legacy child pages must follow the selected theme. */
html[data-theme="dark"] :is(.dashboard-content,.main-content,.ps-page) {
  color: var(--ui-text, var(--ux-text));
}
html[data-theme="dark"] :where(.dashboard-content,.main-content,.ps-page)
  :is(.card,.panel,.form-card,.dashboard-panel,.content-card,.settings-card,.report-card,.mail-card,.delete-card,
      .sa-card,.sa-head,.ks-panel,.ks-card,.cs-panel,.cs-card,.cs-empty,.table-container,.table-responsive,
      .permission-group-card,.review-meta-strip,.settings-actions,.form-section,.empty-state,.strength-label,
      .strength-requirements span,.checkmark,.ntf-row,.dropdown-menu,.list-group-item,.accordion-item,.accordion-body,
      .modal-content,.offcanvas,.popover) {
  background-color: var(--ui-surface, var(--ux-surface)) !important;
  border-color: var(--ui-line, var(--ux-border)) !important;
  color: var(--ui-text, var(--ux-text)) !important;
}
html[data-theme="dark"] :where(.dashboard-content,.main-content,.ps-page)
  :is(.card-header,.card-footer,.modal-header,.modal-footer,.accordion-header,.dropdown-header,.table-light,thead th) {
  background-color: var(--ui-soft, var(--ux-surface-soft)) !important;
  border-color: var(--ui-line, var(--ux-border)) !important;
  color: var(--ui-text, var(--ux-text)) !important;
}
html[data-theme="dark"] :where(.dashboard-content,.main-content,.ps-page)
  :is(h1,h2,h3,h4,h5,h6,legend,dt,dd,td,strong,.card-title,.modal-title,.dropdown-item,.list-group-item) {
  color: var(--ui-text, var(--ux-text));
}
html[data-theme="dark"] :where(.dashboard-content,.main-content,.ps-page)
  :is(p,small,.text-muted,.muted,.helptext,.form-text,.card-text) {
  color: var(--ui-muted, var(--ux-muted)) !important;
}
html[data-theme="dark"] :where(.dashboard-content,.main-content,.ps-page)
  :is(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),select,textarea,.form-control,.form-select) {
  border-color: var(--ui-line, var(--ux-border)) !important;
  background-color: var(--ui-soft, var(--ux-surface-soft)) !important;
  color: var(--ui-text, var(--ux-text)) !important;
  color-scheme: dark;
}
html[data-theme="dark"] :where(.dashboard-content,.main-content,.ps-page)
  :is(input,select,textarea,.form-control,.form-select)::placeholder {
  color: var(--ui-muted, var(--ux-muted)) !important;
  opacity: .9;
}
html[data-theme="dark"] :where(.dashboard-content,.main-content,.ps-page) table,
html[data-theme="dark"] :where(.dashboard-content,.main-content,.ps-page) :is(th,td) {
  border-color: var(--ui-line, var(--ux-border)) !important;
  color: var(--ui-text, var(--ux-text));
}
html[data-theme="dark"] :where(.dashboard-content,.main-content,.ps-page)
  :is(.btn-light,.btn-outline-secondary,.page-link,.accordion-button,.dropdown-item) {
  border-color: var(--ui-line, var(--ux-border)) !important;
  background-color: var(--ui-soft, var(--ux-surface-soft)) !important;
  color: var(--ui-text, var(--ux-text)) !important;
}
html[data-theme="dark"] :where(.dashboard-content,.main-content,.ps-page) .dropdown-item:hover,
html[data-theme="dark"] :where(.dashboard-content,.main-content,.ps-page) .list-group-item:hover {
  background-color: color-mix(in srgb, var(--ui-soft, var(--ux-surface-soft)) 78%, var(--ui-blue, var(--ux-primary)) 22%) !important;
}

/* Repair old inline light colors without touching semantic success/danger colors. */
html[data-theme="dark"] :where(.dashboard-content,.main-content,.ps-page)
  [style*="background: #fff" i],
html[data-theme="dark"] :where(.dashboard-content,.main-content,.ps-page)
  [style*="background:#fff" i],
html[data-theme="dark"] :where(.dashboard-content,.main-content,.ps-page)
  [style*="background: white" i],
html[data-theme="dark"] :where(.dashboard-content,.main-content,.ps-page)
  [style*="background-color: #fff" i] {
  background: var(--ui-surface, var(--ux-surface)) !important;
  border-color: var(--ui-line, var(--ux-border)) !important;
}
html[data-theme="dark"] :where(.dashboard-content,.main-content,.ps-page)
  :is([style*="color: #111" i],[style*="color:#111" i],[style*="color: #222" i],[style*="color:#222" i],
      [style*="color: #333" i],[style*="color:#333" i],[style*="color: #000" i],[style*="color:#000" i]) {
  color: var(--ui-text, var(--ux-text)) !important;
}

/* Customer library and notifications were previously light-only. */
.ps-page .ks-portal-heading :is(h1,h2,h3),
.ps-page .ks-library-title :is(h1,h2,h3),
.ps-page .ks-library-card h3,
.ps-page .ks-library-summary strong { color: var(--k-text) !important; }
.ps-page :is(.ks-portal-heading p,.ks-library-title p,.ks-library-card p,.ks-empty-state p),
.ps-page .ks-library-summary > * > span { color: var(--k-muted) !important; }
.ps-page :is(.ks-library-summary > div,.ks-library-summary > a,.ks-library-card,.ks-empty-state) {
  background: var(--k-card) !important;
  border-color: var(--k-border) !important;
  color: var(--k-text) !important;
}
.ps-page :is(.ks-library-summary > * > i:first-child,.ks-library-thumb,.ks-empty-state > i) {
  background: var(--k-primary-soft) !important;
  color: var(--k-primary) !important;
}
.ps-page :is(.ks-portal-heading span,.ks-library-card > div > span,.ks-library-card a) { color: var(--k-primary) !important; }
.ps-page .ks-download-action { background: var(--k-primary) !important; color: #fff !important; }

.ntf-bell,.ntf-dropdown,.ntf-footer {
  border-color: var(--ui-line, var(--ux-border)) !important;
  background: var(--ui-surface, var(--ux-surface)) !important;
  color: var(--ui-text, var(--ux-text)) !important;
}
.ntf-head,.ntf-item-title { color: var(--ui-text, var(--ux-text)) !important; }
.ntf-head,.ntf-footer,.ntf-item + .ntf-item { border-color: var(--ui-line, var(--ux-border)) !important; }
.ntf-item.unread,.ntf-bell:hover,.ntf-footer:hover { background: var(--ui-soft, var(--ux-surface-soft)) !important; }
.ntf-readall,.ntf-footer { color: var(--ui-blue, var(--ux-primary)) !important; }
.ntf-badge { box-shadow: 0 0 0 2px var(--ui-surface, var(--ux-surface)) !important; }

.ps-page .ntf-row {
  border-color: var(--k-border) !important;
  background: var(--k-card) !important;
  color: var(--k-text) !important;
}
.ps-page .ntf-row.unread { border-color: var(--k-primary) !important; background: var(--k-primary-soft) !important; }
.ps-page .ntf-row-main a { color: var(--k-text) !important; }
.ps-page :is(.ntf-row-main p,.ntf-row-time) { color: var(--k-muted) !important; }
.ps-page .ntf-page-list + div span,
.ps-page > div > h2[style] { color: var(--k-text) !important; }
.ps-page .btn-mark { background: var(--k-primary) !important; color: #fff !important; }

html[data-theme="light"] .mail-page {
  --mail-bg: #fff !important;
  --mail-soft: #f7f5ff !important;
  --mail-text: #211a3b !important;
  --mail-muted: #756d91 !important;
  --mail-border: #e6e0f5 !important;
  --mail-primary: #7c3aed !important;
}
html[data-theme="dark"] .mail-page {
  --mail-bg: #0a1a2c !important;
  --mail-soft: #0d2237 !important;
  --mail-text: #f4f9fd !important;
  --mail-muted: #91aabe !important;
  --mail-border: #24445d !important;
  --mail-primary: #3b82f6 !important;
}

/* Website City navigation fit — 2026-08-28 */
.nav-modern .nav-inner {
  width: min(calc(100% - 32px), 1520px);
  max-width: none;
  margin-inline: auto;
}
.nav-links {
  flex: 1 1 auto;
  justify-content: center;
  flex-wrap: nowrap;
}
.nav-links > a,
.nav-mega-trigger > a,
.city-nav-link {
  white-space: nowrap;
}
.city-nav-link {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  flex: 0 0 auto;
}
.city-nav-link .fa-city { color: var(--ux-primary); }

@media (max-width: 1480px) and (min-width: 1221px) {
  .nav-modern .nav-inner { gap: 10px; }
  .nav-links { gap: 0; }
  .nav-links a { padding-inline: 8px; font-size: 13px; }
  .nav-actions { gap: 6px; }
  .nav-actions .btn-modern { padding-inline: 11px; }
  .nav-actions > .lang-switcher { margin-inline-end: 0; }
}

@media (max-width: 1220px) {
  .nav-links { display: none !important; }
  .nav-actions .hide-sm,
  .nav-actions > .lang-switcher { display: none !important; }
  .nav-burger {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    flex: 0 0 42px;
  }
  .mobile-drawer { display: flex !important; }
  .drawer-backdrop { display: block !important; }
}