/* ========================================================
   KhanRDP Official Child Theme Custom Styles
   ======================================================== */

:root {
    --primary-color: #DF3626;
    --primary-hover: #c32f21;
    --dark-slate: #373B42;
    --darker-slate: #2b2e33;
}

/* ========================================================
   Unified Header & Navigation Styling
   ======================================================== */
#khanrdp-nav-wrapper {
    width: 100%;
    position: relative;
    z-index: 1050;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    background: #FFFFFF;
}

#khanrdp-nav-wrapper .header-area {
    position: relative !important;
    z-index: 1060 !important;
    padding: 14px 0 !important;
    background: #FFFFFF !important;
    border-bottom: 1px solid #ECECEC !important;
}

#khanrdp-nav-wrapper .mainlogo {
    max-height: 44px !important;
    width: auto !important;
    display: inline-block !important;
    vertical-align: middle !important;
    transition: opacity 0.2s ease !important;
}
#khanrdp-nav-wrapper .mainlogo:hover {
    opacity: 0.88 !important;
}

#khanrdp-nav-wrapper p.links,
#khanrdp-nav-wrapper .links,
#khanrdp-nav-wrapper .header-links {
    margin: 0 !important;
    text-align: right !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 8px !important;
}

#khanrdp-nav-wrapper .btn-headerlinks {
    color: #475569 !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    text-decoration: none !important;
    padding: 7px 12px !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    background: transparent !important;
    border: none !important;
    border-radius: 6px !important;
    line-height: 1.4 !important;
    transition: all 0.2s ease !important;
}

#khanrdp-nav-wrapper .btn-headerlinks:hover {
    color: #DF3626 !important;
    background: #F8FAFC !important;
}

#khanrdp-nav-wrapper .btn-headercart {
    background-color: #1E293B !important;
    color: #FFFFFF !important;
    padding: 7px 14px !important;
    border-radius: 6px !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 7px !important;
    border: 1px solid #1E293B !important;
    line-height: 1.4 !important;
    transition: all 0.2s ease !important;
}

#khanrdp-nav-wrapper .btn-headercart:hover {
    background-color: #DF3626 !important;
    border-color: #DF3626 !important;
    color: #FFFFFF !important;
    box-shadow: 0 2px 8px rgba(223, 54, 38, 0.25) !important;
}

#khanrdp-nav-wrapper .menu {
    background: #DF3626 !important;
    box-shadow: 0 3px 8px rgba(0,0,0,0.12) !important;
}

#khanrdp-nav-wrapper .navbar {
    padding: 0 !important;
}

#khanrdp-nav-wrapper .navbar-nav .nav-link {
    color: #FFFFFF !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    padding: 14px 12px !important;
    transition: background-color 0.2s ease !important;
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
    white-space: nowrap !important;
}

#khanrdp-nav-wrapper .navbar-nav .nav-link:hover,
#khanrdp-nav-wrapper .navbar-nav .nav-item.active > .nav-link {
    background-color: #c32f21 !important;
    color: #FFFFFF !important;
}

#khanrdp-nav-wrapper .attention .nav-link {
    background-color: #24272c !important;
    color: #FFFFFF !important;
    font-weight: 700 !important;
    border-radius: 3px !important;
    margin: 6px 3px !important;
    padding: 8px 14px !important;
    white-space: nowrap !important;
}

#khanrdp-nav-wrapper .attention .nav-link:hover {
    background-color: #1a1c20 !important;
    color: #FFFFFF !important;
}

/* Multi-level Dropdowns & Precise Navbar Alignment */
#khanrdp-nav-wrapper .menu {
    position: relative !important;
    background: #DF3626 !important;
    box-shadow: 0 3px 8px rgba(0,0,0,0.12) !important;
    z-index: 1020 !important;
}

#khanrdp-nav-wrapper .menu .navbar-nav {
    position: relative !important;
}

#khanrdp-nav-wrapper .menu .nav-item.dropdown {
    position: relative !important;
}

#khanrdp-nav-wrapper .dropdown-menu {
    background-color: #373B42 !important;
    border: none !important;
    border-radius: 0 0 6px 6px !important;
    padding: 4px 0 !important;
    box-shadow: 0 8px 24px rgba(0,0,0,0.22) !important;
    min-width: 240px !important;
    margin-top: 0 !important;
    z-index: 1050 !important;
}

#khanrdp-nav-wrapper .menu .dropdown-menu {
    position: absolute !important;
    top: 100% !important;
    left: 0 !important;
    margin-top: 0 !important;
    z-index: 1040 !important;
}

#khanrdp-nav-wrapper .dropdown-item {
    color: #E2E8F0 !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    padding: 10px 18px !important;
    border-bottom: 1px solid #4a4f59 !important;
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    text-decoration: none !important;
    transition: all 0.15s ease !important;
}

#khanrdp-nav-wrapper .dropdown-item:last-child {
    border-bottom: none !important;
}

#khanrdp-nav-wrapper .dropdown-item:hover {
    background-color: #DF3626 !important;
    color: #FFFFFF !important;
    padding-left: 22px !important;
}

#khanrdp-nav-wrapper .dropdown-submenu {
    position: relative !important;
}

#khanrdp-nav-wrapper .dropdown-submenu > .dropdown-menu {
    position: absolute !important;
    top: 0 !important;
    left: 100% !important;
    margin-top: -4px !important;
    margin-left: 1px !important;
    border-radius: 6px !important;
    z-index: 1050 !important;
}

#khanrdp-nav-wrapper .header-area .dropdown {
    position: relative !important;
    z-index: 1070 !important;
}

#khanrdp-nav-wrapper .header-area .dropdown-menu {
    position: absolute !important;
    right: 0 !important;
    left: auto !important;
    top: 100% !important;
    margin-top: 6px !important;
    border: 1px solid #4a4f59 !important;
    border-radius: 6px !important;
    z-index: 1080 !important;
    box-shadow: 0 10px 25px rgba(0,0,0,0.3) !important;
}

#khanrdp-nav-wrapper .dropdown-divider {
    border-top: 1px solid #4a4f59 !important;
    margin: 4px 0 !important;
}

#khanrdp-nav-wrapper .dropdown-item.text-danger {
    color: #ff7675 !important;
}
#khanrdp-nav-wrapper .dropdown-item.text-danger:hover {
    background-color: #c32f21 !important;
    color: #ffffff !important;
}

@media (min-width: 992px) {
    #khanrdp-nav-wrapper .mobile-only {
        display: none !important;
    }
    #khanrdp-nav-wrapper .nav-item.dropdown:hover > .dropdown-menu {
        display: block !important;
    }
    #khanrdp-nav-wrapper .dropdown-submenu:hover > .dropdown-menu {
        display: block !important;
    }
}

@media (max-width: 991px) {
    #khanrdp-nav-wrapper .mobile-only {
        display: block !important;
    }
    #khanrdp-nav-wrapper .navbar-collapse {
        background-color: #c32f21 !important;
        padding: 12px !important;
    }
    #khanrdp-nav-wrapper .dropdown-menu {
        position: static !important;
        float: none !important;
        background-color: #2b2e33 !important;
    }
    #khanrdp-nav-wrapper .dropdown-submenu > .dropdown-menu {
        left: 0 !important;
    }
}

/* ========================================================
   Clean Breadcrumb & Body Spacing
   ======================================================== */
.master-breadcrumb {
    background: #f8fafc;
    border-bottom: 1px solid #e2e8f0;
    padding: 8px 0;
    margin-bottom: 20px;
}
.master-breadcrumb .breadcrumb {
    background: transparent;
    padding: 0;
    margin: 0;
    font-size: 13px;
}

/* ========================================================
   KhanRDP Modern High-Resolution Wide Fluid Layout
   Eliminates huge side whitespace and expands store & client area
   ======================================================== */
.container,
.main-body-container,
#khanrdp-nav-wrapper .header-area .container,
#khanrdp-nav-wrapper .menu .container,
nav.master-breadcrumb .container,
#main-body > .container,
#main-body > .container-fluid,
#order-standard_cart,
#order-khanrdp_cart,
footer#footer .container,
.footer .container {
    width: 100% !important;
    padding-left: 20px !important;
    padding-right: 20px !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

@media (min-width: 1200px) {
    .container,
    .main-body-container,
    #khanrdp-nav-wrapper .header-area .container,
    #khanrdp-nav-wrapper .menu .container,
    nav.master-breadcrumb .container,
    #main-body > .container,
    #main-body > .container-fluid,
    #order-standard_cart,
    #order-khanrdp_cart,
    footer#footer .container,
    .footer .container {
        max-width: 1680px !important;
        padding-left: 28px !important;
        padding-right: 28px !important;
    }
}

@media (min-width: 1440px) {
    .container,
    .main-body-container,
    #khanrdp-nav-wrapper .header-area .container,
    #khanrdp-nav-wrapper .menu .container,
    nav.master-breadcrumb .container,
    #main-body > .container,
    #main-body > .container-fluid,
    #order-standard_cart,
    #order-khanrdp_cart,
    footer#footer .container,
    .footer .container {
        max-width: 1760px !important;
        padding-left: 32px !important;
        padding-right: 32px !important;
    }
}

@media (min-width: 1920px) {
    .container,
    .main-body-container,
    #khanrdp-nav-wrapper .header-area .container,
    #khanrdp-nav-wrapper .menu .container,
    nav.master-breadcrumb .container,
    #main-body > .container,
    #main-body > .container-fluid,
    #order-standard_cart,
    #order-khanrdp_cart,
    footer#footer .container,
    .footer .container {
        max-width: 1840px !important;
        padding-left: 40px !important;
        padding-right: 40px !important;
    }
}

/* Auth & Registration Layout */
.auth-wrapper {
    width: 100% !important;
}

.auth-wrapper .login-container,
.login-container,
.logincontainer,
.login-card,
.password-reset-container {
    max-width: 520px !important;
    width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

.auth-wrapper .register-container,
.register-container,
.register-card {
    max-width: 920px !important;
    width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

/* Hide WHMCS Default Domain & Configurable Options Tabs & Box on Product Details */
ul.responsive-tabs-sm,
.responsive-tabs-sm-connector,
#configoptions,
#tabConfigurableOptions,
body:has(.khanrdp-client-container) ul.nav-tabs,
body:has(.khanrdp-client-container) .nav-tabs,
body:has(.khanrdp-client-container) .nav-tabs-overflow {
    display: none !important;
}

#tabOverview {
    border: none !important;
    padding-top: 0 !important;
    margin-top: 0 !important;
    box-shadow: none !important;
    display: block !important;
}

.product-details-tab-container,
#domain,
#manage {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 0 !important;
    display: block !important;
    opacity: 1 !important;
}

#domain > .row,
#domain > p,
#domain > h4,
#domain > br,
#domain > hr,
#domain > div:not(.module-client-area),
#domain a[href*="http"]:not(.khanrdp-client-container *) {
    display: none !important;
}

.module-client-area,
.khanrdp-client-container {
    display: block !important;
    text-align: left !important;
    width: 100% !important;
    opacity: 1 !important;
}

#tabOverview > .card {
    display: block !important;
    margin-bottom: 16px !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 10px !important;
    box-shadow: 0 1px 3px rgba(0,0,0,0.04) !important;
    background: #ffffff !important;
}

#main-body {
    padding-bottom: 25px !important;
}

/* Primary Button Styling */
.btn-primary {
    background-color: #DF3626 !important;
    border-color: #DF3626 !important;
}
.btn-primary:hover, .btn-primary:focus, .btn-primary:active {
    background-color: #c32f21 !important;
    border-color: #c32f21 !important;
}

/* Clean Footer */
footer.footer, #footer {
    background: #2b2e33;
    color: #cbd5e1;
    margin-top: 30px !important;
    padding-top: 25px !important;
    padding-bottom: 25px !important;
}
footer.footer a, #footer a {
    color: #e2e8f0;
}
footer.footer a:hover, #footer a:hover {
    color: #DF3626;
}

/* ========================================================
   Hide ONLY Actions Sidebar (Renew Domains & View Cart) in Cart
   Keep Categories Sidebar Visible & Styled in Theme Colors!
   ======================================================== */
[menuItemName="Actions"],
#panelActions,
.panel-sidebar[menuitemname="Actions"] {
    display: none !important;
    visibility: hidden !important;
    height: 0 !important;
    overflow: hidden !important;
}

/* Categories Sidebar KhanRDP Styling */
#panelCategories .panel-heading,
.panel-sidebar[menuitemname="Categories"] .panel-heading {
    background: #373B42 !important;
    color: #FFFFFF !important;
    border-radius: 8px 8px 0 0 !important;
    border-bottom: 2px solid #DF3626 !important;
    padding: 12px 16px !important;
}
#panelCategories .panel-title,
.panel-sidebar[menuitemname="Categories"] .panel-title {
    color: #FFFFFF !important;
    font-size: 15px !important;
    font-weight: 700 !important;
}
#panelCategories .list-group-item.active,
.panel-sidebar[menuitemname="Categories"] .list-group-item.active {
    background-color: #DF3626 !important;
    border-color: #DF3626 !important;
    color: #FFFFFF !important;
    font-weight: 700 !important;
}
#panelCategories .list-group-item:hover:not(.active),
.panel-sidebar[menuitemname="Categories"] .list-group-item:hover:not(.active) {
    background-color: #F8FAFC !important;
    color: #DF3626 !important;
}

/* Fix Order Summary Header Color to KhanRDP Dark Slate */
.order-summary-card .summary-header,
#orderSummary .header,
.panel-order-summary .panel-heading {
    background: #373B42 !important;
    color: #FFFFFF !important;
    border-top: 4px solid #DF3626 !important;
    padding: 14px 18px !important;
}
.order-summary-card .summary-header h3,
#orderSummary .header h2,
#orderSummary .header h3 {
    color: #FFFFFF !important;
    font-weight: 700 !important;
}

/* Fix Configurable Options Title Color */
.product-configurable-options h4,
#order-standard_cart .sub-heading,
.sub-heading {
    color: #0F172A !important;
    font-size: 18px !important;
    font-weight: 700 !important;
    border-bottom: 2px solid #F1F5F9 !important;
    padding-bottom: 8px !important;
    margin-bottom: 16px !important;
}

/* Red Checkout & Continue Buttons */
#btnCompleteOrder,
.lagom-continue-btn,
#orderSummary .btn-primary,
.btn-checkout,
#checkout {
    background-color: #DF3626 !important;
    border-color: #DF3626 !important;
    color: #FFFFFF !important;
    font-weight: 700 !important;
    font-size: 15px !important;
    padding: 12px 20px !important;
    border-radius: 6px !important;
    transition: all 0.2s ease !important;
    box-shadow: 0 4px 12px rgba(223, 54, 38, 0.25) !important;
}
#btnCompleteOrder:hover,
.lagom-continue-btn:hover,
#orderSummary .btn-primary:hover,
.btn-checkout:hover,
#checkout:hover {
    background-color: #c32f21 !important;
    border-color: #c32f21 !important;
    transform: translateY(-1px);
    box-shadow: 0 6px 16px rgba(223, 54, 38, 0.35) !important;
}

/* Soften Warning Alert Box */
.alert-warning {
    background: #F8FAFC !important;
    border: 1px solid #E2E8F0 !important;
    color: #334155 !important;
    border-radius: 8px !important;
}
.alert-warning a,
.alert-warning i {
    color: #DF3626 !important;
    font-weight: 600 !important;
}


/* KHANRDP_MODERN_CART_STYLES_START */

/* Essential WHMCS Utility Classes */
/* Essential WHMCS Utility Classes for Cart & Checkout Forms */
#order-standard_cart .w-hidden,
.checkout-card .w-hidden,
fieldset.w-hidden,
div.form-group.w-hidden {
    display: none;
}
#order-standard_cart .d-none {
    display: none !important;
}

/* Ensure DataTables in Client Area are never hidden */
table.table-list,
table#tableInvoicesList,
.table-container table {
    display: table !important;
}

/* Store Page (products.tpl) Modern Lagom Styling */
.store-hero-header {
    background: linear-gradient(135deg, #FFFFFF 0%, #F8FAFC 100%) !important;
    border: 1px solid #E2E8F0 !important;
    border-radius: 12px !important;
    padding: 24px 30px !important;
    margin-bottom: 28px !important;
    box-shadow: 0 1px 3px rgba(0,0,0,0.02) !important;
}

.store-hero-badge {
    background-color: #DF3626 !important;
    color: #FFFFFF !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    letter-spacing: 0.8px !important;
    padding: 5px 12px !important;
    border-radius: 20px !important;
    display: inline-block !important;
    margin-bottom: 10px !important;
}

.khanrdp-plan-card {
    background: #FFFFFF !important;
    border: 1.5px solid #E2E8F0 !important;
    border-radius: 14px !important;
    padding: 28px 24px !important;
    transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1) !important;
    position: relative !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.03) !important;
    display: flex !important;
    flex-direction: column !important;
    height: 100% !important;
}

.khanrdp-plan-card:hover {
    transform: translateY(-5px) !important;
    box-shadow: 0 14px 30px rgba(0, 0, 0, 0.08) !important;
    border-color: #CBD5E1 !important;
}

.khanrdp-plan-card.featured {
    border: 2px solid #DF3626 !important;
    box-shadow: 0 8px 24px rgba(223, 54, 38, 0.12) !important;
}

.plan-popular-pill {
    position: absolute !important;
    top: -12px !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    background: #DF3626 !important;
    color: #FFFFFF !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    letter-spacing: 0.6px !important;
    padding: 4px 16px !important;
    border-radius: 20px !important;
    box-shadow: 0 4px 10px rgba(223, 54, 38, 0.35) !important;
    white-space: nowrap !important;
}

.khanrdp-plan-card .plan-card-header {
    text-align: center !important;
    border-bottom: 1px solid #F1F5F9 !important;
    padding-bottom: 18px !important;
    margin-bottom: 18px !important;
}

.khanrdp-plan-card .plan-icon-wrapper {
    width: 54px !important;
    height: 54px !important;
    border-radius: 12px !important;
    background: rgba(223, 54, 38, 0.08) !important;
    color: #DF3626 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 24px !important;
    margin-bottom: 12px !important;
}

.khanrdp-plan-card .plan-name {
    font-size: 22px !important;
    font-weight: 800 !important;
    color: #0F172A !important;
    margin-bottom: 4px !important;
    letter-spacing: -0.2px !important;
}

.khanrdp-plan-card .plan-group {
    font-size: 13px !important;
    color: #64748B !important;
}

.khanrdp-plan-card .plan-card-pricing {
    text-align: center !important;
    background: #F8FAFC !important;
    border-radius: 10px !important;
    padding: 16px 12px !important;
    margin-bottom: 20px !important;
    border: 1px solid #F1F5F9 !important;
}

.khanrdp-plan-card .price-val {
    font-size: 32px !important;
    font-weight: 900 !important;
    color: #DF3626 !important;
    line-height: 1 !important;
}

.khanrdp-plan-card .price-cycle {
    font-size: 14px !important;
    color: #64748B !important;
    font-weight: 600 !important;
    margin-left: 2px !important;
}

.khanrdp-plan-card .features-list {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 0 20px 0 !important;
    flex-grow: 1 !important;
}

.khanrdp-plan-card .features-list li,
.khanrdp-plan-card .plan-desc-text li {
    font-size: 13.5px !important;
    color: #334155 !important;
    padding: 8px 0 !important;
    border-bottom: 1px dashed #F1F5F9 !important;
    display: flex !important;
    align-items: center !important;
    line-height: 1.4 !important;
}

.khanrdp-plan-card .features-list li:last-child,
.khanrdp-plan-card .plan-desc-text li:last-child {
    border-bottom: none !important;
}

.btn-khanrdp-plan {
    background: linear-gradient(135deg, #DF3626 0%, #c32f21 100%) !important;
    border: none !important;
    color: #FFFFFF !important;
    font-weight: 800 !important;
    font-size: 14px !important;
    text-transform: uppercase !important;
    padding: 14px 20px !important;
    border-radius: 8px !important;
    transition: all 0.2s ease !important;
    letter-spacing: 0.5px !important;
    box-shadow: 0 4px 14px rgba(223, 54, 38, 0.3) !important;
    display: block !important;
    text-align: center !important;
    text-decoration: none !important;
}

.btn-khanrdp-plan:hover {
    background: linear-gradient(135deg, #c32f21 0%, #a9271a 100%) !important;
    color: #FFFFFF !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 20px rgba(223, 54, 38, 0.45) !important;
}

/* Clean Checkout Inputs (No Icon Overlap) */
#order-standard_cart .form-control,
#order-standard_cart select.form-control,
#order-standard_cart select.custom-select {
    padding: 11px 16px !important;
    height: 46px !important;
    border: 1.5px solid #E2E8F0 !important;
    border-radius: 8px !important;
    font-size: 14.5px !important;
    color: #0F172A !important;
    background-color: #FFFFFF !important;
}

#order-standard_cart .form-control:focus {
    border-color: #DF3626 !important;
    box-shadow: 0 0 0 3.5px rgba(223, 54, 38, 0.15) !important;
    outline: none !important;
}

/* Phone input remains separate with 92px padding */
#order-standard_cart .iti input.form-control,
#order-standard_cart #inputPhone,
#order-standard_cart .phone-input-field,
#order-standard_cart input[name="phonenumber"] {
    padding-left: 92px !important;
}


/* ========================================================
   KhanRDP Modern Cart & Store Complete Stylesheet
   ======================================================== */

:root {
    --khanrdp-red: #DF3626;
    --khanrdp-red-hover: #c32f21;
    --khanrdp-dark: #373B42;
    --khanrdp-border: #E2E8F0;
    --khanrdp-bg-card: #FFFFFF;
    --khanrdp-text-main: #0F172A;
    --khanrdp-text-muted: #64748B;
}

/* Base Container */
#order-standard_cart,
.lagom-style-cart {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
    color: #334155;
    padding-top: 15px;
    padding-bottom: 40px;
}

/* White Card Containers */
.lagom-card {
    background: #FFFFFF !important;
    border: 1px solid #E2E8F0 !important;
    border-radius: 12px !important;
    padding: 24px !important;
    margin-bottom: 24px !important;
    box-shadow: 0 1px 3px rgba(0,0,0,0.03), 0 4px 12px rgba(0,0,0,0.02) !important;
    transition: all 0.2s ease !important;
}

.lagom-card-header {
    border-bottom: 1px solid #F1F5F9 !important;
    padding-bottom: 14px !important;
    margin-bottom: 18px !important;
}

.lagom-card-header h4 {
    font-size: 18px !important;
    font-weight: 700 !important;
    color: #0F172A !important;
    margin: 0 !important;
}

.lagom-card-header p {
    font-size: 13px !important;
    color: #64748B !important;
    margin-top: 4px !important;
    margin-bottom: 0 !important;
}

/* Product Hero Card */
.product-hero-card {
    background: linear-gradient(135deg, #FFFFFF 0%, #F8FAFC 100%) !important;
    border: 1px solid #E2E8F0 !important;
    border-left: 5px solid #DF3626 !important;
    border-radius: 12px !important;
    padding: 24px !important;
    margin-bottom: 24px !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.04) !important;
}

.product-hero-icon {
    width: 50px !important;
    height: 50px !important;
    min-width: 50px !important;
    border-radius: 12px !important;
    background: rgba(223, 54, 38, 0.08) !important;
    color: #DF3626 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 22px !important;
}

.product-hero-title {
    font-size: 24px !important;
    font-weight: 800 !important;
    color: #0F172A !important;
    margin: 0 !important;
}

/* Specs Badge Grid for Product Description */
.product-hero-desc ul,
.product-info ul,
.product-desc-content ul {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    list-style: none !important;
    padding-left: 0 !important;
    margin: 14px 0 0 0 !important;
}

.product-hero-desc ul li,
.product-info ul li,
.product-desc-content ul li {
    background: #FFFFFF !important;
    border: 1px solid #E2E8F0 !important;
    border-radius: 8px !important;
    padding: 7px 14px !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    color: #334155 !important;
    display: inline-flex !important;
    align-items: center !important;
    box-shadow: 0 1px 3px rgba(0,0,0,0.03) !important;
}

.product-hero-desc ul li::before,
.product-info ul li::before,
.product-desc-content ul li::before {
    content: "•";
    color: #DF3626;
    font-weight: bold;
    margin-right: 6px;
    font-size: 16px;
}

/* Billing Cycle Cards (Lagom Style) */
.lagom-cycles-grid {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 16px !important;
    margin-bottom: 8px !important;
}

.lagom-cycle-item {
    flex: 1 1 180px !important;
    max-width: 260px !important;
    min-width: 140px !important;
}

.lagom-cycle-box {
    position: relative !important;
    background: #FFFFFF !important;
    border: 2px solid #E2E8F0 !important;
    border-radius: 12px !important;
    padding: 20px 16px !important;
    text-align: center !important;
    cursor: pointer !important;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1) !important;
    user-select: none !important;
    height: 100% !important;
    min-height: 105px !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    box-shadow: 0 1px 4px rgba(0,0,0,0.04) !important;
}

.lagom-cycle-box:hover {
    border-color: #94A3B8 !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 16px rgba(0,0,0,0.06) !important;
}

.lagom-cycle-box.active {
    border-color: #DF3626 !important;
    background: #FFF8F7 !important;
    box-shadow: 0 0 0 1px #DF3626, 0 6px 20px rgba(223, 54, 38, 0.12) !important;
}

.lagom-cycle-box .cycle-check {
    position: absolute !important;
    top: 10px !important;
    right: 12px !important;
    font-size: 16px !important;
    color: #CBD5E1 !important;
    transition: color 0.2s ease !important;
}

.lagom-cycle-box.active .cycle-check {
    color: #DF3626 !important;
}

.lagom-cycle-box .cycle-name {
    font-size: 15px !important;
    font-weight: 700 !important;
    color: #1E293B !important;
    margin-bottom: 6px !important;
}

.lagom-cycle-box.active .cycle-name {
    color: #0F172A !important;
}

.lagom-cycle-box .cycle-amount {
    font-size: 17px !important;
    font-weight: 800 !important;
    color: #DF3626 !important;
}

.lagom-cycle-box .cycle-badge {
    position: absolute !important;
    top: -11px !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    background: #DF3626 !important;
    color: #FFFFFF !important;
    font-size: 10px !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    padding: 3px 10px !important;
    border-radius: 12px !important;
    letter-spacing: 0.5px !important;
    white-space: nowrap !important;
    box-shadow: 0 2px 6px rgba(223, 54, 38, 0.3) !important;
}

/* Configurable Options Interactive OS Cards */
.config-option-cards {
    display: flex !important;
    flex-wrap: wrap !important;
    margin-left: -6px !important;
    margin-right: -6px !important;
}

.config-option-cards > div {
    padding-left: 6px !important;
    padding-right: 6px !important;
}

.lagom-config-card {
    background: #FFFFFF !important;
    border: 2px solid #E2E8F0 !important;
    border-radius: 10px !important;
    padding: 13px 16px !important;
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    cursor: pointer !important;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1) !important;
    user-select: none !important;
    box-shadow: 0 1px 3px rgba(0,0,0,0.03) !important;
    min-height: 56px !important;
    height: 100% !important;
}

.lagom-config-card:hover {
    border-color: #94A3B8 !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 4px 12px rgba(0,0,0,0.06) !important;
}

.lagom-config-card.active {
    border-color: #DF3626 !important;
    background: #FFF8F7 !important;
    box-shadow: 0 0 0 1px #DF3626, 0 4px 14px rgba(223, 54, 38, 0.12) !important;
}

.lagom-config-card .config-card-os-icon {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 26px !important;
    flex-shrink: 0 !important;
}

.lagom-config-card .config-card-title {
    font-size: 13.5px !important;
    font-weight: 600 !important;
    color: #1E293B !important;
    flex-grow: 1 !important;
    line-height: 1.35 !important;
}

.lagom-config-card.active .config-card-title {
    color: #0F172A !important;
    font-weight: 700 !important;
}

.lagom-config-card .config-card-icon {
    font-size: 16px !important;
    color: #CBD5E1 !important;
    flex-shrink: 0 !important;
    transition: color 0.2s ease !important;
}

.lagom-config-card.active .config-card-icon {
    color: #DF3626 !important;
}

/* Sticky Order Summary Sidebar */
.lagom-sticky-summary {
    position: -webkit-sticky !important;
    position: sticky !important;
    top: 20px !important;
}

.order-summary-card {
    background: #FFFFFF !important;
    border: 1px solid #E2E8F0 !important;
    border-top: 4px solid #DF3626 !important;
    border-radius: 12px !important;
    overflow: hidden !important;
    box-shadow: 0 4px 16px rgba(0,0,0,0.06) !important;
}

.order-summary-card .summary-header,
#orderSummary .header,
.panel-order-summary .panel-heading {
    background: #373B42 !important;
    color: #FFFFFF !important;
    padding: 16px 20px !important;
    border-bottom: 1px solid #4B5563 !important;
}

.order-summary-card .summary-header h3,
#orderSummary .header h2,
#orderSummary .header h3 {
    color: #FFFFFF !important;
    font-size: 18px !important;
    font-weight: 700 !important;
    margin: 0 !important;
}

.order-summary-card .summary-body {
    padding: 20px !important;
    font-size: 14px !important;
}

.order-summary-card .summary-body .product-title {
    font-size: 16px !important;
    font-weight: 700 !important;
    color: #0F172A !important;
    margin-bottom: 10px !important;
}

.order-summary-card .summary-body .summary-total,
#orderSummary .total-due-today {
    font-size: 24px !important;
    font-weight: 800 !important;
    color: #DF3626 !important;
}

/* Red Checkout & Continue Buttons */
#btnCompleteOrder,
.lagom-continue-btn,
#orderSummary .btn-primary,
.btn-checkout,
#checkout {
    background-color: #DF3626 !important;
    border-color: #DF3626 !important;
    color: #FFFFFF !important;
    font-weight: 700 !important;
    font-size: 15px !important;
    padding: 12px 20px !important;
    border-radius: 8px !important;
    transition: all 0.2s ease !important;
    box-shadow: 0 4px 12px rgba(223, 54, 38, 0.25) !important;
}

#btnCompleteOrder:hover,
.lagom-continue-btn:hover,
#orderSummary .btn-primary:hover,
.btn-checkout:hover,
#checkout:hover {
    background-color: #c32f21 !important;
    border-color: #c32f21 !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 6px 18px rgba(223, 54, 38, 0.35) !important;
}

/* Trust Badges Card */
.trust-badges-card {
    background: #FFFFFF !important;
    border: 1px solid #E2E8F0 !important;
    border-radius: 10px !important;
    padding: 14px 10px !important;
    margin-top: 16px !important;
    box-shadow: 0 1px 3px rgba(0,0,0,0.03) !important;
}

.trust-badges-card i {
    color: #DF3626 !important;
}

/* Store Product Plan Cards (products.tpl) */
.khanrdp-plan-card {
    background: #FFFFFF !important;
    border: 1px solid #E2E8F0 !important;
    border-radius: 12px !important;
    padding: 24px 20px !important;
    box-shadow: 0 1px 3px rgba(0,0,0,0.03), 0 4px 12px rgba(0,0,0,0.02) !important;
    transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1) !important;
    position: relative !important;
    overflow: hidden !important;
    display: flex !important;
    flex-direction: column !important;
}

.khanrdp-plan-card:hover {
    transform: translateY(-4px) !important;
    box-shadow: 0 10px 24px rgba(0,0,0,0.08) !important;
    border-color: #CBD5E1 !important;
}

.khanrdp-plan-card.featured {
    border: 2px solid #DF3626 !important;
    box-shadow: 0 8px 24px rgba(223, 54, 38, 0.12) !important;
}

.khanrdp-plan-card .popular-ribbon {
    position: absolute !important;
    top: 16px !important;
    right: -34px !important;
    transform: rotate(45deg) !important;
    background: #DF3626 !important;
    color: #FFFFFF !important;
    font-size: 10px !important;
    font-weight: 800 !important;
    letter-spacing: 0.8px !important;
    padding: 4px 36px !important;
    text-align: center !important;
    box-shadow: 0 2px 6px rgba(223, 54, 38, 0.3) !important;
}

.khanrdp-plan-card .plan-card-header {
    text-align: center !important;
    border-bottom: 1px solid #F1F5F9 !important;
    padding-bottom: 16px !important;
    margin-bottom: 16px !important;
}

.khanrdp-plan-card .plan-icon-wrapper {
    width: 52px !important;
    height: 52px !important;
    border-radius: 50% !important;
    background: rgba(223, 54, 38, 0.08) !important;
    color: #DF3626 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 22px !important;
    margin-bottom: 10px !important;
}

.khanrdp-plan-card .plan-name {
    font-size: 20px !important;
    font-weight: 800 !important;
    color: #0F172A !important;
    margin-bottom: 4px !important;
}

.khanrdp-plan-card .plan-card-pricing {
    text-align: center !important;
    padding: 10px 0 16px 0 !important;
    border-bottom: 1px solid #F1F5F9 !important;
    margin-bottom: 16px !important;
}

.khanrdp-plan-card .price-val {
    font-size: 30px !important;
    font-weight: 800 !important;
    color: #DF3626 !important;
}

.khanrdp-plan-card .price-cycle {
    font-size: 14px !important;
    color: #64748B !important;
}

.khanrdp-plan-card .features-list {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

.khanrdp-plan-card .features-list li,
.khanrdp-plan-card .plan-desc-text li {
    font-size: 13.5px !important;
    color: #334155 !important;
    padding: 7px 0 !important;
    border-bottom: 1px dashed #F1F5F9 !important;
    display: flex !important;
    align-items: center !important;
}

.khanrdp-plan-card .features-list li:last-child,
.khanrdp-plan-card .plan-desc-text li:last-child {
    border-bottom: none !important;
}

.khanrdp-plan-card .features-list li:before,
.khanrdp-plan-card .plan-desc-text li:before {
    content: "058" !important;
    font-family: "Font Awesome 5 Free", "Font Awesome 6 Free", FontAwesome !important;
    font-weight: 900 !important;
    color: #DF3626 !important;
    margin-right: 10px !important;
    font-size: 14px !important;
}

.khanrdp-plan-card .plan-desc-text ul {
    list-style: none !important;
    padding-left: 0 !important;
    margin: 0 !important;
}

.btn-khanrdp-plan {
    background: #DF3626 !important;
    border: 1px solid #DF3626 !important;
    color: #FFFFFF !important;
    font-weight: 700 !important;
    font-size: 14px !important;
    text-transform: uppercase !important;
    padding: 12px 18px !important;
    border-radius: 8px !important;
    transition: all 0.2s ease !important;
    letter-spacing: 0.5px !important;
    box-shadow: 0 2px 6px rgba(223, 54, 38, 0.2) !important;
}

.btn-khanrdp-plan:hover {
    background: #c32f21 !important;
    border-color: #c32f21 !important;
    color: #FFFFFF !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 4px 14px rgba(223, 54, 38, 0.35) !important;
}

/* Hide ONLY Actions Sidebar (Renew Domains, View Cart) */
[menuItemName="Actions"],
#panelActions,
.panel-sidebar[menuitemname="Actions"] {
    display: none !important;
    visibility: hidden !important;
    height: 0 !important;
    overflow: hidden !important;
}

/* Categories Sidebar KhanRDP Styling */
#panelCategories .panel-heading,
.panel-sidebar[menuitemname="Categories"] .panel-heading {
    background: #373B42 !important;
    color: #FFFFFF !important;
    border-radius: 8px 8px 0 0 !important;
    border-bottom: 2px solid #DF3626 !important;
    padding: 12px 16px !important;
}

#panelCategories .panel-title,
.panel-sidebar[menuitemname="Categories"] .panel-title {
    color: #FFFFFF !important;
    font-size: 15px !important;
    font-weight: 700 !important;
}

#panelCategories .list-group-item.active,
.panel-sidebar[menuitemname="Categories"] .list-group-item.active {
    background-color: #DF3626 !important;
    border-color: #DF3626 !important;
    color: #FFFFFF !important;
    font-weight: 700 !important;
}

#panelCategories .list-group-item:hover:not(.active),
.panel-sidebar[menuitemname="Categories"] .list-group-item:hover:not(.active) {
    background-color: #F8FAFC !important;
    color: #DF3626 !important;
}

/* Configurable Options & Location Dropdown Selectors */
select[id*="inputConfigOption"],
.product-configurable-options select {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    cursor: pointer !important;
}

select[id*="inputConfigOption"].d-none {
    display: none !important;
}

#billingCycleContainer,
#billingSelectWrapper,
#inputBillingcycle,
select[name="billingcycle"],
div#billingCycleContainer,
div#billingSelectWrapper,
select#inputBillingcycle {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    position: relative !important;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
    pointer-events: auto !important;
}

#billingCycleCards,
div#billingCycleCards {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    position: relative !important;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
    pointer-events: auto !important;
}

/* ========================================================
   KhanRDP Premium Lagom-Style Checkout Styling
   ======================================================== */

#order-standard_cart,
.lagom-style-cart {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
    color: #1E293B !important;
    -webkit-font-smoothing: antialiased !important;
    -moz-osx-font-smoothing: grayscale !important;
    padding-top: 15px !important;
    padding-bottom: 50px !important;
}

#order-standard_cart .cart-sidebar {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
}

#order-standard_cart .cart-body {
    float: none !important;
    width: 100% !important;
    max-width: 960px !important;
    margin: 0 auto !important;
}

/* Hide legacy floating .field-icon that broke input layouts */
.field-icon:not(.field-icon-inside),
label.field-icon,
#inputStateIcon,
#inputCountryIcon {
    display: none !important;
    visibility: hidden !important;
    width: 0 !important;
    height: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    border: none !important;
    position: absolute !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

/* Modern Lagom Cards */
.lagom-card {
    background: #FFFFFF !important;
    border: 1px solid #E2E8F0 !important;
    border-radius: 12px !important;
    padding: 24px 28px !important;
    margin-bottom: 24px !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04), 0 4px 12px rgba(0, 0, 0, 0.02) !important;
    transition: all 0.2s ease !important;
}

.lagom-card-header {
    border-bottom: 1px solid #F1F5F9 !important;
    padding-bottom: 16px !important;
    margin-bottom: 20px !important;
    display: flex !important;
    align-items: center !important;
}

.lagom-card-icon {
    width: 40px !important;
    height: 40px !important;
    min-width: 40px !important;
    border-radius: 10px !important;
    background: rgba(223, 54, 38, 0.08) !important;
    color: #DF3626 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 18px !important;
    margin-right: 14px !important;
}

.lagom-card-header h4 {
    font-size: 18px !important;
    font-weight: 700 !important;
    color: #0F172A !important;
    margin: 0 !important;
    letter-spacing: -0.2px !important;
}

.lagom-card-header p {
    font-size: 13px !important;
    color: #64748B !important;
    margin-top: 3px !important;
    margin-bottom: 0 !important;
}

/* Account Banner ("Already Registered?") */
.checkout-account-banner {
    background: #FFFFFF !important;
    border: 1.5px solid #E2E8F0 !important;
    border-left: 5px solid #DF3626 !important;
    border-radius: 12px !important;
    padding: 20px 24px !important;
}

.account-banner-avatar {
    width: 42px !important;
    height: 42px !important;
    min-width: 42px !important;
    border-radius: 50% !important;
    background: rgba(223, 54, 38, 0.08) !important;
    color: #DF3626 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 20px !important;
}

.account-banner-title {
    font-size: 16px !important;
    font-weight: 700 !important;
    color: #0F172A !important;
    margin: 0 !important;
}

.account-banner-desc {
    font-size: 13.5px !important;
    color: #64748B !important;
    margin: 0 !important;
}

/* Modern Form Labels */
.form-label,
label.form-label {
    font-size: 12.5px !important;
    font-weight: 700 !important;
    color: #475569 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    margin-bottom: 7px !important;
    display: block !important;
}

/* Input Fields & Modern Icon Inside Input */
.input-with-icon {
    position: relative !important;
    display: block !important;
    width: 100% !important;
}

.input-with-icon .field-icon-inside {
    position: absolute !important;
    left: 14px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    color: #94A3B8 !important;
    font-size: 14px !important;
    pointer-events: none !important;
    z-index: 4 !important;
    line-height: 1 !important;
    transition: color 0.2s ease !important;
}

.input-with-icon:focus-within .field-icon-inside {
    color: #DF3626 !important;
}

#order-standard_cart .form-control,
#order-standard_cart select.form-control,
#order-standard_cart select.custom-select {
    height: 46px !important;
    border: 1.5px solid #E2E8F0 !important;
    border-radius: 8px !important;
    font-size: 14.5px !important;
    font-weight: 500 !important;
    color: #0F172A !important;
    background-color: #FFFFFF !important;
    padding: 10px 14px !important;
    transition: all 0.2s ease !important;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.02) !important;
}

.input-with-icon .form-control,
.input-with-icon select.form-control,
.input-with-icon select.custom-select {
    padding-left: 42px !important;
}

#order-standard_cart .form-control:hover,
#order-standard_cart select.form-control:hover {
    border-color: #CBD5E1 !important;
}

#order-standard_cart .form-control:focus,
#order-standard_cart select.form-control:focus {
    border-color: #DF3626 !important;
    box-shadow: 0 0 0 3.5px rgba(223, 54, 38, 0.15) !important;
    outline: none !important;
    background-color: #FFFFFF !important;
}

#order-standard_cart textarea.form-control {
    height: auto !important;
    padding: 12px 14px !important;
}

/* Phone Input Fix (intl-tel-input: NEVER OVERLAP!) */
.phone-input-wrapper {
    position: relative !important;
    width: 100% !important;
}

.iti,
.iti--allow-dropdown,
.iti--separate-dial-code {
    width: 100% !important;
    display: block !important;
    position: relative !important;
}

#order-standard_cart .iti input.form-control,
#order-standard_cart #inputPhone,
#order-standard_cart .phone-input-field,
#order-standard_cart input[name="phonenumber"],
#order-standard_cart input[name="domaincontactphonenumber"] {
    width: 100% !important;
    padding-left: 92px !important;
    padding-right: 14px !important;
    height: 46px !important;
    border: 1.5px solid #E2E8F0 !important;
    border-radius: 8px !important;
    font-size: 14.5px !important;
    color: #0F172A !important;
    background-color: #FFFFFF !important;
}

#order-standard_cart .iti input.form-control:focus,
#order-standard_cart #inputPhone:focus,
#order-standard_cart .phone-input-field:focus {
    border-color: #DF3626 !important;
    box-shadow: 0 0 0 3.5px rgba(223, 54, 38, 0.15) !important;
}

.iti__flag-container {
    position: absolute !important;
    top: 1px !important;
    bottom: 1px !important;
    left: 1px !important;
    padding: 0 !important;
    z-index: 5 !important;
    display: flex !important;
    align-items: center !important;
}

.iti__selected-flag {
    height: calc(100% - 2px) !important;
    padding: 0 10px 0 12px !important;
    border-radius: 7px 0 0 7px !important;
    background: #F8FAFC !important;
    border-right: 1.5px solid #E2E8F0 !important;
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
}

.iti__selected-flag:hover {
    background: #F1F5F9 !important;
}

.iti__country-list {
    z-index: 1050 !important;
    border-radius: 8px !important;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15) !important;
    border: 1px solid #E2E8F0 !important;
}

/* Total Due Today Card */
.checkout-total-card,
#totalDueToday {
    background: linear-gradient(135deg, #FFF8F7 0%, #FFFFFF 100%) !important;
    border: 2px solid #DF3626 !important;
    border-radius: 12px !important;
    padding: 20px 26px !important;
    margin: 20px 0 !important;
    box-shadow: 0 4px 14px rgba(223, 54, 38, 0.08) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
}

.checkout-total-label {
    font-size: 13.5px !important;
    font-weight: 700 !important;
    color: #475569 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
}

.checkout-total-sub {
    font-size: 13px !important;
    color: #64748B !important;
}

.checkout-total-price,
#totalCartPrice {
    font-size: 32px !important;
    font-weight: 900 !important;
    color: #DF3626 !important;
    line-height: 1 !important;
}

/* Payment Gateways Grid (Lagom Style) */
.payment-methods-grid {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)) !important;
    gap: 16px !important;
    margin-top: 14px !important;
    margin-bottom: 20px !important;
    width: 100% !important;
}

.payment-method-card {
    position: relative !important;
    background: #FFFFFF !important;
    border: 2px solid #E2E8F0 !important;
    border-radius: 12px !important;
    padding: 16px 20px !important;
    margin: 0 !important;
    cursor: pointer !important;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1) !important;
    display: flex !important;
    align-items: center !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.02) !important;
    min-height: 76px !important;
    width: 100% !important;
}

.payment-method-card:hover {
    border-color: #94A3B8 !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.06) !important;
}

.payment-method-card.active,
.payment-method-card:has(input:checked) {
    border-color: #DF3626 !important;
    background: #FFF8F7 !important;
    box-shadow: 0 0 0 1px #DF3626, 0 6px 20px rgba(223, 54, 38, 0.12) !important;
}

.payment-method-card input[type="radio"] {
    position: absolute !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

.payment-method-content {
    display: flex !important;
    align-items: center !important;
    gap: 14px !important;
    width: 100% !important;
}

.payment-method-radio-custom {
    width: 20px !important;
    height: 20px !important;
    min-width: 20px !important;
    border-radius: 50% !important;
    border: 2px solid #CBD5E1 !important;
    background: #FFFFFF !important;
    position: relative !important;
    transition: all 0.2s ease !important;
    flex-shrink: 0 !important;
}

.payment-method-card.active .payment-method-radio-custom,
.payment-method-card:has(input:checked) .payment-method-radio-custom {
    border-color: #DF3626 !important;
    background: #DF3626 !important;
}

.payment-method-card.active .payment-method-radio-custom::after,
.payment-method-card:has(input:checked) .payment-method-radio-custom::after {
    content: "" !important;
    position: absolute !important;
    width: 8px !important;
    height: 8px !important;
    border-radius: 50% !important;
    background: #FFFFFF !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
}

.payment-method-name {
    font-size: 14.5px !important;
    font-weight: 700 !important;
    color: #0F172A !important;
    line-height: 1.4 !important;
    flex-grow: 1 !important;
}

@media (max-width: 767px) {
    .payment-methods-grid {
        grid-template-columns: 1fr !important;
    }
}

/* Complete Order Button */
#btnCompleteOrder {
    background: linear-gradient(135deg, #DF3626 0%, #c32f21 100%) !important;
    border: none !important;
    color: #FFFFFF !important;
    font-weight: 800 !important;
    font-size: 17px !important;
    letter-spacing: 0.5px !important;
    text-transform: uppercase !important;
    padding: 16px 40px !important;
    border-radius: 10px !important;
    transition: all 0.25s ease !important;
    box-shadow: 0 4px 16px rgba(223, 54, 38, 0.35) !important;
    cursor: pointer !important;
    min-width: 280px !important;
}

#btnCompleteOrder:hover {
    background: linear-gradient(135deg, #c32f21 0%, #a9271a 100%) !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 8px 24px rgba(223, 54, 38, 0.45) !important;
}

#btnCompleteOrder:active {
    transform: translateY(0) !important;
}

/* Password Strength Meter */
.password-strength-meter .progress {
    height: 8px !important;
    border-radius: 4px !important;
    background-color: #E2E8F0 !important;
    overflow: hidden !important;
    margin-bottom: 6px !important;
}

.password-strength-meter .progress-bar {
    transition: width 0.3s ease !important;
}

/* Existing Account Selection */
#containerExistingAccountSelect .account {
    border: 2px solid #E2E8F0 !important;
    border-radius: 10px !important;
    padding: 16px !important;
    margin-bottom: 14px !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
    background: #FFFFFF !important;
}

#containerExistingAccountSelect .account.active,
#containerExistingAccountSelect .account:has(input:checked) {
    border-color: #DF3626 !important;
    background: #FFF8F7 !important;
}

.checkout-security-msg {
    background: #F8FAFC !important;
    border: 1px solid #E2E8F0 !important;
    color: #64748B !important;
    border-radius: 8px !important;
    margin-top: 24px !important;
}

/* KHANRDP_MODERN_CART_STYLES_END */

/* Extra Review & Edit Cart Styling */
.cart-review-page {
    padding: 10px 0 40px 0;
}
.cart-review-page .lagom-card {
    background: #FFFFFF !important;
    border: 1px solid #E2E8F0 !important;
    border-radius: 12px !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.02) !important;
    overflow: hidden !important;
    margin-bottom: 24px !important;
}
.cart-review-page .lagom-card-header {
    background: #F8FAFC !important;
    border-bottom: 1px solid #E2E8F0 !important;
    padding: 16px 22px !important;
}
.cart-review-page .lagom-card-body {
    padding: 22px !important;
}
.cart-product-item {
    padding: 20px 22px !important;
    border-bottom: 1px solid #F1F5F9 !important;
    transition: background 0.2s ease !important;
}
.cart-product-item:last-child {
    border-bottom: none !important;
}
.cart-product-item:hover {
    background-color: #FAFAFA !important;
}
.cart-item-name {
    font-size: 16.5px !important;
    font-weight: 700 !important;
    color: #0F172A !important;
}
.cart-item-group {
    font-size: 12px !important;
    background: #F1F5F9 !important;
    color: #475569 !important;
    font-weight: 600 !important;
    padding: 3px 8px !important;
    border-radius: 4px !important;
}
.cart-opt-pill {
    display: inline-block !important;
    background: #F8FAFC !important;
    border: 1px solid #E2E8F0 !important;
    color: #475569 !important;
    font-size: 11.5px !important;
    padding: 3px 8px !important;
    border-radius: 5px !important;
    margin: 2px 4px 2px 0 !important;
}
.cart-price-today {
    font-size: 19px !important;
    font-weight: 800 !important;
    color: #DF3626 !important;
    line-height: 1.2 !important;
}
.cart-summary-sticky {
    position: sticky !important;
    top: 24px !important;
    z-index: 10 !important;
}
.cart-total-box {
    background: #FFF8F7 !important;
    border: 1.5px solid rgba(223, 54, 38, 0.25) !important;
    border-radius: 10px !important;
    padding: 16px !important;
    margin: 18px 0 !important;
    text-align: center !important;
}
.cart-total-box .total-label {
    font-size: 12px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    color: #64748B !important;
    letter-spacing: 0.6px !important;
    margin-bottom: 4px !important;
}
.cart-total-box .total-amt {
    font-size: 28px !important;
    font-weight: 800 !important;
    color: #DF3626 !important;
    line-height: 1.1 !important;
}
.btn-checkout-primary {
    background-color: #DF3626 !important;
    border-color: #DF3626 !important;
    color: #FFFFFF !important;
    font-weight: 700 !important;
    padding: 14px 20px !important;
    font-size: 16px !important;
    border-radius: 8px !important;
    box-shadow: 0 4px 14px rgba(223, 54, 38, 0.3) !important;
    transition: all 0.2s ease !important;
}
.btn-checkout-primary:hover {
    background-color: #C52B1C !important;
    border-color: #C52B1C !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 6px 18px rgba(223, 54, 38, 0.4) !important;
}
.btn-cart-action {
    font-size: 12.5px !important;
    font-weight: 600 !important;
    padding: 5px 12px !important;
    border-radius: 6px !important;
}
.btn-cart-empty {
    color: #EF4444 !important;
    background: #FEF2F2 !important;
    border: 1px solid #FECACA !important;
}
.btn-cart-empty:hover {
    background: #FEE2E2 !important;
    color: #DC2626 !important;
}
.promo-applied-badge {
    background: #ECFDF5 !important;
    border: 1px solid #A7F3D0 !important;
    color: #065F46 !important;
    border-radius: 8px !important;
    padding: 14px 18px !important;
}

/* Clean Single Checkmark Plan Features */
.khanrdp-plan-card .features-list li,
.khanrdp-plan-card .plan-desc-text li,
.plan-feature-row {
    list-style: none !important;
    font-size: 13.5px !important;
    color: #334155 !important;
    padding: 9px 0 !important;
    border-bottom: 1px dashed #F1F5F9 !important;
    display: flex !important;
    align-items: center !important;
    line-height: 1.4 !important;
}
.khanrdp-plan-card .features-list li:before,
.khanrdp-plan-card .plan-desc-text li:before,
.plan-feature-row:before {
    display: none !important;
    content: "" !important;
}
.plan-feature-row i {
    font-size: 14px !important;
    flex-shrink: 0 !important;
}

/* ==========================================================================
   Modern SaaS DataTables, Invoices & Services List Layout
   ========================================================================== */

/* Outer Table Card Container */
.khanrdp-table-card,
.table-container.card {
    background: #FFFFFF !important;
    border: 1px solid #E2E8F0 !important;
    border-radius: 14px !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04), 0 1px 2px rgba(0, 0, 0, 0.02) !important;
    overflow: hidden !important;
    margin-bottom: 24px !important;
    padding: 0 !important;
}

/* DataTables Wrapper */
.dataTables_wrapper {
    padding: 0 !important;
    margin: 0 !important;
    width: 100% !important;
}

/* Top Toolbar: Search Box & Entry Count */
.dataTables_wrapper > .row:first-child,
.dataTables_wrapper > div:first-child:not(.table-responsive):not(table) {
    background: #FFFFFF !important;
    border-bottom: 1px solid #E2E8F0 !important;
    padding: 16px 22px !important;
    margin: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    flex-wrap: wrap !important;
    gap: 12px !important;
}

.dataTables_wrapper .dataTables_info {
    color: #64748B !important;
    font-size: 13.5px !important;
    font-weight: 500 !important;
    padding: 0 !important;
    margin: 0 !important;
    line-height: 1.5 !important;
}

.dataTables_wrapper .dataTables_filter {
    padding: 0 !important;
    margin: 0 !important;
    text-align: right !important;
}

.dataTables_wrapper .dataTables_filter label {
    margin: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    color: #64748B !important;
    font-size: 13px !important;
    font-weight: 500 !important;
}

.dataTables_wrapper .dataTables_filter input[type="search"],
.dataTables_wrapper .dataTables_filter input {
    height: 38px !important;
    padding: 8px 16px 8px 36px !important;
    border: 1px solid #CBD5E1 !important;
    border-radius: 8px !important;
    font-size: 13.5px !important;
    color: #0F172A !important;
    background-color: #F8FAFC !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%2394a3b8'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z'%3E%3C/path%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: 11px center !important;
    background-size: 16px 16px !important;
    transition: all 0.2s ease !important;
    outline: none !important;
    min-width: 240px !important;
    margin-left: 8px !important;
}

.dataTables_wrapper .dataTables_filter input:focus {
    background-color: #FFFFFF !important;
    border-color: #DF3626 !important;
    box-shadow: 0 0 0 3px rgba(223, 54, 38, 0.12) !important;
}

/* Modern Table Headers */
.dataTables_wrapper table.dataTable,
.khanrdp-datatable,
.table-container table {
    border-collapse: separate !important;
    border-spacing: 0 !important;
    margin: 0 !important;
    width: 100% !important;
    border: none !important;
}

.dataTables_wrapper table.dataTable thead th,
.khanrdp-datatable thead th,
.table-container table thead th {
    background-color: #F8FAFC !important;
    color: #475569 !important;
    font-size: 11.5px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.6px !important;
    padding: 14px 20px !important;
    border-top: none !important;
    border-bottom: 1px solid #E2E8F0 !important;
    vertical-align: middle !important;
    white-space: nowrap !important;
    position: relative !important;
}

/* Clean Sorting Arrows */
.dataTables_wrapper table.dataTable thead .sorting,
.dataTables_wrapper table.dataTable thead .sorting_asc,
.dataTables_wrapper table.dataTable thead .sorting_desc {
    cursor: pointer !important;
    padding-right: 26px !important;
}

.dataTables_wrapper table.dataTable thead .sorting::before,
.dataTables_wrapper table.dataTable thead .sorting::after,
.dataTables_wrapper table.dataTable thead .sorting_asc::before,
.dataTables_wrapper table.dataTable thead .sorting_asc::after,
.dataTables_wrapper table.dataTable thead .sorting_desc::before,
.dataTables_wrapper table.dataTable thead .sorting_desc::after {
    right: 10px !important;
    opacity: 0.3 !important;
    font-size: 11px !important;
}

.dataTables_wrapper table.dataTable thead .sorting_asc::before,
.dataTables_wrapper table.dataTable thead .sorting_desc::after {
    opacity: 1 !important;
    color: #DF3626 !important;
}

/* Modern Table Body Rows */
.dataTables_wrapper table.dataTable tbody td,
.khanrdp-datatable tbody td,
.table-container table tbody td {
    padding: 16px 20px !important;
    vertical-align: middle !important;
    border-top: 1px solid #F1F5F9 !important;
    border-bottom: none !important;
    color: #1E293B !important;
    font-size: 13.5px !important;
    background-color: #FFFFFF !important;
    transition: background-color 0.15s ease !important;
}

.dataTables_wrapper table.dataTable tbody tr:hover td,
.khanrdp-datatable tbody tr:hover td,
.table-container table tbody tr:hover td {
    background-color: #F8FAFC !important;
}

/* Bottom Toolbar: Page Length & Pagination */
.dataTables_wrapper > .row:last-child,
.dataTables_wrapper > div:last-child:not(.table-responsive):not(table) {
    background: #FAFBFD !important;
    border-top: 1px solid #E2E8F0 !important;
    padding: 14px 22px !important;
    margin: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    flex-wrap: wrap !important;
    gap: 12px !important;
}

.dataTables_wrapper .dataTables_length {
    color: #64748B !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    padding: 0 !important;
    margin: 0 !important;
}

.dataTables_wrapper .dataTables_length label {
    margin: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
}

.dataTables_wrapper .dataTables_length select {
    height: 34px !important;
    padding: 4px 10px !important;
    border: 1px solid #CBD5E1 !important;
    border-radius: 6px !important;
    font-size: 13px !important;
    color: #0F172A !important;
    background-color: #FFFFFF !important;
    margin: 0 8px !important;
    outline: none !important;
    cursor: pointer !important;
}

.dataTables_wrapper .dataTables_paginate {
    padding: 0 !important;
    margin: 0 !important;
    text-align: right !important;
}

.dataTables_wrapper .dataTables_paginate .pagination {
    margin: 0 !important;
    gap: 4px !important;
    display: inline-flex !important;
    align-items: center !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button,
.dataTables_wrapper .dataTables_paginate .page-item .page-link {
    border-radius: 6px !important;
    border: 1px solid #E2E8F0 !important;
    color: #475569 !important;
    background: #FFFFFF !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    padding: 6px 14px !important;
    margin: 0 2px !important;
    transition: all 0.15s ease !important;
    text-decoration: none !important;
    cursor: pointer !important;
    display: inline-block !important;
    line-height: 1.4 !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button:hover:not(.current):not(.disabled),
.dataTables_wrapper .dataTables_paginate .page-item .page-link:hover {
    background: #F1F5F9 !important;
    color: #0F172A !important;
    border-color: #CBD5E1 !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.current,
.dataTables_wrapper .dataTables_paginate .page-item.active .page-link {
    background: #DF3626 !important;
    border-color: #DF3626 !important;
    color: #FFFFFF !important;
    box-shadow: 0 2px 4px rgba(223, 54, 38, 0.25) !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.disabled,
.dataTables_wrapper .dataTables_paginate .page-item.disabled .page-link {
    opacity: 0.45 !important;
    cursor: not-allowed !important;
    background: #F8FAFC !important;
    border-color: #E2E8F0 !important;
}

/* Sidebar Modern SaaS Cards */
.card-sidebar,
.sidebar .card,
.sidebar .panel {
    border: 1px solid #E2E8F0 !important;
    border-radius: 12px !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.03) !important;
    overflow: hidden !important;
    background: #FFFFFF !important;
    margin-bottom: 20px !important;
}

.card-sidebar .card-header,
.sidebar .card .card-header,
.sidebar .panel .panel-heading {
    background: #F8FAFC !important;
    border-bottom: 1px solid #E2E8F0 !important;
    padding: 12px 18px !important;
    font-weight: 700 !important;
    font-size: 13.5px !important;
    color: #0F172A !important;
}

.card-sidebar .card-body,
.sidebar .card .card-body,
.sidebar .panel .panel-body {
    padding: 16px 18px !important;
    font-size: 13.5px !important;
    color: #475569 !important;
}

.card-sidebar .list-group-item,
.sidebar .list-group-item {
    border-color: #F1F5F9 !important;
    padding: 10px 16px !important;
    font-size: 13.5px !important;
    color: #334155 !important;
    display: flex !important;
    align-items: center !important;
    text-decoration: none !important;
    transition: all 0.15s ease-in-out !important;
}

.card-sidebar .list-group-item:hover,
.sidebar .list-group-item:hover {
    background-color: #F8FAFC !important;
    color: #0F172A !important;
}

.card-sidebar .list-group-item.active,
.sidebar .list-group-item.active {
    background: rgba(223, 54, 38, 0.08) !important;
    color: #DF3626 !important;
    font-weight: 600 !important;
    border-color: #F1F5F9 !important;
}

/* Sidebar flex container and items */
.card-sidebar .sidebar-menu-item-wrapper,
.sidebar .sidebar-menu-item-wrapper,
.sidebar-menu-item-wrapper {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    width: 100% !important;
}

.card-sidebar .sidebar-menu-item-icon-wrapper,
.sidebar .sidebar-menu-item-icon-wrapper,
.sidebar-menu-item-icon-wrapper {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 20px !important;
    min-width: 20px !important;
    margin-right: 8px !important;
    color: #64748B !important;
    text-align: center !important;
    flex-shrink: 0 !important;
}

.card-sidebar .list-group-item.active .sidebar-menu-item-icon-wrapper,
.sidebar .list-group-item.active .sidebar-menu-item-icon-wrapper,
.card-sidebar .list-group-item:hover .sidebar-menu-item-icon-wrapper,
.sidebar .list-group-item:hover .sidebar-menu-item-icon-wrapper {
    color: #DF3626 !important;
}

.card-sidebar .sidebar-menu-item-label,
.sidebar .sidebar-menu-item-label,
.sidebar-menu-item-label {
    flex-grow: 1 !important;
    color: inherit !important;
    font-size: 13.5px !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

.card-sidebar .sidebar-menu-item-badge,
.sidebar .sidebar-menu-item-badge,
.sidebar-menu-item-badge {
    margin-left: auto !important;
    padding-left: 8px !important;
    display: inline-flex !important;
    align-items: center !important;
    flex-shrink: 0 !important;
}

.card-sidebar .sidebar-menu-item-badge .badge,
.sidebar .sidebar-menu-item-badge .badge,
.card-sidebar .list-group-item .badge,
.sidebar .list-group-item .badge {
    background: #F1F5F9 !important;
    color: #475569 !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    padding: 3px 8px !important;
    border-radius: 20px !important;
    border: 1px solid #E2E8F0 !important;
    display: inline-block !important;
    line-height: 1.2 !important;
}

.card-sidebar .list-group-item.active .badge,
.sidebar .list-group-item.active .badge {
    background: #DF3626 !important;
    color: #FFFFFF !important;
    border-color: #DF3626 !important;
}

.sidebar .btn-success {
    background-color: #10B981 !important;
    border-color: #10B981 !important;
    border-radius: 8px !important;
    font-weight: 600 !important;
    box-shadow: 0 1px 2px rgba(16, 185, 129, 0.2) !important;
}

.sidebar .btn-default,
.sidebar .btn-secondary {
    border-radius: 8px !important;
    font-weight: 600 !important;
    border: 1px solid #CBD5E1 !important;
    background: #FFFFFF !important;
    color: #475569 !important;
}

/* ========================================================
   CloudHosts Modern Portal Header Styling
   Scoped strictly under #khanrdp-cloudhosts-header
   ======================================================== */
#khanrdp-cloudhosts-header {
    width: 100%;
    position: relative;
    z-index: 1050;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

#khanrdp-cloudhosts-header .whmcs-topbar {
    background-color: #0E2238 !important;
    color: #CBD5E1 !important;
    font-size: 0.8125rem !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
    padding: 7px 0 !important;
}

#khanrdp-cloudhosts-header .whmcs-topbar a {
    color: #CBD5E1 !important;
    text-decoration: none !important;
    transition: color 0.15s ease-in-out !important;
    display: inline-flex !important;
    align-items: center !important;
}

#khanrdp-cloudhosts-header .whmcs-topbar a:hover {
    color: #FFFFFF !important;
}

#khanrdp-cloudhosts-header .whmcs-topbar .dropdown-toggle::after {
    vertical-align: 0.15em;
    margin-left: 0.35em;
}

#khanrdp-cloudhosts-header .whmcs-topbar .dropdown-menu {
    font-size: 0.825rem !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.2) !important;
    border: 1px solid #E2E8F0 !important;
    border-radius: 8px !important;
    padding: 6px 0 !important;
    min-width: 180px !important;
}

#khanrdp-cloudhosts-header .whmcs-topbar .dropdown-item {
    padding: 7px 16px !important;
    font-size: 13px !important;
    color: #334155 !important;
    display: flex !important;
    align-items: center !important;
}

#khanrdp-cloudhosts-header .whmcs-topbar .dropdown-item:hover,
#khanrdp-cloudhosts-header .whmcs-topbar .dropdown-item.active {
    background-color: #F1F5F9 !important;
    color: #0066CC !important;
}

#khanrdp-cloudhosts-header .whmcs-topbar .badge-cart {
    background-color: #2FB344 !important;
    color: #FFFFFF !important;
    font-size: 0.72rem !important;
    font-weight: 700 !important;
    padding: 2px 7px !important;
    border-radius: 10px !important;
    margin-left: 5px !important;
    display: inline-block !important;
    line-height: 1.2 !important;
}

#khanrdp-cloudhosts-header .whmcs-topbar .badge-notif {
    background-color: #D63939 !important;
    color: #FFFFFF !important;
    font-size: 0.7rem !important;
    font-weight: 700 !important;
    padding: 2px 6px !important;
    border-radius: 10px !important;
    position: absolute !important;
    top: -5px !important;
    right: -8px !important;
    line-height: 1.2 !important;
}

#khanrdp-cloudhosts-header .whmcs-navbar {
    background-color: #12304D !important;
    box-shadow: 0 4px 12px rgba(14, 34, 56, 0.15) !important;
    padding: 0 !important;
    min-height: 56px !important;
}

#khanrdp-cloudhosts-header .whmcs-navbar .navbar-brand {
    font-size: 1.35rem !important;
    font-weight: 700 !important;
    color: #FFFFFF !important;
    letter-spacing: -0.5px !important;
    display: flex !important;
    align-items: center !important;
    padding: 12px 0 !important;
    margin-right: 24px !important;
}

#khanrdp-cloudhosts-header .whmcs-navbar .navbar-brand img {
    max-height: 38px !important;
    width: auto !important;
}

#khanrdp-cloudhosts-header .whmcs-navbar .nav-link {
    color: #E2E8F0 !important;
    font-weight: 500 !important;
    font-size: 0.9rem !important;
    padding: 18px 14px !important;
    transition: all 0.2s ease !important;
    display: flex !important;
    align-items: center !important;
    border-bottom: 3px solid transparent !important;
    white-space: nowrap !important;
    text-transform: none !important;
}

#khanrdp-cloudhosts-header .whmcs-navbar .nav-link i {
    margin-right: 6px !important;
    font-size: 0.95rem !important;
    opacity: 0.85 !important;
}

#khanrdp-cloudhosts-header .whmcs-navbar .nav-link:hover,
#khanrdp-cloudhosts-header .whmcs-navbar .nav-item.active > .nav-link,
#khanrdp-cloudhosts-header .whmcs-navbar .show > .nav-link {
    color: #FFFFFF !important;
    background-color: rgba(255, 255, 255, 0.08) !important;
    border-bottom-color: #38BDF8 !important;
}

#khanrdp-cloudhosts-header .whmcs-navbar .dropdown-menu {
    border-radius: 0 0 8px 8px !important;
    border: none !important;
    background-color: #FFFFFF !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.18) !important;
    padding: 6px 0 !important;
    margin-top: 0 !important;
    font-size: 0.875rem !important;
    min-width: 220px !important;
}

#khanrdp-cloudhosts-header .whmcs-navbar .dropdown-item {
    padding: 9px 18px !important;
    color: #2B3B4C !important;
    display: flex !important;
    align-items: center !important;
    font-size: 13.5px !important;
    border-bottom: none !important;
    transition: all 0.15s ease !important;
    text-transform: none !important;
}

#khanrdp-cloudhosts-header .whmcs-navbar .dropdown-item i {
    margin-right: 10px !important;
    width: 18px !important;
    color: #1C466E !important;
    text-align: center !important;
    opacity: 0.8 !important;
}

#khanrdp-cloudhosts-header .whmcs-navbar .dropdown-item:hover {
    background-color: #F1F5F9 !important;
    color: #0066CC !important;
    padding-left: 20px !important;
}

#khanrdp-cloudhosts-header .whmcs-navbar .dropdown-item:hover i {
    color: #0066CC !important;
    opacity: 1 !important;
}

#khanrdp-cloudhosts-header .btn-open-ticket {
    background-color: #2FB344 !important;
    color: #FFFFFF !important;
    font-weight: 600 !important;
    font-size: 0.825rem !important;
    border-radius: 20px !important;
    padding: 6px 16px !important;
    display: inline-flex !important;
    align-items: center !important;
    border: none !important;
    transition: background-color 0.2s, box-shadow 0.2s !important;
    white-space: nowrap !important;
}

#khanrdp-cloudhosts-header .btn-open-ticket:hover {
    background-color: #249637 !important;
    color: #FFFFFF !important;
    box-shadow: 0 2px 8px rgba(47, 179, 68, 0.35) !important;
}

@media (max-width: 991.98px) {
    #khanrdp-cloudhosts-header .whmcs-navbar .nav-link {
        padding: 12px 16px !important;
        border-bottom: none !important;
    }
    #khanrdp-cloudhosts-header .whmcs-navbar .navbar-collapse {
        padding: 12px 0 16px 0 !important;
        background-color: #0E2238 !important;
        border-top: 1px solid rgba(255, 255, 255, 0.1) !important;
    }
}
