/* credential (login/signup) css start */

.credentials_section {
    width: 100%;
    min-height: 100vh;
    display: flex;
    justify-content: center;
    background-color: var(--bs-white);
}
.credential_container {
    width: 50%;
    padding: 24px 80px 24px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.credential_logo_wrapper {
    max-width: 523px;
    width: 100%;
    margin: 0 auto;
    margin-bottom: 24px;
}
.credential_logo {
    width: 139px;
    height: 44px;
}
.credential_logo img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}
.credential_content_wrapper {
    max-width: 523px;
    width: 100%;
    margin: 0 auto;
}
.credential_content h1 {
    font-size: 32px;
    font-weight: 700;
    font-family: var(--primary-font);
}
.register-heading {
    font-size: 28px !important;
    font-weight: 700;
    font-family: var(--primary-font);
}
.credential_content p {
    font-size: 14px;
    font-family: var(--primary-font);
    color: var(--medium-gray);
    margin-top: 12px;
}
.credential-form-blk {
    margin-top: 54px;
}
.form-field-blk {
    position: relative;
}
.form-field-blk:not(:last-child) {
    margin-bottom: 32px;
}
.form-field-blk label {
    font-size: 12px;
    font-weight: 400;
    font-family: var(--primary-font);
    color: var(--primary-clr);
    position: absolute;
    content: "";
    top: -8px;
    left: 24px;
    z-index: 1;
    padding: 0px 4px;
    background: linear-gradient(0deg, #ffffff 53%, transparent 47%);
}
.form-field-blk .input-field :is(.form-control, .form-select) {
    padding: 16px 24px;
    border-radius: 10px;
    border: 1px solid var(--primary-clr);
    font-size: 14px;
    font-family: var(--primary-font);
    box-shadow: none;
}
.form-field-blk .input-field .form-control::placeholder {
    color: rgb(40 47 54 / 24%);
}

.password-input-field {
    padding-right: calc(24px + 22px + 10px) !important;
}
.eye-icon {
    position: absolute;
    content: "";
    top: 50%;
    right: 24px;
    width: 22px;
    height: 18px;
    background: var(--bs-white);
    transform: translateY(-50%);
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
}
.eye-icon i {
    font-size: 17.6px;
    color: var(--primary-clr);
}
.login_section .forgot_action_block {
    margin-top: 12px;
}

.forgotpsw-link {
    font-family: var(--primary-font);
    text-underline-offset: 6px;
}
section.credentials_section .form-btn-blk {
    max-width: 523px;
    margin: 54px auto 0px;
}
.form-btn {
    padding: 12px;
    text-decoration: none;
    display: block;
    text-align: center;
}
.have_an-account_blk {
    max-width: 523px;
    margin: 20px auto 0px;
    padding-top: 40px;
    border-top: 1px solid var(--gray-bg);
    text-align: center;
}
.have_an-account_blk p {
    font-family: var(--primary-font);
    font-size: 15px !important;
}
.have_an-account_blk p a {
    text-underline-offset: 6px;
    margin-left: 10px;
}

.credential_banner {
    width: 50%;
    height: 100vh;
    border-top-left-radius: 40px;
    border-bottom-left-radius: 40px;
    position: sticky;
    top: 0;
}
.credential_banner_wrapper {
    width: 100%;
    height: 100%;
    background: var(--primary-clr);
    border-top-left-radius: 40px;
    border-bottom-left-radius: 40px;
}
.credential_banner_wrapper img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-top-left-radius: 40px;
    border-bottom-left-radius: 40px;
}

.forgot_section :is(.credential-form-blk, .form-btn-blk) {
    margin-top: 40px !important;
}


.register_tab input.invalid {
    border-color: red !important;
}
.otp-field {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: clamp(6px, 2.5vw, 16px);
}
/* Six boxes that fit the row they are in: 74 px each on a desktop, shrinking together on a
   phone (six fixed 74 px boxes plus gaps ran off a 360 px screen — founder, Galaxy and iPhone,
   5 Oct 2026). Square at every size. Specific enough to beat the generic
   .form-field-blk .input-field :is(.form-control) padding and height above. */
.otp-field .form-control,
.form-field-blk .input-field.otp-field .form-control {
    flex: 0 1 74px;
    width: auto;
    min-width: 0;
    height: auto;
    aspect-ratio: 1 / 1;
    max-height: 74px;
    padding: 0;
    line-height: 1;
    text-align: center;
    font-size: 24px !important;
    font-weight: 600;
    color: var(--primary-clr) !important;
}

.form-flex-blk {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 32px 24px;
}
.form-flex-blk .form-flex-col{
    /* flex-grow: 1; */
    position: relative;
    width: calc(50% - 12px);
}
.register_steps_wrapper .credential-form-blk {
    margin-top: 32px;
}
.register_steps_wrapper .form-field-blk:not(:last-child) {
    margin-bottom: 32px;
}
.box-radio-wrapper {
    display: flex;
    justify-content: center;
    gap: 24px;
    flex-wrap: wrap;
}
.box-checkbox-wrapper {
    display: flex;
    justify-content: flex-start;
    gap: 16px;
    flex-wrap: wrap;
}
/* ---- Create account, steps 2 and 3 (founder, 5 Oct 2026): the page used to spread its few
   blocks over the whole screen height; the steps now sit under the logo, and the sports step is
   compact enough for the notifications box and the button to share a phone screen. --------- */
.register_section.is-step .credential_container {
    justify-content: flex-start;
}
.register_section.is-step .credential_logo_wrapper {
    margin-bottom: 8px;
}
.register_section.is-step .register_steps_wrapper .credential-form-blk {
    margin-top: 20px;
}
.register_sports {
    gap: 10px;
}
.register_sports .box-select-card {
    width: calc(50% - 5px);
}
.box-checkbox-wrapper.register_sports .box-select-card input + label {
    padding: 12px 10px;
}
.register_sports .sports_check_icon {
    width: 30px;
    height: 30px;
    margin-bottom: 4px;
}
.register_sports .box-select-card input + label h3 {
    font-size: 15px;
}
/* The notifications row on the sports step: a tile like the sports above it, ticked = teal edge. */
.register_alert {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    margin: 14px 0 0;
    padding: 12px 14px;
    border-radius: 8px;
    background: var(--bs-white);
    box-shadow: inset 0 0 0 1px var(--gray-bg);
    cursor: pointer;
}
.register_alert:has(input:checked) {
    box-shadow: inset 0 0 0 2px var(--theme-clr);
}
.register_alert input {
    flex: 0 0 auto;
    width: 22px;
    height: 22px;
    margin: 1px 0 0;
    accent-color: var(--theme-clr);
}
.register_alert__text {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
    font-family: var(--primary-font);
    color: var(--primary-clr);
}
.register_alert__text b {
    font-size: 15px;
    font-weight: 700;
    line-height: 1.3;
}
.register_alert__text span {
    font-size: 13px;
    line-height: 1.45;
    color: #6c757d;
}
.register_digest_note {
    margin: 12px 0 0;
    font-size: 13px;
    line-height: 1.45;
    color: #6c757d;
}
.register_section.is-step .form-btn-blk {
    margin-top: 20px;
}
.register_linkbtn {
    padding: 0;
    border: 0;
    background: none;
    text-decoration: underline;
    text-underline-offset: 3px;
}
.box-select-card {
    width: calc(50% - 12px);
}
.box-select-card input + label {
    position: static;
    padding: 24px;
    background: var(--bs-white);
    border: 0px;
    border-radius: 8px;
    width: 100%;
    height: 100%;
    cursor: pointer;
    box-shadow: inset 0px 0px 0px 1px var(--gray-bg);
}
.box-select-card input:checked + label {
    box-shadow: inset 0px 0px 0px 2px var(--theme-clr);
}
.box-select-card input + label h3 {
    font-size: 17.5px;
    font-weight: 700;
    font-family: var(--primary-font);
    color: var(--primary-clr);
    margin-bottom: 16px;
}
.box-select-card input + label p {
    font-size: 14px;
    font-weight: 400;
    font-family: var(--primary-font);
    color: var(--primary-clr);
    line-height: 16.94px;
    margin-bottom: 0px;
}
.box-checkbox-wrapper .box-select-card input + label {
    padding: 20px;
}
.box-select-card-icon {
    width: 20px;
    height: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.sports_check_icon {
    width: 42px;
    height: 42px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0px auto 8px;
}
.box-checkbox-wrapper .box-select-card input + label h3 {
    font-size: 16px;
    color: var(--medium-gray);
}
.box-checkbox-wrapper .box-select-card input:checked + label h3 {
    color: var(--theme-clr);
}
.box-checkbox-wrapper .box-select-card input:checked + label .sports_check_icon svg path {
    fill: var(--theme-clr);
}

.other_option_blk {
    max-width: 523px;
    width: 100%;
    margin: 0 auto;
}
.hr-divider {
    display: flex;
    justify-content: center;
    position: relative;
    overflow: hidden;
    z-index: 1;
    margin-top: 32px;
}
.hr-divider::before, .hr-divider::after {
    position: absolute;
    content: "";
    top: 50%;
    left: 0%;
    width: 100%;
    height: 1px;
    background: var(--gray-bg);
    z-index: -1;
}
span.or-with {
    background: var(--bs-white);
    padding: 0px 20px;
    font-size: 16px;
    color: var(--medium-gray);
    text-transform: capitalize;
}

.links-blk {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    margin: 32px 0px;
}
span.link-icon {
    width: 26px;
    display: flex;
    justify-content: center;
    align-items: center;
}
span.link-title {
    min-width: 100px;
}
.social-link {
    padding: 12px 18px;
    border: 1px solid var(--gray-bg);
    border-radius: 8px;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 15px;
    flex-grow: 1;
    text-decoration: none;
    text-transform: uppercase;
    font-size: 16px;
    font-weight: 600;
    font-family: var(--secondary-font);
    color: var(--primary-clr);
}

/* credential (login/signup) css end */

/* Single pages css(awaited/rejected/approved) start */

.single_page_header {
    padding: 24px;
    background: var(--primary-clr);
}
.single_page_logo {
    width: 105px;
    height: 48px;
    margin: 0 auto;
}
.single_page_logo img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}
.single_page_container {
    width: 100%;
    min-height: calc(100vh - 96px);
    height: 100%;
    background: var(--page-bg);
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 24px;
    overflow-y: auto;
}
.single_page_wrapper {
    max-width: 766px;
    width: 100%;
}
.single_page_icon {
    width: 80px;
    height: 80px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 auto 24px;
}
.single_page_icon img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}
.single_page_wrapper :is(h1, .h1) {
    font-size: 32px;
    font-weight: 700;
    font-family: var(--primary-font);
    margin-bottom: 24px;
}
.single_page_wrapper p {
    font-size: 18px;
    font-weight: 400;
    font-family: var(--primary-font);
    color: var(--medium-gray);
    line-height: 21.78px;
    margin-bottom: 0px;
}
.profile_awaited_wrapper h1 {
    color: var(--await-clr);
}
:is(.profile_rejected_wrapper, .profile_approved_wrapper) .single_page_icon {
    width: 84px;
    height: 84px;
}
.profile_rejected_wrapper h1 {
    color: var(--bs-red);
}
.profile_approved_wrapper h1 {
    color: var(--bs-approved);
}
.profile_awaited_step_wrapper {
    padding: 16px 0px;
}
:is(.profile_awaited_step_wrapper, .choose_plan_option_wrapper) h1 {
    font-size: 30px !important;
    margin-bottom: 32px !important;
}

.add_document_wrapper {
    padding: 24px;
    background: var(--bs-white);
    border-radius: 8px;
    border: 1px solid var(--gray-bg);
}
.add_document_field input + label {
    width: 100%;
    height: 155px;
    border: 1px dashed var(--primary-clr);
    border-radius: 8px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    gap: 10px;
    cursor: pointer;
}
span.add_doc_text {
    font-size: 12px;
    font-weight: 500;
    font-family: var(--primary-font);
    color: var(--primary-clr);
}
.add_document_preview {
    margin-top: 24px;
}
.add_document_preview h2 {
    font-size: 14px;
    font-weight: 600;
    font-family: var(--primary-font);
    color: var(--bs-black);
    margin-bottom: 0px;
}
.add_document_preview_list {
    margin-top: 12px;
}
.add_doc_preview_item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px;
    background: var(--page-bg);
    border: 1px solid var(--gray-bg);
    border-radius: 8px;
}
.add_doc_preview_item:not(:last-child) {
    margin-bottom: 8px;
}
.doc_file_detail {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 12px;
}
.doc_file_icon {
    width: 24px;
    height: 24px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.doc_filename {
    font-size: 16px;
    font-weight: 400;
    font-family: var(--primary-font);
    color: var(--primary-clr);
}
.remove_doc_btn {
    width: 12px;
    height: 12px;
    display: flex;
    justify-content: center;
    align-items: center;
    border: 0px;
    padding: 0px;
    background: transparent;
}
.remove_doc_btn img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}
.action_blk {
    margin-top: 32px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 16px;
}
.action_blk .primary-btn {
    min-width: 100px;
    padding: 12px 24px;
    border: 0px;
    background: var(--primary-clr);
    border-radius: 8px;
    font-size: 16px;
    font-weight: 600;
    font-family: var(--primary-font);
    color: var(--bs-white);
}
.primary-outline-btn {
    min-width: 100px;
    padding: 12px 24px;
    border: 1px solid var(--primary-clr);
    background: transparent;
    border-radius: 8px;
    font-size: 16px;
    font-weight: 600;
    font-family: var(--primary-font);
    color: var(--primary-clr);
}
.choose_plan_condition_field input + label {
    min-width: 100px;
    padding: 12px 24px;
    background: var(--page-bg);
    border: 1px solid var(--primary-clr);
    border-radius: 8px;
    font-size: 18px;
    font-weight: 600;
    font-family: var(--primary-font);
    color: var(--primary-clr);
    text-align: center;
    cursor: pointer;
}
.choose_plan_condition_field input:checked + label {
    background: var(--primary-clr);
    color: var(--bs-white);
}


.choose_plan_option_wrapper {
    max-width: 886px;
    width: 100%;
    padding: 16px 0px;
}
.choose_plan_content p {
    font-size: 14px;
    font-family: var(--primary-font);
    color: var(--primary-clr);
    line-height: 16.94px;
}
.choose_plan_content p:not(:last-child) {
    margin-bottom: 32px;
}
.choose_plan_opt_images_row {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-wrap: wrap;
    gap: 16px;
    margin-top: 32px;
}
.choose_plan_opt_img {
    width: 96.75px;
    height: 81.75px;
    border-radius: 8px;
    background: var(--gray-bg);
}
.choose_plan_opt_img img {
    width: 100%;
    height: 100%;
    border-radius: 8px;
    object-fit: cover;
}
.choose_plan_action .primary-btn {
    font-size: 18px;
}
.choose_plan_action_textfield {
    margin-top: 32px;
}

.choose_action_after_text {
    font-size: 18px;
    font-weight: 700 !important;
    font-family: var(--primary-font) !important;
    color: var(--primary-clr) !important;
    margin-bottom: 0px;
    line-height: 21.78px;
}

.choose_plan_proceed_blk {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 16px;
    margin-top: 32px;
}
.text_arrow_relative_btn {
    text-decoration: none;
    display: inline-flex;
    justify-content: flex-end;
    align-items: center;
    gap: 12px;
    position: relative;
}
.text_arrow_static_btn {
    text-decoration: none;
    display: inline-flex;
    justify-content: flex-end;
    align-items: center;
    gap: 12px;
}
.text_arrow_relative_btn::before {
    position: absolute;
    content: "";
    bottom: -2px;
    left: 0;
    width: 100%;
    height: 1px;
    background: var(--primary-clr);
}
.bnt-text {
    width: calc(100% - 28px);
    font-size: 16px;
    font-weight: 600;
    font-family: var(--primary-font);
    color: var(--primary-clr);
}
.bnt-icon {
    width: 16px;
    height: 12px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.bnt-icon img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.plan_section {
    margin-top: 60px;
    display: flex;
    justify-content: flex-start;
    flex-wrap: wrap;
    gap: 60px;
}

.subscription_container {
    max-width: 1246px;
    width: 100%;
}

.subscription_heading h1 {
    width: 100%;
    text-align: center;
    font-size: 14px;
    font-weight: 700;
    font-family: var(--primary-font);
    color: var(--primary-clr);
    text-transform: uppercase;
}
.subscription_sub_heading h2 {
    font-size: 24px;
    font-weight: 700;
    font-family: var(--primary-font);
    color: var(--primary-clr);
    margin-bottom: 0px;
    line-height: 29.05px;
}
.plan_detail_header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    flex-wrap: wrap;
    gap: 24px;
}
.subscription_sub_heading {
    width: calc(100% - (182.27px + 24px));
}
.subscription_plan_tabs {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    width: 182.27px;
}
.subscription_period_btn {
    padding: 12px 20px;
    border: 1px solid var(--gray-bg);
    background: var(--bs-white);
    border-radius: 8px;
    font-size: 12px;
    font-weight: 600;
    font-family: var(--primary-font);
    color: var(--primary-clr);
    line-height: 14.52px;
}
.subscription_period_btn:first-child {
    border-radius: 8px 0px 0px 8px;
}
.subscription_period_btn:last-child {
    border-radius: 0px 8px 8px 0px;
}
.subscription_period_btn.active {
    border-color: var(--primary-clr);
    background: var(--primary-clr);
    color: var(--bs-white);
}
.plan_noification_text_blk {
    margin-top: 6px;
}
.plan_noification_text_blk p {
    font-size: 18px;
    font-weight: 600;
    font-family: var(--primary-font);
    line-height: 21.78px;
    display: inline-block;
}
.plan_offer_notify_text {
    color: var(--bs-custom-green);
}
.plan_end_notify_text {
    color: var(--bs-custom-red);
}

.plan_wrapper {
    width: calc(100% - (320px + 60px));
}
.plan_card_wrapper {
    margin-top: 54px;
    display: flex;
    justify-content: flex-start;
    flex-wrap: wrap;
    gap: 24px;
}
.plan_card {
    width: 198.5px;
    padding: 24px;
    background: var(--bs-white);
    border-radius: 8px;
    box-shadow: 0px 0px 12px rgba(0,0,0,0.08);
    position: relative;
    border: 1px solid var(--gray-bg);
}
.current_plan {
    background: var(--primary-clr);
    border-color: var(--primary-clr);
}
.current_plan :is(.plan_card h3, span.amount_blk, .plan_info p, .plan_card_feature_detail ul.plan_feature_list li) {
    color: var(--page-bg);
}
.plan_card h3 {
    font-size: 16px;
    font-weight: 600;
    font-family: var(--primary-font);
    color: var(--primary-clr);
    margin-bottom: 0px;
}
span.amount_blk {
    font-size: 24px;
    font-weight: 700;
    font-family: var(--primary-font);
    color: var(--primary-clr);
    margin: 20px 0px;
    display: block;
}
.plan_btn_blk {
    margin: 20px 0px;
}
.plan_action_btn {
    padding: 10.5px;
    font-size: 14px;
    font-weight: 600;
    font-family: var(--pp-font);
    color: var(--primary-clr);
    border: 1px solid var(--primary-clr);
    border-radius: 8px;
    width: 100%;
    text-align: center;
    background: var(--bs-white);
    line-height: 19px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}
.plan_action_btn span {
    font-size: 8px;
    font-weight: 500;
    font-family: var(--pp-font);
    line-height: 12px;
}
.current_plan_btn {
    background: #1CB902;
    border-color: #1CB902;
    color: var(--bs-white);
    padding: 4.5px 10.5px;
    border-color: #1CB902;
}
.continue_plan_btn {
    background: #EEB231;
    color: var(--bs-white);
    border-color: #EEB231;
}
.plan_info {
    margin-bottom: 20px;
}
.plan_info p {
    font-size: 12px;
    font-weight: 400;
    font-family: var(--primary-font);
    color: var(--medium-gray);
    line-height: 14.52px;
}
.plan_card_feature_detail {
    padding-top: 20px;
    border-top: 1px solid var(--gray-bg);
}
.current_plan .plan_card_feature_detail {
    border-color: var(--page-bg);
}
.plan_card_feature_detail ul.plan_feature_list {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 8px;
    max-width: 250px;
}
.plan_card_feature_detail ul.plan_feature_list li {
    width: 100%;
    position: relative;
    padding-left: 17px;
    font-size: 12px;
    font-weight: 400;
    font-family: var(--primary-font);
    color: var(--medium-gray);
    line-height: 14.52px;
}
.plan_card_feature_detail ul.plan_feature_list li::before {
    position: absolute;
    content: "";
    top: 2px;
    left: 0;
    width: 10px;
    height: 10px;
    background: url(../images/icons/plan-list-icon.svg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}
.recommended_plan {
    border-width: 2px;
    border-color: var(--primary-clr);
}
.recommended_badge {
    position: absolute;
    content: "";
    top: -28px;
    left: 50%;
    padding: 8px 12px;
    background: var(--primary-clr);
    font-size: 14px;
    font-weight: 600;
    font-family: var(--primary-font);
    color: var(--bs-white);
    text-transform: uppercase;
    border-radius: 6px;
    transform: translateX(-50%);
}
.recommended_plan .plan_action_btn {
    background: var(--primary-clr);
    color: var(--bs-white);
}
.price_structure_wrapper {
    width: 320px;
}
.price_structure_inner_blk {
    padding: 16px 24px;
    background: var(--bs-white);
    border: 1px solid var(--gray-bg);
    border-radius: 8px;
    box-shadow: 0px 0px 12px rgba(0,0,0,0.08);
}
.price_structure_inner_blk h2 {
    font-size: 18px;
    font-weight: 700;
    font-family: var(--primary-font);
    color: var(--primary-clr);
    line-height: 21.78px;
}
.price_str_table {
    margin-top: 20px;
}

/* == price structure without table start == */

.price_str_table .inner_str_table {
    border-radius: 8px;
    border: 1px solid var(--gray-bg);
}
.price_str_table :is(.price_str_table_head, .price_str_table_body) {
    display: flex;
    flex-wrap: wrap;
}
.price_str_table .price_str_table_head span {
    width: 50%;
    font-size: 16px;
    font-weight: 700;
    font-family: var(--primary-font);
    color: var(--primary-clr);
    text-align: center;
    padding: 24px 16px;
    border: 1px solid var(--gray-bg);
    display: inline-block;
}
.price_str_tr {
    width: 100%;
    display: flex;
}
.price_str_table .price_str_table_body span {
    width: 50%;
    font-size: 14px;
    font-weight: 400;
    font-family: var(--primary-font);
    color: var(--primary-clr);
    text-align: center;
    padding: 16px 16px;
    line-height: 16.94px;
    height: 66px;
    border: 1px solid var(--gray-bg);
    display: inline-flex;
    justify-content: center;
    align-items: center;
}
.price_str_table .price_str_table_head span:first-child {
    border-radius: 8px 0px 0px 0px !important;
    border-width: 0px 1px 1px 0px;
}
.price_str_table .price_str_table_head span:last-child {
    border-radius: 0px 8px 0px 0px !important;
    border-width: 0px 0px 1px 0px;
}
.price_str_table .price_str_table_body .price_str_tr span:first-child {
    border-width: 0px 1px 1px 0px;
}
.price_str_table .price_str_table_body .price_str_tr span:last-child {
    border-width: 0px 0px 1px 0px;
}
.price_str_table .price_str_table_body .price_str_tr:last-child span:first-child {
    border-width: 0px 1px 0px 0px;
}
.price_str_table .price_str_table_body .price_str_tr:last-child span:last-child {
    border-width: 0px 0px 0px 0px;
}

/* == pstr without table end == */

.plan_card.disabled {
    pointer-events: none;
    user-select: none;
}
.plan_card.disabled :is(h3, .amount_blk, .plan_info p) {
    color: var(--light-gray);
}
.plan_card.disabled .plan_action_btn {
    color: var(--light-gray);
    border-color: var(--light-gray);
}
.recommended_plan.disabled {
    border-color: var(--light-gray);
}
.recommended_plan.disabled :is(.plan_action_btn, .recommended_badge) {
    background: var(--light-gray);
    color: var(--bs-white);
}
.no_subscription_plan span.amount_blk {
    font-size: 28px;
}
.no_subscription_plan .plan_action_btn {
    font-size: 16px;
}
.no_subscription_plan .plan_info {
    margin-bottom: 0px;
}
.no_subscription_plan .plan_info p {
    font-size: 16px;
    line-height: 19.36px;
}
.no_subscription_plan .price_structure_inner_blk h2 {
    font-size: 20px;
    line-height: 24.2px;
}

/* Single pages css(awaited/rejected/approved) end */


/* Header css start */

header {
    padding: 20px 0px 20px;
    position: sticky;
    top: 0;
    left: 0;
    z-index: 5;
    background-color: var(--dark-page-bg);
}
.header-flex {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 15px;
}

.header-menu-list {
    list-style: none;
    padding-left: 0px;
    margin-bottom: 0px;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 12px;
}
.header-menu-list li.nav-item {
    display: flex;
    justify-content: center;
    align-items: center;
}

.header-link-btn {
    width: 22px;
    height: 22px;
    padding: 0px;
    border: 0px;
    background: var(--bs-white);
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
}
.profile_btn img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    border-radius: 50%;
}
header button.opnBtn {
    width: 22px;
    height: 22px;
    line-height: 22px;
    background-color: transparent;
    color: var(--bs-black);
    border: 0px;
    padding: 0px;
    border-radius: 0px;
    z-index: 2;
    display: none !important;
}
button.opnBtn i {
    font-size: 22px;
    color: var(--bs-black);
}


.back-link {
    width: 39px;
    height: 39px;
    background: #efefef;
    border: 1px solid #efefef;
    color: #a2a0a7 !important;
    border-radius: 12px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
}
.back-link svg {
    width: 14px;
    height: 14px;
}

.select_location_style {
    padding: 10px 18px;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 4px;
    font-size: 13px;
    font-family: var(--primary-font);
    color: var(--bs-white);
    text-decoration: none;
    border-radius: 50px;
    border: 1px solid var(--gray-54);
    background: var(--dark-page-bg);
}
:is(.login-btn, .select_location_style) span {
    line-height: normal;
}
span#mainLocation {
    max-width: 175px;
    width: 100%;
    overflow: hidden;
}

.login-btn {
    padding: 10px 22px;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 4px;
    font-size: 13px;
    font-family: var(--primary-font);
    text-decoration: none;
    border-radius: 50px;
    background: var(--theme-clr);
    border: 1px solid var(--theme-clr);
    color: var(--bs-white);
    transition: all 0.3s ease-in-out;
}


/* The account menu trigger: the avatar in a pill that says Menu (11 Sep 2026 — a bare
   avatar with a chevron badge did not read as a menu). Same outline as the location pill. */
.profile_preview_nav {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    height: 40px;
    padding: 2px 14px 2px 2px;
    border-radius: 50px;
    border: 1px solid var(--gray-54);
    background: var(--dark-page-bg);
    color: var(--bs-white);
    font-family: var(--primary-font);
    position: relative;
    transition: border-color 0.15s ease;
}
.profile_preview_nav:hover,
.profile_preview_nav:focus-visible,
.profile_preview_nav[aria-expanded="true"] {
    border-color: var(--theme-clr);
}
.profile_preview_nav img {
    width: 34px;
    height: 34px;
    object-fit: cover;
    border-radius: 50%;
    flex: 0 0 auto;
}
.profile_preview_nav__label {
    /* exactly the location pill beside it — .select_location_style: 13px regular, lower case (23 Sep 2026) */
    font-size: 13px;
    font-weight: 400;
    letter-spacing: 0;
    text-transform: none;
    line-height: 1;
}
.profile_preview_nav__chevron {
    flex: 0 0 auto;
    transition: transform 0.15s ease;
}
.profile_preview_nav[aria-expanded="true"] .profile_preview_nav__chevron {
    transform: rotate(180deg);
}
.after_login_nav ul {
    width: 320px;
    border-radius: 8px;
    border: 1px solid var(--gray-54);
    box-shadow: 0px 0px 15px rgba(0,0,0,0.15);
    transform: translate(0px, 46px) !important;
    background: var(--dark-page-bg);
}
.after_login_nav ul::before {
    position: absolute;
    content: "";
    top: -5px;
    right: 12px;
    width: 12px;
    height: 12px;
    background: var(--dark-page-bg);
    border: 1px solid var(--gray-54);
    border-width: 1px 0px 0px 1px;
    border-radius: 2px;
    transform: rotate(45deg);
}
.after_login_nav :is(.dropdown-item.active, .dropdown-item:active) {
    background-color: var(--bs-black) !important;
    color: var(--bs-white) !important;
}
.after_login_nav .dropdown-toggle::after {
    display: none;
}
.after_login_nav ul li:first-child {
    border-bottom: 0.5px solid #E5EAF2;
    padding: 5px 0px;
    margin: 0px 16px 16px;
}
.after_login_nav ul li:not(:first-child) {
    margin: 0px 16px 10px;
}
.after_login_nav ul li:last-child {
    margin-bottom: 16px;
}
.user-detail-blk {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 10px;
    padding: 20px 0px;
}
/* Each item is a card: the site grey on the black panel, a teal border, black type;
   hover/focus/active turn it black with white type, the border staying teal (11 Sep 2026). */
.after_login_nav .drop-menu-links {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 10px;
    width: auto;
    padding: 12px 16px;
    border-radius: 10px;
    border: 1px solid var(--theme-clr);
    background: var(--page-bg);
    font-size: 17px;
    font-weight: 500;
    font-family: var(--primary-font);
    color: var(--bs-black);
    transition: background-color 0.15s ease, color 0.15s ease;
}
.after_login_nav .drop-menu-links:hover,
.after_login_nav .drop-menu-links:focus-visible,
.after_login_nav .drop-menu-links:active,
.after_login_nav .drop-menu-links.active {
    background: var(--bs-black);
    color: var(--bs-white);
    border-color: var(--theme-clr);
}
/* Logout is not a destination: a small white underlined link, right-aligned under the cards. */
.after_login_nav .drop-menu-links.drop-menu-links--quiet,
.after_login_nav .drop-menu-links.drop-menu-links--quiet:hover,
.after_login_nav .drop-menu-links.drop-menu-links--quiet:focus-visible,
.after_login_nav .drop-menu-links.drop-menu-links--quiet:active {
    display: flex;
    justify-content: flex-end;
    background: transparent !important;
    border: 0;
    border-radius: 0;
    padding: 4px 2px;
    margin-top: 2px;
    font-size: 14px;
    font-weight: 500;
    color: var(--bs-white) !important;
    text-decoration: underline;
    text-underline-offset: 3px;
}
.after_login_nav .drop-menu-links.drop-menu-links--quiet:hover,
.after_login_nav .drop-menu-links.drop-menu-links--quiet:focus-visible {
    text-decoration-thickness: 2px;
}
.drop-menu-links i {
    color: var(--theme-clr);
    background: #f9f9f9;
    padding: 10px;
    border-radius: 8px;
    display: none;
}
.drop-menu-links svg {
    width: 22px;
    height: 22px;
}

.user-profile {
    width: 42px;
    height: 42px;
    border-radius: 50%;
}
.user-profile img {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    object-fit: cover;
}
.user-profile-detail {
    width: calc(100% - 52px);
    white-space: nowrap;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}
span.user-name {
    font-size: 18px;
    font-weight: 600;
    font-family: var(--primary-font);
    line-height: normal;
    color: var(--bs-white);
}
span.user-current-status {
    font-size: 12px;
    font-weight: 400;
    font-family: var(--pp-font);
    line-height: normal;
    color: #959595;
}

.header_sports_nav {
    display: flex;
    justify-content: center;
    align-items: center;
}
.header_sports_nav_blk {
    justify-content: center;
    padding: 4px 8px;
    border: 2px solid var(--gray-54);
    border-radius: 60px;
}
.collapse_nav_menu {
    padding: 20px;
    border-radius: 14px;
    background: #141414;
    border: 2px solid var(--gray-54);
}
.collapse_nav_menu a.sports_nav_link:not(:last-child) {
    margin-bottom: 10px;
}
.collapse_nav_menu a.sports_nav_link {
    width: 100%;
}
.sports_nav_link {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    gap: 8px;
    padding: 8px 20px;
    font-size: 16px;
    font-family: var(--primary-font);
    color: var(--bs-white);
    background: var(--bs-black);
    border: 1px solid var(--bs-black);
    border-radius: 50px;
    cursor: pointer;
    min-width: 65px;
    text-decoration: none;
    line-height: normal;
    transition: all 0.2s ease-in-out;
}
a.sports_nav_link:is(.active, :hover, :active) {
    background: var(--theme-clr);
    border-color: var(--theme-clr);
}

a.sports_nav_link.lh-1:is(:hover, :active, .show) {
    background: transparent;
    border-color: transparent;
    color: var(--theme-clr);
}
/* Compact pills for 5+ sports — reduce size to prevent wrapping on wide screens */
.nav-compact .sports_nav_link {
    padding: 6px 14px;
    font-size: 14px;
    min-width: 52px;
}
/* Sport icon badge on event cards in all-sports listing mode */
.event_sport_icon_badge {
    position: absolute;
    top: 10px;
    left: 10px;
    width: 36px;
    height: 36px;
    background: rgba(0, 0, 0, 0.55);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 2;
}
.event_sport_icon_badge img {
    width: 22px;
    height: 22px;
    object-fit: contain;
}
/* Profile tile sport icons — top-left, dark circle buttons matching event tiles */
.offering_item_card .sports_type_elements {
    background: transparent;
    padding: 0;
    gap: 4px;
}
.offering_item_card .sports_type_elements button {
    width: 36px;
    height: 36px;
    background: rgba(0, 0, 0, 0.55);
}
.offering_item_card .sports_type_elements button img {
    width: 22px;
    height: 22px;
}
.gray_btn_style {
    padding: 22px 40px;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 4px;
    font-size: 20px;
    font-family: var(--primary-font);
    text-decoration: none;
    background: #262626;
    color: var(--bs-white);
    border-radius: 60px;
}


.change_preference_nav_link {
    font-size: 14px;
    font-family: var(--primary-font);
    color: var(--bs-white);
    padding: 0px 8px;
    transition: all 0.2s ease-in-out;
    white-space: nowrap;
}
.change_preference_nav_link:hover {
    color: var(--theme-clr);
}


/* Header css end */
.coming_soon {
    align-items: center !important;
}
.coming_soon .hero-images-blk {
    max-width: 500px;
    margin: 0 auto;
}
.coming_soon .svg-blk svg {
    width: 100%;
    height: 100%;
}
.coming_soon .hero-images-blk::before {
    background: linear-gradient(0deg, #000000, #000000c7) !important;
}
.coming_soon .hero-images-blk::after {
    display: none !important;
}
.coming_soon .hero-content-wrapper h1 {
    font-size: 58px;
    font-weight: 600;
    font-family: var(--primary-font);
    color: #ffffff;
    text-align: center;
    text-shadow: 1px 7px 8px #000000;
}
.hero_section {
    width: 100%;
    min-height: calc(58vh - var(--header-height));
    height: 100%;
    padding-bottom: 55px;
    display: flex;
    justify-content: center;
    align-items: flex-end;
    background: var(--dark-page-bg);
    background-repeat: no-repeat !important;
    background-size: cover !important;
    background-position: center !important;
    position: relative;
    z-index: 2;
}

.hero-main-wrapper {
    padding: 0px 12px;
}
.hero-images-blk {
    max-width: 654px;
    margin: 0 auto;
}
.hero-images-blk::before {
    position: absolute;
    content: "";
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(0deg, #000000, #00000060);
    z-index: 1;
}
.hero-images-blk::after {
    position: absolute;
    content: "";
    top: 50%;
    left: 50%;
    width: 616px;
    height: 616px;
    border: 1px solid #cbcbcb;
    border-radius: 50%;
    transform: translate(-50%, -50%);
    z-index: -1;
}
.hero-img {
    position: absolute;
    content: "";
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    max-width: 452px;
    width: 100%;
    height: auto;
}
.hero-img img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.hero-content-wrapper {
    position: absolute;
    content: "";
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    z-index: 1;
    margin-top: 140px;
}
.svg-blk {
    text-align: center;
}
.hero-content-wrapper h1 {
    font-size: 52px;
    font-weight: 500;
    font-family: var(--primary-font);
    color: var(--bs-white);
    text-align: center;
}
.hero_select_info {
    margin-top: 148px;
}
.hero-content-wrapper p {
    font-size: 28px;
    font-family: var(--primary-font);
    font-weight: 500;
    color: var(--bs-white);
    text-align: center;
}

span.hero_down_arrow {
    width: 50px;
    height: 25px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 60px auto 0px;
    animation: movedown 2.5s infinite linear;
}
@keyframes movedown {
    0% {
        opacity: 0;
    }
    50% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}

.select_sports_wrapper {
    display: flex;
    justify-content: center;
    width: 100%;
    margin-top: 32px;
}
.select_sports_tabs_blk {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    gap: 24px 23px;
    max-width: 995px;
}
.sports_list_item {
    position: relative;
    text-align: center;
}
.sports_list_item::before {
    position: absolute;
    content: "";
    top: -4px;
    left: 0;
    width: 100%;
    height: 100%;
    border: 2px solid var(--gray-54);
    border-radius: 60px;
    filter: blur(3px);
}
.sports_list_item input + label {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    gap: 8px;
    padding: 22px 40px;
    font-size: 42px;
    font-family: var(--primary-font);
    background: rgb(0 0 0 / 0%);
    border: 2px solid var(--gray-54);
    border-radius: 50px;
    cursor: pointer;
    position: relative;
}
.tab_pills_title {
    line-height: normal;
    white-space: nowrap;
}
.sports_list_item input + label .tab_pills_title {
    color: var(--gray-54);
}
.sports_list_item input:checked + label {
    border-color: var(--theme-clr);
    background: var(--theme-clr);
}
.sports_list_item input:checked + label .tab_pills_title {
    color: var(--bs-white);
}
.sports_list_item input:checked + label .tab_pills_icon svg path {
    fill: var(--theme-clr);
}
.proceed_action_blk {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 16px;
    margin-top: 75px;
}
.proceed-btn {
    padding: 15px 40px;
    font-size: 16px !important;
    font-weight: 500 !important;
}
.proceed-btn-outline {
    padding: 16px 40px;
    font-size: 20px !important;
    font-weight: 400 !important;
    background: transparent;
    border-color: var(--bs-white);
}


section.item_section {
    background: var(--dark-page-bg);
    padding: 70px 0px 100px;
}
.item_outer_wrapper {
    border: 3px solid var(--gray-54);
    border-radius: 20px;
    max-width: 1242px;
    margin: 0 auto;
    padding: 48px 20px 130px;
    position: relative;
}
.blob_item {
    position: absolute;
    content: "";
    top: -70px;
    left: 50%;
    width: 100%;
    height: auto;
    transform: translateX(-50%);
    display: flex;
    justify-content: center;
    align-items: center;
}
.sportspal_icon {
    width: 70px;
    height: 70px;
    background: var(--page-bg);
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 25px;
    margin: 0 auto;
    box-shadow: 6px 6px 8px rgba(0,0,0,0.25);
}
.sportspal_icon img {
    object-fit: contain;
}
.item_heading_blk {
    margin: 36px 0px 60px;
}
.item_heading_blk h2 {
    font-size: 60px;
    font-weight: 400;
    font-family: var(--primary-font);
    color: var(--bs-white);
    text-align: center;
}
.item_buttons_list {
    display: flex;
    justify-content: center;
    align-items: flex-start;
    flex-wrap: wrap;
    gap: 25px 100px;
}
.item_btns_blk {
    position: relative;
}
.item_btns {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 16px;
    background: transparent;
    padding: 0px;
}
span.item_title {
    font-size: 32px;
    font-weight: 400;
    font-family: var(--primary-font);
    color: var(--gray-54);
    display: inline-block;
    transition: all 0.2s ease-in-out;
}
.item_btns:is(.active, :hover) .item_title {
    color: var(--bs-white);
}
.item_btns:is(.active, :hover) svg path {
    fill: var(--theme-clr);
    transition: all 0.2s ease-in-out;
}
.items_content {
    padding: 26px 24px 30px;
    border: 3px solid var(--gray-54);
    border-radius: 20px;
    min-width: 320px;
    width: 100%;
    position: absolute;
    content: "";
    top: calc(100% + 30px);
    left: 50%;
    transform: translateX(-50%);
    background: rgba(0,0,0,0.7);
    display: none;
}
.item_btns.active + .items_content {
    display: block;
}
.items_content p, .all_items_content p {
    font-size: 16px;
    font-weight: 400;
    font-family: var(--primary-font);
    color: var(--bs-white);
    margin-bottom: 0px;
    text-align: center;
}
.all_items_content {
    padding: 26px 24px 30px;
    border: 3px solid var(--gray-54);
    border-radius: 20px;
    min-width: 320px;
    width: 100%;
    position: absolute;
    content: "";
    top: calc(100% + 30px);
    left: 50%;
    transform: translateX(-50%);
    background: rgba(0, 0, 0, 0.7);
    display: none;
}


section.cta_banner_section {
    padding: 120px 0px;
    position: relative;
    background: var(--gray-f4);
}
.cta_banner_section::before {
    position: absolute;
    content: "";
    top: 0;
    left: 0;
    width: 100%;
    height: 220px;
    background: var(--dark-page-bg);
    z-index: 0;
}
.cta_banner_wrapper {
    padding: 45px 60px 58px;
    border-radius: 20px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
    position: relative;
    z-index: 0;
    background: var(--bs-white);
    box-shadow: 0px 28px 28px rgb(48 47 45 / 25%);
    max-width: 1242px;
    margin: 0 auto;
}
.cta_banner_content {
    max-width: 600px;
}

span.primary_badge {
    padding: 8px 14px;
    background: var(--theme-clr);
    font-size: 20px;
    font-weight: 400;
    font-family: var(--primary-font);
    color: var(--bs-white);
    border-radius: 10px;
}
.cta_banner_content h2 {
    font-size: 38px;
    font-weight: 500;
    color: var(--bs-black);
    margin: 32px 0px;
}
.cta_list_style {
    display: flex;
    justify-content: flex-start;
    align-items: baseline;
    gap: 24px;
}
.list_curved_icon {
    width: 20px;
    height: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.list_curved_icon img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}
.cta_banner_content p.cta_list_content {
    font-size: 20px;
    color: var(--bs-black);
    margin-bottom: 0px;
    font-weight: 400;
    line-height: 30px;
    width: calc(100% - 44px);
}
.cta_banner_img {
    position: absolute;
    content: "";
    bottom: 0;
    right: 0px;
    /* The box the phone lives in: it clips the phone at the card's bottom edge (as the old
       cut-out PNG did) and reaches above the card's top so the phone rises over the dark band. */
    width: 500px;
    height: 520px;
    overflow: hidden;
    pointer-events: none;
    /* The phone's accent: Sportspal teal, or the campaign gold inside the founders window
       (the same gold as the card's "founders offer" badge). Everything on the screen that marks
       "you" reads from these three tokens. */
    --cta-phone-accent: var(--theme-clr);
    --cta-phone-accent-rgb: 0, 169, 157;
    --cta-phone-accent-ink: #fff;
}
.cta_banner_img--founders {
    --cta-phone-accent: #e6b33d;
    --cta-phone-accent-rgb: 230, 179, 61;
    --cta-phone-accent-ink: #171200;
}

/* ---- Organiser CTA phone (29 Sep 2026) ----------------------------------------------------
   A current flat-edged iPhone (Dynamic Island, no notch) drawn in CSS, replacing the PNG that
   had an "in beta" badge on its screen. Light titanium frame so it reads against both the dark
   band above the card and the white card itself. Every animation is decorative and switched
   off under prefers-reduced-motion. --------------------------------------------------------- */
.cta_banner_img::before {
    content: "";
    position: absolute;
    left: 60px;
    right: 0;
    top: 40px;
    height: 440px;
    border-radius: 50%;
    background: radial-gradient(closest-side, rgba(var(--cta-phone-accent-rgb), 0.42), rgba(var(--cta-phone-accent-rgb), 0));
    filter: blur(14px);
}
.cta_phone {
    position: absolute;
    right: 40px;
    top: 30px;
    width: 300px;
    transform: perspective(1400px) rotateY(-10deg) rotateX(3deg);
    transform-origin: 50% 40%;
    animation: cta-phone-float 7s ease-in-out infinite;
}
.cta_phone__frame {
    position: relative;
    width: 300px;
    height: 640px;
    padding: 9px;
    border-radius: 52px;
    background: linear-gradient(160deg, #fbfbfc 0%, #d6d6da 38%, #f2f2f4 66%, #bfbfc4 100%);
    box-shadow:
        0 60px 80px -30px rgba(0, 0, 0, 0.5),
        0 20px 30px -20px rgba(0, 0, 0, 0.35),
        inset 0 0 0 1px rgba(255, 255, 255, 0.7),
        inset 0 0 0 3px rgba(0, 0, 0, 0.06);
}
.cta_phone__btn {
    position: absolute;
    width: 3px;
    border-radius: 2px;
    background: linear-gradient(to bottom, #e6e6e9, #b9b9be);
}
.cta_phone__btn--action { left: -3px; top: 118px; height: 24px; }
.cta_phone__btn--vol-up { left: -3px; top: 162px; height: 50px; }
.cta_phone__btn--vol-down { left: -3px; top: 222px; height: 50px; }
.cta_phone__btn--power { right: -3px; top: 188px; height: 84px; }
.cta_phone__screen {
    position: relative;
    height: 100%;
    border-radius: 44px;
    overflow: hidden;
    background: #09090a;
    color: #fff;
    font-family: var(--secondary-font), sans-serif;
    box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.9);
}
.cta_phone__island {
    position: absolute;
    top: 12px;
    left: 50%;
    width: 96px;
    height: 29px;
    margin-left: -48px;
    border-radius: 20px;
    background: #000;
    z-index: 2;
}
.cta_phone__status {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 19px 28px 0;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.01em;
}
.cta_phone__status-icons { display: inline-flex; align-items: center; gap: 6px; color: #fff; }
.cta_phone__status-icons svg:first-child { width: 17px; height: 12px; }
.cta_phone__status-icons svg:last-child { width: 26px; height: 12px; }
.cta_phone__app { padding: 18px 16px 0; }
.cta_phone__header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 32px;
}
.cta_phone__logo { height: 20px; width: auto; }
.cta_phone__pill {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 5px 11px;
    border-radius: 30px;
    background: var(--theme-clr);
    font-size: 11px;
    font-weight: 600;
    line-height: 1;
}
.cta_phone__pill img { width: 9px; height: 11px; }
.cta_phone__search {
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 12px 14px;
    border-radius: 14px;
    background: #1b1b1e;
    border: 1px solid #2b2b30;
    font-size: 13.5px;
    line-height: 1;
}
.cta_phone__search svg { width: 15px; height: 15px; color: #9a9aa0; flex: none; }
.cta_phone__caret {
    display: inline-block;
    width: 1.5px;
    height: 14px;
    margin-left: 2px;
    vertical-align: -2px;
    background: var(--cta-phone-accent);
    animation: cta-phone-caret 1s steps(2, start) infinite;
}
.cta_phone__chips { display: flex; gap: 6px; margin: 12px 0 18px; overflow: hidden; }
.cta_phone__chips span {
    padding: 6px 11px;
    border-radius: 30px;
    background: #1b1b1e;
    font-size: 11px;
    line-height: 1;
    color: #b9b9be;
    white-space: nowrap;
}
.cta_phone__chips span.is-active { background: #fff; color: #000; font-weight: 600; }
.cta_phone__label {
    margin-bottom: 9px;
    font-size: 10.5px;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #85858c;
}
.cta_phone__card {
    position: relative;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px;
    margin-bottom: 9px;
    border-radius: 15px;
    background: #141416;
    border: 1px solid #222226;
}
.cta_phone__card img { width: 48px; height: 48px; border-radius: 11px; object-fit: cover; flex: none; }
.cta_phone__card strong { display: block; font-size: 13px; font-weight: 600; line-height: 1.2; }
.cta_phone__card small { display: block; margin-top: 3px; font-size: 11px; color: #9a9aa0; }
.cta_phone__card.is-you {
    border-color: var(--cta-phone-accent);
    box-shadow: 0 0 0 3px rgba(var(--cta-phone-accent-rgb), 0.2);
}
.cta_phone__you {
    position: absolute;
    top: -9px;
    right: 12px;
    padding: 3px 8px;
    border-radius: 20px;
    background: var(--cta-phone-accent);
    color: var(--cta-phone-accent-ink);
    font-size: 10px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0.04em;
}
.cta_phone__heart {
    position: absolute;
    right: 11px;
    bottom: 9px;
    width: 16px;
    height: 16px;
    color: var(--cta-phone-accent);
    animation: cta-phone-heart 2.8s ease-in-out infinite;
}
.cta_phone__heart svg { display: block; width: 100%; height: 100%; fill: currentColor; }
.cta_phone__notice {
    position: absolute;
    z-index: 3;
    left: 10px;
    right: 10px;
    top: 40px;
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 8px 10px;
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.96);
    color: #111;
    box-shadow: 0 14px 30px -10px rgba(0, 0, 0, 0.65);
    animation: cta-phone-notice 7s ease-in-out infinite;
}
.cta_phone__notice img {
    width: 28px;
    height: 28px;
    padding: 5px;
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.1);
    flex: none;
}
.cta_phone__notice small {
    display: block;
    margin-bottom: 1px;
    font-size: 9px;
    font-weight: 600;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: #6b6b70;
}
.cta_phone__notice span { display: block; font-size: 12px; line-height: 1.2; }
.cta_phone__notice strong { display: block; font-weight: 700; }
@keyframes cta-phone-float {
    0%, 100% { translate: 0 0; }
    50% { translate: 0 -10px; }
}
@keyframes cta-phone-caret { 50% { opacity: 0; } }
@keyframes cta-phone-heart {
    0%, 68%, 100% { transform: scale(1); }
    76% { transform: scale(1.4); }
    84% { transform: scale(1); }
}
@keyframes cta-phone-notice {
    0%, 8% { opacity: 0; translate: 0 -18px; }
    16%, 84% { opacity: 1; translate: 0 0; }
    92%, 100% { opacity: 0; translate: 0 -18px; }
}
@media (prefers-reduced-motion: reduce) {
    .cta_phone, .cta_phone__caret, .cta_phone__heart, .cta_phone__notice { animation: none; }
    .cta_phone__notice { opacity: 1; }
}

footer {
    background: var(--footer-bg);
}
.footer_nav_wrapper {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    flex-wrap: wrap;
    gap: 30px 100px;
    padding: 70px 0px 50px;
}
.footer_logo_wrapper {
    width: 400px;
}
.footer-logo {
    width: 140px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.footer_content {
    margin-top: 16px;
}
.footer_content p {
    font-size: 16px;
    color: var(--bs-black);
    line-height: 22px;
}
.footer_nav {
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    flex-wrap: wrap;
    gap: 20px 100px;
}
.footer_nav_col h3 {
    font-size: 20px;
    font-weight: 500;
    color: var(--bs-black);
}
.footer_nav_col ul li {
    line-height: 30px;
}
.footer-nav-link {
    font-size: 16px;
    color: var(--footer-text-clr);
    text-decoration: none;
}
.footer-nav-link:hover {
    color: var(--theme-clr);
}




.footer_copyright_wrapper {
    padding: 20px 0px;
    border-top: 1px solid #D8DCDC;
}
.copyright_blk p {
    font-size: 14px;
    color: var(--bs-black);
}
a.footer_s_media_link {
    width: 40px;
    height: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
    background: var(--footer-bg);
    border-radius: 50%;
    border: 1px solid var(--gray-54);
    text-decoration: none;
    transition: all 0.2s ease-in-out;
}
a.footer_s_media_link svg path{
    transition: all 0.2s ease-in-out;
}
a.footer_s_media_link:hover {
    border-color: var(--theme-clr);
}
a.footer_s_media_link:hover svg path {
    fill: var(--theme-clr);
}
.s_media_youtube:hover svg path:last-child {
    fill: var(--bs-white);
}

.hero_select_search_wrapper {
    max-width: 675px;
    margin: 20px auto 0px;
    padding: 6px 6px 6px 25px;
    background: var(--bs-white);
    border-radius: 60px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 15px 10px;
}
.hero-content-wrapper .offering_by_location {
    margin-top: 120px;
}
.select_search_wrapper {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 15px 18px;
    width: calc(100% - 128px);
}
.vertical_divider {
    width: 1px;
    height: 38px;
    background: #c1c1c1;
}
[class^="search_for"]:first-child {
    width: calc(100% - (192px + 37px));
}
[class^="search_for"]:last-child {
    gap: 8px;
    width: 192px;
    padding: 0px 5px;
}
[class^="search_for"] {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 12px;
}
[class^="search_for"] label {
    padding: 0px;
    font-size: 14px;
    font-weight: 500;
    font-family: var(--primary-font);
    color: var(--bs-black);
    line-height: normal;
}
[class^="search_for"] :is(.form-control, select) {
    padding: 0px;
    border: 0px;
    font-size: 14px;
    font-family: var(--primary-font);
    box-shadow: none;
    outline: none;
    line-height: normal;
    border-radius: 0px;
}
[class^="search_for"] .form-control::placeholder {
    color: #868686;
}
[class^="search_for"]:first-child .form-control {
    width: 210px;
}

[class^="search_for"]:last-child label {
    width: calc(100% - 150px);
}
.detect_location {
    border: 0px;
    padding: 0px;
    background: var(--bs-white);
    width: 14px;
    height: 14px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.detect_location i {
    color: #868686;
    font-size: 13px;
}
[class^="search_for"] select {
    color: #868686;
    appearance: none !important;
}
.select_search_action {
    width: 118px;
}
.search_btn {
    padding: 12px 32px;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 4px;
    font-size: 16px;
    font-family: var(--primary-font);
    color: var(--bs-white);
    text-transform: capitalize;
    text-decoration: none;
    border: 0px;
    border-radius: 50px;
    background: var(
        --theme-clr);
}

section.item_card_section {
    padding: 10px 0px 100px;
    background: var(--dark-page-bg);
}
.heading h2 {
    font-size: 48px;
    font-weight: 400;
    font-family: var(--primary-font);
    color: var(--bs-white);
}
.item_cards_wrapper {
    max-width: 1242px;
    margin: 70px auto 0px;
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 20px;
}
.item_cards {
    flex: 1;
    height: 505px;
    border-radius: 15px;
    position: relative;
    transition: all 0.6s ease-in-out;
}
.item_cards::before {
    position: absolute;
    content: "";
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.5);
    z-index: 0;
}
.item_cards img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    border-radius: inherit;
}
.item_cards .item_title {
    position: absolute;
    content: "";
    bottom: 0;
    left: 0;
    width: 100%;
    padding: 28px;
}
.item_cards .item_title h3 {
    font-size: 38px;
    font-weight: 400;
    font-family: var(--primary-font);
    color: var(--bs-white);
    text-align: left;
    margin: 0px;
    transition: all 0.3s ease-in-out;
    transform-origin: left;
}
.item_cards:hover {
    flex: 5;
}
.item_cards .item_caption {
    font-size: 14px;
    font-weight: 300;
    color: rgba(255, 255, 255, 0.88);
    text-shadow: 0 1px 4px rgba(0, 0, 0, 0.6);
    margin: 6px 0 0;
    line-height: 1.4;
    opacity: 0;
    transform: translateY(8px);
    transition: opacity 0.3s ease-in-out 0.35s, transform 0.3s ease-in-out 0.35s;
    pointer-events: none;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.item_cards:hover .item_caption {
    opacity: 1;
    transform: translateY(0);
}

/* .inner_pages_hero_section {
    min-height: 575px !important;
} */
.inner_pages_hero_section::before {
    position: absolute;
    content: "";
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(
        0deg,
        rgba(0, 0, 0, 0.9) 0%,
        rgba(0, 0, 0, 0.3) 30%,
        rgba(0, 0, 0, 0.1) 50%,
        rgba(0, 0, 0, 0.2) 100%
    );
    /* backdrop-filter: grayscale(1);
    -webkit-backdrop-filter: grayscale(1);
    -moz-backdrop-filter: grayscale(1); */
}
/* On sport homepages, hero-content-wrapper uses position-static (Bootstrap utility).
   As a flex item inside d-flex, z-index still applies even without positioning.
   Without this rule it inherits z-index:1 from .hero-content-wrapper, which equals
   the z-index of .offering_by_location; the later DOM order of the country picker
   then causes it to paint on top of the search dropdown.
   Setting z-index:10 here ensures the search block's stacking context is above
   the country-picker stacking context (z:1) so the autocomplete appears on top. */
.hero-content-wrapper.position-static {
    z-index: 10;
}

.search_blk {
    position: relative;
    max-width: 570px;
    margin: 32px auto 0px;
}
.search_blk input {
    width: 100%;
    padding: 16px 16px 16px 58px;
    border-radius: 60px;
    font-size: 18px;
    border: 0px;
    box-shadow: none !important;
    outline: none;
}


.offerings_section {
    padding: 0px 0px 80px;
    position: relative;
    z-index: 0;
}
.offering_top_wrapper {
    padding: 50px 0px 0px;
}
.offering_top_wrapper::before {
    position: absolute;
    content: "";
    top: 0px;
    left: 0;
    width: 100%;
    height: calc(100% + 60px);
    background: linear-gradient(0deg, #ffffff, #000000);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    -moz-backdrop-filter: blur(4px);
    z-index: -1;
}
/* .offerings_section::after {
    position: absolute;
    content: "";
    top: 0px;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(0deg, #ffffff, #000000);
    backdrop-filter: blur(0px);
    z-index: -1;
} */
.offering_sports_list_wrapper {
    display: flex;
    justify-content: center;
}
.offering_sports_list_wrapper ul.nav {
    padding: 9px;
    background: var(--bs-white);
    border-radius: 60px;
}
.offering_sports_list_wrapper ul.nav .nav-link{
    font-size: 20px;
    font-weight: 400;
    font-family: var(--primary-font);
    color: var(--medium-gray);
    border-radius: 60px;
    padding: 12px 35px;
}
.offering_sports_list_wrapper ul.nav .nav-link.active {
    font-weight: 500;
    background: var(--theme-clr);
    color: var(--bs-white);
}
.offering_by_location {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 8px;
    /* margin: 18px auto 0px; */
    margin: 0px auto 18px;
    max-width: 300px;
    background: #ECF6F6;
    border-radius: 60px;
    position: relative;
    z-index: 1;
}
.offering_by_location select{
    padding: 14px 20px 14px 52px;
    /* No radius: these selects are transparent children of the already-rounded
       .offering_by_location pill, so a radius here paints nothing — but browsers
       force `overflow: clip` on <select>, and a 60px radius (clamped to half the
       42px height) curved the clip inward far enough to shave the first glyph of
       any select with a small padding-left ("Everywhere" lost its E). */
    border-radius: 0;
    border: 0px;
    background-color: transparent;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    font-size: 20px;
    font-weight: 400;
    font-family: var(--primary-font);
    outline: none;
    box-shadow: none !important;
}
.map_pin {
    width: 24px;
    height: 24px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.offering_by_location .map_pin {
    position: absolute;
    content: "";
    top: 50%;
    left: 20px;
    transform: translateY(-50%);
    z-index: -1;
}
.location_title {
    font-size: 20px;
    font-family: var(--primary-font);
    color: var(--theme-clr);
    line-height: normal;
    /* width: calc(100% - 32px); */
}

.page_title_card {
    background: #fff;
    border-radius: 60px;
    padding: 15px 32px;
    display: inline-flex;
    margin: 0px auto 20px;
}

.offering_content_title_filter {
    padding: 35px;
    background: var(--bs-white);
    border: 2px solid var(--bs-white);
    border-radius: 24px;
}
.offering_heading h2 {
    font-size: 48px;
    font-weight: 500;
}
.offering_preview_format {
    background: var(--gray-f4);
    padding: 8px;
    border-radius: 60px;
    display: inline-flex;
    justify-content: flex-start;
    align-items: center;
    gap: 6px;
    margin: 20px auto 0px;
}
.offering_preview_btn {
    font-size: 20px;
    font-weight: 500;
    font-family: var(--primary-font);
    color: var(--medium-gray);
    border-radius: 60px;
    padding: 12px 35px;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
    border: 0px;
    background: var(--gray-f4);
}
.offering_preview_icon {
    width: 18px;
    display: flex;
}
.offering_preview_title {
    width: calc(100% - 28px);
}
.offering_preview_btn.active {
    background: var(--theme-clr);
    color: var(--bs-white);
}
.offering_preview_btn.active svg path {
    fill: var(--bs-white);
}
/* Hide sold out toggle — borrows the view-switcher's tokens so it reads as a sibling of it */
.sold_out_toggle {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    /* Even, and 14+14 is the same 28px of horizontal padding the original 8/20 had — the row is
       at its width limit, so any net gain here wraps the view switcher onto a second line. */
    padding: 8px 14px;
    background: var(--gray-f4);
    border-radius: 60px;
    cursor: pointer;
    margin: 0;
    user-select: none;
    /* Match the pills either side rather than hard-coding their height: the row is a flex line
       whose cross size is set by its tallest item (both neighbours land ~64px), so stretching to
       it keeps all three level and stays correct if either neighbour is ever restyled. The inner
       align-items:center re-centres the track and label inside the taller box. */
    align-self: stretch;
}
.sold_out_toggle input {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
}
.sold_out_toggle_track {
    position: relative;
    flex: 0 0 auto;
    width: 44px;
    height: 26px;
    border-radius: 60px;
    background: #D9D9D9;
    transition: background 0.2s ease;
}
.sold_out_toggle_knob {
    position: absolute;
    top: 3px;
    left: 3px;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: var(--bs-white);
    transition: transform 0.2s ease;
}
.sold_out_toggle input:checked + .sold_out_toggle_track {
    background: var(--theme-clr);
}
.sold_out_toggle input:checked + .sold_out_toggle_track .sold_out_toggle_knob {
    transform: translateX(18px);
}
.sold_out_toggle input:focus-visible + .sold_out_toggle_track {
    outline: 2px solid var(--theme-clr);
    outline-offset: 2px;
}
.sold_out_toggle_label {
    /* Same grey as .offering_preview_btn (the "calendar" label), and it STAYS grey when on: the
       track carries the state, so tinting the label said it twice and made the switch read as a
       selected tab. Size stays 18px, NOT the button's 20px — the row has no width left to give. */
    font-family: var(--primary-font);
    font-size: 18px;
    font-weight: 500;
    color: var(--medium-gray);
    white-space: nowrap;
}
@media (prefers-reduced-motion: reduce) {
    .sold_out_toggle_track,
    .sold_out_toggle_knob { transition: none; }
}

/* Viewing events bar */
.viewing-events-row {
    margin-top: 48px !important;
    margin-bottom: 0;
    padding: 0 4px;
}
.select_field .form-select {
    padding: 20px 38px 20px 30px;
    border: 0px;
    border-radius: 60px;
    background-color: var(--gray-f4);
    color: #7E7C7C;
    font-size: 20px;
    font-weight: 500;
    box-shadow: none;
    max-width: 240px;
}
.select_field .form-select option {
    font-size: 14px !important;
}
.double_arrow_icon {
    padding: 0px;
    border: 0px;
    background: transparent;
    width: 30px;
    height: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.calendar_blk .outline_btn_style {
    padding: 20px 38px 20px 30px;
    border: 0px;
    border-radius: 60px;
    background-color: var(--gray-f4);
    color: #7E7C7C;
    font-size: 20px;
    font-weight: 500;
    box-shadow: none;
    max-width: 240px;
    align-items: center;
}
.calendar_blk .outline_btn_style span.outline_btn_icon {
    width: 18px;
    height: 18px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.result_count p {
    font-size: 16px;
    font-weight: 500;
    color: #7E7C7C;
    padding: 0px 20px;
}
.offering_content_services {
    margin: 48px auto 0px;
}
.offering_item_wrapper {
    display: flex;
    justify-content: flex-start;
    gap: 24px;
    flex-wrap: wrap;
    max-width: 1560px;
    margin: 0px auto;
}
.offering_item_card {
    width: 292px;
    height: 512px;
    border-radius: 12px;
    position: relative;
    display: flex;
}
.offering_item_img {
    width: 100%;
    height: 100%;
    border-radius: inherit;
}
.offering_item_card .offering_item_img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: inherit;
}
.offering_top_blk {
    padding: 14px 12px;
}
.offering_item_rating {
    display: flex;
    justify-content: flex-end;
    align-items: flex-start;
    gap: 8px;
    width: 46px;
}
.offering_item_rating_box {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 4px 6px;
    background: var(--bs-white);
    border-radius: 8px;
    gap: 4px;
}
.rating_icon {
    width: 12px;
    height: 12px;
    display: flex;
    justify-content: center;
    align-items: center;
}
span.offering_item_rating_box span {
    font-size: 13px;
    line-height: normal;
}
.rating_title {
    width: calc(100% - 19px);
    font-size: 14px;
    font-weight: 500;
    font-family: var(--primary-font);
    color: var(--bs-black);
    line-height: normal;
}

.offering_item_info {
    position: absolute;
    content: "";
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(45deg, rgb(0 0 0 / 40%), #000000a3);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 10px;
    overflow: hidden;
    /*padding: 14px 12px;*/
}
/*.offering_item_info::before {*/
/*    position: absolute;*/
/*    content: "";*/
/*    bottom: 0;*/
/*    left: 0;*/
/*    width: 100%;*/
/*    min-height: 150px;*/
/*    background: #000000;*/
/*    z-index: 0;*/
/*}*/
/*.ads_badge {*/
/*    position: absolute;*/
/*    content: "";*/
/*    top: 20px;*/
/*    left: -90px;*/
/*    width: 100%;*/
/*    background: var(--theme-clr);*/
/*    font-size: 12px;*/
/*    font-weight: 500;*/
/*    font-family: var(--primary-font);*/
/*    color: var(--bs-white);*/
/*    text-align: center;*/
/*    padding: 4px 20px;*/
/*    transform: rotate(329deg);*/
/*    display: inline-flex;*/
/*    justify-content: center;*/
/*    align-items: center;*/
/*}*/
.ads_badge {
    position: absolute;
    content: "";
    bottom: 14px;
    left: 12px;
    width: auto;
    background: var(--bs-black);
    font-size: 12px;
    font-weight: 600;
    font-family: var(--primary-font);
    color: var(--bs-white);
    letter-spacing: 0.5px;
    text-align: center;
    padding: 4px 10px;
    border-radius: 6px;
    transform: none;
    display: inline-flex;
    justify-content: center;
    align-items: center;
}
.future_badge {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    background: var(--bs-white);
    border-radius: 8px;
    padding: 8px 15px;
    font-size: 14px;
    font-weight: 500;
    font-family: var(--primary-font);
    color: var(--theme-clr);
    line-height: normal;
    max-width: 110px;
}
span.flag_img {
    width: 45px;
    height: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 30px;
}
span.flag_img img {
    width: 100%;
    height: 100%;
    object-fit: unset;
}
.offering_card_date {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 8px;
    background: var(--theme-clr);
    border-radius: 8px;
    min-width: 70px;
}

.offering_card_date span {
    font-size: 14px;
    line-height: 20px;
    font-weight: 500;
    color: var(--bs-white);
    text-transform: uppercase;
}
.ptrs_ch_flg_tata {
    padding: 12px;
}
.offering_item_detail {
    display: flex;
    flex-direction: column;
    gap: 10px;
    z-index: 1;
    padding: 14px 12px;
    background: var(--bs-black);
    border-radius: 0px 0px 12px 12px;
    position: relative;
}
/* Sponsored badge sits just ABOVE the black content block, overlaid on the image. */
.offering_item_detail .ads_badge {
    bottom: calc(100% + 8px);
    top: auto;
    color: var(--theme-clr);
}
.offering_title_blk {
    width: calc(100% - 58px);
}
.offering_title_blk h3 {
    font-size: 16px;
    font-family: var(--primary-font);
    font-weight: 500;
    color: var(--bs-white);
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    height: 39px;
}
.offering_title_blk p {
    line-height: normal;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
}
.offering_location {
    width: calc(100% - 58px);
}
.offering_info_icons {
    width: 20px;
    height: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
}
:is(.offering_location, .offering_schedule, .offering_info) p {
    font-size: 14px;
    font-family: var(--secondary-font);
    font-weight: 400;
    color: var(--bs-white);
    margin-bottom: 0px;
    width: calc(100% - 28px);
}
.offering_logo {
    width: 46px;
    height: 46px;
    border-radius: 4px;
}
.offering_logo img {
    width: 100%;
    height: 100%;
    border-radius: inherit;
}
.offering_logo_blk p {
    font-size: 12px;
    font-family: var(--secondary-font);
    font-weight: 400;
    color: var(--bs-white);
    text-align: center;
    margin: 5px 0px 0px;
}
.offering_item_detail_content {
    line-height: normal;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
}
.offering_nav_list {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 15px 40px;
}
.offering_nav {
    position: fixed;
    bottom: 25px;
    left: 50%;
    width: auto;
    transform: translateX(-50%);
    background: var(--bs-white);
    padding: 10px 40px;
    border-radius: 60px;
    box-shadow: 0px 8px 32px rgba(0,0,0,0.10);
    z-index: 6;
}
.offering_btn {
    padding: 0px;
    border: 0px;
    background: var(--bs-white);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 2px;
    text-decoration: none;
}
.offering_btn_icon {
    width: 32px;
    height: 32px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.offering_btn_icon img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}
.offering_btn_title {
    font-size: 16px;
    font-weight: 400;
    font-family: var(--primary-font);
    color: var(--medium-gray);
    text-decoration: none;
}
.offering_btn.active .offering_btn_title{
    font-weight: 500;
    color: var(--theme-clr);
}
.offering_btn.active .offering_btn_icon img {
    filter: saturate(30) contrast(4) hue-rotate(175deg);
}
.offering_nav:not(.service_all_nav) .offering_btn:not(.active) .offering_btn_icon img {
    filter: brightness(10);
}
.tags_tab .nav {
    gap: 12px !important;
}
.tags_tab .nav-link {
    padding: 12px 28px !important;
    font-size: 26px !important;
    font-weight: 500 !important;
    color: var(--bs-white);
    /*color: var(--medium-gray);    */
    /*background: var(--gray-f4);*/
    background: var(--theme-clr);
    border-radius: 50px;
    border: 0px !important;
    margin-bottom: 0px;
    min-width: 140px;
    text-transform: none !important;
    line-height: normal;
}
.tags_tab .nav-link.active {
    color: var(--theme-clr) !important;
    background: var(--bs-black);
    border: 0px;
}
.sports_type_elements {
    display: flex;
    justify-content: flex-start;
    gap: 3px;
    background: #242424;
    padding: 6px;
    border-radius: 5px;
}
.sports_type_elements button {
    width: 26px;
    height: 26px;
    border-radius: 50%;
    background: var(--bs-white);
    border: 0px;
    padding: 0px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.sports_type_elements button img {
    width: 18px;
    height: 18px;
    object-fit: contain;
}
.sports_type_elements button:nth-child(6) ~ button:not(:last-child) {
    display: none;
}
.tooltip .tooltip-inner {
    background-color: var(--theme-clr) !important;
}
.tooltip .tooltip-arrow::before {
    border-top-color: var(--theme-clr) !important;
}

.swiper-wrapper .offering_item_card {
    width: 100%;
}
.offering_slider_main_wrapper:not(:last-child) {
    margin-bottom: 90px;
}


.offering_slider_content_wrapper.swiper-container {
    padding-bottom: 30px;
}
.offering_slider_main_wrapper .swiper-pagination {
    bottom: 0px !important;
}
.offering_slider_main_wrapper span.swiper-pagination-bullet {
    width: 9px !important;
    height: 9px !important;
    background: #D0D8D8 !important;
    border-color: #D0D8D8 !important;
    transition: all 0.5s ease-in-out;
    border-radius: 8px !important;
}
.offering_slider_main_wrapper span.swiper-pagination-bullet.swiper-pagination-bullet-active {
    width: 42px !important;
    height: 9px !important;
    background: var(--theme-clr) !important;
    border-color: var(--theme-clr) !important;
    border-radius: 8px !important;
}

.slider__prev, .slider__next {
    position: absolute;
    content: "";
    top: 50%;
    width: 52px;
    height: 52px;
    background: var(--theme-clr);
    transform: translateY(-50%);
    border-radius: 16px;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1;
    user-select: none;
}
.slider__prev {
    left: -26px;
}
.slider__next {
    right: -26px;
}
.slider__prev.is-edge, .slider__next.is-edge {
    opacity: 0.6;
    box-shadow: none;
    cursor: not-allowed;
}

/*.offering_slider_main_wrapper:nth-child(even) .swiper-pagination {*/
/*    display: none !important;*/
/*}*/
/*.offering_slider_main_wrapper:nth-child(even) :is(.slider__prev, .slider__next) {*/
/*    top: 100%;*/
/*}*/
/*.offering_slider_main_wrapper:nth-child(even) .slider__prev {*/
/*    left: 50%;*/
/*    transform: translate(calc(-50% - 26px), -52px);*/
/*    border-radius: 16px 0px 0px 16px;*/
/*}*/
/*.offering_slider_main_wrapper:nth-child(even) .slider__next {*/
/*    right: 50%;*/
/*    transform: translate(calc(-50% + 78px), -52px);*/
/*    border-radius: 0px 16px 16px 0px;*/
/*}*/
/*.offering_slider_main_wrapper:nth-child(even) .slider__prev::before {*/
/*    position: absolute;*/
/*    content: "";*/
/*    top: 50%;*/
/*    right: 0px;*/
/*    width: 1px;*/
/*    height: 38px;*/
/*    background: #188F7E;*/
/*    transform: translateY(-50%);*/
/*}*/
.cta_bg_white, .cta_bg_white::before {
    background: var(--bs-white) !important;
}
.cta_bg_white .cta_banner_wrapper {
    box-shadow: 0px 12px 36px rgb(48 47 45 / 25%) !important;
}

/*.offering_calendar_content_wrapper, .offering_map_content_wrapper {*/
/*    margin-top: 48px;*/
/*}*/
.offering_calendar_content_wrapper .accordion-button {
    padding: 20px;
    font-size: 20px;
    font-weight: 500;
    color: var(--primary-clr);
    font-family: var(--primary-font);
    background: var(--bs-white);
    border-radius: 10px !important;
    border: 0px;
    box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.04);
}
.offering_calendar_content_wrapper .accordion-item {
    border: 0px;
}
.offering_calendar_content_wrapper .accordion-item:not(:last-child) {
    margin-bottom: 20px;
}
.offering_calendar_content_wrapper .accordion-body {
    padding: 0px;
    margin: 15px 0px;
}
.calendar_item_card {
    display: flex;
    justify-content: flex-start;
    text-decoration: none;
}
.calendar_item_card:not(:last-child) {
    margin-bottom: 12px;
}

.calendar_item_card .offering_title_blk h3 {
    color: var(--bs-black);
    font-size: 18px;
    font-weight: 500;
}

.calendar_schedule_info {
    background: var(--theme-clr);
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 25px 10px;
    border-radius: 8px 0px 0px 8px;
    width: 220px;
    position: relative;
}
/* No `content` here: WebKit renders an <img> that has ANY content value as an empty box, never the
   picture (30 Sep 2026: every calendar photo was a teal block in Safari and the iOS app). */
img.calendar_event_img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 8px 0px 0px 8px;
}
span.cal_img_overlay_text {
    position: absolute;
    content: "";
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    padding: 15px 20px;
    background: #000000a8;
    border-radius: 12px;
    font-size: 30px;
    font-weight: 600;
    color: #fff;
    text-align: center;
    line-height: normal;
}
.calendar_item_card .offering_item_detail {
    justify-content: space-between;
    padding: 16px;
    border-radius: 0px 8px 8px 0px;
    width: calc(100% - 220px);
    box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.04);
    background: var(--bs-white);
}
.calendar_schedule_info h3 {
    font-size: 18px;
    font-weight: 600;
    color: var(--bs-white);
    margin-bottom: 0px;
}
.calendar_item_card :is(.offering_location, .offering_schedule, .offering_info) p {
    color: #626C69;
}
.calendar_item_card .offering_info_icons img {
    filter: brightness(0.5);
}

section.offering_detail_section {
    padding-bottom: 70px;
}
.nav_breadcrumb li.breadcrumb-item a {
    color: var(--medium-gray);
    text-decoration: none;
    font-size: 16px;
    font-family: var(--primary-font);
}
.nav_breadcrumb li.breadcrumb-item.active {
    color: var(--theme-clr);
    font-weight: 600;
}
.offering_detail_section .nav {
    border-bottom: 1px solid var(--light-gray);
}
.offering_detail_section .sports_tabs_blk .nav {
    border: 0px;
}
.offering_detail_section .tab_line_style_blk .nav-link.active {
    color: var(--theme-clr);
    border-color: var(--theme-clr);
}

section.review_section {
    padding: 10px 0px 70px;
}
.review_section .outline_btn_style {
    padding: 8px 18px;
    border-radius: 30px;
    font-size: 14px;
}
.review_item_wrapper {
    padding: 16px 20px;
    box-shadow: 0px 4px 20px rgba(0,0,0,0.07);
    border-radius: 10px;
}
.review_item_wrapper:not(:last-child) {
    margin-bottom: 20px;
}
.review_item_wrapper .outline_card_info:not(:last-child) {
    margin-bottom: 12px;
}
.review_profile_img {
    width: 44px;
    height: 44px;
    border-radius: 50%;
}
.review_profile_img img {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    object-fit: cover;
}
.review_item_wrapper .outline_card_info p {
    font-size: 20px;
}
.rating_star-field {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 20px;
    flex-direction: row-reverse;
}
.rating_star-field input+label {
    cursor: pointer;
}
.rating_star-field input:checked+label svg path, .rating_star-field input:checked~input+label svg path {
    fill: var(--theme-clr);
    stroke: var(--theme-clr);
}



.offering_map_content {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}
.offering_map_content_item_wrapper {
    /* width: 924px; */
    width: 608px;
    display: flex;
    justify-content: flex-start;
    flex-wrap: wrap;
    gap: 24px;
}
.map_blk {
    width: calc(100% - (608px + 24px));
    height: 720px;
    border-radius: 8px;
    position: sticky;
    top: calc(var(--header-height) + 30px);
}
.map_blk iframe {
    width: 100%;
    height: 100%;
    border-radius: 8px;
}
.coaches_item_blk {
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 16px;
    padding: 12px;
    border-radius: 10px;
    box-shadow: 0px 4px 20px rgba(0,0,0,0.05);
}
.coaches_item_blk:not(:last-child) {
    margin-bottom: 18px;
}
.coaches_profile_img {
    width: 110px;
    height: 110px;
    border-radius: 8px;
}
.coaches_profile_img img {
    width: 100%;
    height: 100%;
    border-radius: 8px;
    object-fit: cover;
}
.coaches_profile_info {
    width: calc(100% - (110px + 16px));
}
.coaches_profile_info h3 {
    font-size: 24px;
    font-weight: 600;
    color: var(--primary-clr);
}
.coaches_profile_info p {
    color: var(--gray-8c) !important;
    margin-bottom: 0px;
    word-break: break-word;
    font-size: 16px;
}
.coaches_profile_info ul li {
    color: var(--gray-8c) !important;
}
:is(.coaches_profile_info, .coach_info) p strong {
    color: var(--gray-8c) !important;
}
:is(.coaches_profile_info, .coach_info) p > br {
    display: none;
}
.service_card {
    padding: 15px;
    border-radius: 10px;
    box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.05);
    border: 0px !important;
}
.service_card:not(:last-child) {
    margin-bottom: 18px;
}
.service_card :is(h3, .h3), .outline_card_info h3 {
    font-size: 16px;
    font-weight: 500;
    color: #626C69;
    margin-bottom: 0px;
}
.service_card h2 {
    color: var(--primary-clr) !important;
}
.SecSec {
    display: none;
}
.readLess {
    display: none;
    color: var(--bs-black);
    cursor: pointer;
}
.readMore {
    color: var(--bs-black);
    cursor: pointer;
}

section.detail_hero_section {
    height: 575px;
    background-repeat: no-repeat !important;
    background-size: cover !important;
    /* filter: grayscale(1); */
    position: relative;
    /* padding: 0px 20px; */
}
section.detail_hero_section::before {
    position: absolute;
    content: "";
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(0deg, #B8B8B8, transparent 40%);
    z-index: 2;
}
section.detail_hero_section .banner-slide-img {
    height: 575px;
}
section.offerings_info_section {
    position: relative;
    z-index: 1;
}
section.offerings_info_section::before {
    position: absolute;
    content: "";
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(180deg, #B8B8B8, transparent);
    pointer-events: none;
}
.offering_tabs_wrapper {
    margin-top: 30px;
    /* margin-bottom: 30px; */
    z-index: 1;
    position: relative;
}
.management_img {
    width: 120px;
    height: 120px;
    border-radius: 8px;
    margin-bottom: 30px;
}
.management_img img {
    width: 100%;
    height: 100%;
    border-radius: 8px;
    object-fit: cover;
}
.report_btn {
    padding: 0px 0px;
    border-radius: 0px;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 6px;
    font-size: 16px;
    font-weight: 500;
    font-family: var(--primary-font);
    color: var(--theme-clr);
    background: transparent;
    border-width: 0px 0px 1.6px;
    border-style: solid;
    border-color: var(--theme-clr);
    text-transform: lowercase;
}
.management_info h1 {
    font-size: 48px;
    width: calc(100% - 200px);
}
.management_info p , .offering_tabs_wrapper .location_field span{
    font-size: 20px;
    font-family: var(--primary-font);
    color: var(--medium-gray);
}
.offering_tabs_wrapper .location_field {
    background: transparent !important;
}
.promotion_view_wrapper {
    display: flex;
    justify-content: flex-start;
    flex-wrap: wrap;
    gap: 24px;
}
.promotion_view_card {
    width: 292px;
    border-radius: 12px;
    background: var(--bs-black);
    padding-bottom: 57px;
}
/*.promotion_view_card::before {*/
/*    position: absolute;*/
/*    content: "";*/
/*    top: 0;*/
/*    left: 0;*/
/*    width: 100%;*/
/*    height: 100%;*/
/*    background: linear-gradient(0deg, #000000c4, transparent);*/
/*    border-radius: inherit;*/
/*}*/
.promotion__img {
    width: 100%;
    height: 245px;
    position: relative;
}
.promotion__img img {
    border-radius: 12px 12px 0px 0px !important;
    object-fit: contain !important;
}
.promotion_view_card img {
    width: 100%;
    height: 100%;
    border-radius: 12px;
    object-fit: cover;
}
.promotion_card_info {
    padding: 14px;
    border-radius: 0px 0px 12px 12px;
    border-top: 1px solid #ffffff40;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: flex-start;
}
.promotion_view_card h3 {
    font-size: 20px;
    font-weight: 500;
    font-family: var(--primary-font);
    color: var(--bs-white);
    width: 100%;
}
.promotion_description {
    margin: 8px 0px 24px;
}
.promotion_card_info p {
    font-size: 14px;
    margin: 0px;
}
.promotion_view_card p {
    color: var(--bs-white);
}
.promotion_action_wrapper {
    position: absolute;
    content: "";
    bottom: 14px;
}
.promotion_action_wrapper .outline_btn_style {
    padding: 10px;
    border-radius: 50px;
}
.promotion_list_of_img {
    position: absolute;
    content: "";
    bottom: 14px;
    right: 14px;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 8px;
}

.promotion_list_of_img img {
    width: 35px;
    height: 35px;
    border: 1px solid #00aa9d;
    border-radius: 4px !important;
    object-fit: cover;
}

.promotion_list_of_img span {
    width: 35px;
    height: 35px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 16px;
    font-weight: 600;
    color: var(--theme-clr);
    background: #fff;
    border-radius: 4px;
    box-shadow: 0px 0px 4px #000;
}

.promotion_view_card[data-status]::before {
    position: absolute;
    content: attr(data-status);
    padding: 3px 10px;
    top: 0;
    right: 14px;
    border-radius: 0px 0px 10px 10px;
    font-size: 12px;
    font-weight: 600;
    color: #fff;
}
.promotion_view_card[data-status="Active"] {
    --promotion-active-color: var(--theme-clr);
    border: 2px solid var(--promotion-active-color);
}
.promotion_view_card[data-status="Active"]::before{
    background: var(--promotion-active-color);
}

.promotion_view_card[data-status="Expired"] {
    --promotion-expired-color: red;
    border: 2px solid var(--promotion-expired-color);
}
.promotion_view_card[data-status="Expired"]::before{
    background: var(--promotion-expired-color);
}

.promotion_view_card[data-status="Coming Soon"] {
    --promotion-coming-soon-color: #4985d3;
    border: 2px solid var(--promotion-coming-soon-color);
}
.promotion_view_card[data-status="Coming Soon"]::before{
    background: var(--promotion-coming-soon-color);
}



.sports_tab_and_filter {
    margin-top: 24px;
    margin-bottom: 30px;
}

.select_box .form-select {
    padding: 15px 40px 15px 16px;
    font-size: 14px;
    font-weight: 500;
    font-family: var(--primary-font);
    color: var(--medium-gray);
    border-color: var(--light-gray);
    border-radius: 8px;
    box-shadow: none !important;
    --bs-form-select-bg-img: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%237e7e7e' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
}
.select_with_icon_box .form-select {
    padding: 15px 40px;
}
.select_with_icon {
    position: absolute;
    content: "";
    top: 50%;
    left: 16px;
    width: 18px;
    height: 18px;
    display: flex;
    justify-content: center;
    align-items: center;
    transform: translateY(-50%);
}
.select_with_icon img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}
.sports_tabs_blk ul.nav {
    gap: 18px;
    background: var(--bs-white);
}
.sports_tabs_blk .nav-link {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 8px;
    padding: 12px 16px !important;
    border-radius: 60px;
    font-size: 14px !important;
    font-family: var(--primary-font) !important;
    color: var(--medium-gray) !important;
    background: #F0EDED !important;
    text-transform: lowercase !important;
    border: 0px !important;
}
.tab_pills_icon {
    width: 18px;
    height: 18px;
    display: flex;
    justify-content: center;
    align-items: center;
    display: none;
}
.tab_pills_icon svg {
    width: 18px;
    height: 18px;
}
.sports_tabs_blk .nav-link.active {
    background: var(--theme-clr) !important;
}
.sports_tabs_blk .nav-link.active .tab_pills_title {
    color: var(--bs-white);
    font-weight: 700;
}
.sports_tabs_blk .nav-link.active .tab_pills_icon svg path {
    fill: var(--bs-white)
}


.search-blk {
    position: relative;
}
.search-blk input {
    padding: 14px 14px 14px 58px;
    font-size: 16px;
    font-family: var(--primary-font);
    color: var(--medium-gray) !important;
    border-color: var(--light-gray);
    border-radius: 8px;
    box-shadow: none !important;
}
span.search-icon {
    position: absolute;
    content: "";
    top: 50%;
    left: 24px;
    transform: translateY(-50%);
}

.boost_action_blk {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 12px;
    padding-left: 38px;
    margin-bottom: 10px;
}
button.boost-btn {
    padding: 7px 16px;
    border: 1px solid var(--medium-gray);
    background: var(--page-bg);
    border-radius: 8px;
    font-size: 14px;
    font-weight: 700;
    font-family: var(--primary-font);
    color: var(--medium-gray);
    line-height: 14px;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 8px;
}

/* Table css start */

.table_wrapper {
    margin-top: 24px;
}
.table_blk {
    border: 1px solid var(--gray-bg);
    border-radius: 8px;
}

.table_blk table thead tr th {
    font-size: 14px;
    font-weight: 700;
    font-family: var(--primary-font);
    color: var(--primary-clr);
    padding: 16px 24px;
    vertical-align: middle;
    background: var(--page-bg) !important;
}
.thead_edit_btn {
    padding: 0px;
    border: 1px solid #4876A3;
    border-width: 0px 0px 1px;
    background: var(--page-bg);
    color: #4876A3;
    font-size: 14px;
    font-weight: 700;
    margin-left: 8px;
}
.table_blk table tbody tr td {
    font-size: 14px;
    font-weight: 400;
    font-family: var(--primary-font);
    color: var(--medium-gray);
    padding: 12px 24px;
    vertical-align: middle;
}
.table_blk table tbody tr:last-child td {
    border-bottom: 0px;
}
.td-anchor {
    font-size: 14px;
    font-weight: 400;
    font-family: var(--primary-font);
    color: var(--medium-gray);
    text-decoration: underline;
    text-underline-offset: 4px;
}
table tbody tr[data-title="default-tr"] td {
    background: #EAEAEA;
}
span.check-box {
    width: 19px;
    height: 19px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    margin-left: 16px;
}
.check-box input {
    display: none;
}
.check-box input + label {
    width: 19px;
    height: 19px;
    border-radius: 2px;
    background: #fff;
    border: 1px solid var(--bs-black);
    transition: all .5s ease;
    cursor: pointer;
}
.check-box input:checked + label {
    background: var(--bs-black);
    border-color: var(--bs-black);
    position: relative;
}
.check-box input:checked + label::before {
    position: absolute;
    content: "";
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 14px;
    height: 14px;
    background: url(/assets/images/icons/checkbox-path-1.svg);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
}
.th-flex, .td-flex {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 8px;
}
.th-icon {
    width: 14px;
    height: 18px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
}
span.location_td {
    width: 160px;
    display: block;
}

.table_action_blk {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 8px;
}
.tbl-action-icon-btn {
    width: 32px;
    height: 32px;
    border: 1px solid var(--medium-gray);
    border-radius: 6px;
    background: var(--page-bg);
    display: flex;
    justify-content: center;
    align-items: center;
}
.tbl_sports_icon {
    width: 18px;
    height: 18px;
    object-fit: contain;
}

.pagination_wrapper {
    margin-top: 25px;
}
.pagination_blk {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 10px;
}
.page_selection_blk select {
    background-color: var(--bs-black);
    color: var(--bs-white);
    border-radius: 4px;
    box-shadow: none !important;
    --bs-form-select-bg-img: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23ffffff' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
}
.page_button_blk {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 18px;
}
.prev_btn, .next_btn {
    width: 38px;
    height: 38px;
    display: flex;
    justify-content: center;
    align-items: center;
    border: 0px;
    background: var(--bs-white);
    padding: 0px;
}

/* Table css end */
.common-sm-modal .modal-dialog {
    max-width: 600px;
}
.modal-content {
    border: 0px;
    border-radius: 8px;
    box-shadow: 0px 2px 8px rgba(0,0,0,0.16);
}
.modal-header {
    border-color: var(--light-gray);
}
.modal-header , .modal-body {
    padding: 24px;
}
.common-sm-modal .modal-title {
    font-size: 24px;
    font-weight: 700;
    font-family: var(--primary-font);
    color: var(--primary-clr);
    margin-bottom: 0px;
}
.modal_form_field_wrapper {
    margin-top: 34px;
    margin-bottom: 25px;
}
.modal_form_field_wrapper .form-field-blk:not(:last-child) {
    margin-bottom: 15px;
}
.custom-modal-footer {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 12px;
    padding: 12px 24px 24px;
}
.custom-modal-footer .primary-outline-btn {
    font-size: 14px;
}
.custom-modal-footer :is(.primary-btn, .primary-outline-btn) {
    flex-grow: 1;
    width: calc(50% - 6px);
}
.modal_form_field_wrapper .form-flex-blk .form-flex-col {
    width: calc(50% - 12px);
}
.modal-body-content .btn-close {
    position: absolute;
    content: "";
    top: 0;
    right: 0;
    padding: 0;
    opacity: 1;
    box-shadow: none !important;
}
.modal_form_field_wrapper .form-field-blk label {
    color: var(--medium-gray);
}
.modal_form_field_wrapper .form-field-blk .input-field :is(.form-control, .form-select) {
    border-color: var(--gray-bg);
}

.boost-summary-blk {
    max-width: 480px;
    border: 1px solid var(--gray-bg);
    border-radius: 13px;
    margin-top: 24px;
    padding: 16px 24px;
}
.boost-summary-blk h3 {
    font-size: 18px;
    font-weight: 700;
    font-family: var(--primary-font);
    margin-bottom: 0px;
    color: var(--primary-clr);
}
.boost_transaction_field {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}
.boost_transaction_field:not(:last-child) {
    margin-bottom: 16px;
}
.boost-summary-blk h4 {
    font-size: 14px;
    font-weight: 500;
    font-family: var(--primary-font);
    margin-bottom: 0px;
    color: var(--primary-clr);
}
.boost-summary-blk p {
    font-size: 14px;
    font-weight: 400;
    font-family: var(--primary-font);
    margin-bottom: 0px;
    color: var(--medium-gray);
}
.grand_total :is(h4, p) {
    font-size: 16px;
    font-weight: 600;
    color: var(--primary-clr);
}


.banner-wrapper {
    position: relative;
}
.banner-slide-img {
    width: 100%;
    height: 230px;
    background: var(--light-gray);
    position: relative;
}
.banner-slide-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.banner_logo_blk {
    width: 100px;
    height: 100px;
    display: flex;
    justify-content: center;
    align-items: center;
    background: var(--bs-white);
    border: 2px solid var(--light-gray);
    border-radius: 8px;
    margin-left: 31px;
    margin-top: -40px;
    position: relative;
    z-index: 1;
}
.banner_logo_blk img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    border-radius: 8px;
}
.add_banner_logo_file {
    position: absolute;
    content: "";
    top: calc(100% - 35px);
    right: -12px;
    width: 25px;
    height: 25px;
    background: var(--bs-white);
    border: 2px solid var(--light-gray);
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50px;
}
.add_banner_logo_file label {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50px;
    cursor: pointer;
}
.add_banner_logo_file label img {
    width: 13px;
    height: 13px;
    object-fit: contain;
    border-radius: 0px;
}
.append-slide {
    border: 1px solid var(--bs-blue);
    color: var(--bs-blue);
    font-size: 12px;
    font-weight: 600;
    border-radius: 4px;
    padding: 6px 10px;
    background: rgb(255 255 255);
    backdrop-filter: blur(2px);
    -webkit-backdrop-filter: blur(2px);
    -moz-backdrop-filter: blur(2px);
    text-decoration: none;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    content: "";
    bottom: 40px;
    right: 20px;
    z-index: 2;
}
.remove_slide {
    position: absolute;
    content: "";
    top: 10px;
    right: 20px;
    border: 1px solid var(--bs-red);
    color: var(--bs-red);
    font-size: 10px;
    font-weight: 600;
    border-radius: 4px;
    padding: 2px 10px;
    background: rgb(255 255 255 / 59%);
    backdrop-filter: blur(2px);
    -webkit-backdrop-filter: blur(2px);
    -moz-backdrop-filter: blur(2px);
    letter-spacing: 0.5px;
}
.add_banner_img_file {
    position: absolute;
    content: "";
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.add_banner_img_file label {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    gap: 8px;
    cursor: pointer;
    background: rgb(154 154 154 / 50%);
}
.add_banner_img_title {
    font-size: 11px;
    font-family: var(--primary-font);
    color: var(--bs-white);
}

.event-heading {
    margin-top: 36px;
}
.event-heading h2{
    font-size: 42px;
    font-weight: 700;
    font-family: var(--primary-font);
    color: var(--primary-clr);
    margin-bottom: 16px;
}
.event-heading p {
    font-size: 20px;
    font-weight: 500;
    font-family: var(--primary-font);
    color: var(--primary-clr);
    margin-bottom: 0px;
}
/*.content_sticky {*/
/*    position: sticky;*/
/*    top: 280px;*/
/*    left: 0;*/
/*}*/
.content_sticky {
    position: sticky;
    top: 120px;
    left: 0;
}
.content_sticky_website {
    position: relative;
}
.tab_line_style_blk {
    border-bottom: 1px solid var(--light-gray);
    margin-top: 20px;
    margin-bottom: 0px;
    position: relative;
    /*background-color: var(--dark-page-bg);*/
}

.scroll_btn {
    position: absolute;
    content: "";
    top: 50%;
    transform: translateY(-50%);
    border: 0px;
    padding: 5px;
    width: 35px;
    height: 38px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    background: #efefef;
    border-radius: 6px;
    color: var(--theme-clr);
    outline: none;
    display: none;
}
.leftscroll_btn {
    left: 30px;
    background: linear-gradient(270deg, #a8e7e2, #f0fffe);
}
.rightscroll_btn {
    right: 30px;
    background: linear-gradient(90deg, #a8e7e2, #f0fffe);
}
.tabs_in_one_line {
    scroll-behavior: smooth;
}
.tab_line_style_blk .nav {
    gap: 15px 57px;
    flex-wrap: nowrap;
    white-space: nowrap;
    overflow-x: scroll;
    scrollbar-width: none;
    background: var(--bs-white);
    padding-right: 160px;
}
.tab_line_style_blk .nav-link {
    width: auto;
    font-size: 20px;
    font-family: var(--primary-font);
    font-weight: 400;
    color: var(--medium-gray);
    padding: 24px 0px 18px;
    border: 6px solid var(--bs-white);
    border-width: 0px 0px 6px 0px;
    /*background: var(--bs-white);*/
    text-transform: capitalize;
    box-shadow: none !important;
}
.tab_line_style_blk .nav-link.active {
    font-weight: 600;
    color: var(--primary-clr);
    border-color: var(--primary-clr);
    /* background: var(--bs-white) !important; */
}
.tab_inner_content_wrapper {
    margin-top: 16px;
}
.tab_inner_content_wrapper.top_banner_tab_wrapper {
    margin-top: 0px;
}
.rich_content_blk {
    margin-top: 0;
}
.rich_content_blk p {
    font-size: 16px;
    font-family: var(--primary-font);
    color: var(--medium-gray);
    line-height: 1.6;
    text-align: justify;
}
.rich_content_blk *, .rich_content_blk p strong, .rich_content_blk ul li, .rich_content_blk ul li span, .rich_content_blk p :is(span, em) {
    color: var(--gray-8c) !important;
    background-color: var(--bs-white) !important;
    font-size: 16px !important;
}
.rich_content_blk p > br {
    display: none;
}

.cta_wrapper {
    border: 0px;
    border-radius: 8px;
    box-shadow: 0px 4px 8px rgba(0,0,0,0.08);
    background: var(--bs-white);
}
.cta_detail_info {
    position: relative;
}
.cta_before_login {
    position: absolute;
    content: "";
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    padding: 15px;
    background: #ffffffbf;
    border-radius: 0px 0px 8px 8px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);
    -moz-backdrop-filter: blur(5px);
    z-index: 1;
}
.cta_before_login p {
    font-size: 20px;
    font-weight: 500;
    font-family: var(--primary-font);
    text-align: center;
}
.cta_location {
    width: 100%;
    height: 200px;
    position: relative;
}
.cta_location div#map {
    width: 100%;
    height: 200px;
    border-radius: 8px;
}
.cta_detail_info .cta_social_field {
    padding: 14px;
    box-shadow: 0px 4px 16px rgba(0,0,0,0.05);
    border-radius: 8px;
}
.cta_detail_info .cta_social_field p {
    margin-bottom: 0px;
    font-size: 12px;
    color: var(--primary-clr);
    font-family: var(--sg-font);
}
.cta_box {
    padding: 24px;
}
.cta_box:not(:last-child) {
    border-bottom: 1px solid #E1DCDC;
}
.cta_detail_header h2 {
    font-size: 24px;
    color: var(--bs-black);
    margin-bottom: 0px;
}
.organization_detail {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 10px;
}
.organization_detail .offering_logo {
    width: 54px;
    height: 54px;
}
.offering_org_info {
    width: calc(100% - 64px);
}
.offering_org_info h3 {
    font-size: 16px;
    font-weight: 500;
    color: var(--bs-black);
    margin-bottom: 8px;
}
.offering_org_info p {
    font-size: 14px;
    font-weight: 500;
    color: var(--medium-gray);
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 6px;
}
span.gray_star {
    width: 14px;
    height: 12px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.cta_fields {
    margin-top: 24px;
}
.cta_contact_fields {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 8px;
    font-size: 16px;
    color: #626C69;
    text-decoration: none;
    font-family: var(--primary-font);
}
span.cta_contact-icon {
    width: 20px;
    height: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
}
span.cta_contact-icon img{
    width: 100%;
    height: 100%;
    object-fit: contain;
}
.cta_contact_fields:not(:last-child) {
    margin-bottom: 8px;
}
.cta_fields .form-field-blk:not(:last-child) {
    margin-bottom: 24px;
}
.cta_fields .form-field-blk .input-field :is(.form-control, .form-select) {
    border-color: var(--c9-gray) !important;
    color: var(--medium-gray) !important;
}
:is(.cta_fields, .edit_fields) .form-field-blk label {
    color: var(--gray-58);
}
.location_field {
    display: flex;
    justify-content: flex-start;
    align-items: baseline;
    gap: 4px;
    padding: 12px 8px;
    background: var(--bs-white);
    border-radius: 8px;
    margin-top: 24px;
}


.cta_detail_info .location_field {
    align-items: flex-start;
    box-shadow: 0px 4px 16px rgba(0,0,0,0.05);
    margin-top: 8px;
}
.cta_detail_info .location_field.active span.location-text {
    color: var(--theme-clr);
}
span.location-icon {
    width: 16px;
    height: 16px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.location_field.active .location-icon img {
    filter: brightness(2.5) contrast(6.5) saturate(179.5) hue-rotate(45deg);
}
span.location-text {
    width: calc(100% - 20px);
    font-size: 14px;
    font-weight: 400;
    font-family: var(--primary-font);
    color: var(--primary-clr);
}
.cta_social_preview {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-wrap: wrap;
    gap: 14px;
}
.cta_social_preview .cta_social_icon {
    width: 35px;
    height: 35px;
}
.cta_social_preview .cta_social_field {
    display: none;
}
.cta_social_wrapper {
    margin-top: 22px;
}
.cta_social_item {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 12px;
}
.cta_social_icon {
    width: 25px;
    height: 25px;
}
.cta_social_icon img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}
.cta_social_field {
    width: calc(100% - 37px);
}
.cta_social_field input {
    font-size: 12px;
    padding: 14px;
    border: 1px solid var(--c9-gray);
    border-radius: 8px;
    color: var(--medium-gray);
    box-shadow: none !important;
    font-family: var(--sg-font);
}
.add_other_blk {
    margin-top: 22px;
}
.add_other_btn {
    padding: 0px;
    background: var(--bs-white);
    border: 0px;
    font-size: 12px;
    font-weight: 400;
    font-family: var(--primary-font);
    color: var(--bs-black);
}
.subtab_inner_content {
    margin-top: 32px;
}
.big_banner_img {
    width: 100%;
    height: 360px;
    border-radius: 18px;
}
.big_banner_img img {
    width: 100%;
    height: 100%;
    border-radius: 18px;
    object-fit: cover;
}

.gallery_wrapper {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 26px;
    flex-wrap: wrap;
}
.gallery_item {
    width: 242px;
    height: 240px;
    border-radius: 14px;
}
.gallery_item img {
    width: 100%;
    height: 100%;
    border-radius: 14px;
    object-fit: cover;
}

.edit_fields .form-field-blk:not(:last-child) {
    margin-bottom: 30px;
}
.edit_fields .form-field-blk .input-field :is(.form-control, .form-select) {
    border-color: var(--c9-gray);
}
.edit_fields textarea.max_textlength, .max_textlength {
    height: 380px;
    resize: none;
}
.edit_fields textarea.min_textlength , .min_textlength {
    height: 160px;
    resize: none;
}
.common-upload_blk {
    width: 100%;
    height: 120px;
}
.common-upload_blk label {
    position: relative;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    gap: 8px;
    cursor: pointer;
    background: var(--bs-white);
    padding: 10px;
    border-radius: 8px;
    border: 1px dashed var(--light-gray);
    top: 0;
    left: 0;
}
.common-upload_blk label .add_banner_img_icon {
    width: 16px;
    height: 16px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.common-upload_blk label .add_banner_img_title {
    color: var(--medium-gray);
    text-align: center;
}
span.image_preview {
    position: absolute;
    content: "";
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 8px;
    z-index: 0;
}

span.image_preview img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 8px;
}

.upload_gallery_wrapper {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-wrap: wrap;
    gap: 24px;
}
.upload_gallery_wrapper .common-upload_blk {
    width: 120px;
}
.upload_gallery_item {
    width: 120px;
    height: 120px;
    border-radius: 8px;
    position: relative;
}
.upload_gallery_item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 8px;
}
.remove_gallery_item {
    position: absolute;
    content: "";
    top: 8px;
    right: 8px;
    border: 2px solid var(--bs-red);
    color: var(--bs-red);
    font-size: 13px;
    font-weight: 600;
    text-align: center;
    width: 20px;
    height: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 40px;
    padding: 0px;
    background: #ffb2b2;
    backdrop-filter: blur(2px);
    -webkit-backdrop-filter: blur(2px);
    -moz-backdrop-filter: blur(2px);
    opacity: 0;
}
.upload_gallery_item:hover .remove_gallery_item{
    opacity: 1;
}

.action_button_blk {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 12px;
    margin-top: 24px;
}
.action_button_blk :is(.primary-btn, .primary-outline-btn) {
    flex-grow: 1;
    width: calc(50% - 6px);
}
.download_wrapper .common-upload_blk {
    height: 60px;
}
.download_wrapper .common-upload_blk label {
    gap: 2px;
}
.download_wrapper .add_document_preview {
    background: var(--page-bg);
    padding: 8px;
    border-radius: 8px;
}
.download_wrapper .add_document_preview h2 {
    font-size: 12px;
}
.download_wrapper .add_doc_preview_item {
    background: var(--bs-white);
    padding: 13px 8px;
}
.download_wrapper span.doc_filename {
    font-size: 12px;
}

.download_preview_wrapper .add_doc_preview_item {
    padding: 20px;
    box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.05);
    border: 0px;
}
.download_preview_wrapper .add_doc_preview_item:not(:last-child) {
    margin-bottom: 24px;
}
.download_preview_wrapper .doc_filename {
    font-size: 16px !important;
}
.download_doc_btn {
    padding: 0px;
    border: 0px;
    background: var(--bs-white);
    font-size: 14px;
    font-weight: 700;
    font-family: var(--primary-font);
    color: var(--theme-clr);
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 14px;
    text-decoration: none;
}

.review_location_field {
    padding: 0px;
    margin: 0px;
    background: var(--bs-white);
    border-radius: 0px;
}
.review_location_field span.location-text {
    font-family: var(--sg-font);
    color: var(--medium-gray);
    font-size: 20px;
}

.notification_wrapper {
    max-width: 900px;
    width: 100%;
}
.notification_card_item {
    padding: 24px;
    background: #FAFAFA;
    border-radius: 8px;
    display: flex;
    justify-content: flex-start;
    gap: 24px;
}
.notification_card_item:not(:last-child) {
    margin-bottom: 8px;
}
.notification_card_icon {
    width: 60px;
    height: 60px;
    background: var(--gray-bg);
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 8px;
}
.notification_card_info {
    width: calc(100% - 84px);
}
.notification_title {
    font-size: 20px;
    font-weight: 700;
    color: var(--primary-clr);
    line-height: 24.2px;
    margin-bottom: 12px;
}
.notification_content {
    font-size: 16px;
    color: var(--medium-gray);
    line-height: 19.36px;
    margin-bottom: 12px;
}
.notification_time {
    font-size: 14px;
    color: var(--medium-gray);
}

.detail_component_wrapper {
    max-width: 966px;
    width: 100%;
}
.detail_component_card:not(:last-child) {
    margin-bottom: 40px;
}
.detail_component_header {
    padding-bottom: 24px;
    border-bottom: 1px solid var(--light-gray);
}
.detail_component_title h2 {
    font-size: 20px;
    font-weight: 700;
    color: var(--gray-5f);
    line-height: 24.2px;
    margin-bottom: 0px;
}
.detail_component_box {
    padding: 24px 0px;
}
.detail_component_content_item {
    width: 227px;
}
.detail_component_content_item h3 {
    font-size: 12px;
    font-weight: 400;
    color: var(--gray-58);
    margin-bottom: 8px;
}
.detail_component_content_item p {
    font-size: 14px;
    font-weight: 500;
    color: var(--gray-58);
    margin-bottom: 0px;
}

.ticket_widget_wrapper {
    border: 1px solid var(--gray-bg);
    border-radius: 8px;
    box-shadow: 0px 2px 8px rgba(0, 0, 0, 0.06);
    padding: 18px;
}
.ticket_widget_wrapper .edit_fields .form-field-blk:not(:last-child) {
    margin-bottom: 15px;
}
.ticket_widget_wrapper .outline_wrapper {
    margin-top: 15px !important;
}
.ticket_widget_wrapper .outline_wrapper:not(:last-child) {
    margin-bottom: 15px;
}

.event_date_time_blk {
    margin: 12px 0px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-wrap: wrap;
    gap: 5px 22px;
}
.event_date_time_blk * {
    font-size: 20px;
    font-family: var(--primary-font);
    color: var(--medium-gray);
}
.event_date_blk {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 4px;
}
.event_date_blk_icon {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 18px;
    height: 18px;
}
.sports_badge_blk {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
}
.sports_badge_item {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
}
.sports_badge_icon {
    width: 24px;
    height: 24px;
    display: flex;
    justify-content: center;
    align-items: center;
}
span.sports_badge_title {
    width: calc(100% - 32px);
    font-size: 14px;
    font-weight: 500;
    font-family: var(--primary-font);
    color: var(--medium-gray);
}

.sports_type {
    margin-bottom: 16px;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: center;
    gap: 8px;
}
.sp_type_btn {
    display: inline-flex;
    align-items: center;
    padding: 6px 16px;
    background: #f0f0f0 !important;
    border: 1px solid #e0e0e0;
    border-radius: 20px;
    font-size: 13px !important;
    color: #555 !important;
    white-space: nowrap;
    text-decoration: none;
    line-height: 1.4;
}
.sp_type_btn:hover {
    background: var(--theme-clr) !important;
    color: var(--bs-white) !important;
}
.sp_type_btn.active {
    background: var(--theme-clr) !important;
    color: var(--bs-white) !important;
}

.sports_type h3 {
    font-size: 24px;
    font-weight: 500;
    font-family: var(--primary-font);
    color: var(--medium-gray);
}

:is(.event-swiper-container, .event-single-swiper-container, .event-four-five-swiper-container, .event-six-seven-swiper-container) > .swiper-wrapper{
    -webkit-transition-timing-function: linear !important;
    -o-transition-timing-function: linear !important;
    transition-timing-function: linear !important;
}
.event-swiper-container > .swiper-wrapper .swiper-slide {
    width: 26% !important;
}
.grid_slide_blk {
    width: 100%;
    height: 345px;
    border-radius: 8px;
}
.event-single-swiper-container .grid_slide_blk {
    width: 100%;
}
.event-four-five-swiper-container .swiper-slide {
    width: 50%;
}
.event-four-five-swiper-container .grid_slide_blk {
    width: 100%;
}
.event-six-seven-swiper-container .swiper-slide {
    width: 34.157%;
}
.event-six-seven-swiper-container .grid_slide_blk {
    width: 100%;
}
.grid_slide_item {
    height: 100%;
    border-radius: 8px;
}
.grid-slide-img , .grid-slide-img img {
    width: 100%;
    height: 100%;
    border-radius: 8px;
}
.grid-slide-img img {
    object-fit: cover;
}
.grid_slide_item {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 12px;
}
.grid_slide_item:not(:last-child) {
    margin-bottom: 12px;
}
.slide_box_height {
    height: 166px;
}

.service_accordion_card .outline_inner_wrapper {
    display: none;
}

.coaches_field_wrapper .edit_fields {
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 24px 42px;
    flex-wrap: wrap;
}
.coaches_field_wrapper .upload_gallery_wrapper {
    width: 120px;
}
.coaches_field_wrapper .form-box {
    width: calc(100% - 162px);
    padding-right: 60px;
}

.promotion_card {
    width: 100%;
    padding: 0px;
    border: 1px solid var(--light-gray);
    border-radius: 8px;
}
.promotion_card_img {
    width: 100%;
    height: 180px;
    border-radius: 8px 8px 0px 0px;
}
.promotion_card_img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 8px 8px 0px 0px;
}
.promotion_title_blk {
    background: var(--bs-white);
    border-radius: 0px 0px 8px 8px;
    padding: 16px 16px 20px;
}

.promotion-modal .modal-dialog {
    max-width: 1110px;
}
.promotion-modal .modal-content {
    border: 0px;
    border-radius: 16px;
}
.promotion_modal-body-content {
    position: relative;
}
.promotion_modal-body-content .btn-close {
    position: absolute;
    content: "";
    top: 16px;
    right: 20px;
    opacity: 1;
}
.promotion_modal_img {
    width: 100%;
    height: 294px;
    border-radius: 16px 16px 0px 0px;
}
.promotion_modal_img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 16px 16px 0px 0px;
}
.promotion-modal-content {
    padding: 30px 24px 34px;
    border-radius: 0px 0px 16px 16px;
}
.promotion_content {
    margin-top: 34px;
}
.promotion_content p {
    font-size: 16px;
    text-align: justify;
    line-height: 19.68px;
    color: var(--medium-gray);
    margin-bottom: 0px;
}
.promotion_content p:not(:last-child) {
    margin-bottom: 0px;
}
.main-section .single_page_container {
    min-height: auto;
}
.main-section .plan_card {
    flex-grow: 1;
}


/* ==== Super Admin CSS Start ==== */



.dash_tab_list_wrapper {
    background: var(--page-bg);
    border-radius: 8px;
}
.dash_tab_list_wrapper .search-blk input {
    padding: 10px 10px 10px 50px;
    font-size: 14px;
}
.dash_tab_list_wrapper .search-blk .search-icon {
    left: 35px;
}
.dash_tab_list_blk {
    max-height: 410px;
    overflow-y: auto;
    scrollbar-width: thin;
    padding: 0px 16px 16px;
}
.dash_tab_list_blk .nav-link {
    width: 100%;
    padding: 10px 20px;
    border: 1px solid var(--gray-bg);
    font-size: 14px;
    font-family: var(--primary-font);
    color: var(--medium-gray);
    background: var(--bs-white);
    border-radius: 6px;
    text-align: left;
    transition: all 0.3s ease-in;
}
.dash_tab_list_blk .nav-link.active {
    font-size: 18px;
    font-weight: 600;
}
.graph_shadow {
    box-shadow: 0px 16px 48px rgba(0,0,0,0.08);
}

.plan_cards_wrapper {
    display: flex;
    justify-content: space-around;
    flex-wrap: wrap;
    gap: 20px;
}
.plan_cards_wrapper .switch_toggle_box {
    position: absolute;
    content: "";
    top: 50%;
    right: 24px;
    transform: translateY(-50%);
}
.plan_cards_wrapper .outline_wrapper {
    margin-bottom: 0px;
}
.plan_content .form-flex-blk {
    width: calc(100% - 26px);
}
.percentage_field::before {
    position: absolute;
    content: "%";
    top: 50%;
    right: 15px;
    transform: translateY(-50%);
}
.percentage_blk .form-flex-col:first-child {
    width: 350px;
}
.percentage_blk .form-flex-col:last-child {
    width: 150px;
}

.create_org_wrapper {
    max-width: 738px;
    margin: 0 auto;
}

.select_sports_wrapper .box-select-card {
    width: calc(33% - 12px);
}
.select_sports_wrapper .credential-form-blk {
    border: 1px solid var(--gray-bg);
    border-radius: 8px;
    box-shadow: 0px 1px 8px rgba(0,0,0,0.08);
}
.select_sports_wrapper .form-fields-wrapper {
    padding: 24px;
    border-radius: 8px 8px 0px 0px;
    border-bottom: 1px solid var(--gray-bg);
}


.organization_detail_wrapper {
    max-width: 100%;
}
.organization_detail_wrapper .detail_component_box {
    padding: 24px 0px 0px;
}
.detail_component_card:first-child :is(.detail_component_header, .detail_component_box) {
    max-width: 966px;
}
.detail_component_box .plan_card {
    max-width: 294px !important;
    width: 100%;
}


.cm_listing_title_info {
    padding: 12px 16px;
    width: 145px;
}
.cm_listing_badge_icon {
    width: 18px;
    height: 18px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.cm_listing_badge_text {
    font-size: 14px;
    font-family: var(--primary-font);
    color: var(--medium-gray);
}
:is(.cm_listing_fields, .edit_sports_item) .edit_fields .form-field-blk:first-child {
    width: 415px;
}

.edit_sports_item:not(:last-child) {
    margin-bottom: 35px;
}


/* ==== Super Admin CSS End ==== */

.heading_blk {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    position: relative;
    z-index: 2;
    padding: 0px 20px;
}
.heading_blk p {
    text-align: center;
}
.content_blk :is(p , li) {
    font-size: 18px;
    font-family: var(--primary-font);
    color: var(--medium-gray);
    line-height: 26px;
}

.contact_map_blk {
    width: 100%;
    height: 596px;
    border-radius: 8px;
}

.contact_map_blk iframe {
    width: 100%;
    height: 100%;
    border-radius: 8px;
}
.contact_wrapper {
    padding: 34px;
    border: 2px solid #F3EFEF;
    border-radius: 24px;
    margin-bottom: 50px;
}
.contact_form_wrapper {
    padding: 36px;
    background: var(--page-bg);
    border-radius: 24px;
    border: 1.8px solid #F3EFEF;
}
.contact_form_wrapper .form-field-blk .input-field :is(.form-control, .form-select) {
    border-color: #E0E1E1;
    border-radius: 30px;
}
.contact_form_wrapper .form-field-blk .input-field textarea {
    border-radius: 18px;
    height: 96px;
    resize: none;
}
.contact_info_blk {
    margin-top: 40px;
}
.contact_info_item:not(:last-child) {
    margin-bottom: 38px;
}
.contact_info_item {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 10px;
}
.contact_info_icon {
    width: 48px;
    height: 48px;
    background: #EEFFFE;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
}
.contact_info_detail {
    width: calc(100% - 58px);
}
.contact_info_detail h5 {
    font-size: 14px;
    color: #626C69;
    margin-bottom: 0px;
}
.contact_info_text {
    font-size: 22px;
    font-weight: 400;
    font-family: var(--primary-font);
    color: var(--bs-black);
    text-decoration: none;
}


body {
    background: var(--bs-black);
}
section {
    background: var(--bs-white);
}
header, footer, section:not(.credentials_section) {
    max-width: 1510px;
    margin: 0 auto;
}


.event_hero_section::before {
    background: linear-gradient(0deg, #b9b9b9, #00000038 40%) !important;
}
.event_offerings_info_section {
    padding-top: 50px;
    position: relative;
    z-index: 0;
}
section.event_offerings_info_section::before {
    position: absolute;
    content: "";
    top: 0;
    left: 0;
    width: 100%;
    height: 150px;
    background: linear-gradient(180deg, #B8B8B8, transparent);
    z-index: -1;
}
.heading_info .sub_heading {
    width: calc(100% - 260px);
}
.event_badge_schedule {
    position: absolute;
    content: "";
    top: 20px;
    right: 50px;
    padding: 8px 20px;
    font-size: 20px;
    font-weight: 600;
    font-family: var(--primary-font);
    color: #fff;
    backdrop-filter: blur(5px);
    z-index: 2;
    outline: 1px solid #ffffff;
    outline-offset: 4px;
    border-radius: 8px;
}
.past_event {
    background: #040505;
}
.future_event {
    background: #040505;
}
.event_img_gallery_blk {
    position: absolute;
    content: "";
    bottom: 5px;
    left: 50%;
    transform: translateX(-50%);
    max-width: calc(100% -  20px);
    width: 100%;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 14px;
    z-index: 3;
    padding-right: calc(100% - 92%);
}
.event_img_gallery_btn {
    width: 76px;
    height: 76px;
    border: 0px;
    border-radius: 8px;
    padding: 0px;
}
.event_img_gallery_btn img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 8px;
}
.view_event_img_gallery_btn {
    padding: 0px;
    background: transparent;
    border: 0px;
    font-size: 18px;
    font-family: var(--secondary-font);
    font-weight: 600;
    color: var(--bs-white);
    text-transform: capitalize;
    text-shadow: 2px 3px 4px rgba(0, 0, 0, 0.5);
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
}
.event_img_gallery_blk button:nth-child(4) ~ button:not(:last-child) {
    display: none;
}
.inner_pages_hero_section .image_block {
    bottom: 12px;
}
.image_block {
    position: absolute;
    content: "";
    bottom: 0px;
    left: 50%;
    transform: translateX(-50%);
    width: calc(100% - (270px - 24px));
    z-index: 2;
}
.image_block .management_img {
    margin-bottom: -10px;
}
.gallery-modal .modal-dialog {
    max-width: 1620px;
}
.modal-gallery-content {
    max-width: calc(1510px - (270px - 24px));
    margin: 0 auto;
    position: relative;
}
.gallery_swiper_button_prev {
    position: absolute;
    content: "";
    top: 50%;
    left: -65px;
    background: var(--bs-white);
    width: 50px;
    height: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
}
.gallery_swiper_button_next {
    position: absolute;
    content: "";
    top: 50%;
    right: -65px;
    background: var(--bs-white);
    width: 50px;
    height: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
}
:is(.gallery_swiper_button_prev, .gallery_swiper_button_next) img {
    filter: invert(1);
}
.gallery-modal .modal-content {
    background: transparent;
    border: 0;
    box-shadow: none;
}
.modal-gallery-content .banner-slide-img {
    height: 585px;
    border-radius: 16px;
}
.modal-gallery-content .banner-slide-img img {
    height: 100%;
    border-radius: 16px;
    object-fit: contain !important;
}

.top-header-height {
    top: calc(var(--header-height) - 2px);
    z-index: 4;
}
.tab_line_style_blk .top-header-height {
    background: #fff;
}

/* .scroll_sticky {
    display: flex;
    flex-direction: column;
    gap: 40px;
} */
/*.scroll_sticky .tab_inner_content_wrapper {*/
/*    margin-top: 40px;*/
/*}*/

.sticky_bar {
    background: var(--dark-page-bg);
    z-index: 4;
}
.sticky_bar .tabs_in_one_line .nav-link {
    border-color: var(--dark-page-bg);
    color: var(--bs-white);
}
.sticky_bar .tabs_in_one_line {
    background: var(--dark-page-bg);
    border-color: var(--dark-page-bg);
}
.register_link_btn {
    padding: 12px 22px;
    font-size: 16px;
    font-family: var(--primary-font);
    color: var(--bs-white);
    text-decoration: none;
    border-radius: 40px;
    text-transform: lowercase;
}
.report_block {
    margin-top: 16px;
}
.old_tabs {
    border-color: var(--light-gray) !important;
}
.old_tabs .nav-link {
    background: var(--bs-white);
    border-color: var(--bs-white);
    color: var(--medium-gray);
}

.welcome_img {
    width: 112px;
    height: 112px;
    margin: 0 auto 20px;
}
.welcome_modal .custom-modal-footer :is(.primary-btn, .primary-outline-btn) {
    flex-grow: 0;
    width: calc(30% - 6px);
    border-radius: 30px !important;
}
.welcome_modal p {
    color: var(--gray-8c) !important;
}
/* .offering_tabs_wrapper li.nav-item .sports_nav_link {
    background: var(--bs-white);
    border-color: var(--bs-white);
    color: var(--medium-gray);
} */
.offering_tabs_wrapper .collapse_nav_menu .sports_nav_link:not(:last-child) {
    margin-bottom: 8px;
}
.offering_tabs_wrapper .collapse_nav_menu .sports_nav_link {
    background: #ededed;
    border-color: #ededed;
    color: var(--medium-gray);
 }
 .offering_sports_list_wrapper ul.nav .nav-link.show, .offering_tabs_wrapper .sports_nav_link:hover {
    background: var(--theme-clr) !important;
    color: var(--bs-white) !important;
    border-color: var(--theme-clr) !important;
}
.offering_tabs_wrapper .collapse_nav_menu {
    background: var(--bs-white);
    border-color: #ededed;
}

/* my account css  start */

.acc_wrapper {
    width: 300px;
    padding: 30px;
    border: 1px solid var(--gray-bg);
    border-radius: 12px;
    gap: 24px 24px;
}
.acc_wrapper .nav-link {
    font-size: 18px;
    font-weight: 500;
    color: var(--medium-gray);
    text-align: left;
    border-radius: 0px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 12px;
    padding: 0px;
}
.acc_wrapper .nav-link.active {
    background: var(--bs-white);
    color: var(--theme-clr);
}
.acc_info_icon {
    width: 24px;
    height: 24px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.acc_info_icon + span {
    line-height: normal;
}
.acc_wrapper .nav-link.active svg path {
    fill: var(--theme-clr);
}
.acc_tab_content {
    padding: 30px 30px 70px;
    border: 1px solid var(--gray-bg);
    border-radius: 12px;
    width: calc(100% - 324px);
}
.acc_outline_card {
    padding: 24px;
    border: 1px solid var(--gray-bg);
    border-radius: 12px;
    margin-top: 24px;
}
.acc_profile_blk {
    gap: 12px;
}
.acc_profile_img {
    width: 98px;
    height: 98px;
    border-radius: 50%;
    background: #eaeaea;
}
.acc_profile_info {
    width: calc(100% - 110px);
}
.acc_profile_info p {
    font-size: 18px;
    color: #585858;
}
.acc_profile_img label {
    position: absolute;
    content: "";
    bottom: 0px;
    right: 0px;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: var(--theme-clr);
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center;
}
.acc_outline_header {
    padding: 20px 24px;
    border-bottom: 1px solid var(--gray-bg);
}
.acc_outline_body {
    padding: 24px;
}
.acc_outline_body p {
    font-size: 18px;
}
.acc_sports_list {
    flex-wrap: wrap;
    gap: 20px;
}
.acc_sports_list li {
    padding: 13px 34px;
    border: 1px solid var(--gray-54);
    border-radius: 50px;
    font-size: 20px;
    font-weight: 500;
    color: var(--gray-54);
    white-space: nowrap;
}
.modal_form_field_wrapper .box-select-card {
    width: auto;
}
.modal_form_field_wrapper .box-select-card input + label {
    padding: 13px 34px;
    box-shadow: inset 0px 0px 0px 1px var(--gray-54);
    border-radius: 50px;
    font-size: 20px;
    font-weight: 500;
    color: var(--gray-54);
    white-space: nowrap;
}

.modal_form_field_wrapper .box-select-card input:checked + label {
    background: var(--theme-clr);
    box-shadow: inset 0px 0px 0px 1px var(--theme-clr);
}
.modal_form_field_wrapper .box-checkbox-wrapper .box-select-card input + label h3 {
    font-size: 16px;
    color: var(--gray-54);
    font-weight: 500;
}
.modal_form_field_wrapper .box-checkbox-wrapper .box-select-card input:checked + label h3 {
    color: var(--bs-white);
}
.mysports_modal .modal-content {
    background: var(--dark-page-bg);
}
.mysports_modal .modal-header {
    border-color: #AAA9A9;
}
.mysports_modal .sports_list_item input + label {
    font-size: 32px;
}
.mysports_modal .sports_list_item input + label .tab_pills_title {
    color: #7F7F7F;
}
.mysports_modal .sports_list_item input:checked + label .tab_pills_title {
    color: var(--bs-white);
}
.mysports_modal .custom-modal-footer :is(.primary-btn, .primary-outline-btn) {
    padding: 28px;
    min-width: 228px;
    font-size: 20px;
    font-weight: 500;
}
.mysports_modal .custom-modal-footer .primary-outline-btn {
    background: #F3F3F3;
    border-color: #F3F3F3;
}
.mysports_modal .btn-close {
    --bs-btn-close-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath d='M.293.293a1 1 0 0 1 1.414 0L8 6.586 14.293.293a1 1 0 1 1 1.414 1.414L9.414 8l6.293 6.293a1 1 0 0 1-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 0 1-1.414-1.414L6.586 8 .293 1.707a1 1 0 0 1 0-1.414z'/%3e%3c/svg%3e");
    opacity: 1;
}

.after_login_banner::before {
    position: absolute;
    content: "";
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #00000069;
}
.after_login_banner::after {
    position: absolute;
    content: "";
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100px;
    background: linear-gradient(0deg, #040505, transparent);
}
.loc-custom-tooltip .tooltip-inner {
    background-color: var(--bs-black) !important;
    border: 1px solid #373838 !important;
    padding: 10px 15px !important;
    font-size: 12px !important;
    letter-spacing: 0.3px !important;
}
.loc-custom-tooltip .tooltip-arrow::before {
    border-bottom-color: #373838 !important;
}

.afterlogin {
    position: absolute;
    content: "";
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.remember-me-blk input#remember {
    accent-color: var(--primary-clr);
}

.service_offering_new_wrapper .offering_heading {
    border-radius: 15px;
    background: linear-gradient(170deg, #040505 30%, #ffffff00 70%);
    padding: 10px 0px 10px 30px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
}
.service_offering_new_wrapper .offering_heading h2 {
    color: var(--bs-white);
}
.service_offering_new_wrapper .offering_heading .primary-btn {
    padding: 8px 20px;
    font-weight: 500;
}
.offering_nav.service_all_nav {
    position: static;
    transform: none !important;
    width: fit-content;
    width: 100%;
    background: transparent;
    margin-top: 10px;
    box-shadow: none;
    padding-top: 24px;
    padding-bottom: 20px;
    z-index: 0;
}
.full_search_wrp .search_for_what {
    width: 100%;
    justify-content: flex-start;
}
.full_search_wrp [class^="search_for"] label {
    width: 70px;
}
.full_search_wrp [class^="search_for"]:first-child .form-control {
    width: calc(100% - 58px);
}
.offering_nav.service_all_nav .offering_btn {
    display: flex;
    flex-direction: row;
    padding: 14px 14px;
    border-radius: 10px;
    gap: 6px;
}
.offering_nav.service_all_nav .offering_btn_icon {
    width: 25px;
    height: 25px;
}
.offering_nav.service_all_nav .offering_nav_list {
    gap: 15px 20px;
}
.translate-none {
    transform: none !important;
}
.offering_nav:not(.service_all_nav) {
    background: #000;
}
.offering_nav:not(.service_all_nav) .offering_btn {
    background: var(--bs-black);
}
.offering_nav:not(.service_all_nav) .offering_btn_title {
    color: var(--bs-white);
}
.offering_nav:not(.service_all_nav) .offering_btn.active .offering_btn_title {
    color: #29b3a8 !important;
}

.vertical_nav {
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    flex-wrap: wrap;
    gap: 15px;
}
.vertical_nav .sports_tabs_blk ul.nav {
    padding-right: 0px;
}
.vertical_nav .subtab_inner_content {
    margin: 0px;
}
.vertical_nav .sports_tabs_blk {
    width: 200px;
}
.vertical_nav .tab-content {
    width: calc(100% - 215px);
}
.vertical_nav .sports_tabs_blk .nav-link, .vertical_nav .sports_tabs_blk .nav-link.active {
    background: var(--bs-white) !important;
    padding: 5px 0px !important;
    font-size: 20px !important;
    font-weight: 400 !important;
}
.vertical_nav .sports_tabs_blk .nav-link .tab_pills_title {
    color: var(--bs-black) !important;
}
.vertical_nav .sports_tabs_blk .nav-link.active .tab_pills_title {
    color: var(--theme-clr) !important;
    font-weight: 500 !important;
}
.innertab_wrapper ul.nav {
    gap: 15px !important;
    padding: 0px !important;
    flex-wrap: wrap !important;
    border: 0px !important;
}
.innertab_wrapper ul.nav .nav-link {
    font-size: 14px !important;
    color: var(--bs-white) !important;
    background: var(--bs-black) !important;
    padding: 8px 16px !important;
    border: 0px !important;
}
.innertab_wrapper ul.nav .nav-link.active {
    background: var(--theme-clr) !important;
    font-weight: 500 !important;
}
.innertab_wrapper .tab-content {
    width: 100% !important;
}

.tags_tab .nav {
    background: transparent;
    border: 0px;
    padding: 0px !important;
}

/* ── Favourite heart on listing cards ──
   Always in the DOM (no Alpine hover gate — mouseenter never fires on a phone, and the
   Race Plan shortlist's only inbound path is this heart). Pointer devices reveal it on
   hover/focus, or always once favourited; touch devices always show it (see the
   hover:none block and the max-width:767px block below). */
.fav-overlay {
    position: absolute;
    top: 10px;
    right: 10px;
    z-index: 10;
    background: rgba(255, 255, 255, 0.92);
    border-radius: 50%;
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    box-shadow: 0 1px 5px rgba(0, 0, 0, 0.18);
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.15s ease;
}
/* Pointer devices: the heart appears on hover/focus only — a shortlisted race no longer keeps its
   heart on screen (23 Sep 2026: it sat over the date badge on every shortlisted tile). Touch
   devices keep it always visible below, since there is no hover. */
.offering_item_card:hover .fav-overlay,
.offering_item_card:focus-within .fav-overlay {
    opacity: 1;
    pointer-events: auto;
}
@media (hover: none) {
    .fav-overlay {
        opacity: 1;
        pointer-events: auto;
    }
}
/* On a pointer device the circle opens into a pill that says what the heart does
   ("Add to shortlist" on an event, "Add to favourites" on an organisation) — the date
   badge steps aside on hover, so the corner is free (11 Sep 2026). Touch keeps the circle:
   the label is hidden there, the 2-col mobile grid has no room for it. */
.fav-overlay__label {
    display: none;
    font-size: 13px;
    font-weight: 600;
    line-height: 1;
    color: #00615a;
    white-space: nowrap;
}
@media (hover: hover) {
    .offering_item_card:hover .fav-overlay--labelled,
    .offering_item_card:focus-within .fav-overlay--labelled {
        width: auto;
        border-radius: 999px;
        padding: 0 14px 0 10px;
        gap: 7px;
    }
    .offering_item_card:hover .fav-overlay__label,
    .offering_item_card:focus-within .fav-overlay__label {
        display: inline;
    }
}
/* My Favourites page grids */
.fav-events-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    justify-content: flex-start;
}
.fav-orgs-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 20px;
}

/* Mobile: heart always visible (no hover on touch); the date badge shifts left so the two
   never collide in the top-right corner; 2-col grids */
@media (max-width: 767px) {
    .fav-overlay {
        opacity: 1;
        pointer-events: auto;
    }
    /* flex (the desktop column), not block: block laid day, month and year out in one row too
       wide for a phone tile, and the 48px shift below put its first digit under the sport icon
       (27 Oct 2026 audit: "3 NOV" for 13 Nov on every landing-page card). */
    .offering_card_date {
        display: flex !important;
        opacity: 1 !important;
    }
    .offering_item_card .offering_card_date {
        margin-right: 48px;
    }
    .fav-events-grid {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 12px;
    }
    .fav-events-grid .offering_item_card {
        width: 100%;
        height: 260px;
    }
    .fav-orgs-grid {
        grid-template-columns: 1fr 1fr;
        gap: 12px;
    }
}

/* Report a review / hide its author (schema 021, 1 Oct 2026): a quiet link row under the comment. */
.review_actions { display: flex; justify-content: flex-end; margin-top: 6px; }
/* a <button> and an <a> alike: a quiet text link, over the site's general button styling */
.review_wrapper .review_actions .review_action,
.review_wrapper .review_actions button.review_action,
.review_wrapper .review_actions a.review_action {
    display: inline; width: auto; min-height: 0; border: 0; border-radius: 0; box-shadow: none; background: transparent;
    padding: 4px 0; margin: 0; color: #6c757d; font-size: 13px; font-weight: 400; line-height: 1.4;
    text-decoration: underline; text-underline-offset: 2px; cursor: pointer;
}
.review_wrapper .review_actions .review_action:hover,
.review_wrapper .review_actions .review_action:focus-visible { color: #00A99D; background: transparent; }