/* Start:/local/templates/furniture_blue/styles.css?1785009513939*/
@font-face {
	font-family: "Roboto";
	src: url(/local/templates/furniture_blue/font/Roboto.woff2) format("woff2");
	font-weight: 100 900;
	font-style: normal;
}
body {
	/* Системный стек: SF Pro на Apple-устройствах, Roboto — фолбэк */
	font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", "Roboto", "Helvetica Neue", Arial, sans-serif;
	font-size: 16px;
}
img {border:0 none;}

h1, h2, h3, h4, h5, h6
{
	margin:1.3em 0 1em;
	font-weight:600;
	line-height:1.2;
	letter-spacing:-0.02em;
}

h1 { font-size:200%; margin:0 0 1em; }
h2 { font-size:160%; }
h3 { font-size:140%; }
h4 { font-size:140%; }
h5 { font-size:120%; }
h6 { font-size:100%; }

hr, .hr
{
	border-top:1px solid;
	display:block;
	font-size:1px;
	height:1px;
	line-height:1px;
	margin:12px 0;
	overflow:hidden;
	padding:0;
}

#workarea ol li, #workarea ul li { margin: 0.6em 0; }
#workarea ul { list-style-type: disc; }

/* End */


/* Start:/local/templates/furniture_blue/template_styles.css?178500951368597*/
/* ============================================================
   Дизайн-система в стиле iOS (Human Interface Guidelines)
   Светлая и тёмная темы через CSS-переменные + prefers-color-scheme
   ============================================================ */

:root {
    color-scheme: light dark;

    /* Фоны: мягкий цветной градиент вместо плоского серого */
    --bg-page: linear-gradient(165deg, #f4f1ff 0%, #fdf1ea 48%, #edf5ff 100%);
    /* Сплошной цвет верхней точки градиента — им красится overscroll-зона iOS */
    --bg-top: #f4f1ff;
    --bg-card: #ffffff;
    --bg-elevated: #ffffff;
    --bg-blur: rgba(250, 247, 255, 0.75);

    /* Заливки контролов — чуть тёплые, не «казённые» */
    --fill: rgba(110, 100, 145, 0.1);
    --fill-strong: rgba(110, 100, 145, 0.18);

    /* Поля ввода: тёплый почти белый + мягкая рамка, теплеющая при ховере */
    --input-bg: #fffdfa;
    --input-border: rgba(84, 76, 120, 0.24);
    --input-border-hover: rgba(255, 77, 38, 0.4);

    /* Текст */
    --text-primary: #16121f;
    --text-secondary: rgba(52, 45, 75, 0.62);
    --text-tertiary: rgba(52, 45, 75, 0.34);

    /* Разделители */
    --separator: rgba(84, 76, 120, 0.18);

    /* Акценты: фирменный оранжевый + сочный градиент для главных действий */
    --tint: #ff4d26;
    --tint-pressed: #e63a15;
    --tint-soft: rgba(255, 77, 38, 0.12);
    --tint-grad: linear-gradient(135deg, #ff8a1e 0%, #ff4d26 55%, #ff2d55 100%);
    --tint-glow: 0 6px 18px rgba(255, 77, 38, 0.32);
    --red: #ff3b30;
    --green: #34c759;
    --blue: #007aff;

    /* Геометрия */
    --radius-card: 16px;
    --radius-control: 12px;
    --radius-small: 8px;

    --shadow-card: 0 2px 6px rgba(31, 27, 57, 0.05), 0 10px 30px rgba(255, 90, 46, 0.07);
}

@media (prefers-color-scheme: dark) {
    :root {
        /* Тёмная тема — глубокий сине-фиолетовый «космос», не чёрная дыра */
        --bg-page: linear-gradient(165deg, #14101f 0%, #1d1218 50%, #0f1524 100%);
        --bg-top: #14101f;
        --bg-card: #1c1728;
        --bg-elevated: #272033;
        --bg-blur: rgba(20, 16, 31, 0.72);

        --fill: rgba(150, 140, 190, 0.16);
        --fill-strong: rgba(150, 140, 190, 0.28);

        --input-bg: rgba(150, 140, 190, 0.09);
        --input-border: rgba(150, 140, 190, 0.34);
        --input-border-hover: rgba(255, 106, 69, 0.5);

        --text-primary: #f5f3fa;
        --text-secondary: rgba(228, 222, 245, 0.62);
        --text-tertiary: rgba(228, 222, 245, 0.32);

        --separator: rgba(150, 140, 190, 0.24);

        --tint: #ff6a45;
        --tint-pressed: #ff8264;
        --tint-soft: rgba(255, 106, 69, 0.16);
        --tint-grad: linear-gradient(135deg, #ff9736 0%, #ff6a45 55%, #ff3d63 100%);
        --tint-glow: 0 6px 20px rgba(255, 106, 69, 0.35);
        --red: #ff453a;
        --green: #30d158;
        --blue: #0a84ff;

        --shadow-card: 0 1px 3px rgba(0, 0, 0, 0.5), 0 10px 28px rgba(255, 106, 69, 0.06);
    }
}

/* ---------- База ---------- */

* {
    box-sizing: border-box;
}
html {
    /* Сплошной цвет верхней точки градиента: только им iOS красит
       overscroll-«резинку» вверху (background-image туда не затекает) */
    background-color: var(--bg-top);
    min-height: 100%;
}
/* Градиент — отдельным фиксированным слоем, а не background-attachment: fixed
   (тот на WebKit глючит). Слой держится по вьюпорту, поэтому не растягивается
   на всю длину страницы и не темнеет на длинных экранах */
html::before {
    content: '';
    position: fixed;
    inset: 0;
    z-index: -1;
    background: var(--bg-page);
    pointer-events: none;
}
body {
    padding: 0 50px;
    /* перебиваем серый фон bootstrap (#f1f1f1), чтобы просвечивал градиент html */
    background: transparent;
    min-height: 100vh;
    color: var(--text-primary);
    -webkit-font-smoothing: antialiased;
    -webkit-tap-highlight-color: transparent;
}
#page-wrapper {
    /* 3 карточки калькулятора в ряд: 3 × (400px + 12px margin) */
    max-width: 1236px;
    margin: 0 auto;
}
h1 {
    margin-bottom: 24px;
    font-weight: 700;
    letter-spacing: -0.4px;
}
/* Живой градиентный заголовок страницы */
#workarea h1 {
    background: linear-gradient(100deg, var(--text-primary) 0%, var(--tint) 130%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    width: fit-content;
}
h2 {
    font-size: 24px;
    font-weight: 700;
    letter-spacing: -0.3px;
}
h3 {
    font-size: 20px;
    font-weight: 600;
}
h4 {
    font-weight: 600;
}
a {
    color: var(--tint);
}
a:hover, a:focus {
    color: var(--tint-pressed);
}
hr {
    border: 0;
    border-top: 1px solid var(--separator);
}
pre {
    background: var(--bg-card);
    border: 0;
    border-radius: var(--radius-control);
    color: var(--text-primary);
    padding: 12px 16px;
}
div.spacer {
    height: 1px;
    clear: both;
    width: 100%;
}
.orange-text {
    color: var(--tint);
}
/* Перекраска инлайновых svg-иконок под тему (presentation-атрибуты слабее CSS) */
svg[fill="#4b4b4b"], svg[fill="#717171"] {
    fill: var(--text-secondary);
}
svg[fill="red"] {
    fill: var(--red);
}
svg[fill="#0591F7"] {
    fill: var(--tint);
}
/* Тёмная тема: логотип и системные пиктограммы-png делаем светлыми */
@media (prefers-color-scheme: dark) {
    .logo-wrapper img,
    img[src$="sync.png"] {
        filter: invert(1) hue-rotate(180deg);
    }
}

/* ---------- Шапка / навигация ---------- */

/* Шапка-капсула: на десктопе скроллится вместе со страницей */
#header {
    display: flex;
    align-items: center;
    z-index: 100;
    margin: 14px 0 48px;
    padding: 10px 20px;
    border-radius: 22px;
    background: var(--bg-blur);
    -webkit-backdrop-filter: saturate(180%) blur(20px);
    backdrop-filter: saturate(180%) blur(20px);
    border: 1px solid var(--separator);
    box-shadow: var(--shadow-card);
}
.logo-wrapper img {
    max-width: 220px;
    display: block;
}
#header ul {
    list-style: none;
    margin: 0 0 0 30px;
    padding: 0;
    display: flex;
    align-items: center;
}
#header ul li {
    float: none;
    margin-right: 8px;
}
#header ul li a {
    display: inline-block;
    text-decoration: none;
    color: var(--text-primary);
    font-weight: 400;
    font-size: 15px;
    padding: 7px 14px;
    border-radius: 100px;
    transition: background 0.15s, color 0.15s;
}
#header ul li a:hover {
    background: var(--fill);
}
#header ul li a.active {
    font-weight: 600;
    color: var(--tint);
    background: var(--tint-soft);
}
#header ul li:last-child {
    margin-left: 8px;
    color: var(--text-secondary);
    font-size: 14px;
    white-space: nowrap;
}
#header ul li:last-child a {
    display: inline;
    padding: 0;
    color: var(--tint);
}
.menu-burger {
    display: none;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: var(--fill);
    align-items: center;
    justify-content: center;
    cursor: pointer;
    position: relative;
}
.menu-burger span,
.menu-burger:before,
.menu-burger:after {
    content: "";
    display: block;
    position: absolute;
    left: 9px;
    width: 18px;
    height: 2px;
    border-radius: 2px;
    background: var(--text-primary);
}
.menu-burger:before { top: 12px; }
.menu-burger span   { top: 17px; }
.menu-burger:after  { top: 22px; }

/* ---------- Индикатор онлайн/офлайн (PWA) ---------- */

#net-status {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-left: auto;
    padding: 5px 12px;
    border-radius: 100px;
    font-size: 13px;
    white-space: nowrap;
    color: var(--text-secondary);
    background: var(--fill);
}
#net-status .net-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--green);
    box-shadow: 0 0 6px var(--green);
}
#net-status.offline {
    color: var(--red);
    background: rgba(255, 69, 58, 0.14);
}
#net-status.offline .net-dot {
    background: var(--red);
    box-shadow: none;
}
/* Плашка «работаем из кэша»: скрыта, пока есть сеть */
#offline-note {
    display: none;
    margin: -34px 0 24px;
    padding: 10px 16px;
    border-radius: var(--radius-control);
    background: rgba(255, 149, 0, 0.14);
    color: var(--text-primary);
    font-size: 14px;
    line-height: 1.45;
    text-align: center;
}
body.is-offline #offline-note {
    display: block;
}
/* «Данные актуальны на HH:MM» + кнопка обновления: появляется через 5 минут
   после загрузки страницы (или сразу для копии из кэша), автообновлений нет */
#stale-note {
    margin: -34px 0 24px;
    padding: 10px 16px;
    border-radius: var(--radius-control);
    background: var(--tint-soft);
    color: var(--text-primary);
    font-size: 14px;
    line-height: 1.45;
    text-align: center;
}
#stale-note a {
    color: var(--tint);
    font-weight: 600;
    white-space: nowrap;
}
/* В офлайне о состоянии данных говорит своя плашка, обновляться всё равно нечем */
body.is-offline #stale-note {
    display: none;
}
/* В офлайне действия, требующие сервера, гасим — иначе молча упадут */
body.is-offline .grab-deal,
body.is-offline .grab-deal-map,
body.is-offline .cancel-measure,
body.is-offline .change-date,
body.is-offline .set-datetime,
body.is-offline .set-datetime-save,
body.is-offline .add-address,
body.is-offline .save-input-address,
body.is-offline .refresh-page,
body.is-offline .refresh-clients,
body.is-offline a.calc {
    opacity: 0.35;
    pointer-events: none;
}

/* Кнопка обновления калькулятора — в заголовке, как на «Мои замеры» */
h1 .refresh-clients {
    display: inline-block;
    vertical-align: middle;
    margin-left: 8px;
    cursor: pointer;
}
h1 .refresh-clients img {
    max-height: 32px;
}

#footer {
    padding-bottom: 100px;
}

/* ---------- Кнопки ---------- */

.bttn {
    height: 50px;
    border: 0;
    border-radius: var(--radius-control);
    background: var(--fill);
    color: var(--text-primary);
    display: flex;
    align-items: center;
    justify-content: center;
    width: fit-content;
    min-width: 200px;
    padding: 0 24px;
    margin: 0 auto;
    font-size: 17px;
    font-weight: 600;
    cursor: pointer;
    position: relative;
    z-index: 2;
    transition: background 0.15s, transform 0.1s, opacity 0.15s;
}
.bttn:active {
    transform: scale(0.97);
}
.bttn.disabled {
    opacity: 0.4;
}
.bttn.disabled:hover {
    text-decoration: none;
    cursor: default;
    transform: none;
}
.bttn-orange {
    background: var(--tint-grad);
    color: #fff;
    box-shadow: var(--tint-glow);
}
.bttn-orange:not(.disabled):hover,
.bttn-orange:not(.disabled):focus {
    text-decoration: none;
    color: #fff;
    background: var(--tint-grad);
    filter: brightness(1.07);
}
.bttn.disabled:hover {
    color: #fff;
}
/* Bootstrap-кнопки на страницах менеджера */
.btn {
    border: 0;
    border-radius: 10px;
    font-weight: 600;
    padding: 9px 18px;
    transition: opacity 0.15s;
    box-shadow: none;
    text-shadow: none;
    background-image: none;
}
.btn:active {
    box-shadow: none;
}
.btn-success {
    background: var(--green);
    color: #fff;
}
.btn-success:hover, .btn-success:focus {
    background: var(--green);
    opacity: 0.85;
    color: #fff;
}
.btn-info {
    background: var(--tint);
    color: #fff;
}
.btn-info:hover, .btn-info:focus {
    background: var(--tint-pressed);
    color: #fff;
}

/* Малые «tinted»-кнопки (телефоны, назначение даты) */
a.set-datetime-save,
a.set-datetime,
a.phone {
    display: inline-block;
    padding: 7px 14px;
    background: var(--tint-soft);
    border-radius: 100px;
    color: var(--tint);
    font-weight: 600;
    font-size: 15px;
    margin-right: 5px;
    margin-top: 3px;
    transition: background 0.15s;
}
a.set-datetime-save:hover,
a.set-datetime:hover,
a.phone:hover {
    cursor: pointer;
    text-decoration: none;
    background: var(--tint-grad);
    color: #fff;
}

/* Квадратные иконки-действия в карточках */
.measure .calc,
.measure .cancel-measure,
a.grab-deal,
.change-date a.change {
    border: 0 !important;
    background: var(--fill);
    border-radius: 10px;
    transition: background 0.15s;
}
.measure .calc:hover,
.measure .cancel-measure:hover,
a.grab-deal:hover,
.change-date a.change:hover {
    background: var(--fill-strong);
    text-decoration: none;
    cursor: pointer;
}

/* ---------- Формы ---------- */

input[type="text"],
input[type="password"],
input[type="email"],
input[type="number"],
textarea,
select {
    background: var(--input-bg);
    color: var(--text-primary);
    border: 1px solid var(--input-border);
    border-radius: 10px;
    height: 36px;
    padding: 0 12px;
    font-size: 15px;
    outline: none;
    transition: border-color 0.15s, box-shadow 0.15s;
}
input[type="text"]:hover,
input[type="password"]:hover,
input[type="email"]:hover,
input[type="number"]:hover,
textarea:hover,
select:hover {
    border-color: var(--input-border-hover);
}
input[type="text"]:focus,
input[type="password"]:focus,
input[type="email"]:focus,
input[type="number"]:focus,
textarea:focus,
select:focus {
    border-color: var(--tint);
    box-shadow: 0 0 0 3px var(--tint-soft);
}
input::placeholder {
    color: var(--text-tertiary);
}
select[multiple] {
    height: auto;
    padding: 8px 12px;
}
label {
    font-weight: 400;
}
input[type="file"] {
    color: var(--text-secondary);
}
input[type="file"]::file-selector-button {
    border: 0;
    border-radius: 100px;
    background: var(--tint-soft);
    color: var(--tint);
    font-weight: 600;
    padding: 6px 14px;
    margin-right: 10px;
    cursor: pointer;
}

/* Радиокнопки в стиле iOS */
input[type="radio"] {
    appearance: none;
    -webkit-appearance: none;
    margin: 0 4px 0 0;
    width: 22px;
    height: 22px;
    border: 1.5px solid var(--text-tertiary);
    border-radius: 50%;
    vertical-align: middle;
    position: relative;
    cursor: pointer;
    transition: border-color 0.15s, background 0.15s;
}
input[type="radio"]:checked {
    border-color: var(--tint);
    background: var(--tint);
}
input[type="radio"]:checked:before {
    content: "";
    position: absolute;
    inset: 0;
    margin: auto;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #fff;
}

/* Чекбоксы — тумблеры (switch) в стиле iOS */
input[type="checkbox"] {
    appearance: none;
    -webkit-appearance: none;
    margin: 0;
    width: 51px;
    height: 31px;
    border-radius: 31px;
    background: var(--fill-strong);
    position: relative;
    vertical-align: middle;
    cursor: pointer;
    transition: background 0.2s;
    flex: none;
}
input[type="checkbox"]:before {
    content: "";
    position: absolute;
    top: 2px;
    left: 2px;
    width: 27px;
    height: 27px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 3px 8px rgba(0, 0, 0, 0.15), 0 1px 1px rgba(0, 0, 0, 0.16);
    transition: left 0.2s;
}
input[type="checkbox"]:checked {
    background: var(--green);
}
input[type="checkbox"]:checked:before {
    left: 22px;
}

/* ---------- Форма входа ---------- */

body.guest {
    background: var(--bg-page);
}
.login-form {
    text-align: center;
    max-width: 380px;
    margin: 60px auto 0;
    background: var(--bg-card);
    border-radius: 24px;
    box-shadow: var(--shadow-card);
    padding: 32px 28px 36px;
}
.login-form h1 {
    font-size: 24px;
    margin-bottom: 24px;
}
.login-form .field {
    margin-bottom: 12px;
}
.login-form input[type="password"],
.login-form input[type="text"] {
    height: 50px;
    border-radius: var(--radius-control);
    border: 1px solid var(--input-border);
    background: var(--input-bg);
    padding: 0 18px;
    width: 100%;
    font-size: 17px;
    color: var(--text-primary);
    outline: none;
    text-align: center;
}
.login-form .bttn {
    width: 100%;
}
[name="form_auth"] label {
    font-weight: 400;
    font-size: 14px;
    color: var(--text-secondary);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}
.login-form .field.remember {
    margin: 18px 0;
}

/* ---------- Сегментированный контрол (вкладки замеров) ---------- */

.measure {
    max-width: 400px;
}
.measure .tabs-wrap {
    display: flex;
    position: relative;
    z-index: 1;
    margin-bottom: 20px;
    background: var(--fill);
    border-radius: 10px;
    padding: 2px;
}
.measure .tabs-wrap > div {
    width: 50%;
    padding: 9px 0;
    border: 0;
    background: transparent;
    color: var(--text-primary);
    display: flex;
    border-radius: 8px;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    font-weight: 500;
    transition: background 0.15s, box-shadow 0.15s;
}
.measure .tabs-wrap > div:hover {
    cursor: pointer;
}
.measure .tabs-wrap > div.active {
    font-weight: 600;
    border: 0 !important;
    background: var(--tint-grad);
    color: #fff;
    box-shadow: var(--tint-glow);
}
.measure .tabs-wrap > div svg {
    margin-right: 7px;
}
.measure .tabs-wrap svg {
    fill: var(--text-secondary);
}
.measure .tabs-wrap .active svg {
    fill: #fff;
}
.measure .tabs-wrap .count {
    margin-left: 7px;
    background: var(--fill-strong);
    color: var(--text-secondary);
    display: inline-block;
    padding: 1px 8px;
    border-radius: 100px;
    font-size: 12px;
    font-weight: 600;
}
.measure .tabs-wrap .active .count {
    background: rgba(255, 255, 255, 0.25);
    color: #fff;
}

/* ---------- Карточки замеров ---------- */

.measure .content-measure-wrap {
    min-height: 300px;
}
.measure .content-measure-wrap .line {
    background: var(--bg-card);
    padding: 16px;
    box-shadow: var(--shadow-card);
    border-radius: var(--radius-card);
    margin-bottom: 12px;
}
.measure .content-measure-wrap .line .date {
    font-weight: 600;
    margin-bottom: 7px;
    display: flex;
    align-items: center;
}
.measure .content-measure-wrap .line .date .id {
    margin-left: auto;
    color: var(--text-secondary);
    display: inline-block;
    padding: 3px 10px;
    background: var(--fill);
    border-radius: 100px;
    font-size: 13px;
    font-weight: 600;
}
.measure .measure-set-wrap {
    display: block;
    background: var(--bg-card);
    padding: 20px;
    border-radius: var(--radius-card);
    margin-bottom: 12px;
    box-shadow: var(--shadow-card);
}
.measure .measure-set-wrap h3 {
    cursor: pointer;
    margin: 0;
}
.measure h3 {
    font-size: 19px;
}
.measure hr {
    margin-top: 12px;
    margin-bottom: 12px;
}
.measure .address {
    margin-bottom: 12px;
}
.measure .comment {
    color: var(--text-secondary);
}
/* Карточки замерщика — тот же вид, что на карте менеджеров:
   коммент в подложке, ID-бейдж с решёткой */
.measure .content-measure-wrap .line .comment {
    position: relative;
    margin: 10px 0 0;
    padding: 10px 14px 10px 38px;
    background: var(--fill);
    border-radius: var(--radius-control);
    color: var(--text-secondary);
    font-size: 14px;
    line-height: 1.45;
}
/* Иконка-«облачко» комментария слева (единая для карточек замерщика и менеджера) */
.measure .content-measure-wrap .line .comment::before,
.mmap-card-comment::before {
    content: '';
    position: absolute;
    left: 13px;
    top: 11px;
    width: 16px;
    height: 16px;
    background: var(--text-tertiary);
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M20 2H4c-1.1 0-2 .9-2 2v18l4-4h14c1.1 0 2-.9 2-2V4c0-1.1-.9-2-2-2z'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M20 2H4c-1.1 0-2 .9-2 2v18l4-4h14c1.1 0 2-.9 2-2V4c0-1.1-.9-2-2-2z'/%3E%3C/svg%3E") center / contain no-repeat;
}
.measure .content-measure-wrap .line .comment svg {
    display: none;
}
.measure .content-measure-wrap .line .date .id:before {
    content: '#';
}
.measure .phones-wrap {
    position: relative;
}
.measure .whatsapp img {
    max-width: 33px !important;
    margin-top: -3px;
}
.measure .repeat-order:hover {
    cursor: pointer;
}
.measure .repeat-order {
    display: flex;
    height: 26px;
    width: 26px;
    align-items: center;
    justify-content: center;
    margin-left: 5px;
}
.measure .calc {
    display: flex;
    position: absolute;
    top: 27px;
    right: 55px;
    width: 36px;
    height: 36px;
    align-items: center;
    justify-content: center;
}
.measure .cancel-measure {
    display: flex;
    position: absolute;
    right: 0;
    top: 27px;
    width: 36px;
    height: 36px;
    align-items: center;
    justify-content: center;
}
a.grab-deal {
    display: flex;
    position: absolute;
    right: 0;
    top: 27px;
    height: 36px;
    width: 36px;
    align-items: center;
    justify-content: center;
}
.change-date a.change {
    margin-left: 5px;
    display: flex;
    padding: 4px;
    align-items: center;
    justify-content: center;
    margin-top: -3px;
}
.change-date {
    margin-left: 5px;
    font-weight: 500;
    font-size: 12px;
}
.phones-wrap {
    margin-top: 10px;
}
.measure .changing .save {
    display: inline-block;
    margin-left: 10px;
}
.measure .loading .change,
.measure .changing .change,
.measure .loading .save,
.measure .save {
    display: none;
}
.measure .new h3 {
    color: var(--tint);
    margin-top: 0;
    padding-top: 20px;
}
.measure .address-input-wrap {
    text-align: left;
    width: 100%;
    padding: 14px;
    background: var(--fill);
    border-radius: var(--radius-control);
    box-shadow: none;
    margin: 6px 0;
}
.measure .address-input-wrap input[type="text"] {
    width: 100%;
    background: var(--bg-elevated);
}
.measure .address-input-wrap .coordinates {
    display: inline-block;
    margin: 5px 0;
    height: 20px;
    color: var(--text-secondary);
}
.measure .address-input-wrap .bttn {
    height: 40px;
    min-width: 100px;
    margin-top: 10px;
    margin-left: 0;
}
.measure .refresh-page:hover {
    cursor: pointer;
}
.measure .refresh-page img {
    max-height: 32px;
}
/* Адресная строка карточки: кнопки «на карте»/«маршрут» + текст адреса */
.measure .content-measure-wrap .line .address {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: 8px;
}
.measure .content-measure-wrap .line .address .addr-text {
    padding-top: 4px;
    min-width: 0;
}
.measure .content-measure-wrap .line .repeat-order-link {
    margin-bottom: 10px;
    font-size: 14px;
}
.measure .content-measure-wrap .line .repeat-order-link svg {
    vertical-align: -4px;
}
.measure .content-measure-wrap .line .comment svg {
    vertical-align: -4px;
}
.measure .set-datetime-wrapper {
    margin-top: 8px;
}
.measure .phones-wrap .name {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 5px;
    font-weight: 500;
}
.measure .address-input-wrap .coordinates-line,
.mmap .address-input-wrap .coordinates-line {
    margin-top: 8px;
    font-size: 13px;
    color: var(--text-secondary);
}
.measure .address-input-wrap .progress {
    color: var(--tint);
    font-weight: 600;
    margin: 10px 0 0;
}
/* Карта с легендой под списком «Моих замеров» */
.measure + .mmap {
    margin-top: 40px;
}
.measure-wrapper .not-latlon {
    opacity: 0.5;
}
.measure-wrapper h3 {
    padding-left: 10px;
}
.measure-wrapper ul li {
    list-style: decimal;
}

/* ---------- Карта замеров ---------- */

.measure-map {
    display: block;
    height: 600px;
    width: 100%;
    border-radius: var(--radius-card);
    overflow: hidden;
    box-shadow: var(--shadow-card);
    /* Leaflet задаёт своим панелям/контролам z-index до 1000 — замыкаем их
       в отдельный stacking-контекст, иначе карта пробивает бургер-меню (z-index 111) */
    position: relative;
    z-index: 0;
}
/* Кнопка-спойлер карты: живёт только на мобильном (см. mobile.css) */
.mmap-map-toggle {
    display: none;
}
/* Заглушка внутри контейнера, пока грузится (или не загрузился) Google Maps */
.measure-map .mmap-map-note {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 14px;
    height: 100%;
    padding: 24px;
    text-align: center;
    background: var(--bg-card);
    color: var(--text-secondary);
}
.measure-map .mmap-map-note .spinner {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    border: 3px solid var(--fill-strong);
    border-top-color: var(--tint);
    animation: rotating 0.8s linear infinite;
}
/* Легенда — чипы со счётчиками над картой */
.mmap-legend {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 16px;
}
.mmap-chip {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: var(--bg-card);
    border-radius: 100px;
    box-shadow: var(--shadow-card);
    padding: 8px 14px;
    font-size: 14px;
    color: var(--text-secondary);
}
.mmap-chip b {
    color: var(--text-primary);
    font-weight: 600;
}
/* Цвета точек = цвета маркеров на карте */
.mmap-dot {
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    flex: none;
}
.mmap-dot.green  { background: #34c759; box-shadow: 0 0 0 3px rgba(52, 199, 89, 0.18); }
.mmap-dot.orange { background: #ff9500; box-shadow: 0 0 0 3px rgba(255, 149, 0, 0.18); }
.mmap-dot.red    { background: #ff3b30; box-shadow: 0 0 0 3px rgba(255, 59, 48, 0.18); }
/* Стадии карты монтажей */
.mmap-dot.lightgreen { background: #7ed957; box-shadow: 0 0 0 3px rgba(126, 217, 87, 0.18); }
.mmap-dot.darkgreen  { background: #1e8a4c; box-shadow: 0 0 0 3px rgba(30, 138, 76, 0.18); }
.mmap-dot.blue       { background: #5ac8fa; box-shadow: 0 0 0 3px rgba(90, 200, 250, 0.18); }
/* Доставлено, но монтаж не назначен — пополам зелёный/красный */
.mmap-dot.split      { background: linear-gradient(90deg, #1e8a4c 50%, #ff3b30 50%); box-shadow: 0 0 0 3px rgba(255, 59, 48, 0.15); }
/* Рекламации: жёлтый — назначить, жёлтые сплиты — с цветом назначенного этапа */
.mmap-dot.yellow      { background: #ffcc00; box-shadow: 0 0 0 3px rgba(255, 204, 0, 0.2); }
.mmap-dot.yellowgreen { background: linear-gradient(90deg, #ffcc00 50%, #7ed957 50%); box-shadow: 0 0 0 3px rgba(255, 204, 0, 0.16); }
.mmap-dot.yellowblue  { background: linear-gradient(90deg, #ffcc00 50%, #5ac8fa 50%); box-shadow: 0 0 0 3px rgba(255, 204, 0, 0.16); }
/* Фильтры карты: отдельная карточка в строке легенды, чтобы не сливались
   с чипами-счётчиками; подпись напоминает, что фильтруются только назначенные */
.mmap-filters {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-left: auto;
    background: var(--bg-card);
    border-radius: 100px;
    box-shadow: var(--shadow-card);
    padding: 6px 8px 6px 14px;
}
.mmap-filters-label {
    font-size: 13px;
    color: var(--text-tertiary);
    white-space: nowrap;
}
.mmap-filters input[type="date"] {
    -webkit-appearance: none;
    appearance: none;
    background: var(--input-bg);
    color: var(--text-primary);
    border: 1px solid var(--input-border);
    border-radius: 10px;
    height: 36px;
    min-width: 150px;
    padding: 0 12px;
    font-size: 14px;
    outline: none;
    transition: border-color 0.15s, box-shadow 0.15s;
}
.mmap-filters input[type="date"]::-webkit-date-and-time-value {
    text-align: left;
}
/* iOS Safari не показывает формат в пустом поле даты — рисуем свой плейсхолдер,
   пока дата не выбрана (класс filled вешает JS) и поле не в фокусе */
.mmap-filter-date-wrap {
    position: relative;
    display: inline-flex;
    margin: 0;
}
.mmap-filter-date-ph {
    position: absolute;
    left: 13px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 14px;
    color: var(--text-tertiary);
    pointer-events: none;
    white-space: nowrap;
    display: none;
}
.mmap-filter-date-wrap:not(.filled) .mmap-filter-date:not(:focus) {
    color: transparent;
}
.mmap-filter-date-wrap:not(.filled) .mmap-filter-date-ph {
    display: block;
}
.mmap-filter-date-wrap:not(.filled) .mmap-filter-date:focus + .mmap-filter-date-ph {
    display: none;
}
.mmap-filters input[type="date"]:hover {
    border-color: var(--input-border-hover);
}
.mmap-filters input[type="date"]:focus {
    border-color: var(--tint);
    box-shadow: 0 0 0 3px var(--tint-soft);
}
/* appearance: none — чтобы высота и базовая линия совпадали с полем даты
   (нативный селект на iOS рисуется по своим метрикам); стрелку рисуем сами */
.mmap-filters select {
    -webkit-appearance: none;
    appearance: none;
    max-width: 220px;
    height: 36px;
    font-size: 14px;
    padding-right: 30px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath d='M2.5 4.5 6 8l3.5-3.5' fill='none' stroke='%238e8e93' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 10px center;
    text-overflow: ellipsis;
}
.mmap-filters-reset {
    font-size: 13px;
    color: var(--text-secondary);
    white-space: nowrap;
}
.mmap-filters-reset:hover {
    color: var(--tint);
}
@media (max-width: 760px) {
    .mmap-filters {
        width: 100%;
        margin-left: 0;
        flex-wrap: wrap;
        border-radius: var(--radius-control);
        padding: 10px 12px;
    }
    /* Подпись — отдельной строкой над полями */
    .mmap-filters-label {
        width: 100%;
    }
    /* min-width: 0 обязателен: иначе селект не ужимается уже самой длинной
       фамилии в опциях и выталкивает ряд за экран */
    .mmap-filters select {
        flex: 1;
        max-width: none;
        min-width: 0;
    }
    .mmap-filters .mmap-filter-date-wrap {
        flex: 1;
        min-width: 0;
    }
    .mmap-filters input[type="date"] {
        width: 100%;
        min-width: 0;
    }
}

/* Две колонки под картой: нераспределённые | по замерщикам */
.mmap-cols {
    display: grid;
    grid-template-columns: minmax(320px, 5fr) minmax(320px, 7fr);
    gap: 32px;
    align-items: start;
}
.mmap-col h2 {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 20px;
    margin: 28px 0 16px;
}
.mmap-count {
    background: var(--tint-soft);
    color: var(--tint);
    border-radius: 100px;
    padding: 2px 10px;
    font-size: 13px;
    font-weight: 700;
}

/* Карточка нераспределённого замера */
.mmap-card {
    background: var(--bg-card);
    border-radius: var(--radius-card);
    box-shadow: var(--shadow-card);
    padding: 14px 16px;
    margin-bottom: 12px;
}
@media (hover: hover) {
    .mmap-card {
        transition: box-shadow 0.15s ease;
    }
    .mmap-card:hover {
        box-shadow: 0 4px 10px rgba(31, 27, 57, 0.07), 0 16px 40px rgba(255, 90, 46, 0.12);
    }
}
.mmap-card-head {
    display: flex;
    align-items: center;
    gap: 8px;
}
.mmap-card-date {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    font-weight: 600;
    min-width: 0;
}
.mmap-card-date svg {
    flex: none;
}
.mmap-card-date.repeat {
    color: var(--red);
}
.mmap-card-id {
    margin-left: auto;
    flex: none;
    color: var(--text-secondary);
    background: var(--fill);
    border-radius: 100px;
    padding: 3px 10px;
    font-size: 13px;
    font-weight: 600;
    transition: background 0.15s, color 0.15s;
}
.mmap-card-id:hover {
    background: var(--tint-soft);
    color: var(--tint);
    text-decoration: none;
}
.mmap-card-addr {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    margin-top: 10px;
    width: 100%;
}
.mmap-card-addr > span {
    padding-top: 4px;
}
/* Квадратная кнопка «показать на карте» */
.mmap-pin-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 8px;
    background: var(--fill);
    flex: none;
    transition: background 0.15s;
}
.mmap-pin-btn:hover {
    background: var(--fill-strong);
}
.mmap-pin-btn svg {
    fill: var(--tint);
}
/* Материал сделки — компактная пилюля под заголовком карточки */
.mmap-card-material {
    display: inline-flex;
    align-items: center;
    margin-top: 8px;
    padding: 3px 11px;
    background: var(--fill);
    border-radius: 999px;
    color: var(--text-secondary);
    font-size: 13px;
    font-weight: 600;
    line-height: 1.35;
}
.mmap-card-comment {
    position: relative;
    margin-top: 10px;
    padding: 10px 14px 10px 38px;
    background: var(--fill);
    border-radius: var(--radius-control);
    color: var(--text-secondary);
    font-size: 14px;
    line-height: 1.45;
}
/* Добавление адреса сделке без координат */
.mmap .add-address {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-weight: 600;
    padding-top: 2px;
}
.mmap .address-input-wrap {
    width: 100%;
    padding: 12px;
    background: var(--fill);
    border-radius: var(--radius-control);
}
.mmap .address-input-wrap input[type="text"] {
    width: 100%;
    background: var(--bg-elevated);
}
.mmap .address-input-wrap .coordinates-line {
    margin-top: 8px;
    font-size: 13px;
    color: var(--text-secondary);
}
.mmap .address-input-wrap .bttn {
    height: 40px;
    min-width: 120px;
    margin: 10px 0 0;
}
.mmap .address-input-wrap .progress {
    color: var(--tint);
    font-weight: 600;
    margin: 10px 0 0;
}
.mmap-note {
    background: var(--bg-card);
    border-radius: var(--radius-card);
    box-shadow: var(--shadow-card);
    padding: 24px;
    text-align: center;
    color: var(--text-secondary);
}
.mmap-empty {
    background: var(--bg-card);
    border-radius: var(--radius-card);
    box-shadow: var(--shadow-card);
    padding: 40px 24px;
    max-width: 480px;
    text-align: center;
    color: var(--text-secondary);
    font-size: 16px;
}
.mmap-empty .emoji {
    display: block;
    font-size: 40px;
    margin-bottom: 12px;
}

/* Аккордеон «Замеры по замерщикам» */
.mmap-acc {
    background: var(--bg-card);
    border-radius: var(--radius-card);
    box-shadow: var(--shadow-card);
    margin-bottom: 12px;
    overflow: hidden;
}
/* Замер не на замерщике (назначен не на нашего замерщика) — выделяем нейтральным
   серым, а не цветом статуса, чтобы не путать с нераспределёнными замерами */
.mmap-acc.no-measurer {
    background: var(--fill-strong);
    box-shadow: inset 0 0 0 1.5px var(--separator), var(--shadow-card);
}
.mmap-acc-head {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 15px 16px;
    border: 0;
    background: transparent;
    cursor: pointer;
    font: inherit;
    color: var(--text-primary);
    text-align: left;
    -webkit-tap-highlight-color: transparent;
}
.mmap-acc-name {
    font-weight: 600;
    font-size: 16px;
    margin-right: auto;
}
.mmap-badge {
    border-radius: 100px;
    padding: 2px 9px;
    font-size: 12px;
    font-weight: 700;
    flex: none;
}
.mmap-badge.green {
    background: rgba(52, 199, 89, 0.15);
    color: var(--green);
}
.mmap-badge.orange {
    background: rgba(255, 149, 0, 0.15);
    color: #ff9500;
}
/* Бейджи карты монтажей */
.mmap-badge.lightgreen {
    background: rgba(126, 217, 87, 0.15);
    color: #6cc44a;
}
.mmap-badge.darkgreen {
    background: rgba(30, 138, 76, 0.15);
    color: #1e8a4c;
}
.mmap-badge.blue {
    background: rgba(90, 200, 250, 0.15);
    color: #3aa8dc;
}
/* Красный и зелёно-красный бейджи левой колонки — сплошным цветом поинтов карты */
.mmap-badge.red {
    background: #ff3b30;
    color: #fff;
}
.mmap-badge.split {
    background: linear-gradient(90deg, #1e8a4c 50%, #ff3b30 50%);
    color: #fff;
}
/* Бейджи рекламаций — сплошным цветом поинтов, тёмный текст читается на жёлтом */
.mmap-badge.yellow {
    background: #ffcc00;
    color: rgba(0, 0, 0, 0.65);
}
.mmap-badge.yellowgreen {
    background: linear-gradient(90deg, #ffcc00 50%, #7ed957 50%);
    color: rgba(0, 0, 0, 0.65);
}
.mmap-badge.yellowblue {
    background: linear-gradient(90deg, #ffcc00 50%, #5ac8fa 50%);
    color: rgba(0, 0, 0, 0.65);
}
/* Спойлеры «Готовы к отгрузке» / «Доставлено» на карте монтажей: карточки
   внутри аккордеона теряют собственную подложку, чтобы не сливаться с ним */
.mmap-acc-cards {
    padding: 12px 12px 4px;
}
.mmap-acc-cards .mmap-card {
    background: var(--fill);
    box-shadow: none;
    margin-bottom: 8px;
}
@media (hover: hover) {
    .mmap-acc-cards .mmap-card:hover {
        box-shadow: none;
    }
}
/* Строка «доставлено … · монтаж …» в карточке */
.mmap-card-sub {
    font-size: 13px;
    color: var(--text-secondary);
    margin-top: 6px;
}
/* Иконка «Документация на Google Диске» в карточках и списках */
.mmap-card-drive {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: none;
    width: 24px;
    height: 24px;
    color: var(--text-tertiary);
}
.mmap-card-drive:hover {
    color: var(--text-primary);
}
.mmap-chevron {
    width: 7px;
    height: 7px;
    border-right: 1.5px solid var(--text-tertiary);
    border-bottom: 1.5px solid var(--text-tertiary);
    transform: translateY(-2px) rotate(45deg);
    transition: transform 0.2s;
    flex: none;
    margin-left: 4px;
}
.mmap-acc.open .mmap-chevron {
    transform: translateY(1px) rotate(225deg);
}
.mmap-acc-body {
    display: none;
    border-top: 1px solid var(--separator);
}
.mmap-acc.open .mmap-acc-body {
    display: block;
}
.mmap-acc-item {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 12px 16px;
    border-bottom: 1px solid var(--separator);
}
.mmap-acc-item:last-child {
    border-bottom: 0;
}
.mmap-acc-item .mmap-dot {
    margin-top: 6px;
}
.mmap-acc-item.muted {
    opacity: 0.55;
}
.mmap-acc-item-main {
    min-width: 0;
    margin-right: auto;
}
.mmap-acc-item-main > a {
    color: var(--text-primary);
    font-weight: 500;
}
.mmap-acc-item-main > a:hover {
    color: var(--tint);
    text-decoration: none;
}
.mmap-acc-item-sub {
    color: var(--text-secondary);
    font-size: 13px;
    margin-top: 2px;
}
.mmap-acc-item-sub .warn,
.mmap-iw .warn {
    color: #ff9500;
    font-weight: 600;
}

/* Инфоокна карты (Leaflet popup) под тему */
.leaflet-popup-content-wrapper {
    position: relative;
    border-radius: 16px;
    background: var(--bg-elevated);
    color: var(--text-primary);
    box-shadow: var(--shadow-card);
}
/* Длинный попап (форма назначения доставки) не должен вылезать за карту:
   контент ограничен по высоте (карта 600px минус хвостик и отступы) и
   скроллится. Полоса прокрутки постоянная и заметная (системная на маках
   и телефонах — прячущийся оверлей, человек её не увидит): видимый трек
   на всю высоту и «ползунок» в акцентном цвете */
.leaflet-popup-content {
    margin: 16px 6px 16px 16px;
    padding-right: 10px;
    max-height: 450px;
    overflow-y: auto;
    overscroll-behavior: contain;
}
/* scrollbar-color — только для Firefox: Chrome при заданном scrollbar-color
   игнорирует ::-webkit-scrollbar и возвращает прячущийся системный оверлей —
   полоса «исчезает» */
@supports (-moz-appearance: none) {
    .leaflet-popup-content {
        scrollbar-color: var(--tint) var(--fill);
    }
}
.leaflet-popup-content::-webkit-scrollbar {
    width: 10px;
}
.leaflet-popup-content::-webkit-scrollbar-thumb {
    background: var(--tint);
    border-radius: 5px;
}
.leaflet-popup-content::-webkit-scrollbar-track {
    background: var(--fill);
    border-radius: 5px;
}
/* Пока контент не доскроллен до низа, попап носит класс iw-has-more (вешает
   JS страницы) — градиент у нижнего края намекает, что ниже есть ещё; полосу
   прокрутки справа не накрывает. Главная подсказка для iPhone, где кастомные
   полосы прокрутки не рисуются вовсе */
.leaflet-popup.iw-has-more .leaflet-popup-content-wrapper::after {
    content: '';
    position: absolute;
    left: 2px;
    right: 16px;
    bottom: 2px;
    height: 34px;
    border-radius: 0 0 14px 14px;
    background: linear-gradient(to bottom, transparent, var(--bg-elevated) 85%);
    pointer-events: none;
}
.leaflet-popup-tip {
    background: var(--bg-elevated);
}
.leaflet-container a.leaflet-popup-close-button {
    width: 28px;
    height: 28px;
    padding: 5px 0 0;
    color: var(--text-secondary);
    font-size: 20px;
}
.leaflet-container a.leaflet-popup-close-button:hover {
    color: var(--text-primary);
    background: transparent;
}
/* Leaflet красит все ссылки внутри карты (.leaflet-container a) — возвращаем
   кнопкам-ссылкам в попапе их цвет (иначе «Назначить замерщика» уходит в синий) */
.leaflet-popup-content a.bttn {
    color: var(--text-primary);
}
.leaflet-popup-content a.bttn-orange {
    color: #fff;
}
/* SVG-«капля» маркера без стандартной белой подложки divIcon */
.mmap-pin {
    background: none;
    border: none;
}
/* Подсказка «зумьте с Ctrl» — мигает, когда над картой крутят колесо без Ctrl */
.mmap-zoom-hint {
    position: absolute;
    inset: 0;
    z-index: 800;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    text-align: center;
    font-size: 16px;
    font-weight: 600;
    color: #fff;
    background: rgba(10, 12, 20, 0.5);
    pointer-events: none;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.2s ease, visibility 0.2s ease;
}
.mmap-zoom-hint.show {
    opacity: 1;
    visibility: visible;
}
.mmap-iw {
    min-width: 230px;
    max-width: 280px;
    font-size: 14px;
    font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", "Roboto", "Helvetica Neue", Arial, sans-serif;
}
.mmap-iw-title {
    font-weight: 700;
    font-size: 15px;
    margin-bottom: 6px;
    padding-right: 24px;
}
/* Инфостроки попапа — компактно в одну линию: подпись слева, значение справа
   (как строки настроек iOS); длинное значение переносится с выравниванием
   вправо. Строки формы (с полями) ниже раскладываются столбиком */
.mmap-iw-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    margin-top: 5px;
    text-align: right;
}
.mmap-iw-label {
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.4px;
    color: var(--text-secondary);
    text-align: left;
    flex: none;
}
/* Свёрнутый адрес: ссылка «показать» с пунктиром — видно, что раскрывается */
.mmap-iw-addr-toggle {
    font-size: 13px;
    color: var(--tint);
    border-bottom: 1px dashed currentColor;
}
/* Строка с полем формы: подпись отдельной строкой над полем на всю ширину */
.mmap-iw-row:has(select),
.mmap-iw-row:has(input) {
    display: block;
    text-align: left;
    margin-top: 9px;
}
.mmap-iw-row:has(select) .mmap-iw-label,
.mmap-iw-row:has(input) .mmap-iw-label {
    display: block;
    margin-bottom: 2px;
}
.mmap-iw select,
.mmap-card-assign select {
    width: 100%;
    margin-top: 12px;
}
/* Поля формы «Назначить доставку и монтаж» (карта монтажей) — по строке на поле.
   Та же форма работает и в карточке левой колонки (.mmap-card-assign) */
.mmap-iw .mmap-iw-row select,
.mmap-iw .mmap-iw-row input,
.mmap-card-assign .mmap-iw-row select,
.mmap-card-assign .mmap-iw-row input {
    width: 100%;
    margin-top: 2px;
}
.mmap-iw .bttn,
.mmap-card-assign .bttn {
    height: 40px;
    min-width: 0;
    width: 100%;
    font-size: 15px;
    margin-top: 12px;
}
/* Блок назначения внутри карточки левой колонки */
.mmap-card-assign {
    margin-top: 10px;
}
/* Завершение доставки/монтажа из карточки (страница монтажника):
   низ карточки — контакт слева, круглая иконка-кнопка справа; форма
   результата монтажа разворачивается на всю ширину */
.mount-card-foot {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
    margin-top: 8px;
}
.mount-finish {
    margin-left: auto;
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}
/* Развёрнутое состояние (выбор результата, рекламация, прогресс/ок) —
   отдельной строкой на всю ширину карточки */
.mount-finish:has(.mount-finish-opt),
.mount-finish:has(.mount-claim-text),
.mount-finish:has(.progress),
.mount-finish:has(.mmap-iw-ok) {
    flex: 1 1 100%;
    margin-top: 8px;
}
.mount-finish-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: rgba(52, 199, 89, 0.14);
    transition: background 0.15s, transform 0.1s;
}
.mount-finish-btn:hover {
    background: rgba(52, 199, 89, 0.25);
}
.mount-finish-btn:active {
    transform: scale(0.94);
}
.mount-finish-btn svg {
    fill: var(--green);
}
.mount-finish-opt {
    display: inline-flex;
    align-items: center;
    height: 34px;
    padding: 0 14px;
    border-radius: 17px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
}
.mount-finish-opt.ok {
    background: rgba(52, 199, 89, 0.14);
    color: var(--green);
}
.mount-finish-opt.claim {
    background: rgba(255, 59, 48, 0.12);
    color: #ff3b30;
}
.mount-finish-opt:hover,
.mount-finish-opt:focus {
    text-decoration: none;
    filter: brightness(1.05);
}
.mount-finish-cancel {
    color: var(--text-tertiary);
    font-size: 14px;
    padding: 0 4px;
}
.mount-finish .mount-claim-text {
    width: 100%;
    min-height: 72px;
    padding: 10px 12px;
    border: 0;
    border-radius: var(--radius-control);
    background: var(--fill);
    color: var(--text-primary);
    font: inherit;
    font-size: 15px;
    resize: vertical;
}
.mount-finish .bttn {
    height: 40px;
    min-width: 0;
    font-size: 15px;
    margin: 0;
}
.mount-finish .progress,
.mount-finish .mmap-iw-ok {
    margin: 0;
}
/* Кнопка-триггер «Назначить …». В списке карточек — компактная нейтральная
   пилюля с приглушённой иконкой, чтобы колонка не пестрила оранжевым.
   Жирный градиент остаётся только у «Сохранить» внутри раскрытой формы. */
.mmap-assign-btn {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    height: 34px;
    padding: 0 14px;
    border-radius: 17px;
    background: var(--fill);
    color: var(--text-secondary);
    font-size: 14px;
    font-weight: 600;
    line-height: 1;
    white-space: nowrap;
    cursor: pointer;
    user-select: none;
    transition: background 0.15s, color 0.15s, transform 0.1s;
}
.mmap-assign-btn:hover,
.mmap-assign-btn:focus {
    background: var(--fill-strong);
    color: var(--text-primary);
    text-decoration: none;
}
.mmap-assign-btn:active {
    transform: scale(0.96);
}
.mmap-assign-btn svg {
    width: 16px;
    height: 16px;
    fill: var(--tint);
    flex: none;
}
/* В попапе маркера кнопка одна и это главное действие — там она во всю
   ширину, в мягком акцентном стиле (tinted), без градиента и свечения */
.leaflet-popup-content .mmap-assign-btn {
    width: 100%;
    justify-content: center;
    height: 40px;
    margin-top: 12px;
    border-radius: var(--radius-control);
    background: var(--tint-soft);
    color: var(--tint);
    font-size: 15px;
}
.leaflet-popup-content .mmap-assign-btn:hover,
.leaflet-popup-content .mmap-assign-btn:focus {
    background: var(--tint-soft);
    color: var(--tint);
    filter: brightness(1.05);
}
.mmap-iw-ok {
    color: var(--green);
    font-weight: 600;
    margin: 12px 0 0;
}

/* ---------- Таблицы (синхронизация сотрудников) ---------- */

.emp-sync table {
    width: 100%;
    background: var(--bg-card);
    border-radius: var(--radius-card);
    border-collapse: separate;
    border-spacing: 0;
    overflow: hidden;
    box-shadow: var(--shadow-card);
}
.emp-sync table th,
.emp-sync table td {
    border: 0;
    border-bottom: 1px solid var(--separator);
    padding: 11px 16px;
    text-align: left;
}
.emp-sync table th {
    font-size: 13px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.4px;
    color: var(--text-secondary);
}
.emp-sync table tbody tr:last-child td {
    border-bottom: 0;
}
.emp-sync table tbody tr:hover td {
    background: var(--fill);
}
.emp-sync .upd-passwrd {
    display: inline-block;
    width: 100%;
    text-align: center;
}
/* Кнопка «скопировать пароль» */
.emp-sync .pswd-wrap {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}
.emp-sync .copy-pswd {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 8px;
    background: var(--fill);
    color: var(--text-secondary);
    cursor: pointer;
    flex: none;
    transition: background 0.15s, color 0.15s;
}
.emp-sync .copy-pswd:hover {
    background: var(--fill-strong);
    color: var(--text-primary);
}
.emp-sync .copy-pswd .ic-check {
    display: none;
}
.emp-sync .copy-pswd.copied {
    background: rgba(52, 199, 89, 0.15);
    color: var(--green);
}
.emp-sync .copy-pswd.copied .ic-copy {
    display: none;
}
.emp-sync .copy-pswd.copied .ic-check {
    display: block;
}
/* Пока пароля нет — кнопку не показываем */
.emp-sync td:has(.pswd-container:empty) .copy-pswd {
    display: none;
}
.emp-sync .upd-passwrd:empty {
    display: none;
}
/* Спойлер «Подробнее» нужен только на мобильном */
.emp-sync .emp-toggle {
    display: none;
}
.emp-sync .sync-all:hover,
.emp-sync .upd-passwrd:hover {
    cursor: pointer;
}
.emp-sync h1 img {
    max-height: 32px;
}
.emp-sync .upd-passwrd img {
    max-height: 20px;
}

/* ---------- Калькулятор ---------- */

.price-manage label {
    text-align: left;
}
.calc-wrapper label {
    font-weight: normal;
}
/* Главный переключатель типа: сегмент с подписью, задаёт тип всем блокам */
.calc-wrapper .top {
    margin-bottom: 40px;
    margin-top: 30px;
    max-width: 400px;
}
.calc-wrapper .top .type-def-caption {
    font-size: 13px;
    color: var(--text-secondary);
    margin-bottom: 8px;
    padding-left: 4px;
}
.calc-wrapper .top .type-def-seg {
    display: flex;
    background: var(--fill);
    border-radius: 12px;
    padding: 2px;
}
.calc-wrapper .top .type-def-seg label {
    flex: 1 1 0;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 10px 8px;
    margin: 0;
    border-radius: 10px;
    font-size: 16px;
    font-weight: 500;
    color: var(--text-primary);
    cursor: pointer;
    transition: background 0.15s, color 0.15s, box-shadow 0.15s;
}
.calc-wrapper .top .type-def-seg input[type="radio"] {
    position: absolute;
    width: 0;
    height: 0;
    opacity: 0;
    pointer-events: none;
}
.calc-wrapper .top .type-def-seg label:has(input:checked) {
    background: var(--tint-grad);
    color: #fff;
    font-weight: 600;
    box-shadow: var(--tint-glow);
}
/* Зафиксированный выбор: невыбранный вариант гаснет, клики отключены */
.calc-wrapper .top .type-def-seg.locked label {
    cursor: default;
    pointer-events: none;
}
.calc-wrapper .top .type-def-seg.locked label:not(:has(input:checked)) {
    opacity: 0.35;
}
.calc-wrapper .line .base,
.calc-wrapper .line {
    display: flex;
    align-items: center;
}
/* Селекты в калькуляторе компактнее общих: их ширины зашиты в разметке/JS
   и select2 снимает ширину с нативного селекта при инициализации */
.calc-wrapper select {
    max-width: 150px;
    height: 32px;
    font-size: 14px;
    padding: 0 6px;
}
/* Высота как у select2-контролов (36px), чтобы ряды были ровные */
.calc-wrapper input[type="text"] {
    height: 36px;
    line-height: 34px;
    max-width: 119px;
    border: 1px solid var(--input-border);
    background: var(--input-bg);
    border-radius: 10px;
    padding: 0 8px;
}
.calc-wrapper .calc-block {
    margin-top: 40px;
}
/* Шапка карточки высотой 36px: номер, сегмент типа и цена по одной оси */
.calc-wrapper .calc-block .line .num {
    color: var(--tint);
    display: block;
    position: absolute;
    left: 12px;
    top: 0;
    line-height: 36px;
    font-weight: 700;
}
.calc-wrapper .calc-block .add-more:hover {
    cursor: pointer;
}
.calc-wrapper .calc-block .add-more {
    display: inline-block;
    font-size: 15px;
    font-weight: 600;
    color: var(--tint);
    background: var(--tint-soft);
    border-radius: 100px;
    padding: 3px 12px;
    margin-left: 8px;
}
.calc-wrapper .calc-block .base-wrap {
    display: none;
}
/* Переключатель типа материала — компактный, в верхнем ряду рядом с номером */
.calc-wrapper .line .type-seg {
    position: absolute;
    left: 36px;
    top: 0;
    height: 36px;
    display: flex;
    align-items: center;
    gap: 2px;
    max-width: calc(100% - 130px);
    overflow: hidden;
}
.calc-wrapper .line .type-seg-btn {
    flex: 0 1 auto;
    padding: 2px 9px;
    border-radius: 100px;
    font-size: 13px;
    font-weight: 500;
    color: var(--text-secondary);
    cursor: pointer;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    transition: background 0.15s, color 0.15s;
}
.calc-wrapper .line .type-seg-btn:hover {
    color: var(--text-primary);
}
.calc-wrapper .line .type-seg-btn.active {
    background: var(--tint-grad);
    color: #fff;
    font-weight: 600;
}
/* Подсказка в пустой карточке, пока тип не выбран */
.calc-wrapper .line .type-hint {
    width: 100%;
    text-align: center;
    color: var(--text-tertiary);
    font-size: 13px;
    line-height: 1.4;
    padding: 8px 10px;
}
/* Родной селект типа материала скрыт — его заменяет сегмент */
.calc-wrapper .line select.type-material + .select2-container {
    display: none !important;
}
/* Изделие: оставшиеся два селекта (бренд | артикул) делят ряд поровну */
.calc-wrapper .main .top-wrap-selects {
    gap: 6px;
    width: 100%;
}
.calc-wrapper .main .top-wrap-selects .select2-container {
    flex: 1 1 0;
    min-width: 0;
    width: auto !important;
}
.calc-wrapper .top-wrap-selects {
    display: flex;
    align-items: center;
    flex-direction: row-reverse;
}
.calc-wrapper .price-container {
    display: block;
    position: absolute;
    right: 12px;
    top: 0;
    line-height: 36px;
    font-weight: 600;
}
.calc-wrapper .calc-block .top-label {
    font-size: 12px;
    color: var(--text-secondary);
}
.calc-wrapper .calc-block .line .side {
    max-width: 150px;
}
.calc-wrapper .calc-block .lines-wrapper {
    display: flex;
    flex-wrap: wrap;
}
.calc-wrapper .calc-block .line {
    width: 400px;
    padding: 8px;
    border-radius: var(--radius-card);
    flex-wrap: wrap;
    position: relative;
    background: var(--bg-card);
    box-shadow: var(--shadow-card);
    padding-top: 46px;
    margin-right: 12px;
    margin-bottom: 12px;
    display: flex;
    align-items: flex-start;
    align-content: flex-start;
}
/* Подсветка карточек тенью при наведении, без сдвига */
@media (hover: hover) {
    .calc-wrapper .calc-block .line,
    .measure .content-measure-wrap .line {
        transition: box-shadow 0.15s ease;
    }
    .calc-wrapper .calc-block .line:hover,
    .measure .content-measure-wrap .line:hover {
        box-shadow: 0 4px 10px rgba(31, 27, 57, 0.07), 0 16px 40px rgba(255, 90, 46, 0.12);
    }
}
/* Шапка карточки (номер, тип, цена) отделена линией от параметров */
.calc-wrapper .calc-block .line:before {
    content: "";
    position: absolute;
    top: 36px;
    left: 0;
    right: 0;
    border-top: 1px solid var(--separator);
}
/* Страховка от выхода select2 за пределы карточки */
.calc-wrapper .line .select2-container {
    max-width: 100%;
}
.calc-wrapper .select2-container--default .select2-selection--single .select2-selection__rendered {
    padding-left: 8px;
    font-size: 14px;
}
.calc-wrapper .top-wrap-selects {
    flex-wrap: wrap;
}
.calc-wrapper .dop .top-wrap-selects span.select2:nth-child(8) {
    margin-top: 5px;
}
.calc-wrapper .work .top-wrap-selects .count {
    margin-top: 5px;
}
.calc-wrapper .work .top-wrap-selects {
    flex-wrap: wrap;
    flex-direction: row;
}
.calc-wrapper .work .top-wrap-selects span.select2 {
    margin-top: 5px;
}
.calc-wrapper .work .top-wrap-selects .price {
    width: 369px;
    max-width: 369px !important;
}
.calc-wrapper .dop .top-wrap-selects .count {
    width: 69px;
    margin-top: 5px;
}
.calc-wrapper .dop .top-wrap-selects .price {
    width: 300px;
    max-width: 300px !important;
    margin-top: 5px;
}
.calc-wrapper .calc-block h4 .block-total {
    margin-left: auto;
}
.calc-wrapper .calc-block h4 {
    width: 400px;
    margin-bottom: 15px;
    display: flex;
    align-items: center;
    padding-bottom: 10px;
    border-bottom: 1px solid var(--separator);
}
.calc-wrapper .result {
    width: 400px;
    background: var(--bg-card);
    border-radius: var(--radius-card);
    box-shadow: var(--shadow-card);
    padding: 6px 16px;
}
.calc-wrapper .result h3 > input {
    margin-left: 5px;
}
.calc-wrapper .result h3 > span {
    margin-left: auto;
    margin-right: 5px;
}
.calc-wrapper .result h3 {
    display: flex;
    align-items: center;
    font-size: 17px;
    margin: 14px 0;
}
.calc-wrapper .dop .top-wrap-selects {
    flex-wrap: wrap;
    flex-direction: row;
}
.calc-wrapper .errors {
    color: var(--red);
}
.client-wrapper-data .info-line {
    margin-top: 20px;
}
.client-wrapper-data {
    margin-top: 100px;
}
.client-wrapper-data .info-line b {
    font-weight: 600;
}
/* Кнопка-ссылка на документацию замера в Google Диске */
.drive-link {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin-top: 8px;
    padding: 10px 16px;
    background: var(--bg-card);
    border: 1px solid var(--input-border);
    border-radius: var(--radius-control);
    box-shadow: var(--shadow-card);
    color: var(--text-primary);
    font-weight: 600;
    font-size: 15px;
    text-decoration: none;
    transition: border-color 0.15s, transform 0.15s;
}
.drive-link:hover, .drive-link:focus {
    color: var(--text-primary);
    border-color: var(--input-border-hover);
    text-decoration: none;
    transform: translateY(-1px);
}
.drive-link svg {
    flex: none;
}
.drive-link .ext-arrow {
    color: var(--text-tertiary);
    font-size: 14px;
}
.drive-link-empty {
    display: inline-block;
    margin-top: 8px;
    color: var(--text-tertiary);
}

/* ---------- Select2 и jQuery UI под тему ---------- */

.select2-container--default .select2-selection--single,
.select2-container--default .select2-selection--multiple {
    background: var(--input-bg);
    border: 1px solid var(--input-border);
    border-radius: 10px;
    min-height: 36px;
    transition: border-color 0.15s, box-shadow 0.15s;
}
.select2-container--default .select2-selection--single:hover,
.select2-container--default .select2-selection--multiple:hover {
    border-color: var(--input-border-hover);
}
.select2-container--default.select2-container--open .select2-selection--single,
.select2-container--default.select2-container--focus .select2-selection--multiple,
.select2-container--default.select2-container--open .select2-selection--multiple {
    border-color: var(--tint);
    box-shadow: 0 0 0 3px var(--tint-soft);
}
.select2-container--default .select2-selection--single .select2-selection__rendered {
    color: var(--text-primary);
    line-height: 34px;
    padding-left: 12px;
}
.select2-container--default .select2-selection--single {
    height: 36px;
}
.select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 34px;
}
.select2-dropdown {
    background: var(--bg-elevated);
    border: 1px solid var(--separator);
    border-radius: var(--radius-control);
    overflow: hidden;
    color: var(--text-primary);
}
.select2-container--default .select2-search--dropdown .select2-search__field {
    background: var(--input-bg);
    border: 1px solid var(--input-border);
    border-radius: var(--radius-small);
    color: var(--text-primary);
}
.select2-container--default .select2-results__option--highlighted[aria-selected] {
    background: var(--tint);
}
.select2-container--default .select2-selection--multiple .select2-selection__choice {
    background: var(--tint-soft);
    border: 0;
    border-radius: 100px;
    color: var(--tint);
    padding: 2px 10px;
}

.ui-widget.ui-widget-content {
    background: var(--bg-elevated);
    border: 1px solid var(--separator);
    border-radius: var(--radius-card);
    box-shadow: var(--shadow-card);
    color: var(--text-primary);
}
.ui-widget-header {
    background: transparent;
    border: 0;
    color: var(--text-primary);
}
.ui-state-default,
.ui-widget-content .ui-state-default {
    background: transparent;
    border: 0;
    color: var(--text-primary);
    text-align: center;
    border-radius: var(--radius-small);
}
.ui-state-hover,
.ui-widget-content .ui-state-hover {
    background: var(--fill);
    border: 0;
}
.ui-state-active,
.ui-widget-content .ui-state-active {
    background: var(--tint);
    border: 0;
    color: #fff;
}

/* ---------- Публичная страница заказа ---------- */

.docs-container .gallery {
    background: var(--bg-card);
    border-radius: var(--radius-card);
    box-shadow: var(--shadow-card);
    padding: 16px;
    margin-bottom: 12px;
}
.docs-container .gallery img {
    border-radius: 10px;
}

/* ---------- Анимация синхронизации ---------- */

@keyframes rotating {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}
.rotating {
    animation: rotating 2s linear infinite;
}

/* «Обновить приложение» — тихая сервисная функция под списком меню, не пункт.
   Сидит на тёмном оверлее шторки (rgba(25,18,42,.45)), поэтому текст светлый —
   в обе темы. display:none снимает pwa.js только в webapp (с домашнего экрана) */
#pwa-hard-refresh-item {
    text-align: center;
    margin-top: 14px;
}
#pwa-hard-refresh-item a {
    font-size: 12px;
    color: rgba(255, 255, 255, 0.6);
    text-decoration: none;
    border-bottom: 1px dotted currentColor;
    transition: color 0.2s;
}
#pwa-hard-refresh-item:hover a,
#pwa-hard-refresh-item:active a {
    color: rgba(255, 255, 255, 0.9);
}
/* Без сети «Обновить приложение» запрещено: чистка кэшей офлайн уничтожит
   сохранённые страницы и оставит пустой экран */
body.is-offline #pwa-hard-refresh-item {
    opacity: 0.4;
    pointer-events: none;
}

/* ---------- Лоадер перехода между страницами (webapp) ---------- */

#page-loader {
    position: fixed;
    inset: 0;
    z-index: 500;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 14px;
    background: var(--bg-blur);
    -webkit-backdrop-filter: blur(14px);
    backdrop-filter: blur(14px);
    opacity: 0;
    animation: page-loader-in 0.2s ease-out 0.05s forwards;
}
@keyframes page-loader-in {
    to { opacity: 1; }
}
#page-loader .spinner {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    border: 3px solid var(--fill-strong);
    border-top-color: var(--tint);
    animation: rotating 0.8s linear infinite;
}
#page-loader .loader-text {
    font-size: 15px;
    color: var(--text-secondary);
}

/* End */
/* /local/templates/furniture_blue/styles.css?1785009513939 */
/* /local/templates/furniture_blue/template_styles.css?178500951368597 */