/**
 * Ajman Water Park - Arabic Language Support
 * TEXT ONLY mode: Arabic text replaces English, but layout stays LTR.
 * No directional flip - just font and text styling for Arabic.
 */

/* ===================================================== */
/* ===== LANGUAGE TOGGLE BUTTON STYLES ===== */
/* ===================================================== */

.lang-toggle-wrapper {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-left: 15px;
    user-select: none;
}

.lang-label {
    font-size: 0.8rem;
    font-weight: 700;
    color: rgba(255, 255, 255, 0.6);
    transition: color 0.3s ease;
    cursor: pointer;
}

.lang-label-active {
    color: #ffffff;
}

/* The Toggle Switch */
.lang-toggle-btn {
    position: relative;
    width: 50px;
    height: 26px;
    background-color: rgba(255, 255, 255, 0.25);
    border-radius: 50px;
    cursor: pointer;
    transition: background-color 0.3s ease;
    border: 2px solid rgba(255, 255, 255, 0.5);
    flex-shrink: 0;
}

.lang-toggle-btn:hover {
    background-color: rgba(255, 255, 255, 0.4);
}

/* The sliding circle */
.lang-toggle-slider {
    position: absolute;
    top: 2px;
    left: 2px;
    width: 18px;
    height: 18px;
    background-color: #ffffff;
    border-radius: 50%;
    transition: transform 0.3s ease;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}

/* When Arabic is active - slide to right */
.lang-toggle-btn.active .lang-toggle-slider {
    transform: translateX(24px);
}

.lang-toggle-btn.active {
    background-color: rgba(255, 215, 0, 0.5);
    border-color: rgba(255, 215, 0, 0.8);
}

/* ===== Mobile Toggle Adjustments ===== */
@media (max-width: 991px) {
    .lang-toggle-wrapper {
        justify-content: center;
        margin: 15px 0 0 0;
        padding-top: 15px;
        border-top: 1px solid rgba(255, 255, 255, 0.15);
        width: 100%;
    }

    .lang-label {
        font-size: 0.9rem;
    }

    .lang-toggle-btn {
        width: 56px;
        height: 30px;
    }

    .lang-toggle-slider {
        width: 22px;
        height: 22px;
    }

    .lang-toggle-btn.active .lang-toggle-slider {
        transform: translateX(26px);
    }
}


/* ===================================================== */
/* ===== ARABIC ACTIVE - TEXT ONLY (No Layout Flip) ===== */
/* ===================================================== */

/* Arabic Font when active */
body.rtl-active {
    font-family: 'Noto Sans Arabic', 'Segoe UI', 'Tahoma', 'Arial', sans-serif;
}

/* DO NOT set direction:rtl or text-align:right on body.
   Layout stays LTR. Only the translated TEXT appears in Arabic. */

/* =====================================================================
   ANG PAG-IKOT NG NUMERO AT NG BANTAS SA ARABIC          (bidi)
   ---------------------------------------------------------------------
   Reklamo: "nag-fflip sila pag Arabic, pumapangit."

   Hindi layout ang sira - hindi naman nag-fflip ang mga kahon. Ang sira ay
   nasa LOOB ng bawat pangungusap.

   Ang browser ay may panuntunan sa paghahalo ng dalawang direksiyon
   (Unicode bidi). Ang isang elemento na naka-LTR ang kahon pero Arabic ang
   laman ay nagkakaproblema sa dulo: ang tuldok ay lumilipat sa kaliwa, ang
   "5%" ay napupunta sa maling gilid, at ang "AED 79" sa gitna ng Arabic ay
   humihiwalay. Iyon ang nakikitang "pumapangit" - hindi ang buong pahina,
   kundi ang huling dalawang titik ng bawat linya.

   `unicode-bidi: plaintext` ang sagot: ang UNANG tunay na titik ng bawat
   elemento ang nagtatakda ng direksiyon NG ELEMENTONG IYON LANG. Ang Arabic
   ay nagiging tama sa loob ng sarili niyang kahon; ang Ingles ay nananatiling
   Ingles; at WALANG KAHON ANG GUMAGALAW - kaya hindi nag-fflip ang layout,
   na siyang ayaw ninyo.

   Sa [data-translate] lang ito nakakabit - doon lang naman pumapasok ang
   Arabic. Ang natitirang bahagi ng pahina ay hindi hinahawakan.
   ===================================================================== */
body.rtl-active [data-translate],
body.rtl-active [data-translate-cart],
body.rtl-active .awp-vat,
body.rtl-active .awp-vat-banner {
    unicode-bidi: plaintext;
}

/* Ang mga kahong may halong presyo at salita (hal. "AED 79.00" sa tabi ng
   pangalan ng ticket) ay hiwalay na binabasa, para hindi hilahin ng Arabic
   ang numero sa maling gilid. */
body.rtl-active .awp-vat,
body.rtl-active .price-label,
body.rtl-active .ticket-price,
body.rtl-active .upgrade-price {
    unicode-bidi: isolate;
}