/* ==========================================================
   A&I Luxury Hair — stable premium UI system
   One file, loaded last. Mobile-first fixes included.
   ========================================================== */

:root {
    --ai-bg: #071F18;
    --ai-bg-deep: #03110D;
    --ai-card: rgba(14, 59, 46, .82);
    --ai-card-soft: rgba(246, 240, 230, .055);
    --ai-gold: #D6B46A;
    --ai-gold-soft: #F2DA9A;
    --ai-text: #F6F0E6;
    --ai-muted: #B8B2A4;
    --ai-line: rgba(214, 180, 106, .24);
    --ai-line-strong: rgba(214, 180, 106, .38);
    --ai-danger: #E85766;
    --ai-ok: #7CCB9B;
    --ai-radius-lg: 32px;
    --ai-radius-md: 24px;
    --ai-radius-sm: 16px;
    --ai-shadow: 0 24px 70px rgba(0, 0, 0, .28);
    --ai-wrap: min(1180px, calc(100vw - 28px));
}

*,
*::before,
*::after {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    overflow-x: hidden;
}

img,
video,
canvas,
svg {
    max-width: 100%;
}

a,
button,
input,
select,
textarea {
    font: inherit;
}

.site-page,
.admin-page {
    background:
        radial-gradient(circle at 18% 0%, rgba(214,180,106,.16), transparent 34%),
        radial-gradient(circle at 88% 18%, rgba(14,59,46,.62), transparent 34%),
        linear-gradient(135deg, var(--ai-bg), var(--ai-bg-deep));
    color: var(--ai-text);
}

/* Layout */
.site-page main,
.admin-page main,
.site-page .container,
.admin-page .container,
.site-page .admin-container,
.admin-page .admin-container {
    width: var(--ai-wrap);
    margin-left: auto;
    margin-right: auto;
}

/* Cards */
.card,
.panel,
.admin-card,
.service-card,
.price-card,
.work-card,
.about-card,
.gallery-item,
.ai-hero-clean-card,
.ai-hero-clean-side,
section.card {
    max-width: 100%;
    min-width: 0;
    border-radius: var(--ai-radius-lg);
    border: 1px solid var(--ai-line);
    background:
        radial-gradient(circle at top left, rgba(214,180,106,.12), transparent 34%),
        linear-gradient(145deg, rgba(14,59,46,.86), rgba(3,17,13,.82));
    box-shadow: var(--ai-shadow);
    overflow: hidden;
}

.card,
.panel,
.admin-card,
section.card {
    padding: clamp(20px, 3vw, 30px);
}

/* Typography */
h1,
h2,
h3 {
    color: var(--ai-gold);
    line-height: 1.08;
    text-wrap: balance;
}

p {
    color: var(--ai-muted);
    line-height: 1.65;
}

/* Buttons */
button,
.btn,
a.btn,
[class*="btn"] {
    min-height: 42px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 11px 16px;
    border: 1px solid transparent;
    background: linear-gradient(135deg, var(--ai-gold), var(--ai-gold-soft));
    color: var(--ai-bg-deep);
    text-decoration: none;
    font-weight: 950;
    line-height: 1;
    white-space: nowrap;
    cursor: pointer;
    transition:
        transform .18s ease,
        box-shadow .18s ease,
        background .18s ease,
        border-color .18s ease;
}

button:hover,
.btn:hover,
a.btn:hover,
[class*="btn"]:hover {
    transform: translateY(-1px);
}

button.secondary,
.btn.secondary,
a.secondary,
.secondary {
    background: rgba(246,240,230,.10);
    color: var(--ai-text);
    border-color: var(--ai-line);
}

button.danger,
.btn.danger,
.danger {
    background: var(--ai-danger);
    color: white;
}

button.success,
.btn.success,
.success {
    background: var(--ai-ok);
    color: var(--ai-bg-deep);
}

/* Forms */
label {
    color: var(--ai-muted);
}

input,
select,
textarea {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    border: 1px solid rgba(214,180,106,.26);
    border-radius: var(--ai-radius-sm);
    background: rgba(3,17,13,.70);
    color: var(--ai-text);
    padding: 13px 14px;
    outline: none;
}

input:focus,
select:focus,
textarea:focus {
    border-color: rgba(214,180,106,.52);
    box-shadow: 0 0 0 4px rgba(214,180,106,.08);
}

input[type="checkbox"] {
    width: 18px;
    height: 18px;
    min-width: 18px;
    accent-color: var(--ai-gold);
}

/* Admin header */
.dashboard-page header,
.dashboard-page .admin-header,
.dashboard-page .topbar,
.dashboard-page .navbar {
    width: 100%;
    max-width: none;
}

.dashboard-page header nav,
.dashboard-page .admin-header nav,
.dashboard-page .topbar nav,
.dashboard-page .navbar nav,
.dashboard-page .top-actions,
.dashboard-page .admin-actions,
.dashboard-page .header-actions,
.dashboard-page .nav-actions,
.dashboard-page .admin-nav,
.dashboard-page .actions-top {
    width: 100%;
    max-width: none;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.dashboard-page a[href="/admin/gallery-manager"] {
    background: linear-gradient(135deg, var(--ai-gold), var(--ai-gold-soft));
    color: var(--ai-bg-deep);
}

/* Public nav */
.site-page header nav,
.site-page .site-header nav,
.site-page .nav-links,
.site-page .menu {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

/* Hero */
.home-page .ai-hero-clean,
.home-page .hero-premium-main {
    width: var(--ai-wrap);
    margin-left: auto;
    margin-right: auto;
}

/* Price / services */
.home-page #price,
.home-page #prices,
.home-page #pricing,
.home-page section[id*="price"],
.home-page section[id*="Price"],
.home-page #services,
.home-page section[id*="service"] {
    width: var(--ai-wrap);
    margin-left: auto;
    margin-right: auto;
}

.home-page .price-card,
.home-page [class*="price-card"],
.home-page .service-card {
    padding: clamp(16px, 2.4vw, 22px);
}

.home-page table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0 10px;
}

.home-page th,
.home-page td {
    padding: 12px 14px;
    border: 0;
}

/* Contacts */
.home-page #contacts {
    width: var(--ai-wrap);
    margin-left: auto;
    margin-right: auto;
}

/* Booking */
.booking-page .booking-card,
.booking-page .booking-section,
.booking-page form,
.booking-page .card {
    max-width: 100%;
}

.booking-page .slots-grid,
.booking-page .calendar-grid,
.booking-page [class*="slot"],
.booking-page [class*="calendar"] {
    max-width: 100%;
}

/* Promo page — card-like table rows */
.promo-page main {
    width: var(--ai-wrap);
    margin-left: auto;
    margin-right: auto;
    padding: 34px 0 80px;
}

.promo-page .top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 28px;
}

.promo-page .top > div:last-child {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.promo-page .brand {
    color: var(--ai-gold);
    font-size: 28px;
    font-weight: 950;
}

.promo-page #promo-form {
    margin-top: 24px;
}

.promo-page #promo-form .row {
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    gap: 16px;
    align-items: end;
}

.promo-page #promo-form .col-2 { grid-column: span 2; min-width: 0; }
.promo-page #promo-form .col-3 { grid-column: span 3; min-width: 0; }
.promo-page #promo-form .col-4 { grid-column: span 4; min-width: 0; }
.promo-page #promo-form .col-6 { grid-column: span 6; min-width: 0; }
.promo-page #promo-form .col-12 { grid-column: 1 / -1; min-width: 0; }

.promo-page table {
    width: 100%;
    display: block;
    border-collapse: separate;
    border-spacing: 0;
    margin-top: 18px;
}

.promo-page thead {
    display: none;
}

.promo-page tbody {
    display: grid;
    gap: 14px;
    width: 100%;
}

.promo-page tbody tr {
    width: 100%;
    display: grid;
    grid-template-columns:
        minmax(120px, .9fr)
        minmax(80px, .45fr)
        minmax(190px, 1.25fr)
        minmax(110px, .7fr)
        minmax(80px, .5fr)
        minmax(280px, 1fr);
    gap: 14px;
    align-items: center;
    border-radius: 22px;
    background:
        radial-gradient(circle at top left, rgba(214,180,106,.08), transparent 34%),
        rgba(246,240,230,.055);
    border: 1px solid rgba(214,180,106,.15);
    padding: 16px;
}

.promo-page th,
.promo-page td {
    border: 0;
    padding: 0;
    vertical-align: middle;
    overflow-wrap: anywhere;
    min-width: 0;
}

.promo-page td::before {
    display: block;
    margin-bottom: 6px;
    color: var(--ai-gold);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.promo-page td:nth-child(1)::before { content: "Код"; }
.promo-page td:nth-child(2)::before { content: "Скидка"; }
.promo-page td:nth-child(3)::before { content: "Период"; }
.promo-page td:nth-child(4)::before { content: "Использования"; }
.promo-page td:nth-child(5)::before { content: "Активен"; }
.promo-page td:nth-child(6)::before { content: "Действия"; }

.promo-page td {
    color: var(--ai-text);
    font-size: 15px;
    font-weight: 800;
    line-height: 1.35;
}

.promo-page td:nth-child(3) {
    color: rgba(246,240,230,.80);
    font-weight: 700;
}

.promo-page td:last-child {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
}

.promo-page td:last-child button,
.promo-page td:last-child .btn,
.promo-page td:last-child a.btn {
    width: 100%;
    min-width: 0;
    min-height: 42px;
    padding: 10px 12px;
    font-size: 13px;
}

.promo-page td:last-child button:last-child {
    grid-column: 1 / -1;
}

/* Tables general */
.admin-page table {
    max-width: 100%;
}

.admin-page th,
.admin-page td {
    min-width: 0;
}

/* Gallery manager */
.gallery-manager-page .grid,
.gallery-manager-page .gallery-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(270px, 1fr));
    gap: 16px;
}

.gallery-manager-page .item,
.gallery-manager-page .gallery-manager-item {
    min-width: 0;
}

/* Animations */
.ai-reveal {
    opacity: 0;
    transform: translateY(22px);
    filter: blur(6px);
    transition:
        opacity .65s ease,
        transform .65s ease,
        filter .65s ease;
}

.ai-reveal.ai-visible {
    opacity: 1;
    transform: translateY(0);
    filter: blur(0);
}

/* Mobile */
@media (max-width: 1120px) {
    .promo-page tbody tr {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .promo-page td:last-child {
        grid-column: 1 / -1;
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .promo-page td:last-child button:last-child {
        grid-column: auto;
    }
}

@media (max-width: 900px) {
    .site-page main,
    .admin-page main,
    .site-page .container,
    .admin-page .container,
    .site-page .admin-container,
    .admin-page .admin-container {
        width: min(100vw - 20px, 1180px);
    }

    .promo-page #promo-form .col-2,
    .promo-page #promo-form .col-3,
    .promo-page #promo-form .col-4,
    .promo-page #promo-form .col-6,
    .promo-page #promo-form .col-12 {
        grid-column: 1 / -1;
    }

    .home-page .hero-premium-shell,
    .home-page .ai-hero-clean-card {
        grid-template-columns: 1fr !important;
    }
}

@media (max-width: 720px) {
    :root {
        --ai-wrap: min(100vw - 18px, 1180px);
    }

    .card,
    .panel,
    .admin-card,
    section.card {
        border-radius: 24px;
        padding: 18px;
    }

    button,
    .btn,
    a.btn,
    [class*="btn"] {
        width: 100%;
        white-space: normal;
        text-align: center;
    }

    .promo-page .top {
        align-items: flex-start;
        flex-direction: column;
    }

    .promo-page .top > div:last-child {
        justify-content: flex-start;
        width: 100%;
    }

    .promo-page tbody tr {
        grid-template-columns: 1fr;
    }

    .promo-page td:last-child {
        grid-template-columns: 1fr;
    }

    .dashboard-page header nav,
    .dashboard-page .admin-header nav,
    .dashboard-page .topbar nav,
    .dashboard-page .navbar nav,
    .dashboard-page .top-actions,
    .dashboard-page .admin-actions,
    .dashboard-page .header-actions,
    .dashboard-page .nav-actions,
    .dashboard-page .admin-nav,
    .dashboard-page .actions-top,
    .site-page header nav,
    .site-page .site-header nav,
    .site-page .nav-links,
    .site-page .menu {
        justify-content: flex-start;
    }
}

@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }

    *,
    *::before,
    *::after {
        transition-duration: .01ms !important;
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
    }

    .ai-reveal {
        opacity: 1;
        transform: none;
        filter: none;
    }
}


/* === PROMO PAGE FINAL READABLE FIX === */

/* Страница промокодов: форма ровная, список читаемый */
.promo-page main {
    width: min(1180px, calc(100vw - 28px)) !important;
    margin: 0 auto !important;
    padding: 34px 0 80px !important;
}

.promo-page .top {
    width: 100% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 18px !important;
    margin-bottom: 28px !important;
}

.promo-page .top > div:last-child {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 10px !important;
    flex-wrap: wrap !important;
}

.promo-page .card {
    width: 100% !important;
    max-width: 100% !important;
    overflow: hidden !important;
    border-radius: 30px !important;
    padding: clamp(20px, 3vw, 30px) !important;
}

/* Форма */
.promo-page #promo-form .row {
    display: grid !important;
    grid-template-columns: repeat(12, minmax(0, 1fr)) !important;
    gap: 16px !important;
    align-items: end !important;
}

.promo-page #promo-form .col-2 { grid-column: span 2 !important; min-width: 0 !important; }
.promo-page #promo-form .col-3 { grid-column: span 3 !important; min-width: 0 !important; }
.promo-page #promo-form .col-4 { grid-column: span 4 !important; min-width: 0 !important; }
.promo-page #promo-form .col-6 { grid-column: span 6 !important; min-width: 0 !important; }
.promo-page #promo-form .col-12 { grid-column: 1 / -1 !important; min-width: 0 !important; }

.promo-page label {
    display: block !important;
    margin: 0 0 7px !important;
}

.promo-page input,
.promo-page select,
.promo-page textarea {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
}

/* Список промокодов на ПК — нормальная таблица, не grid */
.promo-page table {
    width: 100% !important;
    max-width: 100% !important;
    display: table !important;
    table-layout: fixed !important;
    border-collapse: separate !important;
    border-spacing: 0 12px !important;
    margin-top: 18px !important;
}

.promo-page thead {
    display: table-header-group !important;
}

.promo-page tbody {
    display: table-row-group !important;
}

.promo-page tr {
    display: table-row !important;
}

.promo-page th,
.promo-page td {
    display: table-cell !important;
    border: 0 !important;
    padding: 14px 12px !important;
    vertical-align: middle !important;
    overflow-wrap: anywhere !important;
    line-height: 1.35 !important;
}

.promo-page tbody tr {
    background: rgba(246,240,230,.055) !important;
}

.promo-page th {
    color: var(--ai-gold, #D6B46A) !important;
    font-size: 12px !important;
    letter-spacing: .08em !important;
    text-transform: uppercase !important;
    opacity: .92 !important;
}

.promo-page th:nth-child(1),
.promo-page td:nth-child(1) { width: 16% !important; }

.promo-page th:nth-child(2),
.promo-page td:nth-child(2) { width: 10% !important; }

.promo-page th:nth-child(3),
.promo-page td:nth-child(3) { width: 26% !important; }

.promo-page th:nth-child(4),
.promo-page td:nth-child(4) { width: 13% !important; }

.promo-page th:nth-child(5),
.promo-page td:nth-child(5) { width: 9% !important; }

.promo-page th:nth-child(6),
.promo-page td:nth-child(6) { width: 26% !important; }

.promo-page th:first-child,
.promo-page td:first-child {
    border-radius: 18px 0 0 18px !important;
}

.promo-page th:last-child,
.promo-page td:last-child {
    border-radius: 0 18px 18px 0 !important;
}

/* Убираем старые псевдо-лейблы на ПК */
.promo-page td::before {
    content: none !important;
    display: none !important;
}

/* Действия: вертикально, читаемо, внутри ячейки */
.promo-page td:last-child {
    white-space: normal !important;
}

.promo-page td:last-child button,
.promo-page td:last-child .btn,
.promo-page td:last-child a.btn {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 40px !important;
    margin: 0 0 8px 0 !important;
    padding: 10px 12px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 13px !important;
    line-height: 1 !important;
    white-space: nowrap !important;
}

.promo-page td:last-child button:last-child,
.promo-page td:last-child .btn:last-child,
.promo-page td:last-child a.btn:last-child {
    margin-bottom: 0 !important;
}

/* На планшете */
@media (max-width: 1060px) {
    .promo-page #promo-form .col-2,
    .promo-page #promo-form .col-3,
    .promo-page #promo-form .col-4,
    .promo-page #promo-form .col-6 {
        grid-column: span 6 !important;
    }

    .promo-page table {
        table-layout: auto !important;
    }

    .promo-page th:nth-child(n),
    .promo-page td:nth-child(n) {
        width: auto !important;
    }
}

/* На телефоне промокоды становятся карточками */
@media (max-width: 760px) {
    .promo-page main {
        width: min(100vw - 18px, 1180px) !important;
        padding-top: 22px !important;
    }

    .promo-page .top {
        flex-direction: column !important;
        align-items: flex-start !important;
    }

    .promo-page .top > div:last-child {
        width: 100% !important;
        justify-content: flex-start !important;
    }

    .promo-page #promo-form .col-2,
    .promo-page #promo-form .col-3,
    .promo-page #promo-form .col-4,
    .promo-page #promo-form .col-6,
    .promo-page #promo-form .col-12 {
        grid-column: 1 / -1 !important;
    }

    .promo-page table,
    .promo-page thead,
    .promo-page tbody,
    .promo-page tr,
    .promo-page th,
    .promo-page td {
        display: block !important;
        width: 100% !important;
    }

    .promo-page thead {
        display: none !important;
    }

    .promo-page tbody {
        display: grid !important;
        gap: 14px !important;
    }

    .promo-page tbody tr {
        border-radius: 22px !important;
        padding: 16px !important;
        background:
            radial-gradient(circle at top left, rgba(214,180,106,.08), transparent 34%),
            rgba(246,240,230,.055) !important;
        border: 1px solid rgba(214,180,106,.15) !important;
    }

    .promo-page td {
        padding: 8px 0 !important;
    }

    .promo-page td:first-child,
    .promo-page td:last-child {
        border-radius: 0 !important;
    }

    .promo-page td::before {
        display: block !important;
        margin-bottom: 5px !important;
        color: var(--ai-gold, #D6B46A) !important;
        font-size: 11px !important;
        font-weight: 950 !important;
        letter-spacing: .08em !important;
        text-transform: uppercase !important;
    }

    .promo-page td:nth-child(1)::before { content: "Код" !important; }
    .promo-page td:nth-child(2)::before { content: "Скидка" !important; }
    .promo-page td:nth-child(3)::before { content: "Период" !important; }
    .promo-page td:nth-child(4)::before { content: "Использования" !important; }
    .promo-page td:nth-child(5)::before { content: "Активен" !important; }
    .promo-page td:nth-child(6)::before { content: "Действия" !important; }

    .promo-page td:last-child button,
    .promo-page td:last-child .btn,
    .promo-page td:last-child a.btn {
        width: 100% !important;
        white-space: normal !important;
    }
}

/* === /PROMO PAGE FINAL READABLE FIX === */


/* === ABOUT MOBILE FINAL FIX === */

/* О нас: на телефоне только одна колонка, без вылезаний и с нормальной картинкой */
@media (max-width: 760px) {
    .home-page #about,
    .home-page #company,
    .home-page section[id*="about"],
    .home-page section[id*="company"],
    .home-page .about-section,
    .home-page .company-section,
    .home-page .ai-about,
    .home-page .about-card {
        width: min(100vw - 18px, 1180px) !important;
        margin-left: auto !important;
        margin-right: auto !important;
        overflow: hidden !important;
    }

    .home-page #about *,
    .home-page #company *,
    .home-page section[id*="about"] *,
    .home-page section[id*="company"] *,
    .home-page .about-section *,
    .home-page .company-section *,
    .home-page .ai-about *,
    .home-page .about-card * {
        max-width: 100% !important;
        min-width: 0 !important;
    }

    .home-page #about,
    .home-page #company,
    .home-page section[id*="about"],
    .home-page section[id*="company"],
    .home-page .about-section,
    .home-page .company-section,
    .home-page .ai-about {
        display: block !important;
    }

    .home-page #about .grid,
    .home-page #company .grid,
    .home-page .about-grid,
    .home-page .company-grid,
    .home-page .ai-about-grid,
    .home-page .about-content,
    .home-page .company-content {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 18px !important;
    }

    .home-page #about img,
    .home-page #company img,
    .home-page section[id*="about"] img,
    .home-page section[id*="company"] img,
    .home-page .about-section img,
    .home-page .company-section img,
    .home-page .ai-about img {
        width: 100% !important;
        height: auto !important;
        max-height: 360px !important;
        object-fit: cover !important;
        border-radius: 22px !important;
    }

    .home-page #about h1,
    .home-page #about h2,
    .home-page #company h1,
    .home-page #company h2,
    .home-page section[id*="about"] h1,
    .home-page section[id*="about"] h2,
    .home-page section[id*="company"] h1,
    .home-page section[id*="company"] h2 {
        font-size: clamp(30px, 10vw, 42px) !important;
        line-height: 1.08 !important;
        text-align: left !important;
    }

    .home-page #about p,
    .home-page #company p,
    .home-page section[id*="about"] p,
    .home-page section[id*="company"] p {
        font-size: 15.5px !important;
        line-height: 1.65 !important;
        text-align: left !important;
    }
}

/* === /ABOUT MOBILE FINAL FIX === */


/* === PROMO FORM GRID LOCK V6 === */

/*
   Строгая сетка промокодов:
   1 ряд: Код | Скидка | Начало действия | Окончание действия
   2 ряд: Лимит | Активен | Сохранить промокод | Очистить
*/

.promo-page #promo-form .row {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 18px 16px !important;
    align-items: start !important;
}

/* Отключаем старые col-span */
.promo-page #promo-form .row > .col-2,
.promo-page #promo-form .row > .col-3,
.promo-page #promo-form .row > .col-4,
.promo-page #promo-form .row > .col-6,
.promo-page #promo-form .row > .col-12 {
    grid-column: auto !important;
    min-width: 0 !important;
}

/* Верхний ряд */
.promo-page #promo-form .pfg-code {
    grid-column: 1 !important;
    grid-row: 1 !important;
}

.promo-page #promo-form .pfg-discount {
    grid-column: 2 !important;
    grid-row: 1 !important;
}

.promo-page #promo-form .pfg-start {
    grid-column: 3 !important;
    grid-row: 1 !important;
}

.promo-page #promo-form .pfg-end {
    grid-column: 4 !important;
    grid-row: 1 !important;
}

/* Нижний ряд */
.promo-page #promo-form .pfg-limit {
    grid-column: 1 !important;
    grid-row: 2 !important;
}

.promo-page #promo-form .pfg-active {
    grid-column: 2 !important;
    grid-row: 2 !important;
}

.promo-page #promo-form .pfg-actions {
    grid-column: 3 / 5 !important;
    grid-row: 2 !important;
}

/* Все основные ячейки одинаковой логики */
.promo-page #promo-form .pfg-code,
.promo-page #promo-form .pfg-discount,
.promo-page #promo-form .pfg-start,
.promo-page #promo-form .pfg-end,
.promo-page #promo-form .pfg-limit,
.promo-page #promo-form .pfg-active,
.promo-page #promo-form .pfg-actions {
    min-width: 0 !important;
}

/* Верхние 4 поля: label/input/hint в одинаковой структуре */
.promo-page #promo-form .pfg-code,
.promo-page #promo-form .pfg-discount,
.promo-page #promo-form .pfg-start,
.promo-page #promo-form .pfg-end {
    display: grid !important;
    grid-template-rows: 22px 46px 34px !important;
    align-content: start !important;
    min-height: 104px !important;
}

.promo-page #promo-form .pfg-code label,
.promo-page #promo-form .pfg-discount label,
.promo-page #promo-form .pfg-start label,
.promo-page #promo-form .pfg-end label {
    grid-row: 1 !important;
    height: 22px !important;
    margin: 0 !important;
    display: flex !important;
    align-items: flex-start !important;
    line-height: 1.2 !important;
}

.promo-page #promo-form .pfg-code input:not([type="checkbox"]),
.promo-page #promo-form .pfg-discount input:not([type="checkbox"]),
.promo-page #promo-form .pfg-start input:not([type="checkbox"]),
.promo-page #promo-form .pfg-end input:not([type="checkbox"]) {
    grid-row: 2 !important;
    width: 100% !important;
    height: 46px !important;
    min-height: 46px !important;
    margin: 0 !important;
}

/* Подсказки не двигают поля */
.promo-page #promo-form .pfg-code small,
.promo-page #promo-form .pfg-discount small,
.promo-page #promo-form .pfg-start small,
.promo-page #promo-form .pfg-end small,
.promo-page #promo-form .pfg-code .muted,
.promo-page #promo-form .pfg-discount .muted,
.promo-page #promo-form .pfg-start .muted,
.promo-page #promo-form .pfg-end .muted,
.promo-page #promo-form .pfg-code .hint,
.promo-page #promo-form .pfg-discount .hint,
.promo-page #promo-form .pfg-start .hint,
.promo-page #promo-form .pfg-end .hint {
    grid-row: 3 !important;
    margin: 7px 0 0 !important;
    min-height: 18px !important;
    font-size: 12px !important;
    line-height: 1.35 !important;
}

/* Нижние поля ровно под верхними */
.promo-page #promo-form .pfg-limit,
.promo-page #promo-form .pfg-active,
.promo-page #promo-form .pfg-actions {
    min-height: 74px !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-end !important;
}

/* Лимит */
.promo-page #promo-form .pfg-limit label {
    height: 22px !important;
    margin: 0 0 8px !important;
}

.promo-page #promo-form .pfg-limit input {
    height: 46px !important;
    min-height: 46px !important;
}

/* Активен выглядит как поле */
.promo-page #promo-form .pfg-active label {
    width: 100% !important;
    height: 46px !important;
    margin: 0 !important;
    padding: 0 14px !important;
    border-radius: 16px !important;
    border: 1px solid rgba(214,180,106,.22) !important;
    background: rgba(3,17,13,.34) !important;
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
}

/* Кнопки строго под Начало/Окончание */
.promo-page #promo-form .pfg-actions {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 16px !important;
    align-items: end !important;
}

.promo-page #promo-form .pfg-actions button,
.promo-page #promo-form .pfg-actions .btn {
    width: 100% !important;
    height: 46px !important;
    min-height: 46px !important;
    margin: 0 !important;
    padding: 12px 16px !important;
}

/* Планшет */
@media (max-width: 1060px) {
    .promo-page #promo-form .row {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    .promo-page #promo-form .pfg-code { grid-column: 1 !important; grid-row: 1 !important; }
    .promo-page #promo-form .pfg-discount { grid-column: 2 !important; grid-row: 1 !important; }
    .promo-page #promo-form .pfg-start { grid-column: 1 !important; grid-row: 2 !important; }
    .promo-page #promo-form .pfg-end { grid-column: 2 !important; grid-row: 2 !important; }
    .promo-page #promo-form .pfg-limit { grid-column: 1 !important; grid-row: 3 !important; }
    .promo-page #promo-form .pfg-active { grid-column: 2 !important; grid-row: 3 !important; }
    .promo-page #promo-form .pfg-actions { grid-column: 1 / -1 !important; grid-row: 4 !important; }
}

/* Телефон */
@media (max-width: 760px) {
    .promo-page #promo-form .row {
        grid-template-columns: 1fr !important;
        gap: 14px !important;
    }

    .promo-page #promo-form .pfg-code,
    .promo-page #promo-form .pfg-discount,
    .promo-page #promo-form .pfg-start,
    .promo-page #promo-form .pfg-end,
    .promo-page #promo-form .pfg-limit,
    .promo-page #promo-form .pfg-active,
    .promo-page #promo-form .pfg-actions {
        grid-column: 1 !important;
        grid-row: auto !important;
        min-height: auto !important;
    }

    .promo-page #promo-form .pfg-code,
    .promo-page #promo-form .pfg-discount,
    .promo-page #promo-form .pfg-start,
    .promo-page #promo-form .pfg-end {
        grid-template-rows: auto 46px auto !important;
    }

    .promo-page #promo-form .pfg-actions {
        grid-template-columns: 1fr !important;
    }
}

/* === /PROMO FORM GRID LOCK V6 === */


/* === PROMO BOTTOM ROW LOCK V7 === */

/*
   Нижняя строка формы промокодов:
   Лимит использований | Активен | Сохранить промокод | Очистить
   Без наложений и без переносов.
*/

/* Вторая строка занимает те же 4 колонки, что и верхняя */
.promo-page #promo-form .pfg-limit {
    grid-column: 1 !important;
    grid-row: 2 !important;
}

.promo-page #promo-form .pfg-active {
    grid-column: 2 !important;
    grid-row: 2 !important;
}

.promo-page #promo-form .pfg-save {
    grid-column: 3 !important;
    grid-row: 2 !important;
}

.promo-page #promo-form .pfg-clear {
    grid-column: 4 !important;
    grid-row: 2 !important;
}

/* Убираем прошлую широкую actions-ячейку */
.promo-page #promo-form .pfg-actions {
    display: contents !important;
}

/* Лимит */
.promo-page #promo-form .pfg-limit {
    min-height: 74px !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-end !important;
}

.promo-page #promo-form .pfg-limit label {
    height: 22px !important;
    margin: 0 0 8px !important;
}

.promo-page #promo-form .pfg-limit input {
    height: 46px !important;
    min-height: 46px !important;
}

/* Активен */
.promo-page #promo-form .pfg-active {
    min-height: 74px !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-end !important;
}

.promo-page #promo-form .pfg-active label {
    width: 100% !important;
    height: 46px !important;
    margin: 0 !important;
    padding: 0 14px !important;
    border-radius: 16px !important;
    border: 1px solid rgba(214,180,106,.22) !important;
    background: rgba(3,17,13,.34) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 10px !important;
    white-space: nowrap !important;
}

.promo-page #promo-form .pfg-active input[type="checkbox"] {
    width: 18px !important;
    height: 18px !important;
    min-width: 18px !important;
    margin: 0 !important;
}

/* Сохранить */
.promo-page #promo-form .pfg-save {
    min-height: 74px !important;
    display: flex !important;
    align-items: flex-end !important;
    justify-content: stretch !important;
}

.promo-page #promo-form .pfg-save button,
.promo-page #promo-form .pfg-save .btn {
    width: 100% !important;
    height: 46px !important;
    min-height: 46px !important;
    margin: 0 !important;
    padding: 12px 16px !important;
    white-space: nowrap !important;
}

/* Очистить */
.promo-page #promo-form .pfg-clear {
    min-height: 74px !important;
    display: flex !important;
    align-items: flex-end !important;
    justify-content: stretch !important;
}

.promo-page #promo-form .pfg-clear button,
.promo-page #promo-form .pfg-clear .btn {
    width: 100% !important;
    height: 46px !important;
    min-height: 46px !important;
    margin: 0 !important;
    padding: 12px 16px !important;
    white-space: nowrap !important;
}

/* Если после JS остались кнопки внутри pfg-active — запрещаем наложение */
.promo-page #promo-form .pfg-active button,
.promo-page #promo-form .pfg-active .btn {
    display: none !important;
}

/* Планшет */
@media (max-width: 1060px) {
    .promo-page #promo-form .pfg-limit {
        grid-column: 1 !important;
        grid-row: 3 !important;
    }

    .promo-page #promo-form .pfg-active {
        grid-column: 2 !important;
        grid-row: 3 !important;
    }

    .promo-page #promo-form .pfg-save {
        grid-column: 1 !important;
        grid-row: 4 !important;
    }

    .promo-page #promo-form .pfg-clear {
        grid-column: 2 !important;
        grid-row: 4 !important;
    }
}

/* Телефон */
@media (max-width: 760px) {
    .promo-page #promo-form .pfg-limit,
    .promo-page #promo-form .pfg-active,
    .promo-page #promo-form .pfg-save,
    .promo-page #promo-form .pfg-clear {
        grid-column: 1 !important;
        grid-row: auto !important;
        min-height: auto !important;
    }
}

/* === /PROMO BOTTOM ROW LOCK V7 === */



/* === ADMIN SERVICES PRICE CARD ROWS FINAL === */

/*
   Финальная эргономичная верстка для таблиц:
   - Услуги
   - Прайс-лист

   Больше не пытаемся делать классическую таблицу в узкой колонке.
   Каждая строка становится компактной карточкой:
   слева — название/описание,
   по центру — цена/время,
   справа — Активна / Редактировать / Скрыть.
*/

.dashboard-page table.ai-admin-services-table,
.dashboard-page table.ai-admin-prices-table {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    table-layout: auto !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
}

.dashboard-page table.ai-admin-services-table thead,
.dashboard-page table.ai-admin-prices-table thead {
    display: none !important;
}

.dashboard-page table.ai-admin-services-table tbody,
.dashboard-page table.ai-admin-prices-table tbody {
    display: grid !important;
    gap: 12px !important;
    width: 100% !important;
}

/* Общая строка-карточка */
.dashboard-page table.ai-admin-services-table tbody tr,
.dashboard-page table.ai-admin-prices-table tbody tr {
    width: 100% !important;
    display: grid !important;
    gap: 10px 12px !important;
    align-items: start !important;
    border-radius: 20px !important;
    border: 1px solid rgba(214,180,106,.14) !important;
    background:
        radial-gradient(circle at top left, rgba(214,180,106,.07), transparent 36%),
        rgba(246,240,230,.045) !important;
    padding: 14px !important;
    overflow: visible !important;
}

/* Услуги: Название | Цена/Время | Активна/кнопки */
.dashboard-page table.ai-admin-services-table tbody tr {
    grid-template-columns: minmax(0, 1fr) 96px 142px !important;
    grid-template-areas:
        "name price status"
        "name time actions"
        "name time actions" !important;
}

/* Прайс-лист: Позиция/Услуга | Цена/Время | Активна/кнопки */
.dashboard-page table.ai-admin-prices-table tbody tr {
    grid-template-columns: minmax(0, 1fr) 96px 142px !important;
    grid-template-areas:
        "position price status"
        "service time actions"
        "service time actions" !important;
}

/* Все ячейки внутри карточек */
.dashboard-page table.ai-admin-services-table td,
.dashboard-page table.ai-admin-services-table th,
.dashboard-page table.ai-admin-prices-table td,
.dashboard-page table.ai-admin-prices-table th {
    display: block !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    padding: 0 !important;
    border: 0 !important;
    line-height: 1.38 !important;
    vertical-align: top !important;
    word-break: normal !important;
    overflow-wrap: anywhere !important;
}

/* Старые клоны статуса больше не нужны */
.dashboard-page .ai-status-stacked {
    display: none !important;
}

/* -------------------- УСЛУГИ -------------------- */
.dashboard-page table.ai-admin-services-table td:nth-child(1) {
    grid-area: name !important;
}

.dashboard-page table.ai-admin-services-table td:nth-child(2) {
    grid-area: price !important;
}

.dashboard-page table.ai-admin-services-table td:nth-child(3) {
    grid-area: time !important;
}

.dashboard-page table.ai-admin-services-table td:nth-child(4) {
    grid-area: status !important;
    display: flex !important;
}

.dashboard-page table.ai-admin-services-table td:nth-child(5) {
    grid-area: actions !important;
}

/* -------------------- ПРАЙС -------------------- */
.dashboard-page table.ai-admin-prices-table td:nth-child(1) {
    grid-area: position !important;
}

.dashboard-page table.ai-admin-prices-table td:nth-child(2) {
    grid-area: service !important;
}

.dashboard-page table.ai-admin-prices-table td:nth-child(3) {
    grid-area: price !important;
}

.dashboard-page table.ai-admin-prices-table td:nth-child(4) {
    grid-area: time !important;
}

.dashboard-page table.ai-admin-prices-table td:nth-child(5) {
    grid-area: status !important;
    display: flex !important;
}

.dashboard-page table.ai-admin-prices-table td:nth-child(6) {
    grid-area: actions !important;
}

/* Мини-лейблы у цены/времени — чтобы было понятно без шапки таблицы */
.dashboard-page table.ai-admin-services-table td:nth-child(2)::before,
.dashboard-page table.ai-admin-prices-table td:nth-child(3)::before {
    content: "Цена";
}

.dashboard-page table.ai-admin-services-table td:nth-child(3)::before,
.dashboard-page table.ai-admin-prices-table td:nth-child(4)::before {
    content: "Время";
}

.dashboard-page table.ai-admin-services-table td:nth-child(2)::before,
.dashboard-page table.ai-admin-services-table td:nth-child(3)::before,
.dashboard-page table.ai-admin-prices-table td:nth-child(3)::before,
.dashboard-page table.ai-admin-prices-table td:nth-child(4)::before {
    display: block !important;
    margin-bottom: 4px !important;
    color: #D6B46A !important;
    font-size: 10px !important;
    font-weight: 950 !important;
    letter-spacing: .08em !important;
    text-transform: uppercase !important;
    line-height: 1.1 !important;
}

/* Цена и время: не ломаем по буквам */
.dashboard-page table.ai-admin-services-table td:nth-child(2),
.dashboard-page table.ai-admin-services-table td:nth-child(3),
.dashboard-page table.ai-admin-prices-table td:nth-child(3),
.dashboard-page table.ai-admin-prices-table td:nth-child(4) {
    color: #F6F0E6 !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
    white-space: normal !important;
    font-variant-numeric: tabular-nums !important;
}

/* Названия и описания */
.dashboard-page table.ai-admin-services-table td:nth-child(1),
.dashboard-page table.ai-admin-prices-table td:nth-child(1),
.dashboard-page table.ai-admin-prices-table td:nth-child(2) {
    color: #F6F0E6 !important;
    font-size: 13px !important;
}

.dashboard-page table.ai-admin-services-table td:nth-child(1) strong,
.dashboard-page table.ai-admin-prices-table td:nth-child(1) strong,
.dashboard-page table.ai-admin-prices-table td:nth-child(2) strong {
    color: #F6F0E6 !important;
    font-weight: 950 !important;
}

/* Статус Активна — строго того же размера, что кнопки */
.dashboard-page table.ai-admin-services-table td:nth-child(4),
.dashboard-page table.ai-admin-prices-table td:nth-child(5) {
    align-items: stretch !important;
    justify-content: stretch !important;
    width: 100% !important;
}

.dashboard-page table.ai-admin-services-table td:nth-child(4) span,
.dashboard-page table.ai-admin-services-table td:nth-child(4) .badge,
.dashboard-page table.ai-admin-services-table td:nth-child(4) [class*="badge"],
.dashboard-page table.ai-admin-prices-table td:nth-child(5) span,
.dashboard-page table.ai-admin-prices-table td:nth-child(5) .badge,
.dashboard-page table.ai-admin-prices-table td:nth-child(5) [class*="badge"] {
    width: 100% !important;
    height: 38px !important;
    min-height: 38px !important;
    max-width: none !important;
    padding: 8px 12px !important;
    border-radius: 999px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-sizing: border-box !important;
    font-size: 12px !important;
    font-weight: 850 !important;
    line-height: 1 !important;
    white-space: nowrap !important;
}

/* Колонка действий */
.dashboard-page table.ai-admin-services-table td:last-child,
.dashboard-page table.ai-admin-prices-table td:last-child {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 8px !important;
    align-items: stretch !important;
    justify-items: stretch !important;
    width: 100% !important;
}

/* Кнопки действий */
.dashboard-page table.ai-admin-services-table td:last-child button,
.dashboard-page table.ai-admin-services-table td:last-child .btn,
.dashboard-page table.ai-admin-services-table td:last-child a.btn,
.dashboard-page table.ai-admin-prices-table td:last-child button,
.dashboard-page table.ai-admin-prices-table td:last-child .btn,
.dashboard-page table.ai-admin-prices-table td:last-child a.btn {
    width: 100% !important;
    height: 38px !important;
    min-height: 38px !important;
    max-width: none !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 8px 12px !important;
    border-radius: 999px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-sizing: border-box !important;
    font-size: 12px !important;
    font-weight: 950 !important;
    line-height: 1 !important;
    white-space: nowrap !important;
    transform: none !important;
}

/* Убираем любые старые wrapper-скроллы */
.dashboard-page .ai-admin-table-scroll {
    overflow: visible !important;
    max-width: 100% !important;
}

.dashboard-page .ai-admin-table-scroll table {
    min-width: 0 !important;
}

/* На узких экранах карточка становится одной колонкой */
@media (max-width: 860px) {
    .dashboard-page table.ai-admin-services-table tbody tr,
    .dashboard-page table.ai-admin-prices-table tbody tr {
        grid-template-columns: 1fr !important;
        grid-template-areas:
            "name"
            "position"
            "service"
            "price"
            "time"
            "status"
            "actions" !important;
    }

    .dashboard-page table.ai-admin-services-table td:nth-child(1),
    .dashboard-page table.ai-admin-prices-table td:nth-child(1),
    .dashboard-page table.ai-admin-prices-table td:nth-child(2) {
        grid-area: auto !important;
    }
}

/* === /ADMIN SERVICES PRICE CARD ROWS FINAL === */
