/* *****************************************************

    ** Custom Stylesheet **

    Any custom styling you want to apply should be
    defined here.

***************************************************** */

/* Custom CSS for Serepok
 *
 * This block allows you to customize theme colors and styles for the entire Serepok template.
 *
 * To customize colors:
 * - Replace the var() references with your own hex colors or other CSS values.
 * - For example, instead of --primary: #4b5563; use --primary: #your-color;
 * - You can also override any CSS properties here.
 */

html {
    font-size: 14px;
}

:root {
    --mtd-scheme-primary: var(--brand-primary, var(--text-primary-color, var(--btn-primary-bg, #1f6bff)));
    --mtd-scheme-primary-text: var(--btn-primary-color, #ffffff);
    --mtd-scheme-primary-hover: var(--btn-primary-hover-bg, color-mix(in srgb, var(--mtd-scheme-primary) 82%, #07111f));
    --mtd-scheme-primary-deep: color-mix(in srgb, var(--mtd-scheme-primary) 76%, #0f172a);
    --mtd-scheme-primary-dark: color-mix(in srgb, var(--mtd-scheme-primary) 36%, #0f172a);
    --mtd-scheme-primary-soft: color-mix(in srgb, var(--mtd-scheme-primary) 10%, #ffffff);
    --mtd-scheme-primary-surface: color-mix(in srgb, var(--mtd-scheme-primary) 5%, #ffffff);
    --mtd-scheme-primary-border: color-mix(in srgb, var(--mtd-scheme-primary) 26%, transparent);
    --mtd-scheme-primary-focus: color-mix(in srgb, var(--mtd-scheme-primary) 14%, transparent);
    --mtd-scheme-primary-shadow: color-mix(in srgb, var(--mtd-scheme-primary) 24%, transparent);
    --mtd-scheme-primary-grid: color-mix(in srgb, var(--mtd-scheme-primary) 8%, transparent);
    --mtd-scheme-accent: var(--brand-secondary, var(--brand-info, #0f766e));
    --mtd-scheme-accent-soft: color-mix(in srgb, var(--mtd-scheme-accent) 10%, transparent);
}

@keyframes mtd-auth-bar-rain {
    0% {
        background-position:
            -280px -560px,
            80px -500px,
            360px -640px,
            520px -460px;
    }

    100% {
        background-position:
            160px 560px,
            520px 620px,
            780px 520px,
            980px 640px;
    }
}

@media (prefers-reduced-motion: reduce) {
    body.login .mtd-login-visual .line-bg::before,
    #wrapper.mtd-reset-screen .mtd-reset-visual::after {
        animation: none !important;
    }
}

/* Auth field icon alignment fix */
body.login .mtd-login-input-wrap,
#wrapper.mtd-reset-screen .mtd-reset-input-wrap {
    position: relative;
    display: block !important;
    min-height: 58px;
    padding: 0 !important;
    overflow: visible;
}

body.login .mtd-login-input-icon,
#wrapper.mtd-reset-screen .mtd-reset-input-icon {
    position: absolute;
    left: 18px;
    top: 50%;
    z-index: 3;
    width: 22px;
    height: 22px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin: 0;
    color: #94a3b8;
    line-height: 1;
    pointer-events: none;
    transform: translateY(-50%);
}

#wrapper.mtd-reset-screen .mtd-reset-input-icon {
    color: #64748b;
}

body.login .mtd-login-input-icon i,
#wrapper.mtd-reset-screen .mtd-reset-input-icon i {
    display: block;
    line-height: 1;
}

body.login .mtd-login-input-wrap .form-control,
#wrapper.mtd-reset-screen .mtd-reset-input-wrap .form-control {
    display: block;
    width: 100% !important;
    height: 58px;
    min-height: 58px;
    padding: 0 16px 0 52px !important;
    border: 0 !important;
    box-shadow: none !important;
    line-height: 58px;
}

body.login .mtd-login-password-wrap .form-control {
    padding-right: 68px !important;
}

body.login .mtd-login-password-wrap .input-group-append {
    position: absolute;
    top: 50%;
    right: 8px;
    z-index: 4;
    display: flex;
    width: auto;
    height: auto;
    margin: 0;
    transform: translateY(-50%);
}

body.login .mtd-login-reveal {
    width: 42px;
    height: 42px;
    min-width: 42px;
    min-height: 42px;
    margin: 0;
    border-radius: 8px;
    line-height: 1;
}

body.login .mtd-login-reveal i {
    display: block;
    line-height: 1;
}

@media (max-width: 560px) {
    body.login .mtd-login-input-wrap,
    #wrapper.mtd-reset-screen .mtd-reset-input-wrap {
        min-height: 54px;
    }

    body.login .mtd-login-input-icon,
    #wrapper.mtd-reset-screen .mtd-reset-input-icon {
        left: 16px;
    }

    body.login .mtd-login-input-wrap .form-control,
    #wrapper.mtd-reset-screen .mtd-reset-input-wrap .form-control {
        height: 54px;
        min-height: 54px;
        padding-left: 48px !important;
        line-height: 54px;
    }

    body.login .mtd-login-password-wrap .form-control {
        padding-right: 62px !important;
    }

    body.login .mtd-login-reveal {
        width: 38px;
        height: 38px;
        min-width: 38px;
        min-height: 38px;
    }
}

/* Password reset screen rebuild */
#wrapper.mtd-reset-screen {
    min-height: 100vh;
    padding: 42px 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    background:
        linear-gradient(122deg, rgba(238, 246, 255, 0.96) 0 30%, rgba(255, 255, 255, 0.98) 30% 62%, rgba(232, 247, 242, 0.95) 62% 100%),
        url("../images/loginBg.jpg") center / cover no-repeat;
}

#wrapper.mtd-reset-screen .mtd-reset-page-container {
    width: min(1080px, 100%);
    min-height: min(760px, calc(100vh - 84px));
    padding: 0;
    display: flex;
    align-items: stretch;
    justify-content: center;
}

#wrapper.mtd-reset-screen .mtd-reset-shell {
    width: 100%;
    display: grid;
    grid-template-columns: minmax(330px, 0.9fr) minmax(390px, 1fr);
    overflow: hidden;
    color: #111827;
    background: #ffffff;
    border: 1px solid rgba(148, 163, 184, 0.22);
    border-radius: 8px;
    box-shadow: 0 26px 70px rgba(15, 23, 42, 0.16);
}

#wrapper.mtd-reset-screen .mtd-reset-visual {
    position: relative;
    min-height: 680px;
    padding: 46px;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    color: #ffffff;
    background:
        radial-gradient(circle at 22% 16%, color-mix(in srgb, var(--mtd-scheme-primary) 42%, transparent) 0 18%, transparent 36%),
        radial-gradient(circle at 86% 82%, color-mix(in srgb, var(--mtd-scheme-accent) 34%, transparent) 0 20%, transparent 42%),
        linear-gradient(145deg, color-mix(in srgb, var(--mtd-scheme-primary-deep) 68%, #2f6eed) 0%, color-mix(in srgb, var(--mtd-scheme-primary) 70%, #5aa4ff) 52%, color-mix(in srgb, var(--mtd-scheme-accent) 72%, #249bd6) 100%);
}

#wrapper.mtd-reset-screen .mtd-reset-visual::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        linear-gradient(110deg, transparent 0 18%, rgba(255, 255, 255, 0.22) 18.2% 18.58%, transparent 18.85% 100%),
        linear-gradient(110deg, transparent 0 31%, rgba(255, 255, 255, 0.14) 31.2% 31.55%, transparent 31.85% 100%),
        linear-gradient(110deg, transparent 0 48%, color-mix(in srgb, var(--mtd-scheme-accent) 34%, rgba(255, 255, 255, 0.18)) 48.25% 48.68%, transparent 49% 100%),
        linear-gradient(110deg, transparent 0 64%, rgba(255, 255, 255, 0.16) 64.15% 64.55%, transparent 64.88% 100%),
        linear-gradient(110deg, transparent 0 79%, rgba(255, 255, 255, 0.2) 79.15% 79.5%, transparent 79.8% 100%),
        repeating-linear-gradient(90deg, rgba(255, 255, 255, 0.13) 0 1px, transparent 1px 64px),
        repeating-linear-gradient(180deg, rgba(255, 255, 255, 0.08) 0 1px, transparent 1px 64px);
    opacity: 0.9;
}

#wrapper.mtd-reset-screen .mtd-reset-visual::after {
    content: "";
    position: absolute;
    inset: -36% -28%;
    background:
        linear-gradient(110deg, transparent 0 44%, rgba(255, 255, 255, 0) 44.15%, rgba(255, 255, 255, 0.66) 44.48%, rgba(255, 255, 255, 0.12) 45.25%, transparent 46.05% 100%) -280px -560px / 360px 620px no-repeat,
        linear-gradient(110deg, transparent 0 52%, color-mix(in srgb, var(--mtd-scheme-accent) 44%, rgba(255, 255, 255, 0.35)) 52.32%, rgba(255, 255, 255, 0.08) 53.15%, transparent 54% 100%) 80px -500px / 420px 680px no-repeat,
        linear-gradient(110deg, transparent 0 38%, rgba(255, 255, 255, 0.48) 38.35%, rgba(255, 255, 255, 0.08) 38.9%, transparent 39.55% 100%) 360px -640px / 300px 620px no-repeat,
        linear-gradient(110deg, transparent 0 58%, rgba(255, 255, 255, 0.36) 58.3%, transparent 59.1% 100%) 520px -460px / 320px 580px no-repeat;
    border: 0;
    opacity: 0.58;
    pointer-events: none;
    mix-blend-mode: screen;
    animation: mtd-auth-bar-rain 4.8s linear infinite;
}

#wrapper.mtd-reset-screen .mtd-reset-visual > * {
    position: relative;
    z-index: 1;
}

#wrapper.mtd-reset-screen .mtd-reset-brand {
    padding: 0;
}

#wrapper.mtd-reset-screen .mtd-reset-logo-link {
    display: inline-flex;
    align-items: center;
    max-width: 100%;
    color: inherit;
    text-decoration: none;
}

#wrapper.mtd-reset-screen .mtd-reset-logo-link img {
    width: auto;
    max-width: 220px;
    max-height: 58px;
    object-fit: contain;
}

#wrapper.mtd-reset-screen .mtd-reset-logo-link span {
    color: inherit;
    font-size: 1.65rem;
    font-weight: 900;
}

#wrapper.mtd-reset-screen .mtd-reset-visual .logo-dark {
    display: none;
}

#wrapper.mtd-reset-screen .mtd-reset-visual .logo-light {
    display: inline-block;
}

#wrapper.mtd-reset-screen .mtd-reset-visual-copy {
    margin-top: auto;
    padding-top: 52px;
}

#wrapper.mtd-reset-screen .mtd-reset-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 34px;
    margin-bottom: 18px;
    padding: 7px 12px;
    color: #dcfce7;
    background: rgba(255, 255, 255, 0.13);
    border: 1px solid rgba(255, 255, 255, 0.22);
    border-radius: 8px;
    font-size: 0.8rem;
    font-weight: 900;
    text-transform: uppercase;
}

#wrapper.mtd-reset-screen .mtd-reset-visual h2 {
    max-width: 430px;
    margin: 0 0 14px;
    color: #ffffff;
    font-size: 2.65rem;
    line-height: 1.05;
    font-weight: 900;
}

#wrapper.mtd-reset-screen .mtd-reset-visual-copy p,
#wrapper.mtd-reset-screen .mtd-reset-story p {
    max-width: 420px;
    margin: 0;
    color: rgba(255, 255, 255, 0.78);
    font-size: 1rem;
    line-height: 1.7;
}

#wrapper.mtd-reset-screen .mtd-reset-steps {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    margin-top: 32px;
}

#wrapper.mtd-reset-screen .mtd-reset-step {
    display: flex;
    min-width: 0;
    min-height: 86px;
    padding: 13px;
    flex-direction: column;
    justify-content: space-between;
    background: rgba(255, 255, 255, 0.12);
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 8px;
    text-align: center;
}

#wrapper.mtd-reset-screen .mtd-reset-step i {
    color: #a7f3d0;
    font-size: 1.2rem;
}

#wrapper.mtd-reset-screen .mtd-reset-step strong {
    color: #ffffff;
    font-size: 0.88rem;
    font-weight: 900;
}

#wrapper.mtd-reset-screen .mtd-reset-security-note {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-top: 34px;
    padding: 15px 16px;
    color: rgba(255, 255, 255, 0.86);
    background: rgba(6, 24, 44, 0.28);
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 8px;
    font-weight: 750;
}

#wrapper.mtd-reset-screen .mtd-reset-security-note i {
    color: #a7f3d0;
}

#wrapper.mtd-reset-screen .mtd-reset-story {
    margin-top: 34px;
    padding-top: 24px;
    border-top: 1px solid rgba(255, 255, 255, 0.18);
}

#wrapper.mtd-reset-screen .mtd-reset-story .swiper-slide {
    height: auto;
}

#wrapper.mtd-reset-screen .mtd-reset-story a {
    color: inherit;
    text-decoration: none;
}

#wrapper.mtd-reset-screen .mtd-reset-story h3 {
    max-width: 420px;
    margin: 12px 0 10px;
    color: #ffffff;
    font-size: 1.18rem;
    line-height: 1.35;
    font-weight: 900;
}

#wrapper.mtd-reset-screen .mtd-reset-story-meta {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #a7f3d0;
    font-size: 0.82rem;
    font-weight: 850;
}

#wrapper.mtd-reset-screen .mtd-reset-story .swiper-pagination {
    position: static;
    margin-top: 18px;
    text-align: left;
}

#wrapper.mtd-reset-screen .mtd-reset-form-panel {
    display: flex;
    min-width: 0;
    padding: 52px 44px;
    align-items: center;
    justify-content: center;
    background:
        linear-gradient(180deg, rgba(248, 250, 252, 0.95), rgba(255, 255, 255, 0.98));
}

#wrapper.mtd-reset-screen .mtd-reset-form-panel .login-container {
    width: 100%;
    max-width: 480px;
    margin: 0;
}

#wrapper.mtd-reset-screen .mtd-reset-box {
    padding: 0;
    overflow: visible;
    background: transparent;
    border: 0;
    box-shadow: none;
}

#wrapper.mtd-reset-screen .mtd-reset-mobile-brand {
    display: none;
    margin-bottom: 24px;
    padding: 0;
}

#wrapper.mtd-reset-screen .mtd-reset-titlebar {
    display: grid;
    grid-template-columns: 48px minmax(0, 1fr);
    gap: 15px;
    align-items: center;
    margin-bottom: 26px;
}

#wrapper.mtd-reset-screen .mtd-reset-title-icon {
    display: inline-flex;
    width: 48px;
    height: 48px;
    align-items: center;
    justify-content: center;
    color: #ffffff;
    background: var(--mtd-scheme-primary);
    border-radius: 8px;
    box-shadow: 0 14px 28px color-mix(in srgb, var(--mtd-scheme-primary) 24%, transparent);
}

#wrapper.mtd-reset-screen .mtd-reset-titlebar h1 {
    margin: 0 0 5px;
    color: #111827;
    font-size: 1.62rem;
    line-height: 1.18;
    font-weight: 900;
    text-transform: none;
}

#wrapper.mtd-reset-screen .mtd-reset-titlebar p {
    margin: 0;
    color: #64748b;
    font-size: 0.96rem;
    line-height: 1.55;
}

#wrapper.mtd-reset-screen .mtd-reset-content {
    margin: 0;
    padding: 0;
}

#wrapper.mtd-reset-screen .mtd-reset-content .alert {
    margin-bottom: 18px;
    border-radius: 8px;
}

#wrapper.mtd-reset-screen .mtd-reset-intro p,
#wrapper.mtd-reset-screen .mtd-reset-content > p {
    margin: 0 0 18px;
    color: #475569;
    font-size: 1rem;
    line-height: 1.7;
}

#wrapper.mtd-reset-screen .mtd-reset-form,
#wrapper.mtd-reset-screen .mtd-reset-content form {
    display: grid;
    gap: 18px;
    margin: 0;
}

#wrapper.mtd-reset-screen .mtd-reset-field,
#wrapper.mtd-reset-screen .mtd-reset-content .form-group {
    margin: 0;
}

#wrapper.mtd-reset-screen .mtd-reset-field .form-control-label,
#wrapper.mtd-reset-screen .mtd-reset-content label {
    margin: 0 0 8px;
    color: #111827;
    font-size: 0.98rem;
    font-weight: 900;
}

#wrapper.mtd-reset-screen .mtd-reset-input-wrap {
    display: flex;
    min-height: 58px;
    align-items: center;
    padding: 0 16px;
    background: #ffffff;
    border: 1px solid #dbe7f5;
    border-radius: 8px;
    box-shadow: 0 12px 24px rgba(15, 23, 42, 0.04);
    transition: border-color 0.18s ease, box-shadow 0.18s ease;
}

#wrapper.mtd-reset-screen .mtd-reset-input-wrap:focus-within {
    border-color: var(--mtd-scheme-primary);
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--mtd-scheme-primary) 12%, transparent);
}

#wrapper.mtd-reset-screen .mtd-reset-input-icon {
    display: inline-flex;
    flex: 0 0 24px;
    align-items: center;
    justify-content: center;
    color: #64748b;
}

#wrapper.mtd-reset-screen .mtd-reset-input-wrap .form-control {
    min-width: 0;
    height: 56px;
    padding: 0 0 0 12px;
    color: #111827;
    background: transparent;
    border: 0;
    box-shadow: none;
    font-size: 1rem;
    font-weight: 650;
}

#wrapper.mtd-reset-screen .mtd-reset-input-wrap .form-control::placeholder,
#wrapper.mtd-reset-screen .mtd-reset-content .form-control::placeholder {
    color: #94a3b8;
    font-weight: 550;
}

#wrapper.mtd-reset-screen .mtd-reset-content form:not(.mtd-reset-form) .form-control {
    min-height: 54px;
    width: 100%;
    padding: 13px 15px;
    color: #111827;
    background: #ffffff;
    border: 1px solid #dbe7f5;
    border-radius: 8px;
    box-shadow: 0 12px 24px rgba(15, 23, 42, 0.04);
    font-size: 1rem;
    font-weight: 650;
}

#wrapper.mtd-reset-screen .mtd-reset-content form:not(.mtd-reset-form) .form-control:focus {
    border-color: var(--mtd-scheme-primary);
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--mtd-scheme-primary) 12%, transparent);
}

#wrapper.mtd-reset-screen .mtd-reset-content .input-icon.right {
    position: relative;
}

#wrapper.mtd-reset-screen .mtd-reset-content .password-strength-meter {
    padding-top: 2px;
}

#wrapper.mtd-reset-screen .mtd-reset-content .password-strength-meter .progress {
    height: 8px;
    overflow: hidden;
    background: #e2e8f0;
    border-radius: 8px;
}

#wrapper.mtd-reset-screen .mtd-reset-captcha {
    margin: 0;
}

#wrapper.mtd-reset-screen .mtd-reset-submit,
#wrapper.mtd-reset-screen .mtd-reset-content form .btn-primary {
    display: inline-flex;
    min-height: 58px;
    width: 100%;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 13px 20px;
    color: #ffffff;
    background: var(--mtd-scheme-primary);
    border: 0;
    border-radius: 8px;
    box-shadow: 0 16px 30px color-mix(in srgb, var(--mtd-scheme-primary) 24%, transparent);
    font-size: 1.02rem;
    font-weight: 900;
    transition: transform 0.18s ease, box-shadow 0.18s ease, background 0.18s ease;
}

#wrapper.mtd-reset-screen .mtd-reset-submit:hover,
#wrapper.mtd-reset-screen .mtd-reset-submit:focus,
#wrapper.mtd-reset-screen .mtd-reset-content form .btn-primary:hover,
#wrapper.mtd-reset-screen .mtd-reset-content form .btn-primary:focus {
    color: #ffffff;
    background: var(--mtd-scheme-primary-hover);
    box-shadow: 0 18px 34px rgba(21, 87, 219, 0.28);
    transform: translateY(-1px);
}

#wrapper.mtd-reset-screen .mtd-reset-content .btn-group {
    display: grid;
    width: 100%;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

#wrapper.mtd-reset-screen .mtd-reset-content .btn-group .btn {
    min-height: 50px;
    border-radius: 8px !important;
    font-weight: 850;
}

#wrapper.mtd-reset-screen .mtd-reset-content form .btn-default {
    color: #334155;
    background: #ffffff;
    border: 1px solid #dbe7f5;
}

#wrapper.mtd-reset-screen .mtd-reset-success-card {
    padding: 18px;
    background: #f0fdf4;
    border: 1px solid #bbf7d0;
    border-radius: 8px;
}

#wrapper.mtd-reset-screen .mtd-reset-success-card p {
    margin: 0;
    color: #166534;
    line-height: 1.65;
    font-weight: 650;
}

#wrapper.mtd-reset-screen .mtd-reset-help-links,
#wrapper.mtd-reset-screen .mtd-reset-register-link {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    align-items: center;
    justify-content: center;
    margin-top: 18px;
    padding: 15px;
    color: #475569;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    font-size: 0.98rem;
    font-weight: 650;
}

#wrapper.mtd-reset-screen .mtd-reset-help-links a,
#wrapper.mtd-reset-screen .mtd-reset-register-link a {
    color: var(--mtd-scheme-primary);
    font-weight: 900;
    text-decoration: none;
}

#wrapper.mtd-reset-screen .mtd-reset-help-links a:hover,
#wrapper.mtd-reset-screen .mtd-reset-help-links a:focus,
#wrapper.mtd-reset-screen .mtd-reset-register-link a:hover,
#wrapper.mtd-reset-screen .mtd-reset-register-link a:focus {
    color: var(--mtd-scheme-primary-hover);
    text-decoration: none;
}

#wrapper.mtd-reset-screen .mtd-reset-language {
    margin-top: 18px;
}

#wrapper.mtd-reset-screen .mtd-reset-language .btn {
    display: inline-flex;
    min-height: 42px;
    align-items: center;
    gap: 9px;
    padding: 8px 14px;
    color: #111827;
    background: rgba(255, 255, 255, 0.86);
    border: 1px solid rgba(148, 163, 184, 0.26);
    border-radius: 8px;
    font-weight: 850;
}

#wrapper.mtd-reset-screen .mtd-reset-language .iti-flag {
    margin: 0;
}

body.dark-mode #wrapper.mtd-reset-screen {
    background:
        linear-gradient(122deg, rgba(8, 14, 26, 0.98) 0 34%, rgba(15, 23, 42, 0.98) 34% 62%, rgba(8, 43, 39, 0.97) 62% 100%),
        url("../images/loginBg.jpg") center / cover no-repeat;
}

body.dark-mode #wrapper.mtd-reset-screen .mtd-reset-shell {
    color: #e5edf7;
    background: #111c2d;
    border-color: rgba(148, 163, 184, 0.18);
    box-shadow: 0 26px 70px rgba(0, 0, 0, 0.34);
}

body.dark-mode #wrapper.mtd-reset-screen .mtd-reset-form-panel {
    background: linear-gradient(180deg, rgba(17, 28, 45, 0.98), rgba(15, 23, 42, 0.98));
}

body.dark-mode #wrapper.mtd-reset-screen .mtd-reset-titlebar h1,
body.dark-mode #wrapper.mtd-reset-screen .mtd-reset-field .form-control-label,
body.dark-mode #wrapper.mtd-reset-screen .mtd-reset-content label {
    color: #f8fafc;
}

body.dark-mode #wrapper.mtd-reset-screen .mtd-reset-titlebar p,
body.dark-mode #wrapper.mtd-reset-screen .mtd-reset-intro p,
body.dark-mode #wrapper.mtd-reset-screen .mtd-reset-content > p {
    color: #aab6c7;
}

body.dark-mode #wrapper.mtd-reset-screen .mtd-reset-input-wrap,
body.dark-mode #wrapper.mtd-reset-screen .mtd-reset-content form:not(.mtd-reset-form) .form-control,
body.dark-mode #wrapper.mtd-reset-screen .mtd-reset-help-links,
body.dark-mode #wrapper.mtd-reset-screen .mtd-reset-register-link,
body.dark-mode #wrapper.mtd-reset-screen .mtd-reset-language .btn {
    color: #dce6f4;
    background: #17243a;
    border-color: rgba(148, 163, 184, 0.2);
}

body.dark-mode #wrapper.mtd-reset-screen .mtd-reset-input-wrap .form-control,
body.dark-mode #wrapper.mtd-reset-screen .mtd-reset-content form:not(.mtd-reset-form) .form-control {
    color: #f8fafc;
}

body.dark-mode #wrapper.mtd-reset-screen .mtd-reset-content .password-strength-meter .progress {
    background: #223148;
}

body.dark-mode #wrapper.mtd-reset-screen .mtd-reset-success-card {
    background: rgba(20, 83, 45, 0.24);
    border-color: rgba(134, 239, 172, 0.26);
}

@media (max-width: 960px) {
    #wrapper.mtd-reset-screen {
        padding: 18px;
    }

    #wrapper.mtd-reset-screen .mtd-reset-page-container {
        min-height: calc(100vh - 36px);
    }

    #wrapper.mtd-reset-screen .mtd-reset-shell {
        max-width: 620px;
        grid-template-columns: minmax(0, 1fr);
    }

    #wrapper.mtd-reset-screen .mtd-reset-visual {
        display: none;
    }

    #wrapper.mtd-reset-screen .mtd-reset-mobile-brand {
        display: block;
    }

    #wrapper.mtd-reset-screen .mtd-reset-mobile-brand .logo-light {
        display: none;
    }

    #wrapper.mtd-reset-screen .mtd-reset-mobile-brand .logo-dark {
        display: inline-block;
    }
}

@media (max-width: 560px) {
    #wrapper.mtd-reset-screen {
        padding: 10px;
    }

    #wrapper.mtd-reset-screen .mtd-reset-page-container {
        min-height: calc(100vh - 20px);
    }

    #wrapper.mtd-reset-screen .mtd-reset-shell {
        border-radius: 8px;
    }

    #wrapper.mtd-reset-screen .mtd-reset-form-panel {
        padding: 24px 16px;
    }

    #wrapper.mtd-reset-screen .mtd-reset-titlebar {
        grid-template-columns: 42px minmax(0, 1fr);
        gap: 12px;
        margin-bottom: 22px;
    }

    #wrapper.mtd-reset-screen .mtd-reset-title-icon {
        width: 42px;
        height: 42px;
    }

    #wrapper.mtd-reset-screen .mtd-reset-titlebar h1 {
        font-size: 1.35rem;
    }

    #wrapper.mtd-reset-screen .mtd-reset-input-wrap {
        min-height: 54px;
        padding: 0 13px;
    }

    #wrapper.mtd-reset-screen .mtd-reset-input-wrap .form-control {
        height: 52px;
        font-size: 0.96rem;
    }

    #wrapper.mtd-reset-screen .mtd-reset-content .btn-group {
        grid-template-columns: minmax(0, 1fr);
    }
}

:root {
    --white: #fff;

    /* Neutral shades */
    --neutral-50: #fbf9fa;
    --neutral-100: #f4f5f7;
    --neutral-200: #e4e4e7;
    --neutral-300: #d0d5dd;
    --neutral-400: #9ca3af;
    --neutral-500: #6b7280;
    --neutral-600: #4b5563;
    --neutral-700: #374151;
    --neutral-800: #1f2937;
    --neutral-900: #111827;
    --neutral-950: #030712;

    /* Neutral shades */
    /* define own pallet with brand colors */
    --primary-50: var(--neutral-50);
    --primary-100: var(--neutral-100);
    --primary-200: var(--neutral-200);
    --primary-300: var(--neutral-300);
    --primary-400: var(--neutral-400);
    --primary-500: var(--neutral-500);
    --primary-600: var(--neutral-600);
    --primary-700: var(--neutral-700);
    --primary-800: var(--neutral-800);
    --primary-900: var(--neutral-900);
    --primary-950: var(--neutral-900);

    /* Primary colors */
    /* Use shades from comments if `primary` colors use other colors, then neutral */
    --primary: var(--neutral-900);          /* var(--primary-600) */
    --primary-lifted: var(--neutral-800);   /* var(--primary-700) */
    --primary-accented: var(--neutral-700); /* var(--primary-800) */

    /* Secondary colors */
    --secondary: var(--neutral-500);
    --secondary-lifted: var(--neutral-600);
    --secondary-accented: var(--neutral-700);

    /* Success colors */
    --success: #00a63e;
    --success-lifted: #008236;
    --success-accented: #016630;

    /* Info colors */
    --info: #155dfc;
    --info-lifted: #1447e6;
    --info-accented: #193cb8;

    /* Notice colors */
    --notice: #7f22fe;
    --notice-lifted: #7008e7;
    --notice-accented: #5d0ec0;

    /* Warning colors */
    --warning: #f54a00;
    --warning-lifted: #ca3500;
    --warning-accented: #9f2d00;

    /* Error colors */
    --error: #e7000b;
    --error-lifted: #c10007;
    --error-accented: #9f0712;

    /* Grayscale colors */
    --grayscale: var(--neutral-900);
    --grayscale-lifted: var(--neutral-800);
    --grayscale-accented: var(--neutral-700);

    /* Neutral colors */
    --neutral: var(--neutral-500);
    --neutral-lifted: var(--neutral-600);
    --neutral-accented: var(--neutral-700);

    /* Text neutral colors */
    --text-inverted: var(--white);
    --text-muted: var(--neutral-400);
    --text-lifted: var(--neutral-500);
    --text-accented: var(--neutral-600);
    --text: var(--neutral-900);

    /* Border neutral colors */
    --border-muted: var(--neutral-200);
    --border: var(--neutral-300);
    --border-lifted: var(--neutral-400);
    --border-accented: var(--neutral-600);

    /* Background neutral colors */
    --bg: var(--white);
    --bg-muted: var(--neutral-50);
    --bg-lifted: var(--neutral-100);
    --bg-accented: var(--neutral-200);
    --bg-inverted: var(--neutral-900);

    /* Additional colors */
    --yellow-200: #fff085;
    --yellow-300: #ffdf20;
    --teal-300: #46edd5;
    --teal-400: #00d5be;
    --emerald-300: #5ee9b5;
    --pink-400: #fb64b6;

    /* Additional custom properties */
    /* Font sizes */
    --text-xs: 0.625rem;
    --text-sm: 0.75rem;
    --text-md: 0.875rem;
    --text-lg: 1rem;

    /* Spacing */
    --outline-sm: 1px;
    --outline-md: 2px;
    --outline-lg: 3px;

    /* Rounding */
    --rounding-sm: 0.25rem;
    --rounding-md: 0.5rem;
    --rounding-lg: 0.75rem;

    /* Other */
    --letter-spacing: 0em;
    --disabled-opacity: 25%;
}

/* Keep loading spanner dots aligned with the active theme scheme. */
.spanner {
    --mtd-spanner-color: var(--primary, var(--brand-primary, #1062fe));
}

.spanner > div,
.spanner > span {
    background: var(--mtd-spanner-color) !important;
}

.btn_loader.btn_loading .btn_loading_icon .spanner {
    --mtd-spanner-color: currentColor;
}

.btn_loader.btn_loading.btn-default .btn_loading_icon .spanner {
    --mtd-spanner-color: var(--primary, var(--brand-primary, #1062fe));
}

.mtdcpanel-wordmark {
    display: inline-flex;
    align-items: center;
    min-height: 40px;
    color: inherit;
    font-size: 1.25rem;
    font-weight: 800;
    letter-spacing: 0;
    text-transform: none;
}

.mtdcpanel-home {
    color: var(--text);
    background: var(--bg);
}

.mtdcpanel-hero {
    position: relative;
    display: flex;
    align-items: center;
    min-height: 620px;
    overflow: hidden;
    color: var(--text-inverted);
    background: var(--neutral-950);
}

.mtdcpanel-hero__media {
    position: absolute;
    inset: 0;
    background:
        linear-gradient(90deg, rgba(3, 7, 18, 0.92) 0%, rgba(17, 24, 39, 0.72) 46%, rgba(17, 24, 39, 0.18) 100%),
        url("../images/hero-bg1.jpg") center/cover no-repeat;
}

.mtdcpanel-hero .container {
    position: relative;
    z-index: 1;
}

.mtdcpanel-hero__content {
    max-width: 680px;
    padding: 6rem 0;
}

.mtdcpanel-eyebrow {
    margin: 0 0 0.85rem;
    color: var(--teal-300);
    font-size: var(--text-md);
    font-weight: 800;
    letter-spacing: 0;
    text-transform: uppercase;
}

.mtdcpanel-hero h1 {
    margin: 0;
    color: var(--text-inverted);
    font-size: 4rem;
    font-weight: 900;
    letter-spacing: 0;
    line-height: 1;
}

.mtdcpanel-hero__copy {
    max-width: 560px;
    margin: 1.25rem 0 0;
    color: rgba(255, 255, 255, 0.82);
    font-size: 1.25rem;
    line-height: 1.65;
}

.mtdcpanel-hero__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.85rem;
    margin-top: 2rem;
}

.mtdcpanel-section {
    padding: 4.5rem 0;
}

.mtd-domain-home-form {
    margin: 0;
}

.home-domain-search {
    padding: clamp(1.6rem, 3vw, 3rem) 0;
}

.site-banner-domain {
    overflow: visible;
}

.home-domain-search .container {
    max-width: 1500px;
}

.site-banner-domain.mtd-modern-domain-hero {
    padding: clamp(4.25rem, 6vw, 7rem) 0;
    background:
        radial-gradient(circle at 80% 18%, color-mix(in srgb, var(--mtd-scheme-primary) 12%, transparent), transparent 34%),
        radial-gradient(circle at 12% 74%, color-mix(in srgb, var(--mtd-scheme-primary) 9%, transparent), transparent 32%),
        linear-gradient(135deg, #f8fbff 0%, #eef5ff 54%, #f8fbff 100%);
}

.site-banner-domain.mtd-modern-domain-hero.centered {
    text-align: left;
}

.mtd-modern-domain-hero .container {
    max-width: 1480px;
}

.mtd-modern-domain-hero .row-eq-height {
    display: grid !important;
    grid-template-columns: minmax(0, 1.06fr) minmax(320px, 0.94fr);
    gap: clamp(2rem, 4vw, 4.5rem);
    align-items: center !important;
    margin-right: 0;
    margin-left: 0;
}

.mtd-modern-domain-hero .row-eq-height > [class*="col-"] {
    width: auto;
    max-width: none;
    padding-right: 0;
    padding-left: 0;
}

.mtd-modern-domain-hero__content .banner_content {
    max-width: 720px;
    margin: 0;
    text-align: left;
}

.mtd-modern-domain-hero .sec-caption {
    margin-bottom: 0.9rem;
}

.mtd-modern-domain-hero .sec-caption .rounded {
    display: inline-flex;
    align-items: center;
    min-height: 34px;
    padding: 0 0.85rem;
    border: 1px solid color-mix(in srgb, var(--mtd-scheme-primary) 42%, transparent);
    border-radius: 999px !important;
    color: var(--mtd-scheme-primary);
    background: rgba(255, 255, 255, 0.72);
    box-shadow: 0 12px 28px rgba(15, 23, 42, 0.06);
    font-size: 0.86rem;
    font-weight: 850;
    letter-spacing: 0;
}

.mtd-modern-domain-hero .sec-title {
    max-width: 760px;
    margin: 0;
    color: var(--text, #111827);
    font-size: clamp(2.4rem, 4.8vw, 5.35rem);
    font-weight: 900;
    letter-spacing: 0;
    line-height: 0.98;
}

.mtd-modern-domain-hero .sec-subtitle {
    max-width: 660px;
    margin: 1.2rem 0 0;
    color: var(--text-muted, #64748b);
    font-size: clamp(1rem, 1.3vw, 1.22rem);
    font-weight: 700;
    line-height: 1.7;
}

.mtd-modern-domain-hero .domain-hero {
    position: relative;
    margin-top: clamp(1.4rem, 2.4vw, 2.2rem) !important;
    padding: clamp(1rem, 2vw, 1.25rem);
    border: 1px solid color-mix(in srgb, var(--mtd-scheme-primary) 18%, #d8e5ff);
    border-radius: 24px;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.96), rgba(244, 248, 255, 0.9)),
        color-mix(in srgb, var(--mtd-scheme-primary) 4%, #ffffff);
    box-shadow: 0 28px 68px rgba(15, 23, 42, 0.12);
}

.mtd-modern-domain-hero .domain-hero > .d-flex {
    display: block !important;
    align-items: stretch !important;
}

.mtd-modern-domain-hero .domain-hero .tab-content {
    width: 100%;
}

.mtd-modern-domain-hero .domain-hero .nav {
    display: inline-flex;
    gap: 0.35rem;
    padding: 0.25rem;
    border: 1px solid color-mix(in srgb, var(--mtd-scheme-primary) 18%, #d8e5ff);
    border-radius: 999px;
    background: #ffffff;
}

.mtd-modern-domain-hero .domain-hero .nav-link {
    min-height: 38px;
    padding: 0 0.9rem;
    border: 0 !important;
    border-radius: 999px !important;
    color: var(--text-muted, #64748b) !important;
    background: transparent !important;
    font-weight: 850;
    letter-spacing: 0;
    line-height: 38px;
}

.mtd-modern-domain-hero .domain-hero .nav-link.active {
    color: var(--mtd-scheme-primary-text, #ffffff) !important;
    background: var(--mtd-scheme-primary) !important;
    box-shadow: 0 12px 24px var(--mtd-scheme-primary-shadow);
}

.mtd-modern-domain-hero .search-form.input-group {
    display: grid;
    grid-template-columns: 58px minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.75rem;
    width: 100%;
    min-height: 82px;
    margin-top: 0.85rem;
    padding: 0.65rem;
    border: 1px solid color-mix(in srgb, var(--mtd-scheme-primary) 22%, #d8e5ff);
    border-radius: 20px;
    background: #ffffff;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.mtd-modern-domain-hero .search-form .input-group-icon {
    position: static;
    display: inline-flex;
    width: 52px;
    height: 52px;
    align-items: center;
    justify-content: center;
    border-radius: 16px;
    color: var(--mtd-scheme-primary);
    background: color-mix(in srgb, var(--mtd-scheme-primary) 10%, #ffffff);
    font-size: 1.15rem;
    transform: none;
}

.mtd-modern-domain-hero .search-form .form-control {
    width: 100%;
    min-height: 56px;
    padding: 0;
    border: 0 !important;
    color: var(--text, #111827);
    background: transparent !important;
    box-shadow: none !important;
    font-size: clamp(1.05rem, 1.3vw, 1.25rem);
    font-weight: 850;
}

.mtd-modern-domain-hero .search-form .form-control::placeholder {
    color: var(--text-muted, #64748b);
    opacity: 0.7;
}

.mtd-modern-domain-hero .search-form .input-group-btn {
    display: block;
    width: auto;
}

.mtd-modern-domain-hero .search-form .btn {
    display: inline-flex;
    min-width: 136px;
    min-height: 56px;
    align-items: center;
    justify-content: center;
    gap: 0.55rem;
    padding: 0 1.25rem;
    border: 0 !important;
    border-radius: 16px !important;
    color: var(--mtd-scheme-primary-text, #ffffff) !important;
    background: var(--mtd-scheme-primary) !important;
    box-shadow: 0 16px 34px var(--mtd-scheme-primary-shadow);
    font-weight: 900;
    letter-spacing: 0;
    line-height: 1;
}

.mtd-modern-domain-hero .domain-tlds {
    margin-top: 1rem;
}

.mtd-modern-domain-hero .domain-tlds .swiper {
    overflow: visible;
}

.mtd-modern-domain-hero .domain-tlds .featured-tlds {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(min(145px, 100%), 1fr));
    gap: 0.75rem;
    transform: none !important;
}

.mtd-modern-domain-hero .domain-tlds .tld-container {
    display: flex !important;
    width: auto !important;
    min-height: 76px;
    flex-direction: column;
    justify-content: center;
    margin: 0 !important;
    padding: 0.85rem 0.95rem;
    border: 1px solid color-mix(in srgb, var(--mtd-scheme-primary) 20%, #d8e5ff);
    border-radius: 16px;
    color: var(--text, #111827);
    background: linear-gradient(180deg, #ffffff, #f7faff);
    box-shadow: none;
}

.mtd-modern-domain-hero .domain-tlds .tld-container:hover {
    border-color: var(--mtd-scheme-primary);
    box-shadow: 0 16px 30px var(--mtd-scheme-primary-shadow);
    transform: translateY(-2px);
}

.mtd-modern-domain-hero .domain-tlds .tld-item {
    display: inline-flex;
    align-items: baseline;
    gap: 0;
    color: var(--mtd-scheme-primary);
    font-size: 1.08rem;
    font-weight: 900;
    line-height: 1.1;
}

.mtd-modern-domain-hero .domain-tlds .dots {
    color: var(--mtd-scheme-accent, var(--mtd-scheme-primary));
}

.mtd-modern-domain-hero .domain-tlds .tld-price {
    margin-top: 0.28rem;
    color: var(--text-muted, #64748b);
    font-size: 0.84rem;
    font-weight: 800;
}

.mtd-modern-domain-hero__visual {
    position: relative;
    margin-bottom: 0 !important;
}

.mtd-modern-domain-hero__visual .banner_background_graphic,
.mtd-modern-domain-hero__visual .banner_graphic {
    width: 100%;
}

.mtd-modern-domain-hero__visual .banner_graphic {
    position: relative;
    display: flex;
    min-height: 430px;
    align-items: center;
    justify-content: center !important;
    padding: clamp(1.3rem, 2.8vw, 2.3rem);
    border: 1px solid color-mix(in srgb, var(--mtd-scheme-primary) 18%, #d8e5ff);
    border-radius: 28px;
    background:
        radial-gradient(circle at 74% 20%, color-mix(in srgb, var(--mtd-scheme-primary) 18%, transparent), transparent 30%),
        linear-gradient(145deg, #ffffff 0%, #eef5ff 100%);
    box-shadow: 0 30px 80px rgba(15, 23, 42, 0.14);
}

.mtd-modern-domain-hero__visual .banner_graphic img,
.mtd-modern-domain-hero__visual .banner-bg-video {
    position: relative;
    z-index: 1;
    width: min(100%, 560px);
    max-height: 390px;
    object-fit: contain;
}

.mtd-modern-domain-hero__status {
    position: absolute;
    right: clamp(0.8rem, 2vw, 1.6rem);
    bottom: clamp(0.8rem, 2vw, 1.6rem);
    z-index: 2;
    display: grid;
    min-width: 230px;
    gap: 0.18rem;
    padding: 0.9rem 1rem;
    border: 1px solid color-mix(in srgb, var(--mtd-scheme-primary) 18%, #d8e5ff);
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.9);
    box-shadow: 0 22px 48px rgba(15, 23, 42, 0.16);
    backdrop-filter: blur(12px);
}

.mtd-modern-domain-hero__status span {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    color: var(--text-muted, #64748b);
    font-size: 0.78rem;
    font-weight: 850;
}

.mtd-modern-domain-hero__status strong {
    color: var(--text, #111827);
    font-size: 1.05rem;
    font-weight: 900;
}

.mtd-modern-domain-hero__status em {
    justify-self: start;
    padding: 0.18rem 0.52rem;
    border-radius: 999px;
    color: #0f8a48;
    background: rgba(34, 197, 94, 0.12);
    font-size: 0.76rem;
    font-style: normal;
    font-weight: 900;
}

body.dark-mode .site-banner-domain.mtd-modern-domain-hero {
    background:
        radial-gradient(circle at 78% 18%, color-mix(in srgb, var(--mtd-scheme-primary) 18%, transparent), transparent 35%),
        radial-gradient(circle at 13% 74%, rgba(20, 184, 166, 0.1), transparent 34%),
        linear-gradient(135deg, #071120 0%, #0e1a31 48%, #08111f 100%) !important;
}

body.dark-mode .mtd-modern-domain-hero .sec-caption .rounded,
body.dark-mode .mtd-modern-domain-hero .domain-hero,
body.dark-mode .mtd-modern-domain-hero .domain-hero .nav,
body.dark-mode .mtd-modern-domain-hero .search-form.input-group,
body.dark-mode .mtd-modern-domain-hero .domain-tlds .tld-container,
body.dark-mode .mtd-modern-domain-hero__visual .banner_graphic,
body.dark-mode .mtd-modern-domain-hero__status {
    border-color: color-mix(in srgb, var(--mtd-scheme-primary) 30%, rgba(148, 163, 184, 0.18)) !important;
    background:
        radial-gradient(circle at 96% 0%, color-mix(in srgb, var(--mtd-scheme-primary) 15%, transparent), transparent 32%),
        linear-gradient(145deg, rgba(15, 23, 42, 0.94), rgba(8, 17, 31, 0.9)) !important;
    color: #e8f0fb !important;
    box-shadow: 0 28px 72px rgba(0, 0, 0, 0.38), inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
    display: inline-flex;
}

body.dark-mode .mtd-modern-domain-hero .sec-title,
body.dark-mode .mtd-modern-domain-hero__status strong {
    color: #ffffff !important;
}

body.dark-mode .mtd-modern-domain-hero .sec-subtitle,
body.dark-mode .mtd-modern-domain-hero .domain-tlds .tld-price,
body.dark-mode .mtd-modern-domain-hero__status span {
    color: rgba(226, 232, 240, 0.74) !important;
}

body.dark-mode .mtd-modern-domain-hero .domain-hero .nav-link {
    color: rgba(226, 232, 240, 0.74) !important;
}

body.dark-mode .mtd-modern-domain-hero .search-form .input-group-icon {
    background: color-mix(in srgb, var(--mtd-scheme-primary) 16%, rgba(15, 23, 42, 0.8)) !important;
    color: color-mix(in srgb, var(--mtd-scheme-primary) 72%, #dbeafe) !important;
}

body.dark-mode .mtd-modern-domain-hero .search-form .form-control {
    color: #ffffff !important;
}

body.dark-mode .mtd-modern-domain-hero .search-form .form-control::placeholder {
    color: rgba(226, 232, 240, 0.52) !important;
}

body.dark-mode .mtd-modern-domain-hero .domain-tlds .tld-item {
    color: #ffffff !important;
}

body.dark-mode .mtd-modern-domain-hero__status em {
    color: #86efac;
    background: rgba(34, 197, 94, 0.14);
}

@media (max-width: 1199.98px) {
    .mtd-modern-domain-hero .row-eq-height {
        grid-template-columns: minmax(0, 1fr);
    }

    .mtd-modern-domain-hero__content .banner_content {
        max-width: 100%;
    }

    .mtd-modern-domain-hero__visual .banner_graphic {
        min-height: 360px;
    }
}

@media (max-width: 767.98px) {
    .site-banner-domain.mtd-modern-domain-hero {
        padding: 2.2rem 0;
    }

    .mtd-modern-domain-hero .search-form.input-group {
        grid-template-columns: 48px minmax(0, 1fr);
    }

    .mtd-modern-domain-hero .search-form .input-group-btn {
        grid-column: 1 / -1;
    }

    .mtd-modern-domain-hero .search-form .btn {
        width: 100%;
    }

    .mtd-modern-domain-hero .domain-tlds .featured-tlds {
        grid-template-columns: repeat(auto-fit, minmax(min(132px, 100%), 1fr));
    }

    .mtd-modern-domain-hero__status {
        position: relative;
        right: auto;
        bottom: auto;
        margin-top: 1rem;
    }
}

.site-banner-domain.mtd-modern-domain-hero {
    padding: clamp(3.35rem, 5vw, 5.6rem) 0;
}

.mtd-modern-domain-hero .mtd-domain-engine-card {
    display: grid;
    gap: 1rem;
    max-width: 760px;
    padding: clamp(1rem, 2vw, 1.35rem);
    border: 1px solid color-mix(in srgb, var(--mtd-scheme-primary) 22%, #cfe0ff);
    border-radius: 28px;
    background:
        radial-gradient(circle at 98% 0%, color-mix(in srgb, var(--mtd-scheme-primary) 12%, transparent), transparent 34%),
        linear-gradient(145deg, rgba(255, 255, 255, 0.98), rgba(244, 248, 255, 0.9));
    box-shadow: 0 30px 80px rgba(15, 23, 42, 0.14), inset 0 1px 0 rgba(255, 255, 255, 0.92);
}

.mtd-modern-domain-hero .mtd-domain-engine-card__toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.9rem;
    flex-wrap: wrap;
}

.mtd-modern-domain-hero .mtd-domain-engine-card__modes,
.mtd-modern-domain-hero .mtd-domain-engine-card__single-mode {
    display: inline-flex !important;
    width: auto !important;
    min-height: 44px !important;
    align-items: center;
    gap: 0.35rem;
    margin: 0;
    padding: 0.3rem;
    border: 1px solid color-mix(in srgb, var(--mtd-scheme-primary) 18%, #d8e5ff);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.86);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.88);
}

.mtd-modern-domain-hero .mtd-domain-engine-card__single-mode {
    padding: 0.3rem 0.95rem;
    color: var(--mtd-scheme-primary);
    font-size: 0.88rem;
    font-weight: 900;
}

.mtd-modern-domain-hero .mtd-domain-engine-card__modes .nav-item {
    display: block !important;
    margin: 0 !important;
}

.mtd-modern-domain-hero .mtd-domain-engine-card__modes .nav-link {
    display: inline-flex !important;
    width: auto !important;
    min-width: 0 !important;
    min-height: 38px !important;
    height: 38px !important;
    align-items: center;
    justify-content: center;
    gap: 0.42rem;
    padding: 0 0.95rem !important;
    border: 0 !important;
    border-radius: 999px !important;
    color: var(--text-muted, #64748b) !important;
    background: transparent !important;
    box-shadow: none !important;
    font-size: 0.86rem;
    font-weight: 900;
    line-height: 1 !important;
    white-space: nowrap;
}

.mtd-modern-domain-hero .mtd-domain-engine-card__modes .nav-link.active {
    color: var(--mtd-scheme-primary-text, #ffffff) !important;
    background: var(--mtd-scheme-primary) !important;
    box-shadow: 0 12px 24px var(--mtd-scheme-primary-shadow) !important;
}

.mtd-modern-domain-hero .mtd-domain-engine-card__signals {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
}

.mtd-modern-domain-hero .mtd-domain-engine-card__signals span {
    display: inline-flex;
    min-height: 34px;
    align-items: center;
    gap: 0.38rem;
    padding: 0 0.72rem;
    border: 1px solid color-mix(in srgb, var(--mtd-scheme-primary) 16%, #d8e5ff);
    border-radius: 999px;
    color: color-mix(in srgb, var(--mtd-scheme-primary) 68%, #3b4b65);
    background: rgba(255, 255, 255, 0.72);
    font-size: 0.78rem;
    font-weight: 900;
    white-space: nowrap;
}

.mtd-modern-domain-hero .mtd-domain-engine-card__body,
.mtd-modern-domain-hero .mtd-domain-engine-card__body .tab-pane,
.mtd-modern-domain-hero .mtd-domain-engine-card .form-search {
    width: 100% !important;
    min-height: 0 !important;
    margin: 0 !important;
}

.mtd-modern-domain-hero .mtd-domain-engine-card__body .tab-pane:not(.active) {
    display: none !important;
}

.mtd-modern-domain-hero .mtd-domain-engine-card .mtd-domain-engine-search {
    position: relative;
    display: grid !important;
    grid-template-columns: 54px minmax(0, 1fr) auto !important;
    align-items: center !important;
    gap: 0.72rem !important;
    width: 100% !important;
    height: auto !important;
    min-height: 76px !important;
    margin: 0 !important;
    padding: 0.6rem !important;
    border: 1px solid color-mix(in srgb, var(--mtd-scheme-primary) 24%, #d4e2ff) !important;
    border-radius: 22px !important;
    background: #ffffff !important;
    box-shadow: 0 16px 34px rgba(15, 23, 42, 0.06), inset 0 1px 0 rgba(255, 255, 255, 0.95) !important;
}

.mtd-modern-domain-hero .mtd-domain-engine-card .mtd-domain-engine-search__icon {
    position: static !important;
    top: auto !important;
    left: auto !important;
    display: inline-flex !important;
    width: 52px !important;
    height: 52px !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 !important;
    border-radius: 16px;
    color: var(--mtd-scheme-primary) !important;
    background: color-mix(in srgb, var(--mtd-scheme-primary) 10%, #ffffff) !important;
    transform: none !important;
}

.mtd-modern-domain-hero .mtd-domain-engine-card .mtd-domain-engine-search .form-control {
    display: block !important;
    width: 100% !important;
    height: 52px !important;
    min-height: 52px !important;
    max-height: 52px !important;
    padding: 0 0.15rem !important;
    border: 0 !important;
    color: var(--text, #111827) !important;
    background: transparent !important;
    box-shadow: none !important;
    font-size: clamp(1.05rem, 1.3vw, 1.24rem) !important;
    font-weight: 850;
    line-height: 52px !important;
}

.mtd-modern-domain-hero .mtd-domain-engine-card .mtd-domain-engine-search .form-control::placeholder {
    color: color-mix(in srgb, var(--text-muted, #64748b) 78%, transparent) !important;
    opacity: 1 !important;
}

.mtd-modern-domain-hero .mtd-domain-engine-card .mtd-domain-engine-search .input-group-btn,
.mtd-modern-domain-hero .mtd-domain-engine-card .mtd-domain-engine-search .btn-group {
    position: static !important;
    display: flex !important;
    width: auto !important;
    margin: 0 !important;
    transform: none !important;
}

.mtd-modern-domain-hero .mtd-domain-engine-card .mtd-domain-engine-search .btn {
    display: inline-flex !important;
    min-width: 132px;
    height: 54px !important;
    min-height: 54px !important;
    align-items: center;
    justify-content: center;
    gap: 0.55rem;
    padding: 0 1.15rem !important;
    border-radius: 17px !important;
    white-space: nowrap;
}

.mtd-modern-domain-hero .mtd-domain-engine-card .domain-tlds {
    margin-top: 0.2rem;
    padding-top: 1rem;
    border-top: 1px solid color-mix(in srgb, var(--mtd-scheme-primary) 18%, #d8e5ff);
}

.mtd-modern-domain-hero .mtd-domain-engine-card__section-title {
    display: flex;
    align-items: center;
    gap: 0.72rem;
    margin-bottom: 0.8rem;
}

.mtd-modern-domain-hero .mtd-domain-engine-card__section-title > span {
    display: inline-flex;
    width: 42px;
    height: 42px;
    flex: 0 0 42px;
    align-items: center;
    justify-content: center;
    border-radius: 14px;
    color: var(--mtd-scheme-primary-text, #ffffff);
    background: var(--mtd-scheme-primary);
    box-shadow: 0 12px 24px var(--mtd-scheme-primary-shadow);
}

.mtd-modern-domain-hero .mtd-domain-engine-card__section-title strong,
.mtd-modern-domain-hero .mtd-domain-engine-card__section-title small {
    display: block;
}

.mtd-modern-domain-hero .mtd-domain-engine-card__section-title strong {
    color: var(--text, #111827);
    font-size: 0.98rem;
    font-weight: 900;
}

.mtd-modern-domain-hero .mtd-domain-engine-card__section-title small {
    margin-top: 0.1rem;
    color: var(--text-muted, #64748b);
    font-size: 0.82rem;
    font-weight: 800;
}

.mtd-modern-domain-hero .mtd-domain-engine-card .domain-tlds .swiper {
    overflow: visible !important;
}

.mtd-modern-domain-hero .mtd-domain-engine-card .domain-tlds .featured-tlds {
    display: flex !important;
    flex-wrap: wrap;
    gap: 0.5rem;
    transform: none !important;
}

.mtd-modern-domain-hero .mtd-domain-engine-card .domain-tlds .tld-container {
    display: flex !important;
    width: auto !important;
    height: auto !important;
    min-width: 96px;
    max-width: none;
    min-height: 62px;
    max-height: none !important;
    flex: 0 1 calc((100% - 2.5rem) / 6);
    margin: 0 !important;
    padding: 0.68rem 0.72rem;
    border-radius: 17px;
    overflow: hidden;
}

.mtd-modern-domain-hero .mtd-domain-engine-card .domain-tlds .tld-container::before,
.mtd-modern-domain-hero .mtd-domain-engine-card .domain-tlds .tld-container::after {
    display: none !important;
    content: none !important;
}

.mtd-modern-domain-hero .mtd-domain-engine-card .domain-tlds .tld-price {
    display: block !important;
    white-space: nowrap !important;
    line-height: 1.25;
}

.mtd-modern-domain-hero__visual .banner_graphic {
    min-height: clamp(360px, 32vw, 500px);
    border-radius: 32px;
}

body.dark-mode .mtd-modern-domain-hero .mtd-domain-engine-card {
    border-color: color-mix(in srgb, var(--mtd-scheme-primary) 32%, rgba(148, 163, 184, 0.2)) !important;
    background:
        radial-gradient(circle at 100% 0%, color-mix(in srgb, var(--mtd-scheme-primary) 18%, transparent), transparent 36%),
        linear-gradient(145deg, rgba(12, 23, 43, 0.98), rgba(6, 15, 29, 0.94)) !important;
    box-shadow: 0 30px 82px rgba(0, 0, 0, 0.42), inset 0 1px 0 rgba(255, 255, 255, 0.06) !important;
}

body.dark-mode .mtd-modern-domain-hero .mtd-domain-engine-card__modes,
body.dark-mode .mtd-modern-domain-hero .mtd-domain-engine-card__single-mode,
body.dark-mode .mtd-modern-domain-hero .mtd-domain-engine-card__signals span,
body.dark-mode .mtd-modern-domain-hero .mtd-domain-engine-card .mtd-domain-engine-search,
body.dark-mode .mtd-modern-domain-hero .mtd-domain-engine-card .domain-tlds .tld-container {
    border-color: color-mix(in srgb, var(--mtd-scheme-primary) 28%, rgba(148, 163, 184, 0.18)) !important;
    background:
        radial-gradient(circle at 96% 0%, color-mix(in srgb, var(--mtd-scheme-primary) 14%, transparent), transparent 34%),
        linear-gradient(145deg, rgba(15, 28, 52, 0.96), rgba(8, 17, 32, 0.94)) !important;
    color: rgba(232, 240, 251, 0.9) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
}

body.dark-mode .mtd-modern-domain-hero .mtd-domain-engine-card__modes .nav-link {
    color: rgba(226, 232, 240, 0.72) !important;
}

body.dark-mode .mtd-modern-domain-hero .mtd-domain-engine-card__modes .nav-link.active {
    color: var(--mtd-scheme-primary-text, #ffffff) !important;
}

body.dark-mode .mtd-modern-domain-hero .mtd-domain-engine-card__section-title strong,
body.dark-mode .mtd-modern-domain-hero .mtd-domain-engine-card .mtd-domain-engine-search .form-control,
body.dark-mode .mtd-modern-domain-hero .mtd-domain-engine-card .domain-tlds .tld-item {
    color: #ffffff !important;
}

body.dark-mode .mtd-modern-domain-hero .mtd-domain-engine-card__section-title small,
body.dark-mode .mtd-modern-domain-hero .mtd-domain-engine-card__signals span,
body.dark-mode .mtd-modern-domain-hero .mtd-domain-engine-card .domain-tlds .tld-price {
    color: rgba(226, 232, 240, 0.7) !important;
}

body.dark-mode .mtd-modern-domain-hero .mtd-domain-engine-card .mtd-domain-engine-search__icon {
    background: color-mix(in srgb, var(--mtd-scheme-primary) 18%, rgba(15, 23, 42, 0.78)) !important;
}

body.dark-mode .mtd-modern-domain-hero .mtd-domain-engine-card .mtd-domain-engine-search .form-control::placeholder {
    color: rgba(226, 232, 240, 0.58) !important;
}

body.dark-mode .mtd-modern-domain-hero .mtd-domain-engine-card .domain-tlds {
    border-top-color: color-mix(in srgb, var(--mtd-scheme-primary) 25%, rgba(148, 163, 184, 0.18));
}

body.dark-mode #order-standard_cart .sub-heading {
    background: none !important;
}

@media (max-width: 767.98px) {
    .mtd-modern-domain-hero .mtd-domain-engine-card__toolbar {
        align-items: stretch;
    }

    .mtd-modern-domain-hero .mtd-domain-engine-card__modes,
    .mtd-modern-domain-hero .mtd-domain-engine-card__signals {
        width: 100% !important;
    }

    .mtd-modern-domain-hero .mtd-domain-engine-card__modes .nav-link {
        flex: 1 1 auto;
    }

    .mtd-modern-domain-hero .mtd-domain-engine-card .mtd-domain-engine-search {
        grid-template-columns: 48px minmax(0, 1fr) !important;
    }

    .mtd-modern-domain-hero .mtd-domain-engine-card .mtd-domain-engine-search .input-group-btn {
        grid-column: 1 / -1;
    }

    .mtd-modern-domain-hero .mtd-domain-engine-card .mtd-domain-engine-search .btn {
        width: 100%;
    }

    .mtd-modern-domain-hero .mtd-domain-engine-card .domain-tlds .tld-container {
        flex: 1 1 124px;
        max-width: none;
    }
}

.mtd-domain-home-engine {
    display: block;
    max-width: 100%;
    margin: 0 auto;
}

.mtd-domain-home-prices,
.mtd-domain-home-card {
    position: relative;
    overflow: hidden;
    border: 1px solid var(--mtd-scheme-primary-border);
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.94);
    box-shadow: 0 24px 52px rgba(15, 23, 42, 0.1);
}

.mtd-domain-home-prices {
    display: grid;
    gap: 1rem;
    padding: 1rem;
}

.mtd-domain-home-card .mtd-domain-home-prices--inside {
    overflow: visible;
    margin-top: 0.2rem;
    padding: 1rem 0 0;
    border: 0;
    border-top: 1px solid var(--mtd-scheme-primary-border);
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.mtd-domain-home-prices__title,
.mtd-domain-home-card__header {
    display: flex;
    gap: 1rem;
}

.mtd-domain-home-prices__title span,
.mtd-domain-home-card__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 52px;
    width: 52px;
    height: 52px;
    border-radius: 15px;
    color: var(--mtd-scheme-primary-text);
    background: var(--mtd-scheme-primary);
    box-shadow: 0 16px 34px var(--mtd-scheme-primary-shadow);
    font-size: 1.12rem;
}

.mtd-domain-home-card .mtd-domain-home-prices--inside .mtd-domain-home-prices__title {
    align-items: center;
}

.mtd-domain-home-card .mtd-domain-home-prices--inside .mtd-domain-home-prices__title span {
    flex-basis: 44px;
    width: 44px;
    height: 44px;
    border-radius: 12px;
    font-size: 0.98rem;
    box-shadow: none;
}

.mtd-domain-home-prices__title strong,
.mtd-domain-home-card h2 {
    display: block;
    margin: 0;
    color: var(--text, #111827);
    font-weight: 900;
    letter-spacing: 0;
}

.mtd-domain-home-prices__title strong {
    font-size: 1.06rem;
}

.mtd-domain-home-prices__title small,
.mtd-domain-home-card p {
    display: block;
    margin-top: 0.16rem;
    color: var(--text-muted, #6b7280);
    font-weight: 750;
}

.mtd-domain-home-tlds {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(min(170px, 100%), 1fr));
    gap: 0.75rem;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

.mtd-domain-home-tlds li {
    display: block !important;
    background-color: transparent !important;
    margin: 0 !important;
}

.mtd-domain-home-tld {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    width: 100%;
    min-height: 70px;
    padding: 0.78rem 0.85rem;
    border: 1px solid var(--mtd-scheme-primary-border);
    border-radius: 14px;
    color: var(--text, #111827);
    background: linear-gradient(180deg, #fff, var(--mtd-scheme-primary-surface));
    cursor: pointer;
    text-align: left;
    transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

.mtd-domain-home-card .mtd-domain-home-prices--inside .mtd-domain-home-tlds {
    grid-template-columns: repeat(auto-fit, minmax(min(155px, 100%), 1fr));
}

.mtd-domain-home-tld:hover,
.mtd-domain-home-tld:focus {
    border-color: var(--mtd-scheme-primary);
    box-shadow: 0 16px 30px var(--mtd-scheme-primary-shadow);
    outline: 0;
    transform: translateY(-2px);
}

.mtd-domain-home-tld__name {
    color: var(--mtd-scheme-primary);
    font-size: 1.12rem;
    font-weight: 900;
    letter-spacing: 0;
}

.mtd-domain-home-tld__price {
    margin-top: 0.25rem;
    color: var(--text-muted, #6b7280);
    font-size: 0.86rem;
    font-weight: 800;
}

.mtd-domain-home-card {
    padding: clamp(1rem, 2vw, 1.5rem);
}

.mtd-domain-home-card::before {
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at 96% 8%, var(--mtd-scheme-primary-soft), transparent 34%),
        linear-gradient(135deg, transparent 0%, transparent 55%, var(--mtd-scheme-primary-surface) 100%);
    content: "";
    pointer-events: none;
}

.mtd-domain-home-card__header,
.mtd-domain-home-card__body,
.mtd-domain-home-card .domainchecker-homepage-captcha {
    position: relative;
    z-index: 1;
}

.mtd-domain-home-card__header {
    margin-bottom: 1rem;
}

.mtd-domain-home-card__eyebrow {
    margin: 0 0 0.2rem;
    color: var(--mtd-scheme-primary);
    font-size: 0.78rem;
    font-weight: 900;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.mtd-domain-home-card h2 {
    font-size: clamp(1.65rem, 2.4vw, 2.55rem);
    line-height: 1.05;
}

.mtd-domain-home-card__body {
    display: grid;
    gap: 0.9rem;
}

.mtd-domain-home-search {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto auto;
    align-items: center;
    gap: 0.7rem;
    min-height: 78px;
    padding: 0.58rem;
    border: 1px solid var(--mtd-scheme-primary-border);
    border-radius: 15px;
    background: #fff;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.85);
}

.mtd-domain-home-search__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 46px;
    height: 46px;
    border-radius: 13px;
    color: var(--mtd-scheme-primary);
    background: var(--mtd-scheme-primary-surface);
    font-size: 1.15rem;
}

.mtd-domain-home-search .form-control {
    width: 100%;
    min-height: 54px;
    border: 0 !important;
    color: var(--text, #111827);
    background: transparent !important;
    box-shadow: none !important;
    font-size: 1.08rem;
    font-weight: 850;
}

.mtd-domain-home-search .form-control::placeholder {
    color: var(--text-muted, #6b7280);
    opacity: 0.72;
}

.mtd-domain-home-search__hint {
    color: var(--mtd-scheme-primary);
    font-size: 2.2vw;
    font-weight: 900;
    white-space: nowrap;
}

.mtd-domain-home-ai {
    display: grid;
    gap: 0.8rem;
}

.mtd-domain-home-ai textarea {
    width: 100%;
    min-height: 118px;
    padding: 1rem;
    border: 1px solid var(--mtd-scheme-primary-border);
    border-radius: 15px;
    color: var(--text, #111827);
    background: #fff;
    font-weight: 750;
    line-height: 1.55;
    resize: vertical;
}

.mtd-domain-home-ai__controls {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.65rem;
}

.mtd-domain-home-ai__controls .btn-group > .btn,
.mtd-domain-home-ai__controls .multiselect {
    min-height: 42px;
    border-radius: 10px;
    font-weight: 800;
}

.mtd-domain-home-safe {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    margin: 0;
    color: var(--text-muted, #6b7280);
    font-weight: 800;
}

.mtd-domain-home-tools {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.65rem;
}

.mtd-domain-home-tools span {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    min-height: 38px;
    padding: 0 0.8rem;
    border: 1px solid var(--mtd-scheme-primary-border);
    border-radius: 999px;
    color: var(--text, #111827);
    background: rgba(255, 255, 255, 0.76);
    font-size: 0.84rem;
    font-weight: 850;
}

.mtd-domain-home-tools span i {
    color: var(--mtd-scheme-primary);
}

.mtd-domain-home-search .btn,
.mtd-domain-home-tools .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.55rem;
    min-height: 50px;
    padding: 0 1.25rem;
    border: 0 !important;
    border-radius: 13px !important;
    font-weight: 900;
    line-height: 1;
}

.mtd-domain-home-search .btn {
    min-width: 132px;
    min-height: 54px;
    white-space: nowrap;
}

.mtd-domain-home-search .btn-primary,
.mtd-domain-home-tools .btn-success {
    color: var(--mtd-scheme-primary-text) !important;
    background: var(--mtd-scheme-primary) !important;
    box-shadow: 0 16px 30px var(--mtd-scheme-primary-shadow);
}

.mtd-domain-home-tools .btn-success {
    background: var(--mtd-scheme-accent) !important;
}

.mtd-domain-home-pricing-link {
    border: 1px solid var(--mtd-scheme-primary-border) !important;
    color: var(--text, #111827) !important;
    background: var(--mtd-scheme-primary-surface) !important;
    box-shadow: none !important;
}

.mtd-domain-home-card .domainchecker-homepage-captcha {
    margin-top: 1rem;
}

@media (max-width: 991.98px) {
    .mtd-domain-home-engine {
        grid-template-columns: 1fr;
    }

    .mtd-domain-home-prices {
        order: 2;
    }

    .mtd-domain-home-card {
        order: 1;
    }
}

@media (max-width: 575.98px) {
    .home-domain-search {
        padding: 1rem 0;
    }

    .mtd-domain-home-prices,
    .mtd-domain-home-card {
        border-radius: 12px;
    }

    .mtd-domain-home-tlds {
        grid-template-columns: 1fr;
    }

    .mtd-domain-home-card__header {
        align-items: flex-start;
    }

    .mtd-domain-home-search {
        grid-template-columns: auto minmax(0, 1fr);
    }

    .mtd-domain-home-search__hint,
    .mtd-domain-home-search .btn {
        grid-column: 1 / -1;
    }

    .mtd-domain-home-search .btn,
    .mtd-domain-home-tools .btn {
        width: 100%;
    }
}
.mtdcpanel-section__header h2 {
    margin: 0;
    color: var(--text);
    font-size: 2.25rem;
    font-weight: 850;
    letter-spacing: 0;
}

.mtd-domain-engine-section {
    padding: clamp(2.25rem, 4vw, 4rem) 0;
}

.mtd-domain-engine-section.first-section {
    padding: clamp(1.5rem, 2.8vw, 2.75rem) 0;
    background:
        linear-gradient(120deg, var(--mtd-scheme-primary-soft), transparent 44%),
        linear-gradient(180deg, #ffffff 0%, var(--mtd-scheme-primary-surface) 100%);
}

.mtd-domain-engine {
    display: grid;
    grid-template-columns: minmax(280px, 0.72fr) minmax(520px, 1.28fr);
    gap: clamp(1rem, 2vw, 1.5rem);
    align-items: stretch;
}

.mtd-domain-engine--solo {
    grid-template-columns: minmax(0, 1fr);
}

.mtd-domain-engine-section:not(.first-section) .mtd-domain-engine {
    grid-template-columns: minmax(260px, 0.58fr) minmax(520px, 1.42fr);
}

.mtd-domain-engine-section:not(.first-section) .mtd-domain-engine--solo {
    grid-template-columns: minmax(0, 1fr);
}

.mtd-domain-engine__tlds {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.85rem;
}

.mtd-domain-engine-section:not(.first-section) .mtd-domain-engine__tlds {
    align-content: start;
    grid-template-columns: repeat(auto-fit, minmax(142px, 1fr));
}

.mtd-domain-engine__tld {
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-height: 92px;
    padding: 1rem;
    border: 1px solid var(--mtd-scheme-primary-border);
    border-radius: 10px;
    color: var(--text, #111827);
    background:
        linear-gradient(145deg, #ffffff 0%, var(--mtd-scheme-primary-surface) 100%);
    box-shadow: 0 16px 34px rgba(15, 23, 42, 0.08);
    text-align: left;
    cursor: pointer;
    transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}

.mtd-domain-engine__tld:hover,
.mtd-domain-engine__tld:focus {
    border-color: var(--mtd-scheme-primary);
    box-shadow: 0 22px 42px var(--mtd-scheme-primary-shadow);
    transform: translateY(-2px);
}

.mtd-domain-engine__tld-name {
    display: inline-flex;
    align-items: center;
    gap: 0.08rem;
    color: var(--mtd-scheme-primary);
    font-size: 1.16rem;
    font-weight: 900;
    letter-spacing: 0;
    line-height: 1.1;
}

.mtd-domain-engine__tld-name img {
    max-width: 90px;
    max-height: 32px;
    object-fit: contain;
}

.mtd-domain-engine__dot {
    color: var(--mtd-scheme-accent, var(--mtd-scheme-primary));
}

.mtd-domain-engine__tld-price {
    margin-top: 0.42rem;
    color: var(--text-muted, #667085);
    font-size: 0.92rem;
    font-weight: 750;
}

.mtd-domain-engine__card {
    position: relative;
    overflow: hidden;
    display: grid;
    gap: 1.15rem;
    min-height: 100%;
    padding: clamp(1.1rem, 2.2vw, 1.75rem);
    border: 1px solid var(--mtd-scheme-primary-border);
    border-radius: 12px;
    background:
        radial-gradient(circle at 88% 22%, var(--mtd-scheme-primary-soft), transparent 28%),
        linear-gradient(135deg, #ffffff 0%, var(--mtd-scheme-primary-surface) 100%);
    box-shadow: 0 22px 55px rgba(15, 23, 42, 0.12);
}

.mtd-domain-engine__card::after {
    position: absolute;
    right: -56px;
    bottom: -70px;
    width: 220px;
    height: 220px;
    border: 22px solid var(--mtd-scheme-primary-focus);
    border-radius: 50%;
    content: "";
    pointer-events: none;
}

.mtd-domain-engine__header,
.mtd-domain-engine__form,
.mtd-domain-engine__meta {
    position: relative;
    z-index: 1;
}

.mtd-domain-engine__header {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.mtd-domain-engine__icon {
    display: inline-flex;
    flex: 0 0 58px;
    width: 58px;
    height: 58px;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    color: var(--mtd-scheme-primary-text, #ffffff);
    background: var(--mtd-scheme-primary);
    box-shadow: 0 18px 34px var(--mtd-scheme-primary-shadow);
    font-size: 1.35rem;
}

.mtd-domain-engine__eyebrow {
    margin: 0 0 0.16rem;
    color: var(--mtd-scheme-primary);
    font-size: 0.78rem;
    font-weight: 900;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.mtd-domain-engine__header h2 {
    margin: 0;
    color: var(--text, #111827);
    font-size: clamp(1.55rem, 2.4vw, 2.75rem);
    font-weight: 900;
    letter-spacing: 0;
    line-height: 1.05;
}

.mtd-domain-engine__header p:last-child {
    margin: 0.28rem 0 0;
    color: var(--text-muted, #667085);
    font-size: clamp(0.96rem, 1.1vw, 1.08rem);
}

.mtd-domain-engine__field {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto auto;
    align-items: center;
    gap: 0.5rem;
    min-height: 76px;
    padding: 0.5rem;
    border: 1px solid var(--mtd-scheme-primary-border);
    border-radius: 12px;
    background: #ffffff;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.72);
}

.mtd-domain-engine__prefix {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 58px;
    height: 52px;
    border-radius: 9px;
    color: var(--mtd-scheme-primary);
    background: var(--mtd-scheme-primary-surface);
    font-weight: 900;
}

.mtd-domain-engine__field .form-control {
    width: 100%;
    min-height: 52px;
    padding: 0;
    border: 0 !important;
    box-shadow: none !important;
    color: var(--text, #111827);
    background: transparent;
    font-size: 1.1rem;
    font-weight: 800;
}

.mtd-domain-engine__field .form-control::placeholder {
    color: var(--text-muted, #667085);
    opacity: 0.68;
}

.mtd-domain-engine__actions {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.mtd-domain-engine__actions .btn {
    display: inline-flex;
    min-height: 52px;
    align-items: center;
    justify-content: center;
    gap: 0.55rem;
    padding: 0 1.2rem;
    border-radius: 9px !important;
    font-weight: 900;
    letter-spacing: 0;
    white-space: nowrap;
}

.mtd-domain-engine__actions .btn-primary {
    border-color: var(--mtd-scheme-primary) !important;
    color: var(--mtd-scheme-primary-text, #ffffff) !important;
    background: var(--mtd-scheme-primary) !important;
    box-shadow: 0 16px 28px var(--mtd-scheme-primary-shadow);
}

.mtd-domain-engine__actions .btn-default {
    border: 1px solid var(--mtd-scheme-primary-border) !important;
    color: var(--text, #111827) !important;
    background: rgba(255, 255, 255, 0.88) !important;
}

.mtd-domain-engine__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.7rem 1rem;
    align-items: center;
    color: var(--text-muted, #667085);
    font-size: 0.92rem;
    font-weight: 750;
}

.mtd-domain-engine__meta span,
.mtd-domain-engine__meta a {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
}

.mtd-domain-engine__meta i,
.mtd-domain-engine__meta a {
    color: var(--mtd-scheme-primary);
}

@media (max-width: 1199.98px) {
    .mtd-domain-engine,
    .mtd-domain-engine-section:not(.first-section) .mtd-domain-engine {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 767.98px) {
    .mtd-domain-engine-section {
        padding: 1.4rem 0;
    }

    .mtd-domain-engine__tlds,
    .mtd-domain-engine-section:not(.first-section) .mtd-domain-engine__tlds {
        grid-template-columns: repeat(3, minmax(118px, 1fr));
        overflow-x: auto;
        padding-bottom: 0.15rem;
    }

    .mtd-domain-engine__header {
        align-items: flex-start;
    }

    .mtd-domain-engine__field {
        grid-template-columns: 1fr;
        padding: 0.85rem;
    }

    .mtd-domain-engine__prefix {
        justify-content: flex-start;
        min-width: 0;
        width: 100%;
        padding: 0 0.85rem;
    }

    .mtd-domain-engine__actions {
        display: grid;
        grid-template-columns: 1fr;
    }

    .mtd-domain-engine__actions .btn {
        width: 100%;
    }
}

/* Domain engine dark mode */
body.dark-mode .mtd-domain-home-engine,
body.dark-mode .mtd-domain-engine {
    color: #e8f0fb;
}

body.dark-mode .mtd-domain-home-prices,
body.dark-mode .mtd-domain-home-card,
body.dark-mode .mtd-domain-engine__card {
    border-color: color-mix(in srgb, var(--mtd-scheme-primary) 32%, rgba(148, 163, 184, 0.18)) !important;
    background:
        radial-gradient(circle at 92% 12%, color-mix(in srgb, var(--mtd-scheme-primary) 18%, transparent), transparent 34%),
        linear-gradient(145deg, rgba(15, 23, 42, 0.96), rgba(8, 17, 31, 0.94)) !important;
    box-shadow: 0 26px 72px rgba(0, 0, 0, 0.42), inset 0 1px 0 rgba(255, 255, 255, 0.06) !important;
    color: #f8fafc !important;
}

body.dark-mode .mtd-domain-home-card::before {
    background:
        radial-gradient(circle at 96% 8%, color-mix(in srgb, var(--mtd-scheme-primary) 16%, transparent), transparent 36%),
        linear-gradient(135deg, transparent 0%, rgba(15, 23, 42, 0.1) 52%, color-mix(in srgb, var(--mtd-scheme-primary) 8%, transparent) 100%) !important;
}

body.dark-mode .mtd-domain-engine__card::after {
    border-color: color-mix(in srgb, var(--mtd-scheme-primary) 16%, transparent) !important;
}

body.dark-mode .mtd-domain-home-prices__title strong,
body.dark-mode .mtd-domain-home-card h2,
body.dark-mode .mtd-domain-engine__header h2 {
    color: #ffffff !important;
}

body.dark-mode .mtd-domain-home-prices__title small,
body.dark-mode .mtd-domain-home-card p,
body.dark-mode .mtd-domain-engine__header p,
body.dark-mode .mtd-domain-engine__eyebrow {
    color: rgba(226, 232, 240, 0.78) !important;
}

body.dark-mode .mtd-domain-home-card__eyebrow,
body.dark-mode .mtd-domain-engine__eyebrow,
body.dark-mode .mtd-domain-home-search__hint,
body.dark-mode .mtd-domain-home-tools span i,
body.dark-mode .mtd-domain-engine__meta i,
body.dark-mode .mtd-domain-engine__meta a {
    color: color-mix(in srgb, var(--mtd-scheme-primary) 72%, #dbeafe) !important;
}

body.dark-mode .mtd-domain-home-tld,
body.dark-mode .mtd-domain-engine__tld {
    border-color: color-mix(in srgb, var(--mtd-scheme-primary) 28%, rgba(148, 163, 184, 0.18)) !important;
    background:
        radial-gradient(circle at 100% 0%, color-mix(in srgb, var(--mtd-scheme-primary) 12%, transparent), transparent 34%),
        linear-gradient(145deg, rgba(15, 23, 42, 0.9), rgba(8, 17, 31, 0.84)) !important;
    color: #e8f0fb !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04) !important;
}

body.dark-mode .mtd-domain-home-card .mtd-domain-home-prices--inside {
    border-color: color-mix(in srgb, var(--mtd-scheme-primary) 24%, rgba(148, 163, 184, 0.14)) !important;
    background: transparent !important;
    box-shadow: none !important;
}

body.dark-mode .mtd-domain-home-tld:hover,
body.dark-mode .mtd-domain-home-tld:focus,
body.dark-mode .mtd-domain-engine__tld:hover,
body.dark-mode .mtd-domain-engine__tld:focus {
    border-color: color-mix(in srgb, var(--mtd-scheme-primary) 62%, rgba(148, 163, 184, 0.2)) !important;
    background:
        radial-gradient(circle at 100% 0%, color-mix(in srgb, var(--mtd-scheme-primary) 20%, transparent), transparent 34%),
        linear-gradient(145deg, color-mix(in srgb, var(--mtd-scheme-primary) 14%, rgba(15, 23, 42, 0.9)), rgba(8, 17, 31, 0.88)) !important;
    box-shadow: 0 18px 38px rgba(0, 0, 0, 0.32), 0 0 0 1px color-mix(in srgb, var(--mtd-scheme-primary) 16%, transparent) inset !important;
}

body.dark-mode .mtd-domain-home-tld__name,
body.dark-mode .mtd-domain-engine__tld-name {
    color: #ffffff !important;
}

body.dark-mode .mtd-domain-home-tld__price,
body.dark-mode .mtd-domain-engine__tld-price,
body.dark-mode .mtd-domain-engine__meta {
    color: rgba(226, 232, 240, 0.74) !important;
}

body.dark-mode .mtd-domain-home-search,
body.dark-mode .mtd-domain-engine__field {
    border-color: color-mix(in srgb, var(--mtd-scheme-primary) 36%, rgba(148, 163, 184, 0.18)) !important;
    background: rgba(15, 23, 42, 0.94) !important;
    box-shadow: 0 16px 44px rgba(0, 0, 0, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
}

body.dark-mode .mtd-domain-home-search__icon,
body.dark-mode .mtd-domain-engine__prefix {
    background: color-mix(in srgb, var(--mtd-scheme-primary) 14%, transparent) !important;
    color: color-mix(in srgb, var(--mtd-scheme-primary) 72%, #dbeafe) !important;
}

body.dark-mode .mtd-domain-home-search .form-control,
body.dark-mode .mtd-domain-engine__field .form-control,
body.dark-mode .mtd-domain-home-ai textarea {
    border-color: rgba(148, 163, 184, 0.18) !important;
    background: #0b1220 !important;
    color: #ffffff !important;
}

body.dark-mode .mtd-domain-home-search .form-control::placeholder,
body.dark-mode .mtd-domain-engine__field .form-control::placeholder,
body.dark-mode .mtd-domain-home-ai textarea::placeholder {
    color: rgba(226, 232, 240, 0.56) !important;
}

body.dark-mode .mtd-domain-home-ai__controls .btn-group > .btn,
body.dark-mode .mtd-domain-home-ai__controls .multiselect,
body.dark-mode .mtd-domain-home-tools span,
body.dark-mode .mtd-domain-engine__meta span,
body.dark-mode .mtd-domain-engine__meta a,
body.dark-mode .mtd-domain-home-pricing-link {
    border-color: color-mix(in srgb, var(--mtd-scheme-primary) 24%, rgba(148, 163, 184, 0.16)) !important;
    background: rgba(15, 23, 42, 0.74) !important;
    color: rgba(226, 232, 240, 0.86) !important;
}
/* End domain engine dark mode */
.mtdcpanel-section__header {
    max-width: 720px;
    margin-bottom: 2rem;
}

.mtdcpanel-section--muted {
    background: var(--bg-muted);
}

.mtdcpanel-card {
    display: flex;
    flex-direction: column;
    padding: 1.35rem;
    border: 1px solid var(--border-muted);
    border-radius: 8px;
    background: var(--bg);
    box-shadow: 0 14px 36px rgba(17, 24, 39, 0.06);
}

.mtdcpanel-card h3 {
    margin: 0 0 0.75rem;
    color: var(--text);
    font-size: 1.25rem;
    font-weight: 800;
    letter-spacing: 0;
}

.mtdcpanel-card p {
    color: var(--text-accented);
}

.mtdcpanel-card ul {
    margin: 0 0 1.25rem;
    padding: 0;
    list-style: none;
}

.mtdcpanel-card li {
    position: relative;
    padding: 0.35rem 0 0.35rem 1.35rem;
    color: var(--text-accented);
}

.mtdcpanel-card li::before {
    position: absolute;
    left: 0;
    color: var(--success);
    content: "\2713";
    font-weight: 800;
}

.mtdcpanel-card .btn {
    margin-top: auto;
}

.mtdcpanel-actions {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 1rem;
}

.mtdcpanel-actions a {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    justify-content: center;
    min-height: 132px;
    padding: 1rem;
    border: 1px solid var(--border-muted);
    border-radius: 8px;
    color: var(--text);
    background: var(--bg);
    text-align: center;
    text-decoration: none;
    transition: border-color 160ms ease, transform 160ms ease, box-shadow 160ms ease;
}

.mtdcpanel-actions a:hover,
.mtdcpanel-actions a:focus {
    border-color: var(--primary);
    box-shadow: 0 12px 28px rgba(17, 24, 39, 0.08);
    color: var(--primary);
    transform: translateY(-2px);
}

.mtdcpanel-actions i {
    color: var(--primary);
    font-size: 1.8rem;
}

.mtdcpanel-actions span {
    font-weight: 750;
}

@media (max-width: 991.98px) {
    .mtdcpanel-hero {
        min-height: 560px;
    }

    .mtdcpanel-hero h1 {
        font-size: 3rem;
    }

    .mtdcpanel-actions {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 575.98px) {
    .mtdcpanel-hero {
        min-height: auto;
    }

    .mtdcpanel-hero__content {
        padding: 4.5rem 0;
    }

    .mtdcpanel-hero h1 {
        font-size: 2.35rem;
    }

    .mtdcpanel-hero__copy {
        font-size: 1rem;
    }

    .mtdcpanel-section {
        padding: 3rem 0;
    }

    .mtdcpanel-actions {
        grid-template-columns: 1fr;
    }
}

/* Client dashboard panels */
body:not(.login) .mtd-global-content-shell .client-home-panels {
    margin-top: 24px;
}

body:not(.login) .mtd-global-content-shell .client-home-panels > .row {
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    gap: 20px;
    align-items: start;
    margin: 0;
}

body:not(.login) .mtd-global-content-shell .client-home-panels > .row > [class*="col-"] {
    width: auto;
    max-width: none;
    padding: 0;
}

body:not(.login) .mtd-global-content-shell .client-home-panels > .row > .col-12,
body:not(.login) .mtd-global-content-shell .client-home-panels .mtd-dashboard-panel-services,
body:not(.login) .mtd-global-content-shell .client-home-panels #servicesPanel {
    grid-column: 1 / -1;
}

body:not(.login) .mtd-global-content-shell .client-home-panels > .row > .col-md-6 {
    grid-column: span 6;
    display: grid;
    gap: 20px;
    align-content: start;
}

body:not(.login) .mtd-global-content-shell .mtd-dashboard-panel {
    position: relative;
    margin: 0;
    overflow: hidden;
    border-color: color-mix(in srgb, var(--mtd-scheme-primary) 16%, #dbe7f5);
    box-shadow: 0 18px 42px rgba(15, 23, 42, 0.07);
}

body:not(.login) .mtd-global-content-shell .mtd-dashboard-panel::after {
    content: "";
    position: absolute;
    right: 18px;
    bottom: 0;
    left: 18px;
    height: 3px;
    border-radius: 999px 999px 0 0;
    background: linear-gradient(90deg, var(--mtd-scheme-primary), var(--mtd-scheme-accent));
    opacity: 0;
    transition: opacity 0.18s ease;
}

body:not(.login) .mtd-global-content-shell .mtd-dashboard-panel:hover::after {
    opacity: 0.78;
}

body:not(.login) .mtd-global-content-shell .mtd-dashboard-panel .panel-heading {
    display: flex;
    min-height: 64px;
    align-items: center;
    padding: 0 18px;
    background:
        linear-gradient(90deg, color-mix(in srgb, var(--mtd-scheme-primary) 7%, transparent), transparent 34%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.98), var(--mtd-scheme-primary-surface));
}

body:not(.login) .mtd-global-content-shell .mtd-dashboard-panel-heading-inner {
    display: grid;
    width: 100%;
    min-width: 0;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 14px;
    align-items: center;
}

body:not(.login) .mtd-global-content-shell .mtd-dashboard-panel .panel-title {
    display: flex;
    width: 100%;
    min-width: 0;
    align-items: center;
    justify-content: flex-start;
    gap: 12px;
    color: #0f172a;
    font-size: 0.98rem;
    text-align: left;
}

body:not(.login) .mtd-global-content-shell .mtd-dashboard-panel-title-text {
    min-width: 0;
    overflow: hidden;
    text-align: left;
    text-overflow: ellipsis;
    white-space: nowrap;
}

body:not(.login) .mtd-global-content-shell .mtd-dashboard-panel .panel-title > i {
    width: 36px;
    height: 36px;
    margin: 0 !important;
    font-size: 1rem;
}

body:not(.login) .mtd-global-content-shell .mtd-dashboard-panel-actions {
    display: inline-flex;
    gap: 10px;
    align-items: center;
    justify-content: flex-end;
}

body:not(.login) .mtd-global-content-shell .mtd-dashboard-panel-action {
    display: inline-flex;
    margin-left: auto;
}

body:not(.login) .mtd-global-content-shell .mtd-dashboard-icon-action {
    display: inline-flex;
    width: 36px;
    height: 36px;
    align-items: center;
    justify-content: center;
    color: #ffffff;
    background: var(--mtd-scheme-primary);
    border-radius: 8px;
    box-shadow: 0 10px 22px color-mix(in srgb, var(--mtd-scheme-primary) 18%, transparent);
    text-decoration: none;
}

body:not(.login) .mtd-global-content-shell .mtd-dashboard-icon-action:hover {
    color: #ffffff;
    background: var(--mtd-scheme-primary-hover);
}

body:not(.login) .mtd-global-content-shell .mtd-dashboard-panel-body {
    padding: 18px;
    color: #334155;
    line-height: 1.65;
}

body:not(.login) .mtd-global-content-shell .mtd-dashboard-panel-list {
    display: grid;
    gap: 10px;
    padding: 14px;
    background: linear-gradient(180deg, #fbfdff, var(--mtd-scheme-primary-surface));
}

body:not(.login) .mtd-global-content-shell .mtd-dashboard-panel-list .mtd-dashboard-list-item {
    display: flex;
    min-height: 56px;
    align-items: center;
    gap: 12px;
    margin: 0;
    padding: 13px 15px;
    color: #1f2937;
    background: #ffffff;
    border: 1px solid #dbe7f5;
    border-radius: 8px !important;
    box-shadow: none;
    transition: border-color 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease;
}

body:not(.login) .mtd-global-content-shell .mtd-dashboard-panel-list .mtd-dashboard-list-item:hover {
    border-color: color-mix(in srgb, var(--mtd-scheme-primary) 28%, #dbe7f5);
    box-shadow: 0 14px 28px rgba(15, 23, 42, 0.06);
    transform: translateY(-1px);
}

body:not(.login) .mtd-global-content-shell .panel-active-services .mtd-dashboard-services-list {
    gap: 8px;
    padding: 12px;
}

body:not(.login) .mtd-global-content-shell .panel-active-services .mtd-dashboard-service-item {
    display: block !important;
    overflow: hidden;
    min-height: 0;
    padding: 0 !important;
}

body:not(.login) .mtd-global-content-shell .panel-active-services .mtd-dashboard-service-item > i {
    display: none !important;
}

body:not(.login) .mtd-global-content-shell .panel-active-services .list-group-item-content,
body:not(.login) .mtd-global-content-shell .panel-active-services .div-service-item {
    display: grid !important;
    width: 100% !important;
    min-height: 58px;
    grid-template-columns: minmax(0, 1fr) auto auto auto;
    gap: 16px;
    align-items: center;
    padding: 14px 16px;
}

body:not(.login) .mtd-global-content-shell .panel-active-services .list-group-item-name,
body:not(.login) .mtd-global-content-shell .panel-active-services .div-service-name,
body:not(.login) .mtd-global-content-shell .panel-active-services .mtd-service-identity {
    display: flex !important;
    min-width: 0;
    align-items: baseline;
    flex-wrap: wrap;
    column-gap: 4px;
    row-gap: 2px;
    margin: 0;
    color: #111827;
    line-height: 1.35;
}

body:not(.login) .mtd-global-content-shell .panel-active-services .service-fullname {
    display: inline-flex;
    min-width: 0;
    align-items: baseline;
    flex-wrap: wrap;
    column-gap: 4px;
    row-gap: 2px;
}

body:not(.login) .mtd-global-content-shell .panel-active-services .list-group-item-group,
body:not(.login) .mtd-global-content-shell .panel-active-services .service-group-name {
    display: inline !important;
    width: auto;
    max-width: none;
    min-height: 0;
    margin: 0;
    padding: 0;
    color: #64748b;
    background: transparent;
    border: 0;
    border-radius: 0;
    font-size: 0.92rem;
    font-weight: 850;
    letter-spacing: 0;
    line-height: inherit;
    overflow: visible;
    text-overflow: clip;
    text-transform: none;
    white-space: normal;
}

body:not(.login) .mtd-global-content-shell .panel-active-services .service-group-name b {
    font-weight: 850;
}

body:not(.login) .mtd-global-content-shell .panel-active-services .list-group-item-fullname,
body:not(.login) .mtd-global-content-shell .panel-active-services .service-name {
    display: inline !important;
    min-width: 0;
    overflow: visible;
    text-overflow: clip;
    color: #0f172a;
    font-size: 1rem;
    font-weight: 900;
    white-space: normal;
}

body:not(.login) .mtd-global-content-shell .panel-active-services .text-domain {
    display: block;
    flex-basis: 100%;
    width: 100%;
    margin: 2px 0 0;
    padding: 0;
    color: #64748b;
    background: transparent;
    border: 0;
    border-radius: 0;
    font-size: 0.82rem;
    font-weight: 750;
    line-height: 1.35;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

body:not(.login) .mtd-global-content-shell .panel-active-services .list-group-item-status,
body:not(.login) .mtd-global-content-shell .panel-active-services .div-service-expiry,
body:not(.login) .mtd-global-content-shell .panel-active-services .div-service-status {
    display: flex !important;
    align-items: center;
    gap: 10px;
    color: #64748b;
    font-size: 0.9rem;
    font-weight: 750;
    justify-self: end;
    margin: 0 !important;
    white-space: nowrap;
}

body:not(.login) .mtd-global-content-shell .panel-active-services .status-expiry,
body:not(.login) .mtd-global-content-shell .panel-active-services .div-service-expiry span {
    margin: 0;
    color: #64748b;
}

body:not(.login) .mtd-global-content-shell .panel-active-services .label-placeholder {
    display: none !important;
}

body:not(.login) .mtd-global-content-shell .client-home-panels .label,
body:not(.login) .mtd-global-content-shell .client-home-panels .status {
    display: inline-flex;
    min-height: 26px;
    align-items: center;
    justify-content: center;
    padding: 4px 10px;
    border-radius: 999px;
    font-size: 0.78rem;
    font-weight: 900;
    line-height: 1;
}

body:not(.login) .mtd-global-content-shell .panel-active-services .label-success,
body:not(.login) .mtd-global-content-shell .panel-active-services .status-active {
    color: #15803d;
    background: #f0fdf4;
    border: 1px solid #86efac;
}

body:not(.login) .mtd-global-content-shell .panel-active-services .list-group-item-actions,
body:not(.login) .mtd-global-content-shell .panel-active-services .div-service-buttons {
    display: flex;
    min-width: 118px;
    justify-content: flex-end;
    justify-self: end;
    margin: 0 !important;
}

body:not(.login) .mtd-global-content-shell .panel-active-services .list-group-item-actions .btn,
body:not(.login) .mtd-global-content-shell .panel-active-services .div-service-buttons .btn,
body:not(.login) .mtd-global-content-shell .panel-active-services .btn-view-details {
    min-height: 36px;
    min-width: 108px;
    padding: 9px 14px;
    font-size: 0.82rem;
    font-weight: 900;
}

body:not(.login) .mtd-global-content-shell .mtd-dashboard-panel-overdue .mtd-dashboard-panel-body {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr);
    gap: 14px;
    align-items: start;
    background: linear-gradient(135deg, #fff7ed, #ffffff 68%);
}

body:not(.login) .mtd-global-content-shell .mtd-dashboard-panel-overdue .mtd-dashboard-panel-body::before {
    content: "\f071";
    display: inline-flex;
    width: 42px;
    height: 42px;
    align-items: center;
    justify-content: center;
    color: #9a3412;
    background: #ffedd5;
    border: 1px solid #fed7aa;
    border-radius: 8px;
    font-family: "Font Awesome 6 Pro";
    font-weight: 900;
}

body:not(.login) .mtd-global-content-shell .mtd-dashboard-panel-tickets .mtd-dashboard-ticket-item {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 12px;
    align-items: center;
}

body:not(.login) .mtd-global-content-shell .mtd-dashboard-panel-tickets .mtd-dashboard-ticket-item.mtd-ticket-row-ready {
    grid-template-columns: minmax(0, 1fr) minmax(128px, auto);
    gap: 18px;
    align-items: center;
    padding: 15px 16px;
}

body:not(.login) .mtd-global-content-shell .mtd-dashboard-panel-tickets .mtd-dashboard-ticket-item br {
    display: none;
}

body:not(.login) .mtd-global-content-shell .mtd-dashboard-panel-tickets .mtd-dashboard-ticket-item .status {
    justify-self: start;
}

body:not(.login) .mtd-global-content-shell .mtd-dashboard-ticket-summary {
    display: block;
    min-width: 0;
    color: #1f2937;
    font-size: 0.96rem;
    font-weight: 850;
    line-height: 1.45;
}

body:not(.login) .mtd-global-content-shell .mtd-dashboard-ticket-meta {
    display: flex;
    min-width: 128px;
    align-items: flex-end;
    flex-direction: column;
    gap: 8px;
    justify-self: end;
}

body:not(.login) .mtd-global-content-shell .mtd-dashboard-panel-tickets .mtd-dashboard-ticket-status {
    display: inline-flex;
    min-width: 82px;
    min-height: 30px;
    align-items: center;
    justify-content: center;
    gap: 7px;
    margin: 0 !important;
    padding: 6px 11px;
    border: 1px solid #dbe7f5;
    border-radius: 999px;
    background: #f8fafc;
    color: #64748b;
    font-size: 0.78rem;
    font-weight: 900;
    line-height: 1;
    box-shadow: 0 8px 18px rgba(15, 23, 42, 0.06);
}

body:not(.login) .mtd-global-content-shell .mtd-dashboard-panel-tickets .mtd-dashboard-ticket-status::before {
    content: "";
    width: 8px;
    height: 8px;
    flex: 0 0 8px;
    border-radius: 999px;
    background: currentColor;
}

body:not(.login) .mtd-global-content-shell .mtd-dashboard-panel-tickets .mtd-dashboard-ticket-status.is-open {
    color: #15803d;
    background: #f0fdf4;
    border-color: #86efac;
}

body:not(.login) .mtd-global-content-shell .mtd-dashboard-panel-tickets .mtd-dashboard-ticket-status.is-open::before {
    background: #22c55e;
    box-shadow: 0 0 0 4px #dcfce7;
}

body:not(.login) .mtd-global-content-shell .mtd-dashboard-panel-tickets .mtd-dashboard-ticket-status.is-closed {
    color: #64748b;
    background: #f8fafc;
    border-color: #dbe7f5;
}

body:not(.login) .mtd-global-content-shell .mtd-dashboard-panel-tickets .mtd-dashboard-ticket-status.is-closed::before {
    background: #94a3b8;
    box-shadow: 0 0 0 4px #e2e8f0;
}

body:not(.login) .mtd-global-content-shell .mtd-dashboard-panel-tickets .text-last-updated,
body:not(.login) .mtd-global-content-shell .mtd-dashboard-panel-tickets small {
    justify-self: end;
    color: #64748b;
    font-size: 0.86rem;
    font-weight: 750;
    text-align: right;
}

body:not(.login) .mtd-global-content-shell .mtd-dashboard-panel-tickets .mtd-dashboard-ticket-updated {
    display: block;
    margin: 0;
    color: #64748b;
    font-size: 0.76rem;
    font-weight: 750;
    line-height: 1.35;
    text-align: right;
}

body:not(.login) .mtd-global-content-shell .mtd-dashboard-panel-domain .mtd-dashboard-panel-body {
    position: relative;
    padding: 16px;
    background:
        linear-gradient(135deg, color-mix(in srgb, var(--mtd-scheme-primary) 8%, #ffffff), #ffffff 58%),
        radial-gradient(circle at 86% 48%, color-mix(in srgb, var(--mtd-scheme-primary) 10%, transparent), transparent 42%);
}

body:not(.login) .mtd-global-content-shell .mtd-dashboard-panel-domain .mtd-dashboard-domain-form {
    display: grid;
    gap: 12px;
}

body:not(.login) .mtd-global-content-shell .mtd-dashboard-panel-domain .mtd-dashboard-domain-form .input-group,
body:not(.login) .mtd-global-content-shell .mtd-dashboard-panel-domain .mtd-dashboard-domain-form .form-group {
    display: block;
    width: 100%;
    margin: 0;
}

body:not(.login) .mtd-global-content-shell .mtd-dashboard-panel-domain .mtd-dashboard-domain-input,
body:not(.login) .mtd-global-content-shell .mtd-dashboard-panel-domain .mtd-dashboard-domain-form input[type="text"] {
    width: 100% !important;
    min-height: 46px;
    padding: 12px 16px;
    color: #1f2937;
    background: #ffffff;
    border: 1px solid #dbe7f5;
    border-radius: 8px !important;
    box-shadow: 0 12px 24px rgba(15, 23, 42, 0.05);
    font-size: 0.92rem;
    font-weight: 850;
    text-align: center;
}

body:not(.login) .mtd-global-content-shell .mtd-dashboard-panel-domain .mtd-dashboard-domain-input:focus,
body:not(.login) .mtd-global-content-shell .mtd-dashboard-panel-domain .mtd-dashboard-domain-form input[type="text"]:focus {
    border-color: color-mix(in srgb, var(--mtd-scheme-primary) 46%, #dbe7f5);
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--mtd-scheme-primary) 12%, transparent);
}

body:not(.login) .mtd-global-content-shell .mtd-dashboard-panel-domain .mtd-dashboard-domain-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

body:not(.login) .mtd-global-content-shell .mtd-dashboard-panel-domain .mtd-dashboard-domain-action {
    display: inline-flex !important;
    width: 100% !important;
    min-height: 44px;
    align-items: center;
    justify-content: center;
    margin: 0 !important;
    padding: 11px 14px;
    border: 1px solid transparent;
    border-radius: 8px !important;
    box-shadow: 0 10px 20px rgba(15, 23, 42, 0.07);
    font-size: 0.86rem;
    font-weight: 950;
    line-height: 1;
    text-align: center;
    transition: transform 0.18s ease, box-shadow 0.18s ease, filter 0.18s ease;
}

body:not(.login) .mtd-global-content-shell .mtd-dashboard-panel-domain .mtd-dashboard-domain-action:hover {
    box-shadow: 0 14px 26px rgba(15, 23, 42, 0.1);
    filter: brightness(1.03);
    transform: translateY(-1px);
}

body:not(.login) .mtd-global-content-shell .mtd-dashboard-panel-domain .mtd-dashboard-domain-action.is-transfer {
    color: #334155 !important;
    background: #f8fafc !important;
    border-color: #dbe7f5 !important;
}

body:not(.login) .mtd-global-content-shell .mtd-dashboard-panel-domain .mtd-dashboard-domain-action.is-register {
    color: #ffffff !important;
    background: linear-gradient(135deg, var(--mtd-scheme-primary), color-mix(in srgb, var(--mtd-scheme-primary) 74%, #0f172a)) !important;
    border-color: color-mix(in srgb, var(--mtd-scheme-primary) 72%, #ffffff) !important;
}

body:not(.login) .mtd-global-content-shell .mtd-dashboard-panel-domain .mtd-dashboard-domain-note {
    margin: 0;
    color: #64748b;
    font-size: 0.78rem;
    font-weight: 700;
    line-height: 1.45;
    text-align: center;
}

body:not(.login) .mtd-global-content-shell .mtd-dashboard-panel-news .mtd-dashboard-news-item {
    justify-content: space-between;
    min-height: 58px;
}

body:not(.login) .mtd-global-content-shell .mtd-dashboard-panel-news .mtd-dashboard-news-item small,
body:not(.login) .mtd-global-content-shell .mtd-dashboard-panel-news .date {
    color: #64748b;
    font-weight: 800;
    white-space: nowrap;
}

body:not(.login) .mtd-global-content-shell .mtd-dashboard-panel-footer {
    display: flex;
    justify-content: flex-end;
    padding: 12px 14px 14px;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.75), #ffffff);
    border-top: 1px solid #edf2f7;
}

body:not(.login) .mtd-global-content-shell .mtd-dashboard-panel-footer .btn {
    min-height: 34px;
    padding: 8px 14px;
    border-radius: 8px;
    font-size: 0.78rem;
    font-weight: 900;
}

body.dark-mode:not(.login) .mtd-global-content-shell .mtd-dashboard-panel {
    border-color: #2c3b52;
}

body.dark-mode:not(.login) .mtd-global-content-shell .mtd-dashboard-panel .panel-heading,
body.dark-mode:not(.login) .mtd-global-content-shell .mtd-dashboard-panel-list,
body.dark-mode:not(.login) .mtd-global-content-shell .mtd-dashboard-panel-footer {
    background: #17243a;
    border-color: #2c3b52;
}

body.dark-mode:not(.login) .mtd-global-content-shell .mtd-dashboard-panel-list .mtd-dashboard-list-item {
    color: #e5edf7;
    background: #111c2f;
    border-color: #2c3b52;
}

body.dark-mode:not(.login) .mtd-global-content-shell .panel-active-services .service-name,
body.dark-mode:not(.login) .mtd-global-content-shell .panel-active-services .list-group-item-fullname {
    color: #f8fafc;
}

body.dark-mode:not(.login) .mtd-global-content-shell .panel-active-services .service-group-name,
body.dark-mode:not(.login) .mtd-global-content-shell .panel-active-services .list-group-item-group,
body.dark-mode:not(.login) .mtd-global-content-shell .panel-active-services .text-domain,
body.dark-mode:not(.login) .mtd-global-content-shell .panel-active-services .div-service-expiry,
body.dark-mode:not(.login) .mtd-global-content-shell .panel-active-services .list-group-item-status {
    color: #9fb0c6;
}

@media (max-width: 991.98px) {
    body:not(.login) .mtd-global-content-shell .panel-active-services .list-group-item-content,
    body:not(.login) .mtd-global-content-shell .panel-active-services .div-service-item {
        grid-template-columns: minmax(0, 1fr) auto;
    }

    body:not(.login) .mtd-global-content-shell .panel-active-services .list-group-item-actions,
    body:not(.login) .mtd-global-content-shell .panel-active-services .div-service-buttons {
        grid-column: 1 / -1;
        justify-content: flex-start;
        justify-self: start;
    }
}

@media (max-width: 1199.98px) {
    body:not(.login) .mtd-global-content-shell .client-home-panels > .row {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    body:not(.login) .mtd-global-content-shell .client-home-panels > .row > .col-md-6 {
        grid-column: span 1;
    }
}

@media (max-width: 767.98px) {
    body:not(.login) .mtd-global-content-shell .client-home-panels > .row {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    body:not(.login) .mtd-global-content-shell .client-home-panels > .row > .col-md-6,
    body:not(.login) .mtd-global-content-shell .client-home-panels .mtd-dashboard-panel-services,
    body:not(.login) .mtd-global-content-shell .client-home-panels #servicesPanel {
        grid-column: 1 / -1;
    }

    body:not(.login) .mtd-global-content-shell .panel-active-services .list-group-item-content,
    body:not(.login) .mtd-global-content-shell .panel-active-services .div-service-item,
    body:not(.login) .mtd-global-content-shell .mtd-dashboard-panel-tickets .mtd-dashboard-ticket-item {
        grid-template-columns: 1fr;
        gap: 10px;
    }

    body:not(.login) .mtd-global-content-shell .panel-active-services .list-group-item-status,
    body:not(.login) .mtd-global-content-shell .panel-active-services .div-service-expiry,
    body:not(.login) .mtd-global-content-shell .panel-active-services .div-service-status,
    body:not(.login) .mtd-global-content-shell .panel-active-services .list-group-item-actions,
    body:not(.login) .mtd-global-content-shell .panel-active-services .div-service-buttons,
    body:not(.login) .mtd-global-content-shell .mtd-dashboard-panel-tickets .text-last-updated,
    body:not(.login) .mtd-global-content-shell .mtd-dashboard-panel-tickets small {
        justify-self: start;
        text-align: left;
    }

    body:not(.login) .mtd-global-content-shell .mtd-dashboard-panel-heading-inner {
        grid-template-columns: 1fr;
        gap: 10px;
        padding: 12px 0;
    }

    body:not(.login) .mtd-global-content-shell .mtd-dashboard-panel-actions {
        justify-content: flex-start;
    }

    body:not(.login) .mtd-global-content-shell .panel-active-services .list-group-item-fullname,
    body:not(.login) .mtd-global-content-shell .panel-active-services .service-fullname,
    body:not(.login) .mtd-global-content-shell .panel-active-services .service-name {
        white-space: normal;
    }
}

.register-wrapper .container {
    height: auto;
    min-height: 100vh;
    padding-top: 3rem;
    padding-bottom: 3rem;
    justify-content: flex-start;
}

.login-container.register-login-container {
    width: 760px;
    max-width: 95vw;
    margin-left: auto;
    margin-right: auto;
}

.register-login-box {
    overflow: visible;
}

.register-login-box #registration h4 {
    margin: 1.5rem 0 0.75rem;
    color: var(--text);
    font-size: 1rem;
    font-weight: 800;
}

.register-login-box #registration h4:first-of-type {
    margin-top: 0;
}

.register-login-box #registration .MTD-card {
    margin-bottom: 1.25rem;
    border: 1px solid var(--border);
    box-shadow: none;
}

.register-login-box #registration .form-actions {
    margin-top: 1.5rem;
}

.register-login-box #registration .form-actions .btn {
    width: 100%;
}

.register-login-layout .center-container {
    align-items: stretch;
}

.register-login-layout .center-container .register-login-container {
    width: 100%;
    max-width: none;
    margin-top: 0;
    margin-bottom: 0;
    padding-top: 25px;
    padding-right: 25px;
    padding-bottom: 2rem;
    padding-left: 25px;
}

.register-login-layout .center-container .register-login-box {
    width: 100%;
}

@media (max-width: 575.98px) {
    .register-login-layout .center-container .register-login-container {
        padding-top: 25px;
        padding-right: 25px;
        padding-bottom: 1rem;
        padding-left: 25px;
    }
}

body.login {
    min-height: 100vh;
    background:
        linear-gradient(118deg, rgba(246, 248, 252, 0.96) 0 34%, rgba(232, 240, 253, 0.94) 34% 61%, rgba(239, 247, 243, 0.96) 61% 100%),
        linear-gradient(180deg, #f8fafc, #e8eef7);
}

body.login #wrapper.mtd-login-screen {
    min-height: 100vh;
    padding: clamp(18px, 3vw, 44px);
    background:
        linear-gradient(90deg, color-mix(in srgb, var(--mtd-scheme-primary) 8%, transparent) 0 1px, transparent 1px 100%),
        linear-gradient(180deg, rgba(17, 24, 39, 0.05) 0 1px, transparent 1px 100%);
    background-size: 72px 72px;
}

body.login #wrapper.mtd-login-screen .mtd-login-page-container {
    display: flex;
    width: min(1160px, 100%);
    min-height: calc(100vh - clamp(36px, 6vw, 88px));
    align-items: center;
    justify-content: center;
    padding: 0;
}

body.login .mtd-login-shell {
    display: grid;
    grid-template-columns: minmax(330px, 0.88fr) minmax(390px, 1fr);
    width: 100%;
    overflow: hidden;
    color: #151b28;
    background: #ffffff;
    border: 1px solid rgba(148, 163, 184, 0.24);
    border-radius: 8px;
    box-shadow: 0 30px 90px rgba(15, 23, 42, 0.16);
}

body.login .mtd-login-visual {
    position: relative;
    display: flex;
    min-height: 650px;
    flex-direction: column;
    padding: clamp(28px, 3.2vw, 48px);
    overflow: hidden;
    color: #ffffff;
    background:
        linear-gradient(116deg, transparent 0 27%, rgba(255, 255, 255, 0.15) 27.2% 41%, transparent 41.2% 100%),
        linear-gradient(116deg, transparent 0 64%, color-mix(in srgb, var(--mtd-scheme-accent) 22%, rgba(255, 255, 255, 0.08)) 64.2% 78%, transparent 78.2% 100%),
        linear-gradient(90deg, rgba(255, 255, 255, 0.1) 1px, transparent 1px),
        linear-gradient(0deg, rgba(255, 255, 255, 0.075) 1px, transparent 1px),
        linear-gradient(145deg, color-mix(in srgb, var(--mtd-scheme-primary-deep) 78%, #07111f) 0%, color-mix(in srgb, var(--mtd-scheme-primary) 76%, var(--mtd-scheme-primary-deep)) 52%, color-mix(in srgb, var(--mtd-scheme-accent) 72%, var(--mtd-scheme-primary-deep)) 100%);
    background-size:
        100% 100%,
        100% 100%,
        64px 64px,
        64px 64px,
        100% 100%;
}

body.login .mtd-login-visual > :not(.line-bg) {
    position: relative;
    z-index: 1;
}

.line-bg {
  position: absolute;
  width: 1px;
  height: 100%;
  background-color: rgba(255, 255, 255, 0.1);
  top: 0;
  opacity: 0.7;
  pointer-events: none;
  z-index: 0;
  -webkit-transform: rotate(10deg);
  -moz-transform: rotate(10deg);
  -ms-transform: rotate(10deg);
  -o-transform: rotate(10deg);
  transform: rotate(10deg);
}
.line-bg:before {
  position: absolute;
  top: -60%;
  left: 0;
  content: "";
  height: 80px;
  width: 100%;
  background-color: rgba(255, 255, 255, 0.4);
  -webkit-animation: run 5s 0s infinite;
  animation: run 5s 0s infinite;
  -webkit-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
  -webkit-animation-timing-function: cubic-bezier(0.3, 0.27, 0, 0.98);
  animation-timing-function: cubic-bezier(0.3, 0.27, 0, 0.98);
}

.line-bg0 {
  left: 0%;
}
.line-bg0:before {
  -webkit-animation-delay: 1.6s;
  animation-delay: 1.6s;
}

.line-bg1 {
  left: 15%;
}
.line-bg1:before {
  -webkit-animation-delay: 2s;
  animation-delay: 2s;
}

.line-bg2 {
  left: 30%;
}
.line-bg2:before {
  -webkit-animation-delay: 2.6s;
  animation-delay: 2.6s;
}

.line-bg3 {
  left: 45%;
}
.line-bg3:before {
  -webkit-animation-delay: 3s;
  animation-delay: 3s;
}

.line-bg4 {
  left: 60%;
}
.line-bg4:before {
  -webkit-animation-delay: 3.6s;
  animation-delay: 3.6s;
}

.line-bg5 {
  left: 75%;
}
.line-bg5:before {
  -webkit-animation-delay: 4s;
  animation-delay: 4s;
}

.line-bg6 {
  left: 90%;
}
.line-bg6:before {
  -webkit-animation-delay: 4.6s;
  animation-delay: 4.6s;
}

/*============== run ==============*/
@-webkit-keyframes run {
  0% {
    top: -60%; }
  100% {
    top: 120%; } }

@-ms-keyframes run {
  0% {
    top: -60%; }
  100% {
    top: 120%; } }

@-o-keyframes run {
  0% {
    top: -60%; }
  100% {
    top: 120%; } }

@keyframes run {
  0% {
    top: -60%; }
  100% {
    top: 120%; } }

@-webkit-keyframes fade-effects {
    0% {
        opacity: 0;
        -webkit-transform: translateY(-20px);
        transform: translateY(-20px);
    }
    100% {
        opacity: 1;
        -webkit-transform: translateY(0px);
        transform: translateY(0px);
    }
}

body.login .mtd-login-brand {
    padding: 0;
}

body.login .mtd-login-logo-link {
    display: inline-flex;
    max-width: 100%;
    align-items: center;
    color: inherit;
    text-decoration: none;
}

body.login .mtd-login-logo-link img {
    width: auto;
    max-width: min(520px, 100%);
    height: auto;
    max-height: 100%;
}

body.login .mtd-login-logo-link span {
    color: inherit;
    font-size: clamp(1.35rem, 1.7vw, 1.8rem);
    font-weight: 900;
    line-height: 1.1;
    overflow-wrap: anywhere;
}

body.login .mtd-login-visual .logo-dark {
    display: none;
}

body.login .mtd-login-visual .logo-light {
    display: inline-block;
}

body.login .mtd-login-visual-copy {
    margin-top: auto;
    padding-top: 48px;
}

body.login .mtd-login-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    margin-bottom: 18px;
    padding: 8px 10px;
    color: #dff6ff;
    background: rgba(255, 255, 255, 0.12);
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 8px;
    font-size: 0.78rem;
    font-weight: 850;
    line-height: 1;
    letter-spacing: 0;
    text-transform: uppercase;
}

body.login .mtd-login-visual h2 {
    max-width: 460px;
    margin: 0 0 16px;
    color: #ffffff;
    font-size: clamp(2rem, 4vw, 4.25rem);
    font-weight: 900;
    line-height: 0.96;
    letter-spacing: 0;
}

body.login .mtd-login-visual-copy p,
body.login .mtd-login-story p {
    max-width: 420px;
    margin: 0;
    color: rgba(255, 255, 255, 0.82);
    font-size: clamp(1rem, 1.18vw, 1.15rem);
    line-height: 1.6;
}

body.login .mtd-login-feature-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    margin-top: 34px;
}

body.login .mtd-login-feature {
    display: flex;
    min-width: 0;
    min-height: 74px;
    flex-direction: column;
    justify-content: center;
    gap: 9px;
    padding: 12px;
    border-top: 1px solid rgba(255, 255, 255, 0.22);
    text-align: center;
}

body.login .mtd-login-feature i {
    color: #8df1c6;
    font-size: 1.2rem;
}

body.login .mtd-login-feature strong {
    color: #ffffff;
    font-size: 0.9rem;
    font-weight: 850;
    line-height: 1.2;
    overflow-wrap: anywhere;
}

body.login .mtd-login-security-note {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 28px;
    padding-top: 18px;
    border-top: 1px solid rgba(255, 255, 255, 0.18);
    color: rgba(255, 255, 255, 0.78);
    font-size: 0.92rem;
    line-height: 1.4;
}

body.login .mtd-login-security-note i {
    color: #8df1c6;
}

body.login .mtd-login-story {
    margin-top: 34px;
    padding-top: 24px;
    border-top: 1px solid rgba(255, 255, 255, 0.18);
}

body.login .mtd-login-story .swiper-slide {
    height: auto;
}

body.login .mtd-login-story a {
    color: inherit;
    text-decoration: none;
}

body.login .mtd-login-story h3 {
    max-width: 430px;
    margin: 12px 0 10px;
    color: #ffffff;
    font-size: clamp(1.25rem, 1.55vw, 1.65rem);
    font-weight: 900;
    line-height: 1.18;
}

body.login .mtd-login-story-meta {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #8df1c6;
    font-size: 0.82rem;
    font-weight: 800;
    line-height: 1.3;
}

body.login .mtd-login-story .swiper-pagination {
    position: static;
    margin-top: 18px;
    text-align: left;
}

body.login .mtd-login-form-panel {
    display: flex;
    min-width: 0;
    align-items: center;
    justify-content: center;
    padding: clamp(24px, 4.2vw, 58px);
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(248, 250, 252, 0.98));
}

body.login .mtd-login-form-panel .login-container,
body.login .loginpage-with-sidebar .mtd-login-form-panel .login-container {
    width: 100%;
    max-width: 470px;
    margin: 0;
}

body.login .mtd-login-box {
    padding: 0;
    overflow: visible;
    background: transparent;
    border-radius: 0;
    box-shadow: none;
}

body.login .mtd-login-mobile-brand {
    display: none;
    margin-bottom: 24px;
    padding: 0;
}

body.login .mtd-login-titlebar {
    display: grid;
    grid-template-columns: 46px minmax(0, 1fr);
    gap: 14px;
    align-items: center;
    margin-bottom: 26px;
}

body.login .mtd-login-title-icon {
    display: inline-flex;
    width: 46px;
    height: 46px;
    align-items: center;
    justify-content: center;
    color: #ffffff;
    background: var(--mtd-scheme-primary);
    border-radius: 8px;
    box-shadow: 0 14px 26px color-mix(in srgb, var(--mtd-scheme-primary) 26%, transparent);
    font-size: 1rem;
}

body.login .mtd-login-titlebar h1 {
    margin: 0 0 5px;
    color: #111827;
    font-size: clamp(1.55rem, 2.5vw, 2.25rem);
    font-weight: 900;
    line-height: 1.05;
    letter-spacing: 0;
    text-transform: none;
}

body.login .mtd-login-titlebar p {
    margin: 0;
    color: #64748b;
    font-size: clamp(0.98rem, 1.05vw, 1.08rem);
    line-height: 1.45;
}

body.login .mtd-login-form {
    display: grid;
    gap: 18px;
}

body.login .mtd-login-field {
    margin: 0;
}

body.login .mtd-login-field-top {
    display: flex;
    min-width: 0;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

body.login .mtd-login-field .form-control-label,
body.login .mtd-login-field-top .form-control-label {
    margin: 0 0 8px;
    color: #111827;
    font-size: 0.94rem;
    font-weight: 850;
    line-height: 1.25;
}

body.login .mtd-login-forgot {
    margin: 0 0 8px;
    color: #64748b;
    font-size: 0.9rem;
    font-weight: 750;
    line-height: 1.25;
    text-decoration: none;
    white-space: nowrap;
}

body.login .mtd-login-forgot:hover,
body.login .mtd-login-forgot:focus {
    color: var(--mtd-scheme-primary);
    text-decoration: none;
}

body.login .mtd-login-input-wrap {
    display: flex;
    min-height: 56px;
    align-items: center;
    gap: 10px;
    padding: 0 14px;
    overflow: hidden;
    background: #ffffff;
    border: 1px solid #d9e2ef;
    border-radius: 8px;
    box-shadow: 0 8px 24px rgba(15, 23, 42, 0.04);
    transition: border-color 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease;
}

body.login .mtd-login-input-wrap:focus-within {
    border-color: var(--mtd-scheme-primary);
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--mtd-scheme-primary) 12%, transparent);
}

body.login .mtd-login-input-icon {
    display: inline-flex;
    flex: 0 0 22px;
    width: 22px;
    align-items: center;
    justify-content: center;
    color: #94a3b8;
    font-size: 0.95rem;
}

body.login .mtd-login-input-wrap .form-control {
    min-width: 0;
    height: 54px;
    flex: 1 1 auto;
    padding: 0;
    color: #111827;
    background: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    font-size: 1rem;
    font-weight: 650;
}

body.login .mtd-login-input-wrap .form-control::placeholder {
    color: #94a3b8;
    font-weight: 500;
}

body.login .mtd-login-password-wrap {
    padding-right: 6px;
}

body.login .mtd-login-password-wrap .input-group-append {
    display: flex;
    flex: 0 0 auto;
    margin: 0;
}

body.login .mtd-login-reveal {
    display: inline-flex;
    width: 42px;
    height: 42px;
    align-items: center;
    justify-content: center;
    padding: 0;
    color: #64748b;
    background: #f1f5f9;
    border: 0;
    border-radius: 8px;
    box-shadow: none;
}

body.login .mtd-login-reveal:hover,
body.login .mtd-login-reveal:focus {
    color: var(--mtd-scheme-primary);
    background: var(--mtd-scheme-primary-soft);
}

body.login .mtd-login-options {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 2px;
}

body.login .mtd-login-remember {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    margin: 0;
    color: #111827;
    font-size: 0.94rem;
    font-weight: 850;
    line-height: 1.3;
}

body.login .mtd-login-remember .icheckbox_square-blue {
    margin-right: 8px;
}

body.login .mtd-login-captcha {
    margin: 4px 0 0;
}

body.login .btn-login {
    display: inline-flex;
    min-height: 56px;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin: 4px 0 0;
    padding: 0 18px;
    color: #ffffff;
    background: var(--mtd-scheme-primary);
    border: 0;
    border-radius: 8px;
    box-shadow: 0 18px 34px color-mix(in srgb, var(--mtd-scheme-primary) 28%, transparent);
    font-size: 1rem;
    font-weight: 900;
    line-height: 1;
    transition: background-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}

body.login .btn-login:hover,
body.login .btn-login:focus {
    color: #ffffff;
    background: var(--mtd-scheme-primary-hover);
    box-shadow: 0 20px 38px color-mix(in srgb, var(--mtd-scheme-primary) 34%, transparent);
    transform: translateY(-1px);
}

body.login .mtd-login-box .alert {
    margin-bottom: 20px;
    border-radius: 8px;
}

body.login .mtd-login-box .social-or-login {
    margin: 24px 0 18px;
}

body.login .mtd-login-box .social-or-login span {
    background: #f8fafc;
    color: #64748b;
    font-weight: 800;
}

body.login .mtd-login-box .login-container-register {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 5px;
    margin: 28px 0 0;
    padding: 18px;
    color: #334155;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    font-size: 0.98rem;
    line-height: 1.35;
}

body.login .mtd-login-box .login-container-register a {
    color: var(--mtd-scheme-primary);
    font-weight: 900;
    text-decoration: none;
}

body.login .mtd-login-box .login-container-register a:hover,
body.login .mtd-login-box .login-container-register a:focus {
    color: var(--mtd-scheme-primary-hover);
    text-decoration: none;
}

body.login .mtd-login-language {
    margin-top: 18px;
}

body.login .mtd-login-language .btn {
    display: inline-flex;
    min-height: 42px;
    align-items: center;
    gap: 8px;
    padding: 8px 14px;
    color: #334155;
    background: rgba(255, 255, 255, 0.82);
    border: 1px solid rgba(148, 163, 184, 0.32);
    border-radius: 8px;
    box-shadow: 0 12px 26px rgba(15, 23, 42, 0.08);
    font-weight: 850;
}

body.login .mtd-login-language .iti-flag {
    margin: 0;
}

body.dark-mode.login {
    background:
        linear-gradient(118deg, rgba(8, 14, 26, 0.98) 0 34%, rgba(15, 30, 54, 0.98) 34% 61%, rgba(10, 40, 36, 0.97) 61% 100%),
        linear-gradient(180deg, #07111f, #101827);
}

body.dark-mode.login .mtd-login-shell {
    color: #e5edf7;
    background: #111c2d;
    border-color: rgba(148, 163, 184, 0.18);
    box-shadow: 0 30px 90px rgba(0, 0, 0, 0.36);
}

body.dark-mode.login .mtd-login-form-panel {
    background:
        linear-gradient(180deg, rgba(17, 28, 45, 0.98), rgba(15, 23, 42, 0.98));
}

body.dark-mode.login .mtd-login-titlebar h1,
body.dark-mode.login .mtd-login-field .form-control-label,
body.dark-mode.login .mtd-login-field-top .form-control-label,
body.dark-mode.login .mtd-login-remember {
    color: #f8fafc;
}

body.dark-mode.login .mtd-login-titlebar p,
body.dark-mode.login .mtd-login-forgot {
    color: #9ba8bb;
}

body.dark-mode.login .mtd-login-input-wrap,
body.dark-mode.login .mtd-login-box .login-container-register,
body.dark-mode.login .mtd-login-box .social-or-login span,
body.dark-mode.login .mtd-login-language .btn {
    color: #dce6f4;
    background: #17243a;
    border-color: #2c3b52;
}

body.dark-mode.login .mtd-login-input-wrap .form-control {
    color: #f8fafc;
}

body.dark-mode.login .mtd-login-reveal {
    color: #9ba8bb;
    background: #223148;
}

body.dark-mode.login .mtd-login-box .login-container-register {
    color: #dce6f4;
}

@media (max-width: 991.98px) {
    body.login #wrapper.mtd-login-screen {
        padding: 18px;
    }

    body.login #wrapper.mtd-login-screen .mtd-login-page-container {
        min-height: calc(100vh - 36px);
    }

    body.login .mtd-login-shell {
        grid-template-columns: minmax(0, 1fr);
        max-width: 560px;
    }

    body.login .mtd-login-visual {
        display: none;
    }

    body.login .mtd-login-form-panel {
        padding: clamp(24px, 7vw, 42px);
    }

    body.login .mtd-login-mobile-brand {
        display: block;
    }

    body.login .mtd-login-mobile-brand .logo-light {
        display: none;
    }

    body.login .mtd-login-mobile-brand .logo-dark {
        display: inline-block;
    }
}

@media (max-width: 575.98px) {
    body.login #wrapper.mtd-login-screen {
        padding: 10px;
    }

    body.login .mtd-login-shell {
        border-radius: 8px;
    }

    body.login .mtd-login-form-panel {
        padding: 22px 16px;
    }

    body.login .mtd-login-titlebar {
        grid-template-columns: 40px minmax(0, 1fr);
        gap: 12px;
        margin-bottom: 22px;
    }

    body.login .mtd-login-title-icon {
        width: 40px;
        height: 40px;
        border-radius: 8px;
    }

    body.login .mtd-login-field-top {
        align-items: flex-start;
        flex-direction: column;
        gap: 0;
    }

    body.login .mtd-login-forgot {
        white-space: normal;
    }

    body.login .mtd-login-input-wrap {
        min-height: 52px;
        padding: 0 12px;
    }

    body.login .mtd-login-input-wrap .form-control {
        height: 50px;
        font-size: 0.96rem;
    }

    body.login .btn-login {
        min-height: 52px;
    }

    body.login .mtd-login-box .login-container-register {
        padding: 15px;
    }
}

#wrapper.mtd-register-screen {
    min-height: 100vh;
    padding: clamp(18px, 2.8vw, 42px);
    background:
        linear-gradient(118deg, rgba(246, 248, 252, 0.96) 0 34%, rgba(232, 240, 253, 0.94) 34% 61%, rgba(239, 247, 243, 0.96) 61% 100%),
        linear-gradient(90deg, color-mix(in srgb, var(--mtd-scheme-primary) 7%, transparent) 0 1px, transparent 1px 100%),
        linear-gradient(180deg, rgba(17, 24, 39, 0.05) 0 1px, transparent 1px 100%);
    background-size: auto, 72px 72px, 72px 72px;
}

#wrapper.mtd-register-screen .mtd-register-page-container {
    display: flex;
    width: min(1360px, 100%);
    min-height: calc(100vh - clamp(36px, 5.6vw, 84px));
    align-items: center;
    justify-content: center;
    padding: 0;
}

#wrapper.mtd-register-screen .mtd-register-shell {
    display: grid;
    grid-template-columns: minmax(300px, 0.34fr) minmax(0, 1fr);
    width: 100%;
    overflow: hidden;
    color: #151b28;
    background: #ffffff;
    border: 1px solid rgba(148, 163, 184, 0.24);
    border-radius: 8px;
    box-shadow: 0 30px 90px rgba(15, 23, 42, 0.16);
}

#wrapper.mtd-register-screen .mtd-register-visual {
    position: relative;
    display: flex;
    min-height: 100%;
    flex-direction: column;
    padding: clamp(28px, 3vw, 46px);
    overflow: hidden;
    color: #ffffff;
    background:
        radial-gradient(circle at 22% 16%, color-mix(in srgb, var(--mtd-scheme-primary) 36%, transparent) 0 16%, transparent 34%),
        radial-gradient(circle at 86% 82%, color-mix(in srgb, var(--mtd-scheme-accent) 36%, transparent) 0 18%, transparent 38%),
        linear-gradient(145deg, color-mix(in srgb, var(--mtd-scheme-primary-deep) 84%, #07111f) 0%, color-mix(in srgb, var(--mtd-scheme-primary) 72%, #0f172a) 50%, color-mix(in srgb, var(--mtd-scheme-accent) 74%, #07111f) 100%);
}

#wrapper.mtd-register-screen .mtd-register-visual > :not(.line-bg) {
    position: relative;
    z-index: 1;
}

#wrapper.mtd-register-screen .mtd-register-brand,
#wrapper.mtd-register-screen .mtd-register-mobile-brand {
    padding: 0;
}

#wrapper.mtd-register-screen .mtd-register-logo-link {
    display: inline-flex;
    max-width: 100%;
    align-items: center;
    color: inherit;
    text-decoration: none;
}

#wrapper.mtd-register-screen .mtd-register-logo-link img {
    width: auto;
    max-width: min(520px, 100%);
    height: auto;
    max-height: 100%;
}

#wrapper.mtd-register-screen .mtd-register-logo-link span {
    color: inherit;
    font-size: clamp(1.35rem, 1.7vw, 1.8rem);
    font-weight: 900;
    line-height: 1.1;
    overflow-wrap: anywhere;
}

#wrapper.mtd-register-screen .mtd-register-visual .logo-dark {
    display: none;
}

#wrapper.mtd-register-screen .mtd-register-visual .logo-light {
    display: inline-block;
}

#wrapper.mtd-register-screen .mtd-register-visual-copy {
    margin-top: clamp(56px, 10vh, 96px);
    padding-top: 0;
}

#wrapper.mtd-register-screen .mtd-register-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    margin-bottom: 18px;
    padding: 8px 10px;
    color: #dff6ff;
    background: rgba(255, 255, 255, 0.12);
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 8px;
    font-size: 0.78rem;
    font-weight: 850;
    line-height: 1;
    letter-spacing: 0;
    text-transform: uppercase;
}

#wrapper.mtd-register-screen .mtd-register-visual h2 {
    max-width: 420px;
    margin: 0 0 16px;
    color: #ffffff;
    font-size: clamp(2rem, 3.5vw, 3.8rem);
    font-weight: 900;
    line-height: 0.98;
    letter-spacing: 0;
}

#wrapper.mtd-register-screen .mtd-register-visual-copy p,
#wrapper.mtd-register-screen .mtd-register-story p {
    max-width: 390px;
    margin: 0;
    color: rgba(255, 255, 255, 0.82);
    font-size: clamp(0.98rem, 1vw, 1.12rem);
    line-height: 1.6;
}

#wrapper.mtd-register-screen .mtd-register-steps {
    display: grid;
    gap: 10px;
    margin-top: 34px;
}

#wrapper.mtd-register-screen .mtd-register-step {
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr);
    column-gap: 12px;
    align-items: center;
    padding: 13px 0;
    border-top: 1px solid rgba(255, 255, 255, 0.18);
}

#wrapper.mtd-register-screen .mtd-register-step i {
    display: inline-flex;
    width: 38px;
    height: 38px;
    align-items: center;
    justify-content: center;
    color: #08223f;
    background: #8df1c6;
    border-radius: 8px;
}

#wrapper.mtd-register-screen .mtd-register-step strong,
#wrapper.mtd-register-screen .mtd-register-step small {
    display: block;
    min-width: 0;
    overflow-wrap: anywhere;
}

#wrapper.mtd-register-screen .mtd-register-step strong {
    color: #ffffff;
    font-size: 0.98rem;
    font-weight: 900;
    line-height: 1.2;
}

#wrapper.mtd-register-screen .mtd-register-step small {
    color: rgba(255, 255, 255, 0.72);
    font-size: 0.82rem;
    line-height: 1.35;
}

#wrapper.mtd-register-screen .mtd-register-security-note {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: auto;
    padding-top: 18px;
    border-top: 1px solid rgba(255, 255, 255, 0.18);
    color: rgba(255, 255, 255, 0.78);
    font-size: 0.92rem;
    line-height: 1.4;
}

#wrapper.mtd-register-screen .mtd-register-security-note i {
    color: #8df1c6;
}

#wrapper.mtd-register-screen .mtd-register-story {
    margin-top: 34px;
    padding-top: 24px;
    border-top: 1px solid rgba(255, 255, 255, 0.18);
}

#wrapper.mtd-register-screen .mtd-register-story .swiper-slide {
    height: auto;
}

#wrapper.mtd-register-screen .mtd-register-story a {
    color: inherit;
    text-decoration: none;
}

#wrapper.mtd-register-screen .mtd-register-story h3 {
    max-width: 400px;
    margin: 12px 0 10px;
    color: #ffffff;
    font-size: clamp(1.2rem, 1.4vw, 1.55rem);
    font-weight: 900;
    line-height: 1.18;
}

#wrapper.mtd-register-screen .mtd-register-story-meta {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #8df1c6;
    font-size: 0.82rem;
    font-weight: 800;
    line-height: 1.3;
}

#wrapper.mtd-register-screen .mtd-register-story .swiper-pagination {
    position: static;
    margin-top: 18px;
    text-align: left;
}

#wrapper.mtd-register-screen .mtd-register-form-panel {
    min-width: 0;
    padding: clamp(24px, 3.5vw, 54px);
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(248, 250, 252, 0.98));
}

#wrapper.mtd-register-screen .register-login-container,
#wrapper.mtd-register-screen.loginpage-with-sidebar .register-login-container {
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 0;
}

#wrapper.mtd-register-screen .mtd-register-box {
    padding: 0;
    overflow: visible;
    background: transparent;
    border-radius: 0;
    box-shadow: none;
}

#wrapper.mtd-register-screen .mtd-register-mobile-brand {
    display: none;
    margin-bottom: 24px;
}

#wrapper.mtd-register-screen .mtd-register-titlebar {
    display: grid;
    grid-template-columns: 48px minmax(0, 1fr);
    gap: 14px;
    align-items: center;
    margin-bottom: 26px;
}

#wrapper.mtd-register-screen .mtd-register-title-icon {
    display: inline-flex;
    width: 48px;
    height: 48px;
    align-items: center;
    justify-content: center;
    color: #ffffff;
    background: var(--mtd-scheme-primary);
    border-radius: 8px;
    box-shadow: 0 14px 26px color-mix(in srgb, var(--mtd-scheme-primary) 26%, transparent);
    font-size: 1rem;
}

#wrapper.mtd-register-screen .mtd-register-titlebar h1 {
    margin: 0 0 5px;
    color: #111827;
    font-size: clamp(1.65rem, 2.4vw, 2.25rem);
    font-weight: 900;
    line-height: 1.05;
    letter-spacing: 0;
    text-transform: none;
}

#wrapper.mtd-register-screen .mtd-register-titlebar p {
    margin: 0;
    color: #64748b;
    font-size: clamp(0.98rem, 1vw, 1.08rem);
    line-height: 1.45;
}

#wrapper.mtd-register-screen #registration {
    width: 100%;
}

#wrapper.mtd-register-screen #registration h4 {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 28px 0 12px;
    color: #111827;
    font-size: 1rem;
    font-weight: 900;
    line-height: 1.25;
}

#wrapper.mtd-register-screen #registration h4:first-of-type {
    margin-top: 0;
}

#wrapper.mtd-register-screen #registration h4::before {
    content: "";
    display: block;
    width: 8px;
    height: 22px;
    background: var(--mtd-scheme-primary);
    border-radius: 8px;
}

#wrapper.mtd-register-screen #registration .MTD-card {
    padding: clamp(18px, 2.1vw, 28px);
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    box-shadow: 0 14px 34px rgba(15, 23, 42, 0.06);
}

#wrapper.mtd-register-screen #registration .row {
    margin-right: -8px;
    margin-left: -8px;
}

#wrapper.mtd-register-screen #registration [class*="col-"] {
    padding-right: 8px;
    padding-left: 8px;
}

#wrapper.mtd-register-screen #registration .form-group {
    margin-bottom: 16px;
}

#wrapper.mtd-register-screen #registration .MTD-card .row > [class*="col-"]:last-child .form-group {
    margin-bottom: 0;
}

#wrapper.mtd-register-screen #registration .prepend-icon {
    position: relative;
}

#wrapper.mtd-register-screen #registration .prepend-icon .field-icon {
    position: absolute;
    top: 50%;
    left: 15px;
    z-index: 2;
    display: inline-flex;
    width: 20px;
    height: 20px;
    align-items: center;
    justify-content: center;
    margin: 0;
    color: #94a3b8;
    font-size: 0.95rem;
    line-height: 1;
    transform: translateY(-50%);
}

#wrapper.mtd-register-screen #registration .prepend-icon .input-state-icon + .input-state-icon {
    display: none;
}

#wrapper.mtd-register-screen #registration .field.form-control,
#wrapper.mtd-register-screen #registration select.field.form-control,
#wrapper.mtd-register-screen #registration .form-control {
    min-height: 54px;
    width: 100%;
    padding: 0 16px;
    color: #111827;
    background: #ffffff;
    border: 1px solid #d9e2ef;
    border-radius: 8px;
    box-shadow: 0 8px 24px rgba(15, 23, 42, 0.035);
    font-size: 0.98rem;
    font-weight: 650;
    line-height: 1.3;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

#wrapper.mtd-register-screen #registration .prepend-icon .field.form-control,
#wrapper.mtd-register-screen #registration .prepend-icon select.field.form-control {
    padding-left: 46px;
}

#wrapper.mtd-register-screen #registration .field.form-control:focus,
#wrapper.mtd-register-screen #registration select.field.form-control:focus,
#wrapper.mtd-register-screen #registration .form-control:focus {
    border-color: var(--mtd-scheme-primary);
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--mtd-scheme-primary) 12%, transparent);
}

#wrapper.mtd-register-screen #registration .field.form-control::placeholder {
    color: #64748b;
    font-weight: 550;
}

#wrapper.mtd-register-screen #registration select.field.form-control {
    appearance: auto;
}

#wrapper.mtd-register-screen #registration .field-help-text,
#wrapper.mtd-register-screen #registration .small.text-muted {
    display: block;
    color: #64748b;
    font-size: 0.86rem;
    line-height: 1.45;
}

#wrapper.mtd-register-screen #containerNewUserSecurity .password-strength-meter {
    padding: 4px 0 0;
}

#wrapper.mtd-register-screen #containerNewUserSecurity .password-strength-meter .progress {
    height: 8px;
    overflow: hidden;
    background: #e2e8f0;
    border-radius: 8px;
    box-shadow: none;
}

#wrapper.mtd-register-screen #containerNewUserSecurity #passwordStrengthTextLabel {
    margin: 9px 0 0;
    color: #64748b;
    font-size: 0.9rem;
    font-weight: 750;
}

#wrapper.mtd-register-screen .generate-password {
    min-height: 42px;
    padding: 8px 13px;
    color: var(--mtd-scheme-primary);
    background: var(--mtd-scheme-primary-soft);
    border: 1px solid color-mix(in srgb, var(--mtd-scheme-primary) 18%, transparent);
    border-radius: 8px;
    font-weight: 850;
}

#wrapper.mtd-register-screen .generate-password:hover,
#wrapper.mtd-register-screen .generate-password:focus {
    color: #ffffff;
    background: var(--mtd-scheme-primary);
    border-color: var(--mtd-scheme-primary);
}

#wrapper.mtd-register-screen #registration .panel-switch {
    width: max-content;
    max-width: 100%;
    margin-top: 14px;
    border: 1px solid color-mix(in srgb, var(--mtd-scheme-primary) 28%, transparent);
    border-radius: 8px;
    box-shadow: none;
}

#wrapper.mtd-register-screen #registration .panel-switch .panel-body {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 13px 16px;
}

#wrapper.mtd-register-screen .mtd-register-tos {
    margin-top: 22px;
    padding: 16px 18px;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
}

#wrapper.mtd-register-screen .mtd-register-tos .form-check {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin: 0;
    color: #334155;
    font-size: 0.95rem;
    line-height: 1.45;
}

#wrapper.mtd-register-screen .mtd-register-tos a {
    color: var(--mtd-scheme-primary);
    font-weight: 850;
}

#wrapper.mtd-register-screen #registration .form-actions {
    margin-top: 24px;
}

#wrapper.mtd-register-screen #registration .form-actions .mtd-register-submit {
    display: inline-flex;
    min-height: 56px;
    width: 100%;
    align-items: center;
    justify-content: center;
    padding: 0 18px;
    color: #ffffff;
    background: var(--mtd-scheme-primary);
    border: 0;
    border-radius: 8px;
    box-shadow: 0 18px 34px color-mix(in srgb, var(--mtd-scheme-primary) 28%, transparent);
    font-size: 1rem;
    font-weight: 900;
    line-height: 1;
}

#wrapper.mtd-register-screen #registration .form-actions .mtd-register-submit:hover,
#wrapper.mtd-register-screen #registration .form-actions .mtd-register-submit:focus {
    color: #ffffff;
    background: var(--mtd-scheme-primary-hover);
    box-shadow: 0 20px 38px color-mix(in srgb, var(--mtd-scheme-primary) 34%, transparent);
}

#wrapper.mtd-register-screen .mtd-register-login-link {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 5px;
    margin: 28px 0 0;
    padding: 18px;
    color: #334155;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    font-size: 0.98rem;
    line-height: 1.35;
}

#wrapper.mtd-register-screen .mtd-register-login-link a {
    color: var(--mtd-scheme-primary);
    font-weight: 900;
    text-decoration: none;
}

#wrapper.mtd-register-screen .mtd-register-login-link a:hover,
#wrapper.mtd-register-screen .mtd-register-login-link a:focus {
    color: var(--mtd-scheme-primary-hover);
    text-decoration: none;
}

#wrapper.mtd-register-screen .mtd-register-language {
    margin-top: 18px;
}

#wrapper.mtd-register-screen .mtd-register-language .btn {
    display: inline-flex;
    min-height: 42px;
    align-items: center;
    gap: 8px;
    padding: 8px 14px;
    color: #334155;
    background: rgba(255, 255, 255, 0.82);
    border: 1px solid rgba(148, 163, 184, 0.32);
    border-radius: 8px;
    box-shadow: 0 12px 26px rgba(15, 23, 42, 0.08);
    font-weight: 850;
}

#wrapper.mtd-register-screen .mtd-register-language .iti-flag {
    margin: 0;
}

body.dark-mode #wrapper.mtd-register-screen {
    background:
        linear-gradient(118deg, rgba(8, 14, 26, 0.98) 0 34%, rgba(15, 30, 54, 0.98) 34% 61%, rgba(10, 40, 36, 0.97) 61% 100%),
        linear-gradient(90deg, color-mix(in srgb, var(--mtd-scheme-primary) 8%, transparent) 0 1px, transparent 1px 100%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.04) 0 1px, transparent 1px 100%);
    background-size: auto, 72px 72px, 72px 72px;
}

body.dark-mode #wrapper.mtd-register-screen .mtd-register-shell {
    color: #e5edf7;
    background: #111c2d;
    border-color: rgba(148, 163, 184, 0.18);
    box-shadow: 0 30px 90px rgba(0, 0, 0, 0.36);
}

body.dark-mode #wrapper.mtd-register-screen .mtd-register-form-panel {
    background:
        linear-gradient(180deg, rgba(17, 28, 45, 0.98), rgba(15, 23, 42, 0.98));
}

body.dark-mode #wrapper.mtd-register-screen .mtd-register-titlebar h1,
body.dark-mode #wrapper.mtd-register-screen #registration h4 {
    color: #f8fafc;
}

body.dark-mode #wrapper.mtd-register-screen .mtd-register-titlebar p,
body.dark-mode #wrapper.mtd-register-screen #registration .field-help-text,
body.dark-mode #wrapper.mtd-register-screen #registration .small.text-muted {
    color: #9ba8bb;
}

body.dark-mode #wrapper.mtd-register-screen #registration .MTD-card,
body.dark-mode #wrapper.mtd-register-screen #registration .field.form-control,
body.dark-mode #wrapper.mtd-register-screen #registration select.field.form-control,
body.dark-mode #wrapper.mtd-register-screen #registration .form-control,
body.dark-mode #wrapper.mtd-register-screen .mtd-register-tos,
body.dark-mode #wrapper.mtd-register-screen .mtd-register-login-link,
body.dark-mode #wrapper.mtd-register-screen .mtd-register-language .btn {
    color: #dce6f4;
    background: #17243a;
    border-color: #2c3b52;
}

body.dark-mode #wrapper.mtd-register-screen #registration .field.form-control,
body.dark-mode #wrapper.mtd-register-screen #registration select.field.form-control,
body.dark-mode #wrapper.mtd-register-screen #registration .form-control {
    color: #f8fafc;
}

body.dark-mode #wrapper.mtd-register-screen #containerNewUserSecurity .password-strength-meter .progress {
    background: #223148;
}

@media (max-width: 1199.98px) {
    #wrapper.mtd-register-screen .mtd-register-shell {
        grid-template-columns: minmax(0, 1fr);
        max-width: 860px;
    }

    #wrapper.mtd-register-screen .mtd-register-visual {
        display: none;
    }

    #wrapper.mtd-register-screen .mtd-register-mobile-brand {
        display: block;
    }

    #wrapper.mtd-register-screen .mtd-register-mobile-brand .logo-light {
        display: none;
    }

    #wrapper.mtd-register-screen .mtd-register-mobile-brand .logo-dark {
        display: inline-block;
    }
}

@media (max-width: 767.98px) {
    #wrapper.mtd-register-screen {
        padding: 10px;
    }

    #wrapper.mtd-register-screen .mtd-register-page-container {
        min-height: calc(100vh - 20px);
    }

    #wrapper.mtd-register-screen .mtd-register-shell {
        border-radius: 8px;
    }

    #wrapper.mtd-register-screen .mtd-register-form-panel {
        padding: 22px 16px;
    }

    #wrapper.mtd-register-screen .mtd-register-titlebar {
        grid-template-columns: 40px minmax(0, 1fr);
        gap: 12px;
        margin-bottom: 22px;
    }

    #wrapper.mtd-register-screen .mtd-register-title-icon {
        width: 40px;
        height: 40px;
    }

    #wrapper.mtd-register-screen #registration .MTD-card {
        padding: 16px;
    }

    #wrapper.mtd-register-screen #registration .field.form-control,
    #wrapper.mtd-register-screen #registration select.field.form-control,
    #wrapper.mtd-register-screen #registration .form-control {
        min-height: 50px;
        font-size: 0.95rem;
    }

    #wrapper.mtd-register-screen #registration .prepend-icon .field.form-control,
    #wrapper.mtd-register-screen #registration .prepend-icon select.field.form-control {
        padding-left: 42px;
    }

    #wrapper.mtd-register-screen #registration .panel-switch {
        width: 100%;
    }

    #wrapper.mtd-register-screen #registration .panel-switch .panel-body {
        justify-content: space-between;
    }
}

/* Register screen final overrides */
#wrapper.mtd-register-screen.loginpage-with-sidebar,
#wrapper.mtd-register-screen.register-login-layout,
#wrapper.mtd-register-screen.primary-content {
    height: auto !important;
    min-height: 100vh !important;
    overflow: visible !important;
}

#wrapper.mtd-register-screen .mtd-register-page-container {
    align-items: flex-start !important;
    overflow: visible !important;
}

#wrapper.mtd-register-screen .mtd-register-shell {
    overflow: visible !important;
    align-items: stretch !important;
}

#wrapper.mtd-register-screen .mtd-register-form-panel,
#wrapper.mtd-register-screen .mtd-register-box,
#wrapper.mtd-register-screen #registration,
#wrapper.mtd-register-screen #frmCheckout {
    overflow: visible !important;
}

#wrapper.mtd-register-screen #registration .mtd-register-phone-field .field-icon {
    display: none !important;
}

#wrapper.mtd-register-screen #registration .mtd-register-phone-field .intl-tel-input,
#wrapper.mtd-register-screen #registration .mtd-register-phone-field .iti {
    position: relative !important;
    display: block !important;
    width: 100% !important;
}

#wrapper.mtd-register-screen #registration .mtd-register-phone-field .intl-tel-input .flag-container,
#wrapper.mtd-register-screen #registration .mtd-register-phone-field .iti__flag-container {
    z-index: 4 !important;
    right: auto !important;
    left: 0 !important;
    width: 126px !important;
    max-width: 126px !important;
    border-right: 1px solid #e2e8f0;
}

#wrapper.mtd-register-screen #registration .mtd-register-phone-field .intl-tel-input .selected-flag,
#wrapper.mtd-register-screen #registration .mtd-register-phone-field .iti__selected-flag {
    min-height: 54px;
    padding-left: 15px;
    padding-right: 12px;
    border-radius: 8px 0 0 8px;
    background: #f8fafc;
}

#wrapper.mtd-register-screen #registration .mtd-register-phone-field .intl-tel-input.separate-dial-code .selected-flag,
#wrapper.mtd-register-screen #registration .mtd-register-phone-field .iti--separate-dial-code .iti__selected-flag {
    min-width: 106px !important;
}

#wrapper.mtd-register-screen #registration .mtd-register-phone-field #inputPhone.field.form-control,
#wrapper.mtd-register-screen #registration .mtd-register-phone-field .intl-tel-input input#inputPhone,
#wrapper.mtd-register-screen #registration .mtd-register-phone-field .iti input#inputPhone {
    position: relative !important;
    z-index: 1 !important;
    padding-left: 138px !important;
}

#wrapper.mtd-register-screen #registration .mtd-register-phone-field .intl-tel-input:not(.separate-dial-code) input#inputPhone,
#wrapper.mtd-register-screen #registration .mtd-register-phone-field .iti:not(.iti--separate-dial-code) input#inputPhone {
    padding-left: 58px !important;
}

#wrapper.mtd-register-screen #registration .mtd-register-phone-field .country-list,
#wrapper.mtd-register-screen #registration .mtd-register-phone-field .iti__country-list {
    z-index: 10020;
    max-width: min(420px, calc(100vw - 40px));
    border-radius: 8px;
}

#wrapper.mtd-register-screen #registration .mtd-register-captcha {
    display: block;
    margin-top: 24px !important;
    padding: 22px !important;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    box-shadow: 0 14px 34px rgba(15, 23, 42, 0.06);
}

#wrapper.mtd-register-screen #registration .mtd-register-captcha p {
    max-width: 720px;
    margin: 0 auto 18px;
    color: #64748b;
    text-align: center;
    font-size: 0.96rem;
    line-height: 1.55;
}

#wrapper.mtd-register-screen #registration .mtd-register-captcha .form-control,
#wrapper.mtd-register-screen #registration .mtd-register-captcha input[type="text"] {
    max-width: 190px;
    margin: 0 auto;
}

#wrapper.mtd-register-screen #registration .mtd-register-captcha img {
    max-width: 100%;
    height: auto;
}

#wrapper.mtd-register-screen #registration .form-actions {
    display: block !important;
    margin-top: 28px !important;
    padding-top: 24px !important;
}

body.dark-mode #wrapper.mtd-register-screen #registration .mtd-register-phone-field .intl-tel-input .selected-flag,
body.dark-mode #wrapper.mtd-register-screen #registration .mtd-register-phone-field .iti__selected-flag,
body.dark-mode #wrapper.mtd-register-screen #registration .mtd-register-captcha {
    color: #dce6f4;
    background: #17243a;
    border-color: #2c3b52;
}

@media (max-width: 767.98px) {
    #wrapper.mtd-register-screen #registration .mtd-register-phone-field .intl-tel-input .selected-flag,
    #wrapper.mtd-register-screen #registration .mtd-register-phone-field .iti__selected-flag {
        min-height: 50px;
    }

    #wrapper.mtd-register-screen #registration .mtd-register-phone-field .intl-tel-input.separate-dial-code .selected-flag,
    #wrapper.mtd-register-screen #registration .mtd-register-phone-field .iti--separate-dial-code .iti__selected-flag {
        min-width: 106px !important;
    }

    #wrapper.mtd-register-screen #registration .mtd-register-phone-field #inputPhone.field.form-control,
    #wrapper.mtd-register-screen #registration .mtd-register-phone-field .intl-tel-input input#inputPhone,
    #wrapper.mtd-register-screen #registration .mtd-register-phone-field .iti input#inputPhone {
        padding-left: 120px !important;
    }

    #wrapper.mtd-register-screen #registration .mtd-register-captcha {
        padding: 18px 14px !important;
    }
}

/* Match register and forgot password backgrounds to login */
#wrapper.mtd-login-background {
    min-height: 100vh;
    padding: clamp(18px, 3vw, 44px);
    background:
        linear-gradient(90deg, color-mix(in srgb, var(--mtd-scheme-primary) 8%, transparent) 0 1px, transparent 1px 100%),
        linear-gradient(180deg, rgba(17, 24, 39, 0.05) 0 1px, transparent 1px 100%);
    background-size: 72px 72px;
}

#wrapper.mtd-login-background .mtd-register-visual,
#wrapper.mtd-login-background .mtd-reset-visual {
    min-height: 650px;
    padding: clamp(28px, 3.2vw, 48px);
    background:
        radial-gradient(circle at 22% 16%, color-mix(in srgb, var(--mtd-scheme-primary) 36%, transparent) 0 16%, transparent 34%),
        radial-gradient(circle at 86% 82%, color-mix(in srgb, var(--mtd-scheme-accent) 36%, transparent) 0 18%, transparent 38%),
        linear-gradient(145deg, color-mix(in srgb, var(--mtd-scheme-primary-deep) 84%, #07111f) 0%, color-mix(in srgb, var(--mtd-scheme-primary) 72%, #0f172a) 50%, color-mix(in srgb, var(--mtd-scheme-accent) 74%, #07111f) 100%);
}

#wrapper.mtd-login-background .mtd-reset-visual::before {
    inset: 0;
    background:
        linear-gradient(110deg, transparent 0 18%, rgba(255, 255, 255, 0.22) 18.2% 18.58%, transparent 18.85% 100%),
        linear-gradient(110deg, transparent 0 31%, rgba(255, 255, 255, 0.14) 31.2% 31.55%, transparent 31.85% 100%),
        linear-gradient(110deg, transparent 0 48%, color-mix(in srgb, var(--mtd-scheme-accent) 34%, rgba(255, 255, 255, 0.18)) 48.25% 48.68%, transparent 49% 100%),
        linear-gradient(110deg, transparent 0 64%, rgba(255, 255, 255, 0.16) 64.15% 64.55%, transparent 64.88% 100%),
        linear-gradient(110deg, transparent 0 79%, rgba(255, 255, 255, 0.2) 79.15% 79.5%, transparent 79.8% 100%),
        repeating-linear-gradient(90deg, rgba(255, 255, 255, 0.13) 0 1px, transparent 1px 64px),
        repeating-linear-gradient(180deg, rgba(255, 255, 255, 0.08) 0 1px, transparent 1px 64px);
    opacity: 0.9;
}

#wrapper.mtd-login-background .mtd-reset-visual::after {
    content: "";
    position: absolute;
    inset: -36% -28%;
    background:
        linear-gradient(110deg, transparent 0 44%, rgba(255, 255, 255, 0) 44.15%, rgba(255, 255, 255, 0.66) 44.48%, rgba(255, 255, 255, 0.12) 45.25%, transparent 46.05% 100%) -280px -560px / 360px 620px no-repeat,
        linear-gradient(110deg, transparent 0 52%, color-mix(in srgb, var(--mtd-scheme-accent) 44%, rgba(255, 255, 255, 0.35)) 52.32%, rgba(255, 255, 255, 0.08) 53.15%, transparent 54% 100%) 80px -500px / 420px 680px no-repeat,
        linear-gradient(110deg, transparent 0 38%, rgba(255, 255, 255, 0.48) 38.35%, rgba(255, 255, 255, 0.08) 38.9%, transparent 39.55% 100%) 360px -640px / 300px 620px no-repeat,
        linear-gradient(110deg, transparent 0 58%, rgba(255, 255, 255, 0.36) 58.3%, transparent 59.1% 100%) 520px -460px / 320px 580px no-repeat;
    border: 0;
    opacity: 0.58;
    pointer-events: none;
    mix-blend-mode: screen;
    animation: mtd-auth-bar-rain 4.8s linear infinite;
}

/* Register polish: even card rhythm, phone country picker, password generator modal */
#wrapper.mtd-register-screen .mtd-register-page-container {
    width: min(1560px, 100%) !important;
}

#wrapper.mtd-register-screen .mtd-register-shell {
    grid-template-columns: minmax(430px, 0.58fr) minmax(760px, 1fr) !important;
    width: 100% !important;
    max-width: 1560px;
}

#wrapper.mtd-register-screen .mtd-register-visual {
    min-height: 650px !important;
    padding: clamp(36px, 3.2vw, 54px) !important;
}

#wrapper.mtd-register-screen .mtd-register-form-panel {
    padding: clamp(30px, 3.4vw, 56px) clamp(34px, 3.8vw, 64px) !important;
}

#wrapper.mtd-register-screen .mtd-register-visual h2 {
    max-width: 460px;
    font-size: clamp(2.25rem, 3.4vw, 4.15rem);
}

#wrapper.mtd-register-screen .mtd-register-visual-copy p,
#wrapper.mtd-register-screen .mtd-register-story p {
    max-width: 430px;
}

#wrapper.mtd-register-screen #registration {
    --mtd-register-section-gap: 24px;
    --mtd-register-card-padding: clamp(20px, 2vw, 26px);
    --mtd-register-field-gap: 18px;
}

#wrapper.mtd-register-screen #registration h4 {
    margin: var(--mtd-register-section-gap) 0 12px !important;
}

#wrapper.mtd-register-screen #registration h4:first-of-type {
    margin-top: 0 !important;
}

#wrapper.mtd-register-screen #registration .MTD-card {
    padding: var(--mtd-register-card-padding) !important;
}

#wrapper.mtd-register-screen #registration .MTD-card .row {
    margin-right: -10px !important;
    margin-left: -10px !important;
    row-gap: var(--mtd-register-field-gap);
}

#wrapper.mtd-register-screen #registration .MTD-card .row > [class*="col-"] {
    padding-right: 10px !important;
    padding-left: 10px !important;
}

#wrapper.mtd-register-screen #registration .MTD-card .form-group,
#wrapper.mtd-register-screen #registration .MTD-card .prepend-icon {
    margin-bottom: 0 !important;
}

#wrapper.mtd-register-screen #registration .MTD-card p:last-child {
    margin-bottom: 0;
}

#wrapper.mtd-register-screen #registration .mtd-register-captcha {
    margin-top: var(--mtd-register-section-gap) !important;
    margin-bottom: 0 !important;
}

#wrapper.mtd-register-screen #registration .form-actions {
    margin-top: var(--mtd-register-section-gap) !important;
}

#wrapper.mtd-register-screen #registration .mtd-register-phone-field .intl-tel-input .selected-flag,
#wrapper.mtd-register-screen #registration .mtd-register-phone-field .iti__selected-flag {
    display: flex !important;
    width: 100% !important;
    align-items: center !important;
    gap: 10px;
    box-sizing: border-box;
}

#wrapper.mtd-register-screen #registration .mtd-register-phone-field .selected-flag .iti-flag,
#wrapper.mtd-register-screen #registration .mtd-register-phone-field .iti__selected-flag .iti__flag {
    flex: 0 0 auto;
    margin-right: 0 !important;
}

#wrapper.mtd-register-screen #registration .mtd-register-phone-field .selected-dial-code,
#wrapper.mtd-register-screen #registration .mtd-register-phone-field .iti__selected-dial-code {
    color: var(--mtd-scheme-primary);
    font-weight: 800;
    letter-spacing: 0;
}

#wrapper.mtd-register-screen #registration .mtd-register-phone-field .iti-arrow,
#wrapper.mtd-register-screen #registration .mtd-register-phone-field .iti__arrow {
    margin-left: auto !important;
}

#wrapper.mtd-register-screen #registration .mtd-register-phone-field .intl-tel-input .flag-container,
#wrapper.mtd-register-screen #registration .mtd-register-phone-field .iti__flag-container {
    right: auto !important;
    left: 0 !important;
    width: 126px !important;
    max-width: 126px !important;
    overflow: visible !important;
}

#wrapper.mtd-register-screen #registration .mtd-register-phone-field .country-list,
#wrapper.mtd-register-screen #registration .mtd-register-phone-field .iti__country-list {
    width: min(460px, calc(100vw - 40px)) !important;
    min-width: 100% !important;
    max-width: min(460px, calc(100vw - 40px)) !important;
    max-height: min(330px, 52vh) !important;
    overflow-y: auto !important;
    padding: 8px !important;
    border: 1px solid #dbe7f5 !important;
    border-radius: 8px !important;
    background: #ffffff !important;
    box-shadow: 0 24px 50px rgba(15, 23, 42, 0.16) !important;
}

#wrapper.mtd-register-screen #registration .mtd-register-phone-field .country-list .country,
#wrapper.mtd-register-screen #registration .mtd-register-phone-field .iti__country {
    display: flex !important;
    min-height: 42px;
    align-items: center !important;
    gap: 10px;
    padding: 8px 10px !important;
    border-radius: 8px;
    color: #111827;
    font-size: 0.96rem;
    font-weight: 650;
    line-height: 1.25;
    white-space: normal;
}

#wrapper.mtd-register-screen #registration .mtd-register-phone-field .country-list .country:hover,
#wrapper.mtd-register-screen #registration .mtd-register-phone-field .country-list .country.highlight,
#wrapper.mtd-register-screen #registration .mtd-register-phone-field .iti__country:hover,
#wrapper.mtd-register-screen #registration .mtd-register-phone-field .iti__country.iti__highlight {
    background: var(--mtd-scheme-primary-soft) !important;
    color: #0f172a;
}

#wrapper.mtd-register-screen #registration .mtd-register-phone-field .country-list .flag-box,
#wrapper.mtd-register-screen #registration .mtd-register-phone-field .iti__flag-box {
    display: inline-flex !important;
    width: 26px !important;
    min-width: 26px !important;
    justify-content: center;
    margin-right: 0 !important;
}

#wrapper.mtd-register-screen #registration .mtd-register-phone-field .country-list .country-name,
#wrapper.mtd-register-screen #registration .mtd-register-phone-field .iti__country-name {
    margin-right: 10px !important;
    color: inherit;
}

#wrapper.mtd-register-screen #registration .mtd-register-phone-field .country-list .dial-code,
#wrapper.mtd-register-screen #registration .mtd-register-phone-field .iti__dial-code {
    margin-left: auto !important;
    color: #64748b;
    font-weight: 800;
}


/* Global auth-style surface for the rest of the WHMCS templates */
body:not(.login) {
    background:
        linear-gradient(90deg, color-mix(in srgb, var(--mtd-scheme-primary) 7.5%, transparent) 0 1px, transparent 1px 100%),
        linear-gradient(180deg, rgba(17, 24, 39, 0.045) 0 1px, transparent 1px 100%);
    background-color: var(--mtd-scheme-primary-surface);
    background-size: 72px 72px;
}

body:not(.login) .mtd-site-shell {
    min-height: 100vh;
    background:
        linear-gradient(118deg, color-mix(in srgb, var(--mtd-scheme-primary) 8%, transparent) 0 15%, transparent 15% 64%, color-mix(in srgb, var(--mtd-scheme-accent) 8%, transparent) 64% 100%),
        linear-gradient(180deg, rgba(248, 250, 252, 0.92), rgba(239, 246, 255, 0.92));
}

body:not(.login) .mtd-main-body {
    padding: clamp(22px, 3vw, 46px) 0;
}

body:not(.login) .mtd-page-container {
    width: min(1500px, calc(100% - 28px));
    max-width: none;
}

body:not(.login) .mtd-page-container-fluid {
    width: min(1640px, calc(100% - 28px));
}

body:not(.login) .mtd-global-content-shell {
    position: relative;
    overflow: visible;
    padding: clamp(22px, 2.6vw, 38px);
    color: #111827;
}

body:not(.login) .mtd-global-content-shell-fluid,
body:not(.login) .mtd-global-content-shell-cart {
    padding: clamp(18px, 2vw, 30px);
}

body:not(.login) .mtd-page-heading {
    margin: 0 0 26px;
}

body:not(.login) .header-lined.mtd-global-page-header {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 18px;
    align-items: center;
    padding: 0 0 24px;
    margin: 0;
    border-bottom: 1px solid #dbe7f5;
}

body:not(.login) .mtd-global-page-heading-main {
    display: grid;
    grid-template-columns: 56px minmax(0, 1fr);
    gap: 16px;
    align-items: center;
    min-width: 0;
}

body:not(.login) .mtd-global-page-icon {
    display: inline-flex;
    width: 56px;
    height: 56px;
    align-items: center;
    justify-content: center;
    color: #ffffff;
    background: var(--mtd-scheme-primary);
    border-radius: 8px;
    box-shadow: 0 16px 32px color-mix(in srgb, var(--mtd-scheme-primary) 24%, transparent);
}

body:not(.login) .mtd-global-page-icon i {
    font-size: 1.25rem;
}

body:not(.login) .mtd-global-page-copy {
    min-width: 0;
}

body:not(.login) .header-lined.mtd-global-page-header h1 {
    margin: 0;
    color: #0f172a;
    font-size: clamp(1.6rem, 2.2vw, 2.45rem);
    font-weight: 950;
    line-height: 1.05;
    letter-spacing: 0;
}

body:not(.login) .mtd-global-page-meta {
    display: grid;
    gap: 8px;
    justify-items: end;
    min-width: 240px;
    color: #64748b;
    text-align: right;
}

body:not(.login) .mtd-global-page-description {
    max-width: 460px;
    color: #64748b;
    font-size: 0.98rem;
    line-height: 1.45;
}

body:not(.login) .mtd-page-tools {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 14px;
}

body:not(.login) .mtd-page-tools .search-group {
    min-width: min(320px, 100%);
}

body:not(.login) .mtd-page-breadcrumb-bar {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    width: 100%;
    margin: 0 0 14px;
    padding: 0 clamp(22px, 2.6vw, 38px);
    position: relative;
    z-index: 3;
}

body:not(.login) .mtd-page-breadcrumb-bar .mtd-breadcrumb {
    width: auto;
    max-width: min(720px, 100%);
    justify-content: flex-end;
}

body:not(.login) .mtd-page-breadcrumb-bar .mtd-breadcrumb-list {
    justify-content: flex-end;
}

body:not(.login) .breadcrumb {
    justify-content: flex-end;
    padding: 0;
    margin: 0;
    color: #64748b;
    background: transparent;
}

body:not(.login) .breadcrumb a {
    color: var(--mtd-scheme-primary);
    font-weight: 750;
}

body:not(.login) .mtd-breadcrumb {
    max-width: min(560px, 100%);
}

body:not(.login) .mtd-breadcrumb-list {
    display: inline-flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 8px;
    padding: 6px;
    margin: 0;
    background: #f8fafc;
    border: 1px solid #dbe7f5;
    border-radius: 8px;
}

body:not(.login) .mtd-breadcrumb-item {
    display: inline-flex;
    min-width: 0;
    align-items: center;
    padding: 0;
    color: #64748b;
    font-size: 0.88rem;
    font-weight: 850;
    line-height: 1;
}

body:not(.login) .mtd-breadcrumb-item + .mtd-breadcrumb-item::before {
    display: inline-block;
    width: 8px;
    height: 8px;
    padding: 0;
    margin: 0 4px;
    border-top: 2px solid #94a3b8;
    border-right: 2px solid #94a3b8;
    content: "";
    transform: rotate(45deg);
}

body:not(.login) .mtd-breadcrumb-link,
body:not(.login) .mtd-breadcrumb-current {
    display: inline-flex;
    min-width: 0;
    min-height: 32px;
    align-items: center;
    gap: 8px;
    padding: 0 10px;
    color: #334155;
    background: #ffffff;
    border: 1px solid transparent;
    border-radius: 8px;
    text-decoration: none;
    transition: color 0.18s ease, background-color 0.18s ease, border-color 0.18s ease;
}

body:not(.login) .mtd-breadcrumb-link:hover,
body:not(.login) .mtd-breadcrumb-link:focus {
    color: var(--mtd-scheme-primary);
    background: var(--mtd-scheme-primary-soft);
    border-color: var(--mtd-scheme-primary-border);
}

body:not(.login) .mtd-breadcrumb-current {
    color: var(--secondary-accented);
    background: var(--mtd-scheme-primary);
    border-color: var(--mtd-scheme-primary);
    box-shadow: 0 10px 22px color-mix(in srgb, var(--mtd-scheme-primary) 18%, transparent);
}

span.mtd-breadcrumb-current span.mtd-breadcrumb-label {
    color: #fff;
}

body:not(.login) .mtd-breadcrumb-icon {
    display: inline-flex;
    width: 18px;
    height: 18px;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    font-size: 0.78rem;
}

body:not(.login) .mtd-breadcrumb-label {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

body:not(.login) .mtd-content-grid {
    display: grid;
    gap: 24px;
}

body:not(.login) .mtd-content-grid.mtd-has-sidebar {
    grid-template-columns: minmax(260px, 0.3fr) minmax(0, 1fr);
    align-items: start;
}

body:not(.login) .mtd-primary-content {
    min-width: 0;
}

body:not(.login) .mtd-primary-content > *:last-child {
    margin-bottom: 0;
}

body:not(.login) .mtd-sidebar-region {
    display: grid;
    gap: 16px;
    align-content: start;
}

body:not(.login) .mtd-sidebar-card,
body:not(.login) .mtd-global-content-shell .card,
body:not(.login) .mtd-global-content-shell .panel,
body:not(.login) .mtd-global-content-shell .mtd-global-card,
body:not(.login) .mtd-global-content-shell .mtd-dashboard-stat-card,
body:not(.login) .mtd-global-content-shell .list-group-item,
body:not(.login) .mtd-global-content-shell .tile,
body:not(.login) .mtd-global-content-shell .domain-promo-box,
body:not(.login) .mtd-global-content-shell .product-status,
body:not(.login) .mtd-global-content-shell .invoice-container,
body:not(.login) .mtd-global-content-shell .invoice-summary {
    background: #ffffff;
    border: 1px solid #dbe7f5;
    border-radius: 8px;
    box-shadow: 0 14px 34px rgba(15, 23, 42, 0.06);
}

body:not(.login) .mtd-global-content-shell .card,
body:not(.login) .mtd-global-content-shell .panel,
body:not(.login) .mtd-global-content-shell .mtd-global-card {
    overflow: hidden;
}

body:not(.login) .mtd-global-content-shell .panel {
    margin-bottom: 22px;
}

body:not(.login) .mtd-global-content-shell .panel-heading,
body:not(.login) .mtd-global-content-shell .card-header,
body:not(.login) .mtd-global-card-title,
body:not(.login) .mtd-sidebar-card-header {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 54px;
    padding: 14px 18px;
    color: #0f172a;
    background: linear-gradient(180deg, #f8fbff, var(--mtd-scheme-primary-surface));
    border-bottom: 1px solid #dbe7f5;
    font-weight: 900;
}

body:not(.login) .mtd-global-content-shell .panel-title,
body:not(.login) .mtd-global-content-shell .card-title {
    margin: 0;
    color: inherit;
    font-size: 1rem;
    font-weight: 900;
    line-height: 1.25;
}

body:not(.login) .mtd-global-content-shell .panel-title i,
body:not(.login) .mtd-sidebar-card-icon,
body:not(.login) .mtd-sidebar-link-icon {
    display: inline-flex;
    width: 34px;
    height: 34px;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    color: #ffffff!important;
    background: var(--mtd-scheme-primary);
    border-radius: 8px;
}

body:not(.login) .mtd-global-content-shell .panel-body,
body:not(.login) .mtd-global-content-shell .card-body,
body:not(.login) .mtd-global-card-body,
body:not(.login) .mtd-sidebar-body,
body:not(.login) .mtd-sidebar-footer {
    padding: 18px;
}

body:not(.login) .mtd-dashboard-stats {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
    margin-bottom: 24px;
}

body:not(.login) .mtd-dashboard-stat-card {
    display: flex;
    min-height: 112px;
    align-items: center;
    gap: 14px;
    padding: 18px;
    color: #111827;
    text-decoration: none;
    transition: border-color 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease;
}

body:not(.login) .mtd-dashboard-stat-card:hover {
    border-color: var(--mtd-scheme-primary);
    box-shadow: 0 20px 44px color-mix(in srgb, var(--mtd-scheme-primary) 14%, transparent);
    transform: translateY(-1px);
}

body:not(.login) .mtd-dashboard-stat-icon {
    display: inline-flex;
    width: 52px;
    height: 52px;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    color: #ffffff;
    background: var(--mtd-scheme-primary);
    border-radius: 8px;
}

body:not(.login) .mtd-dashboard-stat-value {
    display: block;
    color: #0f172a;
    font-size: 1.65rem;
    font-weight: 950;
    line-height: 1;
}

body:not(.login) .mtd-dashboard-stat-label {
    display: block;
    margin-top: 5px;
    color: #64748b;
    font-weight: 800;
}

body:not(.login) .mtd-global-content-shell .alert {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 16px 18px;
    border-width: 1px;
    border-radius: 8px;
    box-shadow: 0 10px 26px rgba(15, 23, 42, 0.05);
}

body:not(.login) .mtd-global-content-shell .alert-icon,
body:not(.login) .mtd-global-content-shell .alert .icon {
    display: inline-flex;
    width: 34px;
    height: 34px;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
}

body:not(.login) .mtd-global-content-shell .alert-info,
body:not(.login) .mtd-global-content-shell .alert-success {
    color: #164e63;
    background: #eff9ff;
    border-color: #bae6fd;
}

body:not(.login) .mtd-global-content-shell .alert-warning {
    color: #7c3f00;
    background: #fffbeb;
    border-color: #fde68a;
}

body:not(.login) .mtd-global-content-shell .alert-danger {
    color: #7f1d1d;
    background: #fff1f2;
    border-color: #fecdd3;
}

body:not(.login) .mtd-global-content-shell .form-control,
body:not(.login) .mtd-global-content-shell .custom-select,
body:not(.login) .mtd-global-content-shell select,
body:not(.login) .mtd-global-content-shell textarea,
body:not(.login) .mtd-global-content-shell input[type="text"],
body:not(.login) .mtd-global-content-shell input[type="email"],
body:not(.login) .mtd-global-content-shell input[type="password"],
body:not(.login) .mtd-global-content-shell input[type="number"],
body:not(.login) .mtd-global-content-shell input[type="tel"] {
    min-height: 46px;
    color: #1f2937;
    background-color: #ffffff;
    border: 1px solid #cfdbec;
    border-radius: 8px;
    box-shadow: none;
    font-weight: 650;
}

body:not(.login) .mtd-global-content-shell textarea {
    min-height: 120px;
}

body:not(.login) .mtd-global-content-shell .form-control:focus,
body:not(.login) .mtd-global-content-shell .custom-select:focus,
body:not(.login) .mtd-global-content-shell select:focus,
body:not(.login) .mtd-global-content-shell textarea:focus,
body:not(.login) .mtd-global-content-shell input:focus {
    border-color: var(--mtd-scheme-primary);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--mtd-scheme-primary) 14%, transparent);
}

body:not(.login) .mtd-global-content-shell label,
body:not(.login) .mtd-global-content-shell .control-label {
    color: #111827;
    font-weight: 850;
}

body:not(.login) .mtd-global-content-shell .btn {
    min-height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border-radius: 8px;
    font-weight: 900;
    letter-spacing: 0;
}

body:not(.login) .mtd-global-content-shell .btn-primary,
body:not(.login) .mtd-global-content-shell input[type="submit"].btn-primary {
    color: #ffffff;
    background: var(--mtd-scheme-primary);
    border-color: var(--mtd-scheme-primary);
    box-shadow: 0 12px 26px color-mix(in srgb, var(--mtd-scheme-primary) 20%, transparent);
}

body:not(.login) .mtd-global-content-shell .btn-primary:hover {
    background: var(--mtd-scheme-primary-hover);
    border-color: var(--mtd-scheme-primary-hover);
}

body:not(.login) .mtd-global-content-shell .btn-default,
body:not(.login) .mtd-global-content-shell .btn-light,
body:not(.login) .mtd-global-content-shell .btn-secondary {
    color: #334155;
    background: #f8fafc;
    border-color: #dbe7f5;
}

body:not(.login) .mtd-global-content-shell .table,
body:not(.login) .mtd-global-content-shell table.dataTable {
    margin-bottom: 0;
    color: #1f2937;
    background: #ffffff;
    border-collapse: separate;
    border-spacing: 0;
}

body:not(.login) .mtd-global-content-shell .dataTables_wrapper,
body:not(.login) .mtd-global-content-shell .listtable {
    overflow: hidden;
    background: #ffffff;
    border: 1px solid #dbe7f5;
    border-radius: 8px;
    box-shadow: 0 14px 34px rgba(15, 23, 42, 0.06);
}

body:not(.login) .mtd-global-content-shell .table-responsive {
    overflow-x: auto;
    background: #ffffff;
    border: 1px solid #dbe7f5;
    border-radius: 8px;
    box-shadow: 0 14px 34px rgba(15, 23, 42, 0.06);
}

body:not(.login) .mtd-global-content-shell .table thead th,
body:not(.login) .mtd-global-content-shell table.dataTable thead th {
    color: #0f172a;
    background: var(--mtd-scheme-primary-surface);
    border-bottom: 1px solid #dbe7f5;
    font-weight: 900;
}

body:not(.login) .mtd-global-content-shell .table td,
body:not(.login) .mtd-global-content-shell .table th,
body:not(.login) .mtd-global-content-shell table.dataTable td,
body:not(.login) .mtd-global-content-shell table.dataTable th {
    padding: 14px 16px;
    border-top: 1px solid #edf2f7;
    vertical-align: middle;
}

body:not(.login) .mtd-global-content-shell .table tbody tr:hover,
body:not(.login) .mtd-global-content-shell table.dataTable tbody tr:hover {
    background: #f8fbff;
}

body:not(.login) .mtd-sidebar-link {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 11px 12px;
    color: #334155;
    border-radius: 8px;
    font-weight: 800;
    text-decoration: none;
}

body:not(.login) .mtd-sidebar-link:hover,
body:not(.login) .mtd-sidebar-link.active {
    color: #0f172a;
    background: var(--mtd-scheme-primary-soft);
}

body:not(.login) .mtd-sidebar-link.active .mtd-sidebar-link-icon,
body:not(.login) .mtd-sidebar-link:hover .mtd-sidebar-link-icon {
    background: var(--mtd-scheme-primary);
}

body:not(.login) .mtd-global-content-shell .nav-tabs {
    gap: 8px;
    border-bottom: 1px solid #dbe7f5;
}

body:not(.login) .mtd-global-content-shell .nav-tabs .nav-link {
    color: #64748b;
    border: 1px solid transparent;
    border-radius: 8px 8px 0 0;
    font-weight: 850;
}

body:not(.login) .mtd-global-content-shell .nav-tabs .nav-link.active,
body:not(.login) .mtd-global-content-shell .nav-tabs .nav-item.show .nav-link {
    color: var(--mtd-scheme-primary);
    background: #ffffff;
    border-color: #dbe7f5 #dbe7f5 #ffffff;
}

body:not(.login) .mtd-global-content-shell .pagination {
    gap: 6px;
}

body:not(.login) .mtd-global-content-shell .page-link {
    min-width: 40px;
    min-height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #334155;
    border-color: #dbe7f5;
    border-radius: 8px;
    font-weight: 850;
}

body:not(.login) .mtd-global-content-shell .page-item.active .page-link {
    color: #ffffff;
    background: var(--mtd-scheme-primary);
    border-color: var(--mtd-scheme-primary);
}


body:not(.login) .badge {
    border-radius: 8px;
    font-weight: 850;
}

body.dark-mode:not(.login) {
    background-color: #0f172a;
}

body.dark-mode:not(.login) .mtd-site-shell {
    background:
        linear-gradient(118deg, color-mix(in srgb, var(--mtd-scheme-primary) 12%, transparent) 0 15%, transparent 15% 64%, color-mix(in srgb, var(--mtd-scheme-accent) 10%, transparent) 64% 100%),
        linear-gradient(180deg, rgba(15, 23, 42, 0.98), rgba(17, 28, 45, 0.98));
}

body.dark-mode:not(.login) .mtd-global-content-shell,
body.dark-mode:not(.login) .mtd-sidebar-card,
body.dark-mode:not(.login) .mtd-global-content-shell .card,
body.dark-mode:not(.login) .mtd-global-content-shell .panel,
body.dark-mode:not(.login) .mtd-global-content-shell .table-responsive,
body.dark-mode:not(.login) .mtd-global-content-shell .dataTables_wrapper,
body.dark-mode:not(.login) .mtd-global-content-shell .listtable,
body.dark-mode:not(.login) .modal-content {
    color: #e5edf7;
}

body.dark-mode:not(.login) .header-lined.mtd-global-page-header,
body.dark-mode:not(.login) .mtd-global-content-shell .panel-heading,
body.dark-mode:not(.login) .mtd-global-content-shell .card-header,
body.dark-mode:not(.login) .mtd-sidebar-card-header,
body.dark-mode:not(.login) .modal-header,
body.dark-mode:not(.login) .modal-footer {
    border-color: #2c3b52;
}

body.dark-mode:not(.login) .header-lined.mtd-global-page-header h1,
body.dark-mode:not(.login) .mtd-global-content-shell .panel-title,
body.dark-mode:not(.login) .mtd-global-content-shell .card-title,
body.dark-mode:not(.login) .mtd-global-content-shell label,
body.dark-mode:not(.login) .mtd-global-content-shell .control-label {
    color: #f8fafc;
}


body.dark-mode:not(.login) .mtd-global-page-description,
body.dark-mode:not(.login) .mtd-global-page-meta,
body.dark-mode:not(.login) .mtd-dashboard-stat-label,
body.dark-mode:not(.login) .mtd-sidebar-link {
    color: #9fb0c6;
}

body.dark-mode:not(.login) .mtd-breadcrumb-list {
    background: #17243a;
    border-color: #2c3b52;
}

body.dark-mode:not(.login) .mtd-breadcrumb-item + .mtd-breadcrumb-item::before {
    border-color: #64748b;
}

body.dark-mode:not(.login) .mtd-breadcrumb-link,
body.dark-mode:not(.login) .mtd-breadcrumb-current {
    color: #dce6f4;
    background: #111c2f;
}

body.dark-mode:not(.login) .mtd-breadcrumb-link:hover,
body.dark-mode:not(.login) .mtd-breadcrumb-link:focus {
    color: #ffffff;
    background: color-mix(in srgb, var(--mtd-scheme-primary) 20%, transparent);
    border-color: color-mix(in srgb, var(--mtd-scheme-primary) 40%, transparent);
}

body.dark-mode:not(.login) .mtd-breadcrumb-current {
    color: #ffffff;
    background: var(--mtd-scheme-primary);
    border-color: var(--mtd-scheme-primary);
}

body.dark-mode:not(.login) .mtd-global-content-shell .form-control,
body.dark-mode:not(.login) .mtd-global-content-shell .custom-select,
body.dark-mode:not(.login) .mtd-global-content-shell select,
body.dark-mode:not(.login) .mtd-global-content-shell textarea,
body.dark-mode:not(.login) .mtd-global-content-shell input[type="text"],
body.dark-mode:not(.login) .mtd-global-content-shell input[type="email"],
body.dark-mode:not(.login) .mtd-global-content-shell input[type="password"],
body.dark-mode:not(.login) .mtd-global-content-shell input[type="number"],
body.dark-mode:not(.login) .mtd-global-content-shell input[type="tel"] {
    color: #e5edf7;
    background: #0f172a;
    border-color: #2c3b52;
}

@media (max-width: 1199.98px) {
    body:not(.login) .mtd-content-grid.mtd-has-sidebar {
        grid-template-columns: minmax(0, 1fr);
    }

    body:not(.login) .mtd-sidebar-region {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    body:not(.login) .mtd-dashboard-stats {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 767.98px) {
    body:not(.login) .mtd-main-body {
        padding: 16px 0;
    }

    body:not(.login) .mtd-page-container,
    body:not(.login) .mtd-page-container-fluid {
        width: calc(100% - 16px);
    }

    body:not(.login) .mtd-global-content-shell {
        padding: 16px;
    }

    body:not(.login) .header-lined.mtd-global-page-header {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    body:not(.login) .mtd-global-page-heading-main {
        grid-template-columns: 46px minmax(0, 1fr);
        gap: 12px;
    }

    body:not(.login) .mtd-global-page-icon {
        width: 46px;
        height: 46px;
    }

    body:not(.login) .mtd-global-page-meta {
        min-width: 0;
        justify-items: start;
        align-items: start;
        text-align: left;
    }

    body:not(.login) .breadcrumb {
        justify-content: flex-start;
    }

    body:not(.login) .mtd-page-breadcrumb-bar {
        justify-content: flex-start;
        margin-bottom: 12px;
        overflow-x: auto;
        padding: 0 0 2px;
    }

    body:not(.login) .mtd-page-breadcrumb-bar .mtd-breadcrumb {
        width: 100%;
        max-width: 100%;
        justify-content: flex-start;
    }

    body:not(.login) .mtd-page-breadcrumb-bar .mtd-breadcrumb-list {
        flex-wrap: nowrap;
        justify-content: flex-start;
        width: max-content;
        min-width: 0;
        max-width: none;
    }

    body:not(.login) .mtd-breadcrumb {
        max-width: 100%;
        width: 100%;
        justify-content: flex-start;
        justify-self: start;
    }

    body:not(.login) .mtd-breadcrumb-list {
        display: flex;
        justify-content: flex-start;
        margin-right: auto;
    }

    body:not(.login) .mtd-breadcrumb-link,
    body:not(.login) .mtd-breadcrumb-current {
        max-width: min(100%, 280px);
    }

    body:not(.login) .mtd-sidebar-region,
    body:not(.login) .mtd-dashboard-stats {
        grid-template-columns: 1fr;
    }

    body:not(.login) .mtd-global-content-shell .table td,
    body:not(.login) .mtd-global-content-shell .table th,
    body:not(.login) .mtd-global-content-shell table.dataTable td,
    body:not(.login) .mtd-global-content-shell table.dataTable th {
        padding: 12px;
    }
}

/* Cart promo code icon alignment */
body:not(.login) #order-standard_cart #applyPromo .prepend-icon,
body:not(.login) .mtd-global-content-shell #applyPromo .prepend-icon {
    position: relative;
}

body:not(.login) #order-standard_cart #applyPromo .prepend-icon .field-icon,
body:not(.login) .mtd-global-content-shell #applyPromo .prepend-icon .field-icon {
    position: absolute;
    top: 50%;
    left: 16px;
    z-index: 2;
    display: inline-flex;
    width: 36px;
    height: 36px;
    align-items: center;
    justify-content: center;
    margin: 0;
    color: #94a3b8;
    line-height: 1;
    pointer-events: none;
    transform: translateY(-50%);
}

body:not(.login) #order-standard_cart #applyPromo .prepend-icon .field-icon i,
body:not(.login) .mtd-global-content-shell #applyPromo .prepend-icon .field-icon i {
    display: block;
    line-height: 1;
}

body:not(.login) #order-standard_cart #inputPromotionCode.field.form-control,
body:not(.login) .mtd-global-content-shell #inputPromotionCode.field.form-control {
    min-height: 64px;
    padding-left: 74px;
}

/* Modern domain engine */
body:not(.login) #order-standard_cart .mtd-domain-engine {
    position: relative;
    display: grid;
    gap: 24px;
    max-width: 980px;
    margin: 26px auto 0;
}

body:not(.login) #order-standard_cart .mtd-domain-engine::before {
    content: "";
    position: absolute;
    inset: -30px -36px auto auto;
    width: 220px;
    height: 220px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--mtd-scheme-primary) 14%, transparent);
    pointer-events: none;
}

body:not(.login) #order-standard_cart .mtd-domain-engine-copy {
    position: relative;
    display: grid;
    gap: 10px;
    text-align: left;
}

body:not(.login) #order-standard_cart .mtd-domain-engine-kicker {
    width: fit-content;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 38px;
    padding: 8px 12px;
    border: 1px solid color-mix(in srgb, var(--mtd-scheme-primary) 22%, #dbe7f5);
    border-radius: 999px;
    color: var(--mtd-scheme-primary);
    background: color-mix(in srgb, var(--mtd-scheme-primary) 9%, #ffffff);
    font-size: 0.78rem;
    font-weight: 900;
    text-transform: uppercase;
}

body:not(.login) #order-standard_cart .mtd-domain-engine-copy h2 {
    margin: 0;
    color: #0f172a;
    font-size: clamp(2rem, 4vw, 3.7rem);
    line-height: 1.04;
    letter-spacing: 0;
    font-weight: 900;
}

body:not(.login) #order-standard_cart .mtd-domain-engine-copy p {
    margin: 0;
    color: #64748b;
    font-size: 1.05rem;
}

body:not(.login) #order-standard_cart .mtd-domain-engine-steps {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 6px;
}

body:not(.login) #order-standard_cart .mtd-domain-engine-steps span,
body:not(.login) #order-standard_cart .mtd-domain-engine-trust span {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 38px;
    padding: 8px 12px;
    border-radius: 8px;
    background: #f8fafc;
    border: 1px solid #dbe7f5;
    color: #334155;
    font-weight: 800;
}

body:not(.login) #order-standard_cart .mtd-domain-engine-steps i,
body:not(.login) #order-standard_cart .mtd-domain-engine-trust i {
    color: var(--mtd-scheme-primary);
}

body:not(.login) #order-standard_cart .mtd-domain-engine-card {
    position: relative;
    overflow: hidden;
    border: 1px solid color-mix(in srgb, var(--mtd-scheme-primary) 20%, #dbe7f5);
    border-radius: 8px;
    background:
        radial-gradient(circle at 94% 0%, color-mix(in srgb, var(--mtd-scheme-primary) 14%, transparent), transparent 28%),
        linear-gradient(135deg, #ffffff 0%, color-mix(in srgb, var(--mtd-scheme-primary) 5%, #ffffff) 100%);
    box-shadow: 0 24px 70px rgba(15, 23, 42, 0.12);
}

body:not(.login) #order-standard_cart .mtd-domain-engine-card-head {
    display: grid;
    grid-template-columns: auto 1fr auto;
    gap: 16px;
    align-items: center;
    padding: 24px;
    border-bottom: 1px solid #dbe7f5;
    background: linear-gradient(135deg, color-mix(in srgb, var(--mtd-scheme-primary) 10%, #ffffff), #ffffff);
}

body:not(.login) #order-standard_cart .mtd-domain-engine-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 58px;
    height: 58px;
    border-radius: 8px;
    color: #ffffff;
    background: linear-gradient(135deg, var(--mtd-scheme-primary), color-mix(in srgb, var(--mtd-scheme-primary) 70%, #0f172a));
    box-shadow: 0 18px 30px color-mix(in srgb, var(--mtd-scheme-primary) 30%, transparent);
}

body:not(.login) #order-standard_cart .mtd-domain-engine-card-head h3 {
    margin: 0;
    color: #0f172a;
    font-size: 1.45rem;
    font-weight: 900;
}

body:not(.login) #order-standard_cart .mtd-domain-engine-card-head p {
    margin: 4px 0 0;
    color: #64748b;
}

body:not(.login) #order-standard_cart .mtd-domain-engine-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 34px;
    padding: 7px 12px;
    border-radius: 999px;
    color: var(--mtd-scheme-primary);
    background: color-mix(in srgb, var(--mtd-scheme-primary) 12%, #ffffff);
    border: 1px solid color-mix(in srgb, var(--mtd-scheme-primary) 22%, #dbe7f5);
    font-weight: 900;
}

body:not(.login) #order-standard_cart .mtd-domain-engine-fields {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(280px, 0.85fr);
    gap: 16px;
    padding: 24px;
}

body:not(.login) #order-standard_cart .mtd-domain-engine-fields-single {
    grid-template-columns: 1fr;
}

body:not(.login) #order-standard_cart .mtd-domain-engine-field {
    display: grid;
    gap: 8px;
}

body:not(.login) #order-standard_cart .mtd-domain-engine-field label {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin: 0;
    color: #0f172a;
    font-weight: 900;
}

body:not(.login) #order-standard_cart .mtd-domain-engine-field label a {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--mtd-scheme-primary);
    font-size: 0.84rem;
    font-weight: 800;
    text-decoration: none;
}

body:not(.login) #order-standard_cart .mtd-domain-engine-input {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto auto;
    align-items: center;
    min-height: 64px;
    border: 1px solid #dbe7f5;
    border-radius: 8px;
    background: #ffffff;
    transition: border-color 180ms ease, box-shadow 180ms ease, transform 180ms ease;
}

body:not(.login) #order-standard_cart .mtd-domain-engine-input:focus-within {
    border-color: color-mix(in srgb, var(--mtd-scheme-primary) 48%, #dbe7f5);
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--mtd-scheme-primary) 13%, transparent);
}

body:not(.login) #order-standard_cart .mtd-domain-engine-prefix {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 58px;
    height: 100%;
    padding: 0 14px;
    color: #64748b;
    border-right: 1px solid #dbe7f5;
    font-weight: 900;
}

body:not(.login) #order-standard_cart .mtd-domain-engine-input > i {
    padding: 0 18px;
    color: #94a3b8;
}

body:not(.login) #order-standard_cart .mtd-domain-engine-input .form-control {
    width: 100%;
    min-height: 62px;
    padding: 0 14px;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    color: #0f172a;
    font-size: 1rem;
    font-weight: 800;
}

body:not(.login) #order-standard_cart .mtd-domain-engine-input .form-control::placeholder {
    color: #94a3b8;
    font-weight: 800;
}

body:not(.login) #order-standard_cart .mtd-domain-engine-captcha,
body:not(.login) #order-standard_cart .mtd-domain-engine #transferUnavailable {
    margin: 0 24px 20px;
}

body:not(.login) #order-standard_cart .mtd-domain-engine #transferUnavailable.w-hidden,
body:not(.login) #order-standard_cart .mtd-domain-engine #transferUnavailable:empty {
    display: none !important;
}

body:not(.login) #order-standard_cart .mtd-domain-engine-captcha {
    padding: 16px;
    border: 1px solid #dbe7f5;
    border-radius: 8px;
    background: #ffffff;
}

body:not(.login) #order-standard_cart .mtd-domain-engine-captcha .default-captcha {
    display: grid;
    justify-items: center;
    gap: 10px;
    margin: 0 auto;
}

body:not(.login) #order-standard_cart .mtd-domain-engine-captcha .default-captcha p {
    margin: 0;
    color: #64748b;
    font-weight: 800;
}

body:not(.login) #order-standard_cart .mtd-domain-engine-captcha .default-captcha > div {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
}

body:not(.login) #order-standard_cart .mtd-domain-engine-captcha #inputCaptchaImage {
    max-height: 44px;
    border-radius: 6px;
}

body:not(.login) #order-standard_cart .mtd-domain-engine-captcha #inputCaptcha {
    width: 132px;
    min-height: 44px;
    border-radius: 8px;
}

body:not(.login) #order-standard_cart .mtd-domain-engine-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 20px 24px;
    border-top: 1px solid #dbe7f5;
    background: color-mix(in srgb, var(--mtd-scheme-primary) 5%, #f8fafc);
}

body:not(.login) #order-standard_cart .mtd-domain-engine-trust {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

body:not(.login) #order-standard_cart .mtd-domain-engine-actions #btnTransferDomain {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: 54px;
    min-width: 190px;
    padding: 0 24px;
    border: 0 !important;
    border-radius: 8px;
    color: #ffffff !important;
    background: linear-gradient(135deg, var(--mtd-scheme-primary), color-mix(in srgb, var(--mtd-scheme-primary) 75%, #0f172a)) !important;
    box-shadow: 0 16px 30px color-mix(in srgb, var(--mtd-scheme-primary) 28%, transparent);
    font-weight: 900;
    transition: transform 180ms ease, filter 180ms ease, box-shadow 180ms ease;
}

body:not(.login) #order-standard_cart .mtd-domain-engine-actions #btnTransferDomain:hover,
body:not(.login) #order-standard_cart .mtd-domain-engine-actions #btnTransferDomain:focus {
    filter: brightness(1.04);
    transform: translateY(-1px);
    box-shadow: 0 20px 38px color-mix(in srgb, var(--mtd-scheme-primary) 34%, transparent);
}

body:not(.login) #order-standard_cart .mtd-domain-engine-note {
    margin: 0;
    color: #64748b;
    text-align: center;
    font-size: 0.9rem;
    font-weight: 700;
}

body:not(.login) #order-standard_cart .mtd-domain-engine-register {
    grid-template-columns: minmax(260px, 0.82fr) minmax(0, 1.18fr);
    align-items: stretch;
    max-width: none;
    margin: 24px 0 32px;
    padding: 24px;
    border: 1px solid color-mix(in srgb, var(--mtd-scheme-primary) 16%, #dbe7f5);
    border-radius: 8px;
    background:
        radial-gradient(circle at 100% 0%, color-mix(in srgb, var(--mtd-scheme-primary) 13%, transparent), transparent 32%),
        linear-gradient(135deg, #ffffff, color-mix(in srgb, var(--mtd-scheme-primary) 4%, #ffffff));
    box-shadow: 0 28px 70px rgba(15, 23, 42, 0.08);
}

body:not(.login) #order-standard_cart .mtd-domain-engine-register .mtd-domain-engine-copy {
    align-content: center;
    min-height: 100%;
    padding: 8px 8px 8px 0;
}

body:not(.login) #order-standard_cart .mtd-domain-engine-form {
    min-width: 0;
}

body:not(.login) #order-standard_cart .mtd-domain-engine-prompt {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: stretch;
    min-height: 128px;
    border: 1px solid #dbe7f5;
    border-radius: 8px;
    background: #ffffff;
    overflow: hidden;
    transition: border-color 180ms ease, box-shadow 180ms ease;
}

body:not(.login) #order-standard_cart .mtd-domain-engine-prompt:focus-within {
    border-color: color-mix(in srgb, var(--mtd-scheme-primary) 48%, #dbe7f5);
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--mtd-scheme-primary) 13%, transparent);
}

body:not(.login) #order-standard_cart .mtd-domain-engine-prompt textarea {
    width: 100%;
    min-height: 128px;
    padding: 18px;
    border: 0 !important;
    outline: 0;
    box-shadow: none !important;
    resize: vertical;
    color: #0f172a;
    font-weight: 800;
    line-height: 1.55;
}

body:not(.login) #order-standard_cart .mtd-domain-engine-prompt textarea::placeholder {
    color: #64748b;
}

body:not(.login) #order-standard_cart .mtd-domain-engine-prompt #btnCheckAvailability,
body:not(.login) #order-standard_cart .mtd-domain-engine-input #btnCheckAvailability {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-width: 150px;
    min-height: 64px;
    margin: 0;
    border: 0 !important;
    border-radius: 0;
    color: #ffffff !important;
    background: linear-gradient(135deg, var(--mtd-scheme-primary), color-mix(in srgb, var(--mtd-scheme-primary) 72%, #0f172a)) !important;
    box-shadow: none;
    font-weight: 900;
    transition: transform 180ms ease, filter 180ms ease;
}

body:not(.login) #order-standard_cart .mtd-domain-engine-prompt #btnCheckAvailability:hover,
body:not(.login) #order-standard_cart .mtd-domain-engine-input #btnCheckAvailability:hover {
    filter: brightness(1.04);
}

body:not(.login) #order-standard_cart .mtd-domain-engine-options {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 0.95fr) minmax(180px, 0.72fr);
    gap: 12px;
    margin-top: 14px;
}

body:not(.login) #order-standard_cart .mtd-domain-engine-option,
body:not(.login) #order-standard_cart .mtd-domain-engine-check {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 10px;
    align-items: center;
    min-height: 68px;
    margin: 0;
    padding: 12px;
    border: 1px solid #dbe7f5;
    border-radius: 8px;
    background: color-mix(in srgb, var(--mtd-scheme-primary) 4%, #ffffff);
    color: #334155;
    font-weight: 800;
}

body:not(.login) #order-standard_cart .mtd-domain-engine-option > span,
body:not(.login) #order-standard_cart .mtd-domain-engine-check > span {
    flex: 0 0 100%;
    color: #64748b;
    font-size: 0.78rem;
    font-weight: 900;
    text-transform: uppercase;
}

body:not(.login) #order-standard_cart .mtd-domain-engine-options select,
body:not(.login) #order-standard_cart .mtd-domain-engine-options .btn-group,
body:not(.login) #order-standard_cart .mtd-domain-engine-options .multiselect-native-select {
    width: 100% !important;
}

body:not(.login) #order-standard_cart .mtd-domain-engine-options .multiselect,
body:not(.login) #order-standard_cart .mtd-domain-engine-options .dropdown-toggle {
    width: 100% !important;
    min-height: 34px;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    color: #0f172a !important;
    text-align: left;
    font-weight: 900;
}

body:not(.login) #order-standard_cart .mtd-domain-engine-options .dropdown-toggle .caret,
body:not(.login) #order-standard_cart .mtd-domain-engine-options .multiselect .caret {
    float: right;
    margin-top: 8px;
}

body:not(.login) #order-standard_cart .mtd-domain-engine-check input {
    width: 18px;
    height: 18px;
    margin: 0;
    accent-color: var(--mtd-scheme-primary);
}

body:not(.login) #order-standard_cart .mtd-domain-engine-check input + span,
body:not(.login) #order-standard_cart .mtd-domain-engine-check span:last-child {
    flex: 1 1 auto;
    color: #0f172a;
    font-size: 0.92rem;
    text-transform: none;
}

body:not(.login) #order-standard_cart .mtd-domain-search-results {
    margin-top: 28px;
    padding: 20px;
    border: 1px solid color-mix(in srgb, var(--mtd-scheme-primary) 16%, #dbe7f5);
    border-radius: 8px;
    background: #ffffff;
    box-shadow: 0 22px 54px rgba(15, 23, 42, 0.08);
}

body:not(.login) #order-standard_cart .mtd-domain-pricing-engine {
    margin-top: 30px;
    padding: 22px;
    border: 1px solid color-mix(in srgb, var(--mtd-scheme-primary) 15%, #dbe7f5);
    border-radius: 8px;
    background:
        linear-gradient(135deg, color-mix(in srgb, var(--mtd-scheme-primary) 6%, #ffffff), #ffffff 44%),
        #ffffff;
    box-shadow: 0 22px 60px rgba(15, 23, 42, 0.08);
}

body:not(.login) #order-standard_cart .mtd-domain-pricing-engine h4 {
    margin: 0 0 14px;
    color: #0f172a;
    font-size: 1.25rem;
    font-weight: 900;
}

body:not(.login) #order-standard_cart .mtd-domain-pricing-engine .tld-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin: 0 0 18px;
}

body:not(.login) #order-standard_cart .mtd-domain-pricing-engine .tld-filters a {
    display: inline-flex;
    align-items: center;
    min-height: 36px;
    padding: 8px 12px;
    border: 1px solid color-mix(in srgb, var(--mtd-scheme-primary) 18%, #dbe7f5);
    border-radius: 999px;
    background: #ffffff;
    color: #334155;
    font-weight: 900;
    text-decoration: none;
}

body:not(.login) #order-standard_cart .mtd-domain-pricing-engine .tld-filters a:hover,
body:not(.login) #order-standard_cart .mtd-domain-pricing-engine .tld-filters a.active {
    color: #ffffff;
    background: var(--mtd-scheme-primary);
    border-color: var(--mtd-scheme-primary);
}

body:not(.login) #order-standard_cart .mtd-domain-pricing-engine .bg-white {
    display: grid;
    gap: 8px;
    background: transparent !important;
}

body:not(.login) #order-standard_cart .mtd-domain-pricing-engine .tld-pricing-header {
    min-height: 48px;
    align-items: center;
    border: 1px solid color-mix(in srgb, var(--mtd-scheme-primary) 14%, #dbe7f5);
    border-radius: 8px;
    background: color-mix(in srgb, var(--mtd-scheme-primary) 7%, #f8fafc);
    color: #0f172a;
    font-weight: 900;
    padding: 20px;
}

body:not(.login) #order-standard_cart .mtd-domain-pricing-engine .tld-row {
    min-height: 62px;
    align-items: center;
    margin: 0;
    border: 1px solid #dbe7f5;
    border-radius: 8px;
    background: #ffffff;
    color: #334155;
    overflow: hidden;
    transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}

body:not(.login) #order-standard_cart .mtd-domain-pricing-engine .tld-row:hover {
    transform: translateY(-1px);
    border-color: color-mix(in srgb, var(--mtd-scheme-primary) 28%, #dbe7f5);
    box-shadow: 0 14px 32px rgba(15, 23, 42, 0.08);
}

body:not(.login) #order-standard_cart .mtd-domain-pricing-engine .tld-row strong {
    color: #0f172a;
    font-size: 1.05rem;
}

body:not(.login) #order-standard_cart .mtd-domain-pricing-engine .featured-tlds-container {
    margin-bottom: 20px;
}

body:not(.login) #order-standard_cart .mtd-domain-pricing-engine .featured-tld {
    min-height: 128px;
    border: 1px solid #dbe7f5;
    border-radius: 8px;
    background: #ffffff;
    box-shadow: 0 14px 32px rgba(15, 23, 42, 0.06);
}

body:not(.login) #order-standard_cart .mtd-domain-engine-addons {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
    margin-top: 22px;
}

body:not(.login) #order-standard_cart .mtd-domain-addon-card {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto auto;
    gap: 16px;
    align-items: center;
    min-height: 108px;
    padding: 18px;
    border: 1px solid color-mix(in srgb, var(--mtd-scheme-primary) 16%, #dbe7f5);
    border-radius: 8px;
    background:
        radial-gradient(circle at 100% 0%, color-mix(in srgb, var(--mtd-scheme-primary) 12%, transparent), transparent 36%),
        #ffffff;
    color: #334155;
    text-decoration: none !important;
    box-shadow: 0 18px 45px rgba(15, 23, 42, 0.07);
    transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease;
}

body:not(.login) #order-standard_cart .mtd-domain-addon-card:hover {
    transform: translateY(-2px);
    border-color: color-mix(in srgb, var(--mtd-scheme-primary) 34%, #dbe7f5);
    box-shadow: 0 24px 58px rgba(15, 23, 42, 0.11);
}

body:not(.login) #order-standard_cart .mtd-domain-addon-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 54px;
    height: 54px;
    border-radius: 8px;
    color: #ffffff;
    background: var(--mtd-scheme-primary);
}

body:not(.login) #order-standard_cart .mtd-domain-addon-card strong,
body:not(.login) #order-standard_cart .mtd-domain-addon-card small,
body:not(.login) #order-standard_cart .mtd-domain-addon-card em {
    display: block;
}

body:not(.login) #order-standard_cart .mtd-domain-addon-card strong {
    color: #0f172a;
    font-size: 1.08rem;
    font-weight: 900;
}

body:not(.login) #order-standard_cart .mtd-domain-addon-card small {
    margin-top: 4px;
    color: #64748b;
    font-weight: 700;
}

body:not(.login) #order-standard_cart .mtd-domain-addon-card em {
    color: var(--mtd-scheme-primary);
    font-style: normal;
    font-weight: 900;
    white-space: nowrap;
}

@media (max-width: 991.98px) {
    body:not(.login) #order-standard_cart .mtd-domain-engine {
        max-width: none;
    }

    body:not(.login) #order-standard_cart .mtd-domain-engine-register {
        grid-template-columns: 1fr;
        padding: 18px;
    }

    body:not(.login) #order-standard_cart .mtd-domain-engine-fields {
        grid-template-columns: 1fr;
    }

    body:not(.login) #order-standard_cart .mtd-domain-engine-actions {
        align-items: stretch;
        flex-direction: column;
    }

    body:not(.login) #order-standard_cart .mtd-domain-engine-actions #btnTransferDomain {
        width: 100%;
    }

    body:not(.login) #order-standard_cart .mtd-domain-engine-options,
    body:not(.login) #order-standard_cart .mtd-domain-engine-addons {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 575.98px) {
    body:not(.login) #order-standard_cart .mtd-domain-engine {
        gap: 18px;
        margin-top: 18px;
    }

    body:not(.login) #order-standard_cart .mtd-domain-engine-card-head,
    body:not(.login) #order-standard_cart .mtd-domain-engine-fields,
    body:not(.login) #order-standard_cart .mtd-domain-engine-actions {
        padding: 16px;
    }

    body:not(.login) #order-standard_cart .mtd-domain-engine-card-head {
        grid-template-columns: auto 1fr;
    }

    body:not(.login) #order-standard_cart .mtd-domain-engine-badge {
        grid-column: 1 / -1;
        justify-self: start;
    }

    body:not(.login) #order-standard_cart .mtd-domain-engine-copy h2 {
        font-size: 2rem;
    }

    body:not(.login) #order-standard_cart .mtd-domain-engine-input {
        min-height: 58px;
    }

    body:not(.login) #order-standard_cart .mtd-domain-engine-prefix {
        min-width: 50px;
        padding: 0 12px;
    }

    body:not(.login) #order-standard_cart .mtd-domain-engine-input .form-control {
        min-height: 56px;
        padding: 0 10px;
    }

    body:not(.login) #order-standard_cart .mtd-domain-engine-captcha,
    body:not(.login) #order-standard_cart .mtd-domain-engine #transferUnavailable {
        margin: 0 16px 16px;
    }

    body:not(.login) #order-standard_cart .mtd-domain-engine-prompt,
    body:not(.login) #order-standard_cart .mtd-domain-engine-input {
        grid-template-columns: 1fr;
    }

    body:not(.login) #order-standard_cart .mtd-domain-engine-prompt #btnCheckAvailability,
    body:not(.login) #order-standard_cart .mtd-domain-engine-input #btnCheckAvailability {
        width: 100%;
        border-radius: 0 0 8px 8px;
    }

    body:not(.login) #order-standard_cart .mtd-domain-engine-input .mtd-domain-engine-prefix {
        min-height: 44px;
        border-right: 0;
        border-bottom: 1px solid #dbe7f5;
    }

    body:not(.login) #order-standard_cart .mtd-domain-addon-card {
        grid-template-columns: auto minmax(0, 1fr);
    }

    body:not(.login) #order-standard_cart .mtd-domain-addon-card em {
        grid-column: 1 / -1;
    }
}

@media (max-width: 575.98px) {
    body:not(.login) #order-standard_cart #inputPromotionCode.field.form-control,
    body:not(.login) .mtd-global-content-shell #inputPromotionCode.field.form-control {
        padding-left: 62px;
    }

    body:not(.login) #order-standard_cart #applyPromo .prepend-icon .field-icon,
    body:not(.login) .mtd-global-content-shell #applyPromo .prepend-icon .field-icon {
        left: 12px;
    }
}

/* View ticket professional layout */
body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-subject-card {
    display: grid;
    grid-template-columns: 54px minmax(0, 1fr) auto;
    gap: 16px;
    align-items: center;
    margin: 0 0 24px;
    padding: 18px;
    background:
        linear-gradient(90deg, color-mix(in srgb, var(--mtd-scheme-primary) 6%, transparent), transparent 42%),
        linear-gradient(180deg, #ffffff, var(--mtd-scheme-primary-surface));
    border: 1px solid color-mix(in srgb, var(--mtd-scheme-primary) 16%, #dbe7f5);
    border-radius: 8px;
    box-shadow: 0 18px 42px rgba(15, 23, 42, 0.07);
}

body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-subject-icon {
    display: inline-flex;
    width: 54px;
    height: 54px;
    align-items: center;
    justify-content: center;
    color: #ffffff;
    background: var(--mtd-scheme-primary);
    border-radius: 8px;
    box-shadow: 0 14px 26px color-mix(in srgb, var(--mtd-scheme-primary) 24%, transparent);
}

body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-kicker {
    display: block;
    margin-bottom: 3px;
    color: #64748b;
    font-size: 0.78rem;
    font-weight: 900;
    letter-spacing: 0;
    text-transform: uppercase;
}

body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-subject-card h2 {
    margin: 0;
    color: #111827;
    font-weight: 900;
    line-height: 1.25;
}

body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-id {
    display: inline-flex;
    min-height: 36px;
    align-items: center;
    justify-content: center;
    padding: 0 14px;
    color: var(--mtd-scheme-primary);
    background: var(--mtd-scheme-primary-soft);
    border: 1px solid var(--mtd-scheme-primary-border);
    border-radius: 8px;
    font-weight: 900;
}

body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-thread {
    display: grid;
    gap: 18px;
    margin: 22px 0;
}

body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-message-card,
body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-reply-card {
    overflow: hidden;
    background: #ffffff;
    border: 1px solid color-mix(in srgb, var(--mtd-scheme-primary) 14%, #dbe7f5);
    border-radius: 8px;
    box-shadow: 0 18px 42px rgba(15, 23, 42, 0.07);
}

body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-message-card > .card-body,
body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-reply-card > .card-body {
    padding: 0;
}

body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-reply-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    min-height: 76px;
    padding: 14px 18px;
    background:
        linear-gradient(90deg, color-mix(in srgb, var(--mtd-scheme-primary) 7%, transparent), transparent 38%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.98), var(--mtd-scheme-primary-surface));
    border-bottom: 1px solid #e5edf6;
}

body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-message-card.is-staff .mtd-ticket-reply-header,
body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-reply.staff .mtd-ticket-reply-header {
    background:
        linear-gradient(90deg, color-mix(in srgb, var(--mtd-scheme-accent) 10%, transparent), transparent 42%),
        linear-gradient(180deg, #ffffff, color-mix(in srgb, var(--mtd-scheme-accent) 5%, #ffffff));
}

body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-reply-user {
    display: flex;
    min-width: 0;
    align-items: center;
}

body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-reply-user .user-avatar {
    display: inline-flex;
    width: 46px;
    height: 46px;
    min-width: 46px;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    background: #ffffff;
    border: 1px solid #dbe7f5;
    border-radius: 50%;
}

body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-reply-user .user-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-reply-user .name,
body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-reply-user .posted-by-name,
body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-reply-user .date {
    display: block;
    min-width: 0;
}

body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-reply-user .posted-by-name {
    color: #111827;
    font-size: 0.96rem;
    font-weight: 900;
    line-height: 1.25;
}

body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-reply-user .date {
    margin-top: 2px;
    color: #64748b;
    font-size: 0.84rem;
    font-weight: 700;
}

body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-reply-badges {
    display: inline-flex;
    flex-wrap: wrap;
    gap: 8px;
    justify-content: flex-end;
}

body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-reply-badges .label,
body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-reply-badges .badge {
    display: inline-flex;
    min-height: 26px;
    align-items: center;
    padding: 0 10px;
    border-radius: 999px;
    font-size: 0.74rem;
    font-weight: 900;
}

body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-message-body {
    padding: 20px !important;
    color: #334155;
    font-size: 0.98rem;
    line-height: 1.75;
    background:
        radial-gradient(circle at 18px 18px, color-mix(in srgb, var(--mtd-scheme-primary) 8%, transparent) 0 1px, transparent 1px 100%),
        linear-gradient(180deg, #fbfdff, #ffffff);
    background-size: 22px 22px, auto;
}

body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-message-surface {
    width: 100%;
    margin: 0;
    padding: 24px;
    color: #334155;
    background: #ffffff;
    border: 1px solid #dbe7f5;
    border-radius: 8px;
    box-shadow: 0 14px 30px rgba(15, 23, 42, 0.055);
}

body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-message-content {
    width: 100%;
    max-width: 940px;
    margin: 0;
    color: #1f2937;
    font-size: 1rem;
    font-weight: 500;
    line-height: 1.78;
    text-align: left !important;
    word-break: normal;
    overflow-wrap: anywhere;
}

body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-message-content *,
body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-message-content p,
body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-message-content div {
    text-align: left !important;
}

body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-message-content [align="center"],
body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-message-content center {
    text-align: left !important;
}

body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-message-content div,
body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-message-content table {
    margin-right: 0 !important;
    margin-left: 0 !important;
}

body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-message-content > :first-child {
    margin-top: 0;
}

body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-message-content > :last-child {
    margin-bottom: 0;
}

body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-message-content p {
    margin: 0 0 12px;
}

body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-message-content table {
    width: 100%;
    max-width: 100%;
    margin: 12px 0;
    border-collapse: collapse;
}

body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-message-content td,
body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-message-content th {
    padding: 8px 10px;
    border: 1px solid #e5edf6;
}

body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-message-ip {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-top: 18px;
    padding: 8px 10px;
    color: #64748b;
    background: #f8fbff;
    border: 1px solid #e5edf6;
    border-radius: 8px;
    font-size: 0.82rem;
    font-weight: 800;
}

body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-message-attachments {
    padding: 18px 24px !important;
    background: #f8fbff;
    border-top: 1px solid #e5edf6;
}

body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-reply-card {
    margin: 24px 0;
}

body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-reply-card .card-header {
    padding: 0 18px !important;
    background: linear-gradient(180deg, #ffffff, var(--mtd-scheme-primary-surface)) !important;
    border-bottom: 1px solid #e5edf6 !important;
}

body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-reply-card .nav-tabs {
    border-bottom: 0;
}

body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-reply-card .nav-link {
    min-height: 54px;
    padding: 17px 4px 14px;
    margin-right: 22px;
    color: #64748b;
    background: transparent;
    border: 0;
    border-bottom: 2px solid transparent;
    border-radius: 0;
    font-weight: 900;
}

body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-reply-card .nav-link.active,
body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-reply-card .nav-link:hover {
    color: var(--mtd-scheme-primary);
    border-bottom-color: var(--mtd-scheme-primary);
}

body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-reply-card .card-body {
    padding: 22px !important;
}

body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-reply-by {
    background: var(--mtd-scheme-primary-surface) !important;
    border-color: #dbe7f5 !important;
    border-radius: 8px !important;
}

body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-reply-card label {
    margin: 0;
    color: #111827;
    font-weight: 900;
}

body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-field {
    margin-bottom: 22px;
}

body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-field-head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 14px;
    margin-bottom: 10px;
}

body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-field-hint {
    color: #64748b;
    font-size: 0.82rem;
    font-weight: 750;
    text-align: right;
}

body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-reply-card .form-control,
body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-reply-card .custom-file-label {
    min-height: 48px;
    color: #334155;
    background: #ffffff;
    border: 1px solid #d8e3f0;
    border-radius: 8px;
    box-shadow: none;
}

body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-reply-card textarea.markdown-editor {
    min-height: 260px;
    padding: 16px;
    line-height: 1.6;
}

body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-reply-card .md-editor,
body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-reply-card .editor-toolbar {
    border-color: #d8e3f0;
    border-radius: 8px;
}

body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-reply-card .md-editor,
body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-reply-card .CodeMirror {
    overflow: hidden;
    background: #ffffff;
    border: 1px solid #d8e3f0;
    border-radius: 8px;
    box-shadow: 0 12px 26px rgba(15, 23, 42, 0.045);
}

body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-reply-card .md-editor > .md-header,
body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-reply-card .md-editor .md-header,
body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-reply-card .editor-toolbar {
    display: flex !important;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    min-height: 54px;
    padding: 10px 12px !important;
    background:
        linear-gradient(90deg, color-mix(in srgb, var(--mtd-scheme-primary) 6%, transparent), transparent 44%),
        #f8fbff !important;
    border: 0 !important;
    border-bottom: 1px solid #e5edf6 !important;
}

body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-reply-card .md-editor > textarea,
body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-reply-card .md-editor > .md-preview,
body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-reply-card .CodeMirror {
    min-height: 260px;
    border: 0 !important;
    border-radius: 0;
}

body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-reply-card .CodeMirror-scroll {
    min-height: 260px;
}

body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-reply-card .md-editor .btn,
body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-reply-card .md-editor button,
body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-reply-card .editor-toolbar button,
body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-reply-card .editor-toolbar a {
    display: inline-flex !important;
    width: 34px;
    height: 34px;
    min-width: 34px;
    min-height: 34px;
    align-items: center;
    justify-content: center;
    margin: 0 !important;
    padding: 0 !important;
    color: #64748b !important;
    background: #ffffff !important;
    border: 1px solid #dbe7f5 !important;
    border-radius: 8px !important;
    box-shadow: none !important;
    line-height: 1;
}

body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-reply-card .md-editor .btn:hover,
body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-reply-card .md-editor button:hover,
body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-reply-card .editor-toolbar button:hover,
body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-reply-card .editor-toolbar a:hover {
    color: var(--mtd-scheme-primary) !important;
    background: var(--mtd-scheme-primary-soft) !important;
    border-color: var(--mtd-scheme-primary-border) !important;
}

body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-reply-card .md-editor .btn-primary,
body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-reply-card .editor-toolbar .active,
body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-reply-card .editor-toolbar button.active,
body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-reply-card .editor-toolbar a.active {
    width: auto;
    min-width: 84px;
    padding: 0 12px !important;
    color: #ffffff !important;
    background: var(--mtd-scheme-primary) !important;
    border-color: var(--mtd-scheme-primary) !important;
}

body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-reply-card .md-editor .btn-group,
body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-reply-card .editor-toolbar .separator {
    display: inline-flex;
    gap: 6px;
    margin: 0 4px 0 0;
}

body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-attachments-field {
    padding: 18px;
    background:
        linear-gradient(90deg, color-mix(in srgb, var(--mtd-scheme-primary) 5%, transparent), transparent 42%),
        #fbfdff;
    border: 1px solid #dbe7f5;
    border-radius: 8px;
}

body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-attachments-field .attachment-group {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 12px;
    align-items: stretch;
    margin: 0 !important;
}

body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-attachments-field .custom-file,
body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-attachments-field .custom-file-input,
body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-attachments-field .custom-file-label {
    height: 48px;
    min-height: 48px;
}

body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-attachments-field .custom-file {
    min-width: 0;
}

body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-attachments-field .custom-file-label {
    display: flex;
    align-items: center;
    padding: 0 16px;
    line-height: 48px;
}

body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-attachments-field .custom-file-label::after {
    display: none;
}

body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-attachments-field .input-group-append {
    margin: 0;
}

body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-attachments-field .btn-addmore {
    display: inline-flex;
    width: auto;
    min-width: 124px;
    height: 48px;
    min-height: 48px;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 0 16px;
    border-radius: 8px !important;
}

body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-attachments-field #fileUploadsContainer {
    display: grid;
    gap: 10px;
    margin-top: 10px;
}

body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-attachments-field #fileUploadsContainer .attachment-group {
    grid-template-columns: minmax(0, 1fr);
}

body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-attachment-note {
    display: none;
}

body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-reply-card .form-actions {
    display: flex;
    gap: 10px;
    align-items: center;
    margin-top: 18px;
    padding-top: 18px;
    border-top: 1px solid #e5edf6;
}

body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-reply-card .btn,
body[data-templatefile="viewticket"]:not(.login) .ticket-actions .btn {
    display: inline-flex;
    min-height: 40px;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    font-weight: 900;
}

body[data-templatefile="viewticket"]:not(.login) .panel-sidebar {
    overflow: hidden;
    background: #ffffff;
    border: 1px solid color-mix(in srgb, var(--mtd-scheme-primary) 14%, #dbe7f5);
    border-radius: 8px;
    box-shadow: 0 16px 34px rgba(15, 23, 42, 0.06);
}

body[data-templatefile="viewticket"]:not(.login) .panel-sidebar .panel-heading {
    min-height: 56px;
    padding: 13px 16px;
    background:
        linear-gradient(90deg, color-mix(in srgb, var(--mtd-scheme-primary) 7%, transparent), transparent 40%),
        linear-gradient(180deg, #ffffff, var(--mtd-scheme-primary-surface));
    border-bottom: 1px solid #e5edf6;
}

body[data-templatefile="viewticket"]:not(.login) .panel-sidebar .panel-title {
    display: flex;
    align-items: center;
    gap: 10px;
    color: #111827;
    font-weight: 900;
}

body[data-templatefile="viewticket"]:not(.login) .panel-sidebar .panel-title > i,
body[data-templatefile="viewticket"]:not(.login) .panel-sidebar .list-group-item > i {
    display: inline-flex;
    width: 32px;
    height: 32px;
    align-items: center;
    justify-content: center;
    color: #ffffff;
    background: var(--mtd-scheme-primary);
    border-radius: 8px;
}

body[data-templatefile="viewticket"]:not(.login) .panel-sidebar .list-group-item {
    padding: 14px 16px;
    border-color: #e5edf6;
}

body[data-templatefile="viewticket"]:not(.login) .panel-sidebar .btn {
    border-radius: 8px;
    font-weight: 900;
}

body.dark-mode[data-templatefile="viewticket"]:not(.login) .mtd-ticket-subject-card,
body.dark-mode[data-templatefile="viewticket"]:not(.login) .mtd-ticket-message-card,
body.dark-mode[data-templatefile="viewticket"]:not(.login) .mtd-ticket-reply-card,
body.dark-mode[data-templatefile="viewticket"]:not(.login) .panel-sidebar {
    color: #dce6f4;
    background: #111c2d;
    border-color: #2c3b52;
}

@media (max-width: 767.98px) {
    body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-subject-card {
        grid-template-columns: 46px minmax(0, 1fr);
    }

    body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-subject-icon {
        width: 46px;
        height: 46px;
    }

    body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-subject-meta {
        grid-column: 1 / -1;
    }

    body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-reply-header,
    body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-reply-card .form-actions {
        align-items: flex-start;
        flex-direction: column;
    }

    body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-message-body {
        padding: 14px !important;
    }

    body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-message-surface {
        padding: 18px;
    }

    body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-field-head {
        align-items: flex-start;
        flex-direction: column;
        gap: 6px;
    }

    body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-field-hint {
        text-align: left;
    }

    body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-attachments-field .attachment-group {
        grid-template-columns: minmax(0, 1fr);
    }

    body[data-templatefile="viewticket"]:not(.login) .mtd-ticket-attachments-field .btn-addmore {
        width: 100%;
    }
}

/* Submit ticket form */
body[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-form {
    display: grid;
    gap: 24px;
}

body[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-card {
    padding: 0 !important;
    overflow: visible;
    background: #ffffff;
    border: 1px solid color-mix(in srgb, var(--mtd-scheme-primary) 14%, #dbe7f5);
    border-radius: 8px;
    box-shadow: 0 18px 42px rgba(15, 23, 42, 0.07);
}

body[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-card-heading {
    display: grid;
    grid-template-columns: 52px minmax(0, 1fr);
    gap: 14px;
    align-items: center;
    padding: 18px;
    background:
        linear-gradient(90deg, color-mix(in srgb, var(--mtd-scheme-primary) 8%, transparent), transparent 46%),
        linear-gradient(180deg, #ffffff, var(--mtd-scheme-primary-surface));
    border-bottom: 1px solid #e5edf6;
    border-radius: 8px 8px 0 0;
}

body[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-card-icon {
    display: inline-flex;
    width: 52px;
    height: 52px;
    align-items: center;
    justify-content: center;
    color: #ffffff;
    background: var(--mtd-scheme-primary);
    border-radius: 8px;
    box-shadow: 0 14px 28px color-mix(in srgb, var(--mtd-scheme-primary) 24%, transparent);
}

body[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-card-heading-text {
    display: grid;
    min-width: 0;
    gap: 4px;
}

body[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-card-heading-text strong {
    color: #111827;
    font-size: 1.05rem;
    font-weight: 900;
    line-height: 1.25;
}

body[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-card-heading-text small {
    color: #64748b;
    font-size: 0.92rem;
    font-weight: 650;
    line-height: 1.45;
}

body[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-request-card > .row {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
    margin: 0 !important;
    padding: 20px;
}

body[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-request-card > .row > [class*="col-"] {
    width: 100%;
    max-width: none;
    flex: none;
    padding: 0 !important;
}

body[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-request-card .col-sm-12,
body[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-department-field,
body[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-priority-field {
    grid-column: 1 / -1;
}

body[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-card .form-group {
    margin-bottom: 0;
}

body[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-card label {
    margin-bottom: 8px;
    color: #111827;
    font-weight: 900;
    line-height: 1.2;
}

body[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-card .form-control,
body[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-card .custom-select {
    min-height: 52px;
    color: #111827;
    background: #ffffff;
    border: 1px solid #dbe7f5;
    border-radius: 8px;
    box-shadow: 0 10px 24px rgba(15, 23, 42, 0.035);
    font-weight: 700;
}

body[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-card textarea.form-control {
    min-height: 320px;
}

body[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-card .form-control:focus,
body[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-card .custom-select:focus {
    border-color: var(--mtd-scheme-primary);
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--mtd-scheme-primary) 14%, transparent);
}

body[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-department-field .department-dropdown,
body[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-related-field .related-product-dropdown {
    position: relative;
    z-index: 20;
}

body[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-department-field .department-dropdown > button,
body[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-related-field .related-product-dropdown > button {
    display: flex !important;
    height: 52px !important;
    min-height: 52px !important;
    align-items: center;
    justify-content: space-between;
    padding: 0 16px !important;
    text-align: left;
}

body[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-department-field .department-dropdown:not(.show) > .dropdown-menu:not(.show),
body[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-related-field .related-product-dropdown:not(.show) > .dropdown-menu:not(.show) {
    display: none !important;
}

body[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-department-field .dropdown-menu,
body[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-related-field .dropdown-menu {
    z-index: 1050;
    width: 100%;
    min-width: 100%;
    max-height: min(320px, 52vh);
    padding: 8px;
    overflow-y: auto;
    border: 1px solid #dbe7f5;
    border-radius: 8px;
    box-shadow: 0 24px 54px rgba(15, 23, 42, 0.16);
}

body[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-department-field .dropdown-item,
body[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-related-field .dropdown-item {
    min-height: 44px;
    padding: 10px 12px;
    border-radius: 8px;
    color: #111827;
    font-weight: 750;
}

body[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-department-field .dropdown-item:hover,
body[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-related-field .dropdown-item:hover {
    background: var(--mtd-scheme-primary-soft);
}

body[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .urgency-options {
    display: flex;
    min-height: 68px;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    padding: 12px;
    background:
        linear-gradient(90deg, color-mix(in srgb, var(--mtd-scheme-primary) 5%, transparent), transparent),
        #fbfdff;
    border: 1px solid #dbe7f5;
    border-radius: 8px;
}

body[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .urgency-options > label:first-child {
    margin: 0 8px 0 0 !important;
    color: #111827;
    font-weight: 900;
}

body[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .urgency-options .radio-inline {
    display: inline-flex;
    margin: 0 !important;
    padding: 0 !important;
}

body[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .urgency-options .mtd-checkbox {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

body[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .urgency-options .pcb.sm {
    display: inline-flex;
    min-height: 42px;
    align-items: center;
    justify-content: center;
    padding: 0 18px;
    color: #334155;
    background: #ffffff;
    border: 1px solid #dbe7f5;
    border-radius: 8px;
    box-shadow: 0 10px 22px rgba(15, 23, 42, 0.045);
    font-weight: 900;
}

body[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .urgency-options .mtd-checkbox:checked + .pcb.sm {
    color: #ffffff;
    background: var(--mtd-scheme-primary);
    border-color: var(--mtd-scheme-primary);
    box-shadow: 0 14px 28px color-mix(in srgb, var(--mtd-scheme-primary) 22%, transparent);
}

body[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-message-card {
    overflow: hidden;
}

body[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-message-card > .form-group,
body[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-message-card > #regularMessageField,
body[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-message-card > #sensitiveDataTabs {
    margin: 20px;
}

body[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-message-field .md-editor {
    overflow: hidden;
    background: #ffffff;
    border: 1px solid #dbe7f5;
    border-radius: 8px;
    box-shadow: 0 16px 34px rgba(15, 23, 42, 0.055);
}

body[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-message-field .md-header {
    display: flex;
    width: 100%;
    align-items: center;
    flex-wrap: wrap;
    gap: 7px;
    padding: 10px 12px !important;
    background: #f8fbff;
    border-bottom: 1px solid #e5edf6;
    box-sizing: border-box;
}

body[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-message-field .md-header .btn-group {
    display: inline-flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
    margin: 0 !important;
}

body[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-message-field .md-header .btn,
body[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-message-field .md-control {
    display: inline-flex;
    width: 34px;
    min-width: 34px;
    height: 34px;
    min-height: 34px;
    align-items: center;
    justify-content: center;
    padding: 0;
    color: #64748b;
    background: #ffffff;
    border: 1px solid #dbe7f5;
    border-radius: 8px;
    box-shadow: none;
}

body[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-message-field .md-header .btn:hover,
body[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-message-field .md-control:hover {
    color: var(--mtd-scheme-primary);
    background: var(--mtd-scheme-primary-soft);
}

body[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-message-field .md-header .btn-primary {
    width: auto;
    min-width: 76px;
    padding: 0 14px;
    color: #ffffff;
    background: var(--mtd-scheme-primary);
    border-color: var(--mtd-scheme-primary);
    font-weight: 900;
}

body[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-message-field .md-input,
body[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-message-field textarea {
    min-height: 340px;
    padding: 16px !important;
    border: 0 !important;
    box-shadow: none !important;
}

body[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-attachment-field {
    margin: 20px !important;
}

body[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-attachment-field .attachment-group {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 10px;
    align-items: center;
}

body[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-attachment-field .custom-file {
    width: 100%;
    height: 44px;
}

body[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-attachment-field .custom-file-label {
    display: flex;
    height: 44px;
    align-items: center;
    padding: 0 14px;
    border-color: #dbe7f5;
    border-radius: 8px;
    font-weight: 800;
}

body[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-attachment-field .input-group-append {
    margin-left: 0;
}

body[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-attachment-field .btn-addmore {
    display: inline-flex;
    height: 44px;
    align-items: center;
    gap: 8px;
    padding: 0 16px;
    border-radius: 8px;
    font-weight: 900;
}

body[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .form-actions {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-top: 4px;
    padding-top: 20px;
    border-top: 1px solid #dbe7f5;
}

body[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .form-actions .btn,
body[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-form > .btn,
body[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-form button[type="submit"] {
    display: inline-flex;
    min-height: 46px;
    align-items: center;
    justify-content: center;
    padding: 0 22px;
    border-radius: 8px;
    font-weight: 900;
}

@media (max-width: 767.98px) {
    body[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-request-card > .row {
        grid-template-columns: 1fr;
        gap: 14px;
        padding: 16px;
    }

    body[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-card-heading {
        grid-template-columns: 46px minmax(0, 1fr);
        gap: 12px;
        padding: 16px;
    }

    body[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-card-icon {
        width: 46px;
        height: 46px;
    }

    body[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-message-card > .form-group,
    body[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-message-card > #regularMessageField,
    body[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-message-card > #sensitiveDataTabs,
    body[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-attachment-field {
        margin: 16px !important;
    }

    body[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-message-field .md-header {
        overflow-x: auto;
        flex-wrap: nowrap;
    }

    body[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-message-field .md-header .btn-group {
        flex-wrap: nowrap;
    }

    body[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-attachment-field .attachment-group {
        grid-template-columns: 1fr;
    }

    body[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-attachment-field .btn-addmore {
        width: 100%;
        justify-content: center;
    }

    body[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .form-actions {
        align-items: stretch;
        flex-direction: column;
    }
}

/* Account details phone picker, email preferences, and invite user modal polish */
body[data-templatefile="clientareadetails"]:not(.login) .mtd-details-form .mtd-details-phone-field .intl-tel-input,
body[data-templatefile="clientareadetails"]:not(.login) .mtd-details-form .mtd-details-phone-field .iti {
    position: relative !important;
    display: block !important;
    width: 100% !important;
}

body[data-templatefile="clientareadetails"]:not(.login) .mtd-details-form .mtd-details-phone-field .intl-tel-input .flag-container,
body[data-templatefile="clientareadetails"]:not(.login) .mtd-details-form .mtd-details-phone-field .iti__flag-container {
    right: auto !important;
    left: 0 !important;
    z-index: 4 !important;
    width: 118px !important;
    max-width: 118px !important;
    border-right: 1px solid #dbe7f5 !important;
    overflow: visible !important;
}

body[data-templatefile="clientareadetails"]:not(.login) .mtd-details-form .mtd-details-phone-field .intl-tel-input .selected-flag,
body[data-templatefile="clientareadetails"]:not(.login) .mtd-details-form .mtd-details-phone-field .iti__selected-flag {
    display: flex !important;
    width: 118px !important;
    min-height: 44px !important;
    align-items: center !important;
    gap: 10px !important;
    padding: 0 12px !important;
    border-radius: 8px 0 0 8px !important;
    background: #f8fbff !important;
    box-sizing: border-box !important;
}

body[data-templatefile="clientareadetails"]:not(.login) .mtd-details-form .mtd-details-phone-field .selected-flag .iti-flag,
body[data-templatefile="clientareadetails"]:not(.login) .mtd-details-form .mtd-details-phone-field .iti__selected-flag .iti__flag {
    flex: 0 0 auto !important;
    margin-right: 0 !important;
}

body[data-templatefile="clientareadetails"]:not(.login) .mtd-details-form .mtd-details-phone-field .selected-dial-code,
body[data-templatefile="clientareadetails"]:not(.login) .mtd-details-form .mtd-details-phone-field .iti__selected-dial-code {
    margin-left: 0 !important;
    color: #0f172a !important;
    font-weight: 850 !important;
    letter-spacing: 0 !important;
}

body[data-templatefile="clientareadetails"]:not(.login) .mtd-details-form .mtd-details-phone-field .iti-arrow,
body[data-templatefile="clientareadetails"]:not(.login) .mtd-details-form .mtd-details-phone-field .iti__arrow {
    margin-left: auto !important;
}

body[data-templatefile="clientareadetails"]:not(.login) .mtd-details-form .mtd-details-phone-field .intl-tel-input.separate-dial-code input#inputPhone,
body[data-templatefile="clientareadetails"]:not(.login) .mtd-details-form .mtd-details-phone-field .intl-tel-input.allow-dropdown input#inputPhone,
body[data-templatefile="clientareadetails"]:not(.login) .mtd-details-form .mtd-details-phone-field .iti input#inputPhone {
    padding-left: 132px !important;
}

body[data-templatefile="clientareadetails"]:not(.login) .mtd-details-form .mtd-details-phone-field .intl-tel-input:not(.separate-dial-code) input#inputPhone,
body[data-templatefile="clientareadetails"]:not(.login) .mtd-details-form .mtd-details-phone-field .iti:not(.iti--separate-dial-code) input#inputPhone {
    padding-left: 58px !important;
}

body[data-templatefile="clientareadetails"]:not(.login) .mtd-details-form .mtd-details-phone-field .country-list,
body[data-templatefile="clientareadetails"]:not(.login) .mtd-details-form .mtd-details-phone-field .iti__country-list {
    width: min(520px, calc(100vw - 40px)) !important;
    min-width: 100% !important;
    max-width: min(520px, calc(100vw - 40px)) !important;
    max-height: min(340px, 52vh) !important;
    overflow-y: auto !important;
    padding: 8px !important;
    border: 1px solid #dbe7f5 !important;
    border-radius: 8px !important;
    background: #ffffff !important;
    box-shadow: 0 24px 54px rgba(15, 23, 42, 0.18) !important;
}

body[data-templatefile="clientareadetails"]:not(.login) .mtd-details-form .mtd-details-phone-field .country-list .country,
body[data-templatefile="clientareadetails"]:not(.login) .mtd-details-form .mtd-details-phone-field .iti__country {
    display: flex !important;
    min-height: 42px !important;
    align-items: center !important;
    gap: 10px !important;
    padding: 8px 10px !important;
    border-radius: 8px !important;
    color: #111827 !important;
    font-size: 0.95rem !important;
    font-weight: 700 !important;
    line-height: 1.25 !important;
    white-space: normal !important;
}

body[data-templatefile="clientareadetails"]:not(.login) .mtd-details-form .mtd-details-phone-field .country-list .country:hover,
body[data-templatefile="clientareadetails"]:not(.login) .mtd-details-form .mtd-details-phone-field .country-list .country.highlight,
body[data-templatefile="clientareadetails"]:not(.login) .mtd-details-form .mtd-details-phone-field .iti__country:hover,
body[data-templatefile="clientareadetails"]:not(.login) .mtd-details-form .mtd-details-phone-field .iti__country.iti__highlight {
    background: var(--mtd-scheme-primary-soft) !important;
}

body[data-templatefile="clientareadetails"]:not(.login) .mtd-details-form .mtd-details-phone-field .country-list .flag-box,
body[data-templatefile="clientareadetails"]:not(.login) .mtd-details-form .mtd-details-phone-field .iti__flag-box {
    display: inline-flex !important;
    width: 28px !important;
    min-width: 28px !important;
    justify-content: center !important;
    margin-right: 0 !important;
}

body[data-templatefile="clientareadetails"]:not(.login) .mtd-details-form .mtd-details-phone-field .country-list .country-name,
body[data-templatefile="clientareadetails"]:not(.login) .mtd-details-form .mtd-details-phone-field .iti__country-name {
    margin: 0 10px 0 0 !important;
    color: inherit !important;
}

body[data-templatefile="clientareadetails"]:not(.login) .mtd-details-form .mtd-details-phone-field .country-list .dial-code,
body[data-templatefile="clientareadetails"]:not(.login) .mtd-details-form .mtd-details-phone-field .iti__dial-code {
    margin-left: auto !important;
    color: #64748b !important;
    font-weight: 850 !important;
}

body:not(.login) form:not(#registration) .intl-tel-input:has(input#inputPhone),
body:not(.login) form:not(#registration) .iti:has(input#inputPhone) {
    position: relative !important;
    display: block !important;
    width: 100% !important;
}

body:not(.login) form:not(#registration) .intl-tel-input:has(input#inputPhone) .flag-container,
body:not(.login) form:not(#registration) .iti:has(input#inputPhone) .iti__flag-container {
    right: auto !important;
    left: 0 !important;
    z-index: 4 !important;
    width: 112px !important;
    max-width: 112px !important;
    border-right: 1px solid color-mix(in srgb, var(--mtd-scheme-primary) 16%, #dbe7f5) !important;
    overflow: visible !important;
}

body:not(.login) form:not(#registration) .intl-tel-input:has(input#inputPhone) .selected-flag,
body:not(.login) form:not(#registration) .iti:has(input#inputPhone) .iti__selected-flag {
    display: flex !important;
    width: 112px !important;
    min-height: 44px !important;
    align-items: center !important;
    gap: 10px !important;
    padding: 0 12px !important;
    border-radius: 8px 0 0 8px !important;
    background: var(--mtd-scheme-primary-surface) !important;
    box-sizing: border-box !important;
}

body:not(.login) form:not(#registration) .intl-tel-input:has(input#inputPhone) .selected-flag .iti-flag,
body:not(.login) form:not(#registration) .iti:has(input#inputPhone) .iti__selected-flag .iti__flag {
    flex: 0 0 auto !important;
    margin-right: 0 !important;
}

body:not(.login) form:not(#registration) .intl-tel-input:has(input#inputPhone) .selected-dial-code,
body:not(.login) form:not(#registration) .iti:has(input#inputPhone) .iti__selected-dial-code {
    margin-left: 0 !important;
    color: var(--mtd-scheme-primary) !important;
    font-weight: 850 !important;
    letter-spacing: 0 !important;
}

body:not(.login) form:not(#registration) .intl-tel-input:has(input#inputPhone) .iti-arrow,
body:not(.login) form:not(#registration) .iti:has(input#inputPhone) .iti__arrow {
    margin-left: auto !important;
}

body:not(.login) form:not(#registration) .intl-tel-input.separate-dial-code input#inputPhone,
body:not(.login) form:not(#registration) .intl-tel-input.allow-dropdown input#inputPhone,
body:not(.login) form:not(#registration) .iti input#inputPhone {
    padding-left: 126px !important;
}

body:not(.login) form:not(#registration) .intl-tel-input:not(.separate-dial-code) input#inputPhone,
body:not(.login) form:not(#registration) .iti:not(.iti--separate-dial-code) input#inputPhone {
    padding-left: 58px !important;
}

body:not(.login) form:not(#registration) .intl-tel-input:has(input#inputPhone) .country-list,
body:not(.login) form:not(#registration) .iti:has(input#inputPhone) .iti__country-list {
    width: min(540px, calc(100vw - 40px)) !important;
    min-width: 100% !important;
    max-width: min(540px, calc(100vw - 40px)) !important;
    max-height: min(350px, 52vh) !important;
    overflow-y: auto !important;
    padding: 8px !important;
    border: 1px solid color-mix(in srgb, var(--mtd-scheme-primary) 18%, #dbe7f5) !important;
    border-radius: 8px !important;
    background: #ffffff !important;
    box-shadow: 0 24px 54px rgba(15, 23, 42, 0.18) !important;
    z-index: 10020 !important;
}

body:not(.login) form:not(#registration) .intl-tel-input:has(input#inputPhone) .country-list .country,
body:not(.login) form:not(#registration) .iti:has(input#inputPhone) .iti__country {
    display: flex !important;
    min-height: 42px !important;
    align-items: center !important;
    gap: 10px !important;
    padding: 8px 10px !important;
    border-radius: 8px !important;
    color: #111827 !important;
    font-size: 0.95rem !important;
    font-weight: 700 !important;
    line-height: 1.25 !important;
    white-space: nowrap !important;
}

body:not(.login) form:not(#registration) .intl-tel-input:has(input#inputPhone) .country-list .country:hover,
body:not(.login) form:not(#registration) .intl-tel-input:has(input#inputPhone) .country-list .country.highlight,
body:not(.login) form:not(#registration) .iti:has(input#inputPhone) .iti__country:hover,
body:not(.login) form:not(#registration) .iti:has(input#inputPhone) .iti__country.iti__highlight {
    background: var(--mtd-scheme-primary-soft) !important;
    color: var(--mtd-scheme-primary) !important;
}

body:not(.login) form:not(#registration) .intl-tel-input:has(input#inputPhone) .country-list .flag-box,
body:not(.login) form:not(#registration) .iti:has(input#inputPhone) .iti__flag-box {
    display: inline-flex !important;
    width: 28px !important;
    min-width: 28px !important;
    justify-content: center !important;
    margin-right: 0 !important;
}

body:not(.login) form:not(#registration) .intl-tel-input:has(input#inputPhone) .country-list .country-name,
body:not(.login) form:not(#registration) .iti:has(input#inputPhone) .iti__country-name {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    margin: 0 !important;
    color: inherit !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

body:not(.login) form:not(#registration) .intl-tel-input:has(input#inputPhone) .country-list .dial-code,
body:not(.login) form:not(#registration) .iti:has(input#inputPhone) .iti__dial-code {
    flex: 0 0 auto !important;
    margin-left: auto !important;
    padding-left: 18px !important;
    color: #64748b !important;
    font-weight: 850 !important;
}

@media (max-width: 575.98px) {
    body:not(.login) form:not(#registration) .intl-tel-input:has(input#inputPhone) .country-list,
    body:not(.login) form:not(#registration) .iti:has(input#inputPhone) .iti__country-list {
        width: 100% !important;
        min-width: 100% !important;
        max-width: calc(100vw - 24px) !important;
    }

    body:not(.login) form:not(#registration) .intl-tel-input:has(input#inputPhone) .country-list .country,
    body:not(.login) form:not(#registration) .iti:has(input#inputPhone) .iti__country {
        gap: 8px !important;
        padding: 8px !important;
        font-size: 0.9rem !important;
    }
}

body[data-templatefile="clientareadetails"]:not(.login) .mtd-details-marketing-card {
    padding: 22px !important;
}

body[data-templatefile="clientareadetails"]:not(.login) .mtd-details-marketing-card p {
    max-width: 980px;
    margin-bottom: 18px;
    color: #334155;
    font-weight: 600;
    line-height: 1.55;
}

body[data-templatefile="clientareadetails"]:not(.login) .mtd-details-marketing-card .panel-switch {
    width: max-content;
    max-width: 100%;
    margin: 0;
    border-color: #dbe7f5;
    border-radius: 8px;
    background: #fbfdff;
}

/* Language chooser modal */
.mtd-localisation-modal.show {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: clamp(18px, 3vw, 36px) !important;
}

.mtd-localisation-modal .mtd-localisation-dialog {
    display: flex !important;
    align-items: center !important;
    width: min(980px, calc(100vw - 36px)) !important;
    max-width: min(980px, calc(100vw - 36px)) !important;
    min-height: 0 !important;
    margin: 0 auto !important;
    transform: translateY(18px) scale(0.985) !important;
    transition: transform 260ms cubic-bezier(0.22, 1, 0.36, 1), opacity 220ms ease !important;
    opacity: 0;
}

.mtd-localisation-modal.show .mtd-localisation-dialog {
    transform: translateY(0) scale(1) !important;
    opacity: 1;
}

.mtd-localisation-modal .mtd-localisation-content {
    width: 100% !important;
    max-height: calc(100vh - 56px) !important;
    margin: 0 !important;
    overflow: hidden !important;
    border: 1px solid color-mix(in srgb, var(--mtd-scheme-primary) 22%, #dbe7f5) !important;
    border-radius: 18px !important;
    background: linear-gradient(145deg, #ffffff 0%, color-mix(in srgb, var(--mtd-scheme-primary) 6%, #ffffff) 100%) !important;
    box-shadow: 0 34px 90px rgba(15, 23, 42, 0.24), 0 12px 30px color-mix(in srgb, var(--mtd-scheme-primary) 14%, transparent) !important;
}

.mtd-localisation-modal .mtd-localisation-header {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    min-height: 86px !important;
    padding: 20px 24px !important;
    border-bottom: 1px solid color-mix(in srgb, var(--mtd-scheme-primary) 14%, #e5edf7) !important;
    background: linear-gradient(120deg, color-mix(in srgb, var(--mtd-scheme-primary) 12%, #ffffff) 0%, #ffffff 62%, color-mix(in srgb, var(--mtd-scheme-accent) 10%, #ffffff) 100%) !important;
}

.mtd-localisation-modal .mtd-localisation-title {
    display: flex !important;
    align-items: center !important;
    gap: 14px !important;
    margin: 0 !important;
    color: #111827 !important;
    font-size: clamp(1.35rem, 2.4vw, 2rem) !important;
    font-weight: 900 !important;
    letter-spacing: 0 !important;
    line-height: 1.1 !important;
}

.mtd-localisation-modal .mtd-localisation-title-icon {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 52px !important;
    height: 52px !important;
    flex: 0 0 52px !important;
    border-radius: 14px !important;
    color: #ffffff !important;
    background: linear-gradient(135deg, var(--mtd-scheme-primary), var(--mtd-scheme-accent)) !important;
    box-shadow: 0 16px 32px color-mix(in srgb, var(--mtd-scheme-primary) 30%, transparent) !important;
}

.mtd-localisation-modal .mtd-localisation-title-icon i {
    color: inherit !important;
    font-size: 1.35rem !important;
    line-height: 1 !important;
}

.mtd-localisation-modal .mtd-localisation-close {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 46px !important;
    height: 46px !important;
    flex: 0 0 46px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 1px solid color-mix(in srgb, var(--mtd-scheme-primary) 14%, #dbe7f5) !important;
    border-radius: 12px !important;
    background: #ffffff !important;
    color: #64748b !important;
    opacity: 1 !important;
    text-shadow: none !important;
    transition: transform 180ms ease, color 180ms ease, border-color 180ms ease, background 180ms ease !important;
}

.mtd-localisation-modal .mtd-localisation-close:hover,
.mtd-localisation-modal .mtd-localisation-close:focus {
    transform: rotate(90deg) !important;
    border-color: var(--mtd-scheme-primary) !important;
    background: color-mix(in srgb, var(--mtd-scheme-primary) 9%, #ffffff) !important;
    color: var(--mtd-scheme-primary) !important;
}

.mtd-localisation-modal .mtd-localisation-close .mtd-localisation-close-icon {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 18px !important;
    height: 18px !important;
    padding: 0 !important;
    font-size: 0 !important;
    line-height: 0 !important;
}

.mtd-localisation-modal .mtd-localisation-close .mtd-localisation-close-icon svg {
    display: block !important;
    width: 18px !important;
    height: 18px !important;
}

.mtd-localisation-modal .mtd-localisation-body {
    max-height: min(64vh, 640px) !important;
    overflow-y: auto !important;
    padding: 24px !important;
    background: radial-gradient(circle at 12% 0%, color-mix(in srgb, var(--mtd-scheme-primary) 9%, transparent), transparent 30%), #ffffff !important;
}

.mtd-localisation-modal .mtd-localisation-section + .mtd-localisation-section {
    margin-top: 24px !important;
    padding-top: 22px !important;
    border-top: 1px solid color-mix(in srgb, var(--mtd-scheme-primary) 12%, #e5edf7) !important;
}

.mtd-localisation-modal .mtd-localisation-section-title {
    margin: 0 0 14px !important;
    color: #64748b !important;
    font-size: 0.78rem !important;
    font-weight: 900 !important;
    letter-spacing: 0.08em !important;
    line-height: 1.2 !important;
    text-transform: uppercase !important;
}

.mtd-localisation-modal .mtd-localisation-grid {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 12px !important;
    margin: 0 !important;
}

.mtd-localisation-modal .mtd-localisation-grid > [class*="col-"] {
    width: auto !important;
    max-width: none !important;
    flex: none !important;
    padding: 0 !important;
}

.mtd-localisation-modal .mtd-localisation-item {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    height: auto !important;
    min-height: 62px !important;
    width: 100% !important;
    padding: 13px 46px 13px 16px !important;
    border: 1px solid color-mix(in srgb, var(--mtd-scheme-primary) 16%, #dbe7f5) !important;
    border-radius: 12px !important;
    background: rgba(255, 255, 255, 0.94) !important;
    color: #263244 !important;
    font-size: 1rem !important;
    font-weight: 800 !important;
    line-height: 1.25 !important;
    text-decoration: none !important;
    box-shadow: 0 10px 24px rgba(15, 23, 42, 0.055) !important;
    transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease, background 180ms ease, color 180ms ease !important;
}

.mtd-localisation-modal .mtd-localisation-item::after {
    position: absolute !important;
    right: 15px !important;
    top: 50% !important;
    content: "" !important;
    width: 22px !important;
    height: 22px !important;
    border-radius: 999px !important;
    background-color: var(--mtd-scheme-primary) !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='white' d='M9.3 16.7 4.8 12.2l1.4-1.4 3.1 3.1 8.5-8.5 1.4 1.4z'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: 15px 15px !important;
    opacity: 0 !important;
    transform: translateY(-50%) scale(0.75) !important;
    transition: opacity 160ms ease, transform 160ms ease !important;
}

.mtd-localisation-modal .mtd-localisation-item:hover,
.mtd-localisation-modal .mtd-localisation-item:focus {
    transform: translateY(-2px) !important;
    border-color: color-mix(in srgb, var(--mtd-scheme-primary) 50%, #dbe7f5) !important;
    background: #ffffff !important;
    color: #111827 !important;
    box-shadow: 0 16px 34px rgba(15, 23, 42, 0.12) !important;
}

.mtd-localisation-modal .mtd-localisation-item.active {
    border-color: color-mix(in srgb, var(--mtd-scheme-primary) 58%, #dbe7f5) !important;
    background: linear-gradient(135deg, color-mix(in srgb, var(--mtd-scheme-primary) 12%, #ffffff), color-mix(in srgb, var(--mtd-scheme-accent) 8%, #ffffff)) !important;
    color: var(--mtd-scheme-primary) !important;
    box-shadow: 0 16px 34px color-mix(in srgb, var(--mtd-scheme-primary) 16%, transparent) !important;
}

.mtd-localisation-modal .mtd-localisation-item.active::after {
    opacity: 1 !important;
    transform: translateY(-50%) scale(1) !important;
}

.mtd-localisation-modal .mtd-localisation-item .mtd-language-flag-shell {
    display: block !important;
    flex: 0 0 30px !important;
    width: 30px !important;
    height: 22px !important;
    margin: 0 !important;
    overflow: hidden !important;
    border-radius: 3px !important;
    background: #ffffff !important;
    box-shadow: 0 0 0 1px rgba(15, 23, 42, 0.12), 0 4px 10px rgba(15, 23, 42, 0.06) !important;
}

.mtd-localisation-modal .mtd-localisation-item .mtd-language-flag {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    border: 0 !important;
    background: transparent !important;
}

.mtd-localisation-modal .currency .mtd-localisation-item {
    justify-content: center !important;
    padding-right: 46px !important;
}

.mtd-localisation-modal .mtd-localisation-footer {
    display: block !important;
    padding: 20px 24px !important;
    border-top: 1px solid color-mix(in srgb, var(--mtd-scheme-primary) 14%, #e5edf7) !important;
    background: color-mix(in srgb, var(--mtd-scheme-primary) 5%, #f8fbff) !important;
}

.mtd-localisation-modal .mtd-localisation-submit {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 12px !important;
    width: 100% !important;
    min-height: 58px !important;
    border: 0 !important;
    border-radius: 12px !important;
    background: linear-gradient(135deg, var(--mtd-scheme-primary), var(--mtd-scheme-accent)) !important;
    color: #ffffff !important;
    font-size: 1.08rem !important;
    font-weight: 900 !important;
    letter-spacing: 0 !important;
    box-shadow: 0 18px 36px color-mix(in srgb, var(--mtd-scheme-primary) 26%, transparent) !important;
    transition: transform 180ms ease, box-shadow 180ms ease, filter 180ms ease !important;
}

.mtd-localisation-modal .mtd-localisation-submit:hover,
.mtd-localisation-modal .mtd-localisation-submit:focus {
    transform: translateY(-1px) !important;
    filter: brightness(1.03) !important;
    box-shadow: 0 22px 42px color-mix(in srgb, var(--mtd-scheme-primary) 34%, transparent) !important;
}

body.dark-mode .mtd-localisation-modal .mtd-localisation-content {
    border-color: rgba(148, 163, 184, 0.22) !important;
    background: linear-gradient(145deg, #111827 0%, #0f172a 100%) !important;
    box-shadow: 0 34px 90px rgba(0, 0, 0, 0.46) !important;
}

body.dark-mode .mtd-localisation-modal .mtd-localisation-header,
body.dark-mode .mtd-localisation-modal .mtd-localisation-footer {
    border-color: rgba(148, 163, 184, 0.18) !important;
    background: linear-gradient(120deg, rgba(34, 197, 94, 0.12), rgba(15, 23, 42, 0.96)) !important;
}

body.dark-mode .mtd-localisation-modal .mtd-localisation-body {
    background: radial-gradient(circle at 10% 0%, rgba(34, 197, 94, 0.12), transparent 34%), #0f172a !important;
}

body.dark-mode .mtd-localisation-modal .mtd-localisation-title {
    color: #f8fafc !important;
}

body.dark-mode .mtd-localisation-modal .mtd-localisation-section-title {
    color: #94a3b8 !important;
}

body.dark-mode .mtd-localisation-modal .mtd-localisation-close,
body.dark-mode .mtd-localisation-modal .mtd-localisation-item {
    border-color: rgba(148, 163, 184, 0.2) !important;
    background: rgba(15, 23, 42, 0.88) !important;
    color: #e5edf7 !important;
}

body.dark-mode .mtd-localisation-modal .mtd-localisation-item:hover,
body.dark-mode .mtd-localisation-modal .mtd-localisation-item:focus,
body.dark-mode .mtd-localisation-modal .mtd-localisation-item.active {
    border-color: color-mix(in srgb, var(--mtd-scheme-primary) 62%, rgba(148, 163, 184, 0.2)) !important;
    background: rgba(34, 197, 94, 0.14) !important;
    color: #ffffff !important;
}

@media (max-width: 767.98px) {
    .mtd-localisation-modal .mtd-localisation-dialog {
        width: min(640px, calc(100vw - 28px)) !important;
        max-width: min(640px, calc(100vw - 28px)) !important;
    }

    .mtd-localisation-modal .mtd-localisation-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 575.98px) {
    .mtd-localisation-modal.show {
        padding: 12px !important;
    }

    .mtd-localisation-modal .mtd-localisation-dialog {
        width: calc(100vw - 24px) !important;
        max-width: calc(100vw - 24px) !important;
    }

    .mtd-localisation-modal .mtd-localisation-header {
        min-height: 74px !important;
        padding: 16px !important;
    }

    .mtd-localisation-modal .mtd-localisation-title-icon,
    .mtd-localisation-modal .mtd-localisation-close {
        width: 44px !important;
        height: 44px !important;
        flex-basis: 44px !important;
        border-radius: 12px !important;
    }

    .mtd-localisation-modal .mtd-localisation-title {
        gap: 10px !important;
    }

    .mtd-localisation-modal .mtd-localisation-body {
        max-height: calc(100vh - 176px) !important;
        padding: 16px !important;
    }

    .mtd-localisation-modal .mtd-localisation-grid {
        grid-template-columns: 1fr !important;
        gap: 10px !important;
    }

    .mtd-localisation-modal .mtd-localisation-footer {
        padding: 16px !important;
    }
}
/* Auth visual panels */
body.login .mtd-login-visual,
#wrapper.mtd-register-screen .mtd-register-visual,
#wrapper.mtd-login-background .mtd-register-visual,
#wrapper.mtd-login-background .mtd-reset-visual {
    background:
        linear-gradient(116deg, transparent 0 27%, rgba(255, 255, 255, 0.15) 27.2% 41%, transparent 41.2% 100%),
        linear-gradient(116deg, transparent 0 64%, color-mix(in srgb, var(--mtd-scheme-accent) 23%, rgba(255, 255, 255, 0.08)) 64.2% 78%, transparent 78.2% 100%),
        linear-gradient(90deg, rgba(255, 255, 255, 0.08) 1px, transparent 1px),
        linear-gradient(0deg, rgba(255, 255, 255, 0.055) 1px, transparent 1px),
        linear-gradient(145deg, color-mix(in srgb, var(--mtd-scheme-primary-deep) 76%, #07111f) 0%, color-mix(in srgb, var(--mtd-scheme-primary) 74%, var(--mtd-scheme-primary-deep)) 54%, color-mix(in srgb, var(--mtd-scheme-accent) 62%, var(--mtd-scheme-primary-deep)) 100%) !important;
    background-size: 100% 100%, 100% 100%, 64px 64px, 64px 64px, 100% 100% !important;
}

body.login .mtd-login-visual::before,
body.login .mtd-login-visual::after,
#wrapper.mtd-reset-screen .mtd-reset-visual::before,
#wrapper.mtd-reset-screen .mtd-reset-visual::after,
#wrapper.mtd-login-background .mtd-reset-visual::before,
#wrapper.mtd-login-background .mtd-reset-visual::after {
    content: none !important;
    display: none !important;
}

body.login .mtd-login-visual > .line-bg,
#wrapper.mtd-register-screen .mtd-register-visual > .line-bg,
#wrapper.mtd-login-background .mtd-register-visual > .line-bg,
#wrapper.mtd-login-background .mtd-reset-visual > .line-bg {
    position: absolute !important;
    top: 0 !important;
    display: block !important;
    width: 1px !important;
    height: 100% !important;
    z-index: 0 !important;
    background-color: transparent !important;
    opacity: 0.72 !important;
    pointer-events: none !important;
    transform: rotate(10deg) !important;
}

body.login .mtd-login-visual > .line-bg::before,
#wrapper.mtd-register-screen .mtd-register-visual > .line-bg::before,
#wrapper.mtd-login-background .mtd-register-visual > .line-bg::before,
#wrapper.mtd-login-background .mtd-reset-visual > .line-bg::before {
    content: "" !important;
    position: absolute !important;
    top: -60%;
    left: 0 !important;
    width: 2px !important;
    height: 92px !important;
    background: linear-gradient(180deg, transparent 0%, rgba(255, 255, 255, 0.58) 48%, transparent 100%) !important;
    box-shadow: 0 0 18px rgba(255, 255, 255, 0.3);
    animation-name: run !important;
    animation-duration: 5s !important;
    animation-iteration-count: infinite !important;
    animation-timing-function: cubic-bezier(0.3, 0.27, 0, 0.98) !important;
    animation-fill-mode: forwards !important;
}

body.login .mtd-login-visual > .line-bg0::before,
#wrapper.mtd-register-screen .mtd-register-visual > .line-bg0::before,
#wrapper.mtd-login-background .mtd-register-visual > .line-bg0::before,
#wrapper.mtd-login-background .mtd-reset-visual > .line-bg0::before {
    animation-delay: -0.2s !important;
}

body.login .mtd-login-visual > .line-bg1::before,
#wrapper.mtd-register-screen .mtd-register-visual > .line-bg1::before,
#wrapper.mtd-login-background .mtd-register-visual > .line-bg1::before,
#wrapper.mtd-login-background .mtd-reset-visual > .line-bg1::before {
    animation-delay: -1.1s !important;
}

body.login .mtd-login-visual > .line-bg2::before,
#wrapper.mtd-register-screen .mtd-register-visual > .line-bg2::before,
#wrapper.mtd-login-background .mtd-register-visual > .line-bg2::before,
#wrapper.mtd-login-background .mtd-reset-visual > .line-bg2::before {
    animation-delay: -2s !important;
}

body.login .mtd-login-visual > .line-bg3::before,
#wrapper.mtd-register-screen .mtd-register-visual > .line-bg3::before,
#wrapper.mtd-login-background .mtd-register-visual > .line-bg3::before,
#wrapper.mtd-login-background .mtd-reset-visual > .line-bg3::before {
    animation-delay: -2.9s !important;
}

body.login .mtd-login-visual > .line-bg4::before,
#wrapper.mtd-register-screen .mtd-register-visual > .line-bg4::before,
#wrapper.mtd-login-background .mtd-register-visual > .line-bg4::before,
#wrapper.mtd-login-background .mtd-reset-visual > .line-bg4::before {
    animation-delay: -3.8s !important;
}

body.login .mtd-login-visual > .line-bg5::before,
#wrapper.mtd-register-screen .mtd-register-visual > .line-bg5::before,
#wrapper.mtd-login-background .mtd-register-visual > .line-bg5::before,
#wrapper.mtd-login-background .mtd-reset-visual > .line-bg5::before {
    animation-delay: -4.6s !important;
}

body.login .mtd-login-visual > .line-bg6::before,
#wrapper.mtd-register-screen .mtd-register-visual > .line-bg6::before,
#wrapper.mtd-login-background .mtd-register-visual > .line-bg6::before,
#wrapper.mtd-login-background .mtd-reset-visual > .line-bg6::before {
    animation-delay: -5.4s !important;
}

body.login .mtd-login-visual > :not(.line-bg),
#wrapper.mtd-register-screen .mtd-register-visual > :not(.line-bg),
#wrapper.mtd-login-background .mtd-register-visual > :not(.line-bg),
#wrapper.mtd-login-background .mtd-reset-visual > :not(.line-bg) {
    position: relative;
    z-index: 1 !important;
}

/* Account details email preferences */
body[data-templatefile="clientareadetails"]:not(.login) .mtd-details-section-title {
    margin: 20px 0 8px !important;
}

body[data-templatefile="clientareadetails"]:not(.login) .mtd-details-email-preferences-card {
    overflow: hidden;
    padding: 0 !important;
    border: 1px solid color-mix(in srgb, var(--mtd-scheme-primary-border) 54%, #dbe7f5) !important;
    background:
        linear-gradient(135deg, #ffffff 0%, color-mix(in srgb, var(--mtd-scheme-primary-surface) 74%, #ffffff) 100%) !important;
}

body[data-templatefile="clientareadetails"]:not(.login) .mtd-email-preferences-card-head {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: clamp(16px, 2vw, 22px);
    border-bottom: 1px solid #e5edf7;
    background:
        radial-gradient(circle at 100% 0%, color-mix(in srgb, var(--mtd-scheme-primary-surface) 82%, transparent) 0 34%, transparent 35%),
        linear-gradient(135deg, #ffffff 0%, color-mix(in srgb, var(--mtd-scheme-primary-surface) 70%, #ffffff) 100%);
}

body[data-templatefile="clientareadetails"]:not(.login) .mtd-email-preferences-card-icon {
    display: inline-flex;
    width: 44px;
    height: 44px;
    flex: 0 0 44px;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--mtd-scheme-primary-border);
    border-radius: 8px;
    color: var(--mtd-scheme-primary-text);
    background: var(--mtd-scheme-primary);
    box-shadow: 0 12px 28px var(--mtd-scheme-primary-shadow);
}

body[data-templatefile="clientareadetails"]:not(.login) .mtd-email-preferences-card-head strong {
    display: block;
    color: #111827;
    font-size: 1rem;
    font-weight: 900;
    line-height: 1.2;
}

body[data-templatefile="clientareadetails"]:not(.login) .mtd-email-preferences-card-head small {
    display: block;
    margin-top: 2px;
    color: #718096;
    font-size: 0.84rem;
    font-weight: 700;
    line-height: 1.35;
}

body[data-templatefile="clientareadetails"]:not(.login) .mtd-email-preferences-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 12px;
    padding: clamp(16px, 2vw, 22px);
}

body[data-templatefile="clientareadetails"]:not(.login) .mtd-email-preference-tile {
    position: relative;
    display: grid !important;
    grid-template-columns: 46px minmax(0, 1fr) 52px;
    gap: 12px;
    min-height: 104px;
    align-items: center;
    margin: 0 !important;
    padding: 15px !important;
    border: 1px solid #dbe7f5;
    border-radius: 8px;
    color: #263143;
    background: #ffffff;
    box-shadow: 0 12px 28px rgba(15, 23, 42, 0.05);
    cursor: pointer;
    transition: transform 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease, background 0.18s ease;
}

body[data-templatefile="clientareadetails"]:not(.login) .mtd-email-preference-tile:hover {
    transform: translateY(-2px);
    border-color: var(--mtd-scheme-primary-border);
    box-shadow: 0 18px 40px rgba(15, 23, 42, 0.09);
}

body[data-templatefile="clientareadetails"]:not(.login) .mtd-email-preference-tile.is-enabled,
body[data-templatefile="clientareadetails"]:not(.login) .mtd-email-preference-tile:has(.mtd-email-preference-input:checked) {
    border-color: var(--mtd-scheme-primary-border);
    background: linear-gradient(135deg, color-mix(in srgb, var(--mtd-scheme-primary-surface) 80%, #ffffff) 0%, #ffffff 100%);
    box-shadow: 0 16px 34px color-mix(in srgb, var(--mtd-scheme-primary-shadow) 45%, transparent);
}

body[data-templatefile="clientareadetails"]:not(.login) .mtd-email-preference-input {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
    pointer-events: none;
}

body[data-templatefile="clientareadetails"]:not(.login) .mtd-email-preference-icon {
    display: inline-flex;
    width: 46px;
    height: 46px;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--mtd-scheme-primary-border);
    border-radius: 8px;
    color: var(--mtd-scheme-primary-hover);
    background: var(--mtd-scheme-primary-surface);
    font-size: 1.05rem;
    transition: color 0.18s ease, background 0.18s ease, border-color 0.18s ease;
}

body[data-templatefile="clientareadetails"]:not(.login) .mtd-email-preference-tile.is-enabled .mtd-email-preference-icon,
body[data-templatefile="clientareadetails"]:not(.login) .mtd-email-preference-tile:has(.mtd-email-preference-input:checked) .mtd-email-preference-icon {
    color: var(--mtd-scheme-primary-text);
    border-color: var(--mtd-scheme-primary);
    background: var(--mtd-scheme-primary);
}

body[data-templatefile="clientareadetails"]:not(.login) .mtd-email-preference-copy {
    display: grid;
    min-width: 0;
    gap: 5px;
}

body[data-templatefile="clientareadetails"]:not(.login) .mtd-email-preference-copy strong {
    color: #111827;
    font-size: 0.92rem;
    font-weight: 900;
    line-height: 1.25;
}

body[data-templatefile="clientareadetails"]:not(.login) .mtd-email-preference-copy small {
    max-width: 100%;
    color: #718096;
    font-size: 0.76rem;
    font-weight: 700;
    line-height: 1.25;
}

body[data-templatefile="clientareadetails"]:not(.login) .mtd-email-preference-switch {
    display: inline-flex;
    width: 48px;
    height: 26px;
    align-items: center;
    justify-content: flex-start;
    padding: 3px;
    border-radius: 999px;
    background: #d8e1ec;
    transition: background 0.18s ease;
}

body[data-templatefile="clientareadetails"]:not(.login) .mtd-email-preference-switch span {
    width: 20px;
    height: 20px;
    border-radius: 999px;
    background: #ffffff;
    box-shadow: 0 3px 8px rgba(15, 23, 42, 0.18);
    transform: translateX(0);
    transition: transform 0.18s ease;
}

body[data-templatefile="clientareadetails"]:not(.login) .mtd-email-preference-input:checked ~ .mtd-email-preference-switch {
    background: var(--mtd-scheme-primary);
}

body[data-templatefile="clientareadetails"]:not(.login) .mtd-email-preference-input:checked ~ .mtd-email-preference-switch span {
    transform: translateX(22px);
}

@media (max-width: 767.98px) {
    body[data-templatefile="clientareadetails"]:not(.login) .mtd-email-preferences-grid {
        grid-template-columns: 1fr;
    }

    body[data-templatefile="clientareadetails"]:not(.login) .mtd-email-preference-tile {
        grid-template-columns: 42px minmax(0, 1fr) 46px;
        min-height: 88px;
        padding: 12px !important;
    }
}
/* Keep homepage product cards from being clipped by the Swiper viewport. */
.mtd-pricing-container .swiper[id^="products-group-"] {
    height: auto !important;
    padding: 24px 22px 38px;
    margin: -24px -22px -38px;
}

.mtd-pricing-container .home-products.swiper-wrapper {
    padding-bottom: 8px;
}

.mtd-pricing-container .home-products .group-slide {
    height: auto !important;
}

.mtd-pricing-container .home-products .mtd-pricing-table {
    margin-bottom: 0;
}

/* Bluish dark storefront card surfaces */
body.dark-mode:not(.login) {
    --mtd-dark-card-surface: linear-gradient(145deg, rgba(15, 23, 42, 0.96), rgba(8, 17, 31, 0.94));
    --mtd-dark-card-border: color-mix(in srgb, var(--mtd-scheme-primary) 24%, rgba(148, 163, 184, 0.16));
    --mtd-dark-card-text: #e8f0fb;
    --mtd-dark-card-muted: rgba(203, 213, 225, 0.78);
    --mtd-dark-card-shadow: 0 26px 62px rgba(0, 0, 0, 0.34), inset 0 1px 0 rgba(255, 255, 255, 0.06);
}

body.dark-mode:not(.login) .mtd-pricing-container .mtd-pricing-table,
body.dark-mode:not(.login) .pricing_style_2 .mtd-pricing-table,
body.dark-mode:not(.login) .pricing-slider .mtd-pricing-table,
body.dark-mode:not(.login) .pricing-box,
body.dark-mode:not(.login) .store-promoted-product,
body.dark-mode:not(.login) .landing-page .pricing-item,
body.dark-mode:not(.login) #order-standard_cart .products .product,
body.dark-mode:not(.login) #order-standard_cart .featured-tlds-container .featured-tld,
body.dark-mode:not(.login) #order-standard_cart.mtd-domain-page .domain-pricing .MTD-card {
    border-color: var(--mtd-dark-card-border) !important;
    background:
        radial-gradient(circle at 88% 0%, color-mix(in srgb, var(--mtd-scheme-primary) 18%, transparent), transparent 34%),
        var(--mtd-dark-card-surface) !important;
    color: var(--mtd-dark-card-text) !important;
    box-shadow: var(--mtd-dark-card-shadow) !important;
    border-radius: 28px;
}

body.dark-mode:not(.login) .mtd-pricing-container .mtd-pricing-table:hover,
body.dark-mode:not(.login) .pricing_style_2 .mtd-pricing-table:hover,
body.dark-mode:not(.login) .pricing-slider .mtd-pricing-table:hover,
body.dark-mode:not(.login) .pricing-box:hover,
body.dark-mode:not(.login) .store-promoted-product:hover,
body.dark-mode:not(.login) .landing-page .pricing-item:hover,
body.dark-mode:not(.login) #order-standard_cart .products .product:hover,
body.dark-mode:not(.login) #order-standard_cart .featured-tlds-container .featured-tld:hover {
    border-color: color-mix(in srgb, var(--mtd-scheme-primary) 44%, rgba(148, 163, 184, 0.18)) !important;
    background:
        radial-gradient(circle at 88% 0%, color-mix(in srgb, var(--mtd-scheme-primary) 24%, transparent), transparent 36%),
        linear-gradient(145deg, rgba(18, 31, 55, 0.98), rgba(9, 20, 38, 0.96)) !important;
    box-shadow: 0 30px 74px rgba(0, 0, 0, 0.42), 0 0 0 1px color-mix(in srgb, var(--mtd-scheme-primary) 14%, transparent) inset !important;
}

body.dark-mode:not(.login) .mtd-pricing-container .mtd-pricing-table.active,
body.dark-mode:not(.login) .pricing_style_2 .mtd-pricing-table.active,
body.dark-mode:not(.login) .pricing-slider .mtd-pricing-table.active {
    border-color: color-mix(in srgb, var(--mtd-scheme-primary) 58%, rgba(148, 163, 184, 0.16)) !important;
    box-shadow: 0 30px 78px rgba(0, 0, 0, 0.46), 0 0 0 1px color-mix(in srgb, var(--mtd-scheme-primary) 24%, transparent) inset !important;
}

body.dark-mode:not(.login) .mtd-pricing-container .mtd-pricing-table h1,
body.dark-mode:not(.login) .mtd-pricing-container .mtd-pricing-table h2,
body.dark-mode:not(.login) .mtd-pricing-container .mtd-pricing-table h3,
body.dark-mode:not(.login) .mtd-pricing-container .mtd-pricing-table h4,
body.dark-mode:not(.login) .mtd-pricing-container .mtd-pricing-table .h1,
body.dark-mode:not(.login) .mtd-pricing-container .mtd-pricing-table .h2,
body.dark-mode:not(.login) .mtd-pricing-container .mtd-pricing-table .h3,
body.dark-mode:not(.login) .mtd-pricing-container .mtd-pricing-table .h4,
body.dark-mode:not(.login) .pricing_style_2 .mtd-pricing-table h1,
body.dark-mode:not(.login) .pricing_style_2 .mtd-pricing-table h2,
body.dark-mode:not(.login) .pricing_style_2 .mtd-pricing-table h3,
body.dark-mode:not(.login) .pricing_style_2 .mtd-pricing-table h4,
body.dark-mode:not(.login) .pricing_style_2 .mtd-pricing-table .h1,
body.dark-mode:not(.login) .pricing_style_2 .mtd-pricing-table .h2,
body.dark-mode:not(.login) .pricing_style_2 .mtd-pricing-table .h3,
body.dark-mode:not(.login) .pricing_style_2 .mtd-pricing-table .h4 {
    color: #f8fafc !important;
}

body.dark-mode:not(.login) .mtd-pricing-container .mtd-pricing-table p,
body.dark-mode:not(.login) .mtd-pricing-container .mtd-pricing-table li,
body.dark-mode:not(.login) .mtd-pricing-container .mtd-pricing-table .text-muted,
body.dark-mode:not(.login) .mtd-pricing-container .mtd-pricing-table .cycle,
body.dark-mode:not(.login) .pricing_style_2 .mtd-pricing-table p,
body.dark-mode:not(.login) .pricing_style_2 .mtd-pricing-table li,
body.dark-mode:not(.login) .pricing_style_2 .mtd-pricing-table .text-muted,
body.dark-mode:not(.login) .pricing_style_2 .mtd-pricing-table .cycle {
    color: var(--mtd-dark-card-muted) !important;
}

body.dark-mode:not(.login) .mtd-pricing-container .mtd-pricing-table .price,
body.dark-mode:not(.login) .pricing_style_2 .mtd-pricing-table .price {
    color: #f8fafc !important;
}

body.dark-mode:not(.login) .mtd-pricing-container .mtd-pricing-table .price .cost,
body.dark-mode:not(.login) .pricing_style_2 .mtd-pricing-table .price .cost {
    color: color-mix(in srgb, var(--mtd-scheme-primary) 86%, #bfdbfe) !important;
    text-shadow: 0 10px 28px color-mix(in srgb, var(--mtd-scheme-primary) 24%, transparent);
}

body.dark-mode:not(.login) .mtd-pricing-container .mtd-pricing-table .price .suffix,
body.dark-mode:not(.login) .pricing_style_2 .mtd-pricing-table .price .suffix {
    color: rgba(226, 232, 240, 0.86) !important;
}

/* Compact homepage TLD tiles and bluish dark card surfaces */
.mtd-domain-home-card .mtd-domain-home-tlds {
    grid-template-columns: repeat(auto-fit, minmax(min(150px, 100%), 1fr)) !important;
    justify-content: stretch;
    align-items: stretch;
}

.mtd-domain-home-card .mtd-domain-home-tld {
    min-height: 66px;
    padding: 0.75rem 0.9rem;
}

@media (max-width: 767.98px) {
    .mtd-domain-home-card .mtd-domain-home-tlds {
        grid-template-columns: repeat(auto-fit, minmax(min(145px, 100%), 1fr)) !important;
    }
}

@media (max-width: 479.98px) {
    .mtd-domain-home-card .mtd-domain-home-tlds {
        grid-template-columns: 1fr !important;
    }
}

body.dark-mode:not(.login) #features-3 .feature-item,
body.dark-mode:not(.login) #stats-4 .feature-item,
body.dark-mode:not(.login) .feature-item.white.has-slider,
body.dark-mode:not(.login) .feature-item.white,
body.dark-mode:not(.login) #order-standard_cart .summary-container,
body.dark-mode:not(.login) #order-standard_cart .secondary-cart-body .product-info,
body.dark-mode:not(.login) #order-standard_cart .marketing-email-optin,
body.dark-mode:not(.login) #order-standard_cart .order-summary .summary-container-outer,
body.dark-mode:not(.login) #order-standard_cart .view-cart-items .item,
body.dark-mode:not(.login) #order-standard_cart .mc-promo,
body.dark-mode:not(.login) #order-standard_cart .mc-promo .body {
    border-color: var(--mtd-dark-card-border) !important;
    background:
        radial-gradient(circle at 88% 0%, color-mix(in srgb, var(--mtd-scheme-primary) 16%, transparent), transparent 36%),
        var(--mtd-dark-card-surface) !important;
    color: var(--mtd-dark-card-text) !important;
    box-shadow: var(--mtd-dark-card-shadow) !important;
}

body.dark-mode:not(.login) #features-3 .feature-item:hover,
body.dark-mode:not(.login) #features-3 .feature-item:focus,
body.dark-mode:not(.login) #features-3 .feature-item:focus-within,
body.dark-mode:not(.login) #stats-4 .feature-item:hover,
body.dark-mode:not(.login) #stats-4 .feature-item:focus,
body.dark-mode:not(.login) #stats-4 .feature-item:focus-within,
body.dark-mode:not(.login) .feature-item.white.has-slider:hover,
body.dark-mode:not(.login) .feature-item.white.has-slider:focus,
body.dark-mode:not(.login) .feature-item.white.has-slider:focus-within,
body.dark-mode:not(.login) .feature-item.white:hover,
body.dark-mode:not(.login) .feature-item.white:focus,
body.dark-mode:not(.login) .feature-item.white:focus-within {
    border-color: color-mix(in srgb, var(--mtd-scheme-primary) 48%, rgba(148, 163, 184, 0.18)) !important;
    background:
        radial-gradient(circle at 88% 0%, color-mix(in srgb, var(--mtd-scheme-primary) 24%, transparent), transparent 38%),
        linear-gradient(145deg, rgba(18, 31, 55, 0.98), rgba(9, 20, 38, 0.96)) !important;
    box-shadow: 0 30px 74px rgba(0, 0, 0, 0.42), 0 0 0 1px color-mix(in srgb, var(--mtd-scheme-primary) 14%, transparent) inset !important;
}

body.dark-mode:not(.login) #features-3 .feature-title,
body.dark-mode:not(.login) #stats-4 .feature-title,
body.dark-mode:not(.login) .feature-item.white .feature-title,
body.dark-mode:not(.login) .feature-item.white.has-slider .feature-title {
    color: #f8fafc !important;
}

body.dark-mode:not(.login) #features-3 .feature-desc,
body.dark-mode:not(.login) #features-3 p,
body.dark-mode:not(.login) #stats-4 .feature-desc,
body.dark-mode:not(.login) #stats-4 p,
body.dark-mode:not(.login) .feature-item.white .feature-desc,
body.dark-mode:not(.login) .feature-item.white p,
body.dark-mode:not(.login) .feature-item.white.has-slider .feature-desc,
body.dark-mode:not(.login) .feature-item.white.has-slider p {
    color: var(--mtd-dark-card-muted) !important;
}

body.dark-mode:not(.login) #features-3 .feature-number,
body.dark-mode:not(.login) #stats-4 .feature-number,
body.dark-mode:not(.login) .feature-item.white .feature-number,
body.dark-mode:not(.login) .feature-item.white.has-slider .feature-number {
    color: color-mix(in srgb, var(--mtd-scheme-primary) 88%, #bfdbfe) !important;
}

body.dark-mode:not(.login) .sec.features.light,
body.dark-mode:not(.login) #sec-3.sec.features {
    border-top: 1px solid rgba(96, 165, 250, 0.12) !important;
    border-bottom-color: rgba(96, 165, 250, 0.14) !important;
    background:
        linear-gradient(118deg,
            color-mix(in srgb, var(--mtd-scheme-primary) 12%, transparent) 0 15%,
            transparent 15% 64%,
            color-mix(in srgb, var(--mtd-scheme-primary-lifted, var(--mtd-scheme-primary)) 10%, transparent) 64% 100%),
        radial-gradient(circle at 18% 22%, color-mix(in srgb, var(--mtd-scheme-primary) 16%, transparent), transparent 34%),
        radial-gradient(circle at 86% 74%, rgba(14, 165, 233, 0.10), transparent 38%),
        linear-gradient(135deg, rgba(8, 17, 31, 0.99) 0%, rgba(13, 30, 57, 0.98) 50%, rgba(6, 18, 34, 0.99) 100%) !important;
    color: var(--mtd-dark-card-text) !important;
}

body.dark-mode:not(.login) .sec.features.light .sec-title,
body.dark-mode:not(.login) #sec-3.sec.features .sec-title {
    color: #f8fafc !important;
}

body.dark-mode:not(.login) .sec.features.light .sub-title,
body.dark-mode:not(.login) .sec.features.light .sec-subtitle,
body.dark-mode:not(.login) .sec.features.light .section-subtitle,
body.dark-mode:not(.login) .sec.features.light > .container > p,
body.dark-mode:not(.login) #sec-3.sec.features .sub-title,
body.dark-mode:not(.login) #sec-3.sec.features .sec-subtitle,
body.dark-mode:not(.login) #sec-3.sec.features .section-subtitle,
body.dark-mode:not(.login) #sec-3.sec.features > .container > p {
    color: var(--mtd-dark-card-muted) !important;
}

body.dark-mode:not(.login) .sec.features.light .sec-caption,
body.dark-mode:not(.login) .sec.features.light .badge,
body.dark-mode:not(.login) .sec.features.light .mtd-badge,
body.dark-mode:not(.login) #sec-3.sec.features .sec-caption,
body.dark-mode:not(.login) #sec-3.sec.features .badge,
body.dark-mode:not(.login) #sec-3.sec.features .mtd-badge {
    border-color: color-mix(in srgb, var(--mtd-scheme-primary) 60%, rgba(148, 163, 184, 0.28)) !important;
    background: rgba(15, 23, 42, 0.56) !important;
    color: #dbeafe !important;
}

/* Homepage testimonials and announcements in bluish dark mode */
body.dark-mode:not(.login) .sec.testimonials.light,
body.dark-mode:not(.login) #sec-5.sec.testimonials {
    border-top: 1px solid rgba(96, 165, 250, 0.12);
    border-bottom: 1px solid rgba(96, 165, 250, 0.12);
    background:
        radial-gradient(circle at 14% 18%, color-mix(in srgb, var(--mtd-scheme-primary) 18%, transparent), transparent 34%),
        radial-gradient(circle at 86% 74%, rgba(14, 165, 233, 0.12), transparent 38%),
        linear-gradient(135deg, rgba(8, 17, 31, 0.99) 0%, rgba(13, 30, 57, 0.98) 48%, rgba(6, 18, 34, 0.99) 100%) !important;
    color: var(--mtd-dark-card-text) !important;
}

body.dark-mode:not(.login) .sec.testimonials .badge,
body.dark-mode:not(.login) .sec.testimonials .mtd-badge {
    border-color: color-mix(in srgb, var(--mtd-scheme-primary) 54%, rgba(148, 163, 184, 0.18)) !important;
    background: rgba(15, 23, 42, 0.62) !important;
    color: #dbeafe !important;
}

body.dark-mode:not(.login) .sec.testimonials .sec-title {
    color: #f8fafc !important;
}

body.dark-mode:not(.login) .sec.testimonials .testimonial-item {
    border-color: var(--mtd-dark-card-border) !important;
    background:
        radial-gradient(circle at 92% 0%, color-mix(in srgb, var(--mtd-scheme-primary) 14%, transparent), transparent 34%),
        linear-gradient(145deg, rgba(15, 23, 42, 0.88), rgba(8, 17, 31, 0.82)) !important;
    color: var(--mtd-dark-card-text) !important;
    box-shadow: 0 24px 70px rgba(0, 0, 0, 0.34), inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
}

body.dark-mode:not(.login) .sec.testimonials .testimonial-item .quote [class*="fa-"] {
    color: color-mix(in srgb, var(--mtd-scheme-primary) 84%, #bfdbfe) !important;
}

body.dark-mode:not(.login) .sec.testimonials .testimonial-item p,
body.dark-mode:not(.login) .sec.testimonials .testimonial-massage,
body.dark-mode:not(.login) .sec.testimonials .author-name-link span {
    color: var(--mtd-dark-card-muted) !important;
}

body.dark-mode:not(.login) .sec.testimonials .author-name-link span:first-child {
    color: #f8fafc !important;
}

body.dark-mode:not(.login) .sec.testimonials .owl-item.center .testimonial-item {
    border-color: color-mix(in srgb, var(--mtd-scheme-primary) 60%, #93c5fd) !important;
    background:
        radial-gradient(circle at 84% 0%, rgba(255, 255, 255, 0.16), transparent 34%),
        linear-gradient(135deg, color-mix(in srgb, var(--mtd-scheme-primary) 92%, #1e293b), color-mix(in srgb, var(--mtd-scheme-primary) 66%, #0f172a)) !important;
    color: #ffffff !important;
    box-shadow: 0 34px 86px color-mix(in srgb, var(--mtd-scheme-primary) 26%, rgba(0, 0, 0, 0.54)) !important;
}

body.dark-mode:not(.login) .sec.testimonials .owl-item.center .testimonial-item p,
body.dark-mode:not(.login) .sec.testimonials .owl-item.center .testimonial-massage,
body.dark-mode:not(.login) .sec.testimonials .owl-item.center .author-name-link span,
body.dark-mode:not(.login) .sec.testimonials .owl-item.center .author-name-link a {
    color: rgba(255, 255, 255, 0.9) !important;
}

body.dark-mode:not(.login) .sec.testimonials .owl-item.center .author-name-link span:first-child,
body.dark-mode:not(.login) .sec.testimonials .owl-item.center .testimonial-item .quote [class*="fa-"] {
    color: #ffffff !important;
}

body.dark-mode:not(.login) .sec.social,
body.dark-mode:not(.login) #sec-7.sec.social {
    border-top: 1px solid rgba(96, 165, 250, 0.12);
    border-bottom: 1px solid rgba(96, 165, 250, 0.14);
    background:
        radial-gradient(circle at 78% 14%, color-mix(in srgb, var(--mtd-scheme-primary) 18%, transparent), transparent 34%),
        radial-gradient(circle at 12% 84%, rgba(14, 165, 233, 0.1), transparent 34%),
        linear-gradient(118deg, rgba(8, 17, 31, 0.99) 0%, rgba(12, 30, 58, 0.98) 44%, rgba(7, 19, 36, 0.99) 100%) !important;
    color: var(--mtd-dark-card-text) !important;
}

body.dark-mode:not(.login) .sec.social .h1,
body.dark-mode:not(.login) .sec.social h1,
body.dark-mode:not(.login) .sec.social h2,
body.dark-mode:not(.login) .sec.social h3,
body.dark-mode:not(.login) .sec.social h4 {
    color: #f8fafc !important;
}

body.dark-mode:not(.login) .sec.social .card.mtd-box,
body.dark-mode:not(.login) .sec.social .card.white,
body.dark-mode:not(.login) #sec-7 .card.mtd-box {
    overflow: hidden;
    border-color: var(--mtd-dark-card-border) !important;
    background:
        radial-gradient(circle at 100% 0%, color-mix(in srgb, var(--mtd-scheme-primary) 16%, transparent), transparent 36%),
        linear-gradient(145deg, rgba(15, 23, 42, 0.94), rgba(8, 17, 31, 0.9)) !important;
    color: var(--mtd-dark-card-text) !important;
    box-shadow: var(--mtd-dark-card-shadow) !important;
}

body.dark-mode:not(.login) .sec.social .card.mtd-box:hover,
body.dark-mode:not(.login) .sec.social .card.white:hover,
body.dark-mode:not(.login) #sec-7 .card.mtd-box:hover {
    border-color: color-mix(in srgb, var(--mtd-scheme-primary) 48%, rgba(148, 163, 184, 0.18)) !important;
    background:
        radial-gradient(circle at 100% 0%, color-mix(in srgb, var(--mtd-scheme-primary) 24%, transparent), transparent 38%),
        linear-gradient(145deg, rgba(18, 31, 55, 0.98), rgba(9, 20, 38, 0.96)) !important;
}

body.dark-mode:not(.login) .sec.social .card.mtd-box .card-body,
body.dark-mode:not(.login) .sec.social .card.white .card-body {
    color: var(--mtd-dark-card-text) !important;
}

body.dark-mode:not(.login) .sec.social .card.mtd-box .text-base,
body.dark-mode:not(.login) .sec.social .card.white .text-base,
body.dark-mode:not(.login) .sec.social .card.mtd-box p,
body.dark-mode:not(.login) .sec.social .card.white p {
    color: var(--mtd-dark-card-muted) !important;
}

body.dark-mode:not(.login) .sec.social .card.mtd-box .card-footer,
body.dark-mode:not(.login) .sec.social .card.white .card-footer {
    border-top: 1px solid rgba(96, 165, 250, 0.14) !important;
}

body.dark-mode:not(.login) .sec.social .card.mtd-box .text-muted,
body.dark-mode:not(.login) .sec.social .card.white .text-muted {
    color: rgba(203, 213, 225, 0.78) !important;
}

/* Serepok header rules */
.section-header.header {
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible;
}

.section-header {
    --serepok-header-bg: var(--app-nav-top-bg, #ffffff);
    --serepok-header-text: var(--app-nav-top-menu-link-color, #3d4966);
    --serepok-header-hover: var(--app-nav-top-menu-link-hover-color, #1989b6);
    --serepok-header-accent: #212121;
    --serepok-header-divider: #e0e0e0;
    --serepok-submenu-bg: #ffffff;
    --serepok-submenu-text: #4d4d4d;
    --serepok-submenu-muted: #808080;
    --serepok-submenu-hover: #f4f8fb;
    --serepok-submenu-icon: var(--mtd-scheme-primary, #377dff);
    --serepok-submenu-icon-bg: var(--mtd-scheme-primary-surface, #f2f6ff);
    --serepok-side-bg: #142033;
    --serepok-side-overlay: rgba(20, 32, 51, 0.28);
    --serepok-header-navbar-height: 60px;
    --serepok-mega-top: 60px;
    width: 100%;
    font-family: "Nunito", sans-serif;
    background: var(--serepok-header-bg);
}

.section-header.serepok-header-color-1 {
    --serepok-header-bg: color-mix(in srgb, var(--mtd-scheme-primary) 50%, #000);
    --serepok-header-text: var(--text-inverted, #ffffff);
    --serepok-header-hover: rgba(255, 255, 255, 0.86);
    --serepok-header-accent: rgba(255, 255, 255, 0.95);
    --serepok-header-divider: rgba(255, 255, 255, 0.22);
}

.section-header.serepok-header-color-2 {
    --serepok-header-bg: #101010;
    --serepok-header-text: var(--text-inverted, #ffffff);
    --serepok-header-hover: rgba(255, 255, 255, 0.86);
    --serepok-header-accent: rgba(255, 255, 255, 0.95);
    --serepok-header-divider: rgba(255, 255, 255, 0.18);
}

.section-header.serepok-submenu-color-1 {
    --serepok-submenu-bg: color-mix(in srgb, var(--mtd-scheme-primary) 52%, #000000);
    --serepok-submenu-text: #ffffff;
    --serepok-submenu-muted: rgba(255, 255, 255, 0.76);
    --serepok-submenu-hover: rgba(255, 255, 255, 0.12);
    --serepok-submenu-icon: #ffffff;
    --serepok-submenu-icon-bg: rgba(255, 255, 255, 0.15);
}

.section-header.serepok-submenu-color-2 {
    --serepok-submenu-bg: #101010;
    --serepok-submenu-text: #ffffff;
    --serepok-submenu-muted: rgba(255, 255, 255, 0.7);
    --serepok-submenu-hover: rgba(255, 255, 255, 0.1);
    --serepok-submenu-icon: #ffffff;
    --serepok-submenu-icon-bg: rgba(255, 255, 255, 0.12);
}

.section-header.serepok-side-color-1 {
    --serepok-side-bg: color-mix(in srgb, var(--mtd-scheme-primary) 52%, #000000);
    --serepok-side-overlay: color-mix(in srgb, var(--mtd-scheme-primary) 24%, transparent);
}

.section-header.serepok-side-color-2 {
    --serepok-side-bg: #101010;
    --serepok-side-overlay: rgba(16, 16, 16, 0.42);
}

body.dark-mode .section-header.serepok-header-color-0 {
    --serepok-header-bg: #111c2f;
    --serepok-header-text: #dce6f4;
    --serepok-header-hover: #ffffff;
    --serepok-header-accent: var(--mtd-scheme-primary, #377dff);
    --serepok-header-divider: #2c3b52;
}

body.dark-mode .section-header.serepok-submenu-color-0 {
    --serepok-submenu-bg: #111c2f;
    --serepok-submenu-text: #e5edf7;
    --serepok-submenu-muted: #9fb0c6;
    --serepok-submenu-hover: rgba(255, 255, 255, 0.08);
    --serepok-submenu-icon: var(--mtd-scheme-primary, #377dff);
    --serepok-submenu-icon-bg: color-mix(in srgb, var(--mtd-scheme-primary, #377dff) 18%, transparent);
}

.section-header .nav-div {
    position: relative;
    z-index: 999;
    border-bottom: 0;
    box-shadow: none;
}

.section-header.serepok-header-shadow .nav-div {
    box-shadow: 0 8px 28px rgba(20, 30, 48, 0.08);
}

.section-header.serepok-header-no-shadow .nav-div,
.section-header.serepok-header-no-shadow #header.sticky {
    box-shadow: none !important;
}

.section-header .navbar,
.section-header #header {
    position: relative;
    display: flex;
    width: 100%;
    min-height: 60px;
    max-width: none;
    align-items: center;
    padding-top: 0;
    padding-bottom: 0;
    z-index: 999;
    background-color: transparent;
    box-shadow: none;
    transform: translateZ(0);
    transition: all 0.5s;
}

.section-header .navbar-brand {
    display: inline-flex;
    align-items: center;
    margin-right: 0;
    min-width: 0;
    max-width: 240px;
    color: var(--serepok-header-text) !important;
    text-decoration: none !important;
    white-space: nowrap;
}

.section-header .serepok-brand-wrap {
    min-width: 0;
}

.section-header .serepok-primary-nav-wrap {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.section-header.serepok-header-nav-right .serepok-brand-wrap {
    flex-grow: 0 !important;
}

.section-header.serepok-header-nav-right .serepok-primary-nav-wrap {
    position: static;
    flex-basis: auto;
    flex-grow: 1;
    justify-content: flex-end;
    margin-left: auto;
    transform: none;
}

.section-header.serepok-header-nav-right #navbarSupportedContent .navbar-nav {
    margin-right: 1rem !important;
}

.section-header .serepok-brand-logo {
    display: block;
    width: auto;
    max-width: 220px;
    max-height: 34px;
    object-fit: contain;
}

.section-header .serepok-brand-logo-dark {
    display: none;
}

.section-header.serepok-header-color-1 .serepok-brand-logo-light,
.section-header.serepok-header-color-2 .serepok-brand-logo-light {
    display: none;
}

.section-header.serepok-header-color-1 .serepok-brand-logo-dark,
.section-header.serepok-header-color-2 .serepok-brand-logo-dark {
    display: block;
}

body.dark-mode .section-header.serepok-header-color-0 .serepok-brand-has-dark-logo .serepok-brand-logo-light {
    display: none;
}

body.dark-mode .section-header.serepok-header-color-0 .serepok-brand-has-dark-logo .serepok-brand-logo-dark {
    display: block;
}

.section-header .serepok-brand-text {
    display: block;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
}

.section-header .navbar-brand:hover,
.section-header .navbar-brand:focus,
.section-header .serepok-brand-text {
    color: var(--serepok-header-text) !important;
}

.section-header #header.sticky {
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    z-index: 1100;
    width: 100%;
    background-color: var(--serepok-header-bg);
    box-shadow: 0 10px 35px rgba(0, 0, 0, 0.08);
    animation: serepokStickyDown 0.35s ease both;
}

.section-header.serepok-header-sticky-disabled #header.sticky {
    position: relative;
    top: auto;
    right: auto;
    left: auto;
    animation: none;
}

@keyframes serepokStickyDown {
    from {
        transform: translate3d(0, -100%, 0);
    }

    to {
        transform: translate3d(0, 0, 0);
    }
}

.section-header .navbar-nav .nav-link,
.section-header #navbarSupportedContent .nav-link {
    position: relative;
    display: inline-flex;
    min-height: auto;
    align-items: center;
    padding: 8px 0.5rem !important;
    color: var(--serepok-header-text) !important;
    font-size: 14px;
    font-weight: normal;
    line-height: 20px;
    white-space: nowrap;
}

.section-header #navbarSupportedContent .navbar-nav {
    align-items: center;
    gap: 0;
}

.section-header #navbarSupportedContent .nav-item {
    display: inline-flex;
    align-items: center;
}

.section-header #navbarSupportedContent .navbar-nav > .nav-item {
    padding: 12px 7px;
}

.section-header #navbarSupportedContent .nav-link > i,
.section-header .sideNavPanel .nav-link > i {
    margin-right: 6px;
}

.section-header #navbarSupportedContent .serepok-nav-separator {
    display: inline-flex;
    width: 1px;
    height: 18px;
    margin: 0 8px;
    padding: 0;
    align-self: center;
    background-color: var(--serepok-header-divider);
    list-style: none;
    pointer-events: none;
}

.section-header .nav-link .link-ext {
    display: inline-block;
    position: absolute;
    bottom: -12px;
    left: 0;
    width: 100%;
    height: 0.0625em;
    min-height: 2px;
    background-color: var(--serepok-header-accent);
    transform: scaleX(0);
    transform-origin: right center;
    transition: transform 0.25s cubic-bezier(0, 0, 0.2, 1);
}

.section-header .nav-link:hover .link-ext,
.section-header .nav-link.active .link-ext,
.section-header .nav-link[aria-expanded="true"] .link-ext {
    transform: scaleX(1);
    transform-origin: left center;
}

.section-header .nav-link:hover .arrow-down,
.section-header .nav-link.active .arrow-down,
.section-header .nav-link[aria-expanded="true"] .arrow-down {
    transform: rotate(180deg);
}

.section-header .arrow-down {
    display: inline-flex;
    width: 9px;
    height: 10px;
    align-items: center;
    justify-content: center;
    margin-left: 8px;
    color: currentColor;
    line-height: 1;
    transition: transform 0.25s cubic-bezier(0, 0, 0.2, 1);
}

.section-header .arrow-down svg {
    display: block !important;
    width: 9px !important;
    min-width: 9px !important;
    max-width: 9px !important;
    height: 10px !important;
    min-height: 10px !important;
    max-height: 10px !important;
    overflow: visible;
    color: currentColor;
}

.section-header .nav-link.dropdown-toggle::after {
    display: none !important;
}

.section-header .serepok-standard-dropdown {
    min-width: 250px;
    margin-top: 10px;
    padding: 8px;
    border: 1px solid color-mix(in srgb, var(--serepok-submenu-text) 9%, transparent);
    border-radius: 8px;
    background: var(--serepok-submenu-bg);
    box-shadow: 0 18px 45px rgba(16, 24, 40, 0.12);
}

.section-header .serepok-standard-dropdown .dropdown-item {
    display: flex;
    min-height: 42px;
    align-items: center;
    gap: 10px;
    padding: 9px 11px;
    border-radius: 6px;
    color: var(--serepok-submenu-text);
    font-size: 13px;
    font-weight: 700;
    line-height: 1.35;
    white-space: normal;
}

.section-header .serepok-standard-dropdown .dropdown-item i {
    flex: 0 0 18px;
    color: var(--serepok-submenu-icon);
    text-align: center;
}

.section-header .serepok-standard-dropdown .dropdown-item:hover,
.section-header .serepok-standard-dropdown .dropdown-item:focus,
.section-header .serepok-standard-dropdown .dropdown-item.active {
    color: var(--serepok-submenu-text);
    background: var(--serepok-submenu-hover);
}

.section-header .serepok-standard-dropdown-child .dropdown-item {
    padding-left: 31px;
    color: var(--serepok-submenu-muted);
    font-weight: 600;
}

body.dark-mode .section-header .serepok-standard-dropdown {
    border-color: #2c3b52;
    box-shadow: 0 18px 45px rgba(0, 0, 0, 0.35);
}

.section-header .serepok-more-nav {
    position: relative;
}

.section-header .serepok-more-nav.d-none {
    display: none !important;
}

.section-header #navbarSupportedContent .serepok-more-nav:not(.d-none)::before {
    content: "";
    display: inline-flex;
    width: 1px;
    height: 18px;
    margin-right: 8px;
    align-self: center;
    background-color: var(--serepok-header-divider);
}

.section-header .serepok-more-menu {
    min-width: 260px;
    max-height: min(70vh, 520px);
    overflow-x: hidden;
    overflow-y: auto;
}

.section-header .serepok-more-menu > .serepok-nav-separator {
    display: none !important;
}

.section-header .serepok-more-menu > .nav-item {
    display: block !important;
    width: 100%;
    padding: 0 !important;
}

.section-header .serepok-more-menu > .nav-item > .nav-link {
    display: flex !important;
    width: 100%;
    min-height: 42px;
    align-items: center;
    justify-content: flex-start;
    gap: 10px;
    padding: 9px 11px !important;
    border-radius: 6px;
    color: var(--serepok-submenu-text) !important;
    font-size: 13px;
    font-weight: 700;
    line-height: 1.35;
    white-space: normal;
}

.section-header .serepok-more-menu > .nav-item > .nav-link:hover,
.section-header .serepok-more-menu > .nav-item > .nav-link:focus,
.section-header .serepok-more-menu > .nav-item.show > .nav-link {
    color: var(--serepok-submenu-text) !important;
    background: var(--serepok-submenu-hover);
}

.section-header .serepok-more-menu > .nav-item > .nav-link .link-ext {
    display: none !important;
}

.section-header .serepok-more-menu > .nav-item > .nav-link > i {
    flex: 0 0 18px;
    margin-right: 0 !important;
    color: var(--serepok-submenu-icon);
    text-align: center;
}

.section-header .serepok-more-menu > .nav-item > .nav-link .arrow-down {
    margin-left: auto;
}

.section-header .serepok-more-menu > .nav-item > .serepok-standard-dropdown {
    position: static !important;
    display: block !important;
    min-width: 0;
    margin: 0 0 8px;
    padding: 0 0 0 24px;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    transform: none !important;
}

.section-header .serepok-more-menu > .nav-item > .serepok-standard-dropdown .dropdown-item {
    min-height: 36px;
    padding: 7px 11px;
    color: var(--serepok-submenu-muted);
    font-weight: 600;
}

.section-header .serepok-menu-toggle {
    display: inline-flex;
    width: 42px;
    height: 42px;
    align-items: center;
    justify-content: center;
    padding: 0;
    border: 0 !important;
    border-radius: 8px;
    color: var(--serepok-header-text);
    background: transparent;
    box-shadow: none;
}

.section-header .serepok-menu-toggle:focus {
    outline: none;
    box-shadow: 0 0 0 3px rgba(var(--mtd-scheme-primary-rgb, 25, 137, 182), 0.18);
}

.section-header .serepok-menu-toggle-icon {
    font-size: 22px;
    line-height: 1;
}

@media (min-width: 1200px) {
    .section-header .serepok-menu-toggle {
        display: none !important;
    }
}

body.dark-mode .section-header,
body.dark-mode .section-header .nav-div,
body.dark-mode .section-header #header,
body.dark-mode .section-header #header.sticky {
    background: var(--serepok-header-bg) !important;
}

body.dark-mode .section-header .nav-link,
body.dark-mode .section-header .serepok-brand-text {
    color: var(--serepok-header-text) !important;
}

.section-header .nav-item-right {
    display: flex;
    width: auto;
    min-width: 72px;
    height: 30px;
    align-items: center;
    justify-content: center;
    margin: 0 4px;
}

.section-header .navbar-end .navbar-nav {
    flex-wrap: nowrap;
    align-items: center;
}

.section-header .nav-item-right a,
.section-header .nav-item-right label {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--serepok-header-text);
    font-size: 14px;
    font-weight: normal !important;
    text-decoration: none;
    white-space: nowrap;
    transition: all 0.5s;
}

.section-header .nav-link-right,
.section-header .nav-link-right.promo,
.section-header .nav-link-right.portfolio,
.section-header .nav-link-right.support,
.section-header .nav-link-right.cart,
.section-header .nav-link-right.alerts,
.section-header .nav-link-right.language,
.section-header .nav-link-right.register,
.section-header .nav-link-right.login,
.section-header .nav-link-right.admin-return,
.section-header .serepok-theme-toggle {
    min-width: 0 !important;
    min-height: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

.section-header .nav-item-right a svg,
.section-header .nav-item-right label svg {
    display: block;
    flex: 0 0 auto;
}

.section-header .nav-item-right a i,
.section-header .nav-item-right label i {
    display: block;
    flex: 0 0 auto;
    font-size: 15px;
    line-height: 1;
}

.section-header .nav-item-right:hover a,
.section-header .nav-item-right:hover label {
    color: var(--serepok-header-hover);
}

.section-header .nav-item-right a span,
.section-header .nav-item-right label span {
    position: relative;
}

.section-header .nav-item-right a span::after,
.section-header .nav-item-right label span::after {
    content: "";
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    height: 2px;
    border-radius: 2px;
    background: var(--serepok-header-accent);
    transform: scaleX(0);
    transform-origin: right;
    transition: transform 0.5s cubic-bezier(0, 0, 0.2, 1);
}

.section-header .nav-item-right a:hover span::after,
.section-header .nav-item-right label:hover span::after {
    transform: scaleX(1);
    transform-origin: left;
}

.section-header .nav-link-right .badge,
.section-header .nav-link-right .iti-flag,
.section-header .serepok-theme-toggle-icon {
    flex: 0 0 auto;
}

.section-header .nav-link-right .badge::after,
.section-header .nav-link-right .iti-flag::after,
.section-header .serepok-theme-toggle-icon::after,
.section-header .serepok-navbar-end-menu span::after {
    display: none;
}

.section-header .nav-link-right.language,
.section-header .nav-link-right.language:hover,
.section-header .nav-link-right.language:focus {
    position: relative;
    text-decoration: none !important;
}

.section-header .nav-link-right.language span::after {
    display: none !important;
}

.section-header .nav-link-right.language::after {
    content: "";
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    height: 2px;
    border-radius: 2px;
    background: var(--serepok-header-accent);
    transform: scaleX(0);
    transform-origin: right;
    transition: transform 0.5s cubic-bezier(0, 0, 0.2, 1);
}

.section-header .nav-link-right.language:hover::after,
.section-header .nav-link-right.language:focus::after {
    transform: scaleX(1);
    transform-origin: left;
}

.section-header .serepok-theme-toggle {
    position: relative;
    margin: 0;
    cursor: pointer;
}

.section-header .serepok-theme-toggle input {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    border: 0 !important;
    opacity: 0 !important;
    pointer-events: none !important;
    appearance: none !important;
    -webkit-appearance: none !important;
    clip: rect(0 0 0 0) !important;
    clip-path: inset(50%) !important;
}

.section-header .serepok-theme-toggle-icon {
    display: inline-flex;
    width: 16px;
    height: 16px;
    align-items: center;
    justify-content: center;
}

.section-header .serepok-theme-icon {
    position: absolute;
    transition: opacity 0.25s ease, transform 0.25s ease;
}

.section-header .serepok-theme-icon-moon {
    opacity: 0;
    transform: scale(0.7) rotate(-35deg);
}

.section-header .serepok-theme-toggle input:checked + .serepok-theme-toggle-icon .serepok-theme-icon-sun,
body.dark-mode .section-header .serepok-theme-icon-sun {
    opacity: 0;
    transform: scale(0.7) rotate(35deg);
}

.section-header .serepok-theme-toggle input:checked + .serepok-theme-toggle-icon .serepok-theme-icon-moon,
body.dark-mode .section-header .serepok-theme-icon-moon {
    opacity: 1;
    transform: scale(1) rotate(0deg);
}

.section-header .serepok-navbar-end-menu {
    min-width: 220px;
    margin-top: 10px;
    padding: 8px 0;
    border: 0;
    border-radius: 8px;
    box-shadow: 0 12px 30px rgba(20, 30, 48, 0.14);
}

.section-header .serepok-alerts-menu {
    min-width: 300px;
}

.section-header .serepok-navbar-end-menu .dropdown-header {
    display: flex;
    gap: 8px;
    align-items: center;
    color: #7b8499;
    font-size: 13px;
    font-weight: 600;
}

.section-header .serepok-navbar-end-menu .dropdown-item {
    display: flex;
    width: 100%;
    gap: 8px;
    align-items: center;
    justify-content: flex-start;
    padding: 8px 16px;
    color: #3d4966;
    font-size: 13px;
    line-height: 1.35;
    text-align: left;
}

.section-header .serepok-navbar-end-menu .dropdown-item:hover,
.section-header .serepok-navbar-end-menu .dropdown-item:focus {
    color: #1989b6;
    background: #f4f8fb;
}

body.dark-mode .section-header .serepok-navbar-end-menu {
    color: #e5edf7;
    background: #111c2f;
    border: 1px solid #2c3b52;
    box-shadow: 0 18px 45px rgba(0, 0, 0, 0.35);
}

body.dark-mode .section-header .serepok-navbar-end-menu .dropdown-header {
    color: #9fb0c6;
}

body.dark-mode .section-header .serepok-navbar-end-menu .dropdown-item {
    color: #dce6f4;
    background: transparent;
}

body.dark-mode .section-header .serepok-navbar-end-menu .dropdown-item:hover,
body.dark-mode .section-header .serepok-navbar-end-menu .dropdown-item:focus {
    color: #ffffff;
    background: rgba(255, 255, 255, 0.08);
}

body.dark-mode .section-header .nav-item-right a,
body.dark-mode .section-header .nav-item-right label {
    color: var(--serepok-header-text) !important;
}

.section-header .sideNavPanel {
    position: fixed;
    top: 0;
    right: 0;
    z-index: 999;
    display: flex;
    width: 100%;
    height: 100vh;
    justify-content: right;
    visibility: visible;
    pointer-events: auto;
    background-color: rgba(13, 88, 98, 0);
    opacity: 1;
    transform: translateX(100%);
    transform-origin: right center;
    transition: all 0.5s;
}

.section-header .sideNavPanel.active {
    background-color: var(--serepok-side-overlay);
    transform: translateX(0);
}

.section-header .sideNavPanel .sideNavContent {
    position: static;
    width: 80%;
    height: 100%;
    padding-top: 50px;
    overflow-x: hidden;
    overflow-y: auto;
    background-color: var(--serepok-side-bg);
    box-shadow: none;
    transform: none;
}

.section-header .sideNavPanel .sideNavContent .closebtn {
    position: absolute;
    top: 2px;
    right: 35px;
    width: auto;
    height: auto;
    color: #ffffff;
    font-size: 40px;
    line-height: normal;
    text-decoration: none;
}

.section-header .sideNavPanel .sideNavContent .navbar-nav {
    width: 100%;
    padding: 1.1rem 0.35rem 1.5rem;
}

.section-header .sideNavPanel .sideNavContent .navbar-nav > .nav-item:first-child {
    border-top: 0.02rem solid rgba(255, 255, 255, 0.08);
}

.section-header .sideNavPanel .sideNavContent .navbar-nav > .nav-item {
    width: 100%;
    border-bottom: 0.02rem solid rgba(255, 255, 255, 0.08);
}

.section-header .sideNavPanel .sideNavContent .navbar-nav > .nav-item > .nav-link {
    position: relative;
    display: block;
    width: 100%;
    padding-left: 0.5rem;
    font-size: 15px;
    line-height: 2.5rem;
}

.section-header .sideNavPanel .sideNavContent .navbar-nav > .nav-item > .nav-link > .show-hide-icon {
    float: right;
    margin-right: 0.2rem;
    color: #ffffff;
    font-size: 18px;
    opacity: 0.7;
    transition: 0.5s;
}

.section-header .sideNavPanel .sideNavContent .navbar-nav > .nav-item > .nav-link > .show-hide-icon.show {
    transform: rotate(90deg);
}

.section-header .sideNavPanel .sideNavContent .navbar-nav > .nav-item > .sub-menu {
    display: none;
    margin: 0;
    padding-bottom: 1rem;
    padding-left: 2rem;
}

.section-header .sideNavPanel .sideNavContent .navbar-nav > .nav-item > .sub-menu.is-open {
    display: block;
}

.section-header .sideNavPanel .sideNavContent .navbar-nav > .nav-item > .sub-menu > li {
    line-height: 2.2rem;
    list-style-type: none;
}

.section-header .sideNavPanel .sideNavContent .navbar-nav > .nav-item > .sub-menu > li a {
    display: block;
    height: 100%;
    color: #ffffff;
    font-size: 14px;
    font-weight: 200;
    text-decoration: none;
}

.section-header .serepok-mega-layer {
    position: fixed;
    top: var(--serepok-mega-top, var(--serepok-header-navbar-height, 60px));
    right: 0;
    left: 0;
    z-index: 998;
    height: calc(100vh - var(--serepok-mega-top, var(--serepok-header-navbar-height, 60px)));
    overflow: hidden;
    pointer-events: none;
}

.section-header .mega-menu {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    width: 100%;
    max-height: calc(100vh - var(--serepok-mega-top, var(--serepok-header-navbar-height, 60px)));
    margin-top: 0;
    padding-top: 0;
    overflow-y: auto;
    border-bottom: 1px solid #e0e0e0;
    color: var(--serepok-submenu-text);
    background: var(--serepok-submenu-bg);
    box-shadow: none;
    pointer-events: none;
    transform: translate3d(0, calc(-100% - 2px), 0);
    transform-origin: top center;
    transition: transform 0.7s;
}

.section-header .mega-menu.show {
    pointer-events: auto;
    opacity: 1;
    background-color: var(--serepok-submenu-bg);
    box-shadow: 0 10px 70px 0 rgba(0, 0, 0, 0.1);
    backdrop-filter: blur(3px);
    transform: translateY(0);
    transition: transform 0.7s;
}

body.dark-mode .section-header .mega-menu {
    border-bottom-color: #2c3b52;
}

body.dark-mode .section-header .mega-menu.show {
    box-shadow: 0 18px 70px rgba(0, 0, 0, 0.35);
}

.section-header .mega-menu .block-content {
    min-height: 300px;
    padding: 15px;
    box-sizing: border-box;
}

.section-header .mega-menu .block-content .contents {
    transition: all 0.3s;
}

.section-header .mega-menu .block-content .contents:hover {
    background: var(--serepok-submenu-hover);
    border-radius: 5px;
    cursor: pointer;
}

.section-header .mega-menu .block-content .contents a {
    color: inherit;
    text-decoration: none;
}

.section-header .mega-menu .block-content .icon-wrap img {
    width: 35px;
}

.section-header .mega-menu .block-content .icon-wrap i {
    display: inline-flex;
    width: 35px;
    height: 35px;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    color: var(--serepok-submenu-icon);
    background: var(--serepok-submenu-icon-bg);
    font-size: 17px;
}

.section-header .mega-menu .block-content .content-wrap h3 {
    display: inline-block;
    margin: 0 0 0.7em;
    color: var(--serepok-submenu-text);
    font-size: 13px;
    font-weight: 700 !important;
    line-height: 1.5em;
}

.section-header .mega-menu .block-content .content-wrap p {
    color: var(--serepok-submenu-muted);
    font-size: 13px;
}

.section-header .mega-menu .serepok-mega-groups {
    align-items: stretch;
    row-gap: 16px;
}

.section-header .mega-menu .serepok-mega-group.contents {
    padding: 0 8px;
    margin-bottom: 0;
}

.section-header .mega-menu .serepok-mega-group.contents:hover {
    background: transparent;
    cursor: default;
}

.section-header .mega-menu .serepok-mega-group-inner {
    height: 100%;
    padding: 8px 4px 4px;
    border-radius: 6px;
    transition: background-color 0.3s ease;
}

.section-header .mega-menu .serepok-mega-group-inner:hover {
    background: transparent;
}

.section-header .mega-menu .serepok-mega-group-heading {
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 34px;
    margin-bottom: 10px;
    padding: 0 0 8px;
    border: 0;
    border-bottom: 1px solid color-mix(in srgb, var(--serepok-submenu-icon) 18%, transparent);
    border-radius: 0;
    color: inherit;
    background: transparent;
    box-shadow: none;
    text-decoration: none;
}

.section-header .mega-menu .serepok-mega-group-heading:hover {
    color: var(--serepok-submenu-icon);
    border-bottom-color: color-mix(in srgb, var(--serepok-submenu-icon) 42%, transparent);
    background: transparent;
    box-shadow: none;
    text-decoration: none;
}

.section-header .mega-menu .serepok-mega-group-copy {
    min-width: 0;
}

.section-header .mega-menu .serepok-mega-group-note {
    margin: 6px 0 12px 36px;
    color: var(--serepok-submenu-muted);
    font-size: 13px;
    line-height: 1.5;
}

.section-header .mega-menu .serepok-mega-group-note .mtd-mega-subtitle,
.section-header .mega-menu .serepok-mega-group-note .mtd-mega-custom-html {
    margin: 0;
    color: inherit;
}

.section-header .mega-menu .serepok-mega-group-title {
    font-size: 12px;
    font-weight: 800 !important;
    line-height: 1.3;
    letter-spacing: 0;
    text-transform: uppercase;
}

.section-header .mega-menu .block-content .serepok-mega-group-heading .content-wrap h3.serepok-mega-group-title {
    margin: 0;
    font-size: 12px;
    font-weight: 800 !important;
    line-height: 1.3;
    letter-spacing: 0;
    text-transform: uppercase;
}

.section-header .mega-menu .serepok-mega-group-heading .icon-wrap i {
    width: 26px;
    height: 26px;
    border: 1px solid color-mix(in srgb, var(--serepok-submenu-icon) 18%, transparent);
    border-radius: 7px;
    color: var(--serepok-submenu-icon);
    background: color-mix(in srgb, var(--serepok-submenu-icon) 8%, transparent);
    box-shadow: none;
    font-size: 13px;
}

.section-header .mega-menu .serepok-mega-group-heading:hover .icon-wrap i {
    border-color: color-mix(in srgb, var(--serepok-submenu-icon) 32%, transparent);
    background: color-mix(in srgb, var(--serepok-submenu-icon) 14%, transparent);
}

.section-header .mega-menu .serepok-mega-banner {
    padding: 0 8px;
    margin-bottom: 0;
}

.section-header .mega-menu .serepok-mega-banner-inner {
    height: 100%;
    min-height: 220px;
    overflow: hidden;
    border: 1px solid color-mix(in srgb, var(--serepok-submenu-text) 9%, transparent);
    border-radius: 8px;
    background: color-mix(in srgb, var(--serepok-submenu-bg) 72%, var(--serepok-submenu-hover));
    box-shadow: 0 18px 45px rgba(16, 24, 40, 0.08);
    transition: border-color 0.25s ease, box-shadow 0.25s ease, transform 0.25s ease;
}

.section-header .mega-menu .serepok-mega-banner-inner:hover {
    border-color: color-mix(in srgb, var(--serepok-submenu-icon) 28%, transparent);
    box-shadow: 0 22px 55px rgba(16, 24, 40, 0.12);
}

.section-header .mega-menu .serepok-mega-banner-link,
.section-header .mega-menu .serepok-mega-banner-link:hover,
.section-header .mega-menu .serepok-mega-banner-fallback,
.section-header .mega-menu .serepok-mega-banner-fallback:hover {
    display: flex;
    min-height: 220px;
    height: 100%;
    color: inherit;
    text-decoration: none;
}

.section-header .mega-menu .serepok-mega-banner-html,
.section-header .mega-menu .serepok-mega-banner-html .mtd-mega-custom-html {
    color: var(--serepok-submenu-muted);
    font-size: 13px;
    line-height: 1.5;
}

.section-header .mega-menu .serepok-mega-banner-html {
    display: block;
    width: 100%;
    height: 100%;
    min-height: 220px;
}

.section-header .mega-menu .serepok-mega-banner-html .mtd-mega-custom-html {
    width: 100%;
    height: 100%;
    min-height: 220px;
    padding: 22px;
}

.section-header .mega-menu .serepok-mega-banner-html:not(:has(img)) .mtd-mega-custom-html {
    background: linear-gradient(145deg, color-mix(in srgb, var(--serepok-submenu-icon) 88%, #0f172a), color-mix(in srgb, var(--serepok-submenu-icon) 45%, #0f172a));
    color: #ffffff;
}

.section-header .mega-menu .serepok-mega-banner-html:not(:has(img)) .mtd-mega-custom-html h1,
.section-header .mega-menu .serepok-mega-banner-html:not(:has(img)) .mtd-mega-custom-html h2,
.section-header .mega-menu .serepok-mega-banner-html:not(:has(img)) .mtd-mega-custom-html h3,
.section-header .mega-menu .serepok-mega-banner-html:not(:has(img)) .mtd-mega-custom-html h4,
.section-header .mega-menu .serepok-mega-banner-html:not(:has(img)) .mtd-mega-custom-html h5,
.section-header .mega-menu .serepok-mega-banner-html:not(:has(img)) .mtd-mega-custom-html h6,
.section-header .mega-menu .serepok-mega-banner-html:not(:has(img)) .mtd-mega-custom-html p {
    color: #ffffff;
}

.section-header .mega-menu .serepok-mega-banner-html:has(img),
.section-header .mega-menu .serepok-mega-banner-html:has(img) .mtd-mega-custom-html,
.section-header .mega-menu .serepok-mega-banner-html:has(img) a {
    height: 100%;
    min-height: 220px;
    padding: 0;
}

.section-header .mega-menu .serepok-mega-banner-html h1,
.section-header .mega-menu .serepok-mega-banner-html h2,
.section-header .mega-menu .serepok-mega-banner-html h3,
.section-header .mega-menu .serepok-mega-banner-html h4,
.section-header .mega-menu .serepok-mega-banner-html h5,
.section-header .mega-menu .serepok-mega-banner-html h6 {
    margin: 0 0 8px;
    color: var(--serepok-submenu-text);
    font-weight: 700;
    line-height: 1.25;
}

.section-header .mega-menu .serepok-mega-banner-html p {
    margin: 0 0 10px;
    color: var(--serepok-submenu-muted);
}

.section-header .mega-menu .serepok-mega-banner-html a {
    color: inherit;
    text-decoration: none;
}

.section-header .mega-menu .serepok-mega-banner-html img {
    display: block;
    width: 100%;
    max-width: 100%;
    height: 100%;
    min-height: 220px;
    object-fit: cover;
    border-radius: 0;
}

.section-header .mega-menu .serepok-mega-banner-fallback {
    align-items: center;
    gap: 14px;
    padding: 16px;
}

.section-header .mega-menu .serepok-mega-banner-title {
    display: block;
    color: var(--serepok-submenu-text);
    font-size: 15px;
    font-weight: 700;
    line-height: 1.35;
}

.section-header .mega-menu .serepok-mega-group-links {
    display: grid;
    gap: 4px;
    margin-top: 10px;
    padding-left: 0;
}

.section-header .mega-menu .serepok-mega-link,
.section-header .mega-menu .serepok-mega-fallback-group .mtd-mega-link {
    display: grid;
    grid-template-columns: 32px minmax(0, 1fr) 10px;
    align-items: center;
    column-gap: 9px;
    margin-left: 0;
    padding: 9px 8px;
    border-radius: 6px;
    color: inherit;
    text-decoration: none;
    transition: background-color 0.3s ease, color 0.3s ease;
}

.section-header .mega-menu .serepok-mega-link:hover,
.section-header .mega-menu .serepok-mega-fallback-group .mtd-mega-link:hover {
    background: var(--serepok-submenu-hover);
    color: inherit;
    text-decoration: none;
}

.section-header .mega-menu .serepok-mega-link-icon i,
.section-header .mega-menu .mtd-mega-link-icon i {
    display: inline-flex;
    width: 32px;
    height: 32px;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    color: var(--serepok-submenu-icon);
    background: var(--serepok-submenu-icon-bg);
    font-size: 17px;
}

.section-header .mega-menu .serepok-mega-group-heading .icon-wrap i {
    width: 26px;
    height: 26px;
}

.section-header .mega-menu .serepok-mega-inline-layout {
    row-gap: 10px;
}

.section-header .mega-menu .serepok-mega-inline-layout .serepok-mega-group.contents {
    flex: 0 0 100%;
    max-width: 100%;
}

.section-header .mega-menu .serepok-mega-inline-layout .serepok-mega-group-inner {
    padding: 0;
}

.section-header .mega-menu .serepok-mega-inline-layout .serepok-mega-group-heading {
    max-width: 420px;
    margin-bottom: 14px;
}

.section-header .mega-menu .serepok-mega-inline-layout .serepok-mega-group-note {
    max-width: 760px;
    margin: -4px 0 16px 54px;
}

.section-header .mega-menu .serepok-mega-inline-layout .serepok-mega-group-links {
    grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    gap: 10px;
}

.section-header .mega-menu .serepok-mega-inline-layout .serepok-mega-link,
.section-header .mega-menu .serepok-mega-inline-layout .serepok-mega-fallback-group .mtd-mega-link {
    min-height: 58px;
    padding: 12px;
    border: 1px solid color-mix(in srgb, var(--serepok-submenu-icon) 10%, transparent);
    background: color-mix(in srgb, var(--serepok-submenu-bg) 78%, var(--serepok-submenu-hover));
}

.section-header .mega-menu .serepok-mega-inline-layout .serepok-mega-link:hover,
.section-header .mega-menu .serepok-mega-inline-layout .serepok-mega-fallback-group .mtd-mega-link:hover {
    border-color: color-mix(in srgb, var(--serepok-submenu-icon) 28%, transparent);
    background: var(--serepok-submenu-hover);
}

.section-header .mega-menu .serepok-mega-flat-links .serepok-mega-group.contents {
    flex: 0 0 auto;
    width: auto;
    max-width: none;
    min-width: min(260px, 100%);
}

.section-header .mega-menu .serepok-mega-flat-links .serepok-mega-group-heading {
    min-height: 58px;
    margin: 0;
    padding: 12px 16px 12px 12px;
    border: 1px solid color-mix(in srgb, var(--serepok-submenu-icon) 10%, transparent);
    border-radius: 8px;
    background: color-mix(in srgb, var(--serepok-submenu-bg) 78%, var(--serepok-submenu-hover));
}

.section-header .mega-menu .serepok-mega-flat-links .serepok-mega-group-heading:hover {
    border-color: color-mix(in srgb, var(--serepok-submenu-icon) 28%, transparent);
    background: var(--serepok-submenu-hover);
}

.section-header .mega-menu .serepok-mega-flat-links .serepok-mega-group-title {
    font-size: 13px;
    text-transform: none;
}

.section-header .mega-menu .serepok-mega-flat-links .serepok-mega-group-inner {
    height: auto;
}

.section-header .mega-menu .serepok-mega-link-title,
.section-header .mega-menu .mtd-mega-link-title {
    display: block;
    color: var(--serepok-submenu-text);
    font-size: 13px;
    font-weight: 700;
    line-height: 1.4;
}

.section-header .mega-menu .serepok-mega-link-note,
.section-header .mega-menu .mtd-mega-link-note {
    display: block;
    margin-top: 2px;
    color: var(--serepok-submenu-muted);
    font-size: 12px;
    line-height: 1.4;
}

.section-header .mega-menu .serepok-mega-link-arrow,
.section-header .mega-menu .mtd-mega-link-arrow {
    color: var(--serepok-submenu-icon);
    font-size: 12px;
    opacity: 0.8;
}

.section-header .mega-menu .mtd-mega-fallback-links {
    display: contents;
}

@media (max-width: 767px) {
    .section-header .mega-menu .serepok-mega-group.contents {
        padding: 0;
    }
}

.video-overlay {
    position: fixed;
    z-index: -1;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: rgba(0, 0, 0, 0.8);
    opacity: 0;
    transition: all ease 500ms;
}

.video-overlay.open {
    position: fixed;
    z-index: 1000;
    opacity: 1;
}

.video-overlay-close {
    position: absolute;
    z-index: 1000;
    top: 15px;
    right: 20px;
    color: #ffffff;
    font-size: 36px;
    font-weight: 400;
    line-height: 1;
    text-decoration: none;
    cursor: pointer;
    transition: all 200ms;
}

.video-overlay-close:hover {
    color: #fa183d;
}

.video-overlay iframe {
    position: absolute;
    top: 50%;
    left: 50%;
    box-shadow: 0 0 15px rgba(0, 0, 0, 0.75);
    transform: translateX(-50%) translateY(-50%);
}

/* Auth page final alignment and dark-mode fixes */
#wrapper.mtd-login-background,
body.dark-mode #wrapper.mtd-login-background,
body.dark-mode #wrapper.mtd-register-screen,
body.dark-mode #wrapper.mtd-reset-screen {
    background: transparent !important;
}

#wrapper.mtd-register-screen .mtd-register-visual {
    position: relative !important;
    top: auto !important;
    height: auto !important;
    min-height: 650px !important;
    max-height: none !important;
    align-self: stretch !important;
    justify-content: flex-start !important;
}

#wrapper.mtd-register-screen .mtd-register-visual-copy {
    margin-top: clamp(48px, 7vh, 72px) !important;
}

#wrapper.mtd-register-screen .mtd-register-story,
#wrapper.mtd-register-screen .mtd-register-steps {
    margin-top: clamp(28px, 5vh, 48px) !important;
}

#wrapper.mtd-register-screen .mtd-register-security-note {
    margin-top: clamp(28px, 5vh, 52px) !important;
}

#wrapper.mtd-reset-screen .mtd-reset-visual::after,
#wrapper.mtd-login-background .mtd-reset-visual::after {
    content: "" !important;
    display: block !important;
    position: absolute !important;
    inset: -36% -28% !important;
    border: 0 !important;
    pointer-events: none !important;
    opacity: 0.58 !important;
    mix-blend-mode: screen !important;
    background:
        linear-gradient(110deg, transparent 0 44%, rgba(255, 255, 255, 0) 44.15%, rgba(255, 255, 255, 0.66) 44.48%, rgba(255, 255, 255, 0.12) 45.25%, transparent 46.05% 100%) -280px -560px / 360px 620px no-repeat,
        linear-gradient(110deg, transparent 0 52%, color-mix(in srgb, var(--mtd-scheme-accent) 44%, rgba(255, 255, 255, 0.35)) 52.32%, rgba(255, 255, 255, 0.08) 53.15%, transparent 54% 100%) 80px -500px / 420px 680px no-repeat,
        linear-gradient(110deg, transparent 0 38%, rgba(255, 255, 255, 0.48) 38.35%, rgba(255, 255, 255, 0.08) 38.9%, transparent 39.55% 100%) 360px -640px / 300px 620px no-repeat,
        linear-gradient(110deg, transparent 0 58%, rgba(255, 255, 255, 0.36) 58.3%, transparent 59.1% 100%) 520px -460px / 320px 580px no-repeat !important;
    animation: mtd-auth-bar-rain 4.8s linear infinite !important;
}

body.dark-mode #wrapper.mtd-register-screen #registration .panel-switch {
    border-color: color-mix(in srgb, var(--mtd-scheme-primary) 28%, rgba(148, 163, 184, 0.2)) !important;
    background:
        radial-gradient(circle at 100% 0%, color-mix(in srgb, var(--mtd-scheme-primary) 16%, transparent), transparent 38%),
        rgba(15, 23, 42, 0.88) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
}

body.dark-mode #wrapper.mtd-register-screen #registration .panel-switch .panel-body {
    color: #dce6f4 !important;
}

body.dark-mode #wrapper.mtd-register-screen #registration .panel-switch .switch-label {
    color: #e8f0fb !important;
}

#wrapper.mtd-register-screen #registration .panel-switch .switch {
    position: relative !important;
    display: inline-block !important;
    flex: 0 0 50px !important;
    width: 50px !important;
    height: 24px !important;
    margin: 0 !important;
    overflow: hidden !important;
    vertical-align: middle !important;
}

#wrapper.mtd-register-screen #registration .panel-switch .switch__checkbox {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    border: 0 !important;
    opacity: 0 !important;
    pointer-events: none !important;
    appearance: none !important;
    -webkit-appearance: none !important;
    clip: rect(0 0 0 0) !important;
    clip-path: inset(50%) !important;
}

#wrapper.mtd-register-screen #registration .panel-switch .switch__container {
    display: block !important;
}

body.dark-mode #wrapper.mtd-register-screen #registration .panel-switch .switch__container {
    border: 1px solid rgba(148, 163, 184, 0.24) !important;
    background: #1e293b !important;
    box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.34) !important;
}

body.dark-mode #wrapper.mtd-register-screen #registration .panel-switch .switch__checkbox:checked + .switch__container {
    border-color: color-mix(in srgb, var(--mtd-scheme-primary) 76%, #93c5fd) !important;
    background: var(--mtd-scheme-primary) !important;
    box-shadow: 0 10px 24px color-mix(in srgb, var(--mtd-scheme-primary) 24%, transparent) !important;
}

body.dark-mode #wrapper.mtd-register-screen #registration .panel-switch .switch__container::after {
    color: #ffffff !important;
}

body.dark-mode #wrapper.mtd-register-screen #registration .panel-switch .switch__handle {
    background: #ffffff !important;
    box-shadow: 0 4px 12px rgba(2, 6, 23, 0.34) !important;
}

@media (max-width: 1199.98px) {
    #wrapper.mtd-register-screen .mtd-register-visual {
        position: relative !important;
        top: auto !important;
        max-height: none;
    }
}

/* Modern dark light-section and FAQ surfaces */
body.dark-mode:not(.login) .light:not(.mtd-modern-domain-hero),
body.dark-mode:not(.login) .well,
body.dark-mode:not(.login) .landing-page .light-grey-bg,
body.dark-mode:not(.login) .landing-page .detailed-info,
body.dark-mode:not(.login) .landing-page .pricing-item {
    border-color: rgba(96, 165, 250, 0.14) !important;
    background:
        radial-gradient(circle at 84% 12%, color-mix(in srgb, var(--mtd-scheme-primary) 14%, transparent), transparent 32%),
        radial-gradient(circle at 12% 82%, rgba(20, 184, 166, 0.08), transparent 34%),
        linear-gradient(135deg, #071120 0%, #0e1d35 52%, #08111f 100%) !important;
    color: #e8f0fb !important;
}

body.dark-mode:not(.login) .sec.faqs,
body.dark-mode:not(.login) .sec.faq,
body.dark-mode:not(.login) .landing-page .faqs,
body.dark-mode:not(.login) .landing-page .faq {
    border-color: rgba(96, 165, 250, 0.12) !important;
    background:
        radial-gradient(circle at 78% 16%, color-mix(in srgb, var(--mtd-scheme-primary) 13%, transparent), transparent 34%),
        radial-gradient(circle at 18% 78%, rgba(14, 165, 233, 0.09), transparent 36%),
        linear-gradient(135deg, #071120 0%, #0f213d 50%, #08111f 100%) !important;
    color: #e8f0fb !important;
}

body.dark-mode:not(.login) .sec.faqs .sec-title,
body.dark-mode:not(.login) .sec.faq .sec-title,
body.dark-mode:not(.login) .landing-page .faqs .sec-title,
body.dark-mode:not(.login) .landing-page .faq .sec-title {
    color: #f8fafc !important;
}

body.dark-mode:not(.login) .sec.faqs .card-faqs-group .card,
body.dark-mode:not(.login) .sec.faq .card-faqs-group .card,
body.dark-mode:not(.login) .landing-page .faqs .card-faqs-group .card,
body.dark-mode:not(.login) .landing-page .faq .card-faqs-group .card,
body.dark-mode:not(.login) .landing-page .faq .panel-group .panel.panel-default,
body.dark-mode:not(.login) .landing-page .faqs .panel-group .panel.panel-default {
    overflow: hidden !important;
    border: 1px solid rgba(96, 165, 250, 0.22) !important;
    border-radius: 14px !important;
    background:
        radial-gradient(circle at 100% 0%, color-mix(in srgb, var(--mtd-scheme-primary) 10%, transparent), transparent 38%),
        linear-gradient(145deg, rgba(15, 28, 52, 0.96), rgba(8, 17, 31, 0.94)) !important;
    color: #e8f0fb !important;
    box-shadow: 0 18px 46px rgba(0, 0, 0, 0.24), inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
}

body.dark-mode:not(.login) .sec.faqs .card-faqs-group .card + .card,
body.dark-mode:not(.login) .sec.faq .card-faqs-group .card + .card {
    margin-top: 12px !important;
}

body.dark-mode:not(.login) .sec.faqs .card-faqs-group .card-header,
body.dark-mode:not(.login) .sec.faq .card-faqs-group .card-header,
body.dark-mode:not(.login) .landing-page .faqs .card-faqs-group .card-header,
body.dark-mode:not(.login) .landing-page .faq .card-faqs-group .card-header,
body.dark-mode:not(.login) .landing-page .faq .panel-group .panel.panel-default .panel-heading,
body.dark-mode:not(.login) .landing-page .faqs .panel-group .panel.panel-default .panel-heading {
    border-color: rgba(96, 165, 250, 0.18) !important;
    background:
        linear-gradient(135deg, rgba(20, 37, 66, 0.98), rgba(11, 24, 45, 0.98)) !important;
    color: #e8f0fb !important;
}

body.dark-mode:not(.login) .sec.faqs .card-faqs-group .card-header .btn,
body.dark-mode:not(.login) .sec.faq .card-faqs-group .card-header .btn,
body.dark-mode:not(.login) .landing-page .faqs .card-faqs-group .card-header .btn,
body.dark-mode:not(.login) .landing-page .faq .card-faqs-group .card-header .btn,
body.dark-mode:not(.login) .landing-page .faq .panel-group .panel.panel-default .panel-heading .panel-title,
body.dark-mode:not(.login) .landing-page .faqs .panel-group .panel.panel-default .panel-heading .panel-title {
    color: #e8f0fb !important;
    text-decoration: none !important;
}

body.dark-mode:not(.login) .sec.faqs .card-faqs-group .card-header .btn:hover,
body.dark-mode:not(.login) .sec.faq .card-faqs-group .card-header .btn:hover,
body.dark-mode:not(.login) .landing-page .faqs .card-faqs-group .card-header .btn:hover,
body.dark-mode:not(.login) .landing-page .faq .card-faqs-group .card-header .btn:hover {
    background: color-mix(in srgb, var(--mtd-scheme-primary) 12%, transparent) !important;
    color: #ffffff !important;
}

body.dark-mode:not(.login) .sec.faqs .card-faqs-group .card-title,
body.dark-mode:not(.login) .sec.faq .card-faqs-group .card-title,
body.dark-mode:not(.login) .sec.faqs .card-faqs-group .card-icon,
body.dark-mode:not(.login) .sec.faq .card-faqs-group .card-icon,
body.dark-mode:not(.login) .landing-page .faqs .card-faqs-group .card-title,
body.dark-mode:not(.login) .landing-page .faq .card-faqs-group .card-title,
body.dark-mode:not(.login) .landing-page .faqs .card-faqs-group .card-icon,
body.dark-mode:not(.login) .landing-page .faq .card-faqs-group .card-icon {
    color: inherit !important;
}

body.dark-mode:not(.login) .sec.faqs .card-faqs-group .card-body,
body.dark-mode:not(.login) .sec.faq .card-faqs-group .card-body,
body.dark-mode:not(.login) .landing-page .faqs .card-faqs-group .card-body,
body.dark-mode:not(.login) .landing-page .faq .card-faqs-group .card-body,
body.dark-mode:not(.login) .landing-page .faq .panel-group .panel.panel-default .panel-body,
body.dark-mode:not(.login) .landing-page .faqs .panel-group .panel.panel-default .panel-body {
    border-color: rgba(96, 165, 250, 0.14) !important;
    background: rgba(8, 17, 31, 0.72) !important;
    color: rgba(226, 232, 240, 0.82) !important;
}

body.dark-mode:not(.login) .sec.faqs .card-faqs-group .card-body p,
body.dark-mode:not(.login) .sec.faq .card-faqs-group .card-body p,
body.dark-mode:not(.login) .landing-page .faqs .card-faqs-group .card-body p,
body.dark-mode:not(.login) .landing-page .faq .card-faqs-group .card-body p,
body.dark-mode:not(.login) .landing-page .faq .panel-group .panel.panel-default .panel-body p,
body.dark-mode:not(.login) .landing-page .faqs .panel-group .panel.panel-default .panel-body p {
    color: rgba(226, 232, 240, 0.82) !important;
}
/* End modern dark light-section and FAQ surfaces */

/* Modern dark bordered site banners */
body.dark-mode:not(.login) .site-banner .banner_body.border-bottom:not(.light):not(.graphics):not(.inverse):not(.mtd-has-type-1-background):not(.mtd-has-youtube-background) {
    border-color: rgba(96, 165, 250, 0.12) !important;
    border-bottom-color: rgba(96, 165, 250, 0.16) !important;
    background:
        radial-gradient(circle at 82% 18%, color-mix(in srgb, var(--mtd-scheme-primary) 13%, transparent), transparent 34%),
        radial-gradient(circle at 14% 76%, rgba(20, 184, 166, 0.08), transparent 36%),
        linear-gradient(135deg, #071120 0%, #0e1d35 50%, #08111f 100%) !important;
    color: #e8f0fb !important;
}

body.dark-mode:not(.login) .site-banner .banner_body.border-bottom:not(.light):not(.graphics):not(.inverse):not(.mtd-has-type-1-background):not(.mtd-has-youtube-background) .banner-title,
body.dark-mode:not(.login) .site-banner .banner_body.border-bottom:not(.light):not(.graphics):not(.inverse):not(.mtd-has-type-1-background):not(.mtd-has-youtube-background) .sec-title,
body.dark-mode:not(.login) .site-banner .banner_body.border-bottom:not(.light):not(.graphics):not(.inverse):not(.mtd-has-type-1-background):not(.mtd-has-youtube-background) h1,
body.dark-mode:not(.login) .site-banner .banner_body.border-bottom:not(.light):not(.graphics):not(.inverse):not(.mtd-has-type-1-background):not(.mtd-has-youtube-background) h2,
body.dark-mode:not(.login) .site-banner .banner_body.border-bottom:not(.light):not(.graphics):not(.inverse):not(.mtd-has-type-1-background):not(.mtd-has-youtube-background) h3 {
    color: #f8fafc !important;
}

body.dark-mode:not(.login) .site-banner .banner_body.border-bottom:not(.light):not(.graphics):not(.inverse):not(.mtd-has-type-1-background):not(.mtd-has-youtube-background) p,
body.dark-mode:not(.login) .site-banner .banner_body.border-bottom:not(.light):not(.graphics):not(.inverse):not(.mtd-has-type-1-background):not(.mtd-has-youtube-background) .banner-subtitle,
body.dark-mode:not(.login) .site-banner .banner_body.border-bottom:not(.light):not(.graphics):not(.inverse):not(.mtd-has-type-1-background):not(.mtd-has-youtube-background) .sec-subtitle {
    color: rgba(226, 232, 240, 0.82) !important;
}
/* End modern dark bordered site banners */
/* Modern global phone selector */
body:not(.login) .intl-tel-input,
body:not(.login) .iti,
#wrapper.mtd-register-screen .intl-tel-input,
#wrapper.mtd-register-screen .iti {
    --mtd-phone-prefix-width: 126px;
    position: relative !important;
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    color: #111827;
}

body:not(.login) .intl-tel-input.intl-tel-input > input.form-control[type="tel"],
body:not(.login) .intl-tel-input.intl-tel-input > input[type="tel"],
body:not(.login) .iti.iti > input.form-control[type="tel"],
body:not(.login) .iti.iti > input[type="tel"],
#wrapper.mtd-register-screen .intl-tel-input > input.form-control[type="tel"],
#wrapper.mtd-register-screen .intl-tel-input > input[type="tel"],
#wrapper.mtd-register-screen .iti > input.form-control[type="tel"],
#wrapper.mtd-register-screen .iti > input[type="tel"] {
    width: 100% !important;
    max-width: none !important;
    min-height: 54px !important;
    height: 54px !important;
    margin: 0 !important;
    padding: 0 16px 0 calc(var(--mtd-phone-prefix-width, 126px) + 14px) !important;
    color: #111827 !important;
    background: #ffffff !important;
    border: 1px solid #d9e2ef !important;
    border-radius: 8px !important;
    box-shadow: 0 8px 24px rgba(15, 23, 42, 0.035) !important;
    font-size: 0.98rem !important;
    font-weight: 650 !important;
    line-height: 1.3 !important;
    letter-spacing: 0 !important;
    transition: border-color .2s ease, box-shadow .2s ease, background .2s ease !important;
}

body:not(.login) .intl-tel-input.intl-tel-input > input.form-control[type="tel"]:focus,
body:not(.login) .intl-tel-input.intl-tel-input > input[type="tel"]:focus,
body:not(.login) .iti.iti > input.form-control[type="tel"]:focus,
body:not(.login) .iti.iti > input[type="tel"]:focus,
#wrapper.mtd-register-screen .intl-tel-input > input.form-control[type="tel"]:focus,
#wrapper.mtd-register-screen .intl-tel-input > input[type="tel"]:focus,
#wrapper.mtd-register-screen .iti > input.form-control[type="tel"]:focus,
#wrapper.mtd-register-screen .iti > input[type="tel"]:focus {
    border-color: var(--mtd-scheme-primary) !important;
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--mtd-scheme-primary) 12%, transparent) !important;
    outline: 0 !important;
}

body:not(.login) .intl-tel-input .flag-container,
body:not(.login) .iti .iti__flag-container,
#wrapper.mtd-register-screen .intl-tel-input .flag-container,
#wrapper.mtd-register-screen .iti .iti__flag-container {
    position: absolute !important;
    top: 0 !important;
    right: auto !important;
    bottom: 0 !important;
    left: 0 !important;
    z-index: 5 !important;
    width: var(--mtd-phone-prefix-width, 126px) !important;
    max-width: var(--mtd-phone-prefix-width, 126px) !important;
    padding: 0 !important;
    border: 0 !important;
    overflow: visible !important;
}

body:not(.login) .intl-tel-input .selected-flag,
body:not(.login) .intl-tel-input.separate-dial-code .selected-flag,
body:not(.login) .intl-tel-input.allow-dropdown .selected-flag,
body:not(.login) .iti .iti__selected-flag,
body:not(.login) .iti--separate-dial-code .iti__selected-flag,
#wrapper.mtd-register-screen .intl-tel-input .selected-flag,
#wrapper.mtd-register-screen .intl-tel-input.separate-dial-code .selected-flag,
#wrapper.mtd-register-screen .intl-tel-input.allow-dropdown .selected-flag,
#wrapper.mtd-register-screen .iti .iti__selected-flag,
#wrapper.mtd-register-screen .iti--separate-dial-code .iti__selected-flag {
    position: relative !important;
    display: flex !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    height: 100% !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 12px 0 16px !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 10px !important;
    overflow: hidden !important;
    color: #111827 !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 8px 0 0 8px !important;
    box-shadow: none !important;
    box-sizing: border-box !important;
    cursor: pointer !important;
    transition: color .18s ease, background .18s ease !important;
}

body:not(.login) .intl-tel-input.allow-dropdown .flag-container:hover .selected-flag,
body:not(.login) .intl-tel-input .selected-flag:focus,
body:not(.login) .iti .iti__selected-flag:hover,
body:not(.login) .iti .iti__selected-flag:focus,
#wrapper.mtd-register-screen .intl-tel-input.allow-dropdown .flag-container:hover .selected-flag,
#wrapper.mtd-register-screen .intl-tel-input .selected-flag:focus,
#wrapper.mtd-register-screen .iti .iti__selected-flag:hover,
#wrapper.mtd-register-screen .iti .iti__selected-flag:focus {
    color: var(--mtd-scheme-primary) !important;
    background: color-mix(in srgb, var(--mtd-scheme-primary) 6%, transparent) !important;
    outline: 0 !important;
}

body:not(.login) .iti-flag,
body:not(.login) .iti__flag,
#wrapper.mtd-register-screen .iti-flag,
#wrapper.mtd-register-screen .iti__flag {
    width: 20px !important;
    min-width: 20px !important;
    height: 15px !important;
    background-image: url("../img/flags.svg") !important;
    background-repeat: no-repeat !important;
    background-size: 5630px 15px !important;
    background-color: transparent !important;
    border-radius: 3px !important;
    box-shadow: 0 0 0 1px rgba(15, 23, 42, 0.12) !important;
}

body:not(.login) .selected-flag .iti-flag,
body:not(.login) .iti__selected-flag .iti__flag,
#wrapper.mtd-register-screen .selected-flag .iti-flag,
#wrapper.mtd-register-screen .iti__selected-flag .iti__flag {
    position: relative !important;
    top: auto !important;
    right: auto !important;
    bottom: auto !important;
    left: auto !important;
    flex: 0 0 20px !important;
    margin: 0 !important;
}

body:not(.login) .intl-tel-input .selected-dial-code,
body:not(.login) .intl-tel-input.separate-dial-code .selected-dial-code,
body:not(.login) .iti .iti__selected-dial-code,
body:not(.login) .iti--separate-dial-code .iti__selected-dial-code,
#wrapper.mtd-register-screen .intl-tel-input .selected-dial-code,
#wrapper.mtd-register-screen .intl-tel-input.separate-dial-code .selected-dial-code,
#wrapper.mtd-register-screen .iti .iti__selected-dial-code,
#wrapper.mtd-register-screen .iti--separate-dial-code .iti__selected-dial-code {
    display: inline-flex !important;
    min-width: 0 !important;
    padding: 0 !important;
    align-items: center !important;
    color: inherit !important;
    font-size: 0.98rem !important;
    font-weight: 750 !important;
    line-height: 1 !important;
    letter-spacing: 0 !important;
    white-space: nowrap !important;
}

body:not(.login) .intl-tel-input .selected-flag .iti-arrow,
body:not(.login) .iti .iti__arrow,
#wrapper.mtd-register-screen .intl-tel-input .selected-flag .iti-arrow,
#wrapper.mtd-register-screen .iti .iti__arrow {
    position: static !important;
    display: block !important;
    width: 0 !important;
    height: 0 !important;
    margin: 1px 0 0 auto !important;
    border-right: 4px solid transparent !important;
    border-left: 4px solid transparent !important;
    border-top: 5px solid #64748b !important;
}

body:not(.login) .intl-tel-input .selected-flag .iti-arrow.up,
body:not(.login) .iti .iti__arrow--up,
body:not(.login) .iti .iti__arrow.up,
#wrapper.mtd-register-screen .intl-tel-input .selected-flag .iti-arrow.up,
#wrapper.mtd-register-screen .iti .iti__arrow--up,
#wrapper.mtd-register-screen .iti .iti__arrow.up {
    border-top: 0 !important;
    border-bottom: 5px solid #64748b !important;
}

body:not(.login) .intl-tel-input .country-list,
body:not(.login) .iti .iti__country-list,
#wrapper.mtd-register-screen .intl-tel-input .country-list,
#wrapper.mtd-register-screen .iti .iti__country-list {
    z-index: 10040 !important;
    width: min(520px, calc(100vw - 40px)) !important;
    min-width: min(100%, 340px) !important;
    max-width: min(520px, calc(100vw - 40px)) !important;
    max-height: min(360px, 52vh) !important;
    margin: 8px 0 0 !important;
    padding: 8px !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    color: #111827 !important;
    background: #ffffff !important;
    border: 1px solid #d9e2ef !important;
    border-radius: 10px !important;
    box-shadow: 0 24px 50px rgba(15, 23, 42, 0.16) !important;
    white-space: normal !important;
}

body:not(.login) .intl-tel-input .country-list.dropup,
body:not(.login) .iti .iti__country-list--dropup,
#wrapper.mtd-register-screen .intl-tel-input .country-list.dropup,
#wrapper.mtd-register-screen .iti .iti__country-list--dropup {
    margin-top: 0 !important;
    margin-bottom: 8px !important;
}

body:not(.login) .intl-tel-input .country-list .country,
body:not(.login) .iti .iti__country,
#wrapper.mtd-register-screen .intl-tel-input .country-list .country,
#wrapper.mtd-register-screen .iti .iti__country {
    display: flex !important;
    min-height: 42px !important;
    padding: 8px 10px !important;
    align-items: center !important;
    gap: 10px !important;
    color: #111827 !important;
    background: transparent !important;
    border-radius: 8px !important;
    font-size: 0.94rem !important;
    font-weight: 650 !important;
    line-height: 1.25 !important;
    cursor: pointer !important;
    white-space: normal !important;
}

body:not(.login) .intl-tel-input .country-list .country:hover,
body:not(.login) .intl-tel-input .country-list .country.highlight,
body:not(.login) .intl-tel-input .country-list .country.active,
body:not(.login) .iti .iti__country:hover,
body:not(.login) .iti .iti__country.iti__highlight,
body:not(.login) .iti .iti__country.iti__active,
#wrapper.mtd-register-screen .intl-tel-input .country-list .country:hover,
#wrapper.mtd-register-screen .intl-tel-input .country-list .country.highlight,
#wrapper.mtd-register-screen .intl-tel-input .country-list .country.active,
#wrapper.mtd-register-screen .iti .iti__country:hover,
#wrapper.mtd-register-screen .iti .iti__country.iti__highlight,
#wrapper.mtd-register-screen .iti .iti__country.iti__active {
    color: #0f172a !important;
    background: color-mix(in srgb, var(--mtd-scheme-primary) 9%, #ffffff) !important;
}

body:not(.login) .intl-tel-input .country-list .flag-box,
body:not(.login) .iti .iti__flag-box,
#wrapper.mtd-register-screen .intl-tel-input .country-list .flag-box,
#wrapper.mtd-register-screen .iti .iti__flag-box {
    display: inline-flex !important;
    width: 28px !important;
    min-width: 28px !important;
    margin: 0 !important;
    justify-content: center !important;
}

body:not(.login) .intl-tel-input .country-list .country-name,
body:not(.login) .iti .iti__country-name,
#wrapper.mtd-register-screen .intl-tel-input .country-list .country-name,
#wrapper.mtd-register-screen .iti .iti__country-name {
    min-width: 0 !important;
    margin: 0 !important;
    flex: 1 1 auto !important;
    overflow: hidden !important;
    color: inherit !important;
    text-overflow: ellipsis !important;
}

body:not(.login) .intl-tel-input .country-list .dial-code,
body:not(.login) .iti .iti__dial-code,
#wrapper.mtd-register-screen .intl-tel-input .country-list .dial-code,
#wrapper.mtd-register-screen .iti .iti__dial-code {
    flex: 0 0 auto !important;
    margin-left: auto !important;
    padding-left: 14px !important;
    color: #64748b !important;
    font-weight: 750 !important;
}

body:not(.login) .intl-tel-input .country-list .divider,
body:not(.login) .iti .iti__divider,
#wrapper.mtd-register-screen .intl-tel-input .country-list .divider,
#wrapper.mtd-register-screen .iti .iti__divider {
    height: 1px !important;
    margin: 7px 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: #d9e2ef !important;
}

body.dark-mode:not(.login) .intl-tel-input,
body.dark-mode:not(.login) .iti,
body.dark-mode #wrapper.mtd-register-screen .intl-tel-input,
body.dark-mode #wrapper.mtd-register-screen .iti {
    color: #f8fafc;
}

body.dark-mode:not(.login) .intl-tel-input.intl-tel-input > input.form-control[type="tel"],
body.dark-mode:not(.login) .intl-tel-input.intl-tel-input > input[type="tel"],
body.dark-mode:not(.login) .iti.iti > input.form-control[type="tel"],
body.dark-mode:not(.login) .iti.iti > input[type="tel"],
body.dark-mode #wrapper.mtd-register-screen .intl-tel-input > input.form-control[type="tel"],
body.dark-mode #wrapper.mtd-register-screen .intl-tel-input > input[type="tel"],
body.dark-mode #wrapper.mtd-register-screen .iti > input.form-control[type="tel"],
body.dark-mode #wrapper.mtd-register-screen .iti > input[type="tel"] {
    color: #f8fafc !important;
    background: rgba(20, 32, 52, 0.92) !important;
    border-color: rgba(96, 165, 250, 0.22) !important;
    box-shadow: none !important;
}

body.dark-mode:not(.login) .intl-tel-input .selected-flag,
body.dark-mode:not(.login) .intl-tel-input.separate-dial-code .selected-flag,
body.dark-mode:not(.login) .intl-tel-input.allow-dropdown .selected-flag,
body.dark-mode:not(.login) .iti .iti__selected-flag,
body.dark-mode:not(.login) .iti--separate-dial-code .iti__selected-flag,
body.dark-mode #wrapper.mtd-register-screen .intl-tel-input .selected-flag,
body.dark-mode #wrapper.mtd-register-screen .intl-tel-input.separate-dial-code .selected-flag,
body.dark-mode #wrapper.mtd-register-screen .intl-tel-input.allow-dropdown .selected-flag,
body.dark-mode #wrapper.mtd-register-screen .iti .iti__selected-flag,
body.dark-mode #wrapper.mtd-register-screen .iti--separate-dial-code .iti__selected-flag {
    color: #f8fafc !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

body.dark-mode:not(.login) .intl-tel-input.allow-dropdown .flag-container:hover .selected-flag,
body.dark-mode:not(.login) .intl-tel-input .selected-flag:focus,
body.dark-mode:not(.login) .iti .iti__selected-flag:hover,
body.dark-mode:not(.login) .iti .iti__selected-flag:focus,
body.dark-mode #wrapper.mtd-register-screen .intl-tel-input.allow-dropdown .flag-container:hover .selected-flag,
body.dark-mode #wrapper.mtd-register-screen .intl-tel-input .selected-flag:focus,
body.dark-mode #wrapper.mtd-register-screen .iti .iti__selected-flag:hover,
body.dark-mode #wrapper.mtd-register-screen .iti .iti__selected-flag:focus {
    color: #ffffff !important;
    background: rgba(96, 165, 250, 0.08) !important;
}

body.dark-mode:not(.login) .intl-tel-input .selected-dial-code,
body.dark-mode:not(.login) .intl-tel-input.separate-dial-code .selected-dial-code,
body.dark-mode:not(.login) .iti .iti__selected-dial-code,
body.dark-mode:not(.login) .iti--separate-dial-code .iti__selected-dial-code,
body.dark-mode #wrapper.mtd-register-screen .intl-tel-input .selected-dial-code,
body.dark-mode #wrapper.mtd-register-screen .intl-tel-input.separate-dial-code .selected-dial-code,
body.dark-mode #wrapper.mtd-register-screen .iti .iti__selected-dial-code,
body.dark-mode #wrapper.mtd-register-screen .iti--separate-dial-code .iti__selected-dial-code {
    color: #f8fafc !important;
}

body.dark-mode:not(.login) .intl-tel-input .selected-flag .iti-arrow,
body.dark-mode:not(.login) .iti .iti__arrow,
body.dark-mode #wrapper.mtd-register-screen .intl-tel-input .selected-flag .iti-arrow,
body.dark-mode #wrapper.mtd-register-screen .iti .iti__arrow {
    border-top-color: #8fb4ea !important;
}

body.dark-mode:not(.login) .intl-tel-input .selected-flag .iti-arrow.up,
body.dark-mode:not(.login) .iti .iti__arrow--up,
body.dark-mode:not(.login) .iti .iti__arrow.up,
body.dark-mode #wrapper.mtd-register-screen .intl-tel-input .selected-flag .iti-arrow.up,
body.dark-mode #wrapper.mtd-register-screen .iti .iti__arrow--up,
body.dark-mode #wrapper.mtd-register-screen .iti .iti__arrow.up {
    border-bottom-color: #8fb4ea !important;
}

body.dark-mode:not(.login) .intl-tel-input .country-list,
body.dark-mode:not(.login) .iti .iti__country-list,
body.dark-mode #wrapper.mtd-register-screen .intl-tel-input .country-list,
body.dark-mode #wrapper.mtd-register-screen .iti .iti__country-list {
    color: #e8f0fb !important;
    background: #101d31 !important;
    border-color: rgba(96, 165, 250, 0.24) !important;
    box-shadow: 0 26px 64px rgba(0, 0, 0, 0.34) !important;
}

body.dark-mode:not(.login) .intl-tel-input .country-list .country,
body.dark-mode:not(.login) .iti .iti__country,
body.dark-mode #wrapper.mtd-register-screen .intl-tel-input .country-list .country,
body.dark-mode #wrapper.mtd-register-screen .iti .iti__country {
    color: #dbe7f6 !important;
    background: transparent !important;
}

body.dark-mode:not(.login) .intl-tel-input .country-list .country:hover,
body.dark-mode:not(.login) .intl-tel-input .country-list .country.highlight,
body.dark-mode:not(.login) .intl-tel-input .country-list .country.active,
body.dark-mode:not(.login) .iti .iti__country:hover,
body.dark-mode:not(.login) .iti .iti__country.iti__highlight,
body.dark-mode:not(.login) .iti .iti__country.iti__active,
body.dark-mode #wrapper.mtd-register-screen .intl-tel-input .country-list .country:hover,
body.dark-mode #wrapper.mtd-register-screen .intl-tel-input .country-list .country.highlight,
body.dark-mode #wrapper.mtd-register-screen .intl-tel-input .country-list .country.active,
body.dark-mode #wrapper.mtd-register-screen .iti .iti__country:hover,
body.dark-mode #wrapper.mtd-register-screen .iti .iti__country.iti__highlight,
body.dark-mode #wrapper.mtd-register-screen .iti .iti__country.iti__active {
    color: #ffffff !important;
    background: rgba(37, 99, 235, 0.24) !important;
}

body.dark-mode:not(.login) .intl-tel-input .country-list .dial-code,
body.dark-mode:not(.login) .iti .iti__dial-code,
body.dark-mode #wrapper.mtd-register-screen .intl-tel-input .country-list .dial-code,
body.dark-mode #wrapper.mtd-register-screen .iti .iti__dial-code {
    color: #a9bad1 !important;
}

body.dark-mode:not(.login) .intl-tel-input .country-list .divider,
body.dark-mode:not(.login) .iti .iti__divider,
body.dark-mode #wrapper.mtd-register-screen .intl-tel-input .country-list .divider,
body.dark-mode #wrapper.mtd-register-screen .iti .iti__divider {
    background: rgba(96, 165, 250, 0.2) !important;
}

@media (max-width: 575.98px) {
    body:not(.login) .intl-tel-input,
    body:not(.login) .iti,
    #wrapper.mtd-register-screen .intl-tel-input,
    #wrapper.mtd-register-screen .iti {
        --mtd-phone-prefix-width: 114px;
    }

    body:not(.login) .intl-tel-input.intl-tel-input > input.form-control[type="tel"],
    body:not(.login) .intl-tel-input.intl-tel-input > input[type="tel"],
    body:not(.login) .iti.iti > input.form-control[type="tel"],
    body:not(.login) .iti.iti > input[type="tel"],
    #wrapper.mtd-register-screen .intl-tel-input > input.form-control[type="tel"],
    #wrapper.mtd-register-screen .intl-tel-input > input[type="tel"],
    #wrapper.mtd-register-screen .iti > input.form-control[type="tel"],
    #wrapper.mtd-register-screen .iti > input[type="tel"] {
        padding-right: 14px !important;
        padding-left: calc(var(--mtd-phone-prefix-width, 114px) + 12px) !important;
    }

    body:not(.login) .intl-tel-input .country-list,
    body:not(.login) .iti .iti__country-list,
    #wrapper.mtd-register-screen .intl-tel-input .country-list,
    #wrapper.mtd-register-screen .iti .iti__country-list {
        width: calc(100vw - 28px) !important;
        min-width: min(100%, 280px) !important;
        max-width: calc(100vw - 28px) !important;
    }
}

body.dark-mode #wrapper.mtd-register-screen #registration .mtd-register-phone-field .country-list,
body.dark-mode #wrapper.mtd-register-screen #registration .mtd-register-phone-field .iti__country-list {
    color: #e8f0fb !important;
    background: #101d31 !important;
    border-color: rgba(96, 165, 250, 0.24) !important;
    box-shadow: 0 26px 64px rgba(0, 0, 0, 0.34) !important;
}

body.dark-mode #wrapper.mtd-register-screen #registration .mtd-register-phone-field .country-list .country,
body.dark-mode #wrapper.mtd-register-screen #registration .mtd-register-phone-field .iti__country {
    color: #dbe7f6 !important;
    background: transparent !important;
}

body.dark-mode #wrapper.mtd-register-screen #registration .mtd-register-phone-field .country-list .country:hover,
body.dark-mode #wrapper.mtd-register-screen #registration .mtd-register-phone-field .country-list .country.highlight,
body.dark-mode #wrapper.mtd-register-screen #registration .mtd-register-phone-field .country-list .country.active,
body.dark-mode #wrapper.mtd-register-screen #registration .mtd-register-phone-field .iti__country:hover,
body.dark-mode #wrapper.mtd-register-screen #registration .mtd-register-phone-field .iti__country.iti__highlight,
body.dark-mode #wrapper.mtd-register-screen #registration .mtd-register-phone-field .iti__country.iti__active {
    color: #ffffff !important;
    background: rgba(37, 99, 235, 0.24) !important;
}

body.dark-mode #wrapper.mtd-register-screen #registration .mtd-register-phone-field .country-list .dial-code,
body.dark-mode #wrapper.mtd-register-screen #registration .mtd-register-phone-field .iti__dial-code {
    color: #a9bad1 !important;
}

body.dark-mode #wrapper.mtd-register-screen #registration .mtd-register-phone-field .country-list .divider,
body.dark-mode #wrapper.mtd-register-screen #registration .mtd-register-phone-field .iti__divider {
    background: rgba(96, 165, 250, 0.2) !important;
}
/* End modern global phone selector */

/* Final phone selector polish */
body.dark-mode #wrapper.mtd-register-screen #registration .mtd-register-phone-field .intl-tel-input,
body.dark-mode #wrapper.mtd-register-screen #registration .mtd-register-phone-field .iti,
body.dark-mode:not(.login) .intl-tel-input,
body.dark-mode:not(.login) .iti {
    color-scheme: dark;
}

body.dark-mode #wrapper.mtd-register-screen #registration .mtd-register-phone-field .intl-tel-input > input#inputPhone,
body.dark-mode #wrapper.mtd-register-screen #registration .mtd-register-phone-field .iti > input#inputPhone {
    background: rgba(20, 32, 52, 0.92) !important;
    border-color: rgba(96, 165, 250, 0.22) !important;
    color: #f8fafc !important;
}

body.dark-mode #wrapper.mtd-register-screen #registration .mtd-register-phone-field .intl-tel-input .selected-flag,
body.dark-mode #wrapper.mtd-register-screen #registration .mtd-register-phone-field .intl-tel-input.separate-dial-code .selected-flag,
body.dark-mode #wrapper.mtd-register-screen #registration .mtd-register-phone-field .intl-tel-input.allow-dropdown .selected-flag,
body.dark-mode #wrapper.mtd-register-screen #registration .mtd-register-phone-field .iti .iti__selected-flag,
body.dark-mode #wrapper.mtd-register-screen #registration .mtd-register-phone-field .iti--separate-dial-code .iti__selected-flag,
body.dark-mode #wrapper.mtd-register-screen #registration .mtd-register-phone-field .flag-container:hover .selected-flag,
body.dark-mode #wrapper.mtd-register-screen #registration .mtd-register-phone-field .selected-flag:focus,
body.dark-mode #wrapper.mtd-register-screen #registration .mtd-register-phone-field .iti__selected-flag:hover,
body.dark-mode #wrapper.mtd-register-screen #registration .mtd-register-phone-field .iti__selected-flag:focus {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    border: 0 !important;
    box-shadow: none !important;
    color: #f8fafc !important;
}

body.dark-mode #wrapper.mtd-register-screen #registration .mtd-register-phone-field .selected-dial-code,
body.dark-mode #wrapper.mtd-register-screen #registration .mtd-register-phone-field .iti__selected-dial-code {
    color: #f8fafc !important;
}

body.dark-mode #wrapper.mtd-register-screen #registration .mtd-register-phone-field .country-list,
body.dark-mode #wrapper.mtd-register-screen #registration .mtd-register-phone-field .iti__country-list {
    color-scheme: dark;
    scrollbar-color: rgba(96, 165, 250, 0.44) rgba(9, 17, 31, 0.88);
    scrollbar-width: thin;
    color: #e8f0fb !important;
    background: #101d31 !important;
    background-color: #101d31 !important;
    background-image: none !important;
    border-color: rgba(96, 165, 250, 0.24) !important;
    box-shadow: 0 26px 64px rgba(0, 0, 0, 0.34) !important;
}

body.dark-mode #wrapper.mtd-register-screen #registration .mtd-register-phone-field .country-list::-webkit-scrollbar,
body.dark-mode #wrapper.mtd-register-screen #registration .mtd-register-phone-field .iti__country-list::-webkit-scrollbar {
    width: 10px;
}

body.dark-mode #wrapper.mtd-register-screen #registration .mtd-register-phone-field .country-list::-webkit-scrollbar-track,
body.dark-mode #wrapper.mtd-register-screen #registration .mtd-register-phone-field .iti__country-list::-webkit-scrollbar-track {
    background: rgba(9, 17, 31, 0.88);
    border-radius: 999px;
}

body.dark-mode #wrapper.mtd-register-screen #registration .mtd-register-phone-field .country-list::-webkit-scrollbar-thumb,
body.dark-mode #wrapper.mtd-register-screen #registration .mtd-register-phone-field .iti__country-list::-webkit-scrollbar-thumb {
    background: rgba(96, 165, 250, 0.44);
    border: 2px solid rgba(9, 17, 31, 0.88);
    border-radius: 999px;
}

body.dark-mode #wrapper.mtd-register-screen #registration .mtd-register-phone-field .country-list .country,
body.dark-mode #wrapper.mtd-register-screen #registration .mtd-register-phone-field .iti__country {
    color: #dbe7f6 !important;
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
}

body.dark-mode #wrapper.mtd-register-screen #registration .mtd-register-phone-field .country-list .country:hover,
body.dark-mode #wrapper.mtd-register-screen #registration .mtd-register-phone-field .country-list .country.highlight,
body.dark-mode #wrapper.mtd-register-screen #registration .mtd-register-phone-field .country-list .country.active,
body.dark-mode #wrapper.mtd-register-screen #registration .mtd-register-phone-field .country-list .country.preferred.active,
body.dark-mode #wrapper.mtd-register-screen #registration .mtd-register-phone-field .country-list .country.preferred.highlight,
body.dark-mode #wrapper.mtd-register-screen #registration .mtd-register-phone-field .country-list .country.preferred.active.highlight,
body.dark-mode #wrapper.mtd-register-screen #registration .mtd-register-phone-field .iti__country:hover,
body.dark-mode #wrapper.mtd-register-screen #registration .mtd-register-phone-field .iti__country.iti__highlight,
body.dark-mode #wrapper.mtd-register-screen #registration .mtd-register-phone-field .iti__country.iti__active,
body.dark-mode #wrapper.mtd-register-screen #registration .mtd-register-phone-field .iti__country.iti__preferred.iti__active,
body.dark-mode #wrapper.mtd-register-screen #registration .mtd-register-phone-field .iti__country.iti__preferred.iti__highlight,
body.dark-mode #wrapper.mtd-register-screen #registration .mtd-register-phone-field .iti__country.iti__preferred.iti__active.iti__highlight {
    color: #ffffff !important;
    background: rgba(37, 99, 235, 0.24) !important;
    background-color: rgba(37, 99, 235, 0.24) !important;
    background-image: none !important;
}

body.dark-mode #wrapper.mtd-register-screen #registration .mtd-register-phone-field .country-list .country:hover .dial-code,
body.dark-mode #wrapper.mtd-register-screen #registration .mtd-register-phone-field .country-list .country.highlight .dial-code,
body.dark-mode #wrapper.mtd-register-screen #registration .mtd-register-phone-field .country-list .country.active .dial-code,
body.dark-mode #wrapper.mtd-register-screen #registration .mtd-register-phone-field .iti__country:hover .iti__dial-code,
body.dark-mode #wrapper.mtd-register-screen #registration .mtd-register-phone-field .iti__country.iti__highlight .iti__dial-code,
body.dark-mode #wrapper.mtd-register-screen #registration .mtd-register-phone-field .iti__country.iti__active .iti__dial-code {
    color: #dbeafe !important;
}
/* End final phone selector polish */
/* Dark mode selector and scrollbar normalisation */
html:has(body.dark-mode),
html:has(body.dark-mode) *,
body.dark-mode,
body.dark-mode * {
    scrollbar-color: rgba(96, 165, 250, 0.68) rgba(8, 16, 30, 0.96) !important;
    scrollbar-width: thin;
}

html:has(body.dark-mode)::-webkit-scrollbar,
html:has(body.dark-mode) *::-webkit-scrollbar,
body.dark-mode::-webkit-scrollbar,
body.dark-mode *::-webkit-scrollbar,
body.dark-mode .dropdown-menu::-webkit-scrollbar,
body.dark-mode .bootstrap-select .dropdown-menu::-webkit-scrollbar,
body.dark-mode .select2-results__options::-webkit-scrollbar,
body.dark-mode .mtd-localisation-body::-webkit-scrollbar,
body.dark-mode .country-list::-webkit-scrollbar,
body.dark-mode .iti__country-list::-webkit-scrollbar {
    width: 10px !important;
    height: 10px !important;
}

html:has(body.dark-mode)::-webkit-scrollbar-track,
html:has(body.dark-mode) *::-webkit-scrollbar-track,
body.dark-mode::-webkit-scrollbar-track,
body.dark-mode *::-webkit-scrollbar-track,
body.dark-mode .dropdown-menu::-webkit-scrollbar-track,
body.dark-mode .bootstrap-select .dropdown-menu::-webkit-scrollbar-track,
body.dark-mode .select2-results__options::-webkit-scrollbar-track,
body.dark-mode .mtd-localisation-body::-webkit-scrollbar-track,
body.dark-mode .country-list::-webkit-scrollbar-track,
body.dark-mode .iti__country-list::-webkit-scrollbar-track {
    background: linear-gradient(180deg, rgba(8, 16, 30, 0.98), rgba(13, 25, 44, 0.98)) !important;
    border-radius: 999px !important;
}

html:has(body.dark-mode)::-webkit-scrollbar-thumb,
html:has(body.dark-mode) *::-webkit-scrollbar-thumb,
body.dark-mode::-webkit-scrollbar-thumb,
body.dark-mode *::-webkit-scrollbar-thumb,
body.dark-mode .dropdown-menu::-webkit-scrollbar-thumb,
body.dark-mode .bootstrap-select .dropdown-menu::-webkit-scrollbar-thumb,
body.dark-mode .select2-results__options::-webkit-scrollbar-thumb,
body.dark-mode .mtd-localisation-body::-webkit-scrollbar-thumb,
body.dark-mode .country-list::-webkit-scrollbar-thumb,
body.dark-mode .iti__country-list::-webkit-scrollbar-thumb {
    background: linear-gradient(180deg, rgba(147, 197, 253, 0.9), rgba(37, 99, 235, 0.7)) !important;
    border: 2px solid rgba(8, 16, 30, 0.98) !important;
    border-radius: 999px !important;
    min-height: 38px !important;
}

html:has(body.dark-mode)::-webkit-scrollbar-thumb:hover,
html:has(body.dark-mode) *::-webkit-scrollbar-thumb:hover,
body.dark-mode::-webkit-scrollbar-thumb:hover,
body.dark-mode *::-webkit-scrollbar-thumb:hover,
body.dark-mode .dropdown-menu::-webkit-scrollbar-thumb:hover,
body.dark-mode .bootstrap-select .dropdown-menu::-webkit-scrollbar-thumb:hover,
body.dark-mode .select2-results__options::-webkit-scrollbar-thumb:hover,
body.dark-mode .mtd-localisation-body::-webkit-scrollbar-thumb:hover,
body.dark-mode .country-list::-webkit-scrollbar-thumb:hover,
body.dark-mode .iti__country-list::-webkit-scrollbar-thumb:hover {
    background: linear-gradient(180deg, rgba(191, 219, 254, 0.98), rgba(59, 130, 246, 0.86)) !important;
}

body.dark-mode select,
body.dark-mode select.form-control,
body.dark-mode .form-control select,
body.dark-mode .custom-select,
body.dark-mode .field.form-control select,
body.dark-mode #registration select.field.form-control {
    color-scheme: dark;
    color: #f8fafc !important;
    background-color: rgba(20, 32, 52, 0.96) !important;
    background-image: linear-gradient(180deg, rgba(20, 32, 52, 0.98), rgba(13, 24, 41, 0.98)) !important;
    border-color: rgba(96, 165, 250, 0.28) !important;
    box-shadow: none !important;
}

body.dark-mode select option,
body.dark-mode select optgroup,
body.dark-mode #registration select.field.form-control option,
body.dark-mode #registration select.field.form-control optgroup {
    color: #e8f0fb !important;
    background-color: #101d31 !important;
}

body.dark-mode select option:checked,
body.dark-mode select option:hover,
body.dark-mode select option:focus,
body.dark-mode #registration select.field.form-control option:checked,
body.dark-mode #registration select.field.form-control option:hover,
body.dark-mode #registration select.field.form-control option:focus {
    color: #ffffff !important;
    background-color: rgba(37, 99, 235, 0.62) !important;
    box-shadow: 0 0 0 100vmax rgba(37, 99, 235, 0.62) inset !important;
}

body.dark-mode .dropdown-menu,
body.dark-mode .bootstrap-select .dropdown-menu,
body.dark-mode .select2-dropdown,
body.dark-mode .select2-container--open .select2-dropdown,
body.dark-mode .select2-results__options {
    color: #e8f0fb !important;
    background: #101d31 !important;
    border-color: rgba(96, 165, 250, 0.24) !important;
    box-shadow: 0 26px 64px rgba(0, 0, 0, 0.34) !important;
    scrollbar-color: rgba(96, 165, 250, 0.68) rgba(8, 16, 30, 0.96) !important;
}

body.dark-mode .dropdown-menu .dropdown-item,
body.dark-mode .bootstrap-select .dropdown-menu li a,
body.dark-mode .select2-results__option {
    color: #dbe7f6 !important;
    background: transparent !important;
}

body.dark-mode .dropdown-menu .dropdown-item:hover,
body.dark-mode .dropdown-menu .dropdown-item:focus,
body.dark-mode .dropdown-menu .dropdown-item.active,
body.dark-mode .bootstrap-select .dropdown-menu li a:hover,
body.dark-mode .bootstrap-select .dropdown-menu li.selected a,
body.dark-mode .select2-container--default .select2-results__option--highlighted[aria-selected],
body.dark-mode .select2-container--default .select2-results__option[aria-selected=true] {
    color: #ffffff !important;
    background: rgba(37, 99, 235, 0.26) !important;
}


html:has(body.dark-mode)::-webkit-scrollbar-corner,
html:has(body.dark-mode) *::-webkit-scrollbar-corner,
body.dark-mode::-webkit-scrollbar-corner,
body.dark-mode *::-webkit-scrollbar-corner,
html:has(body.dark-mode)::-webkit-scrollbar-track-piece,
html:has(body.dark-mode) *::-webkit-scrollbar-track-piece,
body.dark-mode::-webkit-scrollbar-track-piece,
body.dark-mode *::-webkit-scrollbar-track-piece,
html:has(body.dark-mode)::-webkit-scrollbar-button,
html:has(body.dark-mode) *::-webkit-scrollbar-button,
body.dark-mode::-webkit-scrollbar-button,
body.dark-mode *::-webkit-scrollbar-button {
    background: rgba(8, 16, 30, 0.98) !important;
    border-color: rgba(96, 165, 250, 0.22) !important;
    box-shadow: none !important;
}

body.dark-mode select::-webkit-scrollbar,
body.dark-mode .custom-select::-webkit-scrollbar,
body.dark-mode #registration select.field.form-control::-webkit-scrollbar {
    width: 10px !important;
    height: 10px !important;
}

body.dark-mode select::-webkit-scrollbar-track,
body.dark-mode select::-webkit-scrollbar-track-piece,
body.dark-mode select::-webkit-scrollbar-corner,
body.dark-mode select::-webkit-scrollbar-button,
body.dark-mode .custom-select::-webkit-scrollbar-track,
body.dark-mode .custom-select::-webkit-scrollbar-track-piece,
body.dark-mode .custom-select::-webkit-scrollbar-corner,
body.dark-mode .custom-select::-webkit-scrollbar-button,
body.dark-mode #registration select.field.form-control::-webkit-scrollbar-track,
body.dark-mode #registration select.field.form-control::-webkit-scrollbar-track-piece,
body.dark-mode #registration select.field.form-control::-webkit-scrollbar-corner,
body.dark-mode #registration select.field.form-control::-webkit-scrollbar-button {
    background: #08101e !important;
    border-color: rgba(96, 165, 250, 0.24) !important;
}

body.dark-mode select::-webkit-scrollbar-thumb,
body.dark-mode .custom-select::-webkit-scrollbar-thumb,
body.dark-mode #registration select.field.form-control::-webkit-scrollbar-thumb {
    background: linear-gradient(180deg, rgba(147, 197, 253, 0.9), rgba(37, 99, 235, 0.7)) !important;
    border: 2px solid #08101e !important;
    border-radius: 999px !important;
}

body.dark-mode select:focus,
body.dark-mode select.form-control:focus,
body.dark-mode .custom-select:focus,
body.dark-mode #registration select.field.form-control:focus,
body.dark-mode .bootstrap-select > .dropdown-toggle:focus,
body.dark-mode .select2-container--open .select2-selection,
body.dark-mode .select2-container--focus .select2-selection {
    border-color: rgba(96, 165, 250, 0.58) !important;
    outline: 0 !important;
    box-shadow: 0 0 0 1px rgba(96, 165, 250, 0.24) inset, 0 0 0 3px rgba(37, 99, 235, 0.16) !important;
}

body.dark-mode .mtd-localisation-modal .mtd-language-flag-shell {
    background: rgba(15, 23, 42, 0.72) !important;
    box-shadow: 0 0 0 1px rgba(96, 165, 250, 0.22), 0 8px 18px rgba(0, 0, 0, 0.22) !important;
}
/* Dark mode selector border polish */
html body.dark-mode select,
html body.dark-mode select.form-control,
html body.dark-mode .custom-select,
html body.dark-mode .field.form-control select,
html body.dark-mode #wrapper #registration select.field.form-control,
body.dark-mode .select2-container--default .select2-selection--single,
body.dark-mode .select2-container--default .select2-selection--multiple,
body.dark-mode .bootstrap-select > .dropdown-toggle {
    border: 1px solid rgba(96, 165, 250, 0.42) !important;
    border-color: rgba(96, 165, 250, 0.42) !important;
    outline: 1px solid transparent !important;
    background-clip: padding-box !important;
}

html body.dark-mode select:hover,
html body.dark-mode select:focus,
html body.dark-mode select:focus-visible,
html body.dark-mode select:active,
html body.dark-mode select.form-control:hover,
html body.dark-mode select.form-control:focus,
html body.dark-mode select.form-control:focus-visible,
html body.dark-mode select.form-control:active,
html body.dark-mode .custom-select:hover,
html body.dark-mode .custom-select:focus,
html body.dark-mode .custom-select:focus-visible,
html body.dark-mode .custom-select:active,
html body.dark-mode #wrapper #registration select.field.form-control:hover,
html body.dark-mode #wrapper #registration select.field.form-control:focus,
html body.dark-mode #wrapper #registration select.field.form-control:focus-visible,
html body.dark-mode #wrapper #registration select.field.form-control:active,
html body.dark-mode .select2-container--open .select2-selection,
html body.dark-mode .select2-container--focus .select2-selection,
html body.dark-mode .bootstrap-select.show > .dropdown-toggle,
html body.dark-mode .bootstrap-select > .dropdown-toggle:hover,
html body.dark-mode .bootstrap-select > .dropdown-toggle:focus {
    border-color: rgba(96, 165, 250, 0.78) !important;
    outline: 0 !important;
    box-shadow: 0 0 0 1px rgba(96, 165, 250, 0.34) inset, 0 0 0 3px rgba(37, 99, 235, 0.20) !important;
}

@supports selector(select:open) {
    body.dark-mode select:open,
    body.dark-mode select.form-control:open,
    body.dark-mode .custom-select:open,
    body.dark-mode #registration select.field.form-control:open {
        border-color: rgba(96, 165, 250, 0.78) !important;
        box-shadow: 0 0 0 1px rgba(96, 165, 250, 0.32) inset, 0 0 0 3px rgba(37, 99, 235, 0.20) !important;
    }
}

body.dark-mode .dropdown-menu,
body.dark-mode .bootstrap-select .dropdown-menu,
body.dark-mode .select2-dropdown,
body.dark-mode .select2-container--open .select2-dropdown,
body.dark-mode .select2-results__options {
    border: 1px solid rgba(96, 165, 250, 0.36) !important;
}

body.dark-mode select option:checked,
body.dark-mode #registration select.field.form-control option:checked {
    background: linear-gradient(0deg, rgba(37, 99, 235, 0.72), rgba(37, 99, 235, 0.72)) !important;
    color: #ffffff !important;
}
/* Native select dark mode hardening */
html body.dark-mode select,
html body.dark-mode select.form-control,
html body.dark-mode .custom-select,
html body.dark-mode .field.form-control select,
html body.dark-mode #wrapper #registration select.field.form-control,
html body.dark-mode .mtd-global-content-shell select,
html body.dark-mode .mtd-global-content-shell .custom-select {
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    appearance: none !important;
    color-scheme: dark !important;
    color: #f8fafc !important;
    background-color: #101d31 !important;
    background-image:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2393c5fd' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E"),
        linear-gradient(180deg, rgba(20, 36, 62, 0.98), rgba(12, 24, 42, 0.98)) !important;
    background-position: right 16px center, 0 0 !important;
    background-repeat: no-repeat, repeat !important;
    background-size: 16px 16px, 100% 100% !important;
    border: 1px solid rgba(96, 165, 250, 0.56) !important;
    outline: 0 !important;
    box-shadow: 0 0 0 1px rgba(96, 165, 250, 0.16) inset !important;
    padding-right: 44px !important;
}

html body.dark-mode select:hover,
html body.dark-mode select:focus,
html body.dark-mode select:focus-visible,
html body.dark-mode select:active,
html body.dark-mode select.form-control:hover,
html body.dark-mode select.form-control:focus,
html body.dark-mode select.form-control:focus-visible,
html body.dark-mode select.form-control:active,
html body.dark-mode .custom-select:hover,
html body.dark-mode .custom-select:focus,
html body.dark-mode .custom-select:focus-visible,
html body.dark-mode .custom-select:active,
html body.dark-mode #wrapper #registration select.field.form-control:hover,
html body.dark-mode #wrapper #registration select.field.form-control:focus,
html body.dark-mode #wrapper #registration select.field.form-control:focus-visible,
html body.dark-mode #wrapper #registration select.field.form-control:active {
    border-color: rgba(96, 165, 250, 0.9) !important;
    outline: 0 !important;
    box-shadow:
        0 0 0 1px rgba(96, 165, 250, 0.42) inset,
        0 0 0 4px rgba(37, 99, 235, 0.22) !important;
}

html body.dark-mode select option,
html body.dark-mode select optgroup {
    color: #f8fafc !important;
    background: #101d31 !important;
    border: 0 !important;
    box-shadow: none !important;
}

html body.dark-mode select option:checked,
html body.dark-mode select option:hover,
html body.dark-mode select option:focus {
    color: #ffffff !important;
    background:
        linear-gradient(0deg, rgba(37, 99, 235, 0.82), rgba(37, 99, 235, 0.82)),
        #1d4ed8 !important;
}

body.dark-mode select::-ms-expand,
body.dark-mode select.form-control::-ms-expand,
body.dark-mode .custom-select::-ms-expand {
    display: none;
}
/* End dark mode selector border polish */
/* MTD 404 page */
.mtd-error-404-page {
    display: flex;
    min-height: 68vh;
    align-items: center;
    padding: clamp(72px, 8vw, 128px) 0;
}

.mtd-error-404-card {
    width: min(100%, 860px);
    margin: 0 auto;
    padding: clamp(34px, 5vw, 64px);
    text-align: center;
    color: #101828;
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.96), rgba(239, 246, 255, 0.96));
    border: 1px solid rgba(147, 197, 253, 0.42);
    border-radius: 24px;
    box-shadow: 0 24px 70px rgba(15, 23, 42, 0.12);
}

.mtd-error-404-mark {
    display: inline-flex;
    min-height: 42px;
    align-items: center;
    justify-content: center;
    margin-bottom: 18px;
    padding: 0 18px;
    color: #0f5fff;
    font-size: clamp(30px, 10vw, 150px);
    font-weight: 900;
    line-height: 1;
    letter-spacing: 0;
}

.mtd-error-404-icon {
    display: inline-flex;
    width: 76px;
    height: 76px;
    align-items: center;
    justify-content: center;
    margin-bottom: 22px;
    color: #ffffff;
    font-size: 28px;
    background: linear-gradient(135deg, #1d7cff, #0f4bd8);
    border-radius: 22px;
    box-shadow: 0 18px 36px rgba(15, 95, 255, 0.25);
}

.mtd-error-404-card h1 {
    margin: 0 0 14px;
    color: inherit;
    font-size: clamp(30px, 5vw, 50px);
    font-weight: 900;
    line-height: 1.08;
    letter-spacing: 0;
}

.mtd-error-404-card p {
    max-width: 620px;
    margin: 0 auto 30px;
    color: #64748b;
    font-size: 18px;
    line-height: 1.75;
}

.mtd-error-404-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    justify-content: center;
}

.mtd-error-404-actions .btn {
    display: inline-flex;
    min-height: 52px;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 0 24px;
    border-radius: 10px;
    font-weight: 800;
    line-height: 1;
    text-decoration: none !important;
}

.mtd-error-404-secondary {
    color: #0f5fff !important;
    background: rgba(15, 95, 255, 0.08) !important;
    border-color: rgba(15, 95, 255, 0.2) !important;
}

body.dark-mode .mtd-error-404-card {
    color: #f8fafc;
    background: linear-gradient(145deg, rgba(17, 31, 54, 0.95), rgba(9, 20, 37, 0.96));
    border-color: rgba(96, 165, 250, 0.26);
    box-shadow: 0 34px 90px rgba(0, 0, 0, 0.42), 0 0 80px rgba(37, 99, 235, 0.08) inset;
}

body.dark-mode .mtd-error-404-mark {
    color: #bfdbfe;
}

body.dark-mode .mtd-error-404-card p {
    color: #b8c7dd;
}

body.dark-mode .mtd-error-404-secondary {
    color: #dbeafe !important;
    background: rgba(30, 48, 76, 0.92) !important;
    border-color: rgba(96, 165, 250, 0.32) !important;
}

body.dark-mode .mtd-error-404-secondary:hover,
body.dark-mode .mtd-error-404-secondary:focus {
    color: #ffffff !important;
    background: rgba(37, 99, 235, 0.84) !important;
    border-color: rgba(147, 197, 253, 0.52) !important;
}

@media (max-width: 575.98px) {
    .mtd-error-404-page {
        min-height: 62vh;
        padding: 48px 0;
    }

    .mtd-error-404-actions .btn {
        width: 100%;
    }
}
/* End MTD 404 page */
/* Auth dark mode modal and browser-fill polish */
#modalGeneratePassword .mtd-password-output-wrap {
    position: relative;
    display: flex;
    min-width: 0;
    align-items: center;
}

#modalGeneratePassword .mtd-password-output-wrap #inputGeneratePasswordOutput {
    padding-right: 118px !important;
}

#modalGeneratePassword .mtd-password-inline-copy {
    position: absolute !important;
    top: 50%;
    right: 8px;
    z-index: 2;
    display: inline-flex !important;
    min-width: 96px !important;
    min-height: 36px !important;
    height: 36px !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    padding: 0 14px !important;
    margin: 0 !important;
    color: #334155 !important;
    background: #f8fafc !important;
    border: 1px solid #dbe7f5 !important;
    border-radius: 7px !important;
    font-size: 0.92rem !important;
    font-weight: 900 !important;
    line-height: 1 !important;
    white-space: nowrap !important;
    transform: translateY(-50%);
    box-shadow: none !important;
}

#modalGeneratePassword .mtd-password-inline-copy:hover,
#modalGeneratePassword .mtd-password-inline-copy:focus {
    color: #0f172a !important;
    background: var(--mtd-scheme-primary-soft) !important;
    border-color: var(--mtd-scheme-primary-border) !important;
}

body.dark-mode #modalGeneratePassword .mtd-password-modal {
    color: #e8f1ff !important;
    background: linear-gradient(180deg, rgba(17, 28, 45, 0.98), rgba(10, 22, 39, 0.98)) !important;
    border-color: rgba(96, 165, 250, 0.22) !important;
    box-shadow: 0 30px 80px rgba(0, 0, 0, 0.44), 0 0 0 1px rgba(255, 255, 255, 0.02) inset !important;
}

body.dark-mode #modalGeneratePassword .mtd-password-modal-header,
body.dark-mode #modalGeneratePassword .mtd-password-modal-footer {
    background: rgba(20, 32, 52, 0.9) !important;
    border-color: rgba(96, 165, 250, 0.18) !important;
}

body.dark-mode #modalGeneratePassword .modal-title,
body.dark-mode #modalGeneratePassword .mtd-password-field label {
    color: #f8fafc !important;
    opacity: 1 !important;
}

body.dark-mode #modalGeneratePassword .mtd-password-modal-close {
    color: #e8f1ff !important;
    background: rgba(30, 48, 76, 0.96) !important;
    border-color: rgba(96, 165, 250, 0.28) !important;
    opacity: 1 !important;
    text-shadow: none !important;
    box-shadow: 0 10px 24px rgba(0, 0, 0, 0.24) !important;
}

body.dark-mode #modalGeneratePassword .mtd-password-modal-close:hover,
body.dark-mode #modalGeneratePassword .mtd-password-modal-close:focus {
    color: #ffffff !important;
    background: rgba(37, 99, 235, 0.88) !important;
    border-color: rgba(147, 197, 253, 0.5) !important;
}

body.dark-mode #modalGeneratePassword .mtd-password-field .form-control,
body.dark-mode #modalGeneratePassword #inputGeneratePasswordLength,
body.dark-mode #modalGeneratePassword #inputGeneratePasswordOutput {
    color: #f8fafc !important;
    caret-color: #f8fafc !important;
    background: rgba(15, 29, 50, 0.98) !important;
    border-color: rgba(96, 165, 250, 0.38) !important;
    box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.02) inset !important;
}

body.dark-mode #modalGeneratePassword .mtd-password-field .form-control:focus,
body.dark-mode #modalGeneratePassword #inputGeneratePasswordLength:focus,
body.dark-mode #modalGeneratePassword #inputGeneratePasswordOutput:focus {
    background: rgba(18, 36, 62, 0.98) !important;
    border-color: rgba(96, 165, 250, 0.72) !important;
    box-shadow: 0 0 0 1px rgba(96, 165, 250, 0.3) inset, 0 0 0 3px rgba(37, 99, 235, 0.22) !important;
}

body.dark-mode input[type="number"] {
    color: #f8fafc !important;
    background-color: rgba(15, 29, 50, 0.98) !important;
    border-color: rgba(96, 165, 250, 0.38) !important;
    -webkit-appearance: textfield !important;
    -moz-appearance: textfield !important;
    appearance: textfield !important;
}

body.dark-mode input[type="number"]::-webkit-inner-spin-button,
body.dark-mode input[type="number"]::-webkit-outer-spin-button {
    width: 0 !important;
    margin: 0 !important;
    opacity: 0 !important;
    -webkit-appearance: none !important;
    appearance: none !important;
}

body.dark-mode #modalGeneratePassword .mtd-password-tools {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    gap: 14px !important;
    padding-left: 164px !important;
}

body.dark-mode #modalGeneratePassword .mtd-password-tool-btn,
body.dark-mode #modalGeneratePassword .mtd-password-secondary {
    display: inline-flex !important;
    min-height: 52px !important;
    height: 52px !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 10px !important;
    margin: 0 !important;
    padding: 0 22px !important;
    color: #e8f1ff !important;
    background: rgba(30, 48, 76, 0.92) !important;
    border-color: rgba(96, 165, 250, 0.32) !important;
    border-radius: 8px !important;
    line-height: 1 !important;
    box-shadow: none !important;
}

body.dark-mode #modalGeneratePassword .mtd-password-tool-btn[type="submit"] {
    flex: 1 1 auto !important;
    width: auto !important;
    min-width: 0 !important;
}

body.dark-mode #modalGeneratePassword .mtd-password-tools .copy-to-clipboard {
    flex: 0 0 152px !important;
    min-width: 152px !important;
    margin: 0 !important;
}

body.dark-mode #modalGeneratePassword .mtd-password-inline-copy {
    color: #e8f1ff !important;
    background: rgba(30, 48, 76, 0.96) !important;
    border-color: rgba(96, 165, 250, 0.38) !important;
}

body.dark-mode #modalGeneratePassword .mtd-password-tool-btn:hover,
body.dark-mode #modalGeneratePassword .mtd-password-tool-btn:focus,
body.dark-mode #modalGeneratePassword .mtd-password-secondary:hover,
body.dark-mode #modalGeneratePassword .mtd-password-secondary:focus,
body.dark-mode #modalGeneratePassword .mtd-password-inline-copy:hover,
body.dark-mode #modalGeneratePassword .mtd-password-inline-copy:focus {
    color: #ffffff !important;
    background: rgba(37, 99, 235, 0.88) !important;
    border-color: rgba(147, 197, 253, 0.52) !important;
}

body.dark-mode input:-webkit-autofill,
body.dark-mode input:-webkit-autofill:hover,
body.dark-mode input:-webkit-autofill:focus,
body.dark-mode textarea:-webkit-autofill,
body.dark-mode textarea:-webkit-autofill:hover,
body.dark-mode textarea:-webkit-autofill:focus,
body.dark-mode select:-webkit-autofill,
body.dark-mode select:-webkit-autofill:hover,
body.dark-mode select:-webkit-autofill:focus {
    -webkit-text-fill-color: #f8fafc !important;
    caret-color: #f8fafc !important;
    background-color: rgba(20, 32, 52, 0.98) !important;
    border-color: rgba(96, 165, 250, 0.54) !important;
    box-shadow: 0 0 0 1000px rgba(20, 32, 52, 0.98) inset, 0 0 0 1px rgba(96, 165, 250, 0.24) inset !important;
    transition: background-color 9999s ease-out 0s !important;
}

body.dark-mode input::selection,
body.dark-mode textarea::selection {
    color: #ffffff !important;
    background: rgba(37, 99, 235, 0.68) !important;
}

html body.login.dark-mode .mtd-login-field .form-control-label,
html body.login.dark-mode .mtd-login-field-top .form-control-label,
html body.login.dark-mode .mtd-login-field:focus-within .form-control-label,
html body.login.dark-mode .mtd-login-field-top:focus-within .form-control-label,
html body.dark-mode #wrapper.mtd-reset-screen .mtd-reset-field .form-control-label,
html body.dark-mode #wrapper.mtd-reset-screen .mtd-reset-content label,
html body.dark-mode #wrapper.mtd-login-background .mtd-reset-field .form-control-label,
html body.dark-mode #wrapper.mtd-login-background .mtd-reset-content label {
    color: #f8fafc !important;
    opacity: 1 !important;
    text-shadow: none !important;
}

html body.login.dark-mode .mtd-login-input-wrap:focus-within .mtd-login-input-icon,
html body.dark-mode #wrapper.mtd-reset-screen .mtd-reset-input-wrap:focus-within .mtd-reset-input-icon,
html body.dark-mode #wrapper.mtd-login-background .mtd-reset-input-wrap:focus-within .mtd-reset-input-icon {
    color: #dbeafe !important;
    opacity: 1 !important;
}

html body.login.dark-mode .mtd-login-input-wrap .form-control:-webkit-autofill,
html body.login.dark-mode .mtd-login-input-wrap .form-control:-webkit-autofill:hover,
html body.login.dark-mode .mtd-login-input-wrap .form-control:-webkit-autofill:focus {
    -webkit-text-fill-color: #f8fafc !important;
    box-shadow: 0 0 0 1000px rgba(15, 29, 50, 0.98) inset, 0 0 0 1px rgba(96, 165, 250, 0.28) inset !important;
}

@media (max-width: 575.98px) {
    #modalGeneratePassword .mtd-password-output-wrap #inputGeneratePasswordOutput {
        padding-right: 94px !important;
    }

    #modalGeneratePassword .mtd-password-inline-copy {
        min-width: 76px !important;
        padding: 0 10px !important;
    }

    body.dark-mode #modalGeneratePassword .mtd-password-tools {
        flex-direction: column !important;
        padding-left: 0 !important;
    }

    body.dark-mode #modalGeneratePassword .mtd-password-tool-btn[type="submit"],
    body.dark-mode #modalGeneratePassword .mtd-password-tools .copy-to-clipboard {
        flex: 1 1 auto !important;
        width: 100% !important;
    }
}
/* End auth dark mode modal and browser-fill polish */
/* End dark mode selector and scrollbar normalisation */

/* Serepok custom select shell */
.mtd-select-enhanced {
    position: relative;
    width: 100%;
    display: block;
}

.mtd-native-select-hidden {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    min-height: 1px !important;
    opacity: 0 !important;
    pointer-events: none !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    clip: rect(0 0 0 0) !important;
    overflow: hidden !important;
}

.mtd-select-button {
    width: 100%;
    min-height: var(--mtd-select-height, 48px);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 0 18px;
    border: 1px solid #d9e2ef;
    border-radius: 10px;
    background: #ffffff;
    color: #111827;
    font: inherit;
    font-weight: 700;
    line-height: 1.3;
    text-align: left;
    cursor: pointer;
    transition: border-color 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease;
}

.mtd-select-enhanced.has-prepend-icon .mtd-select-button {
    padding-left: 54px;
}

.mtd-select-button:hover,
.mtd-select-button:focus,
.mtd-select-enhanced.is-open .mtd-select-button {
    border-color: var(--mtd-scheme-primary);
    outline: 0;
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--mtd-scheme-primary) 12%, transparent);
}

.mtd-select-current {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.mtd-select-caret {
    flex: 0 0 auto;
    color: #64748b;
    font-size: 13px;
    transition: transform 0.2s ease, color 0.2s ease;
}

.mtd-select-enhanced.is-open .mtd-select-caret {
    transform: rotate(180deg);
    color: var(--mtd-scheme-primary);
}

.mtd-select-menu {
    position: absolute;
    z-index: 10060;
    top: calc(100% + 8px);
    left: 0;
    right: 0;
    max-height: min(320px, 52vh);
    overflow: auto;
    padding: 8px;
    border: 1px solid rgba(37, 99, 235, 0.22);
    border-radius: 14px;
    background: #ffffff;
    box-shadow: 0 24px 55px rgba(15, 23, 42, 0.16);
}

.mtd-select-option {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 11px 12px;
    border: 0;
    border-radius: 10px;
    background: transparent;
    color: #1f2937;
    font: inherit;
    font-weight: 700;
    line-height: 1.35;
    text-align: left;
    cursor: pointer;
}

.mtd-select-option:hover,
.mtd-select-option:focus {
    outline: 0;
    color: var(--mtd-scheme-primary);
    background: rgba(37, 99, 235, 0.08);
}

.mtd-select-option.is-selected {
    color: var(--mtd-scheme-primary);
    background: rgba(37, 99, 235, 0.12);
}

.mtd-select-option.is-selected::after {
    content: "\2713";
    flex: 0 0 auto;
    color: var(--mtd-scheme-primary);
}

.mtd-select-option:disabled {
    opacity: 0.48;
    cursor: not-allowed;
}

body.dark-mode .mtd-select-button {
    color: #f8fafc;
    background: linear-gradient(180deg, rgba(20, 36, 62, 0.98), rgba(12, 24, 42, 0.98));
    border-color: rgba(96, 165, 250, 0.5);
    box-shadow: 0 0 0 1px rgba(96, 165, 250, 0.12) inset;
}

body.dark-mode .mtd-select-button:hover,
body.dark-mode .mtd-select-button:focus,
body.dark-mode .mtd-select-enhanced.is-open .mtd-select-button {
    border-color: rgba(96, 165, 250, 0.9);
    box-shadow: 0 0 0 1px rgba(96, 165, 250, 0.4) inset, 0 0 0 4px rgba(37, 99, 235, 0.22);
}

body.dark-mode .mtd-select-caret {
    color: #93c5fd;
}

body.dark-mode .mtd-select-menu {
    color: #f8fafc;
    background: linear-gradient(180deg, rgba(15, 30, 52, 0.98), rgba(10, 22, 39, 0.98));
    border-color: rgba(96, 165, 250, 0.44);
    box-shadow: 0 28px 70px rgba(0, 0, 0, 0.42), 0 0 0 1px rgba(96, 165, 250, 0.12) inset;
    scrollbar-color: rgba(96, 165, 250, 0.78) rgba(12, 24, 42, 0.95);
}

body.dark-mode .mtd-select-option {
    color: #e8f0fb;
}

body.dark-mode .mtd-select-option:hover,
body.dark-mode .mtd-select-option:focus {
    color: #ffffff;
    background: rgba(96, 165, 250, 0.14);
}

body.dark-mode .mtd-select-option.is-selected {
    color: #ffffff;
    background: linear-gradient(90deg, rgba(37, 99, 235, 0.36), rgba(14, 165, 233, 0.18));
}

body.dark-mode .mtd-select-option.is-selected::after {
    color: #93c5fd;
}

body.dark-mode .mtd-select-menu::-webkit-scrollbar {
    width: 10px;
}

body.dark-mode .mtd-select-menu::-webkit-scrollbar-track {
    background: rgba(12, 24, 42, 0.95);
    border-left: 1px solid rgba(96, 165, 250, 0.18);
}

body.dark-mode .mtd-select-menu::-webkit-scrollbar-thumb {
    background: linear-gradient(180deg, rgba(96, 165, 250, 0.9), rgba(37, 99, 235, 0.82));
    border: 2px solid rgba(12, 24, 42, 0.95);
    border-radius: 999px;
}
/* Modern product pricing and dark feature card refresh */
.sec.products .mtd-modern-pricing-container {
    max-width: 1320px;
    margin: 0 auto;
}

.sec.products .mtd-modern-plan-table {
    position: relative;
    overflow: hidden;
    padding: clamp(18px, 2vw, 30px) !important;
    border: 1px solid rgba(37, 99, 235, 0.16) !important;
    border-radius: 28px !important;
    background: linear-gradient(145deg, rgba(255, 255, 255, 0.98), rgba(238, 245, 255, 0.96)) !important;
    box-shadow: 0 28px 80px rgba(15, 23, 42, 0.12) !important;
}

.sec.products .mtd-modern-plan-tabs {
    margin-bottom: 18px;
    border: 0 !important;
}

.sec.products .mtd-modern-plan-tabs .nav-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    border: 0;
}

.sec.products .mtd-modern-plan-tabs .nav-item {
    margin: 0;
}

.sec.products .mtd-modern-plan-tabs .nav-link {
    min-height: 52px;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 10px 18px;
    border: 1px solid rgba(37, 99, 235, 0.16) !important;
    border-radius: 999px !important;
    background: rgba(255, 255, 255, 0.72) !important;
    color: #1f2a44 !important;
    font-weight: 800;
    box-shadow: none !important;
}

.sec.products .mtd-modern-plan-tabs .nav-link.active,
.sec.products .mtd-modern-plan-tabs .nav-link:hover,
.sec.products .mtd-modern-plan-tabs .nav-link:focus {
    background: linear-gradient(135deg, #1769ff, #0ea5e9) !important;
    border-color: rgba(37, 99, 235, 0.58) !important;
    color: #ffffff !important;
    box-shadow: 0 14px 30px rgba(37, 99, 235, 0.22) !important;
}

.sec.products .mtd-modern-tab-icon,
.sec.products .mtd-modern-spec-icon {
    width: 34px;
    height: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 34px;
    border-radius: 12px;
    background: rgba(37, 99, 235, 0.1);
    color: var(--mtd-scheme-primary, #1769ff);
}

.sec.products .mtd-modern-plan-tabs .nav-link.active .mtd-modern-tab-icon,
.sec.products .mtd-modern-plan-tabs .nav-link:hover .mtd-modern-tab-icon,
.sec.products .mtd-modern-plan-tabs .nav-link:focus .mtd-modern-tab-icon {
    background: rgba(255, 255, 255, 0.18);
    color: #ffffff;
}

.sec.products .mtd-modern-plan-card {
    padding: clamp(18px, 2.4vw, 30px);
    border: 1px solid rgba(37, 99, 235, 0.12);
    border-radius: 24px;
    background: rgba(255, 255, 255, 0.74);
}

.sec.products .mtd-modern-plan-top,
.sec.products .mtd-modern-plan-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
}

.sec.products .mtd-modern-plan-top {
    margin-bottom: 20px;
}

.sec.products .mtd-modern-plan-kicker,
.sec.products .mtd-modern-price-label,
.sec.products .mtd-modern-spec-label {
    display: block;
    color: #64748b;
    font-size: 0.76rem;
    font-weight: 900;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.sec.products .mtd-modern-plan-heading h3 {
    margin: 3px 0 0;
    color: #0f172a;
    font-size: clamp(1.45rem, 2.1vw, 2.1rem);
    font-weight: 900;
}

.sec.products .mtd-modern-billing-switcher .btn-group {
    overflow: hidden;
    border-color: rgba(37, 99, 235, 0.18) !important;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.86) !important;
}

.sec.products .mtd-modern-billing-switcher .btn,
.sec.products .mtd-modern-billing-switcher .dropdown-toggle {
    color: #1f2a44;
    font-weight: 800;
    background: transparent !important;
}

.sec.products .mtd-modern-plan-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(132px, 1fr)) minmax(230px, 0.92fr);
    gap: 14px;
}

.sec.products .mtd-modern-spec-card,
.sec.products .mtd-modern-price-panel {
    min-height: 136px;
    padding: 18px;
    border: 1px solid rgba(37, 99, 235, 0.14);
    border-radius: 20px;
    background: linear-gradient(180deg, rgba(248, 251, 255, 0.96), rgba(238, 245, 255, 0.86));
}

.sec.products .mtd-modern-spec-card {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 12px;
}

.sec.products .mtd-modern-spec-card strong {
    color: #0f172a;
    font-size: clamp(1.35rem, 1.7vw, 1.9rem);
    font-weight: 900;
    line-height: 1.1;
}

.sec.products .mtd-modern-price-panel {
    display: flex;
    flex-direction: column;
    justify-content: center;
    background: linear-gradient(145deg, #0f5eff, #0ea5e9);
    color: #ffffff;
    box-shadow: 0 18px 40px rgba(37, 99, 235, 0.22);
}

.sec.products .mtd-modern-price-panel .pricing {
    line-height: 1;
}

.sec.products .mtd-modern-price-panel .cost {
    color: #ffffff !important;
    font-size: clamp(1.75rem, 2.6vw, 2.85rem);
    font-weight: 900;
}

.sec.products .mtd-modern-price-panel .suffix,
.sec.products .mtd-modern-price-panel .cycle,
.sec.products .mtd-modern-price-panel .small,
.sec.products .mtd-modern-price-panel .text-muted,
.sec.products .mtd-modern-price-panel .mtd-modern-price-label {
    color: rgba(255, 255, 255, 0.78) !important;
}

.sec.products .mtd-modern-plan-footer {
    margin-top: 18px;
    padding-top: 18px;
    border-top: 1px solid rgba(37, 99, 235, 0.13);
}

.sec.products .mtd-modern-plan-note {
    max-width: 760px;
    color: #475569;
    font-weight: 700;
    line-height: 1.65;
}

.sec.products .mtd-modern-plan-note p {
    margin: 0;
}

.sec.products .mtd-modern-plan-note p + p {
    margin-top: 4px;
}

.sec.products .mtd-modern-order-btn {
    min-width: 190px;
    min-height: 54px;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 0 22px;
    border: 0 !important;
    border-radius: 16px !important;
    background: linear-gradient(135deg, #1769ff, #0b4ed8) !important;
    color: #ffffff !important;
    font-weight: 900;
    text-decoration: none !important;
    box-shadow: 0 18px 34px rgba(23, 105, 255, 0.26) !important;
}

.sec.products .mtd-modern-order-btn:hover,
.sec.products .mtd-modern-order-btn:focus {
    color: #ffffff !important;
    transform: translateY(-1px);
    box-shadow: 0 24px 44px rgba(23, 105, 255, 0.32) !important;
}

body.dark-mode:not(.login) .sec.products .mtd-modern-plan-table {
    background: linear-gradient(145deg, rgba(13, 28, 50, 0.98), rgba(8, 20, 37, 0.98)) !important;
    border-color: rgba(96, 165, 250, 0.28) !important;
    box-shadow: 0 30px 80px rgba(0, 0, 0, 0.42), 0 0 0 1px rgba(96, 165, 250, 0.08) inset !important;
}

body.dark-mode:not(.login) .sec.products .mtd-modern-plan-card {
    background: linear-gradient(145deg, rgba(16, 35, 62, 0.78), rgba(10, 23, 41, 0.92));
    border-color: rgba(96, 165, 250, 0.24);
}

body.dark-mode:not(.login) .sec.products .mtd-modern-plan-tabs .nav-link {
    background: rgba(15, 32, 56, 0.74) !important;
    border-color: rgba(96, 165, 250, 0.2) !important;
    color: #dbeafe !important;
}

body.dark-mode:not(.login) .sec.products .mtd-modern-plan-tabs .nav-link.active,
body.dark-mode:not(.login) .sec.products .mtd-modern-plan-tabs .nav-link:hover,
body.dark-mode:not(.login) .sec.products .mtd-modern-plan-tabs .nav-link:focus {
    background: linear-gradient(135deg, #1769ff, #0ea5e9) !important;
    color: #ffffff !important;
}

body.dark-mode:not(.login) .sec.products .mtd-modern-tab-icon,
body.dark-mode:not(.login) .sec.products .mtd-modern-spec-icon {
    background: rgba(37, 99, 235, 0.2);
    color: #93c5fd;
}

body.dark-mode:not(.login) .sec.products .mtd-modern-plan-heading h3,
body.dark-mode:not(.login) .sec.products .mtd-modern-spec-card strong {
    color: #f8fafc;
}

body.dark-mode:not(.login) .sec.products .mtd-modern-plan-kicker,
body.dark-mode:not(.login) .sec.products .mtd-modern-spec-label,
body.dark-mode:not(.login) .sec.products .mtd-modern-price-label {
    color: #93a8c4;
}

body.dark-mode:not(.login) .sec.products .mtd-modern-spec-card {
    background: linear-gradient(160deg, rgba(18, 38, 66, 0.9), rgba(10, 24, 43, 0.95));
    border-color: rgba(96, 165, 250, 0.18);
}

body.dark-mode:not(.login) .sec.products .mtd-modern-price-panel {
    background: linear-gradient(145deg, rgba(23, 105, 255, 0.94), rgba(14, 165, 233, 0.82));
    border-color: rgba(147, 197, 253, 0.34);
}

body.dark-mode:not(.login) .sec.products .mtd-modern-plan-note {
    color: #c9d7ea;
}

body.dark-mode:not(.login) .sec.products .mtd-modern-plan-footer {
    border-top-color: rgba(96, 165, 250, 0.16);
}

body.dark-mode:not(.login) .sec.products .mtd-modern-billing-switcher .btn-group {
    background: rgba(12, 24, 42, 0.92) !important;
    border-color: rgba(96, 165, 250, 0.28) !important;
}

body.dark-mode:not(.login) .sec.products .mtd-modern-billing-switcher .btn,
body.dark-mode:not(.login) .sec.products .mtd-modern-billing-switcher .dropdown-toggle {
    color: #f8fafc;
}

body.dark-mode:not(.login) .sec.features .swiper-slide > .feature-item,
body.dark-mode:not(.login) .sec.features .swiper-slide > .feature-item.white,
body.dark-mode:not(.login) .sec.features .swiper-slide > .feature-item.box-shadow {
    height: 100%;
    padding: 26px !important;
    border: 1px solid rgba(96, 165, 250, 0.18) !important;
    border-radius: 20px !important;
    background: linear-gradient(150deg, rgba(16, 35, 62, 0.78), rgba(9, 22, 39, 0.94)) !important;
    color: #e8f0fb !important;
    box-shadow: 0 22px 55px rgba(0, 0, 0, 0.22) !important;
    transition: transform 0.22s ease, border-color 0.22s ease, background-color 0.22s ease, box-shadow 0.22s ease;
}

body.dark-mode:not(.login) .sec.features .swiper-slide > .feature-item:hover,
body.dark-mode:not(.login) .sec.features .swiper-slide > .feature-item:focus,
body.dark-mode:not(.login) .sec.features .swiper-slide > a.feature-item:hover,
body.dark-mode:not(.login) .sec.features .swiper-slide > a.feature-item:focus {
    background: linear-gradient(150deg, rgba(24, 50, 87, 0.92), rgba(12, 29, 52, 0.98)) !important;
    border-color: rgba(96, 165, 250, 0.44) !important;
    color: #ffffff !important;
    transform: translateY(-4px);
    box-shadow: 0 28px 70px rgba(0, 0, 0, 0.32), 0 0 0 1px rgba(96, 165, 250, 0.12) inset !important;
}

body.dark-mode:not(.login) .sec.features .feature-title,
body.dark-mode:not(.login) .sec.features .feature-item:hover .feature-title {
    color: #f8fafc !important;
}

body.dark-mode:not(.login) .sec.features .feature-desc,
body.dark-mode:not(.login) .sec.features .feature-desc p,
body.dark-mode:not(.login) .sec.features .feature-item:hover .feature-desc,
body.dark-mode:not(.login) .sec.features .feature-item:hover .feature-desc p {
    color: #c9d7ea !important;
}

body.dark-mode:not(.login) .sec.features .feature-icon,
body.dark-mode:not(.login) .sec.features .feature-item:hover .feature-icon {
    background: transparent !important;
    color: inherit !important;
    border: 0 !important;
    box-shadow: none !important;
}

body.dark-mode:not(.login) .sec.features .feature-icon span,
body.dark-mode:not(.login) .sec.features .feature-item:hover .feature-icon span {
    color: #ffffff !important;
}

@media (max-width: 1199.98px) {
    .sec.products .mtd-modern-plan-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .sec.products .mtd-modern-price-panel {
        grid-column: 1 / -1;
    }
}

@media (max-width: 767.98px) {
    .sec.products .mtd-modern-plan-top,
    .sec.products .mtd-modern-plan-footer {
        align-items: stretch;
        flex-direction: column;
    }

    .sec.products .mtd-modern-plan-tabs .nav-tabs,
    .sec.products .mtd-modern-plan-tabs .nav-item,
    .sec.products .mtd-modern-plan-tabs .nav-link,
    .sec.products .mtd-modern-billing-switcher .btn-group,
    .sec.products .mtd-modern-order-btn {
        width: 100%;
    }

    .sec.products .mtd-modern-plan-grid {
        grid-template-columns: 1fr;
    }
}
/* End modern product pricing and dark feature card refresh */

/* Modern pricing tab active marker cleanup */
.sec.products .mtd-modern-plan-tabs .nav-link.active::before,
.sec.products .mtd-modern-plan-tabs .nav-link.active:before,
.sec.products .mtd-modern-plan-tabs .nav-link.active::after,
.sec.products .mtd-modern-plan-tabs .nav-link.active:after,
.sec.products .mtd-modern-plan-tabs .nav-item.show .nav-link::before,
.sec.products .mtd-modern-plan-tabs .nav-item.show .nav-link:before,
.sec.products .mtd-modern-plan-tabs .nav-item.show .nav-link::after,
.sec.products .mtd-modern-plan-tabs .nav-item.show .nav-link:after {
    display: none !important;
    content: none !important;
    width: 0 !important;
    height: 0 !important;
    border: 0 !important;
    background: transparent !important;
}
/* End modern pricing tab active marker cleanup */

/* Store/sidebar dark active and hover states */
body.dark-mode:not(.login) .mtd-sidebar-card {
    background: linear-gradient(145deg, rgba(14, 31, 55, 0.94), rgba(8, 21, 39, 0.98)) !important;
    border-color: rgba(96, 165, 250, 0.22) !important;
    box-shadow: 0 22px 48px rgba(2, 8, 23, 0.32) !important;
}

body.dark-mode:not(.login) .mtd-sidebar-card-header {
    color: #f8fbff !important;
    background: linear-gradient(135deg, rgba(18, 44, 77, 0.86), rgba(12, 28, 50, 0.94)) !important;
    border-color: rgba(96, 165, 250, 0.2) !important;
}

body.dark-mode:not(.login) .mtd-sidebar-card-title,
body.dark-mode:not(.login) .mtd-sidebar-link-label {
    color: #edf5ff !important;
}

body.dark-mode:not(.login) .mtd-sidebar-link,
body.dark-mode:not(.login) .mtd-sidebar-static {
    color: #dbeafe !important;
    background: rgba(10, 25, 45, 0.68) !important;
    border: 1px solid rgba(96, 165, 250, 0.14) !important;
}

body.dark-mode:not(.login) .mtd-sidebar-link:hover,
body.dark-mode:not(.login) .mtd-sidebar-link:focus,
body.dark-mode:not(.login) .mtd-sidebar-link.active,
body.dark-mode:not(.login) .mtd-sidebar-link.active:hover,
body.dark-mode:not(.login) .mtd-sidebar-link.active:focus {
    color: #ffffff !important;
    background: linear-gradient(135deg, rgba(37, 99, 235, 0.92), rgba(14, 165, 233, 0.72)) !important;
    border-color: rgba(147, 197, 253, 0.48) !important;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.08), 0 14px 28px rgba(30, 64, 175, 0.24) !important;
}

body.dark-mode:not(.login) .mtd-sidebar-link:hover .mtd-sidebar-link-label,
body.dark-mode:not(.login) .mtd-sidebar-link:focus .mtd-sidebar-link-label,
body.dark-mode:not(.login) .mtd-sidebar-link.active .mtd-sidebar-link-label {
    color: #ffffff !important;
}

body.dark-mode:not(.login) .mtd-sidebar-card-icon,
body.dark-mode:not(.login) .mtd-sidebar-link-icon {
    color: #bfdbfe !important;
    background: rgba(37, 99, 235, 0.22) !important;
}

body.dark-mode:not(.login) .mtd-sidebar-link:hover .mtd-sidebar-link-icon,
body.dark-mode:not(.login) .mtd-sidebar-link:focus .mtd-sidebar-link-icon,
body.dark-mode:not(.login) .mtd-sidebar-link.active .mtd-sidebar-link-icon {
    color: #ffffff !important;
    background: rgba(255, 255, 255, 0.18) !important;
}

body.dark-mode:not(.login) .mtd-sidebar-link.disabled,
body.dark-mode:not(.login) .mtd-sidebar-link.disabled:hover,
body.dark-mode:not(.login) .mtd-sidebar-link.disabled:focus {
    color: rgba(219, 234, 254, 0.48) !important;
    background: rgba(15, 32, 56, 0.45) !important;
    border-color: rgba(96, 165, 250, 0.1) !important;
    box-shadow: none !important;
}
/* End store/sidebar dark active and hover states */

/* Legacy WHMCS sidebar and dark surface cleanup */
body.dark-mode:not(.login) .cart-sidebar .panel-sidebar,
body.dark-mode:not(.login) .panel-sidebar:not(.panel-summary) {
    color: #dce6f4 !important;
    background: linear-gradient(145deg, rgba(14, 31, 55, 0.94), rgba(8, 21, 39, 0.98)) !important;
    border-color: rgba(96, 165, 250, 0.22) !important;
    box-shadow: 0 22px 48px rgba(2, 8, 23, 0.32) !important;
}

body.dark-mode:not(.login) .cart-sidebar .panel-sidebar .panel-heading,
body.dark-mode:not(.login) .cart-sidebar .panel-sidebar .card-header,
body.dark-mode:not(.login) .panel-sidebar:not(.panel-summary) .panel-heading,
body.dark-mode:not(.login) .panel-sidebar:not(.panel-summary) .card-header {
    color: #f8fbff !important;
    background: linear-gradient(135deg, rgba(18, 44, 77, 0.86), rgba(12, 28, 50, 0.94)) !important;
    border-color: rgba(96, 165, 250, 0.2) !important;
}

body.dark-mode:not(.login) .cart-sidebar .panel-sidebar .panel-title,
body.dark-mode:not(.login) .panel-sidebar:not(.panel-summary) .panel-title {
    color: #f8fbff !important;
}

body.dark-mode:not(.login) .cart-sidebar .panel-sidebar .list-group,
body.dark-mode:not(.login) .panel-sidebar:not(.panel-summary) .list-group {
    background: transparent !important;
    border-color: rgba(96, 165, 250, 0.12) !important;
}

body.dark-mode:not(.login) .cart-sidebar .panel-sidebar .list-group-item,
body.dark-mode:not(.login) .cart-sidebar .panel-sidebar a.list-group-item,
body.dark-mode:not(.login) .panel-sidebar:not(.panel-summary) .list-group-item,
body.dark-mode:not(.login) .panel-sidebar:not(.panel-summary) a.list-group-item {
    color: #dbeafe !important;
    background: rgba(10, 25, 45, 0.68) !important;
    border-color: rgba(96, 165, 250, 0.14) !important;
}

body.dark-mode:not(.login) .cart-sidebar .panel-sidebar a.list-group-item:hover,
body.dark-mode:not(.login) .cart-sidebar .panel-sidebar a.list-group-item:focus,
body.dark-mode:not(.login) .cart-sidebar .panel-sidebar a.list-group-item.active,
body.dark-mode:not(.login) .cart-sidebar .panel-sidebar .list-group-item.active,
body.dark-mode:not(.login) .panel-sidebar:not(.panel-summary) a.list-group-item:hover,
body.dark-mode:not(.login) .panel-sidebar:not(.panel-summary) a.list-group-item:focus,
body.dark-mode:not(.login) .panel-sidebar:not(.panel-summary) a.list-group-item.active,
body.dark-mode:not(.login) .panel-sidebar:not(.panel-summary) .list-group-item.active {
    color: #ffffff !important;
    background: linear-gradient(135deg, rgba(37, 99, 235, 0.92), rgba(14, 165, 233, 0.72)) !important;
    border-color: rgba(147, 197, 253, 0.48) !important;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.08), 0 14px 28px rgba(30, 64, 175, 0.24) !important;
}

body.dark-mode:not(.login) .cart-sidebar .panel-sidebar .list-group-item i,
body.dark-mode:not(.login) .cart-sidebar .panel-sidebar a.list-group-item i,
body.dark-mode:not(.login) .panel-sidebar:not(.panel-summary) .list-group-item i,
body.dark-mode:not(.login) .panel-sidebar:not(.panel-summary) a.list-group-item i {
    color: #bfdbfe !important;
    background: rgba(37, 99, 235, 0.22) !important;
}

body.dark-mode:not(.login) .cart-sidebar .panel-sidebar a.list-group-item:hover i,
body.dark-mode:not(.login) .cart-sidebar .panel-sidebar a.list-group-item:focus i,
body.dark-mode:not(.login) .cart-sidebar .panel-sidebar a.list-group-item.active i,
body.dark-mode:not(.login) .cart-sidebar .panel-sidebar .list-group-item.active i,
body.dark-mode:not(.login) .panel-sidebar:not(.panel-summary) a.list-group-item:hover i,
body.dark-mode:not(.login) .panel-sidebar:not(.panel-summary) a.list-group-item:focus i,
body.dark-mode:not(.login) .panel-sidebar:not(.panel-summary) a.list-group-item.active i,
body.dark-mode:not(.login) .panel-sidebar:not(.panel-summary) .list-group-item.active i {
    color: #ffffff !important;
    background: rgba(255, 255, 255, 0.18) !important;
}

body.dark-mode:not(.login) #order-standard_cart .promo-code-cart-container,
body.dark-mode:not(.login) #order-standard_cart .view-cart-items,
body.dark-mode:not(.login) #order-standard_cart .field-container,
body.dark-mode:not(.login) #order-standard_cart .domain-selection-options,
body.dark-mode:not(.login) #order-standard_cart .product-info,
body.dark-mode:not(.login) #order-standard_cart .domain-renewals,
body.dark-mode:not(.login) #order-standard_cart .empty-cart,
body.dark-mode:not(.login) .domain-pricing,
body.dark-mode:not(.login) .domain-pricing .tld-row,
body.dark-mode:not(.login) .mtd-global-content-shell .panel,
body.dark-mode:not(.login) .mtd-global-content-shell .card {
    color: #dce6f4 !important;
    background: linear-gradient(150deg, rgba(16, 35, 62, 0.82), rgba(9, 22, 39, 0.94)) !important;
    border-color: rgba(96, 165, 250, 0.22) !important;
    box-shadow: 0 22px 55px rgba(0, 0, 0, 0.22) !important;
}

body.dark-mode:not(.login) #order-standard_cart input[type="text"],
body.dark-mode:not(.login) #order-standard_cart input[type="email"],
body.dark-mode:not(.login) #order-standard_cart input[type="password"],
body.dark-mode:not(.login) #order-standard_cart textarea,
body.dark-mode:not(.login) #order-standard_cart select,
body.dark-mode:not(.login) .mtd-global-content-shell input[type="text"],
body.dark-mode:not(.login) .mtd-global-content-shell input[type="email"],
body.dark-mode:not(.login) .mtd-global-content-shell input[type="password"],
body.dark-mode:not(.login) .mtd-global-content-shell textarea,
body.dark-mode:not(.login) .mtd-global-content-shell select {
    color: #e5f0ff !important;
    background-color: rgba(9, 22, 39, 0.92) !important;
    border-color: rgba(96, 165, 250, 0.28) !important;
}

body.dark-mode:not(.login) #order-standard_cart input[type="text"]:focus,
body.dark-mode:not(.login) #order-standard_cart input[type="email"]:focus,
body.dark-mode:not(.login) #order-standard_cart input[type="password"]:focus,
body.dark-mode:not(.login) #order-standard_cart textarea:focus,
body.dark-mode:not(.login) #order-standard_cart select:focus,
body.dark-mode:not(.login) .mtd-global-content-shell input[type="text"]:focus,
body.dark-mode:not(.login) .mtd-global-content-shell input[type="email"]:focus,
body.dark-mode:not(.login) .mtd-global-content-shell input[type="password"]:focus,
body.dark-mode:not(.login) .mtd-global-content-shell textarea:focus,
body.dark-mode:not(.login) .mtd-global-content-shell select:focus {
    border-color: rgba(96, 165, 250, 0.78) !important;
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.2) !important;
}

body.dark-mode:not(.login) input[type="file"] {
    color: #dce6f4 !important;
    background: rgba(9, 22, 39, 0.94) !important;
    border-color: rgba(96, 165, 250, 0.28) !important;
}

body.dark-mode:not(.login) input[type="file"]::file-selector-button {
    color: #ffffff !important;
    background: linear-gradient(135deg, #1769ff, #0ea5e9) !important;
    border: 0 !important;
}
/* End legacy WHMCS sidebar and dark surface cleanup */

/* Plain flags and feature icons */
.mtd-localisation-modal .mtd-localisation-item .mtd-language-flag-shell,
body.dark-mode .mtd-localisation-modal .mtd-language-flag-shell,
body:not(.login) .intl-tel-input .country-list .flag-box,
body:not(.login) .iti .iti__flag-box,
body:not(.login) .selected-flag .iti-flag,
body:not(.login) .iti__selected-flag .iti__flag,
body:not(.login) .iti-flag,
body:not(.login) .iti__flag {
    background-color: transparent !important;
    box-shadow: none !important;
}

.mtd-localisation-modal .mtd-language-flag,
body:not(.login) .iti-flag,
body:not(.login) .iti__flag {
    border-radius: 2px !important;
}

body.dark-mode:not(.login) .sec.features .feature-icon,
body.dark-mode:not(.login) .sec.features .feature-item:hover .feature-icon {
    width: auto !important;
    height: auto !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

body.dark-mode:not(.login) .sec.features .feature-icon span,
body.dark-mode:not(.login) .sec.features .feature-icon i,
body.dark-mode:not(.login) .sec.features .feature-item:hover .feature-icon span,
body.dark-mode:not(.login) .sec.features .feature-item:hover .feature-icon i {
    display: inline-flex !important;
    width: 46px !important;
    height: 46px !important;
    align-items: center !important;
    justify-content: center !important;
    color: #ffffff !important;
    background: linear-gradient(135deg, #1769ff, #0ea5e9) !important;
    border-radius: 50% !important;
    box-shadow: 0 14px 28px rgba(23, 105, 255, 0.26) !important;
}
/* End plain flags and feature icons */

/* Password generator layout polish */
#modalGeneratePassword .mtd-password-tools .copy-to-clipboard:not(.mtd-password-inline-copy) {
    display: none !important;
}

#modalGeneratePassword .mtd-password-tools {
    justify-content: flex-start !important;
    padding-left: 0 !important;
}
/* End password generator layout polish */

/* Final dark-mode legacy navigation and icon cleanup */
body.dark-mode:not(.login) .panel-sidebar:not(.panel-summary) > .list-group,
body.dark-mode:not(.login) .panel-sidebar:not(.panel-summary) .list-group {
    background: rgba(7, 18, 34, 0.42) !important;
    border-color: rgba(96, 165, 250, 0.16) !important;
}

body.dark-mode:not(.login) .panel-sidebar:not(.panel-summary) a.list-group-item.list-group-item-action,
body.dark-mode:not(.login) .panel-sidebar:not(.panel-summary) .list-group a.list-group-item.list-group-item-action,
body.dark-mode:not(.login) .cart-sidebar .panel-sidebar a.list-group-item.list-group-item-action,
body.dark-mode:not(.login) .cart-sidebar .panel-sidebar .list-group a.list-group-item.list-group-item-action {
    color: #dbeafe !important;
    background: rgba(10, 25, 45, 0.68) !important;
    border-color: rgba(96, 165, 250, 0.14) !important;
    text-shadow: none !important;
}

body.dark-mode:not(.login) .panel-sidebar:not(.panel-summary) a.list-group-item.list-group-item-action:hover,
body.dark-mode:not(.login) .panel-sidebar:not(.panel-summary) a.list-group-item.list-group-item-action:focus,
body.dark-mode:not(.login) .panel-sidebar:not(.panel-summary) a.list-group-item.list-group-item-action:active,
body.dark-mode:not(.login) .panel-sidebar:not(.panel-summary) a.list-group-item.list-group-item-action.active,
body.dark-mode:not(.login) .panel-sidebar:not(.panel-summary) .list-group a.list-group-item.list-group-item-action:hover,
body.dark-mode:not(.login) .panel-sidebar:not(.panel-summary) .list-group a.list-group-item.list-group-item-action:focus,
body.dark-mode:not(.login) .panel-sidebar:not(.panel-summary) .list-group a.list-group-item.list-group-item-action:active,
body.dark-mode:not(.login) .panel-sidebar:not(.panel-summary) .list-group a.list-group-item.list-group-item-action.active,
body.dark-mode:not(.login) .cart-sidebar .panel-sidebar a.list-group-item.list-group-item-action:hover,
body.dark-mode:not(.login) .cart-sidebar .panel-sidebar a.list-group-item.list-group-item-action:focus,
body.dark-mode:not(.login) .cart-sidebar .panel-sidebar a.list-group-item.list-group-item-action:active,
body.dark-mode:not(.login) .cart-sidebar .panel-sidebar a.list-group-item.list-group-item-action.active {
    color: #ffffff !important;
    background: linear-gradient(135deg, rgba(37, 99, 235, 0.92), rgba(14, 165, 233, 0.72)) !important;
    border-color: rgba(147, 197, 253, 0.48) !important;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.08), 0 14px 28px rgba(30, 64, 175, 0.24) !important;
}

body.dark-mode:not(.login) .panel-sidebar:not(.panel-summary) a.list-group-item.list-group-item-action:hover *,
body.dark-mode:not(.login) .panel-sidebar:not(.panel-summary) a.list-group-item.list-group-item-action:focus *,
body.dark-mode:not(.login) .panel-sidebar:not(.panel-summary) a.list-group-item.list-group-item-action:active *,
body.dark-mode:not(.login) .panel-sidebar:not(.panel-summary) a.list-group-item.list-group-item-action.active *,
body.dark-mode:not(.login) .cart-sidebar .panel-sidebar a.list-group-item.list-group-item-action:hover *,
body.dark-mode:not(.login) .cart-sidebar .panel-sidebar a.list-group-item.list-group-item-action:focus *,
body.dark-mode:not(.login) .cart-sidebar .panel-sidebar a.list-group-item.list-group-item-action:active *,
body.dark-mode:not(.login) .cart-sidebar .panel-sidebar a.list-group-item.list-group-item-action.active * {
    color: #ffffff !important;
}

body.dark-mode:not(.login) .sec.features .feature-icon::before,
body.dark-mode:not(.login) .sec.features .feature-icon::after,
body.dark-mode:not(.login) .sec.features .feature-icon span::before,
body.dark-mode:not(.login) .sec.features .feature-icon span::after,
body.dark-mode:not(.login) .sec.features .feature-icon i::before,
body.dark-mode:not(.login) .sec.features .feature-icon i::after {
    background: transparent !important;
    box-shadow: none !important;
}

body.dark-mode:not(.login) .sec.features .feature-icon img,
body.dark-mode:not(.login) .sec.features .feature-icon svg {
    display: block !important;
    width: 24px !important;
    height: 24px !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

body.dark-mode:not(.login) .sec.features .feature-icon span,
body.dark-mode:not(.login) .sec.features .feature-icon i,
body.dark-mode:not(.login) .sec.features .feature-item:hover .feature-icon span,
body.dark-mode:not(.login) .sec.features .feature-item:hover .feature-icon i {
    border-radius: 999px !important;
    overflow: hidden !important;
    clip-path: circle(50% at 50% 50%) !important;
}

.section-header .nav-link-right .iti-flag,
.section-header .nav-link-right .iti__flag,
.section-header .nav-link-right .mtd-language-flag,
#wrapper.mtd-register-screen .mtd-register-phone-field .selected-flag .iti-flag,
#wrapper.mtd-register-screen .mtd-register-phone-field .iti__selected-flag .iti__flag,
#wrapper.mtd-register-screen .mtd-register-phone-field .iti-flag,
#wrapper.mtd-register-screen .mtd-register-phone-field .iti__flag,
#wrapper.mtd-register-screen .mtd-details-phone-field .selected-flag .iti-flag,
#wrapper.mtd-register-screen .mtd-details-phone-field .iti__selected-flag .iti__flag,
#wrapper.mtd-register-screen .mtd-details-phone-field .iti-flag,
#wrapper.mtd-register-screen .mtd-details-phone-field .iti__flag,
body.login .mtd-register-phone-field .iti-flag,
body.login .mtd-register-phone-field .iti__flag,
body.login .mtd-details-phone-field .iti-flag,
body.login .mtd-details-phone-field .iti__flag,
body:not(.login) .mtd-register-phone-field .iti-flag,
body:not(.login) .mtd-register-phone-field .iti__flag,
body:not(.login) .mtd-details-phone-field .iti-flag,
body:not(.login) .mtd-details-phone-field .iti__flag {
    background-color: transparent !important;
    border-radius: 2px !important;
    box-shadow: none !important;
    border: 0 !important;
    outline: 0 !important;
    filter: none !important;
}

#wrapper.mtd-register-screen .mtd-register-phone-field .selected-flag,
#wrapper.mtd-register-screen .mtd-details-phone-field .selected-flag,
#wrapper.mtd-register-screen .mtd-register-phone-field .flag-container,
#wrapper.mtd-register-screen .mtd-details-phone-field .flag-container,
body.login .mtd-register-phone-field .selected-flag,
body.login .mtd-details-phone-field .selected-flag,
body.login .mtd-register-phone-field .flag-container,
body.login .mtd-details-phone-field .flag-container,
.section-header .nav-link-right .mtd-language-flag,
.section-header .nav-link-right .mtd-language-flag-shell {
    box-shadow: none !important;
    background-color: transparent !important;
    outline: 0 !important;
}
/* End final dark-mode legacy navigation and icon cleanup */

/* Final sidebar state and flag/icon shape lock */
body.dark-mode:not(.login) #order-standard_cart .panel-sidebar:not(.panel-summary) .list-group-item,
body.dark-mode:not(.login) #order-standard_cart .cart-sidebar .panel-sidebar .list-group-item,
body.dark-mode:not(.login) .panel-sidebar:not(.panel-summary) .list-group-item,
body.dark-mode:not(.login) .cart-sidebar .panel-sidebar .list-group-item {
    color: #dbeafe !important;
    background-color: rgba(10, 25, 45, 0.74) !important;
    background-image: none !important;
    border-color: rgba(96, 165, 250, 0.16) !important;
    text-shadow: none !important;
}

body.dark-mode:not(.login) #order-standard_cart .panel-sidebar:not(.panel-summary) .list-group-item:hover,
body.dark-mode:not(.login) #order-standard_cart .panel-sidebar:not(.panel-summary) .list-group-item:focus,
body.dark-mode:not(.login) #order-standard_cart .panel-sidebar:not(.panel-summary) .list-group-item:active,
body.dark-mode:not(.login) #order-standard_cart .panel-sidebar:not(.panel-summary) .list-group-item.active,
body.dark-mode:not(.login) #order-standard_cart .panel-sidebar:not(.panel-summary) .list-group-item.selected,
body.dark-mode:not(.login) #order-standard_cart .panel-sidebar:not(.panel-summary) .list-group-item.current,
body.dark-mode:not(.login) #order-standard_cart .panel-sidebar:not(.panel-summary) .list-group-item[aria-current="true"],
body.dark-mode:not(.login) #order-standard_cart .panel-sidebar:not(.panel-summary) .list-group-item[aria-selected="true"],
body.dark-mode:not(.login) #order-standard_cart .cart-sidebar .panel-sidebar .list-group-item:hover,
body.dark-mode:not(.login) #order-standard_cart .cart-sidebar .panel-sidebar .list-group-item:focus,
body.dark-mode:not(.login) #order-standard_cart .cart-sidebar .panel-sidebar .list-group-item:active,
body.dark-mode:not(.login) #order-standard_cart .cart-sidebar .panel-sidebar .list-group-item.active,
body.dark-mode:not(.login) #order-standard_cart .cart-sidebar .panel-sidebar .list-group-item.selected,
body.dark-mode:not(.login) #order-standard_cart .cart-sidebar .panel-sidebar .list-group-item.current,
body.dark-mode:not(.login) #order-standard_cart .cart-sidebar .panel-sidebar .list-group-item[aria-current="true"],
body.dark-mode:not(.login) #order-standard_cart .cart-sidebar .panel-sidebar .list-group-item[aria-selected="true"],
body.dark-mode:not(.login) .panel-sidebar:not(.panel-summary) .list-group-item:hover,
body.dark-mode:not(.login) .panel-sidebar:not(.panel-summary) .list-group-item:focus,
body.dark-mode:not(.login) .panel-sidebar:not(.panel-summary) .list-group-item:active,
body.dark-mode:not(.login) .panel-sidebar:not(.panel-summary) .list-group-item.active,
body.dark-mode:not(.login) .panel-sidebar:not(.panel-summary) .list-group-item.selected,
body.dark-mode:not(.login) .panel-sidebar:not(.panel-summary) .list-group-item.current,
body.dark-mode:not(.login) .panel-sidebar:not(.panel-summary) .list-group-item[aria-current="true"],
body.dark-mode:not(.login) .panel-sidebar:not(.panel-summary) .list-group-item[aria-selected="true"],
body.dark-mode:not(.login) .cart-sidebar .panel-sidebar .list-group-item:hover,
body.dark-mode:not(.login) .cart-sidebar .panel-sidebar .list-group-item:focus,
body.dark-mode:not(.login) .cart-sidebar .panel-sidebar .list-group-item:active,
body.dark-mode:not(.login) .cart-sidebar .panel-sidebar .list-group-item.active,
body.dark-mode:not(.login) .cart-sidebar .panel-sidebar .list-group-item.selected,
body.dark-mode:not(.login) .cart-sidebar .panel-sidebar .list-group-item.current,
body.dark-mode:not(.login) .cart-sidebar .panel-sidebar .list-group-item[aria-current="true"],
body.dark-mode:not(.login) .cart-sidebar .panel-sidebar .list-group-item[aria-selected="true"] {
    color: #ffffff !important;
    background-color: transparent !important;
    background-image: linear-gradient(135deg, rgba(37, 99, 235, 0.9), rgba(14, 165, 233, 0.7)) !important;
    border-color: rgba(147, 197, 253, 0.5) !important;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.08), 0 14px 28px rgba(30, 64, 175, 0.24) !important;
    text-shadow: none !important;
}

body.dark-mode:not(.login) #order-standard_cart .panel-sidebar:not(.panel-summary) .list-group-item:hover *,
body.dark-mode:not(.login) #order-standard_cart .panel-sidebar:not(.panel-summary) .list-group-item:focus *,
body.dark-mode:not(.login) #order-standard_cart .panel-sidebar:not(.panel-summary) .list-group-item:active *,
body.dark-mode:not(.login) #order-standard_cart .panel-sidebar:not(.panel-summary) .list-group-item.active *,
body.dark-mode:not(.login) #order-standard_cart .cart-sidebar .panel-sidebar .list-group-item:hover *,
body.dark-mode:not(.login) #order-standard_cart .cart-sidebar .panel-sidebar .list-group-item:focus *,
body.dark-mode:not(.login) #order-standard_cart .cart-sidebar .panel-sidebar .list-group-item:active *,
body.dark-mode:not(.login) #order-standard_cart .cart-sidebar .panel-sidebar .list-group-item.active *,
body.dark-mode:not(.login) .panel-sidebar:not(.panel-summary) .list-group-item:hover *,
body.dark-mode:not(.login) .panel-sidebar:not(.panel-summary) .list-group-item:focus *,
body.dark-mode:not(.login) .panel-sidebar:not(.panel-summary) .list-group-item:active *,
body.dark-mode:not(.login) .panel-sidebar:not(.panel-summary) .list-group-item.active *,
body.dark-mode:not(.login) .cart-sidebar .panel-sidebar .list-group-item:hover *,
body.dark-mode:not(.login) .cart-sidebar .panel-sidebar .list-group-item:focus *,
body.dark-mode:not(.login) .cart-sidebar .panel-sidebar .list-group-item:active *,
body.dark-mode:not(.login) .cart-sidebar .panel-sidebar .list-group-item.active * {
    color: #ffffff !important;
}

.section-header .nav-link-right .iti-flag::before,
.section-header .nav-link-right .iti-flag::after,
.section-header .nav-link-right .iti__flag::before,
.section-header .nav-link-right .iti__flag::after,
.section-header .nav-link-right .mtd-language-flag::before,
.section-header .nav-link-right .mtd-language-flag::after,
body:not(.login) .intl-tel-input .iti-flag::before,
body:not(.login) .intl-tel-input .iti-flag::after,
body:not(.login) .iti .iti__flag::before,
body:not(.login) .iti .iti__flag::after,
body.login .intl-tel-input .iti-flag::before,
body.login .intl-tel-input .iti-flag::after,
body.login .iti .iti__flag::before,
body.login .iti .iti__flag::after,
.mtd-localisation-modal .mtd-language-flag::before,
.mtd-localisation-modal .mtd-language-flag::after {
    content: none !important;
    display: none !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

.section-header .nav-link-right .iti-flag,
.section-header .nav-link-right .iti__flag,
.section-header .nav-link-right .mtd-language-flag,
body:not(.login) .intl-tel-input .iti-flag,
body:not(.login) .iti .iti__flag,
body.login .intl-tel-input .iti-flag,
body.login .iti .iti__flag,
.mtd-localisation-modal .mtd-language-flag {
    background-color: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    outline: 0 !important;
}
/* End final sidebar state and flag/icon shape lock */

/* Final register visual step layout cleanup */
#wrapper.mtd-register-screen .mtd-register-steps {
    width: min(100%, 420px) !important;
    gap: 12px !important;
}

#wrapper.mtd-register-screen .mtd-register-step {
    display: grid !important;
    grid-template-columns: 44px minmax(0, 1fr) !important;
    grid-template-rows: auto auto !important;
    column-gap: 14px !important;
    row-gap: 2px !important;
    align-items: center !important;
    min-width: 0 !important;
    padding: 12px 14px !important;
    border: 1px solid rgba(255, 255, 255, 0.14) !important;
    border-radius: 8px !important;
    background: rgba(255, 255, 255, 0.08) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
}

#wrapper.mtd-register-screen .mtd-register-step i {
    grid-row: 1 / span 2 !important;
    grid-column: 1 !important;
    width: 44px !important;
    height: 44px !important;
    border-radius: 8px !important;
    box-shadow: 0 10px 22px rgba(2, 6, 23, 0.16) !important;
}

#wrapper.mtd-register-screen .mtd-register-step strong,
#wrapper.mtd-register-screen .mtd-register-step small {
    grid-column: 2 !important;
    min-width: 0 !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
    hyphens: none !important;
}

#wrapper.mtd-register-screen .mtd-register-step strong {
    align-self: end !important;
    white-space: nowrap !important;
}

#wrapper.mtd-register-screen .mtd-register-step small {
    align-self: start !important;
    white-space: normal !important;
}

@media (max-width: 991.98px) {
    #wrapper.mtd-register-screen .mtd-register-steps {
        width: 100% !important;
    }
}

/* Clean page-builder feature icons: no ochre outer box or white hover state */
body:not(.login) .sec.features .feature-item .feature-icon:not(#mtd-feature-icon-specificity),
body:not(.login) .sec.features .feature-item:hover .feature-icon:not(#mtd-feature-icon-specificity),
body:not(.login) .sec.features .feature-item:focus-within .feature-icon:not(#mtd-feature-icon-specificity) {
    display: inline-flex !important;
    width: 46px !important;
    height: 46px !important;
    align-items: center !important;
    justify-content: center !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 50% !important;
    box-shadow: none !important;
}

body:not(.login) .sec.features .feature-item .feature-icon:not(#mtd-feature-icon-specificity)::before,
body:not(.login) .sec.features .feature-item .feature-icon:not(#mtd-feature-icon-specificity)::after,
body:not(.login) .sec.features .feature-item:hover .feature-icon:not(#mtd-feature-icon-specificity)::before,
body:not(.login) .sec.features .feature-item:hover .feature-icon:not(#mtd-feature-icon-specificity)::after,
body:not(.login) .sec.features .feature-item:focus-within .feature-icon:not(#mtd-feature-icon-specificity)::before,
body:not(.login) .sec.features .feature-item:focus-within .feature-icon:not(#mtd-feature-icon-specificity)::after {
    display: none !important;
    content: none !important;
    background: transparent !important;
    box-shadow: none !important;
}

body:not(.login) .sec.features .feature-item .feature-icon:not(#mtd-feature-icon-specificity) > span,
body:not(.login) .sec.features .feature-item .feature-icon:not(#mtd-feature-icon-specificity) > i,
body:not(.login) .sec.features .feature-item:hover .feature-icon:not(#mtd-feature-icon-specificity) > span,
body:not(.login) .sec.features .feature-item:hover .feature-icon:not(#mtd-feature-icon-specificity) > i,
body:not(.login) .sec.features .feature-item:focus-within .feature-icon:not(#mtd-feature-icon-specificity) > span,
body:not(.login) .sec.features .feature-item:focus-within .feature-icon:not(#mtd-feature-icon-specificity) > i {
    display: inline-flex !important;
    width: 46px !important;
    height: 46px !important;
    align-items: center !important;
    justify-content: center !important;
    color: #ffffff !important;
    background: linear-gradient(135deg, #1769ff, #0ea5e9) !important;
    border: 0 !important;
    border-radius: 50% !important;
    box-shadow: 0 12px 24px rgba(23, 105, 255, 0.22) !important;
    clip-path: circle(50% at 50% 50%) !important;
}
/* End clean page-builder feature icons */

/* Serepok dark-mode completion: submit ticket and announcements */
body.dark-mode[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-card {
    color: #dce6f4 !important;
    background: linear-gradient(150deg, rgba(16, 35, 62, 0.9), rgba(9, 22, 39, 0.98)) !important;
    border-color: rgba(96, 165, 250, 0.24) !important;
    box-shadow: 0 22px 52px rgba(0, 0, 0, 0.24) !important;
}

body.dark-mode[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-card-heading {
    background:
        linear-gradient(90deg, rgba(37, 99, 235, 0.18), transparent 48%),
        linear-gradient(180deg, #192943, #132137) !important;
    border-bottom-color: rgba(96, 165, 250, 0.2) !important;
}

body.dark-mode[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-card-heading-text strong,
body.dark-mode[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-card label,
body.dark-mode[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .urgency-options > label:first-child {
    color: #f8fbff !important;
}

body.dark-mode[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-card-heading-text small,
body.dark-mode[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-card .form-text,
body.dark-mode[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-card .text-muted,
body.dark-mode[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-message-field .md-footer {
    color: #9fb0c6 !important;
}

body.dark-mode[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-card .form-control,
body.dark-mode[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-card .custom-select,
body.dark-mode[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-department-field .department-dropdown > button,
body.dark-mode[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-related-field .related-product-dropdown > button {
    color: #e8f0fb !important;
    background: rgba(7, 18, 34, 0.86) !important;
    border-color: rgba(96, 165, 250, 0.28) !important;
    box-shadow: none !important;
}

body.dark-mode[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-department-field .department-dropdown > button small,
body.dark-mode[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-related-field .related-product-dropdown > button small {
    color: #9fb0c6 !important;
}

body.dark-mode[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .urgency-options {
    background:
        linear-gradient(90deg, rgba(37, 99, 235, 0.12), transparent),
        rgba(10, 25, 45, 0.82) !important;
    border-color: rgba(96, 165, 250, 0.22) !important;
}

body.dark-mode[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .urgency-options .pcb.sm {
    color: #dce6f4 !important;
    background: #17263b !important;
    border-color: #34445c !important;
    box-shadow: none !important;
}

body.dark-mode[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .urgency-options .mtd-checkbox:checked + .pcb.sm {
    color: #ffffff !important;
    background: linear-gradient(135deg, #2f80ff, #1557df) !important;
    border-color: #4a8fff !important;
    box-shadow: 0 12px 24px rgba(23, 105, 255, 0.25) !important;
}

body.dark-mode[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-message-field .md-editor,
body.dark-mode[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-message-field .md-input,
body.dark-mode[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-message-field textarea,
body.dark-mode[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-message-field .md-preview {
    color: #e8f0fb !important;
    background: rgba(7, 18, 34, 0.88) !important;
    border-color: rgba(96, 165, 250, 0.24) !important;
}

body.dark-mode[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-message-field .md-header,
body.dark-mode[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-message-field .md-footer {
    color: #9fb0c6 !important;
    background: #132137 !important;
    border-color: rgba(96, 165, 250, 0.2) !important;
}

body.dark-mode[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-message-field .md-header .btn,
body.dark-mode[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-message-field .md-control {
    color: #c5d3e6 !important;
    background: #21314a !important;
    border-color: #34445c !important;
}

body.dark-mode[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-message-field .md-header .btn-primary {
    color: #ffffff !important;
    background: linear-gradient(135deg, #2f80ff, #1557df) !important;
    border-color: #4a8fff !important;
}

body[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-attachment-field .custom-file {
    position: relative !important;
    overflow: hidden !important;
}

body[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-attachment-field .custom-file-input {
    position: absolute !important;
    z-index: 2 !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    opacity: 0 !important;
    cursor: pointer !important;
}

body[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-attachment-field .custom-file-label {
    position: absolute !important;
    z-index: 1 !important;
    inset: 0 !important;
    width: 100% !important;
    margin: 0 !important;
}

body[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-attachment-field .custom-file-label::after {
    display: none !important;
    content: none !important;
}

body.dark-mode[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-attachment-field .custom-file-label {
    color: #dce6f4 !important;
    background: #101d31 !important;
    border-color: #34445c !important;
}

body.dark-mode[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .mtd-ticket-attachment-field .btn-addmore {
    color: #ffffff !important;
    background: linear-gradient(135deg, #2f80ff, #1557df) !important;
    border-color: #4a8fff !important;
}

body.dark-mode[data-templatefile="supportticketsubmit-steptwo"]:not(.login) .form-actions {
    border-top-color: rgba(96, 165, 250, 0.22) !important;
}

body.dark-mode:not(.login) .annoucements .annuncement-item {
    color: #dce6f4 !important;
    background: linear-gradient(150deg, rgba(16, 35, 62, 0.82), rgba(9, 22, 39, 0.94)) !important;
    border-color: rgba(96, 165, 250, 0.24) !important;
    box-shadow: 0 18px 42px rgba(0, 0, 0, 0.18) !important;
}

body.dark-mode:not(.login) .annoucements .announcement-date {
    color: #dbeafe !important;
    background: #203351 !important;
    border: 1px solid rgba(96, 165, 250, 0.34) !important;
    box-shadow: none !important;
}

body.dark-mode:not(.login) .annoucements .annuncement-item h2,
body.dark-mode:not(.login) .annoucements .annuncement-item h3 {
    color: #f8fbff !important;
}

body.dark-mode:not(.login) .annoucements .annuncement-body,
body.dark-mode:not(.login) .annoucements .annuncement-body p {
    color: #c7d3e3 !important;
}
/* End Serepok dark-mode completion */

/* Shared native CAPTCHA alignment: Register, Contact, Login, and support forms */
#default-captcha-domainchecker:not(.input-group) {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    justify-items: center !important;
    align-items: center !important;
    gap: 14px !important;
    width: 100% !important;
    margin-right: 0 !important;
    margin-left: 0 !important;
    padding-bottom: 0 !important;
}

#default-captcha-domainchecker:not(.input-group) > p {
    grid-column: 1 / -1;
    width: min(100%, 980px);
    margin: 0 auto 16px !important;
    padding: 0 !important;
    text-align: center !important;
    font-size: clamp(0.95rem, 1.2vw, 1.08rem);
    line-height: 1.5;
}

#default-captcha-domainchecker:not(.input-group) > .col-6 {
    display: flex !important;
    flex: 0 0 auto !important;
    align-items: center !important;
    justify-content: center !important;
    width: min(100%, 360px) !important;
    max-width: 360px !important;
    padding-right: 0 !important;
    padding-left: 0 !important;
}

#default-captcha-domainchecker:not(.input-group) .captchaimage {
    min-height: 62px;
}

#default-captcha-domainchecker:not(.input-group) #inputCaptchaImage {
    display: block !important;
    width: auto !important;
    max-width: 100% !important;
    height: auto !important;
    margin: 0 auto !important;
}

#default-captcha-domainchecker:not(.input-group) #inputCaptcha.form-control {
    float: none !important;
    width: 100% !important;
    max-width: 360px !important;
    min-height: 54px;
    margin: 0 auto !important;
    padding: 12px 16px !important;
    border: 1px solid #cbd5e1 !important;
    border-radius: 10px !important;
    color: #172033 !important;
    background: #ffffff !important;
    text-align: center;
    font-size: 1.05rem;
    letter-spacing: 0.12em;
    box-shadow: none !important;
}

#default-captcha-domainchecker:not(.input-group) #inputCaptcha.form-control:focus {
    border-color: #3478f6 !important;
    box-shadow: 0 0 0 3px rgba(52, 120, 246, 0.18) !important;
}

body.dark-mode #default-captcha-domainchecker:not(.input-group) > p {
    color: #cbd7e8 !important;
}

body.dark-mode #default-captcha-domainchecker:not(.input-group) #inputCaptcha.form-control {
    color: #f8fbff !important;
    background: #101d31 !important;
    border-color: #34465f !important;
}

body.dark-mode #default-captcha-domainchecker:not(.input-group) #inputCaptcha.form-control:focus {
    border-color: #5b9cff !important;
    box-shadow: 0 0 0 3px rgba(91, 156, 255, 0.2) !important;
}

@media (max-width: 575.98px) {
    #default-captcha-domainchecker:not(.input-group) {
        gap: 12px !important;
    }

    #default-captcha-domainchecker:not(.input-group) > p {
        margin-bottom: 10px !important;
        font-size: 0.94rem;
    }

    #default-captcha-domainchecker:not(.input-group) > .col-6,
    #default-captcha-domainchecker:not(.input-group) #inputCaptcha.form-control {
        width: 100% !important;
        max-width: 100% !important;
    }
}
/* End shared native CAPTCHA alignment */

/* Announcements: blue dark-mode Read More action */
body.dark-mode:not(.login) .annoucements .annuncement-footer .btn-link {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 10px;
    min-height: 44px;
    padding: 10px 17px !important;
    color: #ffffff !important;
    background: linear-gradient(135deg, #2f80ff, #1557df) !important;
    border: 1px solid rgba(125, 180, 255, 0.58) !important;
    border-radius: 10px !important;
    box-shadow: 0 10px 24px rgba(21, 87, 223, 0.28) !important;
    text-decoration: none !important;
    cursor: pointer;
    transition:
        transform 160ms ease,
        background 160ms ease,
        border-color 160ms ease,
        box-shadow 160ms ease !important;
}

body.dark-mode:not(.login) .annoucements .annuncement-item:hover .annuncement-footer .btn-link,
body.dark-mode:not(.login) .annoucements .annuncement-footer .btn-link:hover {
    color: #ffffff !important;
    background: linear-gradient(135deg, #4893ff, #1d65ed) !important;
    border-color: rgba(164, 202, 255, 0.78) !important;
    box-shadow: 0 13px 30px rgba(21, 87, 223, 0.4) !important;
    transform: translateY(-1px);
}

body.dark-mode:not(.login) .annoucements .annuncement-footer .btn-link i {
    color: currentColor !important;
    transition: transform 160ms ease;
}

body.dark-mode:not(.login) .annoucements .annuncement-item:hover .annuncement-footer .btn-link i,
body.dark-mode:not(.login) .annoucements .annuncement-footer .btn-link:hover i {
    transform: translateX(3px);
}
/* End announcements dark-mode Read More action */

/* Header cart: compact item bubble pinned to the Cart label */
.section-header .serepok-right-cart .nav-link-right.cart {
    position: relative;
    overflow: visible;
}

.section-header .serepok-right-cart .nav-link-right.cart > .badge {
    position: absolute !important;
    z-index: 2;
    top: -7px;
    right: -9px;
    display: inline-flex !important;
    width: auto;
    min-width: 16px !important;
    height: 16px !important;
    min-height: 16px !important;
    max-height: 16px !important;
    align-items: center;
    justify-content: center;
    margin: 0 !important;
    padding: 0 4px !important;
    color: #ffffff !important;
    background: linear-gradient(135deg, #2f80ff, #1557df) !important;
    border: 1px solid rgba(255, 255, 255, 0.48) !important;
    border-radius: 999px !important;
    box-shadow: 0 4px 10px rgba(21, 87, 223, 0.32) !important;
    font-size: 9px !important;
    font-weight: 800 !important;
    line-height: 14px !important;
    text-align: center;
    box-sizing: border-box;
    pointer-events: none;
}

body.dark-mode .section-header .serepok-right-cart .nav-link-right.cart > .badge {
    color: #ffffff !important;
    background: linear-gradient(135deg, #4595ff, #1768f2) !important;
    border-color: rgba(185, 216, 255, 0.56) !important;
    box-shadow: 0 4px 12px rgba(23, 104, 242, 0.42) !important;
}
/* End compact header cart item bubble */

/* Header brand: square icon with a single-line Rhade Dictionary wordmark */
.section-header .navbar-brand.serepok-brand {
    min-height: 42px;
    max-width: none;
    align-items: center;
    gap: 10px;
    overflow: visible;
}

.section-header .navbar-brand.serepok-brand .serepok-brand-logo {
    flex: 0 0 42px;
    width: 42px !important;
    min-width: 42px;
    max-width: 42px;
    height: 42px !important;
    max-height: 42px;
    object-fit: cover;
    object-position: left center;
    border-radius: 9px;
}

.section-header .navbar-brand.serepok-brand::after {
    content: "Rhade Dictionary";
    display: inline-flex;
    height: 42px;
    align-items: center;
    color: var(--serepok-header-text);
    font-family: Georgia, "Times New Roman", serif;
    font-size: 23px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: -0.25px;
    white-space: nowrap;
}

body.dark-mode .section-header .navbar-brand.serepok-brand::after {
    color: #e2ad54;
}

@media (max-width: 575.98px) {
    .section-header .navbar-brand.serepok-brand {
        min-height: 36px;
        gap: 8px;
    }

    .section-header .navbar-brand.serepok-brand .serepok-brand-logo {
        flex-basis: 36px;
        width: 36px !important;
        min-width: 36px;
        max-width: 36px;
        height: 36px !important;
        max-height: 36px;
        border-radius: 8px;
    }

    .section-header .navbar-brand.serepok-brand::after {
        height: 36px;
        font-size: 20px;
    }
}
/* End single-line header brand */

/* Current main-menu item: blue line anchored to the bottom of the header. */
@media (min-width: 1200px) {
    .section-header [data-serepok-primary-nav] > .nav-item {
        position: relative;
    }

    .section-header [data-serepok-primary-nav] > .nav-item.serepok-current::after {
        content: "";
        position: absolute;
        z-index: 2;
        right: 0;
        bottom: 0;
        left: 0;
        height: 4px;
        border-radius: 4px 4px 0 0;
        background: #2477ff;
        box-shadow: 0 -3px 12px rgba(36, 119, 255, 0.24);
        pointer-events: none;
    }
}
/* End current main-menu item */

/* Sidebar categories: keep long labels and count badges inside the card. */
body:not(.login) .mtd-sidebar-region,
body:not(.login) .mtd-sidebar-card,
body:not(.login) .mtd-sidebar-list {
    min-width: 0;
}

body:not(.login) .mtd-sidebar-list {
    grid-template-columns: minmax(0, 1fr);
    width: 100%;
}

body:not(.login) .mtd-sidebar-link {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
}

body:not(.login) .mtd-sidebar-link-label {
    min-width: 0;
    flex: 1 1 auto;
    white-space: normal;
}

body:not(.login) .mtd-sidebar-link-label .truncate {
    min-width: 0;
    overflow: visible !important;
    white-space: normal !important;
    overflow-wrap: anywhere;
    text-overflow: clip !important;
}

body:not(.login) .mtd-sidebar-link > .badge {
    flex: 0 0 auto;
    margin-left: auto;
}
/* End sidebar category wrapping */

/* Breadcrumbs: make the row full width while keeping every crumb content-sized. */
body:not(.login) .mtd-page-breadcrumb-bar {
    width: 100%;
    justify-content: flex-start;
}

body:not(.login) .mtd-page-breadcrumb-bar .mtd-breadcrumb {
    width: 100%;
    max-width: none;
    flex: 1 1 auto;
    justify-content: flex-start;
}

body:not(.login) .mtd-page-breadcrumb-bar .mtd-breadcrumb-list {
    display: flex;
    max-width: none;
    min-width: 0;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-start;
}

body:not(.login) .mtd-page-breadcrumb-bar .mtd-breadcrumb-item {
    min-width: 0;
    max-width: 100%;
    flex: 0 1 auto;
}

body:not(.login) .mtd-page-breadcrumb-bar .mtd-breadcrumb-item.is-current {
    min-width: 0;
    max-width: 100%;
    flex: 0 1 auto;
}

body:not(.login) .mtd-page-breadcrumb-bar .mtd-breadcrumb-item.is-current .mtd-breadcrumb-current {
    width: auto;
    min-width: 0;
    max-width: 100%;
    flex: 0 1 auto;
    height: auto;
    padding-top: 8px;
    padding-bottom: 8px;
}

body:not(.login) .mtd-page-breadcrumb-bar .mtd-breadcrumb-item.is-current .mtd-breadcrumb-label {
    overflow: visible;
    white-space: normal;
    overflow-wrap: anywhere;
    text-overflow: clip;
    line-height: 1.3;
}

@media (max-width: 767.98px) {
    body:not(.login) .mtd-page-breadcrumb-bar {
        overflow-x: visible;
    }

    body:not(.login) .mtd-page-breadcrumb-bar .mtd-breadcrumb-list {
        width: 100%;
        max-width: 100%;
        flex-wrap: wrap;
    }
}
/* End full-width responsive breadcrumbs */