/* NB adm42 — mobilnyy sloy. Vsyo vnutri media-zaprosa: desktop ne zatragivaetsya. */
@media (max-width: 640px) {

  html, body { max-width: 100%; overflow-x: hidden; }
  img, video, canvas, svg, iframe { max-width: 100%; height: auto; }

  /* zhyostkie shiriny iz inline-stiley — po shirine ekrana */
  [style*="width:560px"], [style*="width: 560px"],
  [style*="width:640px"], [style*="width: 640px"],
  [style*="width:760px"], [style*="width: 760px"],
  [style*="width:800px"], [style*="width: 800px"],
  [style*="width:900px"], [style*="width: 900px"],
  [style*="width:960px"], [style*="width: 960px"],
  [style*="width:980px"], [style*="width: 980px"],
  [style*="width:1320px"], [style*="width: 1320px"],
  [style*="min-width:420px"], [style*="min-width: 420px"] {
    width: auto !important; min-width: 0 !important; max-width: 100% !important;
  }

  .container, .container-fluid, .nb-wrap, .nbf2, .nbd, .nbs, main, .content {
    width: auto !important; max-width: 100% !important;
    padding-left: 12px !important; padding-right: 12px !important;
  }

  /* lyubaya setka — v odnu kolonku */
  [style*="grid-template-columns"], .row-cols-2, .row-cols-3, .row-cols-4 {
    grid-template-columns: 1fr !important;
  }

  /* tablicy: po umolchaniyu gorizontalnaya prokrutka vmesto razyezda */
  table { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; max-width: 100%; }

  /* "Finansy": kazhdaya operaciya — kartochka */
  table.nbf2__ops, table.nbf2__ops tbody, table.nbf2__ops tr, table.nbf2__ops td { display: block; width: 100%; }
  table.nbf2__ops { overflow: visible; }
  table.nbf2__ops tr { border-bottom: 1px solid #ece9f6; padding: 12px 0; }
  table.nbf2__ops td { padding: 2px 0; border: 0; }
  table.nbf2__ops .nbf2__when { font-size: 12px; color: #8b8b98; }
  table.nbf2__ops .nbf2__amt { font-size: 17px; font-weight: 700; }
  table.nbf2__ops .nbf2__amt, table.nbf2__ops .nbf2__st { display: inline-block !important; width: auto !important; margin-right: 10px; }
  .nbf2__what img { width: 44px !important; height: 44px !important; object-fit: cover; }

  /* plitki i knopki pod palec */
  button, .btn, a.btn, input[type="submit"], .av-btn { min-height: 44px; }
  input, select, textarea { font-size: 16px; }   /* inache iOS zumit stranicu pri fokuse */

  /* plavayushchie paneli ne dolzhny zakryvat ves ekran */
  .av-batch { left: 8px !important; right: 8px !important; transform: none !important; width: auto !important; }
  .nbd-toast { left: 8px !important; right: 8px !important; transform: none !important; width: auto !important; }

  /* dlinnye adresa i promty ne rastyagivayut stranicu */
  td, p, span, div { overflow-wrap: anywhere; }
}

/* adm46 shapka kabineta — tolko na uzkom ekrane */
@media (max-width: 991.98px) {

  /* menyu profilya vozvrashchaetsya: v nyom "Nastroyki profilya", "Uvedomleniya", "Vyyti" */
  .app-header .profile-dropdown { display: block !important; }
  .app-header .profile-dropdown .dropdown-menu {
    position: fixed !important;
    top: 62px !important; right: 8px !important; left: auto !important;
    transform: none !important;
    max-width: calc(100vw - 16px);
    max-height: 72vh; overflow-y: auto;
  }

  /* otdelnaya knopka vyhoda ryadom s globusom */
  #nb-mob-logout {
    display: inline-flex !important;
    align-items: center; justify-content: center;
    width: 44px; height: 44px;
    margin-left: 4px;
    border-radius: 10px;
    color: inherit; opacity: .85;
    flex: 0 0 auto;
  }
  #nb-mob-logout:hover, #nb-mob-logout:active { opacity: 1; background: rgba(127,127,127,.14); }
  #nb-mob-logout svg { display: block; }

  /* verhnyaya stroka kabineta ne dolzhna razezzhatsya */
  .app-header .container > .d-flex { flex-wrap: nowrap !important; }
  .app-header .nb-rub { white-space: nowrap; font-size: 13px; }
}

/* adm47 korzina — knopka vozvrata (deystvuet na lyuboy shirine) */
#nbRestoreBtn {
  margin-right: 10px;
  padding: 7px 14px;
  border: 1px solid #b9a6f5;
  border-radius: 8px;
  background: #f3efff;
  color: #4a2fbd;
  font-weight: 600;
  cursor: pointer;
}
#nbRestoreBtn:hover { background: #e9e1ff; }
#nbRestoreBtn:disabled { opacity: .6; cursor: default; }

/* adm47 shapka kabineta na telefone */
@media (max-width: 991.98px) {
  .app-header .header-brand,
  .app-header a.header-brand { display: none !important; }

  .app-header .app-sidebar__toggle2,
  .app-header .app-sidebar__toggle {
    margin-left: 0 !important;
    padding-left: 0 !important;
    order: -1 !important;
  }
  .app-header .container,
  .app-header > .container { padding-left: 10px !important; padding-right: 10px !important; }
}

/* adm55 mobilnaya chast — publichnye stranicy i kabinet (do 992px) */
@media (max-width: 991.98px) {

  /* ===== 1. PUBLICHNYE STRANICY: verhnyaya chast dlya gostya ===== */

  /* u gostya v menyu nichego ne ostayotsya — pryachem vsyu zakreplyonnuyu shapku */
  body.nb-guest-mobile .container-fluid.fixed-top,
  body.nb-guest-mobile nav.navbar { display: none !important; }

  /* polosa vhoda — zakreplena u verha ekrana */
  #nb-guest-bar {
    position: fixed !important;
    top: 0 !important; left: 0 !important; right: 0 !important;
    width: 100% !important;
    margin: 0 !important; padding: 0 !important;
    border: 0 !important; border-radius: 0 !important;
    z-index: 2000 !important;
    background: #2b3145;
    box-shadow: 0 2px 10px rgba(0, 0, 0, .22);
    padding-top: env(safe-area-inset-top, 0px);
  }

  /* shirokiy logotip — pervym v potoke, pri prokrutke uezzhaet */
  #nb-logo-strip {
    display: block !important;
    width: 100% !important;
    margin: var(--nb-bar-h, 64px) 0 0 !important;
    line-height: 0;
    background: #0b1f3f;
  }
  #nb-logo-strip img { display: block; width: 100%; height: auto; }

  /* blok vnutri polosy — odnoy strokoy */
  #nb-guest-bar > #login-buttons, #login-buttons.pr-4 {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 10px;
    width: 100% !important; max-width: 100% !important;
    padding: 10px 14px !important;
    margin: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    position: relative !important;
  }

  /* "Voyti" i vybor yazyka na telefone ne nuzhny */
  #login-buttons #login-button,
  #login-buttons #frontend-local,
  #login-buttons .header-languages { display: none !important; }

  /* obyortka iz shaga stu22: byla "knopka, a pod ney logotipy" — stanovitsya strokoy */
  #login-buttons .nb-reg-wrap {
    position: static !important;
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: space-between !important;
    width: 100% !important;
    margin: 0 !important; padding: 0 !important;
    background: transparent !important;
  }

  /* logotipy socsetey — vlevo, s zapasom pod palec */
  #login-buttons .nb-reg-wrap .header-social-login,
  #login-buttons .header-social-login {
    position: static !important;
    left: auto !important; right: auto !important; top: auto !important;
    order: -1 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 18px !important;
    width: auto !important; margin: 0 !important;
    flex: 0 0 auto !important;
  }
  #login-buttons .header-social-login > a {
    display: inline-flex !important;
    align-items: center; justify-content: center;
    width: 44px !important; height: 44px !important;
    margin: 0 !important; flex: 0 0 auto !important;
  }
  #login-buttons .header-social-login img { max-width: 34px; max-height: 34px; }

  /* "Zaregistrirovatsya" — vpravo, belym tekstom */
  #login-buttons .register-button,
  #login-buttons a.action-button {
    order: 2 !important;
    width: auto !important; margin: 0 !important;
    padding: 0 18px !important;
    min-height: 44px; line-height: 44px;
    white-space: nowrap; text-align: center;
    flex: 0 0 auto !important;
    color: #fff !important;
  }
  #login-buttons .register-button *,
  #login-buttons a.action-button * { color: #fff !important; }

  /* ===== 2. KABINET: tolko tam, gde u body est klass "app" ===== */

  body.app .app-sidebar, body.app aside.app-sidebar {
    position: fixed !important;
    top: 0 !important; left: 0 !important; bottom: 0 !important;
    width: 84vw !important; max-width: 320px !important;
    z-index: 2200 !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch;
    transform: translateX(-100%) !important;
    transition: transform .22s ease-out !important;
    box-shadow: 0 0 24px rgba(0, 0, 0, .28);
  }
  body.app.nb-nav-open .app-sidebar,
  body.app.nb-nav-open aside.app-sidebar { transform: translateX(0) !important; }

  #nb-nav-backdrop {
    position: fixed; inset: 0;
    background: rgba(12, 16, 28, .5);
    z-index: 2100;
    opacity: 0; pointer-events: none;
    transition: opacity .22s ease-out;
  }
  body.nb-nav-open #nb-nav-backdrop { opacity: 1; pointer-events: auto; }
  body.nb-nav-open { overflow: hidden; }

  /* soderzhimoe kabineta — na vsyu shirinu, bez mesta pod menyu */
  body.app .app-content, body.app .side-app, body.app .main-content {
    margin-left: 0 !important;
    margin-right: 0 !important;
    width: auto !important;
    max-width: 100% !important;
    padding-left: 10px !important;
    padding-right: 10px !important;
  }
  body.app .app-content > .side-app { padding-left: 0 !important; padding-right: 0 !important; }
  body.app .app-content .d-flex { flex-wrap: wrap !important; }
  body.app .app-content .card { max-width: 100% !important; }
  body.app .app-content [style*="grid-template-columns"] { grid-template-columns: 1fr !important; }
  body.app .app-content table,
  body.app .app-content .table-responsive {
    display: block; max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch;
  }

  /* ===== 3. obshchee dlya vseh stranic ===== */
  html, body { max-width: 100%; overflow-x: hidden; }
  img, video, canvas, svg, iframe { max-width: 100%; height: auto; }
  input, select, textarea { font-size: 16px; }
}

/* adm57 menyu studii — na telefone v menyu tolko razdely kabineta */
@media (max-width: 991.98px) {

  /* plitki intentov i zerkalo stiley (oni vlozheny v li#nbInt) — tolko na stranice,
     v vyezzhayushchem menyu ih net: inache razdely kabineta uezzhayut daleko vniz */
  body.app .app-sidebar li#nbInt,
  body.app .app-sidebar #nbInt,
  body.app .app-sidebar #nbStyles { display: none !important; }

  /* punkty menyu — pod palec */
  body.app .app-sidebar .side-menu > li > a {
    min-height: 48px;
    display: flex !important;
    align-items: center;
  }
  body.app .app-sidebar .side-menu { padding-bottom: 24px; }
}

/* adm59 studiya — ekrany generacii na telefone (do 992px) */
@media (max-width: 991.98px) {

  /* pilyulya "Moi raboty" v shapke szhimaetsya do 21px i vyglyadit pustoy knopkoy.
     Na telefone ubiraem — etot razdel est v levom menyu. */
  .app-header .nb-k37-works { display: none !important; }
  .app-header .nb-rub { flex: 0 0 auto !important; white-space: nowrap !important; }

  /* bolshaya plitka previu zanimala 252px iz 648 vidimyh — ogranichivaem */
  .nb-k34-hero, .nb-k36-hero { max-height: 190px !important; }
  .nb-k34-hero img, .nb-k36-hero img { max-height: 190px !important; object-fit: contain; }

  /* podpisi plitok ne dolzhny rvatsya po slogam */
  .av-style span, .av-shoot__themes span, .av-prof__pick span {
    word-break: keep-all !important;
    overflow-wrap: normal !important;
    hyphens: none !important;
    font-size: 12px !important;
    line-height: 1.15 !important;
    padding: 4px !important;
  }

  /* zakreplyonnaya nizhnyaya plashka — po krayam ekrana, bez sdviga */
  .av-batch {
    left: 8px !important; right: 8px !important;
    transform: none !important;
    width: auto !important; max-width: none !important;
    bottom: 12px !important;
    border-radius: 16px !important;
    padding: 10px 14px !important;
  }

  /* okno ozhidaniya i modalnye sloi */
  .av-auto-wait, #nbsPb { padding: 14px !important; }
  .av-auto-wait > *, #nbsPb > * { max-width: 100% !important; }

  /* krestik zakrytiya — pod palec i ne pod "chyolkoy" */
  .av-view__close {
    top: calc(8px + env(safe-area-inset-top, 0px)) !important;
    right: 8px !important;
    width: 44px !important; height: 44px !important;
    display: flex !important; align-items: center; justify-content: center;
  }

  /* knopki, chipy i polya */
  .av-btn { min-height: 46px; padding-left: 14px !important; padding-right: 14px !important; }
  .av-btn, .av-chip { white-space: normal !important; }
  .av-chip { min-height: 38px; display: inline-flex !important; align-items: center; }
  .av-textarea, .av-input { font-size: 16px !important; width: 100% !important; }

  /* zagolovki */
  .av-shoot__title { font-size: 19px !important; line-height: 1.25 !important; }
  .av-shoot__lead { font-size: 14px !important; }

  /* vsplyvayushchie podskazki shirinoy 340px */
  [style*="max-width:340px"], [style*="max-width: 340px"] {
    max-width: calc(100vw - 16px) !important; left: 8px !important;
  }

  /* animirovannyy zagolovok na glavnoy vylezal za kray (421px pri ekrane 374) */
  .ah-words-wrapper { max-width: 100% !important; }
}

/* adm62 studiya — dovodka po zameram na ekrane 390px (do 992px) */
@media (max-width: 991.98px) {

  /* --- "Vyberite stil" na telefone ne pokazyvaem celikom ---
     Shag 61 snyal u setki ogranichenie vysoty, i plitki poehali drug na druga:
     ogranichenie uderzhivalo raskladku, a ne tolko ekonomilo mesto.
     Pryachem ves blok — vmeste s zagolovkom, vkladkami i bolshoy plitkoy previu,
     chtoby ne ostavalsya zagolovok bez soderzhimogo. */
  .av-styles,
  #nbStyles,
  .av-styles__grid,
  .av-styles__tabs,
  .av-styles__head,
  .nb-k34-hero, .nb-k36-hero { display: none !important; }

  /* --- ostalnye setki: vysotu ne trogaem, chtoby ne povtorit tu zhe oshibku --- */
  .av-shoot__themes, .av-prof__pick, .av-gallery__grid {
    max-height: none !important;
    overflow: visible !important;
  }

  /* Polya i spiski: menshe 16px — iOS pri fokuse uvelichivaet vsyu stranicu */
  .av-input, select.av-input,
  .av-textarea, textarea.av-textarea,
  .av-shoot input, .av-shoot select, .av-shoot textarea {
    font-size: 16px !important;
  }

  /* Chekboksy byli 13px — melko dlya palca */
  input[type="checkbox"], input[type="radio"] {
    width: 20px !important; height: 20px !important;
    min-width: 20px; min-height: 20px;
  }

  /* Podpisi-ssylki tipa "o servise" — uvelichivaem zonu nazhatiya */
  .av-shoot a, .av-note a { padding: 4px 0; display: inline-block; }
}