@import url('https://fonts.googleapis.com/css2?family=Alexandria:wght@100..900&display=swap');

:root {
    --mulish-font: "Alexandria", sans-serif;
}

@media (min-width: 1600px) {
    :root {
        --font-54: 40px;
        --font-42: 34px;
        --font-36: 28px;
        --font-30: 24px;
        --font-28: 22px;
        --font-18: 18px;
        --font-16: 14px;
        --font-14: 12px;
    }
}

@media (max-width: 1599px) and (min-width: 1400px) {
    :root {
        --font-54: 36px;
        --font-42: 30px;
        --font-36: 26px;
        --font-30: 22px;
        --font-28: 20px;
    }
}

@media (max-width: 1399px) and (min-width: 1200px) {
    :root {
        --font-54: 32px;
        --font-42: 28px;
        --font-36: 24px;
        --font-30: 20px;
        --font-28: 18px;
    }
}

@media (max-width: 1199px) and (min-width: 992px) {
    :root {
        --font-54: 30px;
        --font-42: 26px;
        --font-36: 24px;
        --font-30: 20px;
        --font-28: 18px;
    }
}

@media (max-width: 991px) and (min-width: 768px) {
    :root {
        --font-54: 30px;
        --font-42: 26px;
        --font-36: 22px;
        --font-30: 20px;
        --font-28: 18px;
    }
}

@media (max-width: 767px) {
    :root {
        --font-54: 30px;
        --font-42: 22px;
        --font-36: 20px;
        --font-30: 18px;
        --font-28: 18px;
        --font-22: 16px;
        --font-20: 18px;
        --font-18: 16px;
        --font-16: 14px;
        --font-14: 14px;
        --font-12: 12px;
    }
}


/* @media (max-width: 1399px) {
	:root {
		--font-54: 42px;
		--font-42: 34px;
		--font-36: 32px;
		--font-30: 30px;
	}
} */

html {
    direction: rtl;
}

body {
    direction: rtl;
    font-weight: 300;
}

.flip.text-left {
    text-align: right;
}

.flip.text-right {
    text-align: left;
}

.list-unstyled {
    padding-right: 0;
    padding-left: initial;
}

.list-inline {
    padding-right: 0;
    padding-left: initial;
    margin-right: -5px;
    margin-left: 0;
}

dd {
    margin-right: 0;
    margin-left: initial;
}

.pull-right.flip {
    float: left !important;
}

.pull-left.flip {
    float: right !important;
}

@media (min-width: 768px) {
    .book-ticket-list .match-item .super-cup-img {
        right: auto;
        left: 40px;
    }
}

/* Force RTL */
.iti {
    direction: rtl !important;
    text-align: right !important;
}

.iti__flag-container {
    right: 0 !important;
    left: auto !important;
}

.iti input {
    direction: rtl !important;
    text-align: right !important;
}

.ticket-form .form-group .input-group .iti .form-control {
    padding-left: 0 !important;
    padding-right: 102px !important;
}

.form-group .input-group .iti .form-control {
    padding-left: 0 !important;
    padding-right: 102px !important;
}

.custom-checkbox .checkmark {
    margin-right: 0;
    margin-left: 8px;
}

.iti__country-list {
    direction: ltr !important;
    text-align: right !important;
}

.booking-details-actions {
    margin-left: 0;
    margin-right: 2%;
}

@media (max-width: 767px) {
    .payment-box-item .btn-link {
        margin-left: 0;
        margin-right: auto;
    }
}

@media (max-width: 767px) {
    .match-detail .theme-btn {
        justify-content: flex-start !important;
    }

    .match-actions {
        padding-left: 91px;
        justify-content: flex-start !important;
    }

    .content-box ul li {
        font-size: var(--font-12);
    }

    .tickets-popup-price,
    .user-ticket-box li label {
        font-size: var(--font-12);
    }
}

@media (max-width: 460px) {
    .tickets-popup-box .user-ticket-box {
        min-width: 195px;
        max-width: 195px;
    }
}

.iti__arrow {
    margin-left: auto !important;
    margin-right: 6px !important;
}

.iti--separate-dial-code .iti__selected-dial-code {
    margin-left: auto !important;
    margin-right: 6px !important;
}

.booking-box-items .booking-box-items-info:before {
    left: auto;
    right: -10px;
}

.tickets-popup-box .user-ticket-box li:after {
    right: auto;
    left: 0;
}

.tickets-popup-box-dtl .user-ticket-box li:first-child {
    text-align: right;
}

.book-button,
.dropdown-user .user-icon,
.failed-content li label,
.payment-box-item span,
.tickets-popup-footer .tickets-popup-footer-box,
.tickets-popup-price,
.user-ticket-box li label,
.tickets-info .total-tickets span,
.booking-box-items-info-title p,
.booking-box-items-info-title h6,
.booking-box-items-list .match-detail-compare .team-name,
.booking-box-list-items .booking-title h6,
.match-detail-box,
.match-time,
.swal2-actions .swal2-confirm,
.theme-btn .cta-button,
.section-heading h1 {
    font-weight: 500;
}

.swal2-title,
.forgot-password a,
.payment-title p,
.fill-ticket-box .fill-ticket-title h2,
.tickets-popup-box-header,
.tickets-popup .header-tickets-popup,
.booking-content ul li label b,
.form-group .form-label,
.page-title h2,
.page-title h1,
.match-detail-compare .team-name,
.team-name,
.match-title,
.tournament-title {
    font-weight: 600;
}

.otp-input,
.booking-content ul li span small,
.booking-content ul li label,
.forgot-password a,
.form-group .input-group .form-control,
.stadium-name,
.match-date,
.tournament-card .info-text,
.dropdown-language a,
.dropdown-user .dropdown-item,
.dropdown-user .dropdown-trigger {
    font-weight: 400;
}

.footer .copyright p a {
    font-weight: 600;
}

.booking-content ul li span {
    font-weight: 700;
}

.failed-content li span,
.user-list-info span {
    font-weight: 300;
}

.theme-btn .cta-button:has(i) {
    flex-direction: row-reverse;
}