﻿ï»¿/* *****************************************************

    ** Custom Stylesheet **

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

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

/* Custom CSS for Nexus Cart
 *
 * This block allows you to customize theme colors and styles for the entire Nexus Cart 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 {
    --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%;
}
/* CloudNamo WHMCS header branding */
#header .logo {
    display: inline-flex !important;
    align-items: center !important;
    flex: 0 0 auto !important;
    min-height: 40px !important;
    max-width: 180px !important;
    text-decoration: none !important;
}

#header .logo::before,
#header .logo::after {
    content: none !important;
    display: none !important;
}

#header .logo .phox-logo {
    display: none !important;
    width: auto !important;
    max-width: 160px !important;
    height: 40px !important;
    object-fit: contain !important;
}

html:not(.wdes-dark-mode) #header .logo .phox-logo-default.phox-logo--dark,
html.wdes-dark-mode #header .logo .phox-logo-default.phox-logo--light {
    display: block !important;
}

#header .logo .phox-logo-icon {
    display: none !important;
}

@media (max-width: 767px) {
    #header .logo {
        min-height: 34px !important;
        max-width: 150px !important;
    }

    #header .logo .phox-logo {
        max-width: 145px !important;
        height: 34px !important;
    }

    #header .wdes-account-area .wdes-menu-item_content {
        white-space: nowrap !important;
    }
}
/* End CloudNamo WHMCS header branding */
/* CloudNamo WHMCS store polish */
body.wdes-page-order {
    background: linear-gradient(180deg, #f5fbff 0%, #ffffff 48%, #ffffff 100%) !important;
    color: #102436;
}

body.wdes-page-order #main-body {
    padding-top: 0 !important;
    background: transparent !important;
}

body.wdes-page-order #main-body > .container {
    max-width: 1180px;
}

#header {
    background: rgba(255, 255, 255, 0.96) !important;
    border-bottom: 1px solid rgba(16, 36, 54, 0.08) !important;
}

#header .wdes-header {
    min-height: 70px;
}

#header .navbar-toggle {
    border: 1px solid rgba(16, 36, 54, 0.12) !important;
    border-radius: 10px !important;
    padding: 9px 10px !important;
}

#header .navbar-toggle .icon-bar {
    background-color: #6b7280 !important;
}

#order-phox .header-lined {
    border: 0 !important;
    margin: 0 !important;
    padding: 58px 0 34px !important;
    text-align: left !important;
}

#order-phox .header-lined h1 {
    max-width: 820px;
    margin: 0 0 12px !important;
    color: #071827 !important;
    font-family: Inter, "Segoe UI", Arial, sans-serif;
    font-size: 44px !important;
    font-weight: 800 !important;
    line-height: 1.08 !important;
    letter-spacing: 0 !important;
}

#order-phox .header-lined p {
    max-width: 680px;
    margin: 0 !important;
    color: #536274 !important;
    font-size: 16px !important;
    line-height: 1.7 !important;
}

#order-phox > .row {
    margin-left: 0 !important;
    margin-right: 0 !important;
}

#order-phox .cart-sidebar .panel,
#order-phox .sidebar-collapsed .panel {
    border: 1px solid rgba(16, 36, 54, 0.08) !important;
    border-radius: 14px !important;
    box-shadow: 0 14px 36px rgba(16, 36, 54, 0.06) !important;
    overflow: hidden;
}

#order-phox .panel-heading,
#order-phox .card-header {
    background: #f8fbff !important;
    border-bottom: 1px solid rgba(16, 36, 54, 0.08) !important;
}

#order-phox .wdes-phox-products-list {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 24px !important;
    align-items: stretch !important;
}

#order-phox .wdes-phox-products-list_item.product {
    position: relative;
    display: flex !important;
    flex-direction: column !important;
    min-height: 100% !important;
    padding: 30px 26px !important;
    background: #ffffff !important;
    border: 1px solid rgba(16, 36, 54, 0.10) !important;
    border-radius: 18px !important;
    box-shadow: 0 18px 44px rgba(16, 36, 54, 0.08) !important;
    transition: border-color 180ms ease, box-shadow 180ms ease, transform 180ms ease;
}

#order-phox .wdes-phox-products-list_item.product:hover {
    border-color: rgba(47, 128, 237, 0.40) !important;
    box-shadow: 0 24px 58px rgba(47, 128, 237, 0.14) !important;
    transform: translateY(-2px);
}

#order-phox #product2 {
    border-color: rgba(47, 128, 237, 0.42) !important;
}

#order-phox #product2::before {
    content: "Recommandé";
    position: absolute;
    top: 16px;
    right: 16px;
    padding: 7px 11px;
    border-radius: 999px;
    background: rgba(47, 128, 237, 0.10);
    color: #1d5fbf;
    font-size: 12px;
    font-weight: 700;
    line-height: 1;
}

#order-phox .wdes-phox-products-list_item.product header {
    margin: 0 0 22px !important;
    padding: 0 !important;
    border: 0 !important;
    text-align: left !important;
}

#order-phox .product-name {
    display: block;
    margin-right: 96px;
    color: #071827 !important;
    font-size: 22px !important;
    font-weight: 800 !important;
    line-height: 1.25 !important;
    letter-spacing: 0 !important;
}

#order-phox .product-pricing {
    margin-top: 18px !important;
    color: #64748b !important;
    font-size: 14px !important;
    line-height: 1.7 !important;
    text-align: left !important;
}

#order-phox .product-pricing .price {
    display: inline-block;
    color: #071827 !important;
    font-size: 34px !important;
    font-weight: 900 !important;
    line-height: 1 !important;
    letter-spacing: 0 !important;
}

#order-phox .product-desc {
    flex: 1 1 auto;
    margin: 0 !important;
    color: #536274 !important;
    font-size: 15px !important;
    line-height: 1.72 !important;
    text-align: left !important;
}

#order-phox .product-desc ul {
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

#order-phox .product-desc li {
    position: relative;
    padding-left: 0 !important;
}

#order-phox .product-desc .feature-value {
    display: block;
    margin-bottom: 10px;
    color: #22384d !important;
    font-weight: 800 !important;
    line-height: 1.55 !important;
}

#order-phox .wdes-phox-products-list_item.product footer {
    margin-top: 24px !important;
    padding: 0 !important;
    border: 0 !important;
    text-align: left !important;
}

#order-phox .btn-order-now,
#order-phox .btn-primary {
    min-height: 48px;
    border: 0 !important;
    border-radius: 12px !important;
    background: linear-gradient(135deg, #2f80ed 0%, #35d3c4 100%) !important;
    box-shadow: 0 14px 28px rgba(47, 128, 237, 0.22) !important;
    color: #ffffff !important;
    font-weight: 800 !important;
    letter-spacing: 0 !important;
}

#order-phox .btn-order-now:hover,
#order-phox .btn-primary:hover {
    background: linear-gradient(135deg, #246fd0 0%, #25b9ad 100%) !important;
    box-shadow: 0 18px 34px rgba(47, 128, 237, 0.30) !important;
}

@media (max-width: 991px) {
    #order-phox .wdes-phox-products-list {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    #order-phox .header-lined h1 {
        font-size: 38px !important;
    }
}

@media (max-width: 767px) {
    #header .wdes-header {
        min-height: 62px;
    }

    #order-phox .header-lined {
        padding: 34px 0 22px !important;
    }

    #order-phox .header-lined h1 {
        font-size: 32px !important;
        line-height: 1.12 !important;
    }

    #order-phox .header-lined p {
        font-size: 15px !important;
    }

    #order-phox .wdes-phox-products-list {
        grid-template-columns: 1fr !important;
        gap: 18px !important;
    }

    #order-phox .wdes-phox-products-list_item.product {
        padding: 24px 20px !important;
        border-radius: 16px !important;
    }

    #order-phox .product-name {
        margin-right: 0;
        padding-right: 105px;
        font-size: 20px !important;
    }

    #order-phox .product-pricing .price {
        font-size: 30px !important;
    }

    #order-phox .btn-order-now {
        display: flex !important;
        align-items: center;
        justify-content: center;
        width: 100% !important;
    }
}
/* End CloudNamo WHMCS store polish */
/* CloudNamo WHMCS store polish layout fix */
#order-phox .cart-body,
#order-phox .wdes-phox-cart-body,
#order-phox .products,
#order-phox .wdes-phox-products-list {
    width: 100% !important;
    max-width: 100% !important;
}

#order-phox .wdes-phox-products-list_item.product {
    width: auto !important;
    max-width: none !important;
    float: none !important;
    clear: none !important;
    margin: 0 !important;
    overflow: hidden !important;
}

#order-phox .product-name,
#order-phox .product-pricing,
#order-phox .product-desc,
#order-phox .product-desc li,
#order-phox .btn-order-now {
    max-width: 100% !important;
    overflow-wrap: anywhere;
}

@media (max-width: 1199px) {
    #order-phox .wdes-phox-products-list {
        grid-template-columns: 1fr !important;
        max-width: 620px !important;
        margin: 0 auto !important;
    }
}

@media (min-width: 1200px) {
    #order-phox .wdes-phox-products-list {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    }
}
/* End CloudNamo WHMCS store polish layout fix */

/* CloudNamo PHOX Monster harmonization */
:root {
    --cn-ink: #071827;
    --cn-heading: #0b1f33;
    --cn-muted: #64748b;
    --cn-line: rgba(15, 23, 42, 0.10);
    --cn-soft: #f7f9ff;
    --cn-purple: #c59af9;
    --cn-blue: #5d6bff;
    --cn-gradient: linear-gradient(135deg, #c59af9 0%, #5d6bff 100%);
}

#main-body {
    background: #ffffff;
}

#header .wdes-header,
#header .navbar,
section#header,
header.header {
    background: rgba(255, 255, 255, 0.96) !important;
    border-bottom: 1px solid rgba(15, 23, 42, 0.08) !important;
    box-shadow: none !important;
}

#header a,
#header .navbar a,
#header .wdes-header a {
    color: var(--cn-ink) !important;
}

#header a:hover,
#header .navbar a:hover,
#header .wdes-header a:hover {
    color: #8e6cf7 !important;
}

#header .logo-text,
#header .navbar-brand,
#header .wdes-logo-text {
    color: var(--cn-heading) !important;
    font-weight: 800 !important;
    letter-spacing: 0 !important;
}

.cloudnamo-whmcs-home {
    overflow-x: clip;
    color: var(--cn-ink);
    background: #ffffff;
}

body.wdes-page-homepage {
    background: #ffffff !important;
}

.cn-whmcs-hero {
    position: relative;
    overflow: hidden;
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    box-sizing: border-box;
    padding: 78px 0 68px;
    text-align: center;
    background:
        #ffffff;
    background-size: auto;
    border-bottom: 0;
}

.cn-whmcs-hero-inner,
.cn-whmcs-domain-section,
.cn-whmcs-section {
    max-width: 1140px;
    margin-right: auto;
    margin-left: auto;
}

.cn-whmcs-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    margin-bottom: 28px;
    padding: 9px 16px;
    border: 3px solid transparent;
    border-radius: 999px;
    background: linear-gradient(#fff, #fff) padding-box, var(--cn-gradient) border-box;
    color: var(--cn-ink);
    font-size: 14px;
    font-weight: 600;
    line-height: 1;
}

.cn-whmcs-eyebrow i {
    background: var(--cn-gradient);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.cn-whmcs-eyebrow-small {
    margin-bottom: 18px;
}

.cn-whmcs-hero h1 {
    max-width: 920px;
    margin: 0 auto;
    color: var(--cn-purple);
    font-family: Helvetica, Poppins, Inter, "Segoe UI", Arial, sans-serif;
    font-size: clamp(42px, 6vw, 72px);
    font-weight: 400;
    line-height: 1.16;
    letter-spacing: 0;
}

.cn-whmcs-lead,
.cn-whmcs-domain-copy p,
.cn-whmcs-section-head p,
.cn-whmcs-card p {
    color: var(--cn-muted);
    font-size: 17px;
    line-height: 1.7;
}

.cn-whmcs-lead {
    max-width: 760px;
    margin: 24px auto 0;
}

.cn-whmcs-actions {
    display: flex;
    justify-content: center;
    gap: 14px;
    flex-wrap: wrap;
    margin-top: 34px;
}

.cn-whmcs-btn,
.cn-whmcs-card a,
#order-phox .btn-order-now,
#order-phox .btn-primary {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    min-height: 54px;
    padding: 15px 26px !important;
    border-radius: 35px !important;
    border: 0 !important;
    text-decoration: none !important;
    font-weight: 800 !important;
    letter-spacing: 0 !important;
}

.cn-whmcs-btn-primary,
.cn-whmcs-card a,
#order-phox .btn-order-now,
#order-phox .btn-primary {
    background: var(--cn-gradient) !important;
    box-shadow: 0 16px 34px rgba(103, 123, 246, 0.25) !important;
    color: #ffffff !important;
}

.cn-whmcs-btn-secondary {
    background: #ffffff !important;
    border: 1px solid rgba(13, 13, 13, 0.08) !important;
    box-shadow: 0 14px 34px rgba(15, 23, 42, 0.08) !important;
    color: #0d0d0d !important;
}

.cn-whmcs-trust {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin-top: 22px;
    color: var(--cn-muted);
    font-size: 14px;
}

.cn-whmcs-trust i {
    color: #8e6cf7;
}

.cn-whmcs-domain-section {
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(280px, 0.95fr);
    gap: 48px;
    align-items: center;
    padding: 76px 0;
}

.cn-whmcs-domain-copy h2,
.cn-whmcs-section-head h2 {
    margin: 0;
    color: #2b2f38;
    font-size: clamp(34px, 4vw, 52px);
    font-weight: 400;
    line-height: 1.18;
    letter-spacing: 0;
}

.cn-whmcs-domain-form {
    margin-top: 28px;
}

.cn-whmcs-domain-form .input-group {
    display: flex;
    gap: 10px;
    width: 100%;
}

.cn-whmcs-domain-form .form-control {
    min-height: 54px;
    border: 1px solid rgba(15, 23, 42, 0.12) !important;
    border-radius: 14px !important;
    box-shadow: none !important;
}

.cn-whmcs-domain-form .input-group-btn {
    display: flex;
    gap: 10px;
}

.cn-whmcs-domain-form .btn {
    min-height: 54px;
    border-radius: 14px !important;
    background: var(--cn-gradient) !important;
    color: #ffffff !important;
    font-weight: 800 !important;
}

.cn-whmcs-domain-art svg,
.cn-whmcs-domain-art img {
    max-width: 100%;
    height: auto;
}

.cn-whmcs-section {
    padding: 34px 0 76px;
}

.cn-whmcs-section-head {
    max-width: 760px;
    margin-bottom: 30px;
}

.cn-whmcs-card-grid,
.cn-whmcs-help-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 22px;
}

.cn-whmcs-card,
.cn-whmcs-help-grid a {
    position: relative;
    overflow: hidden;
    min-height: 100%;
    padding: 28px;
    border: 1px solid rgba(15, 23, 42, 0.10);
    border-radius: 18px;
    background: #ffffff;
    box-shadow: 0 18px 44px rgba(15, 23, 42, 0.06);
    text-decoration: none !important;
}

.cn-whmcs-card:hover,
.cn-whmcs-help-grid a:hover {
    border-color: rgba(103, 123, 246, 0.42);
    box-shadow: 0 24px 58px rgba(103, 123, 246, 0.13);
}

.cn-whmcs-card-icon,
.cn-whmcs-help-grid i {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 46px;
    height: 46px;
    margin-bottom: 18px;
    border-radius: 14px;
    background: rgba(197, 154, 249, 0.15);
    color: #7460ec;
    font-size: 20px;
}

.cn-whmcs-card h3 {
    margin: 0 0 10px;
    color: var(--cn-heading);
    font-size: 22px;
    font-weight: 800;
    line-height: 1.25;
}

.cn-whmcs-card p {
    min-height: 54px;
    margin-bottom: 22px;
    font-size: 15px;
}

.cn-whmcs-help-grid {
    grid-template-columns: repeat(5, minmax(0, 1fr));
}

.cn-whmcs-help-grid a {
    display: flex;
    min-height: 145px;
    flex-direction: column;
    justify-content: center;
    color: var(--cn-heading) !important;
    font-weight: 800;
}

.cn-whmcs-help-grid i {
    margin-bottom: 14px;
}

#order-phox #product2::before {
    background: rgba(197, 154, 249, 0.16) !important;
    color: #6751dc !important;
}

#order-phox .wdes-phox-products-list_item.product:hover {
    border-color: rgba(103, 123, 246, 0.42) !important;
    box-shadow: 0 24px 58px rgba(103, 123, 246, 0.14) !important;
}

#order-phox .header-lined {
    background:
        radial-gradient(circle at 50% 0%, rgba(103, 123, 246, 0.12), transparent 35%),
        linear-gradient(rgba(103, 123, 246, 0.045) 1px, transparent 1px),
        linear-gradient(90deg, rgba(103, 123, 246, 0.045) 1px, transparent 1px),
        #ffffff !important;
    background-size: auto, 96px 96px, 96px 96px, auto !important;
}

@media (max-width: 991px) {
    .cn-whmcs-domain-section,
    .cn-whmcs-card-grid {
        grid-template-columns: 1fr;
    }

    .cn-whmcs-help-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 767px) {
    .cn-whmcs-hero {
        padding: 56px 16px 48px;
    }

    .cn-whmcs-domain-section,
    .cn-whmcs-section {
        padding-right: 16px;
        padding-left: 16px;
    }

    .cn-whmcs-domain-form .input-group,
    .cn-whmcs-domain-form .input-group-btn {
        display: grid;
        grid-template-columns: 1fr;
    }

    .cn-whmcs-help-grid {
        grid-template-columns: 1fr;
    }
}


/* CloudNamo WHMCS header/menu WordPress match - 2026-05-20 */
#header,
#header .wdes-header,
#header .navbar,
section#header,
header.header {
    background: #ffffff !important;
    border-bottom: 0 !important;
    box-shadow: none !important;
}

#header {
    min-height: 87px !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

#header .container {
    max-width: 1170px !important;
}

#header .wdes-header {
    min-height: 87px !important;
    align-items: center !important;
}

#header .logo {
    transform: translateY(-1px);
}

#header .logo .phox-logo {
    max-width: 143px !important;
    height: 40px !important;
}

#header #main-menu,
#header #nav,
#header #primary-nav {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

#header .navbar-nav > li > a,
#header .wdes-menu-item-link {
    color: #0d0d0d !important;
    font-family: Montserrat, Inter, "Segoe UI", Arial, sans-serif !important;
    font-size: 15px !important;
    font-weight: 500 !important;
    line-height: 27px !important;
    transition: color 180ms ease-in-out, transform 180ms ease-in-out !important;
}

body.wdes-page-homepage #header #primary-nav .navbar-nav > li:first-child > a,
body.wdes-page-homepage #header #primary-nav .navbar-nav > li:first-child > a .wdes-menu-item_content,
#header .navbar-nav > li.active > a,
#header .navbar-nav > li.open > a,
#header .navbar-nav > li > a:hover,
#header .navbar-nav > li > a:focus,
#header .wdes-menu-item.active > .wdes-menu-item-link,
#header .wdes-menu-item.open > .wdes-menu-item-link,
#header .wdes-menu-item-link:hover,
#header .wdes-menu-item-link:focus {
    color: var(--cn-purple) !important;
    background: transparent !important;
}

#header .dropdown-menu {
    border: 0 !important;
    border-radius: 18px !important;
    box-shadow: 0 18px 50px rgba(16, 24, 40, 0.12) !important;
}

#header .dropdown-menu a:hover,
#header .dropdown-menu a:focus {
    color: var(--cn-purple) !important;
    background: rgba(197, 154, 249, 0.08) !important;
}

#header .wdes-account-area > a,
#header .navbar-nav > li.wdes-menu-item-layout--icon > a,
#header .navbar-nav > li.lighter-icon-weight > a {
    border-radius: 999px !important;
    transition: color 180ms ease-in-out, background-color 180ms ease-in-out, box-shadow 180ms ease-in-out !important;
}

#header .wdes-account-area > a:hover,
#header .navbar-nav > li.wdes-menu-item-layout--icon > a:hover,
#header .navbar-nav > li.lighter-icon-weight > a:hover {
    background: rgba(197, 154, 249, 0.10) !important;
    box-shadow: 0 10px 24px rgba(15, 23, 42, 0.08) !important;
}

#header .navbar-toggle {
    min-width: 51px !important;
    min-height: 51px !important;
    border: 2px solid #a87cff !important;
    border-radius: 999px !important;
    background: #ffffff !important;
    box-shadow: none !important;
}

#header .navbar-toggle:hover,
#header .navbar-toggle:focus {
    background: rgba(197, 154, 249, 0.08) !important;
}

@media (max-width: 767px) {
    #header {
        min-height: 87px !important;
    }

    #header .wdes-header {
        min-height: 87px !important;
    }

    #header .logo .phox-logo {
        max-width: 143px !important;
        height: 40px !important;
    }
}
/* End CloudNamo WHMCS header/menu WordPress match */

/* End CloudNamo PHOX Monster harmonization */

/* CloudNamo WHMCS mobile overflow fix - 2026-05-10 */
@media (max-width: 480px) {
  html,
  body {
    max-width: 100%;
    overflow-x: hidden;
  }

  .cn-whmcs-domain-copy,
  .cn-whmcs-domain-form,
  .cn-whmcs-domain-art,
  #frmDomainHomepage,
  #frmDomainHomepage .wdes-input-group,
  #frmDomainHomepage .input-group-btn,
  #frmDomainHomepage .form-control,
  #frmDomainHomepage .btn.search,
  #frmDomainHomepage .btn.transfer {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box;
  }

  #frmDomainHomepage .row,
  #frmDomainHomepage [class*="col-xs-"] {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    box-sizing: border-box;
  }

  #frmDomainHomepage .wdes-domain-register-box-filter {
    flex-wrap: wrap;
    align-items: flex-start;
    gap: 10px 14px;
  }

  #frmDomainHomepage .wdes-domain-register-box-filter-safe-search {
    max-width: 100%;
    white-space: normal;
  }
}
/* CloudNamo PHOX dark mode compatibility - 2026-05-13
   Keep PHOX native dark-mode switching intact and only adapt CloudNamo overrides. */
html.wdes-dark-mode {
    --cn-ink: #f5f7ff;
    --cn-heading: #ffffff;
    --cn-muted: #d8def0;
    --cn-line: rgba(255, 255, 255, 0.10);
    --cn-soft: #071024;
    --cn-purple: #c59af9;
    --cn-blue: #7b8cff;
    --cn-gradient: linear-gradient(135deg, #c59af9 0%, #5d6bff 100%);
}

html.wdes-dark-mode body,
html.wdes-dark-mode #main-body,
html.wdes-dark-mode .cloudnamo-whmcs-home {
    background: #050914 !important;
    color: var(--cn-ink) !important;
}

html.wdes-dark-mode #header,
html.wdes-dark-mode #header .wdes-header,
html.wdes-dark-mode #header .navbar,
html.wdes-dark-mode section#header,
html.wdes-dark-mode header.header {
    background: rgba(5, 9, 20, 0.96) !important;
    border-bottom-color: rgba(255, 255, 255, 0.08) !important;
    box-shadow: none !important;
}

html.wdes-dark-mode #header a,
html.wdes-dark-mode #header .navbar a,
html.wdes-dark-mode #header .wdes-header a,
html.wdes-dark-mode #header .logo::after,
html.wdes-dark-mode #header .logo-text,
html.wdes-dark-mode #header .navbar-brand,
html.wdes-dark-mode #header .wdes-logo-text {
    color: var(--cn-heading) !important;
}

html.wdes-dark-mode #header a:hover,
html.wdes-dark-mode #header .navbar a:hover,
html.wdes-dark-mode #header .wdes-header a:hover {
    color: #c59af9 !important;
}

html.wdes-dark-mode #header .navbar-toggle {
    border-color: rgba(255, 255, 255, 0.16) !important;
}

html.wdes-dark-mode #header .navbar-toggle .icon-bar {
    background-color: var(--cn-ink) !important;
}

html.wdes-dark-mode body.wdes-page-homepage {
    background:
        linear-gradient(rgba(5, 9, 20, 0.20), rgba(5, 9, 20, 0.90)),
        url('../img/cloudnamo-monster-bg-hero.png') center top / cover no-repeat,
        #050914 !important;
    color: var(--cn-ink) !important;
}

html.wdes-dark-mode body.wdes-page-homepage #main-body,
html.wdes-dark-mode body.wdes-page-homepage .cloudnamo-whmcs-home {
    background: transparent !important;
}

html.wdes-dark-mode .cn-whmcs-hero {
    background: transparent !important;
    border-bottom-color: transparent !important;
}

html.wdes-dark-mode .cn-whmcs-eyebrow {
    background: #ffffff !important;
    border-color: transparent !important;
    color: #0d0d0d !important;
}

html.wdes-dark-mode .cn-whmcs-hero h1,
html.wdes-dark-mode .cn-whmcs-domain-copy h2,
html.wdes-dark-mode .cn-whmcs-section-head h2,
html.wdes-dark-mode .cn-whmcs-card h3,
html.wdes-dark-mode .cn-whmcs-help-grid a {
    color: var(--cn-heading) !important;
}

html.wdes-dark-mode .cn-whmcs-lead,
html.wdes-dark-mode .cn-whmcs-domain-copy p,
html.wdes-dark-mode .cn-whmcs-section-head p,
html.wdes-dark-mode .cn-whmcs-card p,
html.wdes-dark-mode .cn-whmcs-trust {
    color: var(--cn-muted) !important;
}

html.wdes-dark-mode .cn-whmcs-btn-secondary {
    background: rgba(255, 255, 255, 0.10) !important;
    border: 1px solid rgba(255, 255, 255, 0.12) !important;
    color: #f5f7ff !important;
}

html.wdes-dark-mode .cn-whmcs-domain-form .form-control {
    background: rgba(8, 15, 32, 0.92) !important;
    border-color: rgba(255, 255, 255, 0.14) !important;
    color: var(--cn-heading) !important;
}

html.wdes-dark-mode .cn-whmcs-domain-form .form-control::placeholder {
    color: #aeb8d3 !important;
}

html.wdes-dark-mode .cn-whmcs-card,
html.wdes-dark-mode .cn-whmcs-help-grid a {
    background: rgba(8, 15, 32, 0.86) !important;
    border-color: rgba(167, 139, 255, 0.22) !important;
    box-shadow: 0 22px 58px rgba(0, 0, 0, 0.34) !important;
}

html.wdes-dark-mode .cn-whmcs-card:hover,
html.wdes-dark-mode .cn-whmcs-help-grid a:hover {
    border-color: rgba(197, 154, 249, 0.42) !important;
    box-shadow: 0 24px 58px rgba(103, 123, 246, 0.22) !important;
}

html.wdes-dark-mode .cn-whmcs-card-icon,
html.wdes-dark-mode .cn-whmcs-help-grid i {
    background: rgba(197, 154, 249, 0.16) !important;
    color: #f1eaff !important;
}

html.wdes-dark-mode body.wdes-page-order {
    background: #121212 !important;
    color: var(--cn-ink) !important;
}

html.wdes-dark-mode #order-phox .header-lined {
    background:
        radial-gradient(circle at 50% 0%, rgba(103, 123, 246, 0.20), transparent 35%),
        linear-gradient(rgba(255, 255, 255, 0.045) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.045) 1px, transparent 1px),
        #121212 !important;
}

html.wdes-dark-mode #order-phox .header-lined h1,
html.wdes-dark-mode #order-phox .product-name,
html.wdes-dark-mode #order-phox .product-pricing .price,
html.wdes-dark-mode #order-phox .product-desc .feature-value {
    color: var(--cn-heading) !important;
}

html.wdes-dark-mode #order-phox .header-lined p,
html.wdes-dark-mode #order-phox .product-pricing,
html.wdes-dark-mode #order-phox .product-desc {
    color: var(--cn-muted) !important;
}

html.wdes-dark-mode #order-phox .cart-sidebar .panel,
html.wdes-dark-mode #order-phox .sidebar-collapsed .panel,
html.wdes-dark-mode #order-phox .wdes-phox-products-list_item.product {
    background: #1b1b20 !important;
    border-color: rgba(255, 255, 255, 0.10) !important;
    box-shadow: 0 18px 44px rgba(0, 0, 0, 0.26) !important;
}

html.wdes-dark-mode #order-phox .panel-heading,
html.wdes-dark-mode #order-phox .card-header {
    background: #24242a !important;
    border-bottom-color: rgba(255, 255, 255, 0.10) !important;
}

html.wdes-dark-mode #order-phox #product2::before {
    background: rgba(197, 154, 249, 0.18) !important;
    color: #e5d8ff !important;
}

html.wdes-dark-mode .cloudnamo-legal-footer-links a {
    color: var(--cn-muted) !important;
}

html.wdes-dark-mode .cloudnamo-legal-footer-links a:hover {
    color: #e5d8ff !important;
}

/* CloudNamo WHMCS client-wide WordPress alignment - 2026-05-20
   Keep PHOX native templates and switches; only harmonize colors/surfaces. */
:root {
    --cn-wp-bg-dark: #050914;
    --cn-wp-panel-dark: rgba(8, 15, 32, 0.90);
    --cn-wp-panel-dark-soft: rgba(8, 15, 32, 0.76);
    --cn-wp-text-dark: #f5f7ff;
    --cn-wp-muted-dark: #d8def0;
    --cn-wp-line-dark: rgba(255, 255, 255, 0.11);
    --cn-wp-line-light: rgba(15, 23, 42, 0.10);
    --cn-wp-purple: #c59af9;
    --cn-wp-blue: #5d6bff;
    --cn-wp-gradient: linear-gradient(135deg, #c59af9 0%, #5d6bff 100%);
}

body:not(.wdes-page-homepage):not(.wdes-page-order):not(.wdes-account-page),
body:not(.wdes-page-homepage):not(.wdes-page-order):not(.wdes-account-page) #main-body {
    background: #ffffff !important;
}

body:not(.wdes-page-homepage):not(.wdes-page-order):not(.wdes-account-page) .header-lined {
    background:
        radial-gradient(circle at 50% 0%, rgba(197, 154, 249, 0.12), transparent 34%),
        linear-gradient(rgba(93, 107, 255, 0.035) 1px, transparent 1px),
        linear-gradient(90deg, rgba(93, 107, 255, 0.035) 1px, transparent 1px),
        #ffffff !important;
    background-size: auto, 90px 90px, 90px 90px, auto !important;
    border-bottom: 0 !important;
}

body:not(.wdes-page-homepage):not(.wdes-page-order):not(.wdes-account-page) .header-lined h1,
body:not(.wdes-page-homepage):not(.wdes-page-order):not(.wdes-account-page) .main-content h1,
body:not(.wdes-page-homepage):not(.wdes-page-order):not(.wdes-account-page) .main-content h2 {
    color: #0d0d0d !important;
    letter-spacing: 0 !important;
}

body:not(.wdes-page-homepage):not(.wdes-page-order):not(.wdes-account-page) .main-content .panel,
body:not(.wdes-page-homepage):not(.wdes-page-order):not(.wdes-account-page) .main-content .card,
body:not(.wdes-page-homepage):not(.wdes-page-order):not(.wdes-account-page) .main-content .list-group-item,
body:not(.wdes-page-homepage):not(.wdes-page-order):not(.wdes-account-page) .main-content .kb-category,
body:not(.wdes-page-homepage):not(.wdes-page-order):not(.wdes-account-page) .main-content .knowledgebase-cat,
body.wdes-page-knowledgebase .main-content .wdes-kb-item,
body.wdes-page-knowledgebase .main-content .wdes-kb-article-item,
body.wdes-page-announcements .main-content .wdes-phox-announcement-block,
body.wdes-page-knowledgebase .main-content .kb-search,
body:not(.wdes-page-homepage):not(.wdes-page-order):not(.wdes-account-page) .main-content .search-box {
    background: #ffffff !important;
    border-color: var(--cn-wp-line-light) !important;
    box-shadow: 0 18px 46px rgba(15, 23, 42, 0.06) !important;
}

body:not(.wdes-page-homepage):not(.wdes-page-order):not(.wdes-account-page) .main-content .btn-primary,
body:not(.wdes-page-homepage):not(.wdes-page-order):not(.wdes-account-page) .main-content button[type="submit"].btn,
body.wdes-page-announcements .main-content .wdes-read-more-btn-announcement,
.wdes-wrap-account-page_main-article_form_action {
    background: var(--cn-wp-gradient) !important;
    border: 0 !important;
    border-radius: 999px !important;
    color: #ffffff !important;
    box-shadow: 0 18px 34px rgba(93, 107, 255, 0.18) !important;
}

body.wdes-account-page,
body.wdes-account-page #main-body {
    background: #ffffff !important;
}

body.wdes-account-page .wdes-wrap-account-page {
    background:
        radial-gradient(circle at 30% 10%, rgba(197, 154, 249, 0.20), transparent 34%),
        radial-gradient(circle at 74% 22%, rgba(93, 107, 255, 0.16), transparent 30%),
        linear-gradient(rgba(93, 107, 255, 0.035) 1px, transparent 1px),
        linear-gradient(90deg, rgba(93, 107, 255, 0.035) 1px, transparent 1px),
        #ffffff !important;
    background-size: auto, auto, 90px 90px, 90px 90px, auto !important;
}

body.wdes-account-page .wdes-wrap-account-page_header .logo {
    border: 0 !important;
    border-radius: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
}

body.wdes-account-page:not(.wdes-dark-mode) .wdes-wrap-account-page_header .phox-logo--light,
html:not(.wdes-dark-mode) body.wdes-account-page .wdes-wrap-account-page_header .phox-logo--light {
    display: none !important;
}

body.wdes-account-page:not(.wdes-dark-mode) .wdes-wrap-account-page_header .phox-logo--dark,
html:not(.wdes-dark-mode) body.wdes-account-page .wdes-wrap-account-page_header .phox-logo--dark {
    display: block !important;
}

body.wdes-account-page .wdes-wrap-account-page_main_article {
    background: rgba(255, 255, 255, 0.94) !important;
    border: 1px solid var(--cn-wp-line-light) !important;
    border-radius: 18px !important;
    box-shadow: 0 24px 70px rgba(15, 23, 42, 0.10) !important;
}

body.wdes-account-page .wdes-wrap-account-page_main-article_heading .header-lined {
    background: transparent !important;
}

body.wdes-account-page .wdes-wrap-account-page_main-article_heading .header-lined h1 {
    color: #0d0d0d !important;
    font-family: Montserrat, Inter, "Segoe UI", Arial, sans-serif !important;
    font-weight: 500 !important;
}

body.wdes-account-page .wdes-wrap-account-page_main-article_form .form-control,
body.wdes-account-page .wdes-wrap-account-page_main-article_form .field,
body.wdes-account-page .wdes-wrap-account-page_main-article_form input[type="tel"] {
    min-height: 44px !important;
    border-color: rgba(93, 107, 255, 0.24) !important;
    border-radius: 10px !important;
    box-shadow: none !important;
}

body.wdes-account-page .wdes-wrap-account-page_main-article_form .form-control:focus,
body.wdes-account-page .wdes-wrap-account-page_main-article_form .field:focus,
body.wdes-account-page .wdes-wrap-account-page_main-article_form input[type="tel"]:focus {
    border-color: rgba(93, 107, 255, 0.72) !important;
    box-shadow: 0 0 0 3px rgba(93, 107, 255, 0.12) !important;
}

html.wdes-dark-mode body:not(.wdes-page-homepage):not(.wdes-page-order):not(.wdes-account-page) {
    background:
        linear-gradient(rgba(5, 9, 20, 0.20), rgba(5, 9, 20, 0.90)),
        url('../img/cloudnamo-monster-bg-hero.png') center top / cover no-repeat,
        var(--cn-wp-bg-dark) !important;
    color: var(--cn-wp-text-dark) !important;
}

html.wdes-dark-mode body:not(.wdes-page-homepage):not(.wdes-page-order):not(.wdes-account-page) #main-body {
    background: transparent !important;
    color: var(--cn-wp-text-dark) !important;
}

html.wdes-dark-mode body:not(.wdes-page-homepage):not(.wdes-page-order):not(.wdes-account-page) .header-lined {
    background: transparent !important;
    border-bottom: 1px solid var(--cn-wp-line-dark) !important;
    box-shadow: none !important;
}

html.wdes-dark-mode body:not(.wdes-page-homepage):not(.wdes-page-order):not(.wdes-account-page) .main-content .panel,
html.wdes-dark-mode body:not(.wdes-page-homepage):not(.wdes-page-order):not(.wdes-account-page) .main-content .card,
html.wdes-dark-mode body:not(.wdes-page-homepage):not(.wdes-page-order):not(.wdes-account-page) .main-content .list-group-item,
html.wdes-dark-mode body:not(.wdes-page-homepage):not(.wdes-page-order):not(.wdes-account-page) .main-content .kb-category,
html.wdes-dark-mode body:not(.wdes-page-homepage):not(.wdes-page-order):not(.wdes-account-page) .main-content .knowledgebase-cat,
html.wdes-dark-mode body.wdes-page-knowledgebase .main-content .wdes-kb-item,
html.wdes-dark-mode body.wdes-page-knowledgebase .main-content .wdes-kb-article-item,
html.wdes-dark-mode body.wdes-page-announcements .main-content .wdes-phox-announcement-block,
html.wdes-dark-mode body.wdes-page-knowledgebase .main-content .kb-search,
html.wdes-dark-mode body:not(.wdes-page-homepage):not(.wdes-page-order):not(.wdes-account-page) .main-content .search-box,
html.wdes-dark-mode body:not(.wdes-page-homepage):not(.wdes-page-order):not(.wdes-account-page) .sidebar .panel,
html.wdes-dark-mode body:not(.wdes-page-homepage):not(.wdes-page-order):not(.wdes-account-page) .sidebar .list-group-item {
    background: var(--cn-wp-panel-dark) !important;
    border-color: rgba(167, 139, 255, 0.20) !important;
    box-shadow: 0 22px 58px rgba(0, 0, 0, 0.32) !important;
}

body:not(.wdes-page-homepage):not(.wdes-page-order):not(.wdes-account-page) .sidebar .panel {
    overflow: hidden !important;
    margin-bottom: 22px !important;
    background: #ffffff !important;
    border: 1px solid var(--cn-wp-line-light) !important;
    border-radius: 8px !important;
    box-shadow: 0 18px 46px rgba(15, 23, 42, 0.06) !important;
}

body:not(.wdes-page-homepage):not(.wdes-page-order):not(.wdes-account-page) .sidebar .panel-heading {
    padding: 14px 16px 8px !important;
    background: transparent !important;
    border: 0 !important;
}

body:not(.wdes-page-homepage):not(.wdes-page-order):not(.wdes-account-page) .sidebar .panel-title {
    margin: 0 !important;
    color: #0d0d0d !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    line-height: 1.25 !important;
}

body:not(.wdes-page-homepage):not(.wdes-page-order):not(.wdes-account-page) .sidebar .panel-body,
body:not(.wdes-page-homepage):not(.wdes-page-order):not(.wdes-account-page) .sidebar .list-group {
    margin: 0 !important;
    padding: 4px 0 10px !important;
    background: transparent !important;
}

body:not(.wdes-page-homepage):not(.wdes-page-order):not(.wdes-account-page) .sidebar .list-group-item {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    min-height: 36px !important;
    margin: 0 8px !important;
    padding: 9px 10px !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 6px !important;
    box-shadow: none !important;
    color: #44506b !important;
    line-height: 1.4 !important;
}

body:not(.wdes-page-homepage):not(.wdes-page-order):not(.wdes-account-page) .sidebar .list-group-item:hover,
body:not(.wdes-page-homepage):not(.wdes-page-order):not(.wdes-account-page) .sidebar .list-group-item:focus,
body:not(.wdes-page-homepage):not(.wdes-page-order):not(.wdes-account-page) .sidebar .list-group-item.active {
    background: rgba(93, 107, 255, 0.10) !important;
    color: #4f46e5 !important;
}

body:not(.wdes-page-homepage):not(.wdes-page-order):not(.wdes-account-page) .sidebar .list-group-item .sidebar-menu-item-icon {
    flex: 0 0 18px !important;
    width: 18px !important;
    margin: 0 !important;
    color: currentColor !important;
    text-align: center !important;
}

html.wdes-dark-mode body:not(.wdes-page-homepage):not(.wdes-page-order):not(.wdes-account-page) .sidebar .panel {
    background: #080f20 !important;
    border-color: rgba(167, 139, 255, 0.20) !important;
    box-shadow: 0 22px 58px rgba(0, 0, 0, 0.26) !important;
}

html.wdes-dark-mode body:not(.wdes-page-homepage):not(.wdes-page-order):not(.wdes-account-page) .sidebar .panel-title {
    color: #ffffff !important;
}

html.wdes-dark-mode body:not(.wdes-page-homepage):not(.wdes-page-order):not(.wdes-account-page) .sidebar .panel-heading,
html.wdes-dark-mode body:not(.wdes-page-homepage):not(.wdes-page-order):not(.wdes-account-page) .sidebar .panel-body,
html.wdes-dark-mode body:not(.wdes-page-homepage):not(.wdes-page-order):not(.wdes-account-page) .sidebar .list-group {
    background: transparent !important;
}

html.wdes-dark-mode body:not(.wdes-page-homepage):not(.wdes-page-order):not(.wdes-account-page) .sidebar .list-group-item {
    background: transparent !important;
    color: #d8def0 !important;
    box-shadow: none !important;
}

html.wdes-dark-mode body:not(.wdes-page-homepage):not(.wdes-page-order):not(.wdes-account-page) .sidebar .list-group-item:hover,
html.wdes-dark-mode body:not(.wdes-page-homepage):not(.wdes-page-order):not(.wdes-account-page) .sidebar .list-group-item:focus,
html.wdes-dark-mode body:not(.wdes-page-homepage):not(.wdes-page-order):not(.wdes-account-page) .sidebar .list-group-item.active {
    background: rgba(167, 139, 255, 0.14) !important;
    color: #ffffff !important;
}

body.wdes-page-knowledgebase .main-content .wdes-kb-item,
body.wdes-page-knowledgebase .main-content .wdes-kb-article-item,
body.wdes-page-announcements .main-content .wdes-phox-announcement-block,
body.wdes-page-knowledgebase .main-content .kb-search {
    border-radius: 8px !important;
}

body.wdes-page-announcements .main-content .wdes-read-more-btn-announcement {
    padding: 11px 18px !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
}

html.wdes-dark-mode body.wdes-page-knowledgebase .main-content .kb-search .form-control {
    background: rgba(255, 255, 255, 0.06) !important;
    border-color: rgba(255, 255, 255, 0.18) !important;
    color: #ffffff !important;
}

html.wdes-dark-mode body.wdes-page-knowledgebase .main-content .kb-search .form-control::placeholder {
    color: #aeb8d3 !important;
}

html.wdes-dark-mode body.wdes-page-knowledgebase .main-content .wdes-title-kb {
    color: #9c86ff !important;
}

html.wdes-dark-mode body:not(.wdes-page-homepage):not(.wdes-account-page) .main-content,
html.wdes-dark-mode body:not(.wdes-page-homepage):not(.wdes-account-page) .main-content p,
html.wdes-dark-mode body:not(.wdes-page-homepage):not(.wdes-account-page) .main-content small,
html.wdes-dark-mode body:not(.wdes-page-homepage):not(.wdes-account-page) .sidebar,
html.wdes-dark-mode body:not(.wdes-page-homepage):not(.wdes-account-page) .sidebar a {
    color: var(--cn-wp-muted-dark) !important;
}

html.wdes-dark-mode body:not(.wdes-page-homepage):not(.wdes-account-page) .main-content h1,
html.wdes-dark-mode body:not(.wdes-page-homepage):not(.wdes-account-page) .main-content h2,
html.wdes-dark-mode body:not(.wdes-page-homepage):not(.wdes-account-page) .main-content h3,
html.wdes-dark-mode body:not(.wdes-page-homepage):not(.wdes-account-page) .header-lined h1 {
    color: #ffffff !important;
}

html.wdes-dark-mode body.wdes-account-page .wdes-wrap-account-page {
    background:
        linear-gradient(rgba(5, 9, 20, 0.20), rgba(5, 9, 20, 0.86)),
        url('../img/cloudnamo-monster-bg-hero.png') center top / cover no-repeat,
        var(--cn-wp-bg-dark) !important;
}

html.wdes-dark-mode body.wdes-account-page .wdes-wrap-account-page_header .phox-logo--dark {
    display: none !important;
}

html.wdes-dark-mode body.wdes-account-page .wdes-wrap-account-page_header .phox-logo--light {
    display: block !important;
}

html.wdes-dark-mode body.wdes-account-page .wdes-wrap-account-page_main_article {
    background: rgba(8, 15, 32, 0.92) !important;
    border-color: rgba(167, 139, 255, 0.22) !important;
    box-shadow: 0 28px 78px rgba(0, 0, 0, 0.38) !important;
}

html.wdes-dark-mode body.wdes-account-page .wdes-wrap-account-page_main-article_heading .header-lined h1,
html.wdes-dark-mode body.wdes-account-page .wdes-wrap-account-page_main-article_form label,
html.wdes-dark-mode body.wdes-account-page .wdes-wrap-account-page_main-article_form_actions a {
    color: #ffffff !important;
}

html.wdes-dark-mode body.wdes-account-page .wdes-wrap-account-page_main-article_heading .header-lined small,
html.wdes-dark-mode body.wdes-account-page .wdes-wrap-account-page_main-article_form,
html.wdes-dark-mode body.wdes-account-page .wdes-wrap-account-page_main-article_form p {
    color: var(--cn-wp-muted-dark) !important;
}

html.wdes-dark-mode body.wdes-account-page .wdes-wrap-account-page_main-article_form .form-control,
html.wdes-dark-mode body.wdes-account-page .wdes-wrap-account-page_main-article_form .field,
html.wdes-dark-mode body.wdes-account-page .wdes-wrap-account-page_main-article_form input[type="tel"] {
    background: rgba(255, 255, 255, 0.06) !important;
    border-color: rgba(255, 255, 255, 0.18) !important;
    color: #ffffff !important;
}

html.wdes-dark-mode body.wdes-account-page .wdes-wrap-account-page_main-article_form .form-control::placeholder,
html.wdes-dark-mode body.wdes-account-page .wdes-wrap-account-page_main-article_form .field::placeholder {
    color: #aeb8d3 !important;
}

@media (max-width: 1023px) {
    body.wdes-account-page .wdes-wrap-account-page {
        padding: 16px !important;
    }

    body.wdes-account-page .wdes-wrap-account-page_main_article {
        border-radius: 16px !important;
    }
}

@media (max-width: 767px) {
    body.wdes-account-page .wdes-wrap-account-page_main_article {
        padding: 22px !important;
    }
}

@media (min-width: 1024px) {
    body.wdes-account-page .wdes-wrap-account-page {
        display: flex !important;
        align-items: flex-start !important;
        justify-content: center !important;
        min-height: 100vh !important;
        height: auto !important;
        padding: 104px 24px 48px !important;
    }

    body.wdes-account-page .wdes-wrap-account-page_footer {
        display: none !important;
    }

    body.wdes-account-page .wdes-wrap-account-page_header {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        position: absolute !important;
        top: 28px !important;
        left: 50% !important;
        width: 180px !important;
        height: 48px !important;
        transform: translateX(-50%) !important;
    }

    body.wdes-account-page .wdes-wrap-account-page_header .logo,
    body.wdes-account-page .wdes-wrap-account-page_header .phox-logo {
        width: 168px !important;
        height: 47px !important;
        max-width: 168px !important;
        object-fit: contain !important;
    }

    body.wdes-account-page .wdes-wrap-account-page_main {
        width: min(100%, 520px) !important;
        max-width: 520px !important;
        min-height: 0 !important;
        height: auto !important;
        margin: 0 auto !important;
    }

    body.wdes-account-page .wdes-wrap-account-page_main_article {
        width: 100% !important;
        min-height: 0 !important;
        height: auto !important;
        padding: 40px 48px 32px !important;
    }

    body.wdes-account-page .wdes-wrap-account-page_main-article_heading {
        margin-bottom: 30px !important;
    }

    body.wdes-account-page .wdes-wrap-account-page_main-article_form_actions {
        margin-top: 28px !important;
    }

    body.wdes-page-register,
    html body.wdes-page-register {
        height: auto !important;
        min-height: 100vh !important;
        overflow-y: auto !important;
    }

    body.wdes-page-register .wdes-wrap-account-page {
        height: auto !important;
        min-height: 100vh !important;
        overflow: visible !important;
        padding: 94px 32px 42px !important;
    }

    body.wdes-page-register .wdes-wrap-account-page_main {
        width: min(100%, 1140px) !important;
        max-width: 1140px !important;
    }

    body.wdes-page-register .wdes-wrap-account-page_main_article {
        padding: 34px 36px 28px !important;
        overflow: visible !important;
    }

    body.wdes-page-register .wdes-wrap-account-page_main-article_heading {
        margin-bottom: 26px !important;
    }

    body.wdes-page-register .wdes-wrap-account-page_main-article_form form {
        display: grid !important;
        grid-template-columns: minmax(0, 1.55fr) minmax(340px, 0.85fr) !important;
        column-gap: 38px !important;
        row-gap: 18px !important;
        align-items: start !important;
    }

    body.wdes-page-register #containerNewUserSignup {
        display: grid !important;
        grid-column: 1 !important;
        grid-row: 1 / span 6 !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        column-gap: 20px !important;
        row-gap: 16px !important;
        align-items: start !important;
    }

    body.wdes-page-register #containerNewUserSignup .sub-heading,
    body.wdes-page-register #containerNewUserSecurity .sub-heading,
    body.wdes-page-register .wdes-wrap-account-page_main-article_form form > .sub-heading.mt-3 {
        display: flex !important;
        align-items: center !important;
        gap: 10px !important;
        grid-column: 1 / -1 !important;
        min-height: 24px !important;
        margin: 0 0 2px !important;
        color: #101526 !important;
        font-size: 14px !important;
        font-weight: 700 !important;
        line-height: 1.2 !important;
        white-space: nowrap !important;
    }

    body.wdes-page-register #containerNewUserSignup .sub-heading::before,
    body.wdes-page-register #containerNewUserSignup .sub-heading::after,
    body.wdes-page-register #containerNewUserSecurity .sub-heading::before,
    body.wdes-page-register #containerNewUserSecurity .sub-heading::after,
    body.wdes-page-register .wdes-wrap-account-page_main-article_form form > .sub-heading.mt-3::before,
    body.wdes-page-register .wdes-wrap-account-page_main-article_form form > .sub-heading.mt-3::after {
        content: "" !important;
        flex: 1 1 auto !important;
        border-top: 1px solid rgba(108, 92, 231, 0.18) !important;
    }

    html.wdes-dark-mode body.wdes-page-register #containerNewUserSignup .sub-heading,
    html.wdes-dark-mode body.wdes-page-register #containerNewUserSecurity .sub-heading,
    html.wdes-dark-mode body.wdes-page-register .wdes-wrap-account-page_main-article_form form > .sub-heading.mt-3 {
        color: #ffffff !important;
    }

    html.wdes-dark-mode body.wdes-page-register #containerNewUserSignup .sub-heading::before,
    html.wdes-dark-mode body.wdes-page-register #containerNewUserSignup .sub-heading::after,
    html.wdes-dark-mode body.wdes-page-register #containerNewUserSecurity .sub-heading::before,
    html.wdes-dark-mode body.wdes-page-register #containerNewUserSecurity .sub-heading::after,
    html.wdes-dark-mode body.wdes-page-register .wdes-wrap-account-page_main-article_form form > .sub-heading.mt-3::before,
    html.wdes-dark-mode body.wdes-page-register .wdes-wrap-account-page_main-article_form form > .sub-heading.mt-3::after {
        border-top-color: rgba(255, 255, 255, 0.13) !important;
    }

    body.wdes-page-register #containerNewUserSignup .sub-heading.mt-3 {
        margin-top: 8px !important;
    }

    body.wdes-page-register .wdes-wrap-account-page_main-article_form label {
        margin-bottom: 7px !important;
        font-size: 13px !important;
        line-height: 1.25 !important;
    }

    body.wdes-page-register #containerNewUserSecurity {
        display: grid !important;
        grid-column: 2 !important;
        grid-row: 1 !important;
        gap: 16px !important;
        margin-top: 0 !important;
    }

    body.wdes-page-register #containerPassword {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 14px 16px !important;
    }

    body.wdes-page-register #passwdFeedback,
    body.wdes-page-register #containerPassword .password-strength-meter,
    body.wdes-page-register #containerPassword .form-group:nth-child(4) {
        grid-column: 1 / -1 !important;
    }

    body.wdes-page-register .wdes-wrap-account-page_main-article_form form > .sub-heading.mt-3 {
        grid-column: 2 !important;
        grid-row: 2 !important;
        margin: 0 !important;
    }

    body.wdes-page-register .marketing-email-optin {
        grid-column: 2 !important;
        grid-row: 3 !important;
        width: 100% !important;
        margin: 0 !important;
        padding-bottom: 8px !important;
        border-bottom: 1px solid rgba(108, 92, 231, 0.13) !important;
    }

    html.wdes-dark-mode body.wdes-page-register .marketing-email-optin {
        border-bottom-color: rgba(255, 255, 255, 0.10) !important;
    }

    body.wdes-page-register .marketing-email-optin p {
        margin: 0 0 12px !important;
        color: #44506b !important;
        font-size: 14px !important;
        line-height: 1.55 !important;
    }

    html.wdes-dark-mode body.wdes-page-register .marketing-email-optin p {
        color: #d8def2 !important;
    }

    body.wdes-page-register .wdes-wrap-account-page_main-article_form form > .text-center.row {
        grid-column: 2 !important;
        grid-row: 4 !important;
        width: 100% !important;
        margin: 0 !important;
        padding-top: 2px !important;
        display: block !important;
        text-align: left !important;
    }

    body.wdes-page-register .wdes-wrap-account-page_main-article_form form > .text-center.row > div,
    body.wdes-page-register #default-captcha-domainchecker .captchaimage,
    body.wdes-page-register #default-captcha-domainchecker > .col-xs-6:not(.captchaimage) {
        float: none !important;
        width: auto !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    body.wdes-page-register #default-captcha-domainchecker {
        display: grid !important;
        grid-template-columns: auto minmax(96px, 1fr) !important;
        gap: 12px 16px !important;
        align-items: center !important;
        margin: 0 !important;
        text-align: left !important;
    }

    body.wdes-page-register #default-captcha-domainchecker p {
        grid-column: 1 / -1 !important;
        margin: 0 !important;
        color: #44506b !important;
        font-size: 14px !important;
        line-height: 1.5 !important;
        text-align: left !important;
    }

    html.wdes-dark-mode body.wdes-page-register #default-captcha-domainchecker p {
        color: #d8def2 !important;
    }

    body.wdes-page-register #default-captcha-domainchecker img {
        display: block !important;
        max-width: 104px !important;
        height: auto !important;
    }

    body.wdes-page-register #default-captcha-domainchecker #inputCaptcha {
        float: none !important;
        width: 98px !important;
        min-width: 98px !important;
    }

    body.wdes-page-register .tospanel {
        grid-column: 2 !important;
        grid-row: 5 !important;
        width: 100% !important;
        margin: 0 !important;
        padding-top: 8px !important;
    }

    body.wdes-page-register .tospanel label.checkbox {
        display: flex !important;
        align-items: flex-start !important;
        gap: 10px !important;
        margin: 0 !important;
        text-align: left !important;
        line-height: 1.45 !important;
    }

    body.wdes-page-register .tospanel .icheckbox-wdes {
        flex: 0 0 auto !important;
        margin-top: 2px !important;
    }

    body.wdes-page-register .tospanel label.checkbox a {
        display: inline-block !important;
        margin-left: 4px !important;
    }

    body.wdes-page-register .wdes-wrap-account-page_main-article_form_action {
        grid-column: 2 !important;
        grid-row: 6 !important;
        width: 100% !important;
        min-height: 46px !important;
        margin: 2px 0 0 !important;
    }

    body.wdes-page-register #containerPassword .generate-password {
        min-height: 38px !important;
        padding: 0 16px !important;
        border-radius: 6px !important;
    }

    body.wdes-page-register #containerPassword .password-strength-meter .progress {
        height: 8px !important;
        margin: 0 0 8px !important;
        border-radius: 999px !important;
        overflow: hidden !important;
    }

    body.wdes-page-register #containerPassword .password-strength-meter .small {
        margin: 0 !important;
        color: #44506b !important;
        text-align: left !important;
    }

    html.wdes-dark-mode body.wdes-page-register #containerPassword .password-strength-meter .small {
        color: #c6cfe8 !important;
    }

    body.wdes-page-register #containerNewUserSignup .form-group,
    body.wdes-page-register #containerPassword .form-group {
        width: auto !important;
        min-width: 0 !important;
        margin: 0 !important;
    }

    body.wdes-page-register .wdes-wrap-account-page_main-article_form .form-control,
    body.wdes-page-register .wdes-wrap-account-page_main-article_form .field,
    body.wdes-page-register .wdes-wrap-account-page_main-article_form input[type="tel"],
    body.wdes-page-register .wdes-wrap-account-page_main-article_form select {
        width: 100% !important;
        max-width: 100% !important;
    }
}
/* End CloudNamo WHMCS client-wide WordPress alignment */


/* CloudNamo WHMCS footer two-row layout - 2026-05-13 */
#footer .wdes-footer-wrapper {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto auto !important;
    grid-template-areas:
        "copyright copyright copyright"
        "legal language top" !important;
    align-items: center !important;
    gap: 10px 18px !important;
    width: 100% !important;
}

#footer .wdes-footer-wrapper .copyrights {
    grid-area: copyright !important;
    justify-self: center !important;
    width: auto !important;
    max-width: 100% !important;
    margin: 0 !important;
    text-align: center !important;
    white-space: normal !important;
    line-height: 1.6 !important;
}

#footer .wdes-footer-wrapper .cloudnamo-legal-footer-links {
    grid-area: legal !important;
    display: flex !important;
    flex: unset !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px 18px !important;
    min-width: 0 !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 1.5 !important;
}

#footer .wdes-footer-wrapper .cloudnamo-legal-footer-links a {
    white-space: nowrap !important;
}

#footer .wdes-footer-wrapper .languages-list {
    grid-area: language !important;
    justify-self: end !important;
    width: auto !important;
    min-width: max-content !important;
    margin: 0 !important;
}

#footer .wdes-footer-wrapper .wdes-back-to-top {
    grid-area: top !important;
    justify-self: end !important;
    margin: 0 !important;
}

@media (max-width: 560px) {
    #footer .wdes-footer-wrapper {
        grid-template-columns: 1fr auto !important;
        grid-template-areas:
            "copyright copyright"
            "legal legal"
            "language top" !important;
        justify-items: center !important;
    }

    #footer .wdes-footer-wrapper .cloudnamo-legal-footer-links {
        justify-content: center !important;
    }

    #footer .wdes-footer-wrapper .languages-list {
        justify-self: end !important;
    }

    #footer .wdes-footer-wrapper .wdes-back-to-top {
        justify-self: start !important;
    }
}
