/* =========================================================================
   lk_refresh.css — визуальный оверлей для ЛК менеджера замеров «Фабрика Окон»
   Подключать ПОСЛЕ css/main.css (и после bootstrap):
       <link rel="stylesheet" href="css/lk_refresh.css">
   Только переопределения. Разметку/JS/классы НЕ трогаем.
   !important используется точечно — там, где в шаблонах инлайн-style,
   иначе не перебиваемый (помечено комментарием INLINE).
   ========================================================================= */

/* ---------- 1. Дизайн-токены ---------- */
:root {
    --fo-navy:        #0F2942;
    --fo-navy-2:      #0A1F36;
    --fo-blue:        #1E6FD9;
    --fo-blue-600:    #1B62C0;
    --fo-blue-050:    #EAF2FD;
    --fo-blue-100:    #D7E7FB;

    --fo-green:       #16A34A;
    --fo-green-050:   #E9F7EF;
    --fo-green-600:   #13913F;

    --fo-amber:       #E0920A;
    --fo-amber-050:   #FDF4E3;

    --fo-red:         #DC2E3E;
    --fo-red-050:     #FCEBEC;

    --fo-gray-050:    #F5F7FA;
    --fo-gray-100:    #EDF1F6;
    --fo-gray-200:    #E2E8F0;
    --fo-gray-300:    #CBD5E1;
    --fo-gray-500:    #64748B;
    --fo-gray-700:    #334155;
    --fo-ink:         #16202E;

    --fo-radius:      14px;
    --fo-radius-sm:   10px;
    --fo-radius-pill: 999px;

    --fo-shadow-sm:   0 1px 2px rgba(15,41,66,.06), 0 1px 3px rgba(15,41,66,.08);
    --fo-shadow-md:   0 4px 14px rgba(15,41,66,.10), 0 1px 3px rgba(15,41,66,.06);
    --fo-shadow-lg:   0 12px 34px rgba(15,41,66,.16);

    --fo-font: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
               "Helvetica Neue", system-ui, "Arial", sans-serif;

    --fo-tap: 48px; /* минимальный тап-таргет */
}

/* ---------- 2. База / типографика ---------- */
html { -webkit-text-size-adjust: 100%; }

body {
    font-family: var(--fo-font);
    color: var(--fo-ink);
    background: var(--fo-gray-100);
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    line-height: 1.45;
}

.content {
    background: var(--fo-gray-100);
    max-width: 720px;
    padding: 66px 12px 40px;
    min-height: 100vh;
    height: auto;
}

/* Читаемые ссылки в фирменном синем */
.content a,
.tiket_body a { color: var(--fo-blue); text-decoration: none; }
.content a:active { color: var(--fo-blue-600); }

/* ---------- 3. Липкий хедер ---------- */
.header,
.header_tiket {
    background: linear-gradient(135deg, var(--fo-navy) 0%, var(--fo-navy-2) 100%);
    height: 58px;
    box-shadow: 0 2px 14px rgba(10,31,54,.28);
    border-bottom: none;
    display: flex;
    align-items: center;
    font-size: 16px;
    letter-spacing: .1px;
}

/* внутренний ряд хедера: инлайн padding перебиваем */
.header > .row {
    padding: 0 60px 0 58px !important; /* INLINE: было padding-left/right/top 20/20/5 */
    margin: 0;
    width: 100%;
    display: flex;
    align-items: center;
    position: static;
}

/* «домик» слева */
.header .glyphicon-home {
    font-size: 22px !important;             /* INLINE 29px */
    padding: 0 !important;                  /* INLINE padding-top:10px */
    color: #fff;
    opacity: .92;
}
.header > .row > div:first-child {
    width: 58px !important;                 /* INLINE 50px */
    height: 58px !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
    left: 0 !important;
    top: 0 !important;
}

/* центральный блок: дата + ФИО */
#header_content {
    display: flex !important;               /* INLINE display:table-cell */
    flex-direction: column;
    justify-content: center;
    padding-left: 4px !important;           /* INLINE padding-left:50px */
    line-height: 1.15;
}
#header_content > div:first-child {
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .6px;
    color: var(--fo-blue-100);
    opacity: .85;
}
#header_content > div:nth-child(2) {
    font-size: 15px !important;             /* INLINE font-size:small */
    font-weight: 700 !important;
    line-height: 1.2 !important;
    color: #fff;
}

/* гамбургер */
.menu_button {
    width: 58px;
    height: 58px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-left: auto;
    left: auto;
}
.menu_button .glyphicon-menu-hamburger {
    font-size: 22px !important;             /* INLINE 29px */
    padding: 0 !important;
    color: #fff;
    opacity: .92;
}

/* заголовок карточки замера (tiket) */
.header_tiket .back_button {
    background: rgba(255,255,255,.14);
    color: #fff;
    border: 1px solid rgba(255,255,255,.28);
    border-radius: var(--fo-radius-sm);
    min-height: 40px;
    min-width: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin: 0 0 0 14px;
    padding: 8px 12px;
}

/* ---------- 4. Слайдаут-меню ---------- */
.menu,
.slideout-menu {
    background: linear-gradient(180deg, var(--fo-navy) 0%, var(--fo-navy-2) 100%);
    width: 268px;
}
.menu_warp {
    padding: 70px 12px 20px 12px;
}
.menu_item {
    width: auto;
    height: auto;
    min-height: var(--fo-tap);
    display: flex;
    align-items: center;
    gap: 10px;
    background: rgba(255,255,255,.05);
    border: 1px solid rgba(255,255,255,.08);
    border-radius: var(--fo-radius-sm);
    color: #EAF1FA;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: .3px;
    text-transform: none;
    box-shadow: none;
    padding: 12px 14px;
    margin: 8px 0;
    transition: background .15s ease, transform .1s ease;
}
.menu_item:active {
    background: var(--fo-blue);
    transform: scale(.99);
}
.menu_item .glyphicon {
    color: var(--fo-blue-100);
    font-size: 17px !important;
    padding: 0 2px 0 0 !important;         /* INLINE padding-top/left/right */
    width: 22px;
    text-align: center;
}

/* ---------- 5. Карточки-замеры (nochecklist / overdue / current) ---------- */
.nochecklist,
.overdue,
.current {
    margin: 10px 0;
    padding: 14px 14px 14px 16px;
    border-radius: var(--fo-radius);
    border-left: 4px solid transparent;
    box-shadow: var(--fo-shadow-sm);
    background: #fff;
    transition: box-shadow .15s ease, transform .1s ease;
}
.nochecklist:active,
.overdue:active,
.current:active { box-shadow: var(--fo-shadow-md); transform: translateY(-1px); }

/* просрочено — красный акцент */
.overdue {
    background: #F9CFCF;          /* сплошная заливка по статусу (доработка 29.09.2026) */
    border-left-color: var(--fo-red);
}
/* сегодня / в работе — зелёный акцент */
.current {
    background: #CDEFD7;
    border-left-color: var(--fo-green);
}
/* нет чек-листа — нейтральный янтарный акцент */
.nochecklist {
    background: #FAE3AA;
    border-left-color: var(--fo-amber);
}

/* статус-«таблетка» над содержимым карточки: первый прямой div внутри {info} */
.nochecklist .item_state,
.overdue .item_state,
.current .item_state { /* если появится семантический класс — оформим */
    display: inline-block;
}

/* строка адреса/клиента внутри карточки */
.client_box {
    background: transparent;
    border: none;
    padding: 0;
    margin: 0;
}
.cb_name {
    font-size: 15px;
    color: var(--fo-ink);
    letter-spacing: .2px;
}
.client_box .raw {
    display: flex;
    align-items: flex-start;
    gap: 4px;
    margin: 3px 0;
    color: var(--fo-gray-700);
}
.client_box .glyphicon { color: var(--fo-gray-500); }

/* кнопка-стрелка «открыть замер» */
.item_button {
    background: var(--fo-blue);
    border: none;
    border-radius: var(--fo-radius-sm);
    color: #fff;
    width: var(--fo-tap);
    height: var(--fo-tap);
    min-width: var(--fo-tap);
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: var(--fo-shadow-sm);
    transition: background .15s ease, transform .1s ease;
}
.item_button:active { background: var(--fo-blue-600); transform: scale(.96); }
.item_button .glyphicon { font-size: 18px; }

/* ---------- 6. План дня / дебиторка ---------- */
.dayliplan {
    background: #fff;
    border: 1px solid var(--fo-gray-200);
    border-left: 4px solid var(--fo-blue);
    border-radius: var(--fo-radius);
    box-shadow: var(--fo-shadow-sm);
    margin: 10px 0;
    padding: 14px 16px;
}
.dayliplan #daily_table td { padding: 3px 0; }
.plan_of_day { color: var(--fo-ink); font-weight: 700; }
.plan_item_button {
    background: var(--fo-green);
    border: none;
    border-radius: var(--fo-radius-sm);
    width: var(--fo-tap);
    height: var(--fo-tap);
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: var(--fo-shadow-sm);
}
.plan_item_button:active { background: var(--fo-green-600); }

.debit_block {
    background: var(--fo-amber-050);
    border: 1px solid #F0D79A;
    border-left: 4px solid var(--fo-amber);
    border-radius: var(--fo-radius);
    box-shadow: var(--fo-shadow-sm);
    margin: 10px 0;
    padding: 14px 16px;
}
.debit_item_button {
    background: var(--fo-amber);
    border: none;
    border-radius: var(--fo-radius-sm);
    width: var(--fo-tap);
    height: var(--fo-tap);
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

/* ---------- 7. Кнопки общего назначения ---------- */
.btn.btn-primary,
.btn-signin,
.checklist_button {
    background: var(--fo-blue);
    background-image: none;
    border: none;
    border-radius: var(--fo-radius-sm);
    color: #fff;
    font-weight: 700;
    letter-spacing: .3px;
    text-transform: none;
    box-shadow: var(--fo-shadow-sm);
    transition: background .15s ease, transform .1s ease;
}
.btn.btn-primary:active,
.btn-signin:active,
.checklist_button:active {
    background: var(--fo-blue-600);
    transform: translateY(1px);
}
.checklist_button {
    min-height: 52px;
    line-height: normal;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin: 12px 8px;
}

/* фильтр-переключатели (segmented control) */
.filter_button_active,
.filter_button {
    height: 44px;
    width: auto;
    min-width: 96px;
    padding: 0 16px;
    margin: 3px;
    border-radius: var(--fo-radius-pill);
    border: 1px solid var(--fo-gray-300);
    font-weight: 600;
    text-transform: none;
    font-size: 14px;
    transition: all .15s ease;
}
.filter_button_active {
    background: var(--fo-blue);
    border-color: var(--fo-blue);
    color: #fff;
    box-shadow: var(--fo-shadow-sm);
}
.filter_button { background: #fff; color: var(--fo-blue); }

/* ---------- 8. Поля ввода ---------- */
.form-control {
    border: 1px solid var(--fo-gray-300);
    border-radius: var(--fo-radius-sm);
    min-height: 48px;
    font-size: 16px;                 /* >=16px чтобы iOS не зумил */
    color: var(--fo-ink);
    box-shadow: none;
    transition: border-color .15s ease, box-shadow .15s ease;
    padding: 10px 14px;
}
.form-control:focus {
    border-color: var(--fo-blue);
    box-shadow: 0 0 0 3px var(--fo-blue-050);
    outline: none;
}
.book_search_input {
    border: 1px solid var(--fo-gray-300);
    border-radius: var(--fo-radius-sm);
    padding: 12px 14px;
    color: var(--fo-ink);
    font-size: 18px;
}

/* ---------- 9. Экран входа ---------- */
.container_l {
    max-width: 380px;
    margin: 8vh auto;
    padding: 20px;
}
.card.card-container {
    background: #fff;
    border-radius: 18px;
    box-shadow: var(--fo-shadow-lg);
    padding: 32px 26px 30px;
    border: 1px solid var(--fo-gray-200);
    position: relative;
}
/* фирменная плашка-«шапка» над карточкой входа */
.card.card-container::before {
    content: "ФАБРИКА ОКОН";
    display: block;
    font-size: 13px;
    font-weight: 800;
    letter-spacing: 2.5px;
    color: var(--fo-navy);
    margin-bottom: 4px;
}
.card.card-container::after {
    content: "Личный кабинет менеджера замеров";
    display: block;
    font-size: 12.5px;
    color: var(--fo-gray-500);
    margin-bottom: 20px;
}
.profile-img-card {
    width: 76px !important;          /* INLINE в bootstrap-варианте */
    height: 76px;
    border-radius: 50%;
    object-fit: cover;
    margin: 0 auto 14px;
    border: 3px solid var(--fo-blue-050);
}
.btn-signin,
.card.card-container .btn-block {
    margin-top: 8px;
    min-height: 52px;
    font-size: 16px;
}

/* фон страницы логина */
body:has(.container_l) {
    background:
        radial-gradient(1100px 500px at 80% -10%, rgba(30,111,217,.10), transparent 60%),
        linear-gradient(180deg, #EEF3F9 0%, #E4EBF3 100%);
}

/* ---------- 10. «Моя статистика» — KPI ---------- */
.kpi_block { padding: 4px 0; text-align: center; }

.kpi_item {
    background: #fff;
    border: 1px solid var(--fo-gray-200);
    border-bottom: 1px solid var(--fo-gray-200);   /* убираем пунктир */
    border-radius: var(--fo-radius);
    box-shadow: var(--fo-shadow-sm);
    padding: 18px 16px !important;                  /* INLINE padding */
    margin: 12px 4px;
}
.kpi_caption {
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .8px;
    text-transform: uppercase;
    color: var(--fo-gray-500);
    font-family: var(--fo-font);
    margin-bottom: 10px;
}
.kpi_inform { color: var(--fo-gray-500); font-family: var(--fo-font); }

.avarage_val,
.upr {
    color: var(--fo-navy);
    font-weight: 800;
    font-size: 34px;
    letter-spacing: -.5px;
    line-height: 1.1;
}

/* circles.js пончик — подкрасим текст под фирму (сам SVG красит JS) */
.circle strong { color: var(--fo-navy) !important; }
.circle i { color: var(--fo-gray-500) !important; font-style: normal; }

/* отчётный период */
.reportdate_block {
    background: #fff;
    border: 1px solid var(--fo-gray-200);
    border-radius: var(--fo-radius);
    box-shadow: var(--fo-shadow-sm);
    padding: 14px;
    margin: 4px 4px 12px;
}
.reportdate_cap {
    color: var(--fo-gray-500);
    font-family: var(--fo-font);
    font-size: 12px;
    letter-spacing: .8px;
}
.reportdate_input {
    color: var(--fo-navy);
    font-family: var(--fo-font);
    border: 1px solid var(--fo-gray-300);
    border-radius: var(--fo-radius-sm);
    padding: 8px 12px;
    min-height: 44px;
    font-size: 18px;
    margin-top: 6px;
}

/* призовой фонд / рейтинг */
.award_block {
    background: #fff;
    border: 1px solid var(--fo-gray-200);
    border-radius: var(--fo-radius);
    box-shadow: var(--fo-shadow-sm);
    padding: 14px;
    margin: 12px 4px;
    font-variant: normal;
}
.raiting_block {
    background: #fff;
    border: 1px solid var(--fo-gray-200);
    border-radius: var(--fo-radius);
    box-shadow: var(--fo-shadow-sm);
    padding: 8px 12px;
    margin: 12px 4px;
}
.raiting_caps_line {
    border-bottom: 2px solid var(--fo-blue);
    color: var(--fo-navy);
    font-variant: normal;
    padding-bottom: 6px;
    margin-bottom: 6px;
}
.raiting_position_1 { background: var(--fo-blue);      color:#fff; }
.raiting_position_2 { background: var(--fo-blue-100);  color: var(--fo-navy); }
.raiting_position_3 { background: var(--fo-blue-050);  color: var(--fo-navy); }
.raiting_position_all { background: var(--fo-gray-200); color: var(--fo-gray-700); }

/* ---------- 11. Информ-плашки (жёлтые F1FFCF в шаблонах) ---------- */
/* Перекрываем инлайновый фон подсказок на аккуратный синий info */
[style*="F1FFCF"],
[style*="f1ffcf"] {
    background: var(--fo-blue-050) !important;      /* INLINE background */
    border-left: 3px solid var(--fo-blue) !important;
    border-radius: var(--fo-radius-sm) !important;
    color: var(--fo-gray-700) !important;
}

/* поиск / карточка результата */
#search_result {
    background: #fff !important;                     /* INLINE background:#FFFBDE */
    border: 1px solid var(--fo-gray-200) !important;
    border-radius: var(--fo-radius) !important;
    box-shadow: var(--fo-shadow-sm);
    margin: 10px 2px !important;
    padding: 12px !important;
}
.search_form_wrap { }

/* обёртка формы поиска (первый div в search_form) */
#search_contact,
#loyalcardnumber,
#loyal_reg_name,
#loyal_reg_phone {
    border-radius: var(--fo-radius-sm) !important;   /* INLINE height/font */
    border: 1px solid var(--fo-gray-300);
}

/* ---------- 12. Состояния статуса внутри карточки замера ---------- */
.tiket_state_current {
    background: var(--fo-green-050);
    border: 1px solid #B7E4C6;
    border-radius: var(--fo-radius-pill);
    color: var(--fo-green-600);
    padding: 6px 14px;
}
.tiket_state_overdue {
    background: var(--fo-red-050);
    border: 1px solid #F5C0C5;
    border-radius: var(--fo-radius-pill);
    color: var(--fo-red);
    padding: 6px 14px;
}
.tiket_state_nochecklist {
    background: var(--fo-amber-050);
    border: 1px solid #F0D79A;
    border-radius: var(--fo-radius-pill);
    color: var(--fo-amber);
    padding: 6px 14px;
}

/* ---------- 13. Адаптив ---------- */
@media (min-width: 768px) {
    .content { padding-left: 20px; padding-right: 20px; }
    /* KPI в 2 колонки на планшете+ */
    .kpi_block {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 4px;
    }
    /* элементы с графиками/таблицами занимают всю ширину */
    .kpi_item:nth-child(2),
    .kpi_item:nth-child(7),
    .kpi_item:nth-child(8) { grid-column: 1 / -1; }
}

/* уважение к prefers-reduced-motion */
@media (prefers-reduced-motion: reduce) {
    * { transition: none !important; }
}
