/* Фирменный слой личного кабинета LANBilling, бренд «Ирбис Телеком».
   Файл написан целиком, одним проходом. Правки вносить точечно,
   не дописывая противоречащие правила в конец.

   Разметку даёт вендор, менять её нельзя. Ключевые особенности,
   с которыми приходится считаться:
   - строка шапки .row несёт инлайновый padding и бутстраповский клирфикс;
   - вендор до 769px прячет название правилом .name > p{display:none};
   - до 820px он же задаёт обёртке языка ширину 80px;
   - sidemenu.js открывает и закрывает меню инлайновым display у #sidebar,
     поэтому до 767px это свойство здесь не задаётся ни при каких условиях;
   - внутри #sidebar сидит бутстраповский .container, на широком экране
     он требует 1170px и даёт горизонтальную прокрутку;
   - .main получает от вендора margin-left:250px начиная с 768px.

   Элементы с префиксом irbis создаёт наш skin.js. */

:root{
  --navy:#002E63; --navy-2:#004C85; --navy-d:#00204a;
  --blue:#008CBC; --link:#00688C;
  --cta:#C4510A; --cta-h:#A8430A;
  --ink:#0B1F33; --soft:#46596B; --faint:#627480;
  --line:#E3E8ED; --line-2:#CFD8E0; --paper:#F4F7F9;
  --onnavy:#C7D6E5; --ok:#0A6B45; --err:#96271B;
  --font:"Golos Text",-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,Menlo,Consolas,monospace;
  --rail:250px; --hdr:60px; --pad:24px; --r:14px; --r-s:10px;
}

/* ── База ─────────────────────────────────────────────────────────── */
body,input,select,textarea,button,.btn,.form-control,
h1,h2,h3,h4,h5,h6,.panel,.nav,.dropdown-menu{font-family:var(--font) !important}
.glyphicon,.glyphicon:before{font-family:'Glyphicons Halflings' !important}
body{color:var(--ink) !important;background:#fff !important;-webkit-font-smoothing:antialiased}
h1,h2,h3,h4{color:var(--navy) !important;font-weight:700 !important;letter-spacing:-.02em !important}
a{color:var(--link)}
a:hover,a:focus{color:var(--navy)}
hr{border-top:1px solid var(--line) !important}
a:focus-visible,button:focus-visible,.btn:focus-visible{outline:2.5px solid var(--cta);outline-offset:2px}
input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--blue);outline-offset:2px}

/* ── Кнопки и поля вендора ────────────────────────────────────────── */
.btn{
  border-radius:999px !important;border:1px solid transparent !important;
  font:600 15px var(--font) !important;box-shadow:none !important;text-shadow:none !important;
  background-image:none !important;padding:0 20px !important;min-height:44px !important;
  display:inline-flex !important;align-items:center;justify-content:center;
}
.btn-default,.btn-primary,.btn-success,form .btn-default,form .btn-primary,
input[type=submit].btn,button[type=submit].btn{
  background:var(--cta) !important;color:#fff !important;border-color:var(--cta) !important;
}
.btn-default:hover,.btn-primary:hover,.btn-success:hover,
form .btn-default:hover,form .btn-primary:hover{background:var(--cta-h) !important;border-color:var(--cta-h) !important}
.btn.disabled,.btn:disabled{opacity:.45 !important}
.form-control,input[type=text],input[type=password],input[type=email],
input[type=tel],input[type=number],select,textarea{
  background:var(--paper) !important;border:1px solid var(--line) !important;
  border-radius:var(--r-s) !important;color:var(--ink) !important;box-shadow:none !important;
  min-height:44px !important;padding:0 14px !important;font-size:16px !important;
}
.form-control:focus,input:focus,select:focus,textarea:focus{
  background:#fff !important;border-color:var(--blue) !important;
  box-shadow:0 0 0 3px rgba(0,140,188,.16) !important;
}
::placeholder{color:var(--faint) !important;opacity:1}
label,.control-label{color:var(--soft) !important;font:600 13.5px var(--font) !important;margin-bottom:6px}

/* ── Шапка ────────────────────────────────────────────────────────
   Порядок один на всех ширинах: бургер, название по центру,
   колокольчик, язык. Бургер виден только до 767px. */
.header{position:fixed;left:0;right:0;z-index:1001}
.header > .row{
  position:relative;
  display:flex !important;align-items:center;justify-content:flex-end;gap:10px;
  margin:0 !important;
  height:var(--hdr);padding:0 var(--pad) !important;
  background:linear-gradient(100deg,var(--navy),var(--navy-2)) !important;
  border-bottom:none !important;
}
.header > .row::before,.header > .row::after{content:none !important}

.header .logo{display:none !important}
.header .sidebar-toggle-box{display:none !important}

.header .name{
  position:absolute;left:50%;top:0;transform:translateX(-50%);
  max-width:calc(100% - 220px);min-width:0;
  display:flex !important;align-items:center;justify-content:center;
  height:var(--hdr);margin:0 !important;padding:0 !important;background:none !important;
}
.header .name p{
  display:block !important;float:none !important;margin:0 !important;
  font:700 19px/1.2 var(--font) !important;letter-spacing:-.01em !important;
  color:#fff !important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%;
}

.header .notify-row{order:4;flex:0 0 auto;margin:0 !important;float:none !important}
.header .notify-row .top-menu{margin:0;padding:0;list-style:none}
/* Непрочитанных нет, значит и колокольчику в шапке делать нечего.
   Класс irbis-quiet ставит skin.js по счётчику. Раздел сообщений
   при этом остаётся доступен в боковом меню и в нижней панели. */
.header #header_inbox_bar.irbis-quiet{display:none !important}
#header_inbox_bar{position:relative;list-style:none;margin:0;padding:0}
#header_inbox_bar > a{
  display:flex;align-items:center;justify-content:center;
  width:40px;height:40px;padding:0 !important;border-radius:999px;
  background:rgba(255,255,255,.10) !important;border:1px solid rgba(255,255,255,.32) !important;
}
#header_inbox_bar > a:hover{background:rgba(255,255,255,.22) !important}
#header_inbox_bar .glyphicon-bell{color:#fff !important;font-size:17px;top:0}
#header_inbox_bar.irbis-unread > a{
  background:var(--cta) !important;border-color:var(--cta) !important;
  animation:irbis-pulse 2.2s ease-out infinite;
}
@keyframes irbis-pulse{
  0%{box-shadow:0 0 0 0 rgba(196,81,10,.55)}
  70%{box-shadow:0 0 0 9px rgba(196,81,10,0)}
  100%{box-shadow:0 0 0 0 rgba(196,81,10,0)}
}
.irbis-bell-badge{
  position:absolute;top:-3px;right:-3px;z-index:2;
  min-width:18px;height:18px;padding:0 5px;border-radius:999px;
  background:#fff;color:var(--cta);font:700 11px/18px var(--font);text-align:center;
}

.header > .row > .header-right{
  order:5;flex:0 0 auto;display:flex !important;align-items:center;gap:10px;
  margin:0 !important;padding:0 !important;float:none !important;
}
.header-right > *{margin:0 !important;float:none !important}
.header-right .lang-select-wrapper{position:relative;width:auto !important}
.header-right .lang-select{
  display:flex;align-items:center;gap:8px;
  height:40px;padding:0 30px 0 12px !important;border-radius:999px !important;
  background:rgba(255,255,255,.10) !important;border:1px solid rgba(255,255,255,.32) !important;
  color:#fff !important;font-size:14px;
}
.header-right .lang-select::after{right:12px !important;border-color:#fff !important}
.header-right .lang-label{color:#fff !important}
.header-right .lang-options{right:0;left:auto;min-width:160px;z-index:20}
.header-right .max-icon a,.header-right .telegram-icon a{
  display:flex;align-items:center;justify-content:center;
  width:40px;height:40px;padding:0 !important;border-radius:999px;
  background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.32);
}
.header-right .max-icon a:hover,.header-right .telegram-icon a:hover{background:rgba(255,255,255,.22)}
.header-right .max-image,.header-right .telegram-image{width:22px;height:22px}

/* ── Кнопка «Оплатить» в шапке, ставит skin.js ───────────────────── */
.irbis-pay{
  order:3;flex:0 0 auto;display:flex;align-items:center;
  height:40px;padding:0 22px;border-radius:999px;
  background:var(--cta);color:#fff !important;
  font:700 14.5px var(--font);text-decoration:none !important;white-space:nowrap;
}
.irbis-pay:hover,.irbis-pay:focus{background:var(--cta-h);color:#fff !important}

/* ── Полоса о непрочитанном, ставит skin.js ───────────────────────── */
.irbis-unread-bar{
  display:flex;align-items:center;gap:10px;
  margin:0 0 16px;padding:12px 16px;border-radius:var(--r);
  background:#FBF1DC;color:#6B4A00 !important;border:1px solid #EBD9AE;
  font:600 14.5px/1.4 var(--font);text-decoration:none !important;
}
.irbis-unread-bar:hover{background:#F7E7C4}
.irbis-unread-dot{flex:none;width:9px;height:9px;border-radius:50%;background:var(--cta)}
.irbis-unread-text{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.irbis-unread-cta{flex:none;background:var(--cta);color:#fff;border-radius:999px;padding:6px 14px;font:700 13px var(--font)}
.irbis-menu-badge{
  display:inline-block;margin-left:8px;min-width:20px;padding:0 6px;border-radius:999px;
  background:var(--cta);color:#fff;font:700 11.5px/20px var(--font);text-align:center;vertical-align:1px;
}

/* ── Боковая панель ───────────────────────────────────────────────── */
.navbar-fixed-side{background:var(--navy-d)}
.navbar-fixed-side .navbar-nav{background:transparent !important;margin:0 !important;float:none !important;width:100%}
.navbar-fixed-side .navbar-nav li{float:none}
.navbar-fixed-side .navbar-nav li > a{
  display:block;color:var(--onnavy) !important;font:600 15px/1.35 var(--font) !important;
  padding:12px 20px !important;border-left:3px solid transparent !important;
  border-radius:0 !important;box-shadow:none !important;text-decoration:none;
}
.navbar-fixed-side .navbar-nav li > a:hover,
.navbar-fixed-side .navbar-nav li > a:focus{background:rgba(255,255,255,.07) !important;color:#fff !important}
.navbar-fixed-side .navbar-nav .nav-menu-item-selected > a,
.navbar-fixed-side .navbar-nav .active > a{
  background:rgba(255,255,255,.12) !important;color:#fff !important;border-left-color:var(--cta) !important;
}
.navbar-fixed-side .nav-menu-item-expanded > a{font-weight:700 !important}
.navbar-fixed-side .sidebar-nav-submenu{
  background:rgba(0,0,0,.20) !important;margin:0 !important;padding:4px 0 !important;
  border:none !important;border-radius:0 !important;
}
.navbar-fixed-side .sidebar-nav-submenu li:before,
.navbar-fixed-side .sidebar-nav-submenu li:after{display:none !important}
.navbar-fixed-side .sidebar-nav-submenu li > a{
  padding:10px 20px 10px 38px !important;font:500 14px/1.3 var(--font) !important;border-left:none !important;
}
.navbar-fixed-side .sidebar-nav-submenu .nav-menu-item-selected > a{background:rgba(255,255,255,.10) !important;color:#fff !important}

.irbis-rail-bottom{
  padding:16px 16px 20px;border-top:1px solid rgba(255,255,255,.16);
  display:flex;flex-direction:column;gap:10px;
}
.irbis-rail-bottom .logout{float:none !important;margin:0 !important}
.irbis-rail-bottom .logout > a{
  width:100%;height:42px;margin:0 !important;
  background:rgba(255,255,255,.10) !important;border:1px solid rgba(255,255,255,.32) !important;
  color:#fff !important;border-radius:999px;font:700 14.5px var(--font) !important;
}
.irbis-rail-bottom .logout > a:hover{background:rgba(255,255,255,.20) !important}

/* ── Содержимое ───────────────────────────────────────────────────── */
.main,section.wrapcontent{background:#fff !important}
.wrapcontent{padding-top:var(--hdr) !important;padding-bottom:0 !important}
.main > .container-fluid > .row{margin-left:0 !important;margin-right:0 !important}
.breadcrumb{background:transparent !important;padding:0 !important;margin:0 0 2px !important;font-size:13.5px !important}
.breadcrumb a{color:var(--link) !important}
.breadcrumb .divider{color:var(--faint) !important;margin:0 6px}
.breadcrumb > .active,.breadcrumb > span:last-child{color:var(--faint) !important}
.irbis-page-title{margin:0 0 16px !important;font:700 26px/1.15 var(--font) !important;letter-spacing:-.02em !important;color:var(--navy) !important}

.content-panel{
  background:#fff !important;border:1px solid var(--line) !important;border-radius:var(--r) !important;
  box-shadow:none !important;padding:18px 20px !important;margin:0 0 16px !important;
}
.content-panel .content-panel{border:none !important;padding:0 !important;margin:0 !important}
.agreement__info > .content-panel{margin-bottom:0 !important}
.content-panel > h4{margin:0 0 6px !important;font:700 14px var(--font) !important;color:var(--navy) !important}
.content-panel > h3{margin:0 0 12px !important;font-size:21px !important}
.content-panel > h3:empty,.content-panel > h4:empty{display:none}
.sharedpost__message-text{max-width:70ch !important;padding:0 !important;line-height:1.6;color:var(--ink) !important}

/* Карточки главной: пять строк .panel-form-table вендора */
.agreement__info .form-group.panel-form{display:grid;gap:14px;align-items:stretch}
.agreement__info .panel-form-table{
  display:flex !important;flex-direction:column;justify-content:center;gap:6px;
  margin:0 !important;padding:16px 18px;
  background:#fff;border:1px solid var(--line);border-radius:var(--r);
}
.agreement__info .panel-form-item{display:block !important;width:auto !important;margin:0 !important;padding:0 !important}
.agreement__info .panel-form-item-label p{
  margin:0 !important;font:600 12px var(--font) !important;letter-spacing:.06em !important;
  text-transform:uppercase !important;color:var(--faint) !important;
}
.agreement__info .panel-form-item-value{font:700 20px var(--font) !important;color:var(--ink) !important;font-variant-numeric:tabular-nums}
.agreement__info .panel-form-table:has(.balance-block){
  background:linear-gradient(150deg,var(--navy),var(--navy-2)) !important;
  border-color:transparent !important;padding:20px 22px;
}
.panel-form-table:has(.balance-block) .panel-form-item-label p{color:var(--onnavy) !important}
.panel-form-table:has(.balance-block) .balance-block{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.panel-form-table:has(.balance-block) .balance-home{order:1;font:700 34px/1.05 var(--font) !important;font-variant-numeric:tabular-nums}
.panel-form-table:has(.balance-block) .balance-block > a.btn{order:2}
.panel-form-table:has(.balance-block) [style*="green"]{color:#7BE0B0 !important}
.panel-form-table:has(.balance-block) [style*="red"]{color:#FF9E90 !important}
.agreement__info .table-cell{display:block !important}
.agreement__info .form-group.panel-form select{width:100% !important;margin:0 !important}

/* Таблица учётных записей */
.panel-grid-wrapper,td.panel-grid-cell-container{overflow-x:auto}
table.panel-grid{width:100%;margin:0 !important;border:1px solid var(--line);border-radius:var(--r);border-collapse:separate;border-spacing:0;overflow:hidden}
table.panel-grid th,table.panel-grid td{padding:14px 16px !important;vertical-align:middle !important;border:none !important}
table.panel-grid thead th,.grid-head th{
  background:var(--paper) !important;color:var(--faint) !important;
  font:600 12.5px var(--mono) !important;letter-spacing:.06em !important;text-transform:uppercase !important;
  text-align:left !important;border-bottom:1px solid var(--line) !important;
}
table.panel-grid tbody td{border-top:1px solid var(--line) !important;color:var(--ink) !important}
table.panel-grid tbody tr:first-child td{border-top:none !important}
.panel-grid-row-odd{background:#fff !important}
table.panel-grid tbody tr:hover td{background:var(--paper) !important}
table.panel-grid a{color:var(--link) !important;white-space:nowrap}
.tar-curshape{color:var(--faint);font-size:13px}
.irbis-pill{display:inline-block;padding:4px 11px;border-radius:999px;font:600 12.5px var(--font);white-space:nowrap}
.irbis-pill-off{background:#FBE9E7;color:var(--err)}
.irbis-pill-on{background:#E3F5EC;color:var(--ok)}
.irbis-pill-wait{background:var(--paper);color:var(--soft)}

/* Плитка разделов */
.partition{display:grid;gap:12px}
.partition > a{display:block;text-decoration:none !important}
.partition .content-panel{margin:0 !important;height:100%;display:flex;align-items:center;padding:18px 20px !important;transition:border-color .15s,box-shadow .15s}
.partition > a:hover .content-panel{border-color:var(--blue) !important;box-shadow:0 8px 20px -14px rgba(0,46,99,.45) !important}
.partition .content-panel-inner{width:100%;display:flex;align-items:center;justify-content:space-between;gap:14px}
.partition h3{margin:0 !important;font:700 16.5px var(--font) !important}
.partition .content-panel-inner::after{content:"";flex:none;width:9px;height:9px;border-right:2px solid var(--faint);border-bottom:2px solid var(--faint);transform:rotate(-45deg)}
.partition > a:hover .content-panel-inner::after{border-color:var(--cta)}

/* Карточка контактов, собирает skin.js */
.irbis-contacts{margin-top:24px;padding:20px;background:var(--paper);border:1px solid var(--line);border-radius:var(--r)}
.irbis-contacts h2{margin:0 0 14px !important;font:700 17px var(--font) !important}
.irbis-contacts__grid{display:grid;gap:12px}
.irbis-contacts__c{background:#fff;border:1px solid var(--line);border-radius:var(--r-s);padding:14px 16px;display:flex;flex-direction:column;gap:2px}
.irbis-contacts__raw{margin:0 !important;font-size:14.5px !important;color:var(--soft) !important;line-height:1.6}
.irbis-contacts__l{font:600 12px var(--font);letter-spacing:.06em;text-transform:uppercase;color:var(--faint)}
.irbis-contacts__t{font:700 19px var(--font) !important;color:var(--navy) !important;text-decoration:none !important;font-variant-numeric:tabular-nums}
.irbis-contacts__t:hover{color:var(--cta) !important}
.irbis-contacts__m{font-size:14px !important;color:var(--link) !important;text-decoration:none !important}

/* Сообщения и подвал */
.alert{border-radius:var(--r-s) !important;border:none !important;font-size:14.5px !important}
.alert-success{background:#E3F5EC !important;color:var(--ok) !important}
.alert-danger,.alert-error{background:#FBE9E7 !important;color:var(--err) !important}
.alert-info{background:#E6F4FA !important;color:var(--link) !important}
.site-footer{background:var(--paper) !important;border-top:1px solid var(--line) !important;padding:14px var(--pad) !important;color:var(--faint) !important;font-size:13px !important}
.site-footer .footer-copy{margin:0 !important}
.site-footer .footer-copy br{display:none}
.footer-menu{margin:0 !important;padding:0 !important;list-style:none;display:flex;gap:18px;flex-wrap:wrap}
.footer-menu-link{color:var(--link) !important;font-weight:600}
#cookie-notice{background:#fff !important;color:var(--ink) !important;border:1px solid var(--line) !important;border-radius:16px !important}
#cookie-notice .cookie-text{color:var(--soft) !important;font-size:14.5px !important}
#cookie-accept{background:var(--cta) !important;border-color:var(--cta) !important;color:#fff !important}
.modal-content,.popbox-wrap{border-radius:var(--r) !important;border:none !important}
.modal-header{border-bottom:1px solid var(--line) !important}
.modal-header h4,.modal-title{color:var(--navy) !important}

/* ── Экран входа ──────────────────────────────────────────────────── */
body.guest{background:linear-gradient(165deg,var(--navy),var(--navy-2) 66%,#00699E) !important;background-attachment:fixed !important;min-height:100vh}
body.guest .container-fluid{background:transparent !important;padding:0 !important}
body.guest #content-center.logincontentblock{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:28px 16px}
.loginblock{
  position:relative;max-width:880px !important;width:100%;margin:0 !important;padding:0 !important;
  background:#fff !important;border:none !important;border-radius:18px !important;overflow:hidden;
  text-align:left !important;box-shadow:0 40px 90px -40px rgba(0,16,40,.7) !important;
}
.loginblock .login-content{
  background:#fff !important;padding:0 !important;display:grid;
  grid-template-columns:340px minmax(0,1fr);grid-template-rows:auto auto auto 1fr auto;
  grid-template-areas:"brand lang" "brand title" "brand err" "brand form" "brand pay";
}
.loginblock .login-content::before{
  content:"";grid-area:brand;min-height:470px;
  background-image:
    radial-gradient(120% 80% at 12% 6%,rgba(124,208,245,.22),rgba(124,208,245,0) 60%),
    linear-gradient(160deg,var(--navy),#003C72 62%,#005B96);
  background-repeat:no-repeat,no-repeat;
  background-position:center,center;
  background-size:cover,cover;
}
/* Знак на карточке входа. Брендовая колонка высокая и узкая, поэтому
   берём вертикальный вариант знака и ставим его по центру верхней
   трети. Размер задаём по высоте: пропорции у трёх знаков разные. */
[data-site] .loginblock .login-content::before{
  background-repeat:no-repeat,no-repeat,no-repeat !important;
  background-position:center 46px,center,center !important;
  background-size:auto 112px,cover,cover !important;
}
[data-site="irbis"] .loginblock .login-content::before{
  background-image:url("/irbis-skin/logo-v-white.svg"),
    radial-gradient(120% 80% at 12% 6%,rgba(124,208,245,.22),rgba(124,208,245,0) 60%),
    linear-gradient(160deg,var(--navy),#003C72 62%,#005B96) !important;
}
[data-site="itk"] .loginblock .login-content::before{
  background-image:url("/irbis-skin/logo-itk-white.svg"),
    radial-gradient(120% 80% at 12% 6%,rgba(124,208,245,.22),rgba(124,208,245,0) 60%),
    linear-gradient(160deg,var(--navy),#003C72 62%,#005B96) !important;
}
[data-site="mir"] .loginblock .login-content::before{
  background-image:url("/irbis-skin/logo-mir-white.svg"),
    radial-gradient(120% 80% at 12% 6%,rgba(124,208,245,.22),rgba(124,208,245,0) 60%),
    linear-gradient(160deg,var(--navy),#003C72 62%,#005B96) !important;
}
@media (max-width:899px){
  [data-site] .loginblock .login-content::before{
    background-position:center 26px,center,center !important;
    background-size:auto 74px,cover,cover !important;
  }
}
.loginblock > .login-content > p{grid-area:brand;align-self:end;max-width:none !important;margin:0 !important;padding:0 34px 36px !important;color:var(--onnavy) !important;font-size:14.5px !important;line-height:1.55 !important}
.loginblock > .login-content > .lang-select-position{position:static !important;grid-area:lang;justify-self:end;padding:18px 34px 0 !important;margin:0 !important}
.loginblock .lang-select{height:34px;padding:0 30px 0 12px !important;border:1px solid var(--line-2) !important;border-radius:999px !important;background:#fff !important;color:var(--soft) !important;font-size:13px}
.loginblock .lang-select::after{right:12px !important;border-color:var(--faint) !important}
.loginblock .lang-flag{width:18px;height:auto}
.loginblock .lang-options{right:34px;left:auto;min-width:160px;z-index:5}
.loginblock > .login-content > h2{
  grid-area:title;background:none !important;color:var(--navy) !important;max-width:none !important;
  margin:0 !important;padding:26px 40px 0 !important;font-size:26px !important;font-weight:700 !important;
  letter-spacing:-.02em !important;text-transform:none !important;text-align:left !important;border-radius:0 !important;
}
.loginblock > .login-content > .content-panel{grid-area:form;background:transparent !important;border:none !important;padding:20px 40px 26px !important;margin:0 !important}
.loginblock .panel-form,.loginblock .panel-form-item{background:transparent !important;border:none !important;box-shadow:none !important}
.loginblock .panel-form-item{
  float:none !important;width:100% !important;text-align:left !important;
  margin:0 0 12px !important;line-height:normal !important;
}
.loginblock form{width:auto !important;margin:0 !important;padding:0 !important}
.loginblock > .login-content > hr{display:none !important}
.loginblock .panel-form-item a{float:none !important;display:block;text-align:right;margin:9px 0 0 !important;font-size:13.5px !important}
.loginblock a[data-popbox-id="popbox-login"]{font-size:12.5px !important;color:var(--faint) !important;font-weight:400 !important}
.loginblock .login-btn,.loginblock #loginButton{width:100% !important;min-height:50px !important;margin-top:6px !important}
.irbis-pay-out{
  grid-area:pay;display:flex;flex-direction:column;gap:2px;
  margin:0 40px 32px !important;padding:20px 0 0 !important;
  border-top:1px solid var(--line) !important;text-decoration:none !important;
}
.irbis-pay-out__t{display:flex;align-items:center;gap:8px;font:700 14.5px var(--font);color:var(--navy);transition:color .15s}
.irbis-pay-out__t::after{content:"";flex:none;width:7px;height:7px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(-45deg);opacity:.7}
.irbis-pay-out:hover .irbis-pay-out__t{color:var(--cta)}
.irbis-pay-out__s{font:400 13px var(--font);color:var(--faint)}

/* ══ ПК, от 1024px ════════════════════════════════════════════════ */
@media (min-width:1024px){
  .wrapcontent > nav{
    position:fixed;top:var(--hdr);left:0;bottom:0;width:var(--rail);z-index:30;
    display:flex;flex-direction:column;background:var(--navy-d);
    padding:8px 0 0;overflow-y:auto;overflow-x:hidden;
  }
  .wrapcontent > nav .panel-block-wrap-menu,
  .wrapcontent > nav .panel-block-wrap-body-menu,
  .wrapcontent > nav .navbar-fixed-side,
  .wrapcontent > nav .container,
  .wrapcontent > nav .navbar-nav{
    position:static !important;width:100% !important;max-width:100% !important;min-height:0 !important;
    margin:0 !important;padding:0 !important;background:transparent !important;border:none !important;
    border-radius:0 !important;box-shadow:none !important;overflow:visible !important;float:none !important;
  }
  .wrapcontent > nav .panel-block-wrap-menu,
  .wrapcontent > nav .panel-block-wrap-body-menu{flex:1 1 auto;display:flex;flex-direction:column}
  #sidebar.navbar-fixed-side{display:flex !important;flex-direction:column;flex:1 1 auto}
  #sidebar > .container{flex:0 0 auto}
  .irbis-rail-bottom{margin-top:auto}
  .main{margin-left:var(--rail) !important;padding-top:20px !important}
  .main > .container-fluid{max-width:1360px;margin:0 auto;padding:0 var(--pad) !important}
  .site-footer{margin-left:var(--rail)}
  .agreement__info .form-group.panel-form{grid-template-columns:repeat(3,minmax(0,1fr))}
  .agreement__info .panel-form-table:has(.balance-block){grid-column:1 / 3;order:1}
  .agreement__info .panel-form-table:has(select){grid-column:3 / 4;order:2}
  .agreement__info .panel-form-table:not(:has(.balance-block)):not(:has(select)){order:3}
  .partition{grid-template-columns:repeat(auto-fill,minmax(300px,1fr));max-width:960px}
  .irbis-contacts__grid{grid-template-columns:1fr 1fr}
}

/* ══ Планшет, 768–1023px ══════════════════════════════════════════ */
@media (min-width:768px) and (max-width:1023px){
  .wrapcontent > nav{
    position:fixed;top:var(--hdr);left:0;bottom:0;width:220px;z-index:30;
    display:flex;flex-direction:column;background:var(--navy-d);
    padding:8px 0 0;overflow-y:auto;overflow-x:hidden;
  }
  .wrapcontent > nav .panel-block-wrap-menu,
  .wrapcontent > nav .panel-block-wrap-body-menu,
  .wrapcontent > nav .navbar-fixed-side,
  .wrapcontent > nav .container,
  .wrapcontent > nav .navbar-nav{
    position:static !important;width:100% !important;max-width:100% !important;min-height:0 !important;
    margin:0 !important;padding:0 !important;background:transparent !important;border:none !important;
    border-radius:0 !important;box-shadow:none !important;overflow:visible !important;float:none !important;
  }
  .wrapcontent > nav .panel-block-wrap-menu,
  .wrapcontent > nav .panel-block-wrap-body-menu{flex:1 1 auto;display:flex;flex-direction:column}
  #sidebar.navbar-fixed-side{display:flex !important;flex-direction:column;flex:1 1 auto}
  .irbis-rail-bottom{margin-top:auto}
  .main{margin-left:220px !important;padding-top:18px !important}
  .main > .container-fluid{padding:0 18px !important}
  .site-footer{margin-left:220px}
  .header > .row{padding:0 18px !important}
  .agreement__info .form-group.panel-form{grid-template-columns:1fr 1fr}
  .agreement__info .panel-form-table:has(.balance-block){grid-column:1 / -1;order:1}
  .partition{grid-template-columns:1fr 1fr}
  .irbis-contacts__grid{grid-template-columns:1fr 1fr}
}

/* ══ Телефон, до 767px ════════════════════════════════════════════
   Здесь НЕЛЬЗЯ задавать display у #sidebar: им управляет sidemenu.js. */
@media (max-width:767px){
  .header > .row{padding:0 12px !important;gap:8px}
  .header .name{max-width:calc(100% - 176px)}
  .header .name p{font-size:16px !important}
  .irbis-pay{display:none !important}
  .header .notify-row{display:block !important}
  #header_inbox_bar > a,
  .header-right .max-icon a,.header-right .telegram-icon a{width:38px;height:38px}
  .header-right .max-image,.header-right .telegram-image{width:20px;height:20px}
  .header-right{gap:8px}
  .header-right .lang-select-wrapper{width:38px !important;flex:0 0 38px}
  .header-right .lang-select{width:38px;height:38px;padding:0 !important;justify-content:center}
  .header-right .lang-label,.header-right .lang-select::after{display:none !important}

  .wrapcontent > nav,
  .wrapcontent > nav > .panel-block-wrap-menu,
  .wrapcontent > nav .panel-block-wrap-body-menu{
    margin:0 !important;padding:0 !important;height:0 !important;min-height:0 !important;
    border:none !important;background:none !important;box-shadow:none !important;overflow:visible !important;
  }
  #sidebar.navbar-fixed-side{
    position:fixed;top:var(--hdr);left:0;bottom:0;width:min(86vw,320px);
    margin:0 !important;padding:8px 0 24px;background:var(--navy-d);
    overflow-y:auto;overflow-x:hidden;z-index:1005;
    box-shadow:0 24px 60px -20px rgba(0,0,0,.55);
  }
  #sidebar > .container{width:auto !important;max-width:none !important;padding:0 !important;margin:0 !important}
  .navbar-fixed-side .navbar-nav li > a{padding:14px 20px !important;font-size:16px !important}
  .navbar-fixed-side .sidebar-nav-submenu li > a{padding:11px 20px 11px 38px !important}
  .irbis-rail-bottom{margin-top:16px}

  body > .container-fluid{min-width:0 !important;padding-left:0 !important;padding-right:0 !important}
  body{position:static !important}
  .main{margin-left:0 !important;padding-top:10px !important}
  .main > .container-fluid{max-width:none !important;padding:0 12px !important;margin:0 !important}
  .content-panel{padding:14px !important;margin-bottom:12px !important}
  .agreement__info .form-group.panel-form{grid-template-columns:1fr;gap:10px}
  .panel-form-table:has(.balance-block) .balance-home{font-size:28px !important}
  .partition{grid-template-columns:1fr}
  .irbis-contacts{padding:14px;margin-top:16px}
  .irbis-contacts__grid{grid-template-columns:1fr}
  .irbis-page-title{font-size:20px !important;margin-bottom:12px !important}
  .site-footer{padding:14px 12px !important}
  .irbis-unread-bar{margin-bottom:12px;padding:10px 12px;font-size:13.5px;flex-wrap:wrap;row-gap:8px}
  .irbis-unread-bar .irbis-unread-text{flex:1 1 100%;white-space:normal;overflow:visible}
  .irbis-unread-bar .irbis-unread-cta{margin-left:auto}

  /* Таблица учётных записей становится карточками: подпись берём из
     data-label, который вендор проставляет каждой ячейке. */
  table.panel-grid,table.panel-grid tbody,table.panel-grid tr,table.panel-grid td{display:block !important;width:auto !important}
  table.panel-grid thead{display:none !important}
  table.panel-grid{border:none !important}
  table.panel-grid tbody tr{border:1px solid var(--line);border-radius:var(--r);margin-bottom:12px;overflow:hidden;background:#fff}
  table.panel-grid tbody td.panel-grid-cell-container{display:block !important;text-align:left;padding:0 !important}
  table.panel-grid tbody td:not(.panel-grid-cell-container){
    display:flex !important;justify-content:space-between;gap:14px;
    padding:11px 14px !important;border-top:1px solid var(--line) !important;text-align:right;
  }
  table.panel-grid tbody tr td:first-child{border-top:none !important}
  table.panel-grid tbody td::before{
    content:attr(data-label);flex:0 0 auto;text-align:left;
    font:600 12px var(--font);letter-spacing:.04em;text-transform:uppercase;color:var(--faint);
  }
  table.panel-grid tbody td.panel-grid-cell-container::before{content:none}
}

@media (max-width:899px){
  .loginblock{max-width:440px !important}
  .loginblock .login-content{
    grid-template-columns:1fr;grid-template-rows:auto auto auto 1fr auto auto;
    grid-template-areas:"brand" "lang" "title" "form" "pay" "note";
  }
  .loginblock .login-content::before{min-height:126px}
  .loginblock > .login-content > p{grid-area:note;align-self:auto;color:var(--soft) !important;font-size:13.5px !important;padding:0 22px 22px !important}
  .loginblock > .login-content > .lang-select-position{padding:14px 22px 0 !important}
  .loginblock .lang-options{right:22px}
  .loginblock > .login-content > h2{padding:16px 22px 0 !important;font-size:21px !important}
  .loginblock > .login-content > .content-panel{padding:14px 22px 18px !important}
  .irbis-pay-out{margin:0 22px 20px !important;padding:16px 0 0 !important}
}

@media (prefers-reduced-motion:reduce){
  #header_inbox_bar.irbis-unread > a{animation:none}
}
@media print{
  .header,.wrapcontent > nav,.irbis-unread-bar{display:none !important}
  .main{margin-left:0 !important}
}

/* ── Мобильная навигация ──────────────────────────────────────────
   Две части, обе работают только до 767px.

   Нижняя панель разделов. Постоянно на виду, попадает под большой
   палец. Пункты берутся из боковой панели вендора: адреса, названия
   и признак текущего раздела читаются из разметки, ничего не
   дописывается. Последняя кнопка открывает шторку со всем меню.

   Шторка. Ей управляет sidemenu.js вендора, он переключает у #sidebar
   инлайновый display. Мы не трогаем это свойство, а следим за ним и
   вешаем на body класс irbis-menu-open: по нему появляется затемнение
   и проигрывается выезд. Нажатие на затемнение повторяет нажатие на
   бургер, поэтому логика открытия остаётся вендорской. */

.irbis-tabbar,.irbis-scrim{display:none}

@media (max-width:767px){
  .irbis-tabbar{
    position:fixed;left:0;right:0;bottom:0;z-index:1002;
    display:flex;align-items:stretch;gap:2px;
    padding:6px 6px calc(6px + env(safe-area-inset-bottom,0px));
    background:rgba(255,255,255,.94);
    -webkit-backdrop-filter:saturate(180%) blur(14px);
    backdrop-filter:saturate(180%) blur(14px);
    border-top:1px solid var(--line);
    box-shadow:0 -8px 24px -18px rgba(0,32,74,.5);
  }
  .irbis-tab{
    position:relative;flex:1 1 0;min-width:0;
    display:flex;flex-direction:column;align-items:center;gap:3px;
    padding:4px 2px;border:0;background:none;border-radius:12px;
    color:var(--faint) !important;text-decoration:none !important;
    font:600 10.5px/1.15 var(--font);text-align:center;cursor:pointer;
    -webkit-tap-highlight-color:transparent;
  }
  .irbis-tab__ico{
    display:flex;align-items:center;justify-content:center;
    width:46px;height:28px;border-radius:999px;transition:background .15s,color .15s;
  }
  .irbis-tab__ico .glyphicon{font-size:18px;top:0;line-height:1}
  .irbis-tab__t{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .irbis-tab:active .irbis-tab__ico{background:rgba(0,46,99,.10)}
  .irbis-tab--on{color:var(--navy) !important}
  .irbis-tab--on .irbis-tab__ico{background:rgba(0,140,188,.14)}
  .irbis-tab__n{
    position:absolute;top:-1px;left:50%;margin-left:6px;
    min-width:17px;height:17px;padding:0 5px;border-radius:999px;
    background:var(--cta);color:#fff;font:700 10.5px/17px var(--font);text-align:center;
  }
  .irbis-tab__n[hidden]{display:none}

  /* Место под панель, чтобы она не накрывала последнюю строку. */
  .main{padding-bottom:78px !important}
  .site-footer{padding-bottom:82px !important}

  /* Затемнение под шторкой. */
  .irbis-scrim{
    position:fixed;inset:0;z-index:1004;display:block;
    background:rgba(0,20,45,.5);opacity:0;pointer-events:none;transition:opacity .2s ease;
  }
  body.irbis-menu-open .irbis-scrim{opacity:1;pointer-events:auto}
  body.irbis-menu-open{overflow:hidden}
  body.irbis-menu-open #sidebar.navbar-fixed-side{animation:irbis-drawer .22s cubic-bezier(.2,.7,.3,1)}
  #sidebar.navbar-fixed-side{border-radius:0 18px 18px 0}
  @keyframes irbis-drawer{from{transform:translateX(-100%)}to{transform:translateX(0)}}
}

@media (max-width:767px) and (prefers-reduced-motion:reduce){
  body.irbis-menu-open #sidebar.navbar-fixed-side{animation:none}
  .irbis-scrim{transition:none}
}

/* ── Выезжающая панель подпунктов ─────────────────────────────────
   Второй уровень мобильного меню. Нажатие на раздел с вложенными
   пунктами не закрывает шторку, а надвигает поверх неё панель со
   списком подпунктов и строкой возврата.

   Занимает ту же геометрию, что и шторка, но лежит выше неё.
   Внутри самой шторки вложенные списки на телефоне не показываем:
   их место здесь. */
@media (max-width:767px){
  .irbis-sub{
    position:fixed;top:var(--hdr);left:0;bottom:0;width:min(86vw,320px);z-index:1006;
    background:var(--navy-d);border-radius:0 18px 18px 0;
    padding:0 0 24px;overflow-y:auto;overflow-x:hidden;
    box-shadow:0 24px 60px -20px rgba(0,0,0,.55);
    transform:translateX(100%);visibility:hidden;
    transition:transform .24s cubic-bezier(.2,.7,.3,1),visibility 0s linear .24s;
  }
  .irbis-sub--on{transform:translateX(0);visibility:visible;transition-delay:0s,0s}
  .irbis-sub__back{
    display:flex;align-items:center;gap:12px;width:100%;
    padding:15px 18px;border:0;border-bottom:1px solid rgba(255,255,255,.14);
    background:rgba(255,255,255,.06);color:#fff;
    font:700 15px var(--font);text-align:left;cursor:pointer;
    -webkit-tap-highlight-color:transparent;
  }
  .irbis-sub__back::before{
    content:"";flex:none;width:9px;height:9px;
    border-left:2px solid #fff;border-bottom:2px solid #fff;transform:rotate(45deg);
  }
  .irbis-sub .sidebar-nav-submenu{
    display:block !important;background:transparent !important;
    margin:0 !important;padding:6px 0 !important;border:none !important;list-style:none;
  }
  .irbis-sub .sidebar-nav-submenu li{float:none}
  .irbis-sub .sidebar-nav-submenu li > a{
    display:block;padding:13px 20px !important;
    font:600 15px/1.3 var(--font) !important;color:var(--onnavy) !important;
    text-decoration:none;border-left:3px solid transparent;
  }
  .irbis-sub .sidebar-nav-submenu li > a:active{background:rgba(255,255,255,.10);color:#fff !important}
  .irbis-sub .sidebar-nav-submenu .nav-menu-item-selected > a{
    background:rgba(255,255,255,.12);color:#fff !important;border-left-color:var(--cta);
  }

  /* Стрелка у разделов, про которые известно, что внутри есть пункты. */
  .navbar-fixed-side ul.sidebar-nav-menu > li.irbis-has-sub > a{position:relative;padding-right:42px !important}
  .navbar-fixed-side ul.sidebar-nav-menu > li.irbis-has-sub > a::after{
    content:"";position:absolute;right:20px;top:50%;width:8px;height:8px;
    border-right:2px solid currentColor;border-top:2px solid currentColor;
    transform:translateY(-50%) rotate(45deg);opacity:.7;
  }
  .navbar-fixed-side ul.sidebar-nav-menu > li > a[aria-busy="true"]{opacity:.55}

  /* Вложенный список внутри шторки не нужен: он показывается в панели. */
  #sidebar .sidebar-nav-submenu{display:none !important}
}

@media (max-width:767px) and (prefers-reduced-motion:reduce){
  .irbis-sub{transition:none}
}

/* ── Низ шторки на телефоне ───────────────────────────────────────
   Кнопка выхода прижата к нижнему краю экрана. Липкое прижатие здесь
   не подходит: оно ограничено рамками самого блока и на коротком
   списке разделов ведёт себя непредсказуемо. Берём фиксированное
   положение, ровно как у нижней панели разделов, которая на этом же
   экране рисуется верно. Показываем только при открытой шторке,
   иначе кнопка висела бы поверх страницы. */
@media (max-width:767px){
  #sidebar.navbar-fixed-side{padding-bottom:78px}
  #sidebar .irbis-rail-bottom{
    display:none;
    position:fixed;left:0;bottom:0;width:min(86vw,320px);
    margin:0;padding:11px 12px calc(11px + env(safe-area-inset-bottom,0px));
    background:var(--navy-d);
    border-top:1px solid rgba(255,255,255,.16);
    box-shadow:0 -10px 18px -14px rgba(0,0,0,.8);
  }
  body.irbis-menu-open #sidebar .irbis-rail-bottom{display:block}
  #sidebar .irbis-rail-bottom .logout{width:100%}
}

/* ── Плотность шторки ─────────────────────────────────────────────
   Разделов пятнадцать, при прежних отступах список не помещался и
   низ уезжал за край. Строки сжаты, углы выпрямлены, а выход и
   мессенджеры собраны в одну строку: значок на мессенджер, остаток
   ширины на кнопку выхода. */
@media (max-width:767px){
  #sidebar.navbar-fixed-side{border-radius:0;padding-top:4px}
  .irbis-sub{border-radius:0}

  .navbar-fixed-side .navbar-nav li > a{padding:11px 20px !important;font-size:15px !important}
  .navbar-fixed-side .sidebar-nav-submenu li > a{padding:10px 20px 10px 38px !important}
  .irbis-sub .sidebar-nav-submenu li > a{padding:11px 20px !important;font-size:14.5px !important}
  .irbis-sub__back{padding:13px 18px}

  #sidebar .irbis-rail-bottom .logout > a{height:44px}
}

/* ── Правки к мобильным карточкам таблицы ─────────────────────────
   Тема вендора ниже 450px задаёт подписи ячейки width:100% и
   float:left, а самой ячейке min-height:70px. В строке-флексе
   подпись забирала всю ширину, и значение сжималось до нуля:
   на экране оставались одни заголовки. Возвращаем подписи её
   собственную ширину и снимаем навязанную высоту. */
@media (max-width:767px){
  table.panel-grid tbody td::before{
    width:auto !important;max-width:52% !important;
    float:none !important;margin:0 !important;
  }
  table.panel-grid tbody td{
    min-height:0 !important;border-bottom:0 !important;font-size:14px !important;
  }
  table.panel-grid tbody td > *{min-width:0}
}

/* ── Подвал над нижней панелью ────────────────────────────────────
   Подвал упирался в панель разделов. Отводим ему полосу собственного
   отступа снизу, а не только внутреннего. */
@media (max-width:767px){
  .main{padding-bottom:16px !important}
  .site-footer{padding-bottom:14px !important;margin-bottom:84px}
}

/* ── Колокольчик слева ────────────────────────────────────────────
   Слева в шапке освободилось место после бургера. Колокольчик уходит
   туда и показывается только при непрочитанных: правило irbis-quiet
   выше по файлу прячет его, когда сообщать нечего. */
@media (max-width:767px){
  .header .notify-row{order:0;margin-right:auto !important}
}

/* ── Мессенджеры в шапке ──────────────────────────────────────────
   Вендор задаёт блоку padding:11px 15px 0 0 и картинке 28px, причём
   селектором специфичнее нашего: значок съезжал вниз и вправо и был
   крупнее соседей. Повторяем его специфичность и выравниваем по
   колокольчику и языку. */
.header > .row > .header-right .max-icon,
.header > .row > .header-right .telegram-icon{
  padding:0 !important;margin:0 !important;display:flex;align-items:center;
}
.header > .row > .header-right .max-icon .max-image,
.header > .row > .header-right .max-icon .telegram-image,
.header > .row > .header-right .telegram-icon .max-image,
.header > .row > .header-right .telegram-icon .telegram-image{
  width:22px !important;height:22px !important;display:block;
}
@media (max-width:767px){
  .header > .row > .header-right .max-icon .max-image,
  .header > .row > .header-right .max-icon .telegram-image,
  .header > .row > .header-right .telegram-icon .max-image,
  .header > .row > .header-right .telegram-icon .telegram-image{
    width:20px !important;height:20px !important;
  }
}

/* ── Компоновка главной на телефоне ───────────────────────────────
   Внешняя панель вендора давала вторую рамку вокруг карточек: рамка
   в рамке. На телефоне она становится прозрачной, карточки выходят
   на всю ширину колонки.

   Мелкие сведения встают по две в ряд, договор и баланс занимают всю
   ширину. Так экран заполняется вдвое плотнее и меньше прокрутки. */
@media (max-width:767px){
  .main .content-panel:has(.agreement__info){
    padding:0 !important;background:transparent !important;
    border:none !important;margin-bottom:0 !important;
  }
  .agreement__header{margin:0 0 12px !important;font-size:20px !important}

  .agreement__info .form-group.panel-form{grid-template-columns:1fr 1fr;gap:10px}
  .agreement__info .panel-form-table:has(select),
  .agreement__info .panel-form-table:has(.balance-block){grid-column:1 / -1}
  .agreement__info .panel-form-table{padding:13px 14px}
  .agreement__info .panel-form-item-value{
    font-size:17px !important;overflow-wrap:anywhere;
  }
  .agreement__info .panel-form-table:has(select) .panel-form-item-value{font-size:16px !important}
  .panel-form-table:has(.balance-block){padding:16px 18px}
  .panel-form-table:has(.balance-block) .balance-home{font-size:30px !important}

  .content.content-service{margin-top:14px}
  table.panel-grid tbody tr{margin-bottom:10px}
}

/* ── Язык в шапке одним флагом ────────────────────────────────────
   Название языка и стрелка убраны: в шапке остаётся круглая кнопка
   с флагом, одного размера с колокольчиком и мессенджером. Названия
   языков никуда не делись, они в раскрывающемся списке, где и нужны
   для выбора. На экране входа подпись оставлена: там место есть,
   а человек ещё не вошёл и может искать свой язык. */
.header-right .lang-select{
  width:40px;height:40px;padding:0 !important;justify-content:center;
}
.header-right .lang-label{display:none !important}
.header-right .lang-select::after{display:none !important}
.header-right .lang-flag{margin:0 !important;width:22px;height:15px;border-radius:2px}
.header-right .lang-options .lang-flag{margin-right:8px !important}
@media (max-width:767px){
  .header-right .lang-select{width:38px;height:38px}
  .header-right .lang-flag{width:20px;height:14px}
}

/* ── Логотип вместо названия на телефоне ──────────────────────────
   Название занимало почти всю середину шапки и упиралось в кнопки.
   Знак при тех же 60 пикселях высоты занимает 66 пикселей ширины.
   Текст названия остаётся в разметке, но убран с глаз: программы
   чтения с экрана и поиск по странице его по-прежнему находят. */
@media (max-width:767px){
  [data-site] .header .name{
    width:74px;max-width:74px;
    background-position:center center !important;
    background-size:auto 30px !important;
    background-repeat:no-repeat !important;
  }
  [data-site="irbis"] .header .name{background-image:url("/irbis-skin/logo-white.svg") !important}
  [data-site="itk"]   .header .name{background-image:url("/irbis-skin/logo-itk-h-white.svg") !important}
  [data-site="mir"]   .header .name{background-image:url("/irbis-skin/logo-mir-h-white.svg") !important}
  [data-site] .header .name p{
    position:absolute;width:1px;height:1px;margin:-1px;padding:0;
    overflow:hidden;white-space:nowrap;clip-path:inset(50%);
  }
}

/* ── Карточка контактов на телефоне ───────────────────────────────
   Два отдела встают в одну строку, а не столбиком. Кегли на ступень
   мельче, чем на широком экране, иначе номер не помещается в половину
   ширины. Высота карточек выравнивается сеткой. */
@media (max-width:767px){
  .irbis-contacts{padding:12px}
  .irbis-contacts h2{margin:0 0 10px !important;font-size:15px !important}
  .irbis-contacts__grid{grid-template-columns:1fr 1fr;gap:8px}
  .irbis-contacts__c{padding:10px 11px;gap:1px}
  .irbis-contacts__l{font-size:9.5px;letter-spacing:.03em;line-height:1.25}
  .irbis-contacts__t{font-size:15px !important;white-space:nowrap}
  .irbis-contacts__m{font-size:11.5px !important;overflow-wrap:anywhere}
}

/* ── Язык на входе: вниз, в правый угол ───────────────────────────
   На узком экране переключатель занимал строку над заголовком и
   отодвигал форму. Уводим его в самый низ карточки, к правому краю.
   Список вариантов там же разворачивается вверх, иначе он вылезет
   за нижний край карточки. */
@media (max-width:899px){
  .loginblock .login-content{
    grid-template-rows:auto auto auto 1fr auto auto auto;
    grid-template-areas:"brand" "title" "err" "form" "pay" "note" "lang";
  }
  .loginblock > .login-content > .lang-select-position{
    justify-self:end;padding:0 22px 18px !important;
  }
  .loginblock .lang-options{top:auto;bottom:calc(100% + 4px);border-radius:4px}
}

/* ── Сообщение об ошибке на входе ─────────────────────────────────
   Вендор выводит его безымянным блоком между заголовком и формой.
   В сетке карточки такой блок попадал в неявную строку и вставал под
   брендовой колонкой, шириной в неё. Даём ему собственную область.

   Кнопка закрытия у вендора работает через плагин Bootstrap, а на
   странице входа он не подключён, поэтому закрытие берёт на себя
   наш skin.js. */
.loginblock > .login-content > div:has(> .alert){
  grid-area:err;margin:14px 0 0;padding:0 40px;
}
.loginblock .alert{
  position:relative;display:flex;align-items:flex-start;gap:11px;
  margin:0 !important;padding:13px 38px 13px 14px !important;
  border-radius:10px !important;border:1px solid transparent !important;
  font:600 14.5px/1.45 var(--font) !important;
}
.loginblock .alert::before{
  content:"!";flex:none;width:20px;height:20px;margin-top:1px;border-radius:50%;
  color:#fff;font:700 13px/20px var(--font);text-align:center;
}
.loginblock .alert-error,.loginblock .alert-danger{
  background:#FDECEA !important;border-color:#F3C4BE !important;color:var(--err) !important;
}
.loginblock .alert-error::before,.loginblock .alert-danger::before{background:var(--err)}
.loginblock .alert-success{
  background:#E6F5EE !important;border-color:#B9E0CD !important;color:var(--ok) !important;
}
.loginblock .alert-success::before{content:"\2713";background:var(--ok)}
.loginblock .alert-info{
  background:#E6F4FA !important;border-color:#BBDEEC !important;color:var(--link) !important;
}
.loginblock .alert-info::before{content:"i";background:var(--link)}
.loginblock .alert ul{margin:0;padding-left:17px}
.loginblock .alert li + li{margin-top:4px}
.loginblock .alert .close{
  position:absolute;top:7px;right:9px;width:24px;height:24px;
  display:flex;align-items:center;justify-content:center;
  font:400 21px/1 var(--font);color:inherit;opacity:.5;
  text-decoration:none;cursor:pointer;border-radius:6px;
}
.loginblock .alert .close:hover{opacity:1;background:rgba(0,0,0,.06)}
@media (max-width:899px){
  .loginblock > .login-content > div:has(> .alert){padding:0 22px;margin-top:12px}
  .loginblock .alert{font-size:14px !important;padding:11px 34px 11px 12px !important}
}

/* ── Ширина сведений о договоре ───────────────────────────────────
   Вендор задаёт блоку float:left (themes/*/style.css, .agreement__info).
   Плавающий блок сжимается по содержимому, поэтому карточки лепились
   друг к другу, а справа оставалось пустое место. Возвращаем блоку
   нормальное поведение и раскладываем карточки по ширине колонки.

   Пять сведений: баланс, договор, обещанный платёж, оператор, код
   оплаты. На широком экране они встают одной строкой, баланс занимает
   две доли из шести. Ниже раскладка сворачивается по порогам. */
.agreement__info{float:none !important;width:100% !important}
.agreement__content{overflow:hidden}
.agreement__info .content.content-service{margin-left:0 !important;margin-right:0 !important}

@media (min-width:1280px){
  .agreement__info .form-group.panel-form{
    grid-template-columns:repeat(6,minmax(0,1fr));gap:16px;
  }
  .agreement__info .panel-form-table{padding:18px 20px}
  .agreement__info .panel-form-table:has(.balance-block){grid-column:span 2;order:1}
  .agreement__info .panel-form-table:has(select){grid-column:span 1;order:2}
  .agreement__info .panel-form-table:not(:has(.balance-block)):not(:has(select)){
    grid-column:span 1;order:3;
  }
  .agreement__info .panel-form-item-value{font-size:19px !important}
  .panel-form-table:has(.balance-block) .balance-home{font-size:32px !important}
}

@media (min-width:1024px) and (max-width:1279px){
  .agreement__info .form-group.panel-form{
    grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;
  }
  .agreement__info .panel-form-table:has(.balance-block){grid-column:span 2;order:1}
  .agreement__info .panel-form-table:has(select){grid-column:span 2;order:2}
  .agreement__info .panel-form-table:not(:has(.balance-block)):not(:has(select)){
    grid-column:span 1;order:3;
  }
}

/* Таблица учётных записей: на широком экране колонкам есть куда дышать. */
@media (min-width:1024px){
  table.panel-grid th,table.panel-grid td{padding:15px 18px !important}
  table.panel-grid td:first-child{white-space:nowrap}
}

/* ── Ширины колонок в таблице учётных записей ─────────────────────
   Таблица раскладывается браузером по содержимому, и длинный адрес
   забирал себе почти всю ширину: тариф ломался на три строки при
   пустом месте рядом. Задаём адресу долю от ширины, а узким колонкам
   запрещаем перенос. Правила действуют только на этой таблице: она
   лежит в ячейке-контейнере, которую вендор создаёт для списка
   учётных записей. */
@media (min-width:1024px){
  .panel-grid-cell-container table.panel-grid th:last-child,
  .panel-grid-cell-container table.panel-grid td:last-child{width:26%}

  .panel-grid-cell-container table.panel-grid th:nth-child(2),
  .panel-grid-cell-container table.panel-grid td:nth-child(2){min-width:190px}

  .panel-grid-cell-container table.panel-grid td:nth-child(1),
  .panel-grid-cell-container table.panel-grid td:nth-child(3),
  .panel-grid-cell-container table.panel-grid td:nth-child(5){white-space:nowrap}

  /* Скорость тарифа отдельной строкой, без переноса посреди единиц. */
  .panel-grid-cell-container table.panel-grid .tar-curshape{
    display:block;white-space:nowrap;margin-top:2px;
  }
}