/* СЕВЕРЛАБ · Адаптация под телефоны/планшеты. Подключается последним в , переопределяет инлайновые стили на узких экранах. */ @media (max-width: 640px) { body { font-size: 13px; } /* Шапка */ .header { padding: 8px 10px; gap: 6px; } .header-left .title { font-size: 13px; } .header-left .sub { font-size: 9px; } .header-right { gap: 6px; flex-wrap: wrap; } .nav-link, .btn-logout { padding: 5px 9px; font-size: 11px; } /* Контентные обёртки */ main, .wrap, .content { padding: 14px 10px !important; } /* Сетки карточек/полей — в одну колонку */ .grid { grid-template-columns: 1fr !important; gap: 10px; } .info-grid, .form-row { grid-template-columns: 1fr !important; } /* Таблицы — горизонтальная прокрутка вместо «расплющивания» */ table { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; max-width: 100%; font-size: 12px; } table th, table td { padding: 8px 10px; } /* Вкладки/субнавигация — прокрутка по горизонтали */ .tabs, .sectabs, .subnav, .filters { overflow-x: auto; flex-wrap: nowrap; -webkit-overflow-scrolling: touch; } /* Поля ввода: 16px, чтобы iOS не зумил при фокусе */ input, select, textarea, .form-input, .search-input { font-size: 16px; } /* Кнопки покрупнее для пальца */ .btn, button, .add-btn { padding: 9px 14px; } /* Заголовки секций/карточек чуть меньше */ .section h2 { font-size: 11px; } .card .nm { font-size: 15px; } } /* Совсем узкие экраны */ @media (max-width: 380px) { .header-left .sub { display: none; } main, .wrap, .content { padding: 10px 8px !important; } } /* ═══ ФИРМЕННАЯ ТЕМА (склеена из theme.css — без лишнего запроса @import) ═══ */ /* ============================================================ СЕВЕРЛАБ · Фирменная тема ЛИМС (скин поверх инлайновых стилей) Зелёная гамма основного сайта северлаб.рф: #03634E + мятный #62C584. Подключается через @import в mobile.css (последним в ) — переопределяет общие классы всех страниц без правки их разметки. Только @media screen — печатные формы журналов не затрагиваются. ============================================================ */ @media screen { :root{ --sl-green:#03634E; --sl-green-2:#0A7A61; --sl-green-dark:#054C3C; --sl-deep:#071F19; --sl-mint:#62C584; --sl-mint-soft:#E3F3EA; --sl-coral:#F95D51; --sl-ink:#1C2320; --sl-paper:#F4F7F6; --sl-line:#E0E8E4; --sl-muted:#5E6B66; --sl-radius:12px; --sl-shadow:0 1px 2px rgba(7,31,25,.05),0 8px 24px -12px rgba(7,31,25,.12); } /* ── База ── */ body{ font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif !important; background:var(--sl-paper) !important; color:var(--sl-ink); -webkit-font-smoothing:antialiased; } /* ── Шапка: зелёное «жидкое стекло» — градиент + глянцевый блик ── */ .header{ background: linear-gradient(180deg,rgba(255,255,255,.10) 0%,rgba(255,255,255,.03) 45%,rgba(0,0,0,.06) 100%), radial-gradient(900px 120px at 80% -40px,rgba(98,197,132,.35) 0%,transparent 70%), linear-gradient(120deg,var(--sl-deep) 0%,#0A3A2E 55%,var(--sl-green) 100%) !important; border-bottom:1px solid rgba(98,197,132,.28); box-shadow:0 2px 14px rgba(7,31,25,.20); } .nav-link,.btn-logout{ border-color:rgba(255,255,255,.25) !important; border-radius:8px !important; transition:background .15s,border-color .15s; } .nav-link:hover,.btn-logout:hover{ background:rgba(98,197,132,.18) !important; border-color:var(--sl-mint) !important; } /* ── Вкладки ── */ .tab{border-radius:10px !important;transition:all .15s} .tab:hover{border-color:var(--sl-green-2) !important;color:var(--sl-green) !important} .tab.active{ background:linear-gradient(180deg,rgba(255,255,255,.16) 0%,rgba(255,255,255,0) 50%), linear-gradient(120deg,var(--sl-green-dark),var(--sl-green-2)) !important; border-color:var(--sl-green) !important; color:#fff !important; box-shadow:inset 0 1px 0 rgba(255,255,255,.25),0 3px 10px -4px rgba(3,99,78,.55); } .tab.arch.active{background:#6b7280 !important;border-color:#6b7280 !important} /* ── Кнопки ── */ .add-btn,.btn-primary,button[type="submit"].btn,.btn-save{ background:linear-gradient(180deg,rgba(255,255,255,.18) 0%,rgba(255,255,255,0) 55%), linear-gradient(120deg,var(--sl-green-dark),var(--sl-green-2)) !important; border-radius:9px !important; box-shadow:inset 0 1px 0 rgba(255,255,255,.28); transition:all .15s; } .add-btn:hover,.btn-primary:hover,.btn-save:hover{ background:var(--sl-green-2) !important; transform:translateY(-1px); box-shadow:0 6px 16px -6px rgba(3,99,78,.5); } .wbtn:hover{border-color:var(--sl-green-2) !important;color:var(--sl-green) !important} /* ── Поля ввода: зелёный фокус ── */ .form-input,.search-input,input[type="text"],input[type="password"],input[type="date"], input[type="time"],input[type="number"],input[type="email"],select,textarea{ border-radius:9px !important; transition:border-color .15s,box-shadow .15s; } .form-input:focus,.search-input:focus,input:focus,select:focus,textarea:focus{ border-color:var(--sl-green-2) !important; outline:2px solid rgba(10,122,97,.35) !important; outline-offset:0; } /* ── Карточки и контейнеры ── */ .card,.sec,.detail-card,.step,.stat-card,.kpi,.panel{ border-radius:var(--sl-radius) !important; border-color:var(--sl-line) !important; box-shadow:0 1px 3px rgba(7,31,25,.04); transition:box-shadow .18s,transform .18s; } a.card:hover,.card.live:hover{ box-shadow:var(--sl-shadow); transform:translateY(-2px); border-color:rgba(3,99,78,.35) !important; } /* Заголовки внутри карточек хаба и реестров */ .card .nm,.dev-name,.detail-title,.dev-table .nm{color:var(--sl-green-dark) !important} /* ── Таблицы ── */ table.dev-table,.dev-table,table.list,.data-table{ border-radius:var(--sl-radius) !important; overflow:hidden; border-color:var(--sl-line) !important; } .dev-table th,table th{ background:#EFF5F2 !important; color:#54655E !important; } .dev-table tbody tr:hover td,table.list tbody tr:hover td{background:var(--sl-mint-soft) !important} /* ── Бейджи статусов: скругления ── */ .cal,.cat-badge,.tag,.status,.badge{border-radius:20px !important} .tag.ready{background:var(--sl-mint-soft) !important;color:var(--sl-green) !important; border-color:rgba(98,197,132,.5) !important} /* ── Модалки ── */ .modal{border-radius:16px !important;box-shadow:0 24px 64px -16px rgba(7,31,25,.35)} .modal-bg{backdrop-filter:blur(3px)} /* ── Ссылки-акценты (были синие #3b7dd8) ── */ a:not(.nav-link):not(.btn):not(.card):not(.chip){color:var(--sl-green-2)} a:not(.nav-link):not(.btn):not(.card):not(.chip):hover{color:var(--sl-green)} /* ── Скроллбар ── */ ::-webkit-scrollbar{width:10px;height:10px} ::-webkit-scrollbar-track{background:transparent} ::-webkit-scrollbar-thumb{background:#C4D4CC;border-radius:6px;border:2px solid var(--sl-paper)} ::-webkit-scrollbar-thumb:hover{background:#9DB8AC} /* ── Хаб: секции и карточки ── */ .section-title,.group-title{color:var(--sl-green-dark) !important} .section-title .line,.group-title .line{background:var(--sl-line) !important} /* ── Страница входа ── */ .login-box,.login-card{ border-radius:16px !important; box-shadow:0 24px 64px -20px rgba(7,31,25,.35) !important; border:1px solid var(--sl-line); } .login-btn,.btn-login{ background:var(--sl-green) !important; border-radius:9px !important; } .login-btn:hover,.btn-login:hover{background:var(--sl-green-2) !important} }