/* HULLAA approved Digits login design. Loaded after Digits' own stylesheet. */
:root {
    --hullaa-login-green: #26351f;
    --hullaa-login-green-dark: #1f2f1a;
    --hullaa-login-green-light: #415a32;
    --hullaa-login-surface: #f6f6f6;
    --hullaa-login-text: #1f1f1f;
}

.digits_form_shortcode_render,
.digits_form_shortcode_render *,
.dig_ma-box,
.dig_ma-box * {
    font-family: "Cairo", "Tajawal", Arial, sans-serif !important;
    box-sizing: border-box;
}

/* Full-page form shortcode */
body:has(.digits_form_shortcode_render) {
    min-height: 100vh;
    background: linear-gradient(180deg, #ffffff 0%, #f7f5ef 100%) !important;
}

.digits_form_shortcode_render.dig_pgmdl_2 {
    width: calc(100% - 32px) !important;
    max-width: 440px !important;
    margin: clamp(24px, 6vh, 64px) auto !important;
    padding: 28px 24px !important;
    border: 1px solid rgba(38, 53, 31, 0.07) !important;
    border-radius: 28px !important;
    background: #ffffff !important;
    box-shadow: 0 22px 60px rgba(38, 53, 31, 0.12) !important;
}

.digits_form_shortcode_render .dig_form,
.digits_form_shortcode_render .digits_login_form,
.digits_form_shortcode_render .dig-container {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 auto !important;
    padding: 0 !important;
}

.digits_form_shortcode_render .digloginpage,
.digits_form_shortcode_render .forgot,
.digits_form_shortcode_render .register {
    float: none !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 auto !important;
}

/* Log-in and registration headings */
.digits_form_shortcode_render .digits-form_heading,
.digits_form_shortcode_render .digits-form_heading_text,
.dig_ma-box .digits_bx_head,
.dig_ma-box .dig-box-login-title {
    color: var(--hullaa-login-text) !important;
    font-weight: 900 !important;
}

.digits_form_shortcode_render .digits-form_heading {
    margin: 0 0 20px !important;
    text-align: center !important;
}

.digits_form_shortcode_render .digits-form_heading_text,
.dig_ma-box .dig-box-login-title {
    font-size: 38px !important;
    line-height: 1.25 !important;
}

.dig_ma-box .digits_bx_head {
    padding-bottom: 16px !important;
    text-align: center !important;
}

/* Phone/email choice tabs */
.digits_form_shortcode_render .digits-form_tab-item,
.dig_ma-box .digits-form_tab-item {
    border-bottom: 4px solid transparent !important;
    border-radius: 12px 12px 0 0 !important;
    color: #666666 !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    padding: 12px 10px !important;
    transition: color 0.18s ease, background-color 0.18s ease, border-color 0.18s ease !important;
}

.digits_form_shortcode_render .digits-form_tab-item.digits-tab_active,
.dig_ma-box .digits-form_tab-item.digits-tab_active {
    background: #eef1ea !important;
    border-bottom-color: var(--hullaa-login-green) !important;
    color: var(--hullaa-login-green) !important;
    font-weight: 800 !important;
}

/* Phone, email, password, and other Digits fields */
.digits_form_shortcode_render .minput input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="submit"]),
.digits_form_shortcode_render .minput textarea,
.digits_form_shortcode_render .minput select,
.dig_ma-box .minput input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="submit"]),
.dig_ma-box .minput textarea,
.dig_ma-box .minput select {
    min-height: 62px !important;
    height: 62px !important;
    border: 1px solid #e8e9e3 !important;
    border-radius: 16px !important;
    background: var(--hullaa-login-surface) !important;
    box-shadow: none !important;
    color: var(--hullaa-login-text) !important;
    font-size: 16px !important;
    line-height: 1.4 !important;
    padding: 0 18px !important;
    transition: border-color 0.18s ease, box-shadow 0.18s ease, background-color 0.18s ease !important;
}

.digits_form_shortcode_render .minput input:focus,
.digits_form_shortcode_render .minput textarea:focus,
.digits_form_shortcode_render .minput select:focus,
.dig_ma-box .minput input:focus,
.dig_ma-box .minput textarea:focus,
.dig_ma-box .minput select:focus {
    border-color: var(--hullaa-login-green) !important;
    background: #ffffff !important;
    box-shadow: 0 0 0 3px rgba(38, 53, 31, 0.12) !important;
    outline: none !important;
}

.digits_form_shortcode_render .minput input::placeholder,
.digits_form_shortcode_render .minput textarea::placeholder,
.dig_ma-box .minput input::placeholder,
.dig_ma-box .minput textarea::placeholder {
    color: #8b8d86 !important;
    opacity: 1 !important;
}

/* Keep the Oman dialing code visually distinct and left-to-right. */
.digits_form_shortcode_render .countrycode,
.digits_form_shortcode_render .countrycodecontainer,
.dig_ma-box .countrycode,
.dig_ma-box .countrycodecontainer {
    direction: ltr !important;
    text-align: center !important;
}

.digits_form_shortcode_render .countrycode,
.dig_ma-box .countrycode {
    color: var(--hullaa-login-green) !important;
    font-weight: 800 !important;
}

/* Primary actions */
.digits_form_shortcode_render .dig_lrf_box .button,
.digits_form_shortcode_render .dig_lrf_box .transupbutton,
.digits_form_shortcode_render .dig_lrf_box .signupbutton,
.dig_ma-box .button,
.dig_ma-box .transupbutton,
.dig_ma-box .signupbutton {
    width: 100% !important;
    min-height: 64px !important;
    height: 64px !important;
    margin: 14px 0 0 !important;
    padding: 0 20px !important;
    border: 0 !important;
    border-radius: 16px !important;
    background: linear-gradient(135deg, var(--hullaa-login-green-dark) 0%, var(--hullaa-login-green-light) 100%) !important;
    box-shadow: 0 8px 20px rgba(31, 47, 26, 0.16) !important;
    color: #ffffff !important;
    cursor: pointer !important;
    font-size: 17px !important;
    font-weight: 800 !important;
    line-height: 1.2 !important;
    text-transform: none !important;
    transition: transform 0.18s ease, box-shadow 0.18s ease, filter 0.18s ease !important;
}

.digits_form_shortcode_render .dig_lrf_box .button:hover,
.digits_form_shortcode_render .dig_lrf_box .transupbutton:hover,
.dig_ma-box .button:hover,
.dig_ma-box .transupbutton:hover {
    box-shadow: 0 11px 24px rgba(31, 47, 26, 0.22) !important;
    filter: brightness(1.05);
    transform: translateY(-1px);
}

.digits_form_shortcode_render .dig_login_signup_bar,
.dig_ma-box .dig_login_signup_bar {
    margin: 22px 0 0 !important;
    color: #6d7068 !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    line-height: 1.8 !important;
    text-align: center !important;
}

.digits_form_shortcode_render .dig_login_signup_bar span,
.dig_ma-box .dig_login_signup_bar span {
    color: inherit !important;
    opacity: 1 !important;
}

.digits_form_shortcode_render .dig_login_signup_bar a,
.digits_form_shortcode_render .forgotpassworda,
.digits_form_shortcode_render .backtoLoginContainer a,
.dig_ma-box .dig_login_signup_bar a,
.dig_ma-box .forgotpassworda,
.dig_ma-box .backtoLoginContainer a {
    color: var(--hullaa-login-green) !important;
    font-weight: 800 !important;
    text-decoration: none !important;
}

.digits_form_shortcode_render .dig_login_signup_bar a:hover,
.digits_form_shortcode_render .forgotpassworda:hover,
.dig_ma-box .dig_login_signup_bar a:hover,
.dig_ma-box .forgotpassworda:hover {
    text-decoration: underline !important;
}

.digits_form_shortcode_render .dig_login_rembe,
.dig_ma-box .dig_login_rembe {
    color: #55584f !important;
    font-size: 14px !important;
}

/* Digits popup/modal form */
.dig_ma-box.dig-box {
    background: rgba(31, 47, 26, 0.42) !important;
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);
}

.dig_ma-box.dig-box .dig-modal-con {
    width: calc(100vw - 32px) !important;
    max-width: 440px !important;
    border: 1px solid rgba(38, 53, 31, 0.07) !important;
    border-radius: 28px !important;
    background: #ffffff !important;
    box-shadow: 0 22px 60px rgba(38, 53, 31, 0.18) !important;
    overflow: hidden !important;
}

.dig_ma-box.dig-box .digits_bx_cred_frm_container {
    padding: 28px 24px !important;
    background: #ffffff !important;
}

.dig_ma-box.dig-box .digloginpage,
.dig_ma-box.dig-box .forgot,
.dig_ma-box.dig-box .register {
    float: none !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 auto !important;
}

@media (max-width: 767px) {
    .digits_form_shortcode_render.dig_pgmdl_2 {
        width: calc(100% - 32px) !important;
        margin: 24px auto !important;
        padding: 26px 20px !important;
        border-radius: 28px !important;
    }

    .digits_form_shortcode_render .digits-form_heading_text,
    .dig_ma-box .dig-box-login-title {
        font-size: 34px !important;
    }

    .digits_form_shortcode_render .minput input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="submit"]),
    .digits_form_shortcode_render .minput textarea,
    .digits_form_shortcode_render .minput select,
    .dig_ma-box .minput input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="submit"]),
    .dig_ma-box .minput textarea,
    .dig_ma-box .minput select {
        min-height: 60px !important;
        height: 60px !important;
    }

    .digits_form_shortcode_render .dig_lrf_box .button,
    .digits_form_shortcode_render .dig_lrf_box .transupbutton,
    .digits_form_shortcode_render .dig_lrf_box .signupbutton,
    .dig_ma-box .button,
    .dig_ma-box .transupbutton,
    .dig_ma-box .signupbutton {
        min-height: 62px !important;
        height: 62px !important;
    }

    .dig_ma-box.dig-box .digits_bx_cred_frm_container {
        padding: 26px 20px !important;
    }
}

/* Digits' newer embedded form is the markup used on HULLAA's current page. */
.digits_ui,
.digits_ui *,
.digits_ui .digits-form_page,
.digits_ui .digits-form_page * {
    font-family: "Cairo", "Tajawal", Arial, sans-serif !important;
    box-sizing: border-box !important;
}

.digits_ui .digits-form_page {
    min-height: 100vh !important;
    padding: 24px 16px !important;
    background: linear-gradient(180deg, #ffffff 0%, #f7f5ef 100%) !important;
}

.digits_ui .digits-form_page .digits-form_container {
    width: 100% !important;
    max-width: 440px !important;
    margin: 0 auto !important;
    padding: 28px 24px !important;
    border: 1px solid rgba(38, 53, 31, 0.07) !important;
    border-radius: 28px !important;
    background: #ffffff !important;
    box-shadow: 0 22px 60px rgba(38, 53, 31, 0.12) !important;
    color: var(--hullaa-login-text) !important;
}

.digits_ui .digits-form_wrapper,
.digits_ui .digits-form_login,
.digits_ui .digits-form_register,
.digits_ui .digits-form_forgot_password {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 auto !important;
    padding: 0 !important;
    background: transparent !important;
}

.digits_ui .digits-form_heading,
.digits_ui .digits-form_heading_text {
    color: var(--hullaa-login-text) !important;
    font-size: 38px !important;
    font-weight: 900 !important;
    line-height: 1.25 !important;
    text-align: center !important;
}

.digits_ui .digits-form_heading {
    margin: 0 0 20px !important;
}

.digits_ui .digits-form_tab-bar .digits-form_tab-item {
    border-bottom: 4px solid transparent !important;
    border-radius: 12px 12px 0 0 !important;
    color: #74766f !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    opacity: 1 !important;
    padding: 12px 10px !important;
}

.digits_ui .digits-form_tab-bar .digits-form_tab-item.digits-tab_active {
    border-bottom-color: var(--hullaa-login-green) !important;
    background: #eef1ea !important;
    color: var(--hullaa-login-green) !important;
    font-weight: 900 !important;
    opacity: 1 !important;
}

.digits_ui .digits-form_input input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="submit"]),
.digits_ui .digits-form_input textarea,
.digits_ui .digits-form_input select {
    width: 100% !important;
    min-height: 62px !important;
    height: 62px !important;
    border: 1px solid #e8e9e3 !important;
    border-radius: 16px !important;
    background: var(--hullaa-login-surface) !important;
    box-shadow: none !important;
    color: var(--hullaa-login-text) !important;
    font-size: 16px !important;
    line-height: 1.4 !important;
    padding: 0 18px !important;
}

.digits_ui .digits-form_input input:focus,
.digits_ui .digits-form_input textarea:focus,
.digits_ui .digits-form_input select:focus {
    border-color: var(--hullaa-login-green) !important;
    background: #ffffff !important;
    box-shadow: 0 0 0 3px rgba(38, 53, 31, 0.12) !important;
    outline: none !important;
}

.digits_ui .digits-form_input input::placeholder,
.digits_ui .digits-form_input textarea::placeholder {
    color: #8b8d86 !important;
    opacity: 1 !important;
}

.digits_ui .digits-form_countrycode,
.digits_ui .digits-form_countrycode .countrycode {
    direction: ltr !important;
    text-align: center !important;
}

.digits_ui .digits-form_countrycode .countrycode {
    color: var(--hullaa-login-green) !important;
    font-weight: 800 !important;
}

.digits_ui .digits-mobile_wrapper {
    min-height: 62px !important;
    border: 1px solid #e8e9e3 !important;
    border-radius: 16px !important;
    background: var(--hullaa-login-surface) !important;
}

.digits_ui .digits-mobile_wrapper:focus-within {
    border-color: var(--hullaa-login-green) !important;
    box-shadow: 0 0 0 3px rgba(38, 53, 31, 0.12) !important;
}

.digits_ui .digits-mobile_wrapper .digits-form_countrycode input,
.digits_ui .digits-mobile_wrapper .digits-form_input:not(.digits-form_countrycode) input {
    min-height: 60px !important;
    height: 60px !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

.digits_ui .digits-form_button,
.digits_ui .digits-form_button[type="submit"] {
    width: 100% !important;
    min-height: 64px !important;
    height: 64px !important;
    margin-top: 14px !important;
    padding: 0 20px !important;
    border: 0 !important;
    border-radius: 16px !important;
    background: linear-gradient(135deg, var(--hullaa-login-green-dark) 0%, var(--hullaa-login-green-light) 100%) !important;
    box-shadow: 0 8px 20px rgba(31, 47, 26, 0.16) !important;
    color: #ffffff !important;
    font-size: 17px !important;
    font-weight: 800 !important;
    line-height: 1.2 !important;
    text-transform: none !important;
}

.digits_ui .digits-form_button:hover {
    box-shadow: 0 11px 24px rgba(31, 47, 26, 0.22) !important;
    filter: brightness(1.05);
    transform: translateY(-1px);
}

.digits_ui .digits-form_login_separator {
    color: #74766f !important;
    margin: 18px 0 !important;
}

.digits_ui .digits-form_footer,
.digits_ui .dig_login_signup_bar {
    margin-top: 22px !important;
    color: #6d7068 !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    line-height: 1.8 !important;
    text-align: center !important;
}

.digits_ui .digits-form_footer a,
.digits_ui .dig_login_signup_bar a,
.digits_ui .digits-form_footer .show_register,
.digits_ui .dig_login_signup_bar .show_register {
    color: var(--hullaa-login-green) !important;
    font-weight: 800 !important;
    text-decoration: none !important;
}

.digits_ui .digits-form_footer a:hover,
.digits_ui .dig_login_signup_bar a:hover {
    text-decoration: underline !important;
}

.digits_ui .dig_login_rembe,
.digits_ui .digits-form_remember_me {
    color: #55584f !important;
    font-size: 14px !important;
}

@media (max-width: 767px) {
    .digits_ui .digits-form_page {
        padding: 20px 16px !important;
    }

    .digits_ui .digits-form_page .digits-form_container {
        width: 100% !important;
        max-width: 440px !important;
        padding: 26px 20px !important;
    }

    .digits_ui .digits-form_heading,
    .digits_ui .digits-form_heading_text {
        font-size: 34px !important;
    }

    .digits_ui .digits-form_input input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="submit"]),
    .digits_ui .digits-form_input textarea,
    .digits_ui .digits-form_input select {
        min-height: 60px !important;
        height: 60px !important;
    }

    .digits_ui .digits-form_button,
    .digits_ui .digits-form_button[type="submit"] {
        min-height: 62px !important;
        height: 62px !important;
    }
}

/* Keep the embedded checkout form compact instead of reserving a full screen. */
body.woocommerce-checkout .digits_ui .digits-form_page {
    display: block !important;
    height: auto !important;
    min-height: 0 !important;
    justify-content: flex-start !important;
    padding: 16px !important;
    background: transparent !important;
}

body.woocommerce-checkout .digits_ui .digits-form_container {
    height: auto !important;
    min-height: 0 !important;
    flex: 0 0 auto !important;
    margin: 0 auto !important;
    padding: 24px !important;
}

.digits_ui .digits-form_container,
.digits_ui .digits-form_wrapper,
.digits_ui form.digloginpage,
.digits_ui form.register,
.digits_ui form.forgot,
.digits_ui .digits-form_tab_wrapper,
.digits_ui .digits-form_body_wrapper,
.digits_ui .digits-form_tab_body {
    height: auto !important;
    min-height: 0 !important;
}

.digits_ui .digits-form_body {
    margin-top: 14px !important;
}

.digits_ui .digits-form_heading {
    margin-bottom: 14px !important;
}

.digits_ui .digits-form_input_row {
    margin-bottom: 14px !important;
}

.digits_ui .digits_captcha_row {
    margin: 10px 0 0 !important;
}

.digits_ui .digits-form_login_separator {
    margin: 12px 0 !important;
}

.digits_ui .digits-form_footer,
.digits_ui .dig_login_signup_bar {
    margin-top: 14px !important;
}

/* Make Passwordless a quieter secondary action and remove its arrow icon. */
.digits_ui .digits-form_passwordless_login,
.digits_ui .digits-form_passwordless_login[type="submit"] {
    min-height: 54px !important;
    height: 54px !important;
    margin-top: 10px !important;
    border: 1px solid #d9ded4 !important;
    background: #ffffff !important;
    box-shadow: none !important;
    color: var(--hullaa-login-green) !important;
}

.digits_ui .digits-form_passwordless_login .digits-form_button_ic {
    display: none !important;
}

.digits_ui .hullaa-digits-register-note {
    margin: 0 0 16px !important;
    padding: 12px 14px !important;
    border: 1px solid rgba(38, 53, 31, 0.1) !important;
    border-radius: 12px !important;
    background: #eef1ea !important;
    color: var(--hullaa-login-green) !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 1.7 !important;
    text-align: start !important;
}

@media (max-width: 767px) {
    body.woocommerce-checkout .digits_ui .digits-form_page {
        padding: 10px 12px !important;
    }

    body.woocommerce-checkout .digits_ui .digits-form_container {
        padding: 22px 18px !important;
    }
}