/* ==========================================================================
   Neo-Tactile Soft UI — дизайн-система CRM прачечной
   Тёплая палитра, мягкие тени, «тактильные» поверхности.
   ========================================================================== */

:root {
    /* --- Поверхности и текст --- */
    --c-bg: #eee9e2;
    --c-bg-soft: #f6f3ee;
    --c-surface: #fbf9f6;
    --c-surface-2: #f2ede6;
    --c-sunken: #e8e2d9;
    --c-border: #e2dad0;
    --c-border-strong: #cfc4b5;
    --c-text: #3b3531;
    --c-text-soft: #6d635b;
    --c-text-muted: #968b81;

    /* --- Акценты --- */
    --c-sage: #86b296;
    --c-sage-strong: #6c9b7d;
    --c-sage-deep: #4f7a60;
    --c-sage-soft: #dcebe1;
    --c-rose: #c68d87;
    --c-rose-strong: #b1746e;
    --c-rose-soft: #f2e1de;
    --c-blue: #7ea9cb;
    --c-blue-strong: #5c8db4;
    --c-blue-soft: #dde9f3;
    --c-amber: #c2a068;
    --c-amber-soft: #f2e7d2;
    --c-taupe: #a99c91;
    --c-taupe-soft: #e6ded4;

    /* --- Радиусы --- */
    --r-sm: 4px;
    --r-md: 8px;
    --r-lg: 12px;
    --r-xl: 16px;
    --r-pill: 999px;

    /* --- Тени --- */
    --sh-inner: inset 0 2px 4px rgba(94, 78, 63, 0.10), inset 0 1px 0 rgba(255, 255, 255, 0.55);
    --sh-lift: 0 1px 1px rgba(94, 78, 63, 0.04), 0 2px 6px rgba(94, 78, 63, 0.07);
    --sh-raised: 0 1px 2px rgba(94, 78, 63, 0.05), 0 4px 12px rgba(94, 78, 63, 0.09);
    --sh-float: 0 2px 4px rgba(94, 78, 63, 0.06), 0 12px 28px rgba(94, 78, 63, 0.13);
    --sh-highlight: inset 0 1px 0 rgba(255, 255, 255, 0.75);
    --sh-focus: 0 0 0 3px rgba(126, 169, 203, 0.32);
    --sh-focus-sage: 0 0 0 3px rgba(134, 178, 150, 0.30);

    /* --- Отступы --- */
    --s-1: 4px;
    --s-2: 8px;
    --s-3: 16px;
    --s-4: 24px;

    --sidebar-w: 248px;
    --topbar-h: 60px;
}

/* ==========================================================================
   Базовые элементы
   ========================================================================== */

body {
    background: linear-gradient(160deg, var(--c-bg-soft) 0%, var(--c-bg) 100%);
    background-attachment: fixed;
    color: var(--c-text);
    font-family: "Segoe UI", -apple-system, BlinkMacSystemFont, "Inter", Roboto, "Helvetica Neue", sans-serif;
    font-size: 15px;
    -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6 {
    color: var(--c-text);
    letter-spacing: -0.01em;
    font-weight: 650;
}

a {
    color: var(--c-sage-deep);
    text-underline-offset: 2px;
}

a:hover {
    color: var(--c-sage-strong);
}

.text-muted {
    color: var(--c-text-muted) !important;
}

hr {
    border-color: var(--c-border);
    opacity: 1;
}

::selection {
    background: var(--c-sage-soft);
}

/* ==========================================================================
   Каркас приложения: сайдбар + контент
   ========================================================================== */

.app-shell {
    min-height: 100vh;
}

.app-sidebar {
    /* Ширина выезжающей шторки на мобильном (по умолчанию Bootstrap ставит 400px) */
    --bs-offcanvas-width: min(284px, 82vw);
    background: var(--c-surface);
    border-right: 1px solid var(--c-border);
    width: var(--sidebar-w);
    display: flex;
    flex-direction: column;
    padding: 0;
}

.sidebar-brand {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 18px 18px 16px;
    border-bottom: 1px solid var(--c-border);
}

.brand-mark {
    width: 38px;
    height: 38px;
    flex: 0 0 38px;
    border-radius: var(--r-lg);
    display: grid;
    place-items: center;
    font-size: 19px;
    color: #fff;
    background: linear-gradient(160deg, var(--c-sage) 0%, var(--c-sage-strong) 100%);
    box-shadow: var(--sh-raised), var(--sh-highlight);
}

.brand-text {
    line-height: 1.15;
    font-weight: 700;
    font-size: 15px;
    color: var(--c-text);
}

.brand-text small {
    display: block;
    font-weight: 500;
    font-size: 11.5px;
    color: var(--c-text-muted);
    letter-spacing: 0.02em;
}

.sidebar-nav {
    padding: 14px 12px;
    overflow-y: auto;
    flex: 1 1 auto;
}

.nav-section-label {
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.09em;
    text-transform: uppercase;
    color: var(--c-text-muted);
    padding: 14px 10px 6px;
}

.nav-section-label:first-child {
    padding-top: 2px;
}

.nav-link-item {
    display: flex;
    align-items: center;
    gap: 11px;
    padding: 9px 11px;
    margin-bottom: 2px;
    border-radius: var(--r-md);
    color: var(--c-text-soft);
    text-decoration: none;
    font-size: 14.5px;
    font-weight: 500;
    border: 1px solid transparent;
    transition: background-color 0.15s ease, color 0.15s ease, box-shadow 0.15s ease;
}

.nav-link-item i {
    font-size: 17px;
    width: 20px;
    text-align: center;
    color: var(--c-taupe);
    transition: color 0.15s ease;
}

.nav-link-item:hover {
    background: var(--c-surface-2);
    color: var(--c-text);
}

.nav-link-item:hover i {
    color: var(--c-sage-strong);
}

.nav-link-item.active {
    background: linear-gradient(160deg, #ffffff 0%, var(--c-sage-soft) 100%);
    color: var(--c-sage-deep);
    font-weight: 650;
    border-color: rgba(134, 178, 150, 0.35);
    box-shadow: var(--sh-lift), var(--sh-highlight);
}

.nav-link-item.active i {
    color: var(--c-sage-strong);
}

.nav-link-item .nav-count {
    margin-left: auto;
    font-size: 11px;
    font-weight: 700;
    color: #fff;
    background: var(--c-rose);
    border-radius: var(--r-pill);
    padding: 1px 7px;
}

.sidebar-footer {
    padding: 12px;
    border-top: 1px solid var(--c-border);
    font-size: 12px;
    color: var(--c-text-muted);
}

/* --- Верхняя панель --- */

.app-topbar {
    height: var(--topbar-h);
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 0 16px;
    background: rgba(251, 249, 246, 0.85);
    backdrop-filter: blur(10px);
    border-bottom: 1px solid var(--c-border);
    position: sticky;
    top: 0;
    z-index: 1020;
}

.topbar-title {
    font-weight: 650;
    font-size: 15px;
}

.app-content {
    padding: 22px 20px 48px;
}

.btn-icon {
    width: 38px;
    height: 38px;
    display: inline-grid;
    place-items: center;
    border-radius: var(--r-md);
    border: 1px solid var(--c-border);
    background: var(--c-surface);
    color: var(--c-text-soft);
    font-size: 18px;
    box-shadow: var(--sh-lift);
    transition: all 0.15s ease;
    position: relative;
}

.btn-icon:hover {
    color: var(--c-text);
    box-shadow: var(--sh-raised);
    transform: translateY(-1px);
}

.btn-icon:active {
    box-shadow: var(--sh-inner);
    transform: translateY(0);
}

.user-chip {
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 5px 10px 5px 5px;
    border-radius: var(--r-pill);
    border: 1px solid var(--c-border);
    background: var(--c-surface);
    box-shadow: var(--sh-lift);
    color: var(--c-text);
    text-decoration: none;
    transition: all 0.15s ease;
}

.user-chip:hover {
    color: var(--c-text);
    box-shadow: var(--sh-raised);
    transform: translateY(-1px);
}

.user-avatar {
    width: 30px;
    height: 30px;
    flex: 0 0 30px;
    border-radius: var(--r-pill);
    display: grid;
    place-items: center;
    font-size: 12.5px;
    font-weight: 700;
    color: #fff;
    background: linear-gradient(160deg, var(--c-taupe) 0%, #8d8177 100%);
    box-shadow: var(--sh-highlight);
}

.user-chip.is-admin .user-avatar {
    background: linear-gradient(160deg, var(--c-sage) 0%, var(--c-sage-strong) 100%);
}

.user-chip-name {
    font-size: 13.5px;
    font-weight: 600;
    line-height: 1.1;
}

.user-chip-role {
    font-size: 11px;
    color: var(--c-text-muted);
}

/* --- Раскладка --- */

@media (min-width: 992px) {
    .app-sidebar {
        position: fixed;
        top: 0;
        left: 0;
        height: 100vh;
        z-index: 1030;
    }

    .app-main {
        margin-left: var(--sidebar-w);
    }

    .app-content {
        padding: 26px 28px 64px;
    }
}

/* ==========================================================================
   Карточки
   ========================================================================== */

.card {
    background: var(--c-surface);
    border: 1px solid var(--c-border);
    border-radius: var(--r-lg);
    box-shadow: var(--sh-lift), var(--sh-highlight);
}

.card-header {
    background: transparent;
    border-bottom: 1px solid var(--c-border);
    font-weight: 650;
    font-size: 14.5px;
    color: var(--c-text);
    padding: 13px 16px;
    border-radius: var(--r-lg) var(--r-lg) 0 0 !important;
}

.card-body {
    padding: 16px;
}

.card.border-danger {
    border-color: rgba(198, 141, 135, 0.5);
    box-shadow: var(--sh-raised);
}

.card.border-danger .card-header {
    background: var(--c-rose-soft);
    color: var(--c-rose-strong);
    border-bottom-color: rgba(198, 141, 135, 0.35);
}

/* Плитки-счётчики на доске заказов */
.stat-card {
    border-radius: var(--r-lg);
    transition: transform 0.18s ease, box-shadow 0.18s ease;
}

.stat-card:hover {
    transform: translateY(-2px);
    box-shadow: var(--sh-raised), var(--sh-highlight);
}

.stat-card .card-body {
    padding: 14px 16px;
}

.stat-card .display-6 {
    font-weight: 700;
    font-size: 30px;
    line-height: 1.1;
    letter-spacing: -0.02em;
}

.stat-card .text-muted {
    font-size: 12px;
    letter-spacing: 0.01em;
}

.empty-state {
    padding: 2.75rem 1rem;
    text-align: center;
    color: var(--c-text-muted);
    font-size: 14px;
}

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

.btn {
    --bs-btn-border-radius: var(--r-md);
    border-radius: var(--r-md);
    font-weight: 600;
    font-size: 14px;
    padding: 8px 16px;
    border-width: 1px;
    transition: transform 0.14s ease, box-shadow 0.14s ease, background-color 0.14s ease;
}

.btn:active {
    transform: translateY(1px);
}

.btn-sm {
    padding: 5px 11px;
    font-size: 12.5px;
    border-radius: var(--r-sm);
}

.btn-primary {
    background: linear-gradient(165deg, #9cc2a9 0%, var(--c-sage) 55%, var(--c-sage-strong) 100%);
    border-color: rgba(108, 155, 126, 0.6);
    color: #22392c;
    box-shadow: var(--sh-lift), var(--sh-highlight);
}

.btn-primary:hover {
    background: linear-gradient(165deg, #a6cbb2 0%, #8dba9c 55%, var(--c-sage-strong) 100%);
    border-color: rgba(108, 155, 126, 0.75);
    color: #1d3325;
    box-shadow: var(--sh-raised), var(--sh-highlight), 0 0 0 4px rgba(134, 178, 150, 0.16);
    transform: translateY(-1px);
}

.btn-primary:active,
.btn-primary:focus:active {
    background: var(--c-sage-strong);
    box-shadow: var(--sh-inner);
    color: #1d3325;
}

.btn-primary:disabled,
.btn-primary.disabled {
    background: var(--c-sunken);
    border-color: var(--c-border);
    color: var(--c-text-muted);
    box-shadow: none;
    opacity: 1;
}

.btn-outline-secondary {
    background: var(--c-surface);
    border-color: var(--c-border-strong);
    color: var(--c-text-soft);
    box-shadow: var(--sh-lift), var(--sh-highlight);
}

.btn-outline-secondary:hover {
    background: var(--c-surface-2);
    border-color: var(--c-taupe);
    color: var(--c-text);
    box-shadow: var(--sh-raised), var(--sh-highlight);
    transform: translateY(-1px);
}

.btn-outline-secondary:active {
    background: var(--c-sunken);
    box-shadow: var(--sh-inner);
    color: var(--c-text);
}

.btn-outline-success {
    background: var(--c-surface);
    border-color: rgba(108, 155, 126, 0.55);
    color: var(--c-sage-deep);
    box-shadow: var(--sh-lift), var(--sh-highlight);
}

.btn-outline-success:hover {
    background: var(--c-sage-soft);
    border-color: var(--c-sage-strong);
    color: var(--c-sage-deep);
    box-shadow: var(--sh-raised), var(--sh-highlight);
    transform: translateY(-1px);
}

.btn-outline-danger {
    background: var(--c-surface);
    border-color: rgba(198, 141, 135, 0.55);
    color: var(--c-rose-strong);
    box-shadow: var(--sh-lift), var(--sh-highlight);
}

.btn-outline-danger:hover {
    background: var(--c-rose-soft);
    border-color: var(--c-rose);
    color: var(--c-rose-strong);
    box-shadow: var(--sh-raised), var(--sh-highlight);
    transform: translateY(-1px);
}

.btn-danger {
    background: linear-gradient(165deg, #d2a09a 0%, var(--c-rose) 55%, var(--c-rose-strong) 100%);
    border-color: rgba(177, 116, 110, 0.6);
    color: #fff;
    box-shadow: var(--sh-lift), var(--sh-highlight);
}

.btn-danger:hover {
    background: linear-gradient(165deg, #d8a9a3 0%, #bd7f79 55%, var(--c-rose-strong) 100%);
    border-color: var(--c-rose-strong);
    color: #fff;
    box-shadow: var(--sh-raised), var(--sh-highlight);
    transform: translateY(-1px);
}

.btn-danger:disabled {
    background: var(--c-sunken);
    border-color: var(--c-border);
    color: var(--c-text-muted);
    box-shadow: none;
    opacity: 1;
}

.btn-link {
    color: var(--c-text-muted);
    font-weight: 500;
    text-decoration: none;
    box-shadow: none;
}

.btn-link:hover {
    color: var(--c-text);
    text-decoration: underline;
}

.btn:focus-visible {
    outline: none;
    box-shadow: var(--sh-focus);
}

/* ==========================================================================
   Формы
   ========================================================================== */

.form-label {
    font-size: 13px;
    font-weight: 600;
    color: var(--c-text-soft);
    margin-bottom: 5px;
}

.form-control,
.form-select {
    background-color: var(--c-surface-2);
    border: 1px solid var(--c-border-strong);
    border-radius: var(--r-md);
    color: var(--c-text);
    font-size: 14px;
    padding: 9px 12px;
    box-shadow: var(--sh-inner);
    transition: border-color 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease;
}

.form-control::placeholder {
    color: var(--c-text-muted);
}

.form-control:focus,
.form-select:focus {
    background-color: var(--c-surface);
    border-color: var(--c-blue);
    box-shadow: var(--sh-inner), var(--sh-focus);
    color: var(--c-text);
}

.form-control:disabled,
.form-select:disabled {
    background-color: var(--c-sunken);
    color: var(--c-text-muted);
    box-shadow: none;
}

.form-control.is-invalid,
.form-select.is-invalid {
    border-color: var(--c-rose);
    background-image: none;
    box-shadow: var(--sh-inner), 0 0 0 3px rgba(198, 141, 135, 0.22);
}

.form-select {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%236d635b' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
    background-size: 14px 11px;
}

.form-control-sm {
    padding: 5px 8px;
    font-size: 13px;
    border-radius: var(--r-sm);
}

.form-text {
    font-size: 12px;
    color: var(--c-text-muted);
}

.required-mark {
    color: var(--c-rose-strong);
}

.input-group-text {
    background: var(--c-sunken);
    border-color: var(--c-border-strong);
    color: var(--c-text-soft);
    font-size: 13px;
    border-radius: var(--r-md);
}

.form-narrow {
    max-width: 860px;
}

/* Переключатели и чекбоксы */
.form-check-input {
    border-color: var(--c-border-strong);
    background-color: var(--c-surface-2);
    box-shadow: var(--sh-inner);
}

.form-check-input:checked {
    background-color: var(--c-sage-strong);
    border-color: var(--c-sage-strong);
    box-shadow: var(--sh-highlight);
}

.form-check-input:focus {
    border-color: var(--c-blue);
    box-shadow: var(--sh-focus);
}

.form-check-label {
    font-size: 14px;
    color: var(--c-text-soft);
}

/* ==========================================================================
   Таблицы
   ========================================================================== */

.card > .table-responsive:last-child .table,
.card > .table-responsive:last-child {
    border-radius: 0 0 var(--r-lg) var(--r-lg);
}

.table {
    --bs-table-bg: transparent;
    color: var(--c-text);
    margin-bottom: 0;
    font-size: 14px;
}

.table > thead {
    background: var(--c-taupe-soft);
}

.table > thead th {
    background: var(--c-taupe-soft);
    color: var(--c-text-soft);
    font-weight: 650;
    font-size: 12.5px;
    letter-spacing: 0.02em;
    border-bottom: 1px solid var(--c-border-strong);
    padding: 11px 14px;
    white-space: nowrap;
}

.table > tbody > tr > td {
    padding: 12px 14px;
    border-color: var(--c-border);
    vertical-align: middle;
}

.table-hover > tbody > tr:hover > * {
    background: var(--c-surface-2);
    box-shadow: var(--sh-highlight);
    --bs-table-accent-bg: transparent;
}

.table > tbody > tr:last-child > td {
    border-bottom: 0;
}

.table-light,
.table > :not(caption) > * > .table-light {
    background: var(--c-taupe-soft);
}

.table tfoot th {
    background: var(--c-surface-2);
    border-top: 1px solid var(--c-border-strong);
    font-weight: 650;
    padding: 12px 14px;
}

/* ==========================================================================
   Бейджи, алерты, списки
   ========================================================================== */

.badge {
    font-weight: 650;
    font-size: 11.5px;
    letter-spacing: 0.01em;
    padding: 5px 10px;
    border-radius: var(--r-pill);
    box-shadow: var(--sh-highlight);
}

.badge.bg-primary { background: var(--c-blue-soft) !important; color: #35617f !important; border: 1px solid rgba(126, 169, 203, 0.4); }
.badge.bg-success { background: var(--c-sage-soft) !important; color: var(--c-sage-deep) !important; border: 1px solid rgba(134, 178, 150, 0.45); }
.badge.bg-danger { background: var(--c-rose-soft) !important; color: var(--c-rose-strong) !important; border: 1px solid rgba(198, 141, 135, 0.45); }
.badge.bg-warning { background: var(--c-amber-soft) !important; color: #8a6c34 !important; border: 1px solid rgba(194, 160, 104, 0.45); }
.badge.bg-secondary { background: var(--c-taupe-soft) !important; color: var(--c-text-soft) !important; border: 1px solid var(--c-border-strong); }
.badge.bg-light { background: var(--c-surface-2) !important; color: var(--c-text-soft) !important; border: 1px solid var(--c-border) !important; }

.alert {
    border-radius: var(--r-lg);
    border-width: 1px;
    font-size: 14px;
    padding: 13px 16px;
    box-shadow: var(--sh-lift), var(--sh-highlight);
}

.alert-success { background: var(--c-sage-soft); border-color: rgba(134, 178, 150, 0.45); color: var(--c-sage-deep); }
.alert-danger { background: var(--c-rose-soft); border-color: rgba(198, 141, 135, 0.45); color: var(--c-rose-strong); }
.alert-warning { background: var(--c-amber-soft); border-color: rgba(194, 160, 104, 0.45); color: #8a6c34; }
.alert-info { background: var(--c-blue-soft); border-color: rgba(126, 169, 203, 0.45); color: #35617f; }
.alert-secondary,
.alert-light { background: var(--c-surface-2); border-color: var(--c-border); color: var(--c-text-soft); }

.list-group-item {
    background: transparent;
    border-color: var(--c-border);
    color: var(--c-text);
    padding: 12px 16px;
    font-size: 14px;
}

.list-group-flush > .list-group-item:last-child {
    border-bottom: 0;
}

.notification-item.unread {
    background: linear-gradient(90deg, var(--c-blue-soft) 0%, rgba(221, 233, 243, 0.25) 100%);
    border-left: 3px solid var(--c-blue);
}

/* ==========================================================================
   Прогресс
   ========================================================================== */

.progress {
    background: var(--c-sunken);
    border-radius: var(--r-pill);
    box-shadow: var(--sh-inner);
    overflow: hidden;
}

.progress-slim {
    height: 9px;
}

.progress-bar {
    border-radius: var(--r-pill);
    box-shadow: var(--sh-highlight);
}

.progress-bar.bg-success { background: linear-gradient(180deg, #9cc2a9, var(--c-sage-strong)) !important; }
.progress-bar.bg-primary { background: linear-gradient(180deg, #9dbfd8, var(--c-blue-strong)) !important; }
.progress-bar.bg-warning { background: linear-gradient(180deg, #d9bd8b, var(--c-amber)) !important; }
.progress-bar.bg-secondary { background: linear-gradient(180deg, #c0b5aa, var(--c-taupe)) !important; }

/* ==========================================================================
   Выпадающие меню, вкладки, пагинация
   ========================================================================== */

.dropdown-menu {
    background: var(--c-surface);
    border: 1px solid var(--c-border);
    border-radius: var(--r-lg);
    box-shadow: var(--sh-float);
    padding: 6px;
    font-size: 14px;
}

.dropdown-item {
    border-radius: var(--r-md);
    padding: 8px 10px;
    color: var(--c-text-soft);
}

.dropdown-item:hover,
.dropdown-item:focus {
    background: var(--c-surface-2);
    color: var(--c-text);
}

.dropdown-header {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    color: var(--c-text-muted);
}

.dropdown-divider {
    border-color: var(--c-border);
}

.nav-pills .nav-link {
    color: var(--c-text-soft);
    border-radius: var(--r-md);
    font-size: 14px;
    font-weight: 600;
    padding: 7px 14px;
    border: 1px solid transparent;
}

.nav-pills .nav-link:hover {
    background: var(--c-surface-2);
    color: var(--c-text);
}

.nav-pills .nav-link.active {
    background: linear-gradient(160deg, #ffffff 0%, var(--c-sage-soft) 100%);
    color: var(--c-sage-deep);
    border-color: rgba(134, 178, 150, 0.4);
    box-shadow: var(--sh-lift), var(--sh-highlight);
}

.pagination {
    --bs-pagination-border-radius: var(--r-md);
}

.page-link {
    background: var(--c-surface);
    border-color: var(--c-border);
    color: var(--c-text-soft);
    box-shadow: var(--sh-lift);
    font-size: 13px;
    padding: 7px 13px;
}

.page-link:hover {
    background: var(--c-surface-2);
    border-color: var(--c-border-strong);
    color: var(--c-text);
}

.page-item.disabled .page-link {
    background: var(--c-surface-2);
    color: var(--c-text-muted);
    border-color: var(--c-border);
    box-shadow: none;
}

/* ==========================================================================
   Заголовок страницы
   ========================================================================== */

.page-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
    flex-wrap: wrap;
    margin-bottom: 18px;
}

.page-head h1 {
    font-size: 24px;
    margin-bottom: 3px;
}

.page-head .page-sub {
    font-size: 13px;
    color: var(--c-text-muted);
}

.page-back {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    color: var(--c-text-muted);
    text-decoration: none;
    margin-bottom: 12px;
}

.page-back:hover {
    color: var(--c-text);
}

/* ==========================================================================
   Мобильная версия
   ========================================================================== */

@media (max-width: 991.98px) {
    body {
        font-size: 14.5px;
    }

    .app-content {
        padding: 16px 14px 40px;
    }

    .page-head h1 {
        font-size: 20px;
    }

    .card-body {
        padding: 14px;
    }

    .stat-card .display-6 {
        font-size: 24px;
    }

    /* Кнопки-действия в шапке страницы растягиваются на всю ширину */
    .page-head > .d-flex {
        width: 100%;
    }

    .page-head .btn {
        flex: 1 1 auto;
        justify-content: center;
    }

    /* Фильтры: каждое поле с новой строки, кнопки в ряд */
    .filter-form .btn {
        width: 100%;
    }

    /* Таблицы прокручиваются, но остаются читаемыми */
    .table-responsive {
        -webkit-overflow-scrolling: touch;
    }

    .table > thead th,
    .table > tbody > tr > td {
        padding: 10px 12px;
        white-space: nowrap;
    }

    .table td .text-muted.small {
        white-space: normal;
    }

    /* Действия в строках таблицы не должны ломать вёрстку */
    .table .btn-sm {
        padding: 4px 9px;
    }

    .dropdown-menu {
        max-width: calc(100vw - 24px);
    }

    .modal-dialog {
        margin: 12px;
    }
}

@media (max-width: 575.98px) {
    .app-topbar {
        padding: 0 12px;
    }

    .user-chip-text {
        display: none;
    }

    .page-head {
        margin-bottom: 14px;
    }

    /* Формы-строки внутри карточек в один столбец */
    .card-body .row > [class^="col-md"],
    .card-body .row > [class*=" col-md"] {
        margin-bottom: 0;
    }
}

/* Экранная утилита: горизонтальная прокрутка таблицы с подсказкой */
.table-responsive {
    scrollbar-width: thin;
}

.table-responsive::-webkit-scrollbar {
    height: 8px;
}

.table-responsive::-webkit-scrollbar-thumb {
    background: var(--c-border-strong);
    border-radius: var(--r-pill);
}

/* ==========================================================================
   Страницы входа / восстановления пароля
   ========================================================================== */

.auth-shell {
    min-height: 100vh;
    display: grid;
    place-items: center;
    padding: 24px 16px;
}

.auth-card {
    width: 100%;
    max-width: 400px;
}

.auth-brand {
    text-align: center;
    margin-bottom: 20px;
}

.auth-brand .brand-mark {
    width: 54px;
    height: 54px;
    flex: none;
    margin: 0 auto 12px;
    font-size: 26px;
    border-radius: var(--r-xl);
}

/* ==========================================================================
   Номенклатура заказа
   ========================================================================== */

.items-table input[type="number"] {
    max-width: 92px;
    margin-left: auto;
}

.items-table .cost-cell {
    font-variant-numeric: tabular-nums;
    font-weight: 600;
}

.items-table .discrepancy-cell {
    font-variant-numeric: tabular-nums;
}

@media (max-width: 991.98px) {
    .items-table {
        min-width: 640px;
    }
}