* {
    box-sizing: border-box;
}

:root {
    --navy-1: #061126;
    --navy-2: #0b1f44;
    --blue-1: #4f9cff;
    --blue-2: #2677f2;
    --red-1: #ff6b6b;
    --red-2: #f04444;
    --green-1: #28d7a1;
    --green-2: #16b978;
    --text: #0f172a;
    --muted: #64748b;
    --card: rgba(255,255,255,0.94);
    --border: #e5eaf3;
    --shadow: 0 22px 70px rgba(15,23,42,0.08);
    --blue-shadow: 0 14px 30px rgba(37,99,235,0.25);
}

html,
body {
    margin: 0;
    padding: 0;
    font-family: Inter, Arial, sans-serif;
    color: var(--text);
}

a {
    color: inherit;
    text-decoration: none;
}

button,
input,
select,
textarea {
    font-family: inherit;
}

button {
    cursor: pointer;
}

/* ================= LOGIN PAGE ================= */

.login-page-premium {
    min-height: 100vh;
    margin: 0;
    padding: 22px;
    font-family: Inter, Arial, sans-serif;
    color: #0f172a;
    background: url("/static/restaurant.jpg") center center / cover no-repeat fixed;
    overflow: hidden;
    position: relative;
}

.login-bg-overlay {
    position: fixed;
    inset: 0;
    background: rgba(3, 7, 18, 0.50);
    z-index: 0;
}

.login-shell {
    position: relative;
    z-index: 1;
    width: min(100%, 1220px);
    height: calc(100vh - 44px);
    max-height: 760px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1.22fr 0.78fr;
    border-radius: 28px;
    overflow: hidden;
    box-shadow: 0 30px 90px rgba(15,23,42,0.22);
}

.login-left {
    position: relative;
    min-height: 100%;
}

.login-left::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, rgba(3,7,18,0.50), rgba(3,7,18,0.22));
}

.login-left-content {
    position: relative;
    z-index: 2;
    height: 100%;
    padding: 32px 42px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    color: white;
}

.login-left-content h1 {
    margin: 0 0 14px;
    font-size: 46px;
    line-height: 1.02;
    font-weight: 950;
}

.login-left-content p {
    max-width: 500px;
    margin: 0;
    font-size: 19px;
    line-height: 1.42;
    color: rgba(255,255,255,0.90);
}

.login-feature-row {
    display: flex;
    gap: 26px;
    margin-top: 38px;
}

.login-feature {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    text-align: center;
    font-size: 16px;
    font-weight: 800;
    color: white;
}

.login-feature-icon {
    width: 64px;
    height: 64px;
    border-radius: 18px;
    background: #eef7ff;
    color: #2697ff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 30px;
    box-shadow: 0 14px 34px rgba(0,0,0,0.20);
}

.login-feature-icon.green {
    background: #eafff4;
    color: #16b978;
}

.login-feature-icon.purple {
    background: #f0eaff;
    color: #7c3aed;
}

.login-right {
    min-height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 28px;
}

.login-card-premium {
    width: 100%;
    max-width: 390px;
    max-height: calc(100vh - 72px);
    background: rgba(255,255,255,0.96);
    border-radius: 28px;
    padding: 24px 28px 24px;
    box-shadow: 0 28px 80px rgba(15,23,42,0.16);
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.login-logo {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 6px;
    margin-bottom: 22px;
    margin-top: 0;
}

.login-logo-mark {
    width: 70px;
    height: 62px;
    background: transparent;
    color: transparent;
    font-size: 0;
    box-shadow: none;
    position: relative;
    overflow: visible;
}

.login-logo-mark::before {
    content: "R";
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 70px;
    font-weight: 900;
    line-height: 1;
    background: linear-gradient(135deg, #1ff5d2 0%, #18d7ff 45%, #1a8dff 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.login-logo-text {
    font-size: 44px;
    line-height: 0.9;
    font-weight: 300;
    letter-spacing: 3px;
    color: #0f172a;
    text-transform: lowercase;
    width: 100%;
    text-align: center;
}

.login-logo-text::after {
    content: "";
    display: block;
    width: 78px;
    height: 4px;
    border-radius: 999px;
    margin: 12px auto 0;
    background: linear-gradient(90deg, #1ff5d2, #1a8dff);
}

.login-logo-sub {
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 6px;
    color: #64748b;
    text-align: center;
}

.login-card-premium h2 {
    margin: 0;
    text-align: center;
    font-size: 28px;
    font-weight: 950;
}

.login-subtitle {
    margin: 8px 0 22px;
    text-align: center;
    font-size: 15px;
    color: #94a3b8;
    font-weight: 800;
}

.login-form-premium {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.login-input-wrap {
    min-height: 52px;
    border: 1px solid #e2e8f0;
    border-radius: 15px;
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 0 16px;
    background: white;
}

.login-input-wrap input {
    flex: 1;
    border: none;
    outline: none;
    font-size: 15px;
    background: transparent;
}

.login-options {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 14px;
    margin: 2px 0 8px;
    font-size: 14px;
    font-weight: 800;
    color: #94a3b8;
}

.login-options label {
    display: flex;
    align-items: center;
    gap: 8px;
}

.login-options a {
    color: #3b82f6;
    font-weight: 900;
}

.login-submit {
    width: 100%;
    min-height: 54px;
    border: none;
    border-radius: 15px;
    background: linear-gradient(180deg, #4f9cff, #2677f2);
    color: white;
    font-size: 18px;
    font-weight: 950;
    box-shadow: 0 16px 34px rgba(37,99,235,0.26);
}

.login-divider {
    display: flex;
    align-items: center;
    gap: 18px;
    margin: 22px 0;
}

.login-divider span {
    flex: 1;
    height: 1px;
    background: #e5e7eb;
}

.login-divider p {
    margin: 0;
    color: #94a3b8;
    font-weight: 900;
}

.google-login {
    width: 100%;
    min-height: 54px;
    border: 1px solid #e5e7eb;
    border-radius: 15px;
    background: white;
    color: #1f2937;
    font-size: 16px;
    font-weight: 950;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
}

.google-login span {
    color: #4285f4;
    font-weight: 950;
}

.login-footer-text {
    margin-top: 18px;
    text-align: center;
    color: #94a3b8;
    font-size: 14px;
    font-weight: 800;
}

.login-footer-text a {
    color: #3b82f6;
    font-weight: 950;
}

@media (max-height: 760px) {
    .login-card-premium {
        padding: 18px 26px;
    }

    .login-logo {
        margin-bottom: 16px;
    }

    .login-logo-mark {
        width: 58px;
        height: 50px;
    }

    .login-logo-mark::before {
        font-size: 58px;
    }

    .login-logo-text {
        font-size: 38px;
    }

    .login-logo-sub {
        font-size: 11px;
        letter-spacing: 5px;
    }

    .login-card-premium h2 {
        font-size: 25px;
    }

    .login-subtitle {
        margin-bottom: 16px;
    }

    .login-input-wrap {
        min-height: 48px;
    }

    .login-submit,
    .google-login {
        min-height: 48px;
    }

    .login-divider {
        margin: 16px 0;
    }

    .login-footer-text {
        margin-top: 14px;
    }
}

/* ================= DASHBOARD ================= */

.app-layout {
    min-height: 100vh;
    display: flex;
    background: linear-gradient(180deg, #f8fbff 0%, #eef4fb 100%);
}

.premium-sidebar {
    width: 280px;
    min-height: 100vh;
    height: 100vh;

    position: fixed;
    left: 0;
    top: 0;

    background: linear-gradient(180deg, #07152e 0%, #061126 100%);
    color: white;

    padding: 28px 22px;

    display: flex;
    flex-direction: column;

    box-shadow: 18px 0 55px rgba(7,20,46,0.22);

    z-index: 1000;

    overflow-y: auto;
    overflow-x: hidden;
}

.brand-box {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 46px;
}

.brand-icon {
    width: 54px;
    height: 54px;
    border-radius: 18px;
    background: linear-gradient(135deg, #08d7ff, #2563eb);
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 34px;
    font-weight: 950;
}

.brand-name {
    font-size: 30px;
    font-weight: 950;
}

.brand-subtitle {
    font-size: 11px;
    font-weight: 800;
    opacity: 0.7;
    letter-spacing: 0.6px;
}

.premium-nav {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.premium-nav-link {
    min-height: 56px;
    padding: 0 18px;

    border-radius: 17px;

    display: flex;
    align-items: center;
    gap: 12px;

    color: rgba(255,255,255,0.82);

    font-size: 17px;
    font-weight: 800;

    transition: 0.2s ease;
}

.premium-nav-link.active,
.premium-nav-link:hover {
    background: linear-gradient(135deg, #1e4fd7, #245ff5);
    color: white;
    box-shadow: var(--blue-shadow);
}

.premium-user-box {
    margin-top: auto;

    padding: 18px;

    border-radius: 22px;

    background: rgba(255,255,255,0.06);

    display: flex;
    align-items: center;
    gap: 12px;
}

.premium-avatar {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background: linear-gradient(135deg, #a855f7, #6d5dfc);
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 950;
}

.premium-user-box strong {
    display: block;
    font-size: 16px;
}

.premium-user-box span {
    display: block;
    font-size: 13px;
    opacity: 0.75;
}

.premium-main {
    margin-left: 280px;
    width: calc(100% - 280px);
    padding: 28px 34px 56px;
}

.premium-topbar {
    background: var(--card);
    border: 1px solid var(--border);
    box-shadow: var(--shadow);
    border-radius: 24px;
    min-height: 74px;
    padding: 0 24px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 18px;
    margin-bottom: 28px;
}

.muted-label {
    color: var(--muted);
    font-weight: 900;
    margin-right: 8px;
}

.topbar-business {
    display: flex;
    align-items: center;
    gap: 12px;
}

.role-pill,
.plan-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 34px;
    padding: 0 13px;
    border-radius: 999px;
    color: white;
    font-size: 14px;
    font-weight: 950;
}

.role-super_admin {
    background: linear-gradient(180deg, #7b5cff, #5a3ef0);
}

.plan-pill {
    background: linear-gradient(180deg, #f7b733, #fc8f00);
}

.logout-btn {
    border: none;
    min-height: 48px;
    padding: 0 18px;
    border-radius: 16px;
    color: white;
    background: linear-gradient(180deg, var(--red-1), var(--red-2));
    font-weight: 950;
    box-shadow: 0 12px 28px rgba(239,68,68,0.22);
}

.premium-page-head {
    display: none;
}

.premium-stats-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0,1fr));
    gap: 24px;
    margin-bottom: 24px;
}

.premium-stat-card {
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: 28px;
    box-shadow: var(--shadow);
    min-height: 240px;
    padding: 28px 22px;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.premium-stat-card h3 {
    margin: 10px 0 12px;
    font-size: 19px;
    font-weight: 950;
}

.premium-stat-card strong {
    font-size: 58px;
    line-height: 1;
    font-weight: 950;
}

.premium-stat-card p {
    margin: 10px 0 14px;
    color: var(--muted);
    font-weight: 600;
}

.stat-icon {
    width: 72px;
    height: 72px;
    border-radius: 22px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 34px;
}

.stat-icon.blue { background: #e7f0ff; }
.stat-icon.green { background: #e3f8ed; }
.stat-icon.yellow { background: #fff4d6; }
.stat-icon.purple { background: #efe7ff; }

.trend {
    padding: 9px 16px;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 900;
}

.blue-trend { background: #edf5ff; color: #2677f2; }
.green-trend { background: #e7faf1; color: #15803d; }
.neutral-trend { background: #f3f6fb; color: #64748b; }

.premium-info-banner {
    background: #e7faf1;
    color: #15803d;
    border-radius: 20px;
    padding: 18px 22px;
    font-weight: 950;
    box-shadow: var(--shadow);
    margin: 24px 0;
}

.premium-analytics-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0,1fr));
    gap: 24px;
    margin-bottom: 28px;
}

.premium-analytics-card {
    min-height: 190px;
    border-radius: 28px;
    padding: 24px;
    display: flex;
    align-items: center;
    gap: 22px;
    box-shadow: var(--shadow);
    border: 1px solid var(--border);
}

.blue-soft { background: linear-gradient(135deg, #f5f9ff, #edf5ff); }
.purple-soft { background: linear-gradient(135deg, #fbf7ff, #f3edff); }
.green-soft { background: linear-gradient(135deg, #f7fffb, #eafbf2); }

.premium-analytics-card h3 {
    margin: 0 0 8px;
    font-size: 22px;
    font-weight: 950;
}

.premium-analytics-card p {
    margin: 0 0 12px;
    color: var(--muted);
}

.premium-analytics-card strong {
    display: block;
    font-size: 42px;
    font-weight: 950;
}

.premium-analytics-card span {
    display: inline-flex;
    margin-top: 8px;
    background: rgba(255,255,255,0.8);
    padding: 8px 12px;
    border-radius: 999px;
    color: #2563eb;
    font-weight: 900;
}

.premium-table-card {
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: 28px;
    box-shadow: var(--shadow);
    padding: 24px;
}

.premium-section-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 18px;
}

.premium-section-head h2 {
    margin: 0;
    font-size: 26px;
    font-weight: 950;
}

.premium-section-head p {
    margin: 6px 0 0;
    color: var(--muted);
}

.premium-export-btn {
    border: none;
    min-height: 54px;
    padding: 0 22px;
    border-radius: 17px;
    background: linear-gradient(180deg, var(--green-1), var(--green-2));
    color: white;
    font-weight: 950;
    font-size: 16px;
}

.premium-search {
    width: 470px;
    max-width: 100%;
    min-height: 58px;
    border-radius: 18px;
    border: 1px solid #d8e0ee;
    background: white;
    padding: 0 18px;
    font-size: 17px;
    outline: none;
    box-shadow: var(--shadow);
    margin-bottom: 18px;
}

.premium-table-wrap {
    border-radius: 24px;
    overflow-x: auto;
    border: 1px solid var(--border);
}

.premium-table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
}

.premium-table th {
    background: linear-gradient(90deg, var(--navy-1), var(--navy-2), var(--navy-1));
    color: white;
    padding: 22px 16px;
    text-align: center;
    font-size: 17px;
    font-weight: 950;
}

.premium-table td {
    background: rgba(255,255,255,0.78);
    padding: 20px 16px;
    text-align: center;
    font-size: 16px;
    border-bottom: 1px solid rgba(15,23,42,0.06);
}

.people-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 54px;
    height: 42px;
    padding: 0 14px;
    border-radius: 14px;
    font-size: 18px;
    font-weight: 900;
    color: white;
    background: linear-gradient(180deg, #7b5cff, #5e47dd);
}

.premium-row-actions {
    display: flex;
    justify-content: center;
    gap: 10px;
}

.premium-row-actions button {
    width: 48px;
    height: 44px;
    border-radius: 14px;
    border: none;
    background: linear-gradient(180deg, #4f9cff, #2677f2);
    color: white;
    font-size: 20px;
}

.premium-row-actions button.delete {
    background: linear-gradient(180deg, #ff6666, #ef4444);
}

/* ================= PREMIUM MODAL SYSTEM V6 GLASS ================= */

.modal {
    position: fixed;
    inset: 0;
    display: none;
    align-items: center;
    justify-content: center;
    background: rgba(3, 10, 24, 0.58);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    z-index: 9999;
    padding: 24px;
}

.modal-content,
.premium-modal,
.business-modal,
.menu-item-modal {
    width: 680px;
    max-width: 94vw;
    max-height: 88vh;
    overflow-y: auto;
    background: linear-gradient(145deg, rgba(15, 31, 55, 0.88), rgba(8, 18, 38, 0.92));
    border-radius: 26px;
    padding: 28px;
    box-shadow: 0 34px 110px rgba(0, 0, 0, 0.45);
    border: 1px solid rgba(255, 255, 255, 0.14);
    color: white;
    animation: premiumModalIn 0.22s ease-out;
}

@keyframes premiumModalIn {
    from {
        opacity: 0;
        transform: translateY(18px) scale(0.98);
    }
    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

.modal-content h2,
.premium-modal h2 {
    margin: 0 0 22px;
    font-size: 24px;
    font-weight: 950;
    color: white;
}

.modal-content input,
.modal-content select,
.modal-content textarea,
.premium-modal input,
.premium-modal select,
.premium-modal textarea {
    width: 100%;
    min-height: 54px;
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 16px;
    padding: 0 16px;
    margin-bottom: 12px;
    background: rgba(255, 255, 255, 0.10);
    color: white;
    font-size: 15px;
    font-weight: 750;
    outline: none;
    box-sizing: border-box;
    transition: 0.18s ease;
}

.modal-content textarea,
.premium-modal textarea {
    min-height: 110px;
    padding-top: 16px;
    resize: vertical;
}

.modal-content input::placeholder,
.modal-content textarea::placeholder,
.premium-modal input::placeholder,
.premium-modal textarea::placeholder {
    color: rgba(255,255,255,0.55);
}

.modal-content select option,
.premium-modal select option {
    background: #0b1f44;
    color: white;
}

.modal-content input:focus,
.modal-content select:focus,
.modal-content textarea:focus,
.premium-modal input:focus,
.premium-modal select:focus,
.premium-modal textarea:focus {
    border-color: rgba(79, 156, 255, 0.9);
    box-shadow: 0 0 0 4px rgba(79, 156, 255, 0.18);
    background: rgba(255, 255, 255, 0.15);
}

.modal-actions {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 14px;
    margin-top: 18px;
}

.save-btn,
.close-btn {
    min-height: 54px;
    border: none;
    border-radius: 16px;
    padding: 0 24px;
    font-size: 15px;
    font-weight: 950;
    cursor: pointer;
    transition: 0.18s ease;
}

.save-btn {
    color: white;
    background: linear-gradient(135deg, #7c3aed, #2677f2);
    box-shadow: 0 16px 34px rgba(37, 99, 235, 0.34);
}

.close-btn {
    background: rgba(255,255,255,0.12);
    color: white;
}

.save-btn:hover,
.close-btn:hover {
    transform: translateY(-1px);
}

#popup {
    display: none;
    position: fixed;
    right: 24px;
    bottom: 24px;
    z-index: 9999;
    background: #e7faf1;
    color: #15803d;
    border-radius: 18px;
    padding: 15px 18px;
    font-size: 16px;
    font-weight: 900;
}

/* RESPONSIVE */

@media (max-width: 1380px) {
    .premium-stats-grid {
        grid-template-columns: repeat(2, minmax(0,1fr));
    }

    .premium-analytics-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 1080px) {

    .premium-sidebar {
        position: relative;
        width: 100%;
        min-height: auto;
    }

    .app-layout {
        display: block;
    }

    .premium-main {
        margin-left: 0;
        width: 100%;
    }

    .premium-topbar {
        flex-direction: column;
        align-items: flex-start;
        padding: 20px;
    }
}

@media (max-width: 700px) {
    .premium-main {
        padding: 18px 12px;
    }

    .premium-stats-grid {
        grid-template-columns: 1fr;
    }

    .premium-topbar {
        align-items: stretch;
    }

    .topbar-business {
        flex-direction: column;
        align-items: flex-start;
    }
}

/* ===== DASHBOARD SMALL FIXES ===== */

.topbar-right-stack {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 12px;
}

.topbar-actions-row {
    display: flex;
    align-items: center;
    gap: 14px;
}

.notification-btn {
    position: relative;
    width: 46px;
    height: 46px;
    border: none;
    border-radius: 16px;
    background: #ffffff;
    box-shadow: 0 10px 26px rgba(15, 23, 42, 0.08);
    font-size: 20px;
}

.notification-btn span {
    position: absolute;
    top: -6px;
    right: -6px;
    min-width: 22px;
    height: 22px;
    padding: 0 6px;
    border-radius: 999px;
    background: #ef4444;
    color: white;
    border: 2px solid white;
    font-size: 12px;
    font-weight: 950;
    display: flex;
    align-items: center;
    justify-content: center;
}

.status-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 34px;
    padding: 0 14px;
    border-radius: 999px;
    background: #dcfce7;
    color: #16a34a;
    font-size: 14px;
    font-weight: 950;
}

.view-all-reservations {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 22px;
    color: #2677f2;
    font-size: 18px;
    font-weight: 900;
}

@media (max-width: 1080px) {
    .topbar-right-stack {
        align-items: flex-start;
    }
}

.analytics-click-card {
    text-decoration: none;
    color: inherit;
    transition: 0.18s ease;
}

.analytics-click-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 28px 80px rgba(15, 23, 42, 0.14);
}

.dashboard-chart-card {
    margin-bottom: 24px;
}

.dashboard-bar-chart {
    height: 280px;
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 18px;
    align-items: end;
    padding: 22px 10px 6px;
}

.chart-day {
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.chart-value {
    font-size: 18px;
    font-weight: 950;
    color: #0f172a;
    margin-bottom: 10px;
}

.chart-bar-wrap {
    width: 100%;
    max-width: 58px;
    height: 170px;
    border-radius: 999px;
    background: #eef4fb;
    display: flex;
    align-items: end;
    overflow: hidden;
    box-shadow: inset 0 0 0 1px #e2e8f0;
}

.chart-bar {
    width: 100%;
    min-height: 8px;
    border-radius: 999px;
    background: linear-gradient(180deg, #4f9cff, #2677f2);
    box-shadow: 0 12px 26px rgba(37, 99, 235, 0.28);
}

.chart-label {
    margin-top: 12px;
    font-size: 15px;
    font-weight: 950;
    color: #0f172a;
}

.chart-date {
    margin-top: 4px;
    font-size: 12px;
    font-weight: 800;
    color: #94a3b8;
}

@media (max-width: 760px) {
    .dashboard-bar-chart {
        gap: 10px;
        overflow-x: auto;
    }

    .chart-day {
        min-width: 70px;
    }
}

.dashboard-hours-card {
    margin-bottom: 24px;
}

.top-hours-list {
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding: 8px 4px 4px;
}

.top-hour-row {
    display: grid;
    grid-template-columns: 90px 1fr 60px;
    align-items: center;
    gap: 16px;
}

.top-hour-label {
    font-size: 17px;
    font-weight: 950;
    color: #0f172a;
}

.top-hour-bar-wrap {
    height: 26px;
    border-radius: 999px;
    background: #eef4fb;
    overflow: hidden;
    box-shadow: inset 0 0 0 1px #e2e8f0;
}

.top-hour-bar {
    height: 100%;
    min-width: 8px;
    border-radius: 999px;
    background: linear-gradient(90deg, #8b5cf6, #2677f2);
    box-shadow: 0 10px 22px rgba(37, 99, 235, 0.22);
}

.top-hour-count {
    font-size: 18px;
    font-weight: 950;
    color: #0f172a;
    text-align: right;
}

@media (max-width: 760px) {
    .top-hour-row {
        grid-template-columns: 70px 1fr 40px;
        gap: 10px;
    }
}

.today-bookings-list{
    display:flex;
    flex-direction:column;
    gap:12px;
}

.today-booking-row{
    display:grid;
    grid-template-columns:90px 1fr 90px;
    gap:15px;
    align-items:center;
    padding:14px;
    border:1px solid #edf1f7;
    border-radius:14px;
    background:#fafcff;
}

.today-booking-row strong{
    color:#0f172a;
}

.today-booking-row span{
    color:#64748b;
    font-size:14px;
}

.today-live-card {
    margin-bottom: 24px;
}

.today-booking-row {
    grid-template-columns: 90px 1fr 90px 170px;
}

.live-status-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 38px;
    padding: 0 14px;
    border-radius: 999px;
    font-size: 14px;
    font-weight: 950;
    white-space: nowrap;
}

.status-later {
    background: #e7faf1;
    color: #15803d;
}

.status-soon {
    background: #fff4d6;
    color: #b45309;
}

.status-now {
    background: #edf5ff;
    color: #2563eb;
}

.status-late {
    background: #fee2e2;
    color: #b91c1c;
}

.status-unknown {
    background: #f3f6fb;
    color: #64748b;
}

@media (max-width: 760px) {
    .today-booking-row {
        grid-template-columns: 1fr;
        align-items: flex-start;
    }
}

.capacity-bar {
    width: 100%;
    height: 10px;
    background: #edf2f7;
    border-radius: 999px;
    margin-top: 12px;
    overflow: hidden;
}

.capacity-fill {
    height: 100%;
    border-radius: 999px;
    background: linear-gradient(90deg, #7c3aed, #2563eb);
}

.status-green{
background:#dcfce7;
color:#15803d;
}

.status-yellow{
background:#fef3c7;
color:#b45309;
}

.status-red{
background:#fee2e2;
color:#b91c1c;
}

.premium-modal-header {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 24px;
}

.premium-modal-icon {
    width: 58px;
    height: 58px;
    border-radius: 20px;
    background: linear-gradient(135deg, #4f9cff, #2677f2);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 28px;
    box-shadow: 0 16px 34px rgba(37, 99, 235, 0.24);
}

.premium-modal-header h2 {
    margin: 0;
}

.premium-modal-header p {
    margin: 6px 0 0;
    color: #64748b;
    font-weight: 700;
}

.business-modal {
    width: 820px;
    max-width: 96vw;
}

.menu-item-modal {
    width: 980px;
    max-width: 96vw;
}

.menu-preview {
    width: 180px;
    height: 130px;
    object-fit: cover;
    border-radius: 22px;
    border: 1px solid #e2e8f0;
    box-shadow: 0 14px 34px rgba(15, 23, 42, 0.12);
}

.settings-preview-layout {
    display: grid;
    grid-template-columns: 1fr 380px;
    gap: 24px;
    align-items: stretch;
}

.settings-preview-info {
    padding: 24px;
    border-radius: 24px;
    background: linear-gradient(135deg, #f8fbff, #eef5ff);
    border: 1px solid #e2e8f0;
}

.settings-preview-info h3 {
    margin: 0 0 10px;
    font-size: 28px;
    font-weight: 950;
    color: #0f172a;
}

.settings-preview-info p {
    margin: 0 0 18px;
    color: #64748b;
    font-weight: 700;
}

.preview-meta-row {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.preview-meta-row span {
    padding: 10px 14px;
    border-radius: 999px;
    background: white;
    color: #334155;
    font-weight: 900;
    box-shadow: 0 10px 24px rgba(15, 23, 42, 0.06);
}

.mini-chat-preview {
    border-radius: 28px;
    overflow: hidden;
    background: white;
    border: 1px solid #e2e8f0;
    box-shadow: 0 24px 60px rgba(15, 23, 42, 0.12);
}

.mini-chat-head {
    min-height: 62px;
    color: white;
    padding: 0 18px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.mini-chat-head strong {
    font-size: 17px;
    font-weight: 950;
}

.mini-chat-head span {
    font-size: 13px;
    font-weight: 900;
    opacity: 0.9;
}

.mini-chat-body {
    padding: 18px;
    display: flex;
    flex-direction: column;
    gap: 12px;
    background: #f8fbff;
}

.mini-bot-message,
.mini-user-message {
    max-width: 85%;
    padding: 12px 14px;
    border-radius: 18px;
    font-size: 14px;
    font-weight: 700;
}

.mini-bot-message {
    background: white;
    color: #0f172a;
    border-bottom-left-radius: 6px;
}

.mini-user-message {
    margin-left: auto;
    background: #2677f2;
    color: white;
    border-bottom-right-radius: 6px;
}

@media (max-width: 900px) {
    .settings-preview-layout {
        grid-template-columns: 1fr;
    }
}

.reservation-glass-modal {
    width: 720px;
}

.reservation-edit-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

.glass-field {
    min-height: 54px;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 0 14px;
    border-radius: 15px;
    background: rgba(255,255,255,0.10);
    border: 1px solid rgba(255,255,255,0.13);
}

.glass-field.full {
    grid-column: 1 / -1;
}

.glass-field span {
    opacity: 0.85;
}

.glass-field input,
.glass-field select {
    margin: 0 !important;
    padding: 0 !important;
    min-height: 52px !important;
    border: none !important;
    background: transparent !important;
    box-shadow: none !important;
}

.glass-actions {
    margin-top: 22px;
}

@media (max-width: 760px) {
    .reservation-edit-grid {
        grid-template-columns: 1fr;
    }
}

/* ================= NOTIFICATIONS PANEL ================= */

.notification-wrapper {
    position: relative;
}

.notifications-panel {
    position: absolute;
    top: 58px;
    right: 0;
    width: 380px;
    max-width: 90vw;
    background: rgba(255, 255, 255, 0.96);
    border: 1px solid rgba(226, 232, 240, 0.9);
    border-radius: 24px;
    box-shadow: 0 28px 90px rgba(15, 23, 42, 0.20);
    padding: 18px;
    z-index: 5000;
    display: none;
}

.notifications-panel.open {
    display: block;
}

.notifications-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
    padding-bottom: 14px;
    border-bottom: 1px solid #e5eaf3;
}

.notifications-head h3 {
    margin: 0;
    font-size: 20px;
    font-weight: 950;
    color: #0f172a;
}

.notifications-head p {
    margin: 4px 0 0;
    color: #64748b;
    font-size: 13px;
    font-weight: 800;
}

.notifications-head button {
    width: 34px;
    height: 34px;
    border: none;
    border-radius: 12px;
    background: #eef2f7;
    color: #0f172a;
    font-weight: 950;
}

.notifications-list {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 14px 0;
    max-height: 320px;
    overflow-y: auto;
}

.notification-item {
    display: grid;
    grid-template-columns: 44px 1fr;
    gap: 12px;
    align-items: center;
    padding: 12px;
    border-radius: 18px;
    background: linear-gradient(135deg, #f8fbff, #eef5ff);
    border: 1px solid #e5eaf3;
}

.notification-icon {
    width: 44px;
    height: 44px;
    border-radius: 15px;
    background: linear-gradient(135deg, #4f9cff, #2677f2);
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
}

.notification-item strong {
    display: block;
    font-size: 15px;
    color: #0f172a;
    font-weight: 950;
}

.notification-item p {
    margin: 4px 0 0;
    color: #64748b;
    font-size: 13px;
    font-weight: 750;
}

.notification-empty {
    padding: 18px;
    text-align: center;
    color: #64748b;
    font-weight: 850;
    background: #f8fbff;
    border-radius: 18px;
}

.notifications-footer {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 44px;
    border-radius: 16px;
    background: linear-gradient(135deg, #7c3aed, #2677f2);
    color: white;
    font-weight: 950;
}

@media (max-width: 700px) {
    .notifications-panel {
        right: auto;
        left: 0;
        width: 340px;
    }
}

/* ===== RESTAURANTS PREMIUM PAGE ===== */

.business-card-premium{
    padding:28px;
}

.top-actions{
    display:flex;
    align-items:center;
    gap:12px;
    flex-wrap:wrap;
}

.top-actions a{
    min-height:44px;
    padding:0 16px;
    border-radius:14px;
    background:#ffffff;
    border:1px solid #e5eaf3;
    display:flex;
    align-items:center;
    font-weight:900;
    box-shadow:0 10px 24px rgba(15,23,42,0.06);
}

.business-table td{
    vertical-align:middle;
}

.muted-text{
    color:#64748b;
    font-weight:800;
}

.business-actions{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    flex-wrap:wrap;
}

.mini-pill{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:34px;
    padding:0 14px;
    border-radius:999px;
    font-size:13px;
    font-weight:950;
}

/* PLAN */

.purple-pill{
background:linear-gradient(135deg,#7b3ff2,#5d2de1);
color:#fff;
font-weight:800;
box-shadow:0 8px 20px rgba(123,63,242,.28);
}

.orange-pill{
background:linear-gradient(135deg,#ffb21d,#ff9800);
color:#fff;
font-weight:800;
box-shadow:0 8px 20px rgba(255,152,0,.28);
}

.gray-pill{
background:linear-gradient(135deg,#7e8795,#5f6978);
color:#fff;
font-weight:800;
box-shadow:0 8px 20px rgba(0,0,0,.18);
}

/* AI + STATUS */

.green-pill{
background:linear-gradient(135deg,#1fd46a,#0fbf57);
color:#fff;
font-weight:800;
box-shadow:0 8px 20px rgba(15,191,87,.28);
}

.red-pill{
background:linear-gradient(135deg,#ff5c5c,#ff2d2d);
color:#fff;
font-weight:800;
box-shadow:0 8px 20px rgba(255,45,45,.28);
}

.mini-open-btn,
.mini-enter-btn{
    min-height:40px;
    padding:0 14px;
    border-radius:14px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    font-size:13px;
    font-weight:950;
    white-space:nowrap;
}

.mini-open-btn{
    background:#eef5ff;
    color:#2563eb;
}

.mini-enter-btn{
    background:#ecfeff;
    color:#0891b2;
}

.square-btn{
    width:42px;
    height:42px;
    border:none;
    border-radius:14px;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:17px;
    font-weight:900;
    cursor:pointer;
}

.edit-btn{
    background:linear-gradient(135deg,#4f9cff,#2677f2);
    color:white;
}

.green-btn{
    background:linear-gradient(135deg,#22c55e,#16a34a);
    color:white;
}

.red-btn{
    background:linear-gradient(135deg,#ff6b6b,#ef4444);
    color:white;
}

.square-btn:hover,
.mini-open-btn:hover,
.mini-enter-btn:hover,
.top-actions a:hover{
    transform:translateY(-2px);
    transition:0.18s ease;
}

@media (max-width:1200px){

.business-table{
    min-width:1300px;
}

}

@media (max-width:760px){

.top-actions{
    width:100%;
}

.top-actions a{
    flex:1;
    justify-content:center;
}

}

/* ===== RESTAURANTS EXACT BUTTON FIX ===== */

.top-actions a{
    min-height:48px;
    padding:0 22px;
    border:none;
    border-radius:14px;
    background:linear-gradient(180deg,#3b8cff,#1f6df2);
    color:#fff;
    font-weight:900;
    box-shadow:0 12px 28px rgba(37,99,235,.22);
}

.top-actions .logout-btn{
    background:linear-gradient(180deg,#ff6b6b,#ef4444);
    color:#fff;
    min-height:48px;
    padding:0 24px;
}

.business-actions{
    display:grid;
    grid-template-columns:repeat(2,auto);
    gap:10px;
    justify-content:center;
}

.mini-enter-btn{
    min-width:92px;
    height:46px;
    border-radius:14px;
    background:linear-gradient(180deg,#3b8cff,#1f6df2);
    color:#fff;
    font-weight:900;
}

.mini-open-btn{
    min-width:92px;
    height:46px;
    border-radius:14px;
    background:linear-gradient(180deg,#3b8cff,#1f6df2);
    color:#fff;
    font-weight:900;
}

.square-btn{
    width:46px;
    height:46px;
    border-radius:14px;
    color:#fff;
    font-size:18px;
}

.edit-btn{
    background:linear-gradient(180deg,#2dd4bf,#10b981);
}

.green-btn{
    background:linear-gradient(180deg,#22c55e,#16a34a);
}

.red-btn{
    background:linear-gradient(180deg,#ff5b5b,#ef4444);
}

.mini-pill{
    min-height:40px;
    padding:0 18px;
    font-size:14px;
    font-weight:900;
}

/* ===== BUSINESS TABLE NO HORIZONTAL SCROLL ===== */

.business-table{
    width:100%;
    table-layout:fixed;
}

.business-table th,
.business-table td{
    padding:14px 8px;
    font-size:14px;
    word-break:break-word;
}

.business-table th:nth-child(1),
.business-table td:nth-child(1){width:4%;}

.business-table th:nth-child(2),
.business-table td:nth-child(2){width:12%;}

.business-table th:nth-child(3),
.business-table td:nth-child(3){width:10%;}

.business-table th:nth-child(4),
.business-table td:nth-child(4){width:9%;}

.business-table th:nth-child(5),
.business-table td:nth-child(5){width:10%;}

.business-table th:nth-child(6),
.business-table td:nth-child(6){width:10%;}

.business-table th:nth-child(7),
.business-table td:nth-child(7){width:10%;}

.business-table th:nth-child(8),
.business-table td:nth-child(8){width:10%;}

.business-table th:nth-child(9),
.business-table td:nth-child(9){width:11%;}

.business-table th:nth-child(10),
.business-table td:nth-child(10){width:14%;}

.mini-pill{
    min-height:34px;
    padding:0 12px;
    font-size:13px;
}

.mini-open-btn,
.mini-enter-btn{
    min-width:82px;
    height:42px;
    font-size:13px;
}

.square-btn{
    width:42px;
    height:42px;
}

/* ===== BUSINESS PAGINATION ===== */

.business-pagination{
    display:grid;
    grid-template-columns:1fr auto 1fr;
    align-items:center;
    gap:18px;
    padding:22px 8px 0;
}

.pagination-info{
    color:#64748b;
    font-weight:800;
    font-size:14px;
}

.pagination-controls{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:8px;
}

.pagination-btn{
    width:42px;
    height:42px;
    border-radius:14px;
    display:flex;
    align-items:center;
    justify-content:center;
    background:#f3f7fc;
    color:#64748b;
    font-size:18px;
    font-weight:950;
    border:1px solid #e5eaf3;
}

.pagination-btn.active{
    background:linear-gradient(180deg,#4f9cff,#2677f2);
    color:white;
    box-shadow:0 12px 26px rgba(37,99,235,0.25);
}

.pagination-btn.disabled{
    opacity:0.45;
    pointer-events:none;
}

.pagination-page-select{
    display:flex;
    justify-content:flex-end;
}

.pagination-page-select span{
    min-height:42px;
    padding:0 18px;
    border-radius:14px;
    display:flex;
    align-items:center;
    background:#f8fbff;
    border:1px solid #e5eaf3;
    color:#64748b;
    font-size:14px;
    font-weight:900;
}

@media(max-width:900px){
    .business-pagination{
        grid-template-columns:1fr;
        text-align:center;
    }

    .pagination-page-select{
        justify-content:center;
    }
}

/* ================= CREATE BUSINESS PREMIUM PAGE ================= */

.create-business-topbar {
    min-height: 86px;
}

.top-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 14px;
    flex-wrap: wrap;
}

.top-actions a:not(.logout-btn) {
    min-height: 50px;
    padding: 0 20px;
    border-radius: 15px;
    background: linear-gradient(180deg, #4f9cff, #2677f2);
    color: white;
    font-size: 15px;
    font-weight: 950;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 12px 28px rgba(37, 99, 235, 0.22);
}

.create-business-card {
    padding: 28px;
}

.create-business-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 22px;
    margin-top: 18px;
}

.create-business-grid .settings-field label {
    display: block;
    margin-bottom: 10px;
    color: #0f172a;
    font-size: 15px;
    font-weight: 950;
}

.create-business-grid .settings-field input,
.create-business-grid .settings-field select {
    width: 100%;
    min-height: 58px;
    border-radius: 17px;
    border: 1px solid #dbe3ef;
    background: white;
    padding: 0 18px;
    font-size: 16px;
    font-weight: 750;
    color: #0f172a;
    outline: none;
    box-shadow: 0 12px 30px rgba(15, 23, 42, 0.04);
}

.create-business-grid .settings-field input:focus,
.create-business-grid .settings-field select:focus {
    border-color: #3b82f6;
    box-shadow: 0 0 0 4px rgba(59, 130, 246, 0.12);
}

.plans-title {
    margin: 28px 0 18px;
    font-size: 26px;
    font-weight: 950;
    color: #0f172a;
}

.create-plan-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
    margin-bottom: 24px;
}

.create-plan-grid .premium-plan-card {
    border: 1px solid #e2e8f0;
    border-radius: 20px;
    padding: 18px 20px;
    background: linear-gradient(180deg, #ffffff, #f8fbff);
    box-shadow: 0 14px 36px rgba(15, 23, 42, 0.06);
}

.create-plan-grid .premium-plan-card h3 {
    margin: 0 0 12px;
    font-size: 18px;
    font-weight: 950;
}

.create-plan-grid .premium-plan-card ul {
    margin: 0;
    padding-left: 22px;
    color: #0f172a;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.5;
}

.create-plan-grid .highlighted-plan {
    border-color: rgba(37, 99, 235, 0.35);
    box-shadow: 0 18px 46px rgba(37, 99, 235, 0.10);
}

.create-business-actions {
    display: flex;
    justify-content: flex-start;
    margin-top: 18px;
}

.create-business-actions .save-settings-btn {
    min-height: 58px;
    padding: 0 26px;
    border: none;
    border-radius: 16px;
    background: linear-gradient(180deg, #4f9cff, #2677f2);
    color: white;
    font-size: 17px;
    font-weight: 950;
    box-shadow: 0 16px 34px rgba(37, 99, 235, 0.26);
}

@media (max-width: 900px) {
    .create-business-grid,
    .create-plan-grid {
        grid-template-columns: 1fr;
    }
}

/* ================= USERS PREMIUM PAGE ================= */

.users-table-card {
    padding: 28px;
}

.users-section-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 24px;
}

.users-section-head h2 {
    margin: 0;
    font-size: 26px;
    font-weight: 950;
    color: #0f172a;
}

.users-section-head p {
    margin: 6px 0 0;
    color: #64748b;
    font-weight: 750;
}

.add-user-btn {
    min-height: 52px;
    padding: 0 22px;
    border: none;
    border-radius: 15px;
    background: linear-gradient(180deg, #4f9cff, #2677f2);
    color: white;
    font-size: 16px;
    font-weight: 950;
    box-shadow: 0 14px 30px rgba(37, 99, 235, 0.25);
}

.user-role-pill,
.user-status-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 34px;
    min-width: 112px;
    padding: 0 16px;
    border-radius: 10px;
    font-size: 14px;
    font-weight: 950;
}

.role-superadmin-pill {
    background: #efe7ff;
    color: #6d28d9;
}

.role-owner-pill {
    background: #dcfce7;
    color: #15803d;
}

.role-admin-pill {
    background: #e0f2fe;
    color: #0369a1;
}

.role-staff-pill {
    background: #fff4d6;
    color: #b45309;
}

.status-active-pill {
    background: #dcfce7;
    color: #15803d;
}

.status-inactive-pill {
    background: #fee2e2;
    color: #dc2626;
}

.user-actions {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 12px;
}

.user-action-btn {
    width: 44px;
    height: 44px;
    border: none;
    border-radius: 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 17px;
    font-weight: 950;
    color: white;
}

.user-edit-btn {
    background: linear-gradient(180deg, #4f9cff, #2677f2);
}

.user-delete-btn {
    background: linear-gradient(180deg, #ff6b6b, #ef4444);
}

.user-save-btn {
    background: linear-gradient(180deg, #22c55e, #16a34a);
}

.users-table td {
    height: 74px;
}

.users-table th,
.users-table td {
    white-space: nowrap;
}

.users-table select {
    min-height: 42px;
    border-radius: 12px;
    border: 1px solid #dbe3ef;
    padding: 0 12px;
    font-weight: 800;
    color: #0f172a;
    background: white;
}

.add-user-modal .settings-field label {
    color: white;
}

.users-muted-footer {
    margin-top: 24px;
    min-height: 54px;
    border-radius: 18px;
    background: #f8fbff;
    border: 1px solid #e5eaf3;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #64748b;
    font-weight: 850;
}

/* ================= USERS PAGE FINAL PREMIUM FIX ================= */

.users-blue-info{
    background:linear-gradient(135deg,#eaf3ff,#eef6ff);
    color:#2563eb;
    border:1px solid #dbeafe;
    box-shadow:none;
}

.users-primary-btn{
    min-height:52px;
    padding:0 22px;
    border:none;
    border-radius:16px;
    background:linear-gradient(180deg,#4f9cff,#2677f2);
    color:#fff;
    font-size:15px;
    font-weight:950;
    box-shadow:0 14px 30px rgba(37,99,235,.22);
    transition:.18s ease;
}

.users-primary-btn:hover{
    transform:translateY(-2px);
}

.users-modern-table{
    width:100%;
    border-collapse:separate;
    border-spacing:0;
}

.users-modern-table th{
    background:linear-gradient(90deg,#07152e,#0b1f44,#07152e);
    color:#fff;
    padding:18px 14px;
    font-size:15px;
    font-weight:950;
    text-align:center;
}

.users-modern-table td{
    background:#ffffff;
    padding:16px 14px;
    border-bottom:1px solid #edf2f7;
    text-align:center;
    font-size:15px;
    font-weight:800;
    color:#0f172a;
}

.users-modern-table tr:hover td{
    background:#f8fbff;
}

.users-person-cell{
    display:flex;
    align-items:center;
    gap:12px;
    justify-content:flex-start;
}

.users-person-avatar{
    width:42px;
    height:42px;
    border-radius:14px;
    background:linear-gradient(135deg,#8b5cf6,#2563eb);
    color:#fff;
    font-size:14px;
    font-weight:950;
    display:flex;
    align-items:center;
    justify-content:center;
    flex-shrink:0;
}

.users-person-cell strong{
    display:block;
    font-size:15px;
    font-weight:950;
}

.users-person-cell span{
    display:block;
    font-size:12px;
    color:#64748b;
    font-weight:800;
    margin-top:2px;
}

.users-role-pill{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:36px;
    padding:0 14px;
    border-radius:999px;
    font-size:13px;
    font-weight:950;
}

.users-role-pill.purple{
    background:#f3e8ff;
    color:#7c3aed;
}

.users-role-pill.green{
    background:#dcfce7;
    color:#15803d;
}

.users-role-pill.blue{
    background:#dbeafe;
    color:#1d4ed8;
}

.users-role-pill.orange{
    background:#fff7d6;
    color:#b45309;
}

.users-status{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:36px;
    padding:0 14px;
    border-radius:999px;
    font-size:13px;
    font-weight:950;
}

.users-status.active{
    background:#dcfce7;
    color:#15803d;
}

.users-status.off{
    background:#fee2e2;
    color:#b91c1c;
}

.users-action-row{
    display:flex;
    justify-content:center;
    align-items:center;
    gap:8px;
    flex-wrap:wrap;
}

.users-action-row form{
    margin:0;
}

.users-icon-btn{
    width:42px;
    height:42px;
    border:none;
    border-radius:14px;
    color:#fff;
    font-size:16px;
    font-weight:900;
    display:flex;
    align-items:center;
    justify-content:center;
    transition:.18s ease;
}

.users-icon-btn:hover{
    transform:translateY(-2px);
}

.users-icon-btn.edit{
    background:linear-gradient(180deg,#4f9cff,#2677f2);
}

.users-icon-btn.warn{
    background:linear-gradient(180deg,#ffb020,#f59e0b);
}

.users-icon-btn.ok{
    background:linear-gradient(180deg,#22c55e,#16a34a);
}

.users-icon-btn.delete{
    background:linear-gradient(180deg,#ff6b6b,#ef4444);
}

.users-modern-table td:first-child{
    font-weight:950;
    color:#2563eb;
}

@media(max-width:900px){

.users-modern-table{
    min-width:760px;
}
}

/* ================= SETTINGS PREMIUM PAGE FINAL ================= */

.settings-premium-page {
    padding-bottom: 28px;
}

.settings-topbar {
    margin-bottom: 26px;
}

.settings-hero {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 22px;
}

.settings-hero h1 {
    margin: 0;
    font-size: 34px;
    font-weight: 950;
    color: #0f172a;
}

.settings-hero p {
    margin: 8px 0 0;
    color: #64748b;
    font-size: 16px;
    font-weight: 750;
}

.settings-main-save,
.settings-blue-btn {
    min-height: 52px;
    padding: 0 22px;
    border: none;
    border-radius: 16px;
    background: linear-gradient(180deg, #4f9cff, #2677f2);
    color: white;
    font-size: 15px;
    font-weight: 950;
    box-shadow: 0 14px 30px rgba(37, 99, 235, 0.24);
}

.settings-success-banner {
    margin-bottom: 22px;
    padding: 16px 20px;
    border-radius: 18px;
    background: #dcfce7;
    color: #15803d;
    font-size: 15px;
    font-weight: 950;
    border: 1px solid #bbf7d0;
}

.settings-nav-cards {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 18px;
    margin-bottom: 22px;
}

.settings-nav-card {
    min-height: 118px;
    padding: 20px;
    border-radius: 20px;
    background: rgba(255,255,255,0.96);
    border: 1px solid #e5eaf3;
    box-shadow: 0 16px 44px rgba(15, 23, 42, 0.07);
    display: grid;
    grid-template-columns: 56px 1fr auto;
    align-items: center;
    gap: 14px;
    transition: 0.18s ease;
}

.settings-nav-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 24px 70px rgba(15, 23, 42, 0.11);
}

.settings-nav-card strong {
    display: block;
    font-size: 15px;
    font-weight: 950;
    color: #0f172a;
    margin-bottom: 4px;
}

.settings-nav-card span {
    display: block;
    font-size: 12px;
    line-height: 1.35;
    color: #64748b;
    font-weight: 750;
}

.settings-nav-card b {
    font-size: 26px;
    color: #64748b;
}

.settings-nav-icon {
    width: 56px;
    height: 56px;
    border-radius: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
}

.settings-nav-icon.blue { background: #eaf3ff; color: #2563eb; }
.settings-nav-icon.purple { background: #f3e8ff; color: #7c3aed; }
.settings-nav-icon.green { background: #dcfce7; color: #15803d; }
.settings-nav-icon.orange { background: #fff4d6; color: #b45309; }
.settings-nav-icon.cyan { background: #cffafe; color: #0891b2; }

.settings-dashboard-grid {
    display: grid;
    grid-template-columns: 1.1fr 1fr;
    gap: 22px;
    align-items: start;
}

.settings-panel {
    background: rgba(255,255,255,0.96);
    border: 1px solid #e5eaf3;
    border-radius: 24px;
    padding: 24px;
    box-shadow: 0 18px 56px rgba(15, 23, 42, 0.07);
}

.settings-panel-large {
    grid-row: span 1;
}

.settings-panel-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 20px;
}

.settings-panel-head h2 {
    margin: 0;
    font-size: 22px;
    font-weight: 950;
    color: #0f172a;
}

.settings-panel-head p {
    margin: 6px 0 0;
    color: #64748b;
    font-size: 14px;
    font-weight: 750;
}

.settings-form-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 18px;
}

.settings-form-grid.compact {
    grid-template-columns: 1fr 1fr;
}

.settings-field {
    display: flex;
    flex-direction: column;
    gap: 9px;
}

.settings-field.settings-full {
    grid-column: 1 / -1;
}

.settings-field label {
    color: #334155;
    font-size: 14px;
    font-weight: 950;
}

.settings-field input,
.settings-field select,
.settings-field textarea {
    width: 100%;
    min-height: 54px;
    border-radius: 15px;
    border: 1px solid #dbe3ef;
    background: #ffffff;
    padding: 0 16px;
    font-size: 15px;
    font-weight: 750;
    color: #0f172a;
    outline: none;
    box-shadow: 0 10px 24px rgba(15, 23, 42, 0.04);
    transition: 0.18s ease;
}

.settings-field textarea {
    min-height: 118px;
    padding-top: 15px;
    resize: vertical;
}

.settings-field input:focus,
.settings-field select:focus,
.settings-field textarea:focus {
    border-color: #3b82f6;
    box-shadow: 0 0 0 4px rgba(59, 130, 246, 0.12);
}

.settings-field input[readonly] {
    background: #f8fbff;
    color: #64748b;
}

.settings-blue-btn {
    margin-top: 22px;
}

.color-input-row {
    display: grid;
    grid-template-columns: 1fr 54px;
    gap: 10px;
    align-items: center;
}

.color-input-row span {
    width: 54px;
    height: 54px;
    border-radius: 16px;
    border: 1px solid #dbe3ef;
    box-shadow: 0 10px 24px rgba(15, 23, 42, 0.08);
}

.settings-toggle-list {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.settings-toggle-row,
.settings-readonly-row {
    min-height: 68px;
    padding: 14px 0;
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    border-bottom: 1px solid #edf2f7;
    position: relative;
}

.settings-toggle-row:last-child,
.settings-readonly-row:last-child {
    border-bottom: none;
}

.settings-toggle-row strong,
.settings-readonly-row strong {
    display: block;
    font-size: 15px;
    font-weight: 950;
    color: #0f172a;
}

.settings-toggle-row span,
.settings-readonly-row span {
    display: block;
    margin-top: 4px;
    font-size: 13px;
    color: #64748b;
    font-weight: 750;
}

.settings-readonly-row em {
    min-height: 34px;
    padding: 0 14px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #eef5ff;
    color: #2563eb;
    font-style: normal;
    font-size: 13px;
    font-weight: 950;
}

.settings-toggle-row input[type="checkbox"] {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.modern-switch {
    width: 52px !important;
    height: 30px;
    border-radius: 999px;
    background: #d1d5db;
    position: relative;
    margin: 0 !important;
    transition: 0.18s ease;
}

.modern-switch::after {
    content: "";
    position: absolute;
    width: 24px;
    height: 24px;
    left: 3px;
    top: 3px;
    border-radius: 50%;
    background: white;
    box-shadow: 0 4px 12px rgba(15,23,42,0.18);
    transition: 0.18s ease;
}

.settings-toggle-row input[type="checkbox"]:checked + .modern-switch {
    background: linear-gradient(180deg, #4f9cff, #2677f2);
}

.settings-toggle-row input[type="checkbox"]:checked + .modern-switch::after {
    transform: translateX(22px);
}

.settings-disabled-box {
    padding: 18px;
    border-radius: 18px;
    background: #f8fbff;
    border: 1px dashed #cbd5e1;
    margin-bottom: 18px;
}

.settings-disabled-box strong {
    display: block;
    font-size: 15px;
    font-weight: 950;
    color: #0f172a;
    margin-bottom: 6px;
}

.settings-disabled-box span {
    display: block;
    color: #64748b;
    font-size: 13px;
    font-weight: 750;
    line-height: 1.45;
}

.settings-action-row {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
}

.settings-green-btn,
.settings-muted-btn {
    min-height: 50px;
    padding: 0 18px;
    border: none;
    border-radius: 15px;
    font-size: 14px;
    font-weight: 950;
}

.settings-green-btn {
    background: linear-gradient(180deg, #22c55e, #16a34a);
    color: white;
}

.settings-muted-btn {
    background: #eef2f7;
    color: #64748b;
}

.settings-green-btn:disabled,
.settings-muted-btn:disabled {
    opacity: 0.78;
    cursor: not-allowed;
}

.settings-admin-note {
    margin: 22px 0;
    padding: 18px 22px;
    border-radius: 20px;
    background: #e7faf1;
    color: #15803d;
    font-size: 16px;
    font-weight: 950;
    border: 1px solid #bbf7d0;
}

.settings-preview-premium {
    margin-top: 22px;
    background: rgba(255,255,255,0.96);
    border: 1px solid #e5eaf3;
    border-radius: 24px;
    padding: 24px;
    box-shadow: 0 18px 56px rgba(15, 23, 42, 0.07);
}

.settings-footer {
    margin-top: 24px;
    padding: 18px 8px 0;
    display: flex;
    justify-content: space-between;
    gap: 18px;
    color: #94a3b8;
    font-size: 13px;
    font-weight: 800;
}

@media (max-width: 1500px) {
    .settings-nav-cards {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 1180px) {
    .settings-dashboard-grid {
        grid-template-columns: 1fr;
    }

    .settings-nav-cards {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 760px) {
    .settings-hero {
        flex-direction: column;
        align-items: flex-start;
    }

    .settings-main-save {
        width: 100%;
    }

    .settings-nav-cards {
        grid-template-columns: 1fr;
    }

    .settings-form-grid,
    .settings-form-grid.compact {
        grid-template-columns: 1fr;
    }

    .settings-footer {
        flex-direction: column;
    }
}

/* ================= MENU MANAGER PREMIUM FINAL ================= */

.menu-premium-page {
    padding-bottom: 40px;
}

.menu-hero {
    min-height: 150px;
    padding: 28px;
    margin-bottom: 22px;
    border-radius: 28px;
    background:
        radial-gradient(circle at top right, rgba(79,156,255,0.22), transparent 34%),
        linear-gradient(135deg, #07152e, #0b1f44);
    color: white;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    box-shadow: 0 24px 70px rgba(7,21,46,0.20);
}

.menu-kicker {
    display: inline-flex;
    min-height: 30px;
    padding: 0 12px;
    border-radius: 999px;
    align-items: center;
    background: rgba(255,255,255,0.12);
    color: rgba(255,255,255,0.86);
    font-size: 12px;
    font-weight: 950;
    margin-bottom: 12px;
}

.menu-hero h1 {
    margin: 0;
    font-size: 38px;
    font-weight: 950;
}

.menu-hero p {
    margin: 8px 0 0;
    max-width: 640px;
    color: rgba(255,255,255,0.78);
    font-size: 16px;
    font-weight: 750;
}

.menu-hero-actions {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
}

.menu-primary-btn,
.menu-secondary-btn {
    min-height: 54px;
    padding: 0 22px;
    border: none;
    border-radius: 16px;
    color: white;
    font-size: 15px;
    font-weight: 950;
    transition: 0.18s ease;
}

.menu-primary-btn {
    background: linear-gradient(180deg, #4f9cff, #2677f2);
    box-shadow: 0 16px 34px rgba(37,99,235,0.28);
}

.menu-secondary-btn {
    background: rgba(255,255,255,0.12);
    border: 1px solid rgba(255,255,255,0.18);
}

.menu-primary-btn:hover,
.menu-secondary-btn:hover {
    transform: translateY(-2px);
}

.menu-stats-row {
    display: grid;
    grid-template-columns: repeat(4, minmax(0,1fr));
    gap: 18px;
    margin-bottom: 22px;
}

.menu-stat-card {
    min-height: 116px;
    padding: 22px;
    border-radius: 24px;
    background: rgba(255,255,255,0.96);
    border: 1px solid #e5eaf3;
    box-shadow: 0 18px 56px rgba(15,23,42,0.07);
    display: flex;
    align-items: center;
    gap: 16px;
}

.menu-stat-icon {
    width: 58px;
    height: 58px;
    border-radius: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 26px;
}

.menu-stat-icon.blue { background: #eaf3ff; }
.menu-stat-icon.green { background: #dcfce7; }
.menu-stat-icon.purple { background: #f3e8ff; }
.menu-stat-icon.orange { background: #fff4d6; }

.menu-stat-card strong {
    display: block;
    font-size: 34px;
    line-height: 1;
    font-weight: 950;
    color: #0f172a;
}

.menu-stat-card span {
    display: block;
    margin-top: 6px;
    color: #64748b;
    font-size: 14px;
    font-weight: 850;
}

.menu-tabs {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    margin-bottom: 22px;
}

.menu-tab {
    min-height: 46px;
    padding: 0 18px;
    border-radius: 999px;
    border: 1px solid #dbe3ef;
    background: white;
    color: #64748b;
    font-size: 14px;
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(15,23,42,0.05);
}

.menu-tab.active,
.menu-tab:hover {
    background: linear-gradient(180deg, #4f9cff, #2677f2);
    color: white;
    border-color: transparent;
}

.menu-workspace {
    display: grid;
    grid-template-columns: 330px 1fr;
    gap: 22px;
    align-items: start;
}

.menu-categories-panel,
.menu-items-panel,
.menu-category-management {
    background: rgba(255,255,255,0.96);
    border: 1px solid #e5eaf3;
    border-radius: 26px;
    padding: 22px;
    box-shadow: 0 18px 56px rgba(15,23,42,0.07);
}

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

.menu-panel-head h2 {
    margin: 0;
    font-size: 24px;
    font-weight: 950;
    color: #0f172a;
}

.menu-panel-head p {
    margin: 6px 0 0;
    color: #64748b;
    font-size: 14px;
    font-weight: 750;
}

.menu-panel-head button {
    width: 44px;
    height: 44px;
    border: none;
    border-radius: 15px;
    background: linear-gradient(180deg, #4f9cff, #2677f2);
    color: white;
    font-size: 24px;
    font-weight: 950;
}

.menu-category-row {
    width: 100%;
    min-height: 76px;
    border: 1px solid #edf2f7;
    background: #ffffff;
    border-radius: 20px;
    padding: 14px;
    margin-bottom: 12px;
    display: grid;
    grid-template-columns: 48px 1fr;
    align-items: center;
    gap: 12px;
    text-align: left;
    transition: 0.18s ease;
}

.menu-category-row:hover,
.menu-category-row.active {
    background: linear-gradient(135deg, #eef6ff, #ffffff);
    border-color: #bfdbfe;
    transform: translateY(-2px);
}

.cat-emoji {
    width: 48px;
    height: 48px;
    border-radius: 16px;
    background: #eef5ff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 22px;
}

.menu-category-row strong {
    display: block;
    color: #0f172a;
    font-size: 15px;
    font-weight: 950;
}

.menu-category-row small {
    display: block;
    margin-top: 4px;
    color: #64748b;
    font-size: 12px;
    font-weight: 800;
}

.menu-items-head {
    align-items: center;
}

.menu-search-wrap input {
    width: 320px;
    max-width: 100%;
    min-height: 50px;
    border-radius: 16px;
    border: 1px solid #dbe3ef;
    background: #f8fbff;
    padding: 0 16px;
    outline: none;
    font-size: 15px;
    font-weight: 800;
    color: #0f172a;
}

.menu-table-wrap {
    overflow-x: auto;
    border-radius: 22px;
    border: 1px solid #e5eaf3;
}

.menu-premium-table {
    width: 100%;
    min-width: 1050px;
    border-collapse: separate;
    border-spacing: 0;
}

.menu-premium-table th {
    background: linear-gradient(90deg, #07152e, #0b1f44, #07152e);
    color: white;
    padding: 18px 14px;
    font-size: 14px;
    font-weight: 950;
    text-align: left;
}

.menu-premium-table td {
    background: white;
    padding: 16px 14px;
    border-bottom: 1px solid #edf2f7;
    vertical-align: middle;
    font-size: 14px;
    font-weight: 800;
    color: #0f172a;
}

.menu-premium-table tr:hover td {
    background: #f8fbff;
}

.menu-product-cell {
    display: grid;
    grid-template-columns: 58px 1fr;
    align-items: center;
    gap: 12px;
}

.menu-product-image {
    width: 58px;
    height: 58px;
    border-radius: 18px;
    overflow: hidden;
    background: linear-gradient(135deg, #eef6ff, #f8fbff);
    border: 1px solid #e5eaf3;
    display: flex;
    align-items: center;
    justify-content: center;
}

.menu-product-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.menu-product-image span {
    font-size: 24px;
}

.menu-product-cell strong {
    display: block;
    font-size: 15px;
    font-weight: 950;
    color: #0f172a;
}

.menu-product-cell small {
    display: block;
    max-width: 340px;
    margin-top: 4px;
    color: #64748b;
    font-size: 12px;
    font-weight: 750;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.menu-category-pill,
.menu-price-pill,
.menu-status-pill,
.menu-order-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 34px;
    padding: 0 12px;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 950;
    white-space: nowrap;
}

.menu-category-pill {
    background: #eef5ff;
    color: #2563eb;
}

.menu-price-pill {
    background: #dcfce7;
    color: #15803d;
}

.menu-status-pill.active {
    background: #dcfce7;
    color: #15803d;
}

.menu-status-pill.inactive {
    background: #fee2e2;
    color: #b91c1c;
}

.menu-order-badge {
    background: #f3e8ff;
    color: #7c3aed;
}

.menu-upsell-mini {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.menu-upsell-mini span {
    display: inline-flex;
    width: fit-content;
    min-height: 26px;
    padding: 0 9px;
    border-radius: 999px;
    background: #fff7d6;
    color: #92400e;
    font-size: 12px;
    font-weight: 900;
}

.menu-upsell-mini em {
    color: #94a3b8;
    font-style: normal;
    font-size: 13px;
    font-weight: 850;
}

.menu-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.menu-actions form {
    margin: 0;
}

.menu-icon-btn {
    width: 42px;
    height: 42px;
    border: none;
    border-radius: 14px;
    color: white;
    font-size: 16px;
    font-weight: 900;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: 0.18s ease;
}

.menu-icon-btn:hover {
    transform: translateY(-2px);
}

.menu-icon-btn.edit {
    background: linear-gradient(180deg, #4f9cff, #2677f2);
}

.menu-icon-btn.view {
    background: linear-gradient(180deg, #22c55e, #16a34a);
}

.menu-icon-btn.delete {
    background: linear-gradient(180deg, #ff6b6b, #ef4444);
}

.menu-table-footer {
    min-height: 54px;
    padding-top: 16px;
    display: flex;
    justify-content: space-between;
    gap: 16px;
    color: #64748b;
    font-size: 14px;
    font-weight: 850;
}

.menu-table-footer strong {
    color: #0f172a;
}

.menu-category-management {
    margin-top: 22px;
}

.menu-category-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0,1fr));
    gap: 16px;
}

.menu-category-card {
    min-height: 112px;
    padding: 18px;
    border-radius: 20px;
    background: #f8fbff;
    border: 1px solid #e5eaf3;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
}

.menu-category-card h3 {
    margin: 0;
    font-size: 18px;
    font-weight: 950;
}

.menu-category-card p {
    margin: 6px 0 0;
    color: #64748b;
    font-size: 13px;
    font-weight: 800;
}

.empty-state {
    padding: 22px;
    border-radius: 18px;
    background: #f8fbff;
    color: #64748b;
    font-weight: 900;
    text-align: center;
}

@media (max-width: 1450px) {
    .menu-stats-row {
        grid-template-columns: repeat(2, minmax(0,1fr));
    }

    .menu-workspace {
        grid-template-columns: 1fr;
    }

    .menu-category-grid {
        grid-template-columns: repeat(2, minmax(0,1fr));
    }
}

@media (max-width: 760px) {
    .menu-hero {
        flex-direction: column;
        align-items: flex-start;
    }

    .menu-hero-actions,
    .menu-primary-btn,
    .menu-secondary-btn {
        width: 100%;
    }

    .menu-stats-row,
    .menu-category-grid {
        grid-template-columns: 1fr;
    }

    .menu-items-head,
    .menu-table-footer {
        flex-direction: column;
        align-items: flex-start;
    }

    .menu-search-wrap,
    .menu-search-wrap input {
        width: 100%;
    }
}

/* ===== SAFE COMPACT VIEW FIX ===== */

.premium-main {
    margin-left: 280px;
    width: calc(100% - 280px);
    padding: 22px 26px 42px;
}

.premium-topbar {
    min-height: 66px;
    margin-bottom: 22px;
}

.menu-hero {
    min-height: 125px;
    padding: 22px;
}

.menu-hero h1 {
    font-size: 27px;
}

.menu-hero p {
    font-size: 15px;
}

.menu-stats-row {
    gap: 14px;
}

.menu-stat-card {
    min-height: 82px;
    padding: 14px;
}

.menu-stat-card strong {
    font-size: 24px;
}

.menu-workspace {
    grid-template-columns: 285px 1fr;
    gap: 18px;
}

.menu-categories-panel,
.menu-items-panel,
.menu-category-management {
    padding: 18px;
}

.menu-premium-table th {
    padding: 10px 10px;
}

.menu-premium-table td {
    padding: 9px 10px;
}

@media (max-width: 1080px) {
    .premium-main {
        margin-left: 0;
        width: 100%;
        padding: 18px 12px;
    }
}

/* ===== MENU PAGINATION ===== */

.menu-pagination-footer {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 16px;
}

.menu-pagination-controls {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

#menuPageNumbers {
    display: flex;
    align-items: center;
    gap: 8px;
}

.menu-pagination-controls button,
.menu-page-btn {
    width: 40px;
    height: 40px;
    border: 1px solid #e5eaf3;
    border-radius: 13px;
    background: #f8fbff;
    color: #64748b;
    font-size: 17px;
    font-weight: 950;
}

.menu-page-btn.active {
    background: linear-gradient(180deg, #4f9cff, #2677f2);
    color: white;
    border-color: transparent;
    box-shadow: 0 10px 22px rgba(37, 99, 235, 0.22);
}

.menu-pagination-controls button:disabled {
    opacity: 0.45;
    cursor: not-allowed;
}

.menu-page-jump {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
}

.menu-page-jump span {
    color: #64748b;
    font-size: 14px;
    font-weight: 900;
}

.menu-page-jump select {
    min-width: 84px;
    min-height: 40px;
    border-radius: 13px;
    border: 1px solid #e5eaf3;
    background: #f8fbff;
    color: #0f172a;
    font-weight: 900;
    padding: 0 12px;
}

@media (max-width: 900px) {
    .menu-pagination-footer {
        grid-template-columns: 1fr;
        text-align: center;
    }

    .menu-page-jump {
        justify-content: center;
    }
}

/* ================= PUBLIC CHATBOT PREMIUM PAGE ================= */

.widget-page {
    min-height: 100vh;
    background: linear-gradient(180deg, #f8fbff 0%, #eef4fb 100%);
    color: #0f172a;
    overflow-x: hidden;
}

.premium-public-page {
    padding: 34px;
}

.public-hero {
    width: min(100%, 1380px);
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr 520px;
    gap: 28px;
    align-items: stretch;
}

.public-hero-card,
.public-preview-card {
    background: rgba(255,255,255,0.96);
    border: 1px solid #e5eaf3;
    border-radius: 30px;
    box-shadow: 0 22px 70px rgba(15,23,42,0.08);
}

.public-hero-card {
    padding: 42px;
}

.demo-badge {
    display: inline-flex;
    min-height: 34px;
    padding: 0 14px;
    align-items: center;
    border-radius: 999px;
    background: #eef5ff;
    color: #2563eb;
    font-size: 13px;
    font-weight: 950;
    margin-bottom: 18px;
}

.public-hero-card h1 {
    margin: 0;
    font-size: 42px;
    line-height: 1.05;
    font-weight: 950;
}

.public-hero-card p {
    max-width: 720px;
    margin: 16px 0 28px;
    color: #64748b;
    font-size: 18px;
    line-height: 1.5;
    font-weight: 750;
}

.demo-feature-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0,1fr));
    gap: 14px;
    margin-bottom: 28px;
}

.demo-feature-grid div {
    min-height: 58px;
    padding: 0 18px;
    border-radius: 18px;
    background: #f8fbff;
    border: 1px solid #e5eaf3;
    display: flex;
    align-items: center;
    color: #0f172a;
    font-size: 16px;
    font-weight: 900;
}

.public-hero-actions {
    display: flex;
    align-items: center;
    gap: 14px;
    flex-wrap: wrap;
}

.public-hero-actions button {
    min-height: 56px;
    padding: 0 24px;
    border: none;
    border-radius: 17px;
    background: linear-gradient(180deg, #4f9cff, #2677f2);
    color: white;
    font-size: 16px;
    font-weight: 950;
    box-shadow: 0 16px 34px rgba(37,99,235,0.26);
}

.public-hero-actions span {
    min-height: 42px;
    padding: 0 16px;
    border-radius: 999px;
    background: #dcfce7;
    color: #15803d;
    display: inline-flex;
    align-items: center;
    font-weight: 950;
}

.public-preview-card {
    padding: 24px;
    display: flex;
    flex-direction: column;
    gap: 18px;
}

.preview-top {
    min-height: 72px;
    padding: 14px;
    border-radius: 22px;
    background: linear-gradient(135deg, #3b5bdb, #1e88ff);
    color: white;
    display: flex;
    align-items: center;
    gap: 14px;
}

.preview-avatar {
    width: 52px;
    height: 52px;
    border-radius: 18px;
    background: rgba(255,255,255,0.16);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 26px;
}

.preview-top strong {
    display: block;
    font-size: 18px;
    font-weight: 950;
}

.preview-top span {
    display: block;
    margin-top: 3px;
    font-size: 13px;
    font-weight: 800;
    opacity: 0.9;
}

.preview-message {
    max-width: 82%;
    padding: 16px 18px;
    border-radius: 22px;
    font-size: 15px;
    line-height: 1.45;
    font-weight: 750;
}

.bot-preview {
    background: #f8fbff;
    border-bottom-left-radius: 7px;
}

.user-preview {
    margin-left: auto;
    background: linear-gradient(180deg, #5b4be8, #3b2fc9);
    color: white;
    border-bottom-right-radius: 7px;
}

/* ================= CHAT WIDGET PREMIUM ================= */

.chat-launcher {
    position: fixed;
    right: 28px;
    bottom: 28px;
    width: 66px;
    height: 66px;
    border: none;
    border-radius: 24px;
    color: white;
    font-size: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 20px 48px rgba(37,99,235,0.34);
    z-index: 8000;
}

.chat-widget {
    position: fixed;
    right: 28px;
    bottom: 28px;
    width: 430px;
    height: 640px;
    max-width: calc(100vw - 32px);
    max-height: calc(100vh - 32px);
    background: white;
    border: 1px solid #e5eaf3;
    border-radius: 28px;
    box-shadow: 0 30px 90px rgba(15,23,42,0.22);
    overflow: hidden;
    display: flex;
    flex-direction: column;
    z-index: 9000;
}

.chat-widget.hidden {
    display: none;
}

.chat-header {
    min-height: 82px;
    padding: 16px 18px;
    color: white;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.chat-header-left {
    display: flex;
    align-items: center;
    gap: 12px;
}

.chat-avatar {
    width: 50px;
    height: 50px;
    border-radius: 17px;
    background: rgba(255,255,255,0.16);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 25px;
}

.chat-title {
    font-size: 16px;
    font-weight: 950;
}

.chat-status {
    margin-top: 3px;
    font-size: 12px;
    font-weight: 850;
    opacity: 0.92;
}

.chat-header-actions {
    display: flex;
    align-items: center;
    gap: 8px;
}

.chat-lang-switch {
    display: flex;
    gap: 5px;
}

.lang-btn,
.icon-btn {
    border: none;
    height: 32px;
    border-radius: 10px;
    background: rgba(255,255,255,0.16);
    color: white;
    font-weight: 950;
}

.lang-btn {
    padding: 0 10px;
}

.lang-btn.active {
    background: white;
    color: #2563eb;
}

.icon-btn {
    width: 34px;
    font-size: 18px;
}

.chat-log {
    flex: 1;
    padding: 18px;
    background: #f8fbff;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.message {
    max-width: 82%;
    padding: 13px 15px;
    border-radius: 20px;
    font-size: 14px;
    line-height: 1.45;
    font-weight: 750;
    box-shadow: 0 10px 24px rgba(15,23,42,0.05);
}

.message.bot {
    align-self: flex-start;
    background: white;
    color: #0f172a;
    border-bottom-left-radius: 7px;
}

.message.user {
    align-self: flex-end;
    background: linear-gradient(180deg, #5b4be8, #3b2fc9);
    color: white;
    border-bottom-right-radius: 7px;
}

.chat-quick-actions {
    padding: 12px 16px 4px;
    background: #f8fbff;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.quick-btn {
    min-height: 38px;
    padding: 0 14px;
    border: 1px solid #e5eaf3;
    border-radius: 999px;
    background: white;
    color: #334155;
    font-size: 13px;
    font-weight: 900;
    box-shadow: 0 8px 20px rgba(15,23,42,0.04);
}

.quick-btn:hover {
    background: #eef5ff;
    color: #2563eb;
}

.chat-input-wrap {
    padding: 14px;
    background: white;
    border-top: 1px solid #e5eaf3;
    display: grid;
    grid-template-columns: 1fr 50px;
    gap: 10px;
    align-items: center;
}

.chat-input-wrap input {
    min-height: 50px;
    border-radius: 17px;
    border: 1px solid #dbe3ef;
    background: #f8fbff;
    padding: 0 16px;
    outline: none;
    font-size: 14px;
    font-weight: 750;
    color: #0f172a;
}

.send-btn {
    width: 50px;
    height: 50px;
    border: none;
    border-radius: 17px;
    background: linear-gradient(180deg, #22c55e, #16a34a);
    color: white;
    font-size: 21px;
    font-weight: 950;
}

.send-btn.disabled {
    opacity: 0.6;
    cursor: not-allowed;
}

.chat-image-wrap {
    margin-top: 10px;
    overflow: hidden;
    border-radius: 18px;
}

.chat-image {
    width: 100%;
    max-height: 190px;
    object-fit: cover;
    display: block;
}

.typing-message {
    display: flex;
    align-items: center;
    gap: 5px;
    width: fit-content;
}

.typing-dot {
    width: 7px;
    height: 7px;
    background: #94a3b8;
    border-radius: 50%;
    display: inline-block;
    animation: typingBounce 1s infinite ease-in-out;
}

.typing-dot:nth-child(2) {
    animation-delay: 0.15s;
}

.typing-dot:nth-child(3) {
    animation-delay: 0.3s;
}

@keyframes typingBounce {
    0%, 80%, 100% {
        transform: translateY(0);
        opacity: 0.45;
    }
    40% {
        transform: translateY(-5px);
        opacity: 1;
    }
}

@media (max-width: 1000px) {
    .premium-public-page {
        padding: 18px;
    }

    .public-hero {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 560px) {
    .public-hero-card {
        padding: 26px;
    }

    .public-hero-card h1 {
        font-size: 31px;
    }

    .demo-feature-grid {
        grid-template-columns: 1fr;
    }

    .chat-widget {
        right: 12px;
        bottom: 12px;
        width: calc(100vw - 24px);
        height: calc(100vh - 24px);
        border-radius: 24px;
    }

    .chat-launcher {
        right: 18px;
        bottom: 18px;
    }
}

/* ================= LANDING PAGE FUTURE SAAS - DARK PREMIUM FINAL ================= */

body.landing-page {
    min-height: 100vh;
    margin: 0;
    background:
        radial-gradient(circle at 18% 12%, rgba(37, 99, 235, 0.38), transparent 28%),
        radial-gradient(circle at 78% 20%, rgba(124, 58, 237, 0.32), transparent 30%),
        linear-gradient(180deg, #020617 0%, #061126 45%, #020617 100%);
    color: #ffffff;
    overflow-x: hidden;
}

/* NAV */

.landing-nav {
    width: min(100% - 36px, 1320px);
    min-height: 76px;
    margin: 18px auto 0;
    padding: 14px 18px;
    border-radius: 24px;
    background: rgba(4, 12, 32, 0.92);
    border: 1px solid rgba(96,165,250,0.28);
    box-shadow: 0 24px 80px rgba(0,0,0,0.38);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    position: sticky;
    top: 14px;
    z-index: 1000;
}

.landing-brand {
    display: flex;
    align-items: center;
    gap: 14px;
}

.landing-brand-icon {
    width: 50px;
    height: 50px;
    border-radius: 14px;
    background: linear-gradient(135deg, #1d4ed8, #38bdf8);
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 30px;
    font-weight: 950;
}

.landing-brand strong {
    display: block;
    color: white;
    font-size: 25px;
    line-height: 1;
    font-weight: 950;
}

.landing-brand span {
    display: block;
    margin-top: 4px;
    color: rgba(255,255,255,0.62);
    font-size: 9px;
    letter-spacing: 2px;
    font-weight: 900;
}

.landing-nav nav {
    display: flex;
    align-items: center;
    gap: 18px;
}

.landing-nav nav a {
    min-height: 42px;
    padding: 0 12px;
    border-radius: 999px;
    color: rgba(255,255,255,0.84);
    display: inline-flex;
    align-items: center;
    font-size: 14px;
    font-weight: 900;
}

.landing-login {
    padding: 0 18px !important;
    border-radius: 14px !important;
    background: linear-gradient(180deg, #3b82f6, #2563eb) !important;
    color: white !important;
}

/* SHARED */

.landing-hero,
.landing-section,
.landing-sales-section,
.landing-demo-section,
.landing-demo-request,
.landing-final-cta,
.landing-footer {
    width: min(100% - 36px, 1320px);
    margin-left: auto;
    margin-right: auto;
}

/* HERO */

.landing-hero {
    width: min(100% - 36px, 1320px);
    min-height: 720px;
    margin: 34px auto 0;
    display: grid;
    grid-template-columns: 0.95fr 1.05fr;
    gap: 42px;
    align-items: center;
}

.landing-badge {
    width: fit-content;
    min-height: 34px;
    padding: 0 14px;
    border-radius: 999px;
    background: rgba(37,99,235,0.18);
    border: 1px solid rgba(96,165,250,0.35);
    color: #bfdbfe;
    display: inline-flex;
    align-items: center;
    font-size: 13px;
    font-weight: 950;
    margin-bottom: 26px;
}

.landing-hero-content h1 {
    margin: 0;
    max-width: 660px;
    color: white;
    font-size: clamp(54px, 5.9vw, 82px);
    line-height: 1.05;
    letter-spacing: -2.8px;
    font-weight: 950;
    text-shadow: 0 10px 40px rgba(0,0,0,0.25);
}

.landing-hero-content h1 span {
    color: #2563ff;
}

.landing-hero-content p {
    max-width: 650px;
    margin: 26px 0 28px;
    color: rgba(255,255,255,0.76);
    font-size: 19px;
    line-height: 1.65;
    font-weight: 750;
}

.landing-actions {
    display: flex;
    align-items: center;
    gap: 18px;
    flex-wrap: wrap;
}

.landing-primary-btn,
.landing-secondary-btn {
    min-height: 62px;
    padding: 0 30px;
    border-radius: 17px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 17px;
    font-weight: 950;
}

.landing-primary-btn {
    background: linear-gradient(135deg, #3b82f6, #4f46e5);
    color: white;
    box-shadow: 0 20px 55px rgba(37,99,235,0.42);
}

.landing-secondary-btn {
    background: rgba(2,6,23,0.75);
    border: 1px solid rgba(147,197,253,0.35);
    color: white;
}

.landing-trust-row {
    margin-top: 28px;
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
}

.landing-trust-row span {
    min-height: 42px;
    padding: 0 16px;
    border-radius: 999px;
    background: rgba(2,6,23,0.62);
    border: 1px solid rgba(96,165,250,0.24);
    color: rgba(255,255,255,0.86);
    display: inline-flex;
    align-items: center;
    font-size: 13px;
    font-weight: 900;
}

.landing-hero-visual {
    position: relative;
    min-height: 980px;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding-top: 80px;
    overflow: visible;
}

.landing-hero-visual::before {
    content: "";
    position: absolute;
    width: 620px;
    height: 620px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(59,130,246,0.28), rgba(79,70,229,0.18) 38%, transparent 72%);
    filter: blur(18px);
    z-index: 0;
}

.landing-hero-visual::after {
    content: "";
    position: absolute;
    width: 540px;
    height: 540px;
    border-radius: 50%;
    border: 1px solid rgba(59,130,246,0.16);
    z-index: 0;
}

.future-card {
    position: relative;
    z-index: 5;
    width: 500px;
    max-width: 100%;
    padding: 26px;
    border-radius: 34px;
    background: linear-gradient(180deg, rgba(5,15,40,0.97), rgba(2,10,28,0.95));
    border: 1px solid rgba(56,189,248,0.65);
    box-shadow: 0 0 35px rgba(37,99,235,0.25), 0 30px 100px rgba(0,0,0,0.62);
    transform: none;
    overflow: visible;
    margin-bottom: 220px;
}

.future-card-head {
    min-height: 82px;
    padding: 16px 18px;
    border-radius: 24px;
    background: linear-gradient(180deg, rgba(10,20,50,0.98), rgba(6,15,35,0.94));
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 22px;
    border: 1px solid rgba(59,130,246,0.12);
}

.future-card-head > span {
    width: 58px;
    height: 58px;
    border-radius: 18px;
    background: linear-gradient(135deg, rgba(37,99,235,0.35), rgba(79,70,229,0.3));
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 27px;
    box-shadow: 0 0 25px rgba(59,130,246,0.4);
}

.future-card-head strong {
    color: white;
    font-size: 21px;
    font-weight: 950;
}

.future-card-head small {
    color: rgba(255,255,255,0.68);
    font-size: 13px;
    font-weight: 800;
}

.landing-chat {
    max-width: 86%;
    padding: 18px 18px;
    border-radius: 22px;
    margin-bottom: 15px;
    font-size: 15px;
    line-height: 1.6;
    font-weight: 800;
}

.landing-chat.bot {
    background: linear-gradient(180deg, rgba(10,20,45,0.96), rgba(6,14,30,0.92));
    border: 1px solid rgba(59,130,246,0.08);
    color: white;
}

.landing-chat.user {
    margin-left: auto;
    background: linear-gradient(135deg, #4f46e5, #9333ea);
    color: white;
    box-shadow: 0 10px 30px rgba(124,58,237,0.35);
}

.landing-mini-buttons {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    margin-top: 14px;
}

.landing-mini-buttons span {
    min-height: 42px;
    padding: 0 18px;
    border-radius: 999px;
    background: rgba(5,15,35,0.95);
    border: 1px solid rgba(96,165,250,0.28);
    color: white;
    display: inline-flex;
    align-items: center;
    font-size: 13px;
    font-weight: 900;
}

.floating-metric {
    position: absolute;
    z-index: 6;
    padding: 22px 24px;
    border-radius: 24px;
    background: linear-gradient(180deg, rgba(4,15,40,0.98), rgba(3,10,28,0.96));
    border: 1px solid rgba(56,189,248,0.7);
    box-shadow: 0 0 40px rgba(37,99,235,0.24), 0 25px 80px rgba(0,0,0,0.5);
}

.floating-metric strong {
    display: block;
    color: #38bdf8;
    font-size: 38px;
    line-height: 1;
    font-weight: 950;
    margin-bottom: 8px;
}

.floating-metric span {
    color: rgba(255,255,255,0.76);
    font-size: 14px;
    line-height: 1.4;
    font-weight: 850;
}

.metric-one {
    top: -16px;
    right: -20px;
}

.metric-two {
    display: none;
}

/* ROBOT */

.ai-robot-orb {
    position: absolute;
    left: 26px;
    top: 265px;
    width: 142px;
    height: 142px;
    border-radius: 50%;
    background: radial-gradient(circle at 35% 30%, #1e90ff, #061126 62%);
    border: 3px solid #22d3ee;
    box-shadow:
        0 0 18px rgba(34,211,238,0.95),
        0 0 60px rgba(37,99,235,0.95),
        0 0 120px rgba(79,70,229,0.65);
    z-index: 4;
    display: flex;
    align-items: center;
    justify-content: center;
}

.ai-robot-orb::before {
    content: "";
    position: absolute;
    inset: -24px;
    border-radius: 50%;
    border: 2px solid rgba(34,211,238,0.35);
}

.ai-robot-orb::after {
    content: "";
    position: absolute;
    inset: -48px;
    border-radius: 50%;
    border: 1px solid rgba(59,130,246,0.18);
}

.ai-robot-face {
    width: 82px;
    height: 58px;
    border-radius: 24px;
    background: #020617;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 10px;
    box-shadow: inset 0 -10px 24px rgba(56,189,248,0.16);
}

.ai-robot-eyes {
    display: flex;
    gap: 20px;
}

.ai-robot-eyes span {
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: #22d3ee;
    box-shadow: 0 0 16px rgba(34,211,238,0.95);
}

.ai-robot-mouth {
    width: 30px;
    height: 10px;
    border-bottom: 3px solid #22d3ee;
    border-radius: 0 0 999px 999px;
}

/* STATS UNDER CHAT */

.hero-stats {
    position: absolute;

    z-index: 4;

    left: 120px;
    right: -40px;

    bottom: -300px;

    min-height: 150px;

    padding: 26px 32px;

    border-radius: 28px;

    background: rgba(4, 12, 32, 0.94);

    border: 1px solid rgba(37,99,235,0.45);

    box-shadow: 0 25px 80px rgba(0,0,0,0.45);

    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
}

.hero-stat {
    display: grid;
    grid-template-columns: 46px 1fr;
    column-gap: 14px;
    align-items: start;
}

.hero-stat b {
    width: 46px;
    height: 46px;
    border-radius: 50%;
    background: radial-gradient(circle, #4338ca, #1e1b4b);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    box-shadow: 0 0 26px rgba(79,70,229,0.65);
}

.hero-stat strong {
    display: block;
    color: white;
    font-size: 32px;
    line-height: 1;
    font-weight: 950;
}

.hero-stat span {
    grid-column: 2;
    margin-top: 12px;
    color: rgba(255,255,255,0.74);
    font-size: 15px;
    line-height: 1.45;
    font-weight: 750;
}

/* SECTION HEAD */

.landing-section,
.landing-sales-section {
    margin-top: 95px;
}

.landing-section-head {
    text-align: center;
    max-width: 780px;
    margin: 0 auto 46px;
}

.landing-section-head span {
    color: #3b82f6;
    font-size: 13px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: 4px;
}

.landing-section-head h2 {
    color: white;
    margin: 14px 0 18px;
    font-size: clamp(42px, 4.6vw, 64px);
    line-height: 1.02;
    font-weight: 950;
    letter-spacing: -2px;
    text-shadow: 0 14px 45px rgba(0,0,0,0.28);
}

.landing-section-head p {
    max-width: 660px;
    margin: 0 auto;
    color: rgba(255,255,255,0.76);
    font-size: 19px;
    line-height: 1.6;
    font-weight: 500;
}

/* FEATURES */

.landing-feature-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 22px;
}

.landing-feature-card,
.landing-sales-card,
.landing-price-card {
    background: rgba(6,17,38,0.82);
    border: 1px solid rgba(96,165,250,0.22);
    border-radius: 24px;
    box-shadow: 0 22px 70px rgba(0,0,0,0.28);
    padding: 28px;
    color: white;
}

.landing-feature-card {
    min-height: 300px;
    padding: 36px;
    border-radius: 24px;
    background:
        radial-gradient(circle at 20% 0%, rgba(37,99,235,0.18), transparent 35%),
        rgba(3, 10, 28, 0.86);
    border: 1px solid rgba(37,99,235,0.55);
    box-shadow:
        inset 0 0 0 1px rgba(255,255,255,0.02),
        0 22px 80px rgba(0,0,0,0.30);
    color: white;
}

.landing-feature-card div,
.sales-icon {
    width: 56px;
    height: 56px;
    border-radius: 16px;
    background: rgba(59,130,246,0.15);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 26px;
    margin-bottom: 18px;
}

.landing-feature-card h3 {
    color: white;
    margin: 0 0 16px;
    font-size: 29px;
    font-weight: 950;
    letter-spacing: -0.6px;
}

.landing-feature-card p {
    max-width: 290px;
    margin: 0;
    color: rgba(255,255,255,0.78);
    font-size: 20px;
    line-height: 1.55;
    font-weight: 400;
}

.landing-feature-card:hover {
    transform: translateY(-4px);
    border-color: rgba(59,130,246,0.9);

    box-shadow:
        0 0 35px rgba(37,99,235,0.18),
        0 28px 90px rgba(0,0,0,0.38);
}

.landing-feature-card .feature-icon {
    width: 72px;
    height: 72px;

    border-radius: 18px;

    margin-bottom: 26px;

    display: flex;
    align-items: center;
    justify-content: center;

    font-size: 34px;

    border: 1px solid rgba(59,130,246,0.45);

    box-shadow:
        0 0 28px rgba(37,99,235,0.22);
}

.feature-icon.blue,
.feature-icon.cyan,
.feature-icon.blue2 {
    background:
        linear-gradient(
            135deg,
            rgba(37,99,235,0.45),
            rgba(14,165,233,0.20)
        );
}

.feature-icon.purple,
.feature-icon.violet {
    background:
        linear-gradient(
            135deg,
            rgba(124,58,237,0.45),
            rgba(59,130,246,0.18)
        );
}

.feature-icon.green {
    background:
        linear-gradient(
            135deg,
            rgba(34,197,94,0.28),
            rgba(37,99,235,0.18)
        );
}

@media (max-width: 980px) {

    .landing-feature-grid {
        grid-template-columns: 1fr;
    }

    .landing-feature-card {
        min-height: auto;
    }
}

/* SALES */

.landing-sales-grid {
    display: grid;
    grid-template-columns: 1.2fr 1fr 1fr;
    gap: 18px;
}

.landing-sales-card.big {
    grid-row: span 2;
    min-height: 440px;
    background:
        radial-gradient(circle at top right, rgba(79,70,229,0.35), transparent 38%),
        linear-gradient(135deg, #061126, #111c55);
}

.landing-sales-card.big h3 {
    font-size: 32px;
}

/* DEMO + FORM */

.landing-demo-section,
landing-demo-request {
    margin-top: 80px;
    padding: 42px;
    border-radius: 30px;
    background:
        radial-gradient(circle at 80% 20%, rgba(37,99,235,0.35), transparent 36%),
        linear-gradient(135deg, #061126, #0b1f44);
    display: grid;
    grid-template-columns: 1fr 340px;
    gap: 32px;
    align-items: center;
    color: white;
}

.landing-demo-request {
    grid-template-columns: 1fr 420px;
}

.landing-demo-section h2,
.landing-demo-request h2 {
    color: white;
    font-size: clamp(34px, 4vw, 52px);
    line-height: 1.05;
    font-weight: 950;
    margin: 0 0 16px;
}

.landing-demo-section p,
.landing-demo-request p {
    color: rgba(255,255,255,0.72);
    font-size: 16px;
    line-height: 1.5;
    font-weight: 700;
}

.phone-message.bot {
    background: rgba(255,255,255,0.08);
    color: white;
}

.phone-message.user {
    margin-left: auto;
    background: linear-gradient(135deg, #3b82f6, #4f46e5);
    color: white;
}

/* PRICING */

.landing-pricing-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
}

.landing-price-card {
    min-height: 340px;
    position: relative;
}

.landing-price-card h3 {
    color: white;
    font-size: 26px;
    font-weight: 950;
}

.landing-price-card strong {
    display: block;
    color: #60a5fa;
    font-size: 17px;
    margin-bottom: 18px;
}

.landing-price-card ul {
    color: rgba(255,255,255,0.78);
    font-weight: 800;
    line-height: 1.9;
}

.popular-pill {
    position: absolute;
    right: 18px;
    top: 18px;
    padding: 7px 12px;
    border-radius: 999px;
    background: #22c55e;
    color: #052e16;
    font-size: 12px;
    font-weight: 950;
}

/* FORM */

.demo-request-benefits {
    margin-top: 20px;
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
}

.demo-request-benefits span {
    color: rgba(255,255,255,0.9);
    font-weight: 900;
}

.demo-request-form {
    padding: 24px;
    border-radius: 24px;
    background: rgba(6,17,38,0.92);
    border: 1px solid rgba(96,165,250,0.25);
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.demo-request-form input,
.demo-request-form select,
.demo-request-form textarea {
    width: 100%;
    min-height: 50px;
    border-radius: 14px;
    border: 1px solid rgba(96,165,250,0.25);
    background: rgba(15,23,42,0.85);
    color: white;
    padding: 0 14px;
    font-weight: 800;
}

.demo-request-form textarea {
    min-height: 105px;
    padding-top: 14px;
}

.demo-request-form button {
    min-height: 54px;
    border: none;
    border-radius: 15px;
    background: linear-gradient(135deg, #3b82f6, #4f46e5);
    color: white;
    font-weight: 950;
}

/* FINAL CTA */

.landing-final-cta {
    max-width: 900px;
    margin-top: 80px;
    padding: 50px;
    border-radius: 28px;
    background: rgba(6,17,38,0.84);
    border: 1px solid rgba(96,165,250,0.22);
    text-align: center;
}

.landing-final-cta h2 {
    color: white;
    font-size: clamp(34px, 4vw, 52px);
    line-height: 1.05;
}

.landing-final-cta p {
    color: rgba(255,255,255,0.68);
}

.landing-actions.center {
    justify-content: center;
}

.landing-footer {
    color: rgba(255,255,255,0.45);
    margin-top: 40px;
    padding-bottom: 30px;
    display: flex;
    justify-content: space-between;
}

/* RESPONSIVE */

@media (max-width: 980px) {
    .landing-hero,
    .landing-demo-section,
    .landing-demo-request {
        grid-template-columns: 1fr;
    }

    .landing-feature-grid,
    .landing-sales-grid,
    .landing-pricing-grid {
        grid-template-columns: 1fr;
    }

    .landing-nav {
        position: relative;
        top: 0;
        flex-direction: column;
        align-items: flex-start;
    }

    .landing-nav nav {
        width: 100%;
        overflow-x: auto;
    }
}

@media (max-width: 560px) {
    .landing-nav,
    .landing-hero,
    .landing-section,
    .landing-sales-section,
    .landing-demo-section,
    .landing-demo-request,
    .landing-final-cta,
    .landing-footer {
        width: min(100% - 24px, 1320px);
    }

    .landing-hero-content h1 {
        font-size: 42px;
        letter-spacing: -1.5px;
    }

    .landing-actions,
    .landing-primary-btn,
    .landing-secondary-btn {
        width: 100%;
    }

    .landing-primary-btn,
    .landing-secondary-btn {
        justify-content: center;
    }

    .floating-metric {
        display: none;
    }

    .landing-footer {
        flex-direction: column;
        text-align: center;
    }
}

/* ===== HERO FORCE FIX - PUT AT VERY END ===== */

body.landing-page .landing-hero {
    width: min(100% - 36px, 1320px) !important;
    min-height: 720px !important;
    margin: 34px auto 0 !important;
    display: grid !important;
    grid-template-columns: 0.9fr 1.1fr !important;
    gap: 40px !important;
    align-items: center !important;
}

body.landing-page .landing-hero-content h1 {
    max-width: 680px !important;
    font-size: clamp(58px, 6vw, 88px) !important;
    line-height: 1.03 !important;
    letter-spacing: -3px !important;
    color: #ffffff !important;
}

body.landing-page .landing-hero-content h1 strong,
body.landing-page .landing-hero-content h1 span {
    color: #2563eb !important;
}

body.landing-page .landing-hero-content p {
    max-width: 660px !important;
    font-size: 19px !important;
    line-height: 1.65 !important;
    color: rgba(255,255,255,0.75) !important;
}

body.landing-page .future-card {
    width: 470px !important;
    transform: rotate(-2deg) translateX(-10px) !important;
}

body.landing-page .landing-hero-visual {
    min-height: 560px !important;
    justify-content: center !important;
}

/* ===== HERO EXACT DARK PREMIUM FIX ===== */

.landing-hero {
    position: relative;
    grid-template-columns: 1fr 0.95fr !important;
    gap: 55px !important;
    min-height: 760px !important;
}

.landing-hero-content h1 span {
    color: #1f6cff !important;
}

.landing-benefit-row {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
    margin: 34px 0 26px;
}

.hero-benefit {
    display: flex;
    align-items: center;
    gap: 14px;
    color: rgba(255,255,255,0.82);
    font-weight: 700;
    line-height: 1.35;
}

.hero-benefit b {
    width: 52px;
    height: 52px;
    border-radius: 16px;
    background: rgba(37,99,235,0.16);
    border: 1px solid rgba(96,165,250,0.22);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #38bdf8;
    font-size: 22px;
}

.robot-orb {
    position: absolute;
    left: 8%;
    top: 42%;
    width: 138px;
    height: 138px;
    border-radius: 50%;
    background: radial-gradient(circle at 40% 35%, #14345f, #020617 65%);
    border: 3px solid #2f7bff;
    box-shadow: 0 0 28px rgba(37,99,235,0.9), 0 0 80px rgba(79,70,229,0.55);
    color: #22d3ee;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    z-index: 1;
    font-size: 24px;
    font-weight: 950;
}

.robot-orb small {
    font-size: 22px;
    color: #67e8f9;
}

.future-card {
    margin-left: 130px !important;
    width: 430px !important;
    z-index: 2;
}

.metric-two {
    display: none !important;
}

.metric-one {
    top: 58px !important;
    right: 0 !important;
    z-index: 3;
}

.hero-stats {
    position: absolute;
    right: 0;
    bottom: 28px;
    width: 640px;
    min-height: 150px;
    padding: 26px 34px;
    border-radius: 24px;
    background: rgba(3, 12, 32, 0.82);
    border: 1px solid rgba(96,165,250,0.22);
    box-shadow: 0 24px 80px rgba(0,0,0,0.30);
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 26px;
}

.hero-stat {
    display: grid;
    grid-template-columns: 42px 1fr;
    column-gap: 14px;
    align-items: start;
}

.hero-stat b {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    background: rgba(79,70,229,0.35);
    display: flex;
    align-items: center;
    justify-content: center;
}

.hero-stat strong {
    color: white;
    font-size: 30px;
    font-weight: 950;
    line-height: 1;
}

.hero-stat span {
    grid-column: 2;
    margin-top: 10px;
    color: rgba(255,255,255,0.68);
    font-size: 14px;
    line-height: 1.45;
    font-weight: 700;
}

@media (max-width: 980px) {
    .landing-hero {
        grid-template-columns: 1fr !important;
    }

    .future-card {
        margin-left: 0 !important;
    }

    .robot-orb,
    .hero-stats {
        position: relative;
        left: auto;
        right: auto;
        top: auto;
        bottom: auto;
        width: 100%;
        margin-top: 24px;
    }

    .landing-benefit-row,
    .hero-stats {
        grid-template-columns: 1fr;
    }
}

/* DEMO SECTION PREMIUM */

.landing-demo-section {
    margin-top: 90px;
    padding: 54px;
    border-radius: 34px;
    background:
        radial-gradient(circle at 75% 20%, rgba(37,99,235,0.22), transparent 34%),
        linear-gradient(135deg, #020617, #061126 55%, #020617);
    display: grid;
    grid-template-columns: 1fr 420px;
    gap: 70px;
    align-items: center;
    color: white;
    border: 1px solid rgba(96,165,250,0.18);
    box-shadow: 0 35px 110px rgba(0,0,0,0.35);
}

.landing-demo-left h2 {
    max-width: 680px;
    margin: 22px 0 18px;
    font-size: clamp(42px, 5vw, 68px);
    line-height: 1.05;
    letter-spacing: -2px;
    font-weight: 950;
    color: white;
}

.landing-demo-left p {
    max-width: 560px;
    margin: 0 0 30px;
    color: rgba(255,255,255,0.72);
    font-size: 24px;
    line-height: 1.45;
    font-weight: 650;
}

.landing-demo-tabs {
    display: flex;
    gap: 18px;
    flex-wrap: wrap;
    margin-bottom: 34px;
}

.demo-tab {
    min-height: 58px;
    padding: 0 26px;
    border-radius: 16px;
    border: 1px solid rgba(96,165,250,0.28);
    background: rgba(2,6,23,0.72);
    color: white;
    display: inline-flex;
    align-items: center;
    font-size: 20px;
    font-weight: 900;
}

.demo-tab.active {
    background: linear-gradient(135deg, #3b82f6, #4f46e5);
    box-shadow: 0 18px 45px rgba(37,99,235,0.35);
}

.demo-chat-card {
    max-width: 620px;
    padding: 30px;
    border-radius: 24px;
    background: rgba(3,10,28,0.78);
    border: 1px solid rgba(37,99,235,0.55);
    box-shadow: 0 28px 90px rgba(0,0,0,0.38);
}

.demo-chat-head {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 22px;
}

.demo-chat-avatar {
    width: 64px;
    height: 64px;
    border-radius: 20px;
    background: rgba(37,99,235,0.24);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 30px;
    border: 1px solid rgba(96,165,250,0.28);
}

.demo-chat-head strong {
    display: block;
    font-size: 26px;
    font-weight: 950;
}

.demo-chat-head span {
    display: block;
    margin-top: 4px;
    color: rgba(255,255,255,0.65);
    font-size: 17px;
}

.demo-chat-message {
    max-width: 82%;
    padding: 16px 20px;
    border-radius: 16px;
    margin-bottom: 14px;
    font-size: 18px;
    line-height: 1.45;
    color: white;
}

.demo-chat-message.bot {
    background: rgba(15,23,42,0.88);
}

.demo-chat-message.user {
    margin-left: auto;
    background: linear-gradient(135deg, #4f46e5, #3b22e8);
}

.demo-product-card {
    width: 55%;
    min-width: 300px;
    margin-top: 10px;
    padding: 16px 18px;
    border-radius: 16px;
    background: rgba(15,23,42,0.86);
    border: 1px solid rgba(96,165,250,0.14);
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.demo-product-card strong {
    display: block;
    font-size: 17px;
}

.demo-product-card span {
    display: block;
    margin-top: 10px;
    color: rgba(255,255,255,0.65);
    font-size: 16px;
}

.demo-product-card b {
    font-size: 42px;
}

.demo-chat-input {
    margin-top: 22px;
    display: grid;
    grid-template-columns: 1fr 54px;
    gap: 14px;
}

.demo-chat-input span {
    min-height: 54px;
    padding: 0 20px;
    border-radius: 14px;
    background: rgba(15,23,42,0.8);
    border: 1px solid rgba(96,165,250,0.18);
    color: rgba(255,255,255,0.45);
    display: flex;
    align-items: center;
    font-size: 17px;
}

.demo-chat-input button {
    border: none;
    border-radius: 14px;
    background: linear-gradient(135deg, #3b82f6, #4f46e5);
    color: white;
    font-size: 24px;
    font-weight: 950;
}

.landing-demo-stats {
    padding: 46px;
    border-radius: 24px;
    background: rgba(3,10,28,0.72);
    border: 1px solid rgba(124,58,237,0.55);
    box-shadow: 0 28px 90px rgba(0,0,0,0.32);
}

.demo-stat-row {
    display: grid;
    grid-template-columns: 70px 1fr;
    gap: 22px;
    align-items: start;
    margin-bottom: 42px;
}

.demo-stat-row b {
    width: 58px;
    height: 58px;
    border-radius: 50%;
    background: linear-gradient(135deg, #4f46e5, #312e81);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
    box-shadow: 0 0 30px rgba(79,70,229,0.55);
}

.demo-stat-row b.green {
    background: linear-gradient(135deg, #22c55e, #047857);
    box-shadow: 0 0 30px rgba(34,197,94,0.45);
}

.demo-stat-row strong {
    display: block;
    font-size: 40px;
    line-height: 1;
    font-weight: 950;
    color: white;
}

.demo-stat-row span {
    display: block;
    margin-top: 12px;
    color: rgba(255,255,255,0.72);
    font-size: 21px;
    line-height: 1.35;
}

.demo-stats-line {
    height: 1px;
    background: rgba(96,165,250,0.24);
    margin: 12px 0 32px;
}

.demo-checks {
    display: flex;
    flex-direction: column;
    gap: 22px;
}

.demo-checks span {
    color: white;
    font-size: 22px;
    font-weight: 700;
}

@media (max-width: 980px) {
    .landing-demo-section {
        grid-template-columns: 1fr;
        padding: 34px;
    }

    .landing-demo-stats {
        padding: 30px;
    }
}

@media (max-width: 560px) {
    .landing-demo-left h2 {
        font-size: 38px;
    }

    .landing-demo-left p {
        font-size: 18px;
    }

    .demo-chat-card,
    .landing-demo-stats {
        padding: 22px;
    }

    .demo-product-card {
        width: 100%;
        min-width: 0;
    }
}

/* ===== SALES SECTION PREMIUM REDESIGN ===== */

body.landing-page .landing-sales-section {
    margin-top: 110px;
    padding: 0 0 20px;
}

body.landing-page .sales-premium-head {
    max-width: 920px;
    margin-bottom: 48px;
}

body.landing-page .sales-premium-head span {
    color: #3b82f6;
    letter-spacing: 6px;
    font-size: 15px;
    font-weight: 950;
}

body.landing-page .sales-premium-head h2 {
    max-width: 950px;
    margin: 18px auto 18px;
    font-size: clamp(46px, 5.4vw, 74px);
    line-height: 1.08;
    letter-spacing: -2.6px;
    color: #ffffff;
    text-shadow: 0 18px 60px rgba(0,0,0,0.42);
}

body.landing-page .sales-premium-head p {
    max-width: 760px;
    font-size: 24px;
    line-height: 1.45;
    color: rgba(255,255,255,0.78);
    font-weight: 500;
}

body.landing-page .premium-sales-grid {
    width: min(100%, 1080px);
    margin: 0 auto;
    display: grid;
    grid-template-columns: 0.9fr 1.25fr;
    grid-template-rows: repeat(3, auto);
    gap: 28px;
}

body.landing-page .landing-sales-card {
    position: relative;
    overflow: hidden;
    border-radius: 28px;
    background:
        radial-gradient(circle at top left, rgba(59,130,246,0.18), transparent 34%),
        linear-gradient(145deg, rgba(3,10,30,0.94), rgba(4,12,36,0.92));
    border: 1px solid rgba(96,165,250,0.34);
    box-shadow:
        inset 0 0 0 1px rgba(255,255,255,0.03),
        0 0 42px rgba(37,99,235,0.12),
        0 30px 90px rgba(0,0,0,0.34);
    transition: 0.22s ease;
}

body.landing-page .landing-sales-card::before {
    content: "";
    position: absolute;
    inset: -1px;
    border-radius: inherit;
    background:
        linear-gradient(135deg, rgba(59,130,246,0.55), transparent 35%, rgba(168,85,247,0.55));
    opacity: 0.32;
    pointer-events: none;
}

body.landing-page .landing-sales-card:hover {
    transform: translateY(-5px);
    border-color: rgba(139,92,246,0.72);
    box-shadow:
        0 0 44px rgba(37,99,235,0.22),
        0 0 70px rgba(124,58,237,0.14),
        0 34px 110px rgba(0,0,0,0.42);
}

body.landing-page .sales-card-large {
    grid-row: 1 / 4;
    min-height: 520px;
    padding: 54px 54px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    background:
        radial-gradient(circle at top left, rgba(59,130,246,0.24), transparent 36%),
        radial-gradient(circle at bottom right, rgba(124,58,237,0.28), transparent 42%),
        linear-gradient(145deg, rgba(4,14,42,0.96), rgba(6,18,54,0.94));
    border-color: rgba(59,130,246,0.72);
}

body.landing-page .premium-sales-card {
    min-height: 210px;
    padding: 42px 52px;
}

body.landing-page .premium-icon {
    width: 72px;
    height: 72px;
    border-radius: 20px;
    margin-bottom: 28px;
    background:
        radial-gradient(circle at 35% 25%, rgba(147,197,253,0.26), transparent 38%),
        linear-gradient(145deg, rgba(37,99,235,0.34), rgba(79,70,229,0.22));
    border: 1px solid rgba(96,165,250,0.38);
    box-shadow:
        inset 0 0 18px rgba(255,255,255,0.04),
        0 0 34px rgba(37,99,235,0.26);
    font-size: 34px;
}

body.landing-page .premium-sales-card .premium-icon {
    width: 64px;
    height: 64px;
    margin-bottom: 20px;
    font-size: 30px;
}

body.landing-page .landing-sales-card h3 {
    position: relative;
    z-index: 2;
    margin: 0 0 20px;
    color: #ffffff;
    font-size: 36px;
    line-height: 1.1;
    letter-spacing: -1px;
    font-weight: 950;
}

body.landing-page .sales-card-large h3 {
    font-size: 54px;
    line-height: 1.08;
}

body.landing-page .landing-sales-card p {
    position: relative;
    z-index: 2;
    max-width: 460px;
    margin: 0;
    color: rgba(255,255,255,0.78);
    font-size: 23px;
    line-height: 1.55;
    font-weight: 500;
}

body.landing-page .premium-sales-card p {
    font-size: 22px;
    line-height: 1.5;
}

@media (max-width: 980px) {
    body.landing-page .premium-sales-grid {
        grid-template-columns: 1fr;
    }

    body.landing-page .sales-card-large {
        grid-row: auto;
        min-height: auto;
    }

    body.landing-page .sales-card-large,
    body.landing-page .premium-sales-card {
        padding: 34px;
    }

    body.landing-page .sales-card-large h3 {
        font-size: 42px;
    }

    body.landing-page .landing-sales-card p,
    body.landing-page .premium-sales-card p {
        font-size: 18px;
    }
}

/* ===== PREMIUM PRICING REDESIGN ===== */

body.landing-page .pricing-premium-section {
    margin-top: 110px;
}

body.landing-page .pricing-premium-head {
    max-width: 980px;
    margin-bottom: 34px;
}

body.landing-page .pricing-premium-head h2 {
    font-size: clamp(48px, 5.2vw, 72px);
    line-height: 1.08;
}

body.landing-page .pricing-offer-row {
    margin-top: 26px;
    display: flex;
    justify-content: center;
    gap: 14px;
    flex-wrap: wrap;
}

body.landing-page .pricing-offer-pill {
    min-height: 58px;
    padding: 0 28px;
    border-radius: 16px;
    background: rgba(3,10,28,0.78);
    border: 1px solid rgba(59,130,246,0.42);
    color: white;
    display: inline-flex;
    align-items: center;
    font-size: 18px;
    font-weight: 950;
    box-shadow: 0 0 34px rgba(37,99,235,0.12);
}

body.landing-page .pricing-offer-pill.purple {
    border-color: rgba(168,85,247,0.48);
    box-shadow: 0 0 34px rgba(168,85,247,0.14);
}

body.landing-page .pricing-premium-grid {
    width: min(100%, 1180px);
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 26px;
}

body.landing-page .pricing-premium-card {
    min-height: 520px;
    padding: 38px 36px 28px;
    border-radius: 26px;
    background:
        radial-gradient(circle at top left, rgba(37,99,235,0.20), transparent 34%),
        linear-gradient(145deg, rgba(3,10,30,0.96), rgba(4,12,36,0.94));
    border: 1px solid rgba(59,130,246,0.58);
    box-shadow:
        0 0 42px rgba(37,99,235,0.16),
        0 28px 90px rgba(0,0,0,0.34);
    display: flex;
    flex-direction: column;
    position: relative;
}

body.landing-page .pricing-premium-card.highlighted {
    border-color: rgba(168,85,247,0.9);
    box-shadow:
        0 0 36px rgba(168,85,247,0.34),
        0 30px 100px rgba(0,0,0,0.42);
}

body.landing-page .pricing-premium-card h3 {
    margin: 0;
    font-size: 35px;
    font-weight: 950;
    color: white;
}

body.landing-page .pricing-premium-card > strong {
    margin: 10px 0 24px;
    color: #3b82f6;
    font-size: 22px;
    font-weight: 850;
}

body.landing-page .pricing-premium-card ul {
    list-style: none;
    padding: 0;
    margin: 0;
    color: white;
}

body.landing-page .pricing-premium-card li {
    position: relative;
    padding-left: 30px;
    margin-bottom: 14px;
    font-size: 18px;
    line-height: 1.35;
    color: rgba(255,255,255,0.9);
}

body.landing-page .pricing-premium-card li::before {
    content: "✓";
    position: absolute;
    left: 0;
    top: 0;
    color: #3b82f6;
    font-weight: 950;
}

body.landing-page .pricing-line {
    height: 1px;
    background: rgba(96,165,250,0.22);
    margin: 24px 0 24px;
}

body.landing-page .price-box {
    text-align: center;
    margin-top: auto;
}

body.landing-page .old-price {
    color: rgba(255,255,255,0.42);
    text-decoration: line-through;
    font-size: 25px;
    font-weight: 900;
    margin-right: 10px;
}

body.landing-page .discount-pill {
    display: inline-flex;
    min-height: 32px;
    padding: 0 13px;
    align-items: center;
    border-radius: 999px;
    background: linear-gradient(135deg, #2563eb, #1d4ed8);
    color: white;
    font-size: 16px;
    font-weight: 950;
}

body.landing-page .price-box > strong {
    display: block;
    margin-top: 8px;
    color: white;
    font-size: 54px;
    line-height: 1;
    font-weight: 950;
    letter-spacing: -1px;
}

body.landing-page .price-box p {
    margin: 8px 0 24px;
    color: #60a5fa;
    font-size: 23px;
    font-weight: 800;
}

body.landing-page .pricing-btn {
    width: 100%;
    min-height: 64px;
    border-radius: 17px;
    background: linear-gradient(180deg, #3b82f6, #1d4ed8);
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
    font-weight: 950;
    box-shadow: 0 20px 45px rgba(37,99,235,0.32);
}

body.landing-page .pricing-btn.purple-btn {
    background: linear-gradient(135deg, #3b82f6, #7c3aed);
}

body.landing-page .trial-note {
    margin-top: 18px;
    text-align: center;
    color: white;
    font-size: 16px;
    font-weight: 850;
}

body.landing-page .pricing-bottom-note {
    width: fit-content;
    max-width: 100%;
    margin: 28px auto 0;
    padding: 18px 34px;
    border-radius: 18px;
    background: rgba(3,10,28,0.72);
    border: 1px solid rgba(96,165,250,0.24);
    color: rgba(255,255,255,0.82);
    font-size: 18px;
    font-weight: 750;
    text-align: center;
}

@media (max-width: 980px) {
    body.landing-page .pricing-premium-grid {
        grid-template-columns: 1fr;
    }

    body.landing-page .pricing-premium-card {
        min-height: auto;
    }
}

/* ===== PRICING FEATURE DROPDOWNS ===== */

body.landing-page .pricing-more-btn {
    width: 100%;
    min-height: 48px;
    margin-top: 18px;
    border-radius: 15px;
    border: 1px solid rgba(96,165,250,0.34);
    background: rgba(3,10,28,0.78);
    color: white;
    font-size: 15px;
    font-weight: 950;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    box-shadow: 0 0 26px rgba(37,99,235,0.12);
    transition: 0.2s ease;
}

body.landing-page .pricing-more-btn:hover {
    transform: translateY(-2px);
    border-color: rgba(96,165,250,0.7);
    box-shadow: 0 0 36px rgba(37,99,235,0.22);
}

body.landing-page .pricing-feature-details-grid {
    width: min(100%, 1180px);
    margin: 18px auto 0;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 22px;
}

body.landing-page .pricing-feature-panel {
    display: none;
    padding: 22px;
    border-radius: 20px;
    background:
        radial-gradient(circle at top left, rgba(37,99,235,0.18), transparent 36%),
        rgba(3,10,28,0.86);
    border: 1px solid rgba(59,130,246,0.42);
    box-shadow: 0 0 34px rgba(37,99,235,0.14);
}

body.landing-page .pricing-feature-panel.open {
    display: block;
    animation: pricingPanelOpen 0.22s ease;
}

@keyframes pricingPanelOpen {
    from {
        opacity: 0;
        transform: translateY(-8px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

body.landing-page .pricing-feature-panel h3 {
    margin: 0 0 16px;
    color: #3b82f6;
    font-size: 18px;
    font-weight: 950;
}

body.landing-page .pricing-feature-panel ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

body.landing-page .pricing-feature-panel li {
    position: relative;
    padding-left: 28px;
    margin-bottom: 10px;
    color: rgba(255,255,255,0.88);
    font-size: 15px;
    font-weight: 800;
}

body.landing-page .pricing-feature-panel li::before {
    content: "✓";
    position: absolute;
    left: 0;
    color: #3b82f6;
    font-weight: 950;
}

body.landing-page .pricing-feature-panel.standard-panel {
    border-color: rgba(168,85,247,0.58);
    box-shadow: 0 0 34px rgba(168,85,247,0.18);
}

body.landing-page .pricing-feature-panel.standard-panel h3,
body.landing-page .pricing-feature-panel.standard-panel li::before {
    color: #a855f7;
}

body.landing-page .pricing-feature-panel.premium-panel {
    border-color: rgba(56,189,248,0.58);
    box-shadow: 0 0 34px rgba(56,189,248,0.16);
}

@media (max-width: 980px) {
    body.landing-page .pricing-feature-details-grid {
        grid-template-columns: 1fr;
    }
}

/* ===== DEMO REQUEST PREMIUM REDESIGN ===== */

body.landing-page .demo-request-premium {
    margin-top: 110px;
    padding: 0;
    min-height: 720px;
    display: grid;
    grid-template-columns: 0.92fr 1.08fr;
    gap: 70px;
    align-items: center;
    background:
        radial-gradient(circle at 24% 72%, rgba(37,99,235,0.20), transparent 30%),
        radial-gradient(circle at 73% 22%, rgba(124,58,237,0.16), transparent 28%);
    border: none;
    box-shadow: none;
}

body.landing-page .demo-request-premium-left {
    position: relative;
}

body.landing-page .demo-request-kicker {
    display: block;
    margin-bottom: 22px;
    color: #3b82f6;
    font-size: 16px;
    font-weight: 950;
    letter-spacing: 6px;
}

body.landing-page .demo-request-premium-left h2 {
    max-width: 640px;
    margin: 0 0 26px;
    color: white;
    font-size: clamp(46px, 5vw, 70px);
    line-height: 1.08;
    letter-spacing: -2px;
    font-weight: 950;
    text-shadow: 0 18px 60px rgba(0,0,0,0.42);
}

body.landing-page .demo-request-premium-left p {
    max-width: 620px;
    margin: 0;
    color: rgba(255,255,255,0.84);
    font-size: 25px;
    line-height: 1.45;
    font-weight: 500;
}

body.landing-page .demo-request-orb-wrap {
    position: relative;
    width: 520px;
    max-width: 100%;
    height: 260px;
    margin-top: 58px;
}

body.landing-page .demo-request-orb-wrap::before,
body.landing-page .demo-request-orb-wrap::after {
    content: "";
    position: absolute;
    inset: 20px 0;
    border-radius: 50%;
    border: 1px solid rgba(59,130,246,0.28);
    transform: rotate(-12deg);
    filter: drop-shadow(0 0 18px rgba(37,99,235,0.55));
}

body.landing-page .demo-request-orb-wrap::after {
    inset: 42px 28px;
    transform: rotate(16deg);
    border-color: rgba(124,58,237,0.34);
}

body.landing-page .demo-request-chat-orb {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 190px;
    height: 140px;
    transform: translate(-50%, -50%);
    border-radius: 44px;
    border: 7px solid rgba(129,185,255,0.98);
    box-shadow:
        0 0 24px rgba(96,165,250,0.95),
        0 0 80px rgba(37,99,235,0.78),
        0 0 130px rgba(124,58,237,0.52);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 18px;
    background:
        radial-gradient(circle at 50% 40%, rgba(96,165,250,0.28), transparent 48%),
        rgba(3,10,28,0.55);
}

body.landing-page .demo-request-chat-orb::after {
    content: "";
    position: absolute;
    left: 42px;
    bottom: -34px;
    width: 44px;
    height: 44px;
    border-left: 7px solid rgba(129,185,255,0.98);
    border-bottom: 7px solid rgba(129,185,255,0.98);
    border-radius: 0 0 0 18px;
    transform: skewX(-18deg);
    filter: drop-shadow(0 0 18px rgba(96,165,250,0.8));
}

body.landing-page .demo-request-chat-orb span {
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: #8bbcff;
    box-shadow: 0 0 22px rgba(147,197,253,0.95);
}

body.landing-page .demo-request-premium-right {
    width: 100%;
}

body.landing-page .premium-demo-form {
    padding: 36px;
    border-radius: 30px;
    background:
        radial-gradient(circle at top left, rgba(37,99,235,0.16), transparent 34%),
        rgba(3,10,28,0.82);
    border: 1px solid rgba(96,165,250,0.32);
    box-shadow:
        inset 0 0 0 1px rgba(255,255,255,0.02),
        0 0 40px rgba(37,99,235,0.12),
        0 30px 95px rgba(0,0,0,0.35);
    gap: 16px;
}

body.landing-page .premium-demo-form input,
body.landing-page .premium-demo-form select,
body.landing-page .premium-demo-form textarea {
    min-height: 68px;
    border-radius: 18px;
    padding: 0 24px;
    background: rgba(15,23,42,0.72);
    border: 1px solid rgba(96,165,250,0.26);
    color: white;
    font-size: 23px;
    font-weight: 500;
    outline: none;
}

body.landing-page .premium-demo-form textarea {
    min-height: 142px;
    padding-top: 22px;
    resize: vertical;
}

body.landing-page .premium-demo-form input::placeholder,
body.landing-page .premium-demo-form textarea::placeholder {
    color: rgba(255,255,255,0.58);
}

body.landing-page .premium-demo-form select {
    color: rgba(255,255,255,0.68);
}

body.landing-page .premium-demo-form input:focus,
body.landing-page .premium-demo-form select:focus,
body.landing-page .premium-demo-form textarea:focus {
    border-color: rgba(96,165,250,0.76);
    box-shadow: 0 0 0 4px rgba(37,99,235,0.16);
}

body.landing-page .premium-demo-form button {
    min-height: 82px;
    margin-top: 8px;
    border-radius: 18px;
    background: linear-gradient(135deg, #3b82f6, #4f46e5, #6d28d9);
    color: white;
    font-size: 32px;
    font-weight: 950;
    box-shadow:
        0 18px 55px rgba(37,99,235,0.34),
        0 0 34px rgba(124,58,237,0.24);
}

body.landing-page .premium-demo-benefits {
    margin-top: 34px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 22px 42px;
}

body.landing-page .premium-demo-benefits span {
    color: rgba(255,255,255,0.92);
    font-size: 23px;
    line-height: 1.3;
    font-weight: 500;
}

@media (max-width: 980px) {
    body.landing-page .demo-request-premium {
        grid-template-columns: 1fr;
        gap: 38px;
        min-height: auto;
    }

    body.landing-page .premium-demo-benefits {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 560px) {
    body.landing-page .demo-request-premium-left h2 {
        font-size: 40px;
    }

    body.landing-page .demo-request-premium-left p,
    body.landing-page .premium-demo-benefits span {
        font-size: 18px;
    }

    body.landing-page .premium-demo-form {
        padding: 22px;
    }

    body.landing-page .premium-demo-form input,
    body.landing-page .premium-demo-form select,
    body.landing-page .premium-demo-form textarea {
        font-size: 17px;
        min-height: 58px;
    }

    body.landing-page .premium-demo-form button {
        min-height: 64px;
        font-size: 24px;
    }
}

/* ===== FINAL CTA PREMIUM REDESIGN ===== */

body.landing-page .final-cta-premium {
    max-width: 980px;
    margin-top: 140px;
    padding: 0 0 30px;
    background: transparent;
    border: none;
    box-shadow: none;
    text-align: center;
    position: relative;
}

body.landing-page .final-check-orb {
    width: 250px;
    height: 250px;
    margin: 0 auto 54px;
    border-radius: 50%;
    border: 10px solid rgba(56,189,248,0.95);
    display: flex;
    align-items: center;
    justify-content: center;
    background:
        radial-gradient(circle at 50% 50%, rgba(37,99,235,0.30), rgba(2,6,23,0.05) 62%);
    box-shadow:
        0 0 28px rgba(56,189,248,0.95),
        0 0 90px rgba(37,99,235,0.82),
        0 0 150px rgba(124,58,237,0.45);
    position: relative;
}

body.landing-page .final-check-orb::before,
body.landing-page .final-check-orb::after {
    content: "";
    position: absolute;
    inset: -78px -170px;
    border-radius: 50%;
    border: 1px solid rgba(59,130,246,0.22);
    transform: rotate(-11deg);
    filter: drop-shadow(0 0 18px rgba(37,99,235,0.45));
}

body.landing-page .final-check-orb::after {
    inset: -48px -135px;
    transform: rotate(17deg);
    border-color: rgba(124,58,237,0.30);
}

body.landing-page .final-check-orb span {
    color: #8bd4ff;
    font-size: 124px;
    line-height: 1;
    font-weight: 950;
    text-shadow:
        0 0 22px rgba(147,197,253,0.9),
        0 0 60px rgba(56,189,248,0.65);
}

body.landing-page .final-cta-premium h2 {
    margin: 0 auto 26px;
    max-width: 820px;
    color: white;
    font-size: clamp(54px, 6vw, 86px);
    line-height: 1.08;
    letter-spacing: -2.8px;
    font-weight: 950;
    text-shadow: 0 18px 60px rgba(0,0,0,0.45);
}

body.landing-page .final-cta-premium p {
    max-width: 720px;
    margin: 0 auto 44px;
    color: rgba(255,255,255,0.72);
    font-size: 28px;
    line-height: 1.45;
    font-weight: 500;
}

body.landing-page .final-cta-actions {
    justify-content: center;
    gap: 34px;
}

body.landing-page .final-primary-btn,
body.landing-page .final-secondary-btn {
    min-width: 250px;
    min-height: 86px;
    border-radius: 20px;
    font-size: 29px;
    font-weight: 850;
}

body.landing-page .final-primary-btn {
    background: linear-gradient(135deg, #3b82f6, #4f46e5, #6d28d9);
    box-shadow:
        0 22px 60px rgba(37,99,235,0.38),
        0 0 32px rgba(124,58,237,0.20);
}

body.landing-page .final-secondary-btn {
    background: rgba(2,6,23,0.62);
    border: 1px solid rgba(96,165,250,0.24);
    color: white;
}

body.landing-page .final-primary-btn:hover,
body.landing-page .final-secondary-btn:hover {
    transform: translateY(-3px);
}

body.landing-page .landing-footer {
    margin-top: 80px;
}

@media (max-width: 760px) {
    body.landing-page .final-check-orb {
        width: 170px;
        height: 170px;
    }

    body.landing-page .final-check-orb span {
        font-size: 86px;
    }

    body.landing-page .final-cta-premium h2 {
        font-size: 42px;
    }

    body.landing-page .final-cta-premium p {
        font-size: 20px;
    }

    body.landing-page .final-cta-actions {
        gap: 14px;
    }

    body.landing-page .final-primary-btn,
    body.landing-page .final-secondary-btn {
        width: 100%;
        min-width: 0;
        min-height: 66px;
        font-size: 22px;
    }
}

/* ===== PREMIUM DARK CHAT WIDGET ===== */

.premium-chat-widget {
    width: 500px;
    height: 720px;
    max-width: calc(100vw - 24px);
    max-height: calc(100vh - 24px);

    background:
        radial-gradient(circle at top, rgba(37,99,235,0.22), transparent 38%),
        linear-gradient(180deg,#061026 0%,#020817 100%);

    border:1px solid rgba(96,165,250,.28);
    border-radius:28px;

    box-shadow:
        0 0 0 1px rgba(37,99,235,.10),
        0 0 35px rgba(37,99,235,.15),
        0 30px 90px rgba(0,0,0,.45);

    color:white;
}

.premium-chat-header {
    min-height: 88px;
    padding: 18px 20px;
    background:
        radial-gradient(circle at top left, rgba(59,130,246,0.28), transparent 38%),
        linear-gradient(135deg, rgba(3,10,28,0.98), rgba(6,18,48,0.94)) !important;
    border-bottom: 1px solid rgba(59,130,246,0.28);
}

.chat-brand-block {
    display: flex;
    align-items: center;
    gap: 16px;
    padding-right: 22px;
    border-right: 1px solid rgba(148,163,184,0.22);
}

.mini-reservy-logo {
    width: 46px;
    height: 46px;
    border-radius: 14px;
    background: linear-gradient(135deg, #3b82f6, #1d4ed8);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 26px;
    font-weight: 950;
    color: white;
    box-shadow: 0 0 28px rgba(37,99,235,0.55);
}

.mini-reservy-text strong {
    display: block;
    font-size: 18px;
    line-height: 1;
    color: white;
    font-weight: 950;
}

.mini-reservy-text span {
    display: block;
    margin-top: 8px;
    color: rgba(255,255,255,0.62);
    font-size: 10px;
    letter-spacing: 3px;
    font-weight: 900;
}

.chat-business-block {
    flex: 1;
    min-width: 0;
}

.premium-chat-header .chat-title {
    font-size: 16px;
    font-weight: 950;
    color: white;
}

.premium-chat-header .chat-status {
    margin-top: 6px;
    font-size: 15px;
    color: rgba(255,255,255,0.68);
    font-weight: 800;
}

.premium-chat-header .chat-status::first-letter {
    color: #22c55e;
}

.premium-chat-header .chat-header-actions {
    gap: 12px;
}

.premium-chat-header .lang-btn,
.premium-chat-header .icon-btn {
    width: 52px;
    height: 52px;
    border-radius: 16px;
    background: rgba(15,23,42,0.72);
    border: 1px solid rgba(96,165,250,0.22);
    color: rgba(255,255,255,0.55);
    font-size: 18px;
    font-weight: 950;
    box-shadow: inset 0 0 28px rgba(37,99,235,0.08);
}

.premium-chat-header .lang-btn.active {
    color: white;
    background: linear-gradient(135deg, rgba(37,99,235,0.9), rgba(30,64,175,0.9));
    border-color: rgba(96,165,250,0.9);
    box-shadow:
        0 0 28px rgba(37,99,235,0.5),
        inset 0 0 20px rgba(255,255,255,0.08);
}

.premium-chat-log {
    padding: 34px 30px;
    background:
        radial-gradient(circle at center, rgba(37,99,235,0.08), transparent 55%),
        transparent;
}

.premium-chat-widget .message {
    max-width: 72%;
    padding: 20px 24px;
    border-radius: 22px;
    font-size: 19px;
    line-height: 1.45;
    font-weight: 750;
    box-shadow: none;
}

.premium-chat-widget .message.bot {
    background: rgba(15,23,42,0.58);
    border: 1px solid rgba(96,165,250,0.20);
    color: white;
    border-bottom-left-radius: 22px;
    box-shadow: 0 0 35px rgba(37,99,235,0.10);
}

.premium-chat-widget .message.user {
    background: linear-gradient(135deg, #2563eb, #6d28d9);
    color: white;
    border-bottom-right-radius: 22px;
    box-shadow: 0 18px 45px rgba(37,99,235,0.28);
}

.premium-chat-actions {
    padding: 18px 30px 10px;
    background: transparent;
    gap: 18px;
}

.premium-chat-actions .quick-btn {
    min-height: 68px;
    padding: 0 28px;
    border-radius: 22px;
    background: rgba(15,23,42,0.52);
    border: 1px solid rgba(96,165,250,0.22);
    color: white;
    font-size: 18px;
    font-weight: 850;
    box-shadow: inset 0 0 30px rgba(37,99,235,0.06);
}

.premium-chat-actions .quick-btn:hover {
    background: rgba(37,99,235,0.20);
    border-color: rgba(96,165,250,0.55);
    color: white;
}

.premium-chat-input-wrap {
    margin: 16px 30px 0;
    padding: 0;
    background: rgba(15,23,42,0.50);
    border: 1px solid rgba(96,165,250,0.28);
    border-radius: 24px;
    display: grid;
    grid-template-columns: 1fr 78px;
    gap: 14px;
    align-items: center;
    box-shadow:
        0 0 28px rgba(37,99,235,0.18),
        inset 0 0 30px rgba(37,99,235,0.06);
}

.premium-chat-input-wrap input {
    min-height: 86px;
    background: transparent;
    border: none;
    color: white;
    padding: 0 28px;
    font-size: 19px;
    font-weight: 750;
}

.premium-chat-input-wrap input::placeholder {
    color: rgba(255,255,255,0.48);
}

.premium-send-btn {
    width: 70px;
    height: 70px;
    border-radius: 20px;
    background: linear-gradient(135deg, #2563eb, #7c3aed);
    font-size: 32px;
    box-shadow:
        0 0 28px rgba(37,99,235,0.55),
        inset 0 0 20px rgba(255,255,255,0.10);
}

.premium-chat-footer {
    height: 66px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    color: rgba(255,255,255,0.35);
    font-size: 20px;
    font-weight: 900;
}

.footer-r {
    width: 24px;
    height: 24px;
    border-radius: 6px;
    background: linear-gradient(135deg, #3b82f6, #1d4ed8);
    color: white;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 15px;
    font-weight: 950;
}

@media (max-width: 760px) {
    .premium-chat-widget {
        right: 10px;
        bottom: 10px;
        width: calc(100vw - 20px);
        height: calc(100vh - 20px);
        border-radius: 24px;
    }

    .premium-chat-header {
        padding: 18px;
        min-height: 104px;
    }

    .chat-brand-block {
        display: none;
    }

    .premium-chat-header .chat-title {
        font-size: 20px;
    }

    .premium-chat-header .lang-btn,
    .premium-chat-header .icon-btn {
        width: 54px;
        height: 54px;
    }

    .premium-chat-widget .message {
        font-size: 16px;
        max-width: 86%;
    }

    .premium-chat-actions .quick-btn {
        min-height: 52px;
        font-size: 15px;
    }

    .premium-chat-input-wrap {
        margin: 12px 18px 0;
        grid-template-columns: 1fr 60px;
    }

    .premium-chat-input-wrap input {
        min-height: 68px;
        font-size: 16px;
    }

    .premium-send-btn {
        width: 56px;
        height: 56px;
        font-size: 25px;
    }
}

/* ===== COMPACT PREMIUM CHAT WIDGET FIX ===== */

.premium-chat-widget.chat-widget {
    width: 430px !important;
    height: 640px !important;
    right: 28px !important;
    bottom: 28px !important;
    border-radius: 28px !important;
}

.premium-chat-header {
    min-height: 82px !important;
    padding: 14px 16px !important;
    gap: 10px !important;
}

.chat-brand-block {
    gap: 10px !important;
}

.mini-reservy-logo {
    width: 42px !important;
    height: 42px !important;
    border-radius: 14px !important;
    font-size: 24px !important;
}

.mini-reservy-text strong {
    font-size: 18px !important;
}

.mini-reservy-text span {
    font-size: 9px !important;
    letter-spacing: 2px !important;
}

.chat-business-block {
    max-width: 130px !important;
}

.premium-chat-header .chat-title {
    font-size: 15px !important;
    line-height: 1.15 !important;
}

.premium-chat-header .chat-status {
    font-size: 12px !important;
}

.premium-chat-header .lang-btn,
.premium-chat-header .icon-btn {
    width: 44px !important;
    height: 44px !important;
    border-radius: 14px !important;
    font-size: 15px !important;
}

.premium-chat-log {
    padding: 16px !important;
}

.premium-chat-actions {
    padding: 10px 14px 4px !important;
    gap: 8px !important;
}

.premium-chat-actions .quick-btn {
    min-height: 38px !important;
    padding: 0 14px !important;
    font-size: 13px !important;
}

.premium-chat-input-wrap {
    padding: 12px 14px !important;
    grid-template-columns: 1fr 50px !important;
}

.premium-send-btn {
    width: 50px !important;
    height: 50px !important;
}

.premium-chat-footer {
    padding-bottom: 10px !important;
}

/* ===== SIZE FIX ===== */

.premium-chat-widget.chat-widget{
    width:430px !important;
    height:640px !important;
    right:25px !important;
    bottom:25px !important;
}

.premium-chat-header{
    min-height:75px !important;
    padding:12px 14px !important;
}

.chat-brand-block{
    gap:8px !important;
}

.mini-reservy-logo{
    width:38px !important;
    height:38px !important;
    font-size:22px !important;
}

.mini-reservy-text strong{
    font-size:14px !important;
}

.mini-reservy-text span{
    font-size:7px !important;
    letter-spacing:1px !important;
}

.chat-business-block{
    max-width:90px !important;
}

.premium-chat-header .chat-title{
    font-size:12px !important;
    line-height:1.1 !important;
}

.premium-chat-header .chat-status{
    font-size:10px !important;
}

.premium-chat-header .lang-btn,
.premium-chat-header .icon-btn{
    width:36px !important;
    height:36px !important;
    font-size:13px !important;
}

.premium-chat-log{
    padding:12px !important;
}

.premium-chat-widget .message{
    padding:12px 14px !important;
    font-size:14px !important;
    max-width:82% !important;
}

.premium-chat-actions{
    padding:8px 12px 2px !important;
    gap:6px !important;
}

.premium-chat-actions .quick-btn{
    min-height:34px !important;
    padding:0 12px !important;
    font-size:12px !important;
}

.premium-chat-input-wrap{
    margin:8px 12px 0 !important;
    grid-template-columns:1fr 46px !important;
}

.premium-chat-input-wrap input{
    min-height:48px !important;
    font-size:14px !important;
}

.premium-send-btn{
    width:46px !important;
    height:46px !important;
    font-size:20px !important;
}

.premium-chat-footer{
    height:34px !important;
    font-size:13px !important;
}

/* ===== PASSWORD REQUESTS CLEAN FINAL ===== */

.password-requests-page .premium-table-card {
    overflow: hidden;
}

.password-requests-page .premium-table-wrap {
    width: 100%;
    overflow-x: auto !important;
    overflow-y: hidden;
    border-radius: 24px;
}

.password-requests-page .premium-table {
    min-width: 1420px;
    width: 1420px;
    table-layout: fixed;
}

.password-requests-page .premium-table th,
.password-requests-page .premium-table td {
    padding: 18px 10px;
    text-align: center;
    vertical-align: middle;
    white-space: normal;
    word-break: break-word;
    font-size: 15px;
}

.password-requests-page .premium-table th {
    font-size: 16px;
}

.password-requests-page .premium-table th:nth-child(1),
.password-requests-page .premium-table td:nth-child(1) {
    width: 55px;
}

.password-requests-page .premium-table th:nth-child(2),
.password-requests-page .premium-table td:nth-child(2) {
    width: 110px;
}

.password-requests-page .premium-table th:nth-child(3),
.password-requests-page .premium-table td:nth-child(3) {
    width: 145px;
}

.password-requests-page .premium-table th:nth-child(4),
.password-requests-page .premium-table td:nth-child(4) {
    width: 230px;
}

.password-requests-page .premium-table th:nth-child(5),
.password-requests-page .premium-table td:nth-child(5) {
    width: 150px;
}

.password-requests-page .premium-table th:nth-child(6),
.password-requests-page .premium-table td:nth-child(6) {
    width: 150px;
}

.password-requests-page .premium-table th:nth-child(7),
.password-requests-page .premium-table td:nth-child(7) {
    width: 110px;
}

.password-requests-page .premium-table th:nth-child(8),
.password-requests-page .premium-table td:nth-child(8),
.password-requests-page .premium-table th:nth-child(9),
.password-requests-page .premium-table td:nth-child(9) {
    width: 125px;
    font-size: 14px;
}

.password-requests-page .premium-table th:nth-child(10),
.password-requests-page .premium-table td:nth-child(10) {
    width: 190px;
}

.password-requests-page .premium-row-actions {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    flex-wrap: nowrap;
}

.password-requests-page .premium-row-actions form {
    margin: 0;
}

.password-requests-page .premium-row-actions button {
    width: 44px;
    height: 44px;
    min-width: 44px;
    border-radius: 14px;
}

.password-requests-page .people-badge {
    min-width: 120px;
    height: 44px;
    font-size: 15px;
    padding: 0 12px;
}

/* ===== DEMO REQUESTS CRM ===== */

.demo-requests-page .premium-table-card {
    overflow: hidden;
}

.demo-requests-page .premium-table-wrap {
    width: 100%;
    overflow-x: auto !important;
    overflow-y: hidden;
    border-radius: 24px;
}

.demo-requests-page .premium-table {
    min-width: 1750px;
    width: 1750px;
    table-layout: fixed;
}

.demo-requests-page .premium-table th,
.demo-requests-page .premium-table td {
    padding: 17px 10px;
    text-align: center;
    vertical-align: middle;
    white-space: normal;
    word-break: break-word;
    font-size: 14px;
}

.demo-requests-page .premium-table th {
    font-size: 15px;
}

.demo-requests-page .premium-row-actions {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    flex-wrap: nowrap;
}

.demo-requests-page .premium-row-actions form {
    margin: 0;
}

.demo-requests-page .premium-row-actions button,
.demo-requests-page .premium-row-actions a {
    width: 44px;
    height: 44px;
    min-width: 44px;
    border-radius: 14px;
    border: none;
    background: linear-gradient(180deg, #4f9cff, #2677f2);
    color: white;
    font-size: 19px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
}

.demo-requests-page .premium-row-actions button.delete {
    background: linear-gradient(180deg, #ff6666, #ef4444);
}

.crm-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 38px;
    min-width: 110px;
    padding: 0 12px;
    border-radius: 999px;
    color: white;
    font-size: 14px;
    font-weight: 900;
}

.crm-new {
    background: linear-gradient(180deg, #8b5cf6, #6d28d9);
}

.priority-high {
    background: linear-gradient(180deg, #ef4444, #dc2626);
}

.priority-normal {
    background: linear-gradient(180deg, #8b5cf6, #6d28d9);
}

.crm-contacted {
    background: linear-gradient(180deg, #3b82f6, #2563eb);
}

.crm-demo {
    background: linear-gradient(180deg, #f59e0b, #d97706);
}

.crm-negotiation {
    background: linear-gradient(180deg, #f97316, #ea580c);
}

.crm-client {
    background: linear-gradient(180deg, #22c55e, #16a34a);
}

.crm-rejected {
    background: linear-gradient(180deg, #ef4444, #dc2626);
}

.priority-low {
    background: linear-gradient(180deg, #22c55e, #16a34a);
}

.demo-form-success{
    background: rgba(34,197,94,0.15);
    border: 1px solid rgba(34,197,94,0.4);
    color: #86efac;
    padding: 16px 18px;
    border-radius: 16px;
    margin-bottom: 18px;
    font-weight: 700;
    font-size: 15px;
}

.demo-form-error{
    background: rgba(239,68,68,0.15);
    border: 1px solid rgba(239,68,68,0.4);
    color: #fca5a5;
    padding: 16px 18px;
    border-radius: 16px;
    margin-bottom: 18px;
    font-weight: 700;
    font-size: 15px;
}

/* ===== BLACKLIST PREMIUM PAGE ===== */

.blacklist-page .premium-table-card {
    overflow: hidden;
}

.blacklist-stats-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 22px;
    margin-bottom: 24px;
}

.blacklist-search {
    max-width: 360px;
}

.blacklist-page .premium-table {
    min-width: 1050px;
    table-layout: fixed;
}

.blacklist-page .premium-table th,
.blacklist-page .premium-table td {
    padding: 18px 12px;
    vertical-align: middle;
}

.blacklist-page .premium-table th:nth-child(1),
.blacklist-page .premium-table td:nth-child(1) {
    width: 70px;
}

.blacklist-page .premium-table th:nth-child(2),
.blacklist-page .premium-table td:nth-child(2) {
    width: 170px;
}

.blacklist-page .premium-table th:nth-child(3),
.blacklist-page .premium-table td:nth-child(3) {
    width: 300px;
}

.blacklist-page .premium-table th:nth-child(4),
.blacklist-page .premium-table td:nth-child(4) {
    width: 150px;
}

.blacklist-page .premium-table th:nth-child(5),
.blacklist-page .premium-table td:nth-child(5) {
    width: 160px;
}

.blacklist-page .premium-table th:nth-child(6),
.blacklist-page .premium-table td:nth-child(6) {
    width: 180px;
}

.blacklist-page .premium-table th:nth-child(7),
.blacklist-page .premium-table td:nth-child(7) {
    width: 190px;
}

.blacklist-actions {
    align-items: center;
    flex-wrap: nowrap;
}

.blacklist-actions form {
    margin: 0;
}

.blacklist-actions button {
    width: 46px;
    height: 44px;
    min-width: 46px;
}

.blacklist-actions .delete {
    background: linear-gradient(180deg, #ff6666, #ef4444);
}

.status-red {
    background: #fee2e2;
    color: #b91c1c;
}

.status-green {
    background: #dcfce7;
    color: #15803d;
}

.stat-icon.red {
    background: linear-gradient(135deg, #ef4444, #dc2626);
    color: white;
}

@media (max-width: 900px) {
    .blacklist-stats-grid {
        grid-template-columns: 1fr;
    }

    .blacklist-search {
        max-width: 100%;
        width: 100%;
    }
}

.mobile-sidebar-toggle{
    display:none;
}

.sidebar-overlay{
    display:none;
}

@media (max-width: 1080px){

    .mobile-sidebar-toggle{
        position:fixed;
        top:16px;
        left:16px;

        width:54px;
        height:54px;

        border:none;
        border-radius:18px;

        background:linear-gradient(135deg,#7c3aed,#2563eb);
        color:white;

        font-size:28px;
        font-weight:900;

        display:flex;
        align-items:center;
        justify-content:center;

        z-index:99999;

        box-shadow:0 18px 45px rgba(37,99,235,.35);
    }

    .sidebar-overlay{
        position:fixed;
        inset:0;

        background:rgba(2,6,23,.58);
        backdrop-filter:blur(4px);

        opacity:0;
        visibility:hidden;

        transition:.2s ease;

        z-index:9990;
    }

    .sidebar-overlay.show{
        opacity:1;
        visibility:visible;
        display:block;
    }

    .premium-sidebar{
        position:fixed !important;

        left:-320px;
        top:0;

        width:290px;
        height:100vh;

        transition:.25s ease;

        z-index:9999;
    }

    .premium-sidebar.mobile-open{
        left:0;
    }

    .premium-main{
        width:100% !important;
        margin-left:0 !important;

        padding-top:88px !important;
    }

    .premium-topbar{
        flex-direction:column;
        align-items:flex-start;

        gap:16px;

        padding:18px;
    }

    .premium-page-head{
        flex-direction:column;
        align-items:flex-start;
        gap:16px;
    }

    .premium-actions{
        width:100%;
        display:flex;
        flex-wrap:wrap;
        gap:10px;
    }

    .premium-actions a,
    .premium-actions button{
        flex:1;
    }

    .premium-stats-grid{
        grid-template-columns:1fr !important;
    }

    .premium-analytics-grid{
        grid-template-columns:1fr !important;
    }

    .dashboard-bar-chart{
        overflow-x:auto;
        padding-bottom:12px;
    }

    .today-booking-row{
        flex-direction:column;
        align-items:flex-start;
        gap:10px;
    }

    .premium-table-wrap{
        overflow-x:auto !important;
    }

    .premium-table{
        min-width:900px;
    }

    .premium-modal,
    .modal-content{
        width:100%;
        max-width:100%;
        padding:20px;
        border-radius:24px;
    }

    .reservation-edit-grid{
        grid-template-columns:1fr !important;
    }

    .settings-form-grid{
        grid-template-columns:1fr !important;
    }

    .topbar-right-stack{
        width:100%;
    }

    .topbar-actions-row{
        width:100%;
        justify-content:space-between;
    }

    .topbar-business{
        width:100%;
    }
}

@media (max-width: 700px){

    .premium-main{
        padding:84px 10px 30px !important;
    }

    .premium-table-card{
        padding:16px;
        border-radius:22px;
    }

    .premium-topbar{
        border-radius:20px;
    }

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

    .premium-stat-card strong{
        font-size:34px;
    }

    .premium-nav-link{
        min-height:56px;
        font-size:16px;
    }

    .brand-box{
        margin-top:36px;
    }
}

/* =========================
   RESPONSIVE MOBILE/TABLET
   ========================= */

   .mobile-sidebar-toggle{
    display:none;
    position:fixed;
    top:16px;
    left:16px;
    width:52px;
    height:52px;
    border:none;
    border-radius:16px;
    z-index:10000;

    background:linear-gradient(
        135deg,
        #7c3aed,
        #2677f2
    );

    color:white;
    font-size:24px;
    cursor:pointer;

    box-shadow:0 15px 35px rgba(37,99,235,.3);
}

@media (max-width:1080px){

    .app-layout{
        display:block !important;
    }

    .mobile-sidebar-toggle{
        display:flex !important;
    }

    .premium-sidebar{
        position:fixed !important;
        top:0;
        left:-320px;
        width:290px !important;
        height:100vh !important;
        transition:.25s ease;
        z-index:9999;
    }

    .premium-sidebar.mobile-open{
        left:0;
    }

    .sidebar-overlay{
        position:fixed;
        inset:0;
        background:rgba(2,6,23,.6);
        opacity:0;
        visibility:hidden;
        transition:.25s ease;
        z-index:9990;
    }

    .sidebar-overlay.show{
        opacity:1;
        visibility:visible;
    }

    .premium-main{
        width:100% !important;
        margin-left:0 !important;
        padding:90px 16px 32px !important;
    }

    .premium-topbar,
    .settings-topbar{
        flex-direction:column;
        align-items:flex-start;
        gap:15px;
        padding:18px;
    }

    .topbar-business,
    .topbar-right-stack,
    .topbar-actions-row{
        width:100%;
    }

    .topbar-actions-row{
        justify-content:space-between;
    }

    .premium-page-head,
    .menu-hero,
    .settings-hero,
    .premium-section-head,
    .menu-panel-head{
        display:flex !important;
        flex-direction:column;
        align-items:flex-start;
        gap:16px;
    }

    .premium-actions,
    .menu-hero-actions,
    .settings-action-row{
        width:100%;
        display:flex;
        flex-wrap:wrap;
        gap:10px;
    }

    .premium-actions a,
    .premium-actions button,
    .menu-hero-actions button,
    .settings-main-save{
        flex:1;
        width:100%;
    }

    .premium-stats-grid,
    .premium-analytics-grid,
    .menu-stats-row,
    .settings-nav-cards{
        grid-template-columns:repeat(2,1fr) !important;
    }

    .settings-dashboard-grid,
    .menu-workspace,
    .settings-preview-layout{
        grid-template-columns:1fr !important;
    }

    .menu-categories-panel{
        width:100%;
    }

    .menu-tabs{
        overflow-x:auto;
        flex-wrap:nowrap;
        padding-bottom:8px;
    }

    .menu-tab{
        white-space:nowrap;
        min-width:max-content;
    }

    .premium-table-wrap,
    .menu-table-wrap{
        overflow-x:auto !important;
        width:100%;
    }

    .premium-table,
    .menu-premium-table{
        min-width:900px;
    }

    .users-modern-table{
        min-width:900px;
    }

    .today-booking-row{
        grid-template-columns:1fr !important;
        align-items:flex-start;
        gap:10px;
    }

    .settings-form-grid,
    .reservation-edit-grid{
        grid-template-columns:1fr !important;
    }

    .modal{
        padding:16px;
        align-items:flex-start;
        overflow-y:auto;
    }

    .modal-content,
    .premium-modal,
    .business-modal,
    .menu-item-modal{
        width:100% !important;
        max-width:100% !important;
        max-height:none !important;
        border-radius:24px;
        padding:22px;
        margin-top:20px;
    }

    .modal-actions{
        width:100%;
        flex-direction:column-reverse;
        align-items:stretch;
    }

    .modal-actions button{
        width:100%;
    }
}

@media (max-width:700px){

    .premium-main{
        padding:84px 10px 22px !important;
    }

    .premium-stats-grid,
    .premium-analytics-grid,
    .menu-stats-row,
    .settings-nav-cards{
        grid-template-columns:1fr !important;
    }

    .premium-table-card,
    .settings-panel,
    .menu-categories-panel,
    .menu-items-panel,
    .menu-category-management,
    .settings-preview-premium{
        padding:16px !important;
        border-radius:22px !important;
    }

    .premium-topbar,
    .settings-topbar{
        border-radius:20px;
    }

    .premium-page-head h1,
    .settings-hero h1,
    .menu-hero h1{
        font-size:28px !important;
        line-height:1.1;
    }

    .premium-section-head h2,
    .settings-panel-head h2,
    .menu-panel-head h2{
        font-size:22px !important;
    }

    .premium-actions{
        flex-direction:column;
    }

    .premium-actions a,
    .premium-actions button{
        width:100%;
        min-height:50px;
    }

    .premium-table,
    .menu-premium-table,
    .users-modern-table{
        min-width:820px;
    }

    .menu-product-cell{
        min-width:260px;
    }

    .menu-table-footer,
    .menu-pagination-footer{
        flex-direction:column;
        align-items:flex-start;
        gap:12px;
    }

    .menu-pagination-controls{
        width:100%;
        overflow-x:auto;
    }

    .settings-nav-card{
        min-height:auto;
    }

    .settings-preview-layout{
        gap:16px;
    }

    .mini-chat-preview{
        width:100%;
    }

    .notification-wrapper{
        position:relative;
    }

    .notifications-panel{
        right:auto !important;
        left:0 !important;
        width:calc(100vw - 32px) !important;
        max-width:none !important;
    }
}

/* =========================
   LANDING MOBILE FIX
   ========================= */

@media (max-width: 700px) {

    .landing-page {
        overflow-x: hidden;
    }

    .landing-nav {
        width: calc(100% - 24px);
        margin: 14px auto 0;
        padding: 14px;
        border-radius: 22px;
        flex-direction: column;
        align-items: flex-start;
        gap: 14px;
    }

    .landing-brand {
        width: 100%;
    }

    .landing-brand-icon {
        width: 48px;
        height: 48px;
        font-size: 28px;
    }

    .landing-brand strong {
        font-size: 24px;
    }

    .landing-brand span {
        font-size: 10px;
        letter-spacing: 2px;
    }

    .landing-nav nav {
        width: 100%;
        display: flex;
        overflow-x: auto;
        gap: 10px;
        padding-bottom: 4px;
    }

    .landing-nav nav a {
        min-width: max-content;
        font-size: 13px;
        padding: 10px 14px;
    }

    .landing-login {
        min-width: 74px !important;
    }

    .landing-hero {
        grid-template-columns: 1fr !important;
        padding: 30px 18px 40px !important;
        gap: 34px;
        overflow: hidden;
    }

    .landing-hero-content {
        max-width: 100%;
    }

    .landing-badge {
        font-size: 13px;
        padding: 9px 13px;
    }

    .landing-hero h1 {
        font-size: clamp(44px, 13vw, 58px) !important;
        line-height: 0.98 !important;
        letter-spacing: -2px;
        max-width: 100%;
    }

    .landing-hero h1 span {
        display: block;
        font-size: 56px;
    }

    .landing-hero p {
        font-size: 17px !important;
        line-height: 1.55;
        max-width: 100%;
    }

    .landing-benefit-row {
        grid-template-columns: 1fr !important;
        gap: 12px;
    }

    .hero-benefit {
        width: 100%;
        justify-content: flex-start;
    }

    .landing-actions {
        flex-direction: column;
        width: 100%;
        gap: 12px;
    }

    .landing-primary-btn,
    .landing-secondary-btn {
        width: 100%;
        justify-content: center;
        min-height: 58px;
        font-size: 17px;
    }

    .landing-trust-row {
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
    }

    .landing-hero-visual {
        width: 100%;
        min-height: auto;
        display: flex;
        flex-direction: column;
        align-items: center;
        overflow: visible;
    }

    .main-chat-card {
        width: 100% !important;
        max-width: 340px !important;
        min-height: auto !important;
        transform: none !important;
        margin: 0 auto;
        padding: 22px !important;
    }

    .ai-robot-orb {
        position: relative !important;
        left: auto !important;
        right: auto !important;
        top: auto !important;
        bottom: auto !important;
        margin: 0 auto -40px;
        width: 150px !important;
        height: 150px !important;
        z-index: 3;
    }

    .future-card-head strong {
        font-size: 19px;
    }

    .landing-chat {
        font-size: 14px !important;
        line-height: 1.45;
        padding: 16px !important;
    }

    .landing-mini-buttons {
        flex-wrap: wrap;
        gap: 8px;
    }

    .landing-mini-buttons span {
        font-size: 13px;
        padding: 10px 14px;
    }

    .floating-metric {
        display: none !important;
    }

    .hero-stats {
        width: 100% !important;
        max-width: 340px !important;
        margin: 24px auto 0;
        position: static !important;
        grid-template-columns: 1fr !important;
        padding: 22px !important;
        border-radius: 24px;
    }

    .hero-stat {
        display: flex;
        align-items: center;
        gap: 16px;
    }

    .hero-stat strong {
        font-size: 28px;
    }

    .hero-stat span {
        font-size: 13px;
    }
}

/* ===== RESERVY LANDING REAL MOBILE FIX ===== */

@media (max-width: 700px) {

    html,
    body,
    .landing-page {
        width: 100%;
        max-width: 100%;
        overflow-x: hidden !important;
    }

    .landing-page * {
        box-sizing: border-box;
    }

    .landing-nav {
        width: calc(100% - 28px) !important;
        max-width: calc(100% - 28px) !important;
        margin: 14px auto !important;
        padding: 16px !important;
        border-radius: 24px !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 16px !important;
    }

    .landing-brand {
        width: 100% !important;
        display: flex !important;
        align-items: center !important;
    }

    .landing-nav nav {
        width: 100% !important;
        display: flex !important;
        gap: 8px !important;
        overflow-x: auto !important;
        padding-bottom: 4px !important;
        white-space: nowrap !important;
    }

    .landing-nav nav a {
        flex: 0 0 auto !important;
        font-size: 13px !important;
        padding: 10px 14px !important;
        border-radius: 14px !important;
    }

    .landing-hero {
        width: 100% !important;
        max-width: 100% !important;
        display: flex !important;
        flex-direction: column !important;
        padding: 32px 20px 48px !important;
        gap: 36px !important;
        overflow: hidden !important;
    }

    .landing-hero-content,
    .landing-hero-visual {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }

    .landing-badge {
        max-width: 100% !important;
        white-space: normal !important;
        font-size: 13px !important;
        line-height: 1.35 !important;
    }

    .landing-hero h1 {
        width: 100% !important;
        max-width: 100% !important;
        font-size: 46px !important;
        line-height: 0.98 !important;
        letter-spacing: -2px !important;
        overflow-wrap: break-word !important;
        word-break: normal !important;
    }

    .landing-hero h1 span {
        display: block !important;
        font-size: 52px !important;
    }

    .landing-hero p {
        width: 100% !important;
        max-width: 100% !important;
        font-size: 17px !important;
        line-height: 1.55 !important;
    }

    .landing-benefit-row {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 12px !important;
        width: 100% !important;
    }

    .hero-benefit {
        width: 100% !important;
    }

    .landing-actions {
        width: 100% !important;
        display: flex !important;
        flex-direction: column !important;
        gap: 12px !important;
    }

    .landing-primary-btn,
    .landing-secondary-btn {
        width: 100% !important;
        max-width: 100% !important;
        min-height: 58px !important;
        justify-content: center !important;
        font-size: 17px !important;
    }

    .landing-trust-row {
        width: 100% !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 10px !important;
    }

    .landing-hero-visual {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        gap: 20px !important;
        overflow: visible !important;
    }

    .main-chat-card {
        position: relative !important;
        width: 100% !important;
        max-width: 340px !important;
        min-width: 0 !important;
        transform: none !important;
        margin: 0 auto !important;
        left: auto !important;
        right: auto !important;
    }

    .ai-robot-orb {
        position: relative !important;
        width: 140px !important;
        height: 140px !important;
        left: auto !important;
        right: auto !important;
        top: auto !important;
        bottom: auto !important;
        margin: 0 auto -45px !important;
        z-index: 5 !important;
    }

    .floating-metric {
        display: none !important;
    }

    .hero-stats {
        position: relative !important;
        width: 100% !important;
        max-width: 340px !important;
        left: auto !important;
        right: auto !important;
        top: auto !important;
        bottom: auto !important;
        margin: 20px auto 0 !important;
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 16px !important;
    }

    .landing-section,
    .landing-sales-section,
    .landing-demo-section,
    .pricing-premium-section,
    .landing-demo-request,
    .landing-final-cta {
        width: 100% !important;
        max-width: 100% !important;
        padding-left: 20px !important;
        padding-right: 20px !important;
        overflow: hidden !important;
    }

    .landing-section-head h2,
    .sales-premium-head h2,
    .pricing-premium-head h2,
    .landing-demo-request h2,
    .landing-final-cta h2 {
        font-size: 38px !important;
        line-height: 1.05 !important;
        letter-spacing: -1px !important;
        max-width: 100% !important;
    }

    .landing-section-head p,
    .sales-premium-head p,
    .pricing-premium-head p,
    .landing-demo-request p,
    .landing-final-cta p {
        font-size: 17px !important;
        line-height: 1.55 !important;
        max-width: 100% !important;
    }

    .landing-feature-grid,
    .landing-sales-grid,
    .landing-pricing-grid,
    .pricing-feature-details-grid {
        display: grid !important;
        grid-template-columns: 1fr !important;
        width: 100% !important;
        max-width: 100% !important;
        gap: 18px !important;
    }

    .landing-feature-card,
    .landing-sales-card,
    .landing-price-card,
    .pricing-feature-panel {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }

    .landing-demo-section,
    .landing-demo-request {
        display: flex !important;
        flex-direction: column !important;
        gap: 28px !important;
    }

    .landing-demo-stats,
    .demo-request-premium-right,
    .demo-request-premium-left,
    .premium-demo-form {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }

    .premium-demo-form input,
    .premium-demo-form select,
    .premium-demo-form textarea,
    .premium-demo-form button {
        width: 100% !important;
        max-width: 100% !important;
    }
}

/* ===== FINAL FIX: LANDING HERO PHONE ===== */

@media (max-width: 700px) {

    body.landing-page {
        overflow-x: hidden !important;
    }

    body.landing-page .landing-hero {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        padding: 28px 22px 42px !important;
        overflow: hidden !important;
    }

    body.landing-page .landing-hero-content {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        display: block !important;
    }

    body.landing-page .landing-badge {
        width: fit-content !important;
        max-width: 100% !important;
        white-space: normal !important;
        font-size: 13px !important;
        line-height: 1.3 !important;
        padding: 10px 14px !important;
    }

    body.landing-page .landing-hero h1 {
        width: 100% !important;
        max-width: 100% !important;
        font-size: 42px !important;
        line-height: 1.02 !important;
        letter-spacing: -1.4px !important;
        white-space: normal !important;
        word-break: keep-all !important;
        overflow-wrap: normal !important;
        margin-top: 28px !important;
    }

    body.landing-page .landing-hero h1 span {
        display: inline !important;
        font-size: inherit !important;
    }

    body.landing-page .landing-hero p {
        width: 100% !important;
        max-width: 100% !important;
        font-size: 16px !important;
        line-height: 1.55 !important;
    }

    body.landing-page .landing-hero-visual {
        position: relative !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        margin-top: 38px !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        overflow: visible !important;
    }

    body.landing-page .main-chat-card {
        position: relative !important;
        left: auto !important;
        right: auto !important;
        top: auto !important;
        width: 100% !important;
        max-width: 330px !important;
        min-width: 0 !important;
        transform: none !important;
        margin: 0 auto !important;
    }

    body.landing-page .ai-robot-orb {
        position: relative !important;
        left: auto !important;
        right: auto !important;
        top: auto !important;
        bottom: auto !important;
        width: 135px !important;
        height: 135px !important;
        margin: 0 auto -42px !important;
        z-index: 5 !important;
    }

    body.landing-page .hero-stats {
        position: relative !important;
        width: 100% !important;
        max-width: 330px !important;
        margin: 22px auto 0 !important;
        left: auto !important;
        right: auto !important;
        top: auto !important;
        bottom: auto !important;
    }
}

/* ===== TABLET FIX: LANDING HERO ===== */

@media (min-width: 701px) and (max-width: 1080px) {

    body.landing-page {
        overflow-x: hidden !important;
    }

    body.landing-page .landing-nav {
        width: calc(100% - 48px) !important;
        max-width: calc(100% - 48px) !important;
        margin: 20px auto !important;
        padding: 18px 22px !important;
    }

    body.landing-page .landing-hero {
        display: flex !important;
        flex-direction: column !important;
        width: 100% !important;
        max-width: 100% !important;
        padding: 48px 44px 70px !important;
        gap: 42px !important;
        overflow: hidden !important;
    }

    body.landing-page .landing-hero-content,
    body.landing-page .landing-hero-visual {
        width: 100% !important;
        max-width: 100% !important;
    }

    body.landing-page .landing-hero h1 {
        max-width: 760px !important;
        font-size: 74px !important;
        line-height: 0.98 !important;
        letter-spacing: -3px !important;
    }

    body.landing-page .landing-hero p {
        max-width: 680px !important;
        font-size: 21px !important;
        line-height: 1.55 !important;
    }

    body.landing-page .landing-benefit-row {
        display: grid !important;
        grid-template-columns: repeat(3, 1fr) !important;
        gap: 16px !important;
        max-width: 760px !important;
    }

    body.landing-page .landing-actions {
        max-width: 760px !important;
    }

    body.landing-page .landing-hero-visual {
        display: grid !important;
        grid-template-columns: 1fr 1fr !important;
        align-items: center !important;
        gap: 28px !important;
    }

    body.landing-page .main-chat-card {
        position: relative !important;
        width: 100% !important;
        max-width: 390px !important;
        transform: none !important;
        margin: 0 auto !important;
        left: auto !important;
        right: auto !important;
        top: auto !important;
    }

    body.landing-page .ai-robot-orb {
        position: absolute !important;
        width: 160px !important;
        height: 160px !important;
        left: 50% !important;
        top: 35px !important;
        transform: translateX(-50%) !important;
        z-index: 5 !important;
    }

    body.landing-page .hero-stats {
        position: relative !important;
        width: 100% !important;
        max-width: 390px !important;
        margin: 0 auto !important;
        left: auto !important;
        right: auto !important;
        top: auto !important;
        bottom: auto !important;
    }

    body.landing-page .landing-section,
    body.landing-page .landing-sales-section,
    body.landing-page .landing-demo-section,
    body.landing-page .pricing-premium-section,
    body.landing-page .landing-demo-request,
    body.landing-page .landing-final-cta {
        padding-left: 44px !important;
        padding-right: 44px !important;
        overflow: hidden !important;
    }
}

/* ===== LOGIN RESPONSIVE FIX ===== */

@media (max-width: 1080px) {
    body.login-page-premium {
        min-height: 100vh;
        overflow-x: hidden;
    }

    .login-shell {
        width: calc(100% - 32px) !important;
        max-width: 720px !important;
        min-height: auto !important;
        margin: 24px auto !important;
        display: flex !important;
        flex-direction: column !important;
        border-radius: 28px !important;
        overflow: hidden !important;
    }

    .login-left,
    .login-right {
        width: 100% !important;
        min-height: auto !important;
    }

    .login-left {
        padding: 48px 34px !important;
    }

    .login-left-content {
        max-width: 100% !important;
    }

    .login-left h1 {
        font-size: 42px !important;
        line-height: 1.02 !important;
    }

    .login-left p {
        font-size: 17px !important;
        max-width: 100% !important;
    }

    .login-feature-row {
        display: grid !important;
        grid-template-columns: repeat(3, 1fr) !important;
        gap: 14px !important;
    }

    .login-right {
        padding: 34px !important;
        display: flex !important;
        justify-content: center !important;
    }

    .login-card-premium {
        width: 100% !important;
        max-width: 460px !important;
        margin: 0 auto !important;
    }
}

@media (max-width: 700px) {
    .login-shell {
        width: calc(100% - 24px) !important;
        margin: 14px auto !important;
        border-radius: 24px !important;
    }

    .login-left {
        padding: 34px 22px !important;
    }

    .login-left h1 {
        font-size: 34px !important;
    }

    .login-feature-row {
        grid-template-columns: 1fr !important;
    }

    .login-right {
        padding: 24px 18px 28px !important;
    }

    .login-card-premium {
        padding: 26px 20px !important;
        border-radius: 24px !important;
    }

    .login-logo {
        justify-content: center !important;
        text-align: center !important;
    }

    .login-options {
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 10px !important;
    }
}

/* ===== LOGIN CARD FINAL FIX ===== */

@media (max-width:1080px){

    .login-card-premium{
        height:auto !important;
        min-height:auto !important;
        overflow:visible !important;

        padding:40px !important;

        display:flex !important;
        flex-direction:column !important;
        justify-content:flex-start !important;
    }

    .login-form-premium{
        width:100% !important;
        display:flex !important;
        flex-direction:column !important;
    }

    .login-input-wrap{
        width:100% !important;
    }

    .login-submit{
        width:100% !important;
    }
}

@media (max-width:700px){

    .login-card-premium{
        padding:28px 20px !important;
    }

    .login-logo{
        margin-bottom:18px !important;
    }

    .login-logo-text{
        font-size:42px !important;
    }

}

/* ===== LOGIN TABLET/PHONE HARD FIX ===== */

@media (max-width:1080px){

    .login-page-premium,
    .login-shell,
    .login-left,
    .login-right,
    .login-card-premium{
        height:auto !important;
        min-height:auto !important;
        max-height:none !important;
        overflow:visible !important;
    }

    .login-shell{
        display:flex !important;
        flex-direction:column !important;
        align-items:center !important;
        justify-content:flex-start !important;
        padding:36px 24px !important;
    }

    .login-right{
        position:relative !important;
        width:100% !important;
        padding:28px 0 40px !important;
        display:flex !important;
        align-items:center !important;
        justify-content:center !important;
    }

    .login-card-premium{
        position:relative !important;
        top:auto !important;
        left:auto !important;
        right:auto !important;
        bottom:auto !important;
        transform:none !important;

        width:100% !important;
        max-width:440px !important;
        padding:36px 34px !important;
        margin:0 auto !important;
    }
}

@media (max-width:700px){

    .login-shell{
        width:calc(100% - 24px) !important;
        padding:24px 14px !important;
    }

    .login-card-premium{
        max-width:100% !important;
        padding:28px 20px !important;
    }
}

/* ===== LOGIN PHONE FINAL FIX ===== */

@media (max-width: 700px) {

    body.login-page-premium {
        min-height: 100vh !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
    }

    .login-shell {
        width: 100% !important;
        max-width: 100% !important;
        min-height: 100vh !important;
        margin: 0 !important;
        padding: 18px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: flex-start !important;
        flex-direction: column !important;
        border-radius: 0 !important;
        overflow: visible !important;
    }

    .login-left {
    display: block !important;
    width: 100% !important;
    padding: 20px 16px 8px !important;
    background: transparent !important;
    min-height: auto !important;
}

.login-left-content {
    max-width: 360px !important;
    margin: 0 auto !important;
    text-align: center !important;
}

.login-left h1 {
    font-size: 28px !important;
    line-height: 1.05 !important;
    margin-bottom: 10px !important;
}

.login-left p {
    font-size: 14px !important;
    line-height: 1.4 !important;
    margin-bottom: 16px !important;
}

.login-feature-row {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 8px !important;
}

.login-feature-icon {
    width: 42px !important;
    height: 42px !important;
    font-size: 20px !important;
}

.login-feature span {
    font-size: 10px !important;
    line-height: 1.2 !important;
}

    .login-right {
        width: 100% !important;
        min-height: auto !important;
        padding: 0 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }

    .login-card-premium {
        width: 100% !important;
        max-width: 360px !important;
        margin: 0 auto !important;
        padding: 34px 22px !important;
        border-radius: 28px !important;
        height: auto !important;
        min-height: auto !important;
        max-height: none !important;
        overflow: visible !important;
    }

    .login-logo {
        justify-content: center !important;
        text-align: center !important;
        margin-bottom: 18px !important;
    }

    .login-logo-mark {
        width: 64px !important;
        height: 64px !important;
        font-size: 42px !important;
    }

    .login-logo-text {
        font-size: 38px !important;
        line-height: 1 !important;
    }

    .login-logo-sub {
        font-size: 10px !important;
        letter-spacing: 4px !important;
    }

    .login-card-premium h2 {
        text-align: center !important;
        font-size: 28px !important;
        line-height: 1.15 !important;
    }

    .login-subtitle {
        text-align: center !important;
        font-size: 15px !important;
        margin-bottom: 22px !important;
    }

    .login-input-wrap {
        width: 100% !important;
        min-height: 56px !important;
        border-radius: 16px !important;
    }

    .login-input-wrap input {
        font-size: 15px !important;
    }

    .login-options {
        display: flex !important;
        flex-direction: row !important;
        justify-content: space-between !important;
        align-items: center !important;
        gap: 10px !important;
        font-size: 13px !important;
    }

    .login-submit {
        width: 100% !important;
        min-height: 58px !important;
        border-radius: 17px !important;
        font-size: 18px !important;
    }
}