/* خط احترافي */
@import url('https://fonts.googleapis.com/css2?family=Tajawal:wght@300;400;500;700&display=swap');

/* إعدادات عامة */
* {
    box-sizing: border-box;
}

html, body {
    margin: 0;
    padding: 0;
    font-family: 'Fira Sans', sans-serif;
    background: linear-gradient(135deg, #8ec5fc 0%, #e0c3fc 100%);
    color: #333;
    overflow-x: hidden;
}

/* الهيدر */
.header {
    background: linear-gradient(135deg, #8ec5fc 0%, #e0c3fc 100%);
    padding: 20px 0;
    text-align: center;
    color: #fff;
    box-shadow: 0 4px 15px #6a11cb4D;
}

.header h1 {
    margin: 0;
    font-size: 28px;
    font-weight: 700;
}

/* الفوتر */
.footer {
    background: linear-gradient(135deg, #8ec5fc 0%, #e0c3fc 100%);
    text-align: center;
    padding: 25px;
    color: #fff;
    font-size: 14px;
    margin-top: auto;
}

/* ============================= */
/*      صفحة حجز الانتظار        */
/* ============================= */

.waiting-page .container {
    width: 90%;
    max-width: 520px;
    margin: 40px auto;
    background: #fff;
    padding: 35px;
    border-radius: 20px;
    box-shadow: 0 10px 40px #6a11cb4D;
    border: 2px solid #6a11cb;
}

.waiting-page .form-group {
    margin-bottom: 20px;
}

.waiting-page label {
    display: block;
    margin-bottom: 8px;
    color: #6a11cb;
    font-weight: 600;
    font-size: 15px;
}

.waiting-page input,
.waiting-page select,
.booking-page select {
    width: 100%;
    padding: 13px;
    border: 2px solid #2575fc33;
    border-radius: 10px;
    margin-bottom: 18px;
    font-size: 15px;
    background: #f8f9ff;
    transition: 0.3s;
}

.waiting-page input:focus,
.waiting-page select:focus,
.booking-page select:focus {
    border-color: #6a11cb;
    background: #fff;
    box-shadow: 0 0 10px rgba(102, 126, 234, 0.2);
}

.waiting-page button {
    width: 100%;
    padding: 15px;
    border-radius: 12px;
    border: none;
    background: linear-gradient(135deg, #8ec5fc 0%, #e0c3fc 100%);
    color: #fff;
    cursor: pointer;
    font-size: 16px;
    font-weight: 600;
    transition: 0.3s;
}

.waiting-page button:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(102, 126, 234, 0.6);
}

.waiting-page .success-message {
    background: linear-gradient(135deg, #8ec5fc 0%, #e0c3fc 100%);
    color: #fff;
    padding: 40px;
    border-radius: 20px;
    text-align: center;
    display: none;
}

.waiting-page .success-message.show {
    display: block;
}

.waiting-page .waiting-number {
    font-size: 60px;
    font-weight: 900;
    margin: 20px 0;
}

.waiting-page .waiting-info {
    font-size: 16px;
    margin: 20px 0;
    opacity: 0.9;
}

.waiting-page .back-btn {
    display: inline-block;
    margin-top: 20px;
    padding: 12px 30px;
    background: rgba(255, 255, 255, 0.2);
    color: #fff;
    text-decoration: none;
    border-radius: 8px;
    border: 2px solid #fff;
    transition: 0.3s;
}

.waiting-page .back-btn:hover {
    background: rgba(255, 255, 255, 0.3);
}

/* ============================= */
/*      صفحة قائمة الطعام        */
/* ============================= */

.menu-page .container {
    width: 95%;
    max-width: 900px;
    margin: 30px auto;
    background: #fff;
    padding: 25px;
    border-radius: 20px;
    box-shadow: 0 10px 40px rgba(0,0,0,0.1);
}

.menu-page .menu-section h3 {
    font-size: 22px;
    font-weight: 700;
    color: #6a11cb;
    text-align: center;
    padding-bottom: 10px;
    border-bottom: 2px solid #eee;
    margin-bottom: 25px;
}

.menu-page .menu-items {
    list-style: none;
    padding: 0;
    margin: 0;
}

.menu-page .menu-item {
    display: grid;
    grid-template-columns: 110px auto 90px;
    gap: 15px;
    background: #fafaff;
    padding: 20px;
    border-radius: 15px;
    border: 2px solid #2575fc33;
    margin-bottom: 20px;
    align-items: center;
}

.menu-page .menu-item-image {
    width: 110px;
    height: 110px;
    border-radius: 12px;
    overflow: hidden;
    background: #2575fc33;
    display: flex;
    align-items: center;
    justify-content: center;
}

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

.menu-page .menu-item-info {
    display: flex;
    flex-direction: column;
}

.menu-page .menu-item-name {
    font-size: 18px;
    font-weight: 700;
    color: #333;
    margin-bottom: 5px;
}

.menu-page .menu-item-description {
    font-size: 14px;
    color: #666;
    line-height: 1.6;
}

.menu-page .menu-item-price {
    font-size: 20px;
    font-weight: 900;
    color: #6a11cb;
    text-align: end;
    white-space: nowrap;
}

@media (max-width: 768px) {
    .menu-page .menu-item {
        grid-template-columns: 80px auto 70px;
        padding: 15px;
    }

    .menu-page .menu-item-image {
        width: 80px;
        height: 80px;
    }

    .menu-page .menu-item-name {
        font-size: 16px;
    }

    .menu-page .menu-item-price {
        font-size: 16px;
    }
}

/* ============================= */
/*      صفحة حجز الموعد          */
/* ============================= */

.booking-page .container {
    width: 90%;
    max-width: 520px;
    margin: 40px auto;
    background: #fff;
    padding: 35px;
    border-radius: 20px;
    box-shadow: 0 10px 40px #6a11cb4D;
    border: 2px solid #6a11cb;
}

.booking-page .form-group {
    margin-bottom: 20px;
}

.booking-page label {
    display: block;
    margin-bottom: 8px;
    color: #6a11cb;
    font-weight: 600;
    font-size: 15px;
}

.booking-page input,
.booking-page select {
    width: 100%;
    padding: 13px;
    border: 2px solid #2575fc33;
    border-radius: 10px;
    margin-bottom: 18px;
    font-size: 15px;
    background: #f8f9ff;
    transition: 0.3s;
}

.booking-page input:focus,
.booking-page select:focus {
    border-color: #6a11cb;
    background: #fff;
    box-shadow: 0 0 10px rgba(102, 126, 234, 0.2);
}

.booking-page button {
    width: 100%;
    padding: 15px;
    border-radius: 12px;
    border: none;
    background: linear-gradient(135deg, #8ec5fc 0%, #e0c3fc 100%);
    color: #fff;
    cursor: pointer;
    font-size: 16px;
    font-weight: 600;
    transition: 0.3s;
}

.booking-page button:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(102, 126, 234, 0.6);
}

.booking-page .success-message {
    background: linear-gradient(135deg, #8ec5fc 0%, #e0c3fc 100%);
    color: #fff;
    padding: 40px;
    border-radius: 20px;
    text-align: center;
    display: none;
}

.booking-page .success-message.show {
    display: block;
}

.booking-page .reservation-code {
    font-size: 40px;
    font-weight: 900;
    margin: 20px 0;
    text-align: center;
    word-wrap: break-word;
    overflow-wrap: break-word;
    max-width: 100%;
    display: block;
}

@media (max-width: 480px) {
    .booking-page .reservation-code {
        font-size: 32px;
    }
}

.booking-page .reservation-info {
    font-size: 16px;
    margin: 20px 0;
    opacity: 0.9;
}

.booking-page .back-btn {
    display: inline-block;
    margin-top: 20px;
    padding: 12px 30px;
    background: rgba(255, 255, 255, 0.2);
    color: #fff;
    text-decoration: none;
    border-radius: 8px;
    border: 2px solid #fff;
    transition: 0.3s;
}

.booking-page .back-btn:hover {
    background: rgba(255, 255, 255, 0.3);
}

/* ============================= */
/*      صفحة التحقق من الحجز     */
/* ============================= */

.check-page .container {
    width: 90%;
    max-width: 520px;
    margin: 40px auto;
    background: #fff;
    padding: 30px;
    border-radius: 20px;
    box-shadow: 0 10px 40px #6a11cb4D;
    border: 2px solid #6a11cb;
}

.check-page h2 {
    text-align: center;
    color: #6a11cb;
    font-size: 24px;
    margin-bottom: 25px;
    font-weight: 700;
}

.check-page .msg {
    background: #2575fc33;
    padding: 15px;
    border-radius: 12px;
    margin-bottom: 20px;
    border-right: 5px solid #6a11cb;
    color: #6a11cb;
    font-size: 15px;
    font-weight: 500;
}

.check-page .box {
    background: #fafaff;
    padding: 20px;
    border-radius: 15px;
    border: 2px solid #2575fc33;
    margin-bottom: 20px;
    box-shadow: 0 4px 15px rgba(102, 126, 234, 0.1);
}

.check-page .box h3 {
    margin-bottom: 15px;
    color: #6a11cb;
    font-size: 20px;
    font-weight: 700;
}

.check-page .highlight {
    font-weight: 700;
    font-size: 18px;
    color: #6a11cb;
}

.check-page .highlight-big {
    font-weight: 900;
    font-size: 28px;
    color: #6a11cb;
}

.check-page .tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 20px;
    border-bottom: 2px solid #2575fc33;
}

.check-page .tab-btn {
    padding: 12px 20px;
    background: none;
    border: none;
    border-bottom: 3px solid transparent;
    cursor: pointer;
    font-size: 15px;
    font-weight: 600;
    color: #6a11cb;
    transition: 0.3s;
}

.check-page .tab-btn.active {
    border-bottom-color: #6a11cb;
    color: #6a11cb;
}

.check-page .form-group {
    margin-bottom: 18px;
}

.check-page label {
    display: block;
    margin-bottom: 8px;
    color: #6a11cb;
    font-weight: 600;
    font-size: 15px;
}

.check-page input,
.check-page select {
    width: 100%;
    padding: 13px;
    border: 2px solid #2575fc33;
    border-radius: 10px;
    margin-bottom: 18px;
    font-size: 15px;
    background: #f8f9ff;
    transition: 0.3s;
}

.check-page input:focus,
.check-page select:focus {
    border-color: #6a11cb;
    background: #fff;
    box-shadow: 0 0 10px rgba(102, 126, 234, 0.2);
}

.check-page button {
    width: 100%;
    padding: 15px;
    border-radius: 12px;
    border: none;
    background: linear-gradient(135deg, #8ec5fc 0%, #e0c3fc 100%);
    color: #fff;
    cursor: pointer;
    font-size: 16px;
    font-weight: 600;
    transition: 0.3s;
}

.check-page .status-badge {
    display: inline-block;
    padding: 8px 16px;
    border-radius: 20px;
    font-weight: 600;
    margin: 10px 0;
}

.status-scheduled { background: #e3f2fd; color: #1976d2; }
.status-pending   { background: #fff3e0; color: #f57c00; }
.status-done      { background: #e8f5e9; color: #388e3c; }
.status-cancelled { background: #ffebee; color: #c62828; }
.status-waiting   { background: #fffde7; color: #f9a825; }

@media (max-width: 768px) {
    .check-page .container {
        width: 95%;
        padding: 20px;
        margin: 20px auto;
    }

    .check-page h2 {
        font-size: 22px;
    }

    .check-page input {
        font-size: 16px;
    }

    .check-page button {
        padding: 12px;
        font-size: 15px;
    }
}

/* ============================= */
/*        الصفحة الرئيسية         */
/* ============================= */

.home-page .container {
    width: 90%;
    max-width: 520px;
    margin: 40px auto;
    background: #fff;
    padding: 35px;
    border-radius: 20px;
    box-shadow: 0 10px 40px #6a11cb4D;
    border: 2px solid #6a11cb;
    text-align: center;
}

.home-page .home-title {
    font-size: 28px;
    font-weight: 700;
    color: #6a11cb;
    margin-bottom: 10px;
}

.home-page .home-subtitle {
    color: #777;
    font-size: 16px;
    margin-bottom: 25px;
}

.home-page .home-links {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.home-page .home-links a {
    display: block;
    padding: 15px;
    background: linear-gradient(135deg, #8ec5fc 0%, #e0c3fc 100%);
    color: #fff;
    text-decoration: none;
    border-radius: 12px;
    font-size: 18px;
    font-weight: 600;
    transition: 0.3s;
}

.home-page .home-links a:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(102, 126, 234, 0.6);
}

@media (max-width: 768px) {
    .home-page .container {
        width: 95%;
        padding: 25px;
    }

    .home-page .home-title {
        font-size: 24px;
    }

    .home-page .home-links a {
        font-size: 16px;
        padding: 12px;
    }
}

.hide {
    display: none !important;
}

.card-box {
    background: #fafaff;
    border: 2px solid #2575fc33;
    border-radius: 20px;
    padding: 25px;
    margin-bottom: 25px;
    box-shadow: 0 6px 25px rgba(102, 126, 234, 0.15);
}

.card-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
}

.card-header h3 {
    margin: 0;
    font-size: 22px;
    color: #6a11cb;
    font-weight: 700;
}

.card-code {
    background: #6a11cb;
    color: #fff;
    padding: 10px 18px;
    border-radius: 12px;
    font-size: 18px;
    font-weight: 700;
}

.card-body {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.card-row {
    display: flex;
    justify-content: space-between;
    padding: 12px 0;
    border-bottom: 1px solid #eee;
}

.card-row span {
    color: #666;
    font-size: 15px;
}

.card-row strong {
    font-size: 16px;
    color: #333;
}

.back-home {
    text-align: center;
    margin: 15px 0;
}

.btn-home {
    display: inline-block;
    background-color: #6a11cb;
    color: #fff;
    padding: 10px 18px;
    border-radius: 10px;
    text-decoration: none;
    font-weight: bold;
    font-size: 16px;
    transition: 0.3s;
}

.btn-home:hover {
    background-color: #556cd6;
}


/* ============================= */
/*      أنماط البنرات الإعلانية    */
/* ============================= */

/*
 * يعرض الإعلان بعرض نافذة الجهاز مهما كان عرض الحاوية المحيطة به.
 * لا نستخدم ارتفاعاً ثابتاً أو object-fit: cover، حتى لا تُقص الصورة.
 */
.banner-ad {
    width: 100vw;
    max-width: 100vw;
    margin: 15px calc(50% - 50vw);
    overflow: visible;
    background: #fff;
}

.banner-ad a {
    display: block;
    width: 100%;
    text-decoration: none;
}

.banner-img {
    display: block;
    width: 100%;
    max-width: 100%;
    height: auto;
    max-height: none;
    object-fit: contain;
    object-position: center;
}

/* إلغاء التكبير عند المرور لأنه قد يقطع أطراف الصورة بصرياً. */
.banner-ad:hover .banner-img {
    transform: none;
}

.banner-ad-header {
    margin-top: 0;
    margin-bottom: 20px;
}

.banner-ad-footer {
    margin-top: 20px;
    margin-bottom: 0;
}

@media (max-width: 768px) {
    .banner-ad {
        margin-top: 10px;
        margin-bottom: 10px;
    }
}

@media (max-width: 480px) {
    .banner-ad {
        margin-top: 8px;
        margin-bottom: 8px;
    }
}

/* Pro Fixes for تأثير ثلاثي الأبعاد */
.home-links a {
    display: block;
    background: #fff;
    color: #6a11cb;
    padding: 18px;
    margin-bottom: 15px;
    border-radius: 15px;
    text-decoration: none;
    font-weight: 700;
    font-size: 18px;
    box-shadow: 0 4px 15px rgba(0,0,0,0.1);
    transition: 0.3s;
    border: 2px solid #6a11cb33;
    text-align: center;
}
.home-links a:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 25px #6a11cb4D;
    background: #6a11cb;
    color: #fff;
}
.header-img {
    max-width: 150px;
    margin-bottom: 15px;
    border-radius: 10px;
}

            .home-links a { transform: perspective(1px) translateZ(0); box-shadow: 0 0 1px rgba(0, 0, 0, 0); transition-duration: 0.3s; }
            .home-links a:hover { transform: scale(1.05); box-shadow: 0 10px 20px rgba(0,0,0,0.2); }
            


/* ============================================================
   الصفحات العامة التابعة للقالب: المكافآت والإلغاء والتنقل
   ============================================================ */
.template-page-actions {
    width: min(980px, calc(100% - 32px));
    margin: 20px auto 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    flex-wrap: wrap;
}
.template-action-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 42px;
    padding: 10px 16px;
    border: 1px solid rgba(47, 90, 168, .25);
    border-radius: 10px;
    background: #fff;
    color: #214b9e;
    text-decoration: none;
    font-weight: 700;
    box-shadow: 0 4px 12px rgba(22, 58, 114, .12);
    transition: transform .2s ease, background .2s ease, color .2s ease;
}
.template-action-link:hover,
.template-action-link:focus-visible {
    background: #2f5aa8;
    color: #fff;
    transform: translateY(-1px);
}
.template-action-link.secondary {
    background: rgba(255, 255, 255, .84);
    color: #344054;
}
.template-action-link.danger {
    border-color: rgba(192, 57, 43, .3);
    color: #a32020;
}
.template-action-link.danger:hover,
.template-action-link.danger:focus-visible {
    background: #c0392b;
    color: #fff;
}

/* صفحة برنامج المكافآت */
.loyalty-wrap { max-width: 980px; margin: 22px auto 34px; }
.loyalty-hero {
    background: linear-gradient(135deg, #173f83, #4a7fd4);
    color: #fff;
    border-radius: 16px;
    padding: 26px;
    margin-bottom: 22px;
    box-shadow: 0 12px 30px rgba(23, 63, 131, .2);
}
.loyalty-hero h1 { margin: 0 0 8px; }
.loyalty-hero p { margin: 0; line-height: 1.8; }
.loyalty-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.loyalty-card {
    background: rgba(255, 255, 255, .98);
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    padding: 22px;
    box-shadow: 0 4px 16px rgba(22, 58, 114, .1);
}
.loyalty-card h2 { margin-top: 0; color: #214b9e; font-size: 20px; }
.loyalty-alert { padding: 13px 15px; margin-bottom: 18px; border-radius: 10px; font-weight: 600; }
.loyalty-alert.error { background: #fdeaea; color: #9b1c1c; border: 1px solid #f0b9b9; }
.loyalty-alert.success { background: #e8f7ed; color: #176c34; border: 1px solid #b9e2c7; }
.loyalty-balance { background: #eef4ff; border: 1px solid #b3d4f5; border-radius: 14px; padding: 24px; margin: 18px 0; text-align: center; }
.loyalty-balance strong { display: block; color: #214b9e; font-size: 40px; line-height: 1.2; }
.loyalty-table { width: 100%; border-collapse: collapse; background: #fff; }
.loyalty-table th,.loyalty-table td { border-bottom: 1px solid #e5e7eb; padding: 11px; text-align: start; }
.loyalty-badge { display: inline-block; padding: 4px 9px; border-radius: 999px; background: #e6f9ee; color: #176c34; font-size: 12px; font-weight: 700; }
.loyalty-security-note { color: #475467; font-size: 13px; line-height: 1.75; margin: 0 0 16px; }
.loyalty-otp-actions { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 12px; }
.loyalty-otp-actions form { margin: 0; }

/* صفحة إلغاء الحجز أو الانتظار */
.cancel-wrap { max-width: 560px; margin: 22px auto 38px; }
.cancel-card { padding: 28px; border-radius: 16px; background: rgba(255, 255, 255, .98); box-shadow: 0 8px 30px rgba(20, 58, 110, .14); }
.cancel-card h2 { margin-top: 0; color: #214b9e; }
.cancel-summary { background: #f0f7ff; border: 1px solid #b3d4f5; border-radius: 10px; padding: 14px; margin: 18px 0; line-height: 1.9; }
.cancel-alert { padding: 13px; border-radius: 9px; margin: 16px 0; font-weight: 600; }
.cancel-alert.error { background: #fdeaea; color: #9b1c1c; border: 1px solid #f0b9b9; }
.cancel-alert.success { background: #e8f7ed; color: #176c34; border: 1px solid #b9e2c7; }
.cancel-danger { background: #c0392b !important; }
.cancel-muted { color: #475467; font-size: 14px; line-height: 1.7; }

/* رفع تباين عبارة عدد المنتظرين قبل العميل */
#live-position-box .waiting-position-label {
    display: inline-block;
    margin-top: 8px;
    padding: 6px 14px;
    border-radius: 999px;
    background: #214b9e;
    color: #fff;
    font-weight: 800;
    letter-spacing: .1px;
}

@media (max-width: 700px) {
    .loyalty-grid { grid-template-columns: 1fr; }
    .loyalty-table { font-size: 12px; }
    .template-page-actions { width: min(100% - 24px, 980px); }
    .template-page-actions .template-action-link { flex: 1 1 170px; }
    .loyalty-hero, .loyalty-card, .cancel-card { padding: 18px; }
}


/* صفحة 404 ضمن القالب */
.not-found-wrap { min-height: 48vh; display: grid; place-items: center; padding: 22px 0 42px; }
.not-found-card { width: min(100%, 560px); padding: 42px 32px; text-align: center; background: rgba(255,255,255,.98); border: 1px solid #e5e7eb; border-radius: 20px; box-shadow: 0 18px 48px rgba(29, 78, 216, .15); }
.not-found-code { margin: 0; color: #214b9e; font-size: clamp(64px, 16vw, 124px); font-weight: 800; line-height: 1; }
.not-found-card h2 { margin: 18px 0 12px; font-size: 26px; color: #1f2937; }
.not-found-card p { margin: 0 auto 24px; max-width: 420px; color: #475467; line-height: 1.8; }


/* ============================================================
   تنسيقات الصفحات العامة الموحدة — لا تنسيقات مضمنة في الصفحات
   ============================================================ */
.lang-switcher { position:absolute; top:15px; left:15px; z-index:1000; }
[dir="ltr"] .lang-switcher { right:15px; left:auto; }
.btn-lang { background:rgba(255,255,255,.2); color:#fff; padding:5px 12px; border-radius:20px; text-decoration:none; font-size:13px; font-weight:700; border:1px solid rgba(255,255,255,.3); transition:.3s; }
.btn-lang:hover { background:#fff; color:#2f5aa8; }

/* أزرار التنقل العامة تستخدم زر القالب الأصلي وتظهر في المنتصف */
.template-page-actions { width:auto; margin:15px 0; display:flex; align-items:center; justify-content:center; gap:10px; flex-wrap:wrap; text-align:center; }
.template-page-actions .btn-home { margin:0; }
.template-action-link { display:inline-block; background-color:#6a11cb; color:#fff; padding:10px 18px; border-radius:10px; text-decoration:none; font-weight:bold; font-size:16px; transition:.3s; }
.template-action-link:hover,.template-action-link:focus-visible { background-color:#556cd6; color:#fff; transform:none; }
.template-action-link.secondary,.template-action-link.danger { background-color:#6a11cb; color:#fff; border:0; box-shadow:none; }
.template-action-link.secondary:hover,.template-action-link.danger:hover { background-color:#556cd6; color:#fff; }

/* رسائل النماذج واختيار الفرع ونوع الخدمة */
.public-error-message { background:#fee; color:#c33; padding:15px; border-radius:10px; margin-bottom:20px; text-align:center; }
.direct-hidden-select { display:none; }
.branch-info-box,.service-notice { display:none; margin-top:12px; padding:12px 16px; border-radius:10px; font-size:14px; text-align:center; }
.branch-info-box.show { display:block; background:#f0f7ff; border:1px solid #b3d4f5; color:#2f5aa8; }
.service-notice.show { display:block; background:#fff3cd; border:1px solid #ffc107; color:#856404; }
.branch-map-btn { display:inline-block; margin-top:8px; padding:8px 14px; border-radius:8px; background:#2f5aa8; color:#fff; text-decoration:none; }
#tableTypeSelect:disabled,#submitWaitingBtn:disabled,#submitBookingBtn:disabled { opacity:.55; cursor:not-allowed; }
.direct-selection { padding:12px 14px; border:1px solid #b3d4f5; border-radius:10px; background:#f0f7ff; color:#2f5aa8; font-weight:700; }
.cancel-link { background:#c0392b !important; margin-inline-end:8px; }
.field-error { display:none; margin-top:6px; color:#b42318; font-size:13px; }
.field-error.show { display:block; }
#live-position-box { background:#f0f7ff; border:1px solid #b3d4f5; border-radius:12px; padding:18px; margin-top:16px; text-align:center; }
#live-position-box .position-count { font-size:42px; font-weight:800; color:#2f5aa8; }
#live-position-box .status-badge { display:inline-block; margin-top:16px; padding:5px 16px; border-radius:20px; font-size:13px; font-weight:700; background:#2f5aa8; color:#fff; }
.live-update-time { font-size:11px; color:#777; margin-top:8px; }

/* صفحة التحقق من الحجز والانتظار */
.live-reservation-box { background:#f0f7ff; border:1px solid #b3d4f5; border-radius:12px; padding:18px; margin-top:16px; text-align:center; }
.position-count { font-size:48px; font-weight:800; color:#2f5aa8; line-height:1; }
.position-label { font-size:14px; color:#555; margin-top:6px; }
.live-update-time { font-size:11px; color:#999; margin-top:8px; }
.results-count { text-align:center; margin:10px 0 20px; font-weight:700; color:#2f5aa8; }
.result-card { margin-bottom:25px; }
.status-badge { display:inline-block; padding:5px 16px; border-radius:20px; font-size:13px; font-weight:700; }
.status-waiting { background:#2f5aa8; color:#fff; }
.status-arrived { background:#1a9e4a; color:#fff; }
.status-late { background:#e67e22; color:#fff; }
.status-your_turn { background:#ff9800; color:#fff; animation:pulse 1s infinite; }
.status-done { background:#7f8c8d; color:#fff; }
.status-cancelled { background:#c0392b; color:#fff; }
.status-scheduled { background:#17a2b8; color:#fff; }
.result-cancel-link { display:inline-block; margin-top:14px; padding:10px 14px; border-radius:8px; background:#c0392b; color:#fff; text-decoration:none; font-weight:700; }
.check-separator { margin:30px 0; opacity:.3; }
@keyframes pulse { 0% { opacity:1; } 50% { opacity:.6; } 100% { opacity:1; } }

/* صفحة المنيو والسلة */
.menu-top-actions { display:flex; justify-content:flex-end; margin:0 auto 16px; max-width:980px; }
.cart-toggle { position:relative; display:inline-flex; gap:8px; align-items:center; padding:11px 15px; border:0; border-radius:10px; background:#2f5aa8; color:#fff; cursor:pointer; font-weight:700; }
.cart-count { min-width:22px; height:22px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; background:#fff; color:#2f5aa8; font-size:12px; }
.menu-item { align-items:center; gap:12px; }
.menu-add-button { border:0; border-radius:8px; padding:9px 12px; background:#2f5aa8; color:#fff; cursor:pointer; white-space:nowrap; font-weight:700; }
.menu-add-button:hover,.cart-toggle:hover { opacity:.92; }
.cart-panel { position:fixed; inset:0; background:rgba(0,0,0,.45); z-index:1000; display:none; align-items:flex-end; justify-content:center; }
.cart-panel.open { display:flex; }
.cart-card { background:#fff; width:min(700px,100%); max-height:86vh; overflow:auto; border-radius:18px 18px 0 0; padding:22px; box-shadow:0 -10px 40px rgba(0,0,0,.18); }
.cart-header,.cart-row,.cart-footer { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.cart-header { border-bottom:1px solid #e5e7eb; padding-bottom:14px; margin-bottom:12px; }
.cart-header h2 { margin:0; color:#2f5aa8; }
.cart-close,.qty-button,.cart-remove { border:0; cursor:pointer; border-radius:7px; padding:7px 9px; font-weight:700; }
.cart-close,.cart-remove { background:#fdeaea; color:#a32020; }
.qty-button { background:#eef2ff; color:#2f5aa8; }
.cart-row { padding:14px 0; border-bottom:1px solid #edf0f4; }
.cart-name { font-weight:700; color:#27364b; }
.cart-price,.cart-muted { font-size:13px; color:#667085; }
.cart-qty { display:inline-flex; align-items:center; gap:8px; }
.cart-footer { padding-top:18px; margin-top:4px; flex-wrap:wrap; }
.cart-total { font-size:18px; font-weight:800; color:#2f5aa8; }
.cart-empty { text-align:center; padding:30px 10px; color:#667085; }
.cart-note { flex-basis:100%; margin:0; color:#667085; font-size:13px; line-height:1.7; }
.cart-sync-notice { display:none; margin:0 0 12px; padding:10px 12px; border-radius:8px; background:#fff3cd; color:#7a5c00; font-size:13px; line-height:1.6; }
.cart-sync-notice.show { display:block; }

/* عبارة عدد الأشخاص قبلك نص إرشادي واضح وليست زراً */
#live-position-box .waiting-position-label {
    display:block;
    margin:10px 0 0;
    padding:0;
    border:0;
    border-radius:0;
    background:transparent;
    color:#475467;
    font-size:14px;
    font-weight:700;
    letter-spacing:normal;
}
@media (max-width:700px) { .template-page-actions { margin:12px 0; } }
@media (max-width:600px) { .menu-item { flex-wrap:wrap; } .menu-add-button { width:100%; } .cart-card { padding:18px; } }


/* ============================================================
   نموذج تواصل العملاء في الصفحة الرئيسية
   ============================================================ */
.contact-section {
    width: min(100%, 900px);
    margin: 38px auto 12px;
    padding: 28px;
    border-radius: 20px;
    background: rgba(255, 255, 255, .96);
    border: 1px solid rgba(106, 17, 203, .22);
    box-shadow: 0 12px 30px rgba(106, 17, 203, .13);
    text-align: start;
}
.contact-section-heading { text-align: center; margin-bottom: 22px; }
.contact-section-heading h2 { margin: 0 0 8px; color: #6a11cb; font-size: 26px; }
.contact-section-heading p { margin: 0; color: #475467; line-height: 1.8; }
.contact-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.contact-form .form-group { margin: 0; }
.contact-form label { display: block; margin: 0 0 7px; color: #4b247c; font-weight: 700; }
.contact-form input,
.contact-form select,
.contact-form textarea {
    width: 100%;
    padding: 12px;
    border: 1px solid #c9b6e6;
    border-radius: 10px;
    background: #fff;
    color: #2d1a46;
    font: inherit;
    transition: border-color .2s ease, box-shadow .2s ease;
}
.contact-form textarea { min-height: 144px; resize: vertical; }
.contact-form input:focus,
.contact-form select:focus,
.contact-form textarea:focus { outline: 0; border-color: #6a11cb; box-shadow: 0 0 0 3px rgba(106, 17, 203, .14); }
.contact-message-field { grid-column: 1 / -1; }
.contact-message-field small { display: block; margin-top: 7px; color: #667085; line-height: 1.5; }
.contact-submit-button {
    display: block;
    min-width: 180px;
    margin: 20px auto 0;
    padding: 12px 22px;
    border: 0;
    border-radius: 10px;
    background: #6a11cb;
    color: #fff;
    font: inherit;
    font-weight: 700;
    cursor: pointer;
    transition: background .2s ease, transform .2s ease;
}
.contact-submit-button:hover,
.contact-submit-button:focus-visible { background: #556cd6; transform: translateY(-1px); }
.contact-alert { margin: 0 0 18px; padding: 13px 15px; border-radius: 10px; text-align: center; font-weight: 700; }
.contact-alert.success { background: #e8f7ed; border: 1px solid #b9e2c7; color: #176c34; }
.contact-alert.error { background: #fdeaea; border: 1px solid #f0b9b9; color: #9b1c1c; }
@media (max-width: 640px) {
    .contact-section { padding: 20px 16px; margin-top: 28px; }
    .contact-form-grid { grid-template-columns: 1fr; }
    .contact-message-field { grid-column: auto; }
    .contact-submit-button { width: 100%; }
}


/* نظام طلبات الطاولات */
.table-menu-banner { display:flex; align-items:center; gap:14px; margin:0 auto 20px; padding:18px 20px; max-width:980px; border:1px solid rgba(255,255,255,.2); border-radius:14px; color:#fff; background:linear-gradient(135deg,#6a11cb,#2575fc); box-shadow:0 8px 22px rgba(106,17,203,.18); }
.table-menu-banner > span { font-size:32px; }
.table-menu-banner h1 { margin:0 0 5px; font-size:23px; color:#fff; }
.table-menu-banner p { margin:0; color:#f3edff; }
.table-order-alert, .table-orders-closed-note { max-width:980px; margin:0 auto 18px; padding:13px 16px; border-radius:10px; font-weight:700; }
.table-order-alert.success { color:#146c43; background:#d1f1df; border-inline-start:4px solid #1a9e4a; }
.table-order-alert.error { color:#8c2020; background:#ffe1e1; border-inline-start:4px solid #c0392b; }
.table-orders-closed-note { color:#825c14; background:#fff4d8; border-inline-start:4px solid #d99b1d; }
.table-order-submit-form { display:grid; gap:8px; margin-top:14px; }
.table-order-submit-form label { color:#6a11cb; font-weight:800; text-align:start; }
.table-order-submit-form input { width:100%; min-height:44px; padding:10px 12px; border:2px solid #2575fc33; border-radius:8px; font:inherit; direction:ltr; text-align:start; }
.table-order-waiting-note { margin:0; padding:9px 11px; border-radius:8px; color:#6c4e0a; background:#fff4d8; font-size:13px; line-height:1.6; text-align:start; }
.table-order-submit { min-height:46px; border:0; border-radius:8px; color:#fff; background:linear-gradient(135deg,#6a11cb,#2575fc); font:inherit; font-weight:800; cursor:pointer; }
.table-order-submit:hover { filter:brightness(.94); }
.table-order-receipt { max-width:760px; margin:0 auto 35px; padding:24px; border:2px solid #2575fc33; border-radius:15px; background:#fff; box-shadow:0 8px 24px rgba(106,17,203,.1); }
.table-order-receipt-head { display:flex; align-items:center; justify-content:space-between; gap:14px; border-bottom:1px solid #e6eaf1; padding-bottom:14px; }
.table-order-receipt-head h2 { margin:0; color:#6a11cb; }
.table-order-status { padding:6px 10px; border-radius:99px; font-size:13px; font-weight:800; }
.table-order-status.status-new { color:#5e2b92; background:#eee0ff; }
.table-order-status.status-accepted, .table-order-status.status-preparing { color:#175a92; background:#dcefff; }
.table-order-status.status-ready { color:#855400; background:#fff1cd; }
.table-order-status.status-received { color:#146c43; background:#d1f1df; }
.table-order-status.status-cancelled { color:#8c2020; background:#ffe1e1; }
.table-order-readonly-note, .table-order-active-note, .table-order-finished { margin:16px 0; padding:12px; border-radius:8px; line-height:1.7; }
.table-order-readonly-note { color:#52637b; background:#f5f8fd; }
.table-order-active-note { color:#1b5b91; background:#eaf4ff; }
.table-order-finished { color:#146c43; background:#e5f7eb; }
.table-order-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin:18px 0; }
.table-order-summary div { padding:11px; border-radius:8px; background:#f8f9ff; }
.table-order-summary dt { margin-bottom:5px; color:#667085; font-size:13px; font-weight:700; }
.table-order-summary dd { margin:0; color:#4a168d; font-weight:800; }
.table-order-items-readonly { border-top:1px solid #e6eaf1; }
.table-order-items-readonly > div { display:flex; justify-content:space-between; gap:12px; padding:11px 0; border-bottom:1px solid #eef1f5; color:#344054; }
.table-order-new-link { display:inline-block; margin-top:18px; padding:10px 14px; border-radius:8px; color:#fff; background:linear-gradient(135deg,#6a11cb,#2575fc); font-weight:800; text-decoration:none; }
.table-order-new-link:hover { color:#fff; filter:brightness(.94); }
@media (max-width:640px) { .table-menu-banner { align-items:flex-start; padding:15px; } .table-menu-banner h1 { font-size:20px; } .table-order-summary { grid-template-columns:1fr; } .table-order-receipt { padding:17px; } .table-order-receipt-head { align-items:flex-start; flex-direction:column; } }


/* ===================================================================
   URBAN NEXUS — Architectural 3D layer
   =================================================================== */
:root {
  --un-ink:#0c1230; --un-violet:#7153ff; --un-cyan:#19cce5;
  --un-coral:#ff785d; --un-gold:#ffc857; --un-muted:#667198;
  --un-paper:rgba(255,255,255,.82); --un-line:rgba(75,87,171,.18);
  --un-shadow:0 25px 55px rgba(20,30,85,.17),0 8px 18px rgba(35,55,140,.08);
  --un-radius:26px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  min-height:100vh;color:var(--un-ink)!important;
  font-family:'Tajawal',Tahoma,Arial,sans-serif!important;
  background:radial-gradient(circle at 10% 10%,rgba(255,200,87,.32),transparent 23rem),radial-gradient(circle at 90% 12%,rgba(25,204,229,.25),transparent 25rem),radial-gradient(circle at 58% 90%,rgba(113,83,255,.22),transparent 30rem),linear-gradient(135deg,#f4f7ff,#e7eeff 55%,#f9f4ff)!important;
  overflow-x:hidden;isolation:isolate;
}
body:before{content:"";position:fixed;inset:0;z-index:-2;pointer-events:none;opacity:.52;background-image:linear-gradient(rgba(81,98,184,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(81,98,184,.07) 1px,transparent 1px);background-size:34px 34px;mask-image:linear-gradient(#000,transparent 78%)}
.urban-atmosphere{position:fixed;inset:0;z-index:-1;overflow:hidden;pointer-events:none;perspective:800px}
.urban-orb{position:absolute;width:32rem;aspect-ratio:1;border-radius:50%;filter:blur(4px);opacity:.45;animation:unFloat 14s ease-in-out infinite}
.urban-orb--one{top:-15rem;right:-8rem;background:radial-gradient(circle at 35% 35%,#ffe286,rgba(255,120,93,.45) 43%,transparent 70%)}
.urban-orb--two{bottom:-18rem;left:-9rem;background:radial-gradient(circle at 48% 42%,#8cefff,rgba(113,83,255,.4) 48%,transparent 70%);animation-delay:-5s}
.urban-grid-floor{position:absolute;left:-14%;right:-14%;bottom:-25rem;height:47rem;transform:rotateX(64deg) rotateZ(-4deg);background-image:linear-gradient(rgba(113,83,255,.25) 1px,transparent 1px),linear-gradient(90deg,rgba(25,204,229,.25) 1px,transparent 1px);background-size:44px 44px;opacity:.5}
.urban-building{position:absolute;bottom:0;width:clamp(3rem,7vw,7rem);background:linear-gradient(130deg,rgba(30,46,112,.16),rgba(255,255,255,.65) 50%,rgba(112,82,214,.22));border:1px solid rgba(104,95,214,.17);box-shadow:inset -14px 0 21px rgba(51,45,128,.13);transform:perspective(600px) rotateY(-17deg) skewY(-4deg)}
.urban-building:before{content:"";position:absolute;inset:12% 17%;background:repeating-linear-gradient(to bottom,rgba(25,204,229,.6) 0 3px,transparent 3px 16px);opacity:.52}
.urban-building--one{right:5%;height:16rem}.urban-building--two{left:4%;height:12rem;opacity:.7}.urban-building--three{left:19%;height:7rem;opacity:.45}
@keyframes unFloat{0%,100%{transform:translate3d(0,0,0) scale(1)}50%{transform:translate3d(3rem,2rem,0) scale(1.08)}}

/* Header and footer */
.urban-header{position:relative;width:min(1180px,calc(100% - 32px));margin:22px auto 0;padding:0!important;overflow:hidden;border:1px solid rgba(255,255,255,.72);border-radius:var(--un-radius);color:#fff!important;text-align:inherit!important;background:linear-gradient(125deg,rgba(12,19,50,.95),rgba(43,48,112,.9) 58%,rgba(89,61,165,.86))!important;box-shadow:0 24px 48px rgba(19,23,68,.26),inset 0 1px rgba(255,255,255,.24)}
.urban-header:before{content:"";position:absolute;width:25rem;height:25rem;top:-17rem;right:-8rem;border-radius:50%;background:radial-gradient(circle,rgba(25,204,229,.5),transparent 67%)}
.urban-header__shell{position:relative;z-index:1;display:flex;align-items:center;justify-content:space-between;gap:22px;min-height:135px;padding:24px clamp(20px,4vw,42px)}
.urban-brand{display:flex;align-items:center;gap:18px;min-width:0}.urban-logo-plinth{width:78px;height:78px;padding:7px;flex:0 0 auto;border-radius:22px;background:linear-gradient(145deg,#fff,rgba(183,231,255,.64));box-shadow:-7px 9px rgba(9,13,39,.27),0 14px 25px rgba(0,0,0,.22);transform:rotate(-4deg)}
.urban-logo-plinth .header-img{display:block!important;width:100%!important;height:100%!important;max-width:none!important;object-fit:cover;border-radius:16px;margin:0!important}.urban-brand__copy{min-width:0}.urban-kicker,.urban-eyebrow,.urban-section-heading>span,.urban-footer__caption{font-size:.67rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase}.urban-kicker{display:block;margin-bottom:7px;color:#a7f3ff}.urban-header h1{margin:0!important;color:#fff!important;font-size:clamp(1.35rem,3.3vw,2.25rem)!important;text-align:start!important;text-shadow:0 4px 20px rgba(4,8,30,.35)}
.urban-lang-switcher{position:static!important;margin:0!important;flex:0 0 auto}.urban-lang-switcher .btn-lang{display:inline-flex;align-items:center;gap:9px;padding:11px 15px;border:1px solid rgba(255,255,255,.32)!important;border-radius:14px;color:#fff!important;background:rgba(255,255,255,.1)!important;backdrop-filter:blur(9px);box-shadow:none!important}.urban-lang-switcher .btn-lang:hover{background:rgba(255,255,255,.21)!important;color:#fff!important;transform:translateY(-3px)}.urban-lang-dot{width:8px;height:8px;border-radius:50%;background:#9ae96b;box-shadow:0 0 12px #9ae96b}
.urban-banner-ad{width:min(1120px,calc(100% - 42px))!important;margin:22px auto!important;padding:5px!important;overflow:hidden!important;border-radius:20px!important;background:linear-gradient(115deg,rgba(113,83,255,.5),rgba(25,204,229,.42),rgba(255,120,93,.36))!important;box-shadow:var(--un-shadow)}.urban-banner-ad .banner-img{width:100%;max-height:190px;object-fit:cover;border-radius:16px}
.urban-footer{position:relative;width:min(1180px,calc(100% - 32px));margin:34px auto 22px!important;overflow:hidden;border:1px solid rgba(37,45,104,.17)!important;border-radius:24px!important;color:#4d5880!important;background:rgba(255,255,255,.63)!important;box-shadow:0 16px 36px rgba(27,35,92,.1)!important}.urban-footer__beam{position:absolute;width:45%;height:140%;top:-24%;inset-inline-start:12%;transform:rotate(18deg);background:linear-gradient(90deg,transparent,rgba(25,204,229,.2),transparent)}.urban-footer__content{position:relative;z-index:1;display:flex;align-items:center;justify-content:center;gap:14px;min-height:76px;padding:16px 24px;text-align:center}.urban-footer p{margin:0!important}.urban-footer__mark{display:grid;place-items:center;width:30px;height:30px;border-radius:10px;color:#fff;font-size:.7rem;font-weight:900;background:linear-gradient(135deg,var(--un-violet),var(--un-cyan));box-shadow:0 6px 12px rgba(62,81,200,.25)}.urban-footer__caption{color:var(--un-violet);font-size:.58rem}

/* Interactive home */
.urban-home{width:min(1180px,calc(100% - 32px))!important;max-width:none!important;margin:0 auto!important;padding:0!important;border:0!important;background:none!important;box-shadow:none!important;text-align:inherit!important}.urban-hero{display:grid;grid-template-columns:1.12fr .88fr;align-items:center;gap:clamp(22px,5vw,68px);min-height:350px;padding:clamp(28px,5vw,58px);overflow:hidden;border:1px solid rgba(255,255,255,.75);border-radius:34px;background:linear-gradient(137deg,rgba(255,255,255,.78),rgba(243,247,255,.54));box-shadow:var(--un-shadow),inset 0 1px #fff;backdrop-filter:blur(14px)}.urban-eyebrow{display:inline-flex;align-items:center;gap:10px;color:var(--un-violet)}.urban-eyebrow i{width:26px;height:2px;background:currentColor;box-shadow:7px 5px var(--un-cyan)}.urban-hero .home-title{max-width:670px;margin:17px 0 13px!important;color:var(--un-ink)!important;font-size:clamp(2rem,5.4vw,4.5rem)!important;line-height:1.06;text-align:start!important;letter-spacing:-.045em}.urban-hero .home-subtitle{max-width:570px;margin:0!important;color:var(--un-muted)!important;font-size:clamp(1rem,1.5vw,1.18rem)!important;line-height:1.9;text-align:start!important}.urban-hero__metrics{display:flex;flex-wrap:wrap;gap:14px;margin-top:28px}.urban-hero__metrics span{display:flex;align-items:center;gap:8px;color:var(--un-muted);font-size:.72rem;font-weight:800;letter-spacing:.08em}.urban-hero__metrics b{display:grid;place-items:center;width:30px;height:30px;border-radius:9px;color:#fff;font-size:.66rem;background:linear-gradient(145deg,var(--un-violet),var(--un-cyan));box-shadow:0 6px 13px rgba(71,88,196,.28)}
.urban-city-model{position:relative;width:min(100%,370px);height:275px;margin-inline:auto;perspective:800px;animation:unCity 7s ease-in-out infinite}.urban-city-model>span:not(.urban-city-chip){position:absolute;display:block}@keyframes unCity{0%,100%{transform:translateY(0)}50%{transform:translateY(-9px)}}.urban-city-sun{width:122px;height:122px;top:20px;inset-inline-end:42px;border-radius:50%;background:radial-gradient(circle at 34% 31%,#fffce5 0 5%,#ffdf72 25%,#ff9275 67%,transparent 70%);box-shadow:0 0 56px rgba(255,154,101,.45)}.urban-city-tower{bottom:35px;width:78px;border-radius:8px 8px 3px 3px;background:linear-gradient(115deg,#293673,#6577ca 48%,#b9eff8 50%,#3f4f9d 52%,#1e285d);box-shadow:19px 15px rgba(32,42,101,.17),inset 7px 0 rgba(255,255,255,.15);transform:skewY(-8deg) rotateY(-9deg)}.urban-city-tower:before{content:"";position:absolute;inset:15px 13px;background:repeating-linear-gradient(to bottom,rgba(169,250,255,.92) 0 5px,transparent 5px 16px);opacity:.82}.urban-city-tower--a{height:180px;inset-inline-start:45px}.urban-city-tower--b{height:126px;width:97px;inset-inline-start:133px;background:linear-gradient(115deg,#523786,#976cd5 48%,#fee6f4 50%,#68469e 52%,#382459)}.urban-city-tower--c{height:88px;width:66px;inset-inline-end:30px;background:linear-gradient(115deg,#17677b,#48cfe0 48%,#d3ffff 50%,#21869d 52%,#145363)}.urban-city-road{left:2%;right:1%;bottom:3px;height:80px;border-radius:50%;transform:rotateX(67deg);background:repeating-linear-gradient(90deg,transparent 0 17px,rgba(255,255,255,.75) 17px 25px,transparent 25px 48px),linear-gradient(115deg,#36306e,#1f8aa7);box-shadow:0 21px 30px rgba(38,52,132,.25)}.urban-city-chip{position:absolute;top:77px;inset-inline-start:7px;padding:12px 14px;border:1px solid rgba(255,255,255,.75);border-radius:14px;color:#2c2b6b;font:900 .66rem/1.2 Arial;letter-spacing:.14em;background:rgba(255,255,255,.7);box-shadow:0 12px 25px rgba(49,54,123,.13);transform:rotate(-5deg)}
.urban-services{margin:42px 0 20px}.urban-section-heading{display:flex;justify-content:space-between;align-items:end;gap:18px;margin:0 8px 18px}.urban-section-heading>span{color:var(--un-violet)}.urban-section-heading p{margin:0;color:var(--un-muted);font-size:.9rem}.urban-service-grid{display:grid!important;grid-template-columns:repeat(3,1fr)!important;gap:17px;padding:0!important;background:none!important}.urban-service-card{position:relative;min-height:198px;display:flex!important;flex-direction:column;justify-content:flex-end;align-items:flex-start;gap:6px;padding:22px!important;margin:0!important;overflow:hidden;border:1px solid rgba(255,255,255,.86)!important;border-radius:24px!important;color:var(--un-ink)!important;text-align:start!important;background:linear-gradient(145deg,rgba(255,255,255,.94),rgba(237,242,255,.66))!important;box-shadow:var(--un-shadow)!important;transform:perspective(850px) rotateX(var(--urban-rx,0)) rotateY(var(--urban-ry,0));transition:transform .28s ease,box-shadow .28s ease,filter .28s ease}.urban-service-card:before{content:"";position:absolute;width:154px;height:154px;top:-48px;inset-inline-end:-32px;border-radius:28px;background:linear-gradient(145deg,var(--un-one),var(--un-two));opacity:.22;transform:rotate(32deg);box-shadow:-14px 20px rgba(255,255,255,.48)}.urban-service-card:hover{color:var(--un-ink)!important;box-shadow:0 36px 72px rgba(17,27,75,.26)!important;filter:saturate(1.16)}.urban-service-card--1{--un-one:#ffb347;--un-two:#ff6e7f}.urban-service-card--2{--un-one:#6b4eff;--un-two:#67d9ff}.urban-service-card--3{--un-one:#21c8b2;--un-two:#7be495}.urban-service-card--4{--un-one:#7366ff;--un-two:#c3a9ff}.urban-service-card--5{--un-one:#ffc857;--un-two:#ff815e}.urban-service-card--6{--un-one:#18c8e5;--un-two:#8d6fff}.urban-service-card__number,.urban-service-card__tag,.urban-service-card strong,.urban-service-card__arrow,.urban-service-card__cube{position:relative;z-index:1}.urban-service-card__number{position:absolute;top:17px;inset-inline-start:18px;color:var(--un-muted);font:900 .69rem Arial;letter-spacing:.1em}.urban-service-card__tag{color:var(--un-violet);font-size:.65rem;font-weight:900;letter-spacing:.13em}.urban-service-card strong{max-width:85%;font-size:clamp(1.04rem,2vw,1.28rem);line-height:1.4}.urban-service-card__arrow{position:absolute;bottom:20px;inset-inline-end:21px;display:grid;place-items:center;width:35px;height:35px;border-radius:12px;color:#fff;font-size:1.18rem;background:linear-gradient(145deg,var(--un-one),var(--un-two));box-shadow:0 8px 15px rgba(63,61,155,.26)}.urban-service-card__cube{position:absolute;top:37px;inset-inline-end:42px;width:46px;height:46px;transform:rotate(30deg) skewY(-10deg);border:2px solid rgba(255,255,255,.82);border-radius:10px;background:linear-gradient(135deg,var(--un-one),var(--un-two));box-shadow:13px 14px rgba(45,55,125,.12)}.urban-service-card__cube i{position:absolute;display:block;background:rgba(255,255,255,.36)}.urban-service-card__cube i:nth-child(1){inset:9px;border:1px solid rgba(255,255,255,.55);border-radius:5px}.urban-service-card__cube i:nth-child(2){width:27px;height:5px;left:9px;bottom:-11px;transform:skewX(-32deg)}.urban-service-card__cube i:nth-child(3){width:5px;height:28px;right:-11px;top:9px;transform:skewY(-40deg)}

/* Functional pages, forms, cards, cart and statuses */
.container:not(.urban-home){width:min(1000px,calc(100% - 32px))!important;margin:26px auto!important;padding:clamp(20px,4vw,40px)!important;border:1px solid rgba(255,255,255,.78)!important;border-radius:30px!important;background:var(--un-paper)!important;box-shadow:var(--un-shadow)!important;backdrop-filter:blur(13px)}.container h2,.container h3{color:var(--un-ink)!important}.container h2:after{content:"";display:block;width:48px;height:4px;margin-top:12px;border-radius:99px;background:linear-gradient(90deg,var(--un-violet),var(--un-cyan),var(--un-coral))}input,select,textarea{border:1px solid var(--un-line)!important;border-radius:14px!important;color:var(--un-ink)!important;background:rgba(255,255,255,.9)!important;box-shadow:inset 0 2px 4px rgba(51,70,139,.03);transition:border-color .2s,box-shadow .2s,transform .2s}input:focus,select:focus,textarea:focus{border-color:var(--un-cyan)!important;box-shadow:0 0 0 4px rgba(25,204,229,.14),0 9px 20px rgba(53,80,163,.08)!important;transform:translateY(-1px);outline:none}button,.btn,.button,input[type=submit],.template-action-link,.btn-home,.menu-add-button,.cart-toggle,.table-order-submit{border:0!important;border-radius:14px!important;color:#fff!important;font-weight:800!important;background:linear-gradient(125deg,var(--un-violet),#5363d9 52%,var(--un-cyan))!important;box-shadow:0 11px 20px rgba(55,69,175,.22);transition:transform .22s,box-shadow .22s,filter .22s}button:hover,.btn:hover,.button:hover,input[type=submit]:hover,.template-action-link:hover,.btn-home:hover{transform:translateY(-3px)!important;box-shadow:0 16px 26px rgba(55,69,175,.29)!important;filter:brightness(1.08)}.card-box,.loyalty-card,.cancel-card,.not-found-card,.table-order-receipt,.cart-card,.contact-section,.check-page .box,.menu-page .menu-item{border:1px solid rgba(255,255,255,.86)!important;border-radius:21px!important;background:linear-gradient(145deg,rgba(255,255,255,.94),rgba(237,242,255,.66))!important;box-shadow:0 14px 30px rgba(45,57,130,.1)!important}.loyalty-hero,.table-menu-banner{border-radius:22px!important;background:linear-gradient(125deg,#172456,#6145a5 56%,#1f93b0)!important;box-shadow:var(--un-shadow)!important}.cart-panel{background:rgba(9,13,38,.58)!important}.status-badge,.table-order-status{box-shadow:0 6px 12px rgba(45,57,130,.11)}
@media(max-width:820px){.urban-header{width:calc(100% - 20px);margin-top:10px;border-radius:22px}.urban-header__shell{min-height:112px;padding:18px}.urban-logo-plinth{width:61px;height:61px;border-radius:18px}.urban-kicker{font-size:.56rem}.urban-lang-switcher .btn-lang{padding:9px 10px;font-size:.76rem}.urban-home{width:calc(100% - 20px)!important}.urban-hero{grid-template-columns:1fr;padding:27px 22px 18px;border-radius:25px}.urban-city-model{width:min(100%,310px);height:226px}.urban-service-grid{grid-template-columns:repeat(2,1fr)!important;gap:12px}.urban-service-card{min-height:170px;padding:17px!important;border-radius:20px!important}.urban-service-card__cube{transform:scale(.8) rotate(30deg) skewY(-10deg);transform-origin:top right}.urban-section-heading{align-items:flex-start;flex-direction:column;gap:5px;margin-inline:3px}.urban-footer{width:calc(100% - 20px)}.urban-footer__content{flex-wrap:wrap;gap:8px 13px}.urban-footer__caption{width:100%}.container:not(.urban-home){width:calc(100% - 20px)!important;padding:22px 16px!important;border-radius:24px!important}}
@media(max-width:430px){.urban-header__shell{align-items:flex-start}.urban-brand{gap:11px}.urban-header h1{font-size:1.13rem!important}.urban-service-grid{gap:10px}.urban-service-card strong{font-size:.91rem}.urban-service-card__arrow{width:29px;height:29px;bottom:14px;inset-inline-end:14px}.urban-service-card__number{top:12px;inset-inline-start:13px}.urban-hero__metrics{gap:8px}.urban-hero__metrics span{font-size:.61rem}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}