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

    ** Custom Stylesheet **

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

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

/* Custom CSS for Nexus Theme
 *
 * This file allows you to customize the theme colors and styles for the entire Nexus 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.
 */

: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%;
}

/* ===== FULLTOPWEB COMMON MENU — WHMCS NEXUS ===== */
/*
 * FullTopWeb common menu for WHMCS Nexus
 * Scope: header#header.ftw-common-header only
 * Does not modify product cards or order-form templates.
 */

#header.ftw-common-header {
    --ftw-menu-bg: #ffffff;
    --ftw-menu-surface: #ffffff;
    --ftw-menu-text: #172033;
    --ftw-menu-muted: #64708a;
    --ftw-menu-primary: #86c900;
    --ftw-menu-primary-dark: #5c9200;
    --ftw-menu-line: #dfe6f2;
    --ftw-menu-radius: 8px;
    position: sticky;
    top: 0;
    z-index: 1030;
    background: rgba(255, 255, 255, 0.94);
    border-bottom: 1px solid var(--ftw-menu-line);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}

#header.ftw-common-header .topbar {
    position: relative;
    z-index: 2;
}

#header.ftw-common-header .ftw-main-navbar {
    padding: 0;
    background: transparent;
}

#header.ftw-common-header .ftw-header-inner {
    width: min(100% - 32px, 1180px);
    max-width: 1180px;
    min-height: 86px;
    margin-inline: auto;
    padding: 0;
    display: flex;
    align-items: center;
    gap: 20px;
}

#header.ftw-common-header .ftw-brand {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    gap: 12px;
    margin: 0;
    padding: 0;
    color: var(--ftw-menu-text);
    font-weight: 800;
    text-decoration: none;
}

#header.ftw-common-header .ftw-brand img {
    display: block;
    width: 76px;
    max-height: 68px;
    object-fit: contain;
}

#header.ftw-common-header .ftw-menu-collapse {
    min-width: 0;
    flex: 1 1 auto;
    align-items: center;
}

#header.ftw-common-header .ftw-site-nav {
    display: flex;
    min-width: 0;
    flex: 1 1 auto;
    align-items: center;
    justify-content: flex-end;
    gap: 4px;
    flex-wrap: wrap;
}

#header.ftw-common-header .ftw-site-nav > a,
#header.ftw-common-header .ftw-info-menu > summary,
#header.ftw-common-header .ftw-secondary-nav > li > a {
    min-height: 42px;
    padding: 10px 12px;
    border: 0;
    border-radius: var(--ftw-menu-radius);
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: transparent;
    color: var(--ftw-menu-text);
    font-weight: 700;
    line-height: 1.2;
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
}

#header.ftw-common-header .ftw-site-nav > a:hover,
#header.ftw-common-header .ftw-site-nav > a:focus-visible,
#header.ftw-common-header .ftw-info-menu > summary:hover,
#header.ftw-common-header .ftw-info-menu > summary:focus-visible,
#header.ftw-common-header .ftw-info-menu[open] > summary,
#header.ftw-common-header .ftw-secondary-nav > li > a:hover,
#header.ftw-common-header .ftw-secondary-nav > li > a:focus-visible,
#header.ftw-common-header .ftw-secondary-nav > li.show > a {
    color: var(--ftw-menu-primary-dark);
    background: #eff9dd;
    outline: none;
}

#header.ftw-common-header .ftw-info-menu {
    position: relative;
    flex: 0 0 auto;
    margin: 0;
}

#header.ftw-common-header .ftw-info-menu > summary {
    list-style: none;
    user-select: none;
}

#header.ftw-common-header .ftw-info-menu > summary::-webkit-details-marker {
    display: none;
}

#header.ftw-common-header .ftw-info-chevron {
    width: 16px;
    height: 16px;
    flex: 0 0 auto;
    transition: transform 160ms ease;
}

#header.ftw-common-header .ftw-info-menu[open] .ftw-info-chevron {
    transform: rotate(180deg);
}

#header.ftw-common-header .ftw-info-dropdown {
    position: absolute;
    top: calc(100% + 10px);
    right: 0;
    z-index: 1250;
    width: 300px;
    padding: 10px;
    border: 1px solid var(--ftw-menu-line);
    border-radius: 16px;
    background: var(--ftw-menu-surface);
    box-shadow: 0 18px 44px rgba(15, 23, 42, 0.16);
}

#header.ftw-common-header .ftw-info-item {
    width: 100%;
    min-height: 72px;
    padding: 10px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    gap: 11px;
    color: var(--ftw-menu-text);
    text-decoration: none;
}

#header.ftw-common-header .ftw-info-item + .ftw-info-item {
    margin-top: 6px;
}

#header.ftw-common-header .ftw-info-item:hover,
#header.ftw-common-header .ftw-info-item:focus-visible {
    background: #f3f9e7;
    color: var(--ftw-menu-primary-dark);
    outline: none;
}

#header.ftw-common-header .ftw-info-icon {
    width: 46px;
    height: 46px;
    border-radius: 13px;
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    background: #eff9dd;
    color: var(--ftw-menu-primary-dark);
    font-size: 1.25rem;
}

#header.ftw-common-header .ftw-info-copy {
    min-width: 0;
    display: grid;
    gap: 3px;
}

#header.ftw-common-header .ftw-info-copy strong {
    color: inherit;
    font-size: 0.94rem;
    line-height: 1.15;
}

#header.ftw-common-header .ftw-info-copy small {
    color: var(--ftw-menu-muted);
    font-size: 0.73rem;
    line-height: 1.35;
    white-space: normal;
}

#header.ftw-common-header .ftw-whmcs-tools {
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    gap: 8px;
    margin-left: 8px;
}

#header.ftw-common-header .ftw-search {
    margin: 0;
}

#header.ftw-common-header .ftw-search .input-group {
    width: 220px;
}

#header.ftw-common-header .ftw-search .form-control {
    border-color: var(--ftw-menu-line);
}

#header.ftw-common-header .ftw-secondary-nav {
    display: flex;
    align-items: center;
    gap: 4px;
    margin: 0;
}

#header.ftw-common-header .ftw-secondary-nav > li {
    position: relative;
    list-style: none;
}

#header.ftw-common-header .ftw-secondary-nav .dropdown-menu {
    top: calc(100% + 8px);
    min-width: 230px;
    padding: 8px;
    border: 1px solid var(--ftw-menu-line);
    border-radius: 14px;
    box-shadow: 0 18px 44px rgba(15, 23, 42, 0.16);
}

#header.ftw-common-header .ftw-secondary-nav .dropdown-item {
    border-radius: 9px;
    color: var(--ftw-menu-text);
}

#header.ftw-common-header .ftw-secondary-nav .dropdown-item:hover,
#header.ftw-common-header .ftw-secondary-nav .dropdown-item:focus {
    background: #eff9dd;
    color: var(--ftw-menu-primary-dark);
}

#header.ftw-common-header .ftw-header-actions {
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    gap: 8px;
}

#header.ftw-common-header .ftw-cart-button,
#header.ftw-common-header .ftw-menu-toggle {
    min-width: 44px;
    min-height: 44px;
    border: 1px solid var(--ftw-menu-line);
    border-radius: var(--ftw-menu-radius);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--ftw-menu-surface);
    color: var(--ftw-menu-text);
}

#header.ftw-common-header .ftw-cart-button:hover,
#header.ftw-common-header .ftw-menu-toggle:hover {
    border-color: var(--ftw-menu-primary);
    background: #f7ffe9;
    color: var(--ftw-menu-primary-dark);
}

#header.ftw-common-header .ftw-cart-button {
    position: relative;
}

#header.ftw-common-header .ftw-cart-button .badge {
    position: absolute;
    top: -7px;
    right: -7px;
}

#header.ftw-common-header .ftw-menu-toggle {
    display: none;
}

@media (max-width: 1199.98px) {
    #header.ftw-common-header .ftw-header-inner {
        flex-wrap: wrap;
        padding: 14px 0;
    }

    #header.ftw-common-header .ftw-menu-toggle {
        display: inline-flex;
    }

    #header.ftw-common-header .ftw-menu-collapse {
        flex: 0 0 100%;
        width: 100%;
        padding-top: 12px;
    }

    #header.ftw-common-header .ftw-menu-collapse:not(.show) {
        display: none;
    }

    #header.ftw-common-header .ftw-menu-collapse.show,
    #header.ftw-common-header .ftw-menu-collapse.collapsing {
        display: block;
    }

    #header.ftw-common-header .ftw-site-nav {
        width: 100%;
        flex-direction: column;
        align-items: stretch;
        gap: 3px;
    }

    #header.ftw-common-header .ftw-site-nav > a,
    #header.ftw-common-header .ftw-info-menu,
    #header.ftw-common-header .ftw-info-menu > summary {
        width: 100%;
    }

    #header.ftw-common-header .ftw-info-menu > summary {
        justify-content: space-between;
    }

    #header.ftw-common-header .ftw-info-dropdown {
        position: static;
        width: 100%;
        margin-top: 6px;
        padding: 7px;
        border-radius: 12px;
        box-shadow: none;
        background: #f8fbf2;
    }

    #header.ftw-common-header .ftw-whmcs-tools {
        width: 100%;
        margin: 12px 0 0;
        padding-top: 12px;
        border-top: 1px solid var(--ftw-menu-line);
        flex-direction: column;
        align-items: stretch;
    }

    #header.ftw-common-header .ftw-search,
    #header.ftw-common-header .ftw-search .input-group {
        width: 100%;
    }

    #header.ftw-common-header .ftw-secondary-nav {
        width: 100%;
        flex-direction: column;
        align-items: stretch;
    }

    #header.ftw-common-header .ftw-secondary-nav > li,
    #header.ftw-common-header .ftw-secondary-nav > li > a {
        width: 100%;
    }

    #header.ftw-common-header .ftw-secondary-nav > li > a {
        justify-content: space-between;
    }

    #header.ftw-common-header .ftw-secondary-nav .dropdown-menu {
        position: static !important;
        width: 100%;
        margin-top: 4px;
        float: none;
        transform: none !important;
        box-shadow: none;
    }
}

@media (max-width: 560px) {
    #header.ftw-common-header .ftw-header-inner {
        width: min(100% - 24px, 1180px);
    }

    #header.ftw-common-header .ftw-brand img {
        width: 64px;
    }

    #header.ftw-common-header .ftw-info-icon {
        width: 42px;
        height: 42px;
    }
}

/* PUNTO 1 DE 5: ocultar el menú Más de Nexus sin alterar su JavaScript */
#header .collapsable-dropdown {
    display: none !important;
}

/* PUNTO 2 DE 5: ocultar Cliente y todo su menú desplegable */
#header .main-navbar-wrapper .navbar-nav.ml-auto {
    display: none !important;
}

/* ============================================================
   WHMCS — MISMA BARRA VISUAL QUE FULLTOPWEB.COM
   ============================================================ */

#header .main-navbar-wrapper {
    background: #ffffff;
    border-top: 1px solid #eceff3;
    border-bottom: 1px solid #e5e7eb;
    box-shadow: none;
}

#header .main-navbar-wrapper .navbar {
    min-height: 0;
    padding-top: 10px;
    padding-bottom: 10px;
}

#header .main-navbar-wrapper #nav {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1px;
    white-space: nowrap;
}

#header .main-navbar-wrapper #nav > li {
    display: flex !important;
    align-items: stretch;
    margin: 0;
}

#header .main-navbar-wrapper #nav > li > a {
    min-height: 56px;
    padding: 7px 9px !important;
    border-radius: 999px;
    display: flex !important;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 2px;
    background: transparent;
    color: #292929 !important;
    font-family: inherit;
    font-size: 14px;
    font-weight: 800 !important;
    line-height: 1.05;
    text-align: center;
    text-decoration: none;
    white-space: nowrap;
    transition:
        background 160ms ease,
        color 160ms ease,
        box-shadow 160ms ease;
}

#header .main-navbar-wrapper #nav > li > a > i {
    display: none;
}

#header .main-navbar-wrapper #nav > li > a::after {
    display: block;
    color: #949494;
    font-size: 10px;
    font-weight: 500;
    line-height: 1.05;
    text-align: center;
}

/* Subtítulos iguales a FullTopWeb */
#header .main-navbar-wrapper #nav > li[menuItemName="FTW Public Home"] > a::after {
    content: "Página principal";
}

#header .main-navbar-wrapper #nav > li[menuItemName="FTW Mobile Ecommerce"] > a::after {
    content: "Comercio adaptable";
}

#header .main-navbar-wrapper #nav > li[menuItemName="FTW Hosting"] > a::after {
    content: "Alojamiento web";
}

#header .main-navbar-wrapper #nav > li[menuItemName="FTW Web Development"] > a::after {
    content: "Soluciones a medida";
}

#header .main-navbar-wrapper #nav > li[menuItemName="FTW Information"] > a::after {
    content: "Datos y servicios";
}

#header .main-navbar-wrapper #nav > li[menuItemName="FTW Domains"] > a::after {
    content: "Gestión de dominios";
}

#header .main-navbar-wrapper #nav > li[menuItemName="FTW Support"] > a::after {
    content: "Asistencia 24/7";
}

/* Mismo sombreado gris claro de FullTopWeb */
#header .main-navbar-wrapper #nav > li > a:hover,
#header .main-navbar-wrapper #nav > li > a:focus,
#header .main-navbar-wrapper #nav > li.show > a,
#header .main-navbar-wrapper #nav > li.active > a {
    background: #efefef !important;
    color: #202020 !important;
    box-shadow: none !important;
    outline: none;
}

/* Flechas del desplegable */
#header .main-navbar-wrapper #nav > li.dropdown > a::before {
    content: "";
    position: absolute;
    right: 9px;
    top: 50%;
    width: 8px;
    height: 8px;
    margin-top: -7px;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: rotate(45deg);
    transition: transform 160ms ease;
}

#header .main-navbar-wrapper #nav > li.dropdown.show > a::before {
    transform: rotate(225deg);
    margin-top: -1px;
}

#header .main-navbar-wrapper #nav > li.dropdown > a {
    position: relative;
    padding-right: 27px !important;
}

/* Desplegables iguales al estilo público */
#header .main-navbar-wrapper #nav > li > .dropdown-menu {
    margin-top: 7px;
    padding: 10px;
    border: 1px solid #e5e7eb;
    border-radius: 14px;
    background: #ffffff;
    box-shadow: 0 18px 44px rgba(15, 23, 42, 0.16);
}

#header .main-navbar-wrapper #nav > li > .dropdown-menu .dropdown-item {
    min-height: 42px;
    padding: 10px 12px;
    border-radius: 9px;
    color: #292929;
    font-weight: 600;
}

#header .main-navbar-wrapper #nav > li > .dropdown-menu .dropdown-item:hover,
#header .main-navbar-wrapper #nav > li > .dropdown-menu .dropdown-item:focus {
    background: #f1f1f1;
    color: #202020;
}

/* Botón rojo Clientes idéntico al de FullTopWeb */
#header .main-navbar-wrapper .navbar-nav.ml-auto {
    display: flex !important;
    margin-left: 5px !important;
}

#header .main-navbar-wrapper .navbar-nav.ml-auto > li {
    display: flex !important;
    align-items: stretch;
}

#header .main-navbar-wrapper .navbar-nav.ml-auto > li > a {
    width: 190px;
    min-height: 58px;
    padding: 8px 18px !important;
    border-radius: 999px;
    background: #ea0000 !important;
    color: #ffffff !important;
    display: flex !important;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 2px;
    font-size: 18px;
    font-weight: 800 !important;
    line-height: 1.05;
    text-align: center;
    box-shadow: 0 12px 26px rgba(234, 0, 0, 0.18);
}

#header .main-navbar-wrapper .navbar-nav.ml-auto > li > a::after {
    content: "Área de clientes";
    display: block;
    color: #ffffff;
    font-size: 12px;
    font-weight: 500;
    line-height: 1.05;
}

#header .main-navbar-wrapper .navbar-nav.ml-auto > li > a:hover,
#header .main-navbar-wrapper .navbar-nav.ml-auto > li > a:focus,
#header .main-navbar-wrapper .navbar-nav.ml-auto > li.show > a {
    background: #d90000 !important;
    color: #ffffff !important;
}

/* Mantener oculto únicamente el antiguo menú Más */
#header .collapsable-dropdown {
    display: none !important;
}

/* Escritorio medio */
@media (min-width: 1200px) and (max-width: 1380px) {
    #header .main-navbar-wrapper #nav > li > a {
        min-height: 52px;
        padding-right: 6px !important;
        padding-left: 6px !important;
        font-size: 13px;
    }

    #header .main-navbar-wrapper #nav > li > a::after {
        font-size: 9px;
    }

    #header .main-navbar-wrapper #nav > li.dropdown > a {
        padding-right: 22px !important;
    }

    #header .main-navbar-wrapper .navbar-nav.ml-auto > li > a {
        width: 176px;
        min-height: 56px;
        font-size: 17px;
    }
}

/* Tablet y celular: mismo menú hamburguesa, sin perder el estilo */
@media (max-width: 1199.98px) {
    #header .main-navbar-wrapper #nav {
        align-items: stretch;
        gap: 3px;
        white-space: normal;
    }

    #header .main-navbar-wrapper #nav > li {
        width: 100%;
    }

    #header .main-navbar-wrapper #nav > li > a {
        width: 100%;
        min-height: 56px;
        padding: 8px 12px !important;
        border-radius: 12px;
        align-items: flex-start;
        text-align: left;
    }

    #header .main-navbar-wrapper #nav > li > a::after {
        text-align: left;
    }

    #header .main-navbar-wrapper #nav > li.dropdown > a::before {
        right: 16px;
    }

    #header .main-navbar-wrapper #nav > li > .dropdown-menu {
        position: static !important;
        width: 100%;
        margin-top: 4px;
        transform: none !important;
        box-shadow: none;
    }

    #header .main-navbar-wrapper .navbar-nav.ml-auto {
        width: 100%;
        margin: 6px 0 0 !important;
    }

    #header .main-navbar-wrapper .navbar-nav.ml-auto > li,
    #header .main-navbar-wrapper .navbar-nav.ml-auto > li > a {
        width: 100%;
    }

    #header .main-navbar-wrapper .navbar-nav.ml-auto > li > a {
        min-height: 58px;
        border-radius: 14px;
    }
}

/* ============================================================
   FULLTOPWEB → WHMCS NEXUS
   BLOQUE DEFINITIVO DE UNIFICACIÓN VISUAL
   ============================================================ */

/* Misma familia tipográfica de FullTopWeb */
#header .main-navbar-wrapper,
#header .main-navbar-wrapper a,
#header .main-navbar-wrapper strong,
#header .main-navbar-wrapper small {
    font-family: Arial, Helvetica, sans-serif !important;
}

/* Ocultar el antiguo "Más" */
#header .collapsable-dropdown {
    display: none !important;
}

/* Barra principal */
#header .main-navbar-wrapper {
    background: #ffffff !important;
    border-top: 1px solid #eceff3;
    border-bottom: 1px solid #e5e7eb;
    box-shadow: none !important;
}

#header .main-navbar-wrapper #nav {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1px;
    white-space: nowrap;
}

#header .main-navbar-wrapper #nav > li {
    display: flex !important;
    align-items: stretch;
    margin: 0;
}

#header .main-navbar-wrapper #nav > li > a.ftw-root-link {
    min-height: 56px;
    padding: 7px 9px !important;
    border-radius: 999px;
    display: flex !important;
    align-items: center;
    justify-content: center;
    background: transparent !important;
    color: #292929 !important;
    text-decoration: none !important;
    white-space: nowrap;
    transition: background 160ms ease, color 160ms ease;
}

/* Anula subtítulos antiguos creados con ::after */
#header .main-navbar-wrapper #nav > li > a::after,
#header .main-navbar-wrapper .navbar-nav.ml-auto > li > a::after {
    content: none !important;
    display: none !important;
}

#header .ftw-root-copy {
    min-width: 0;
    display: grid;
    gap: 2px;
    justify-items: center;
    text-align: center;
}

#header .ftw-root-copy strong {
    color: inherit;
    font-size: 14px;
    font-weight: 800;
    line-height: 1.05;
}

#header .ftw-root-copy small {
    display: block;
    color: #949494;
    font-size: 10px;
    font-weight: 500;
    line-height: 1.05;
}

/* Hover de barra igual a FullTopWeb */
#header .main-navbar-wrapper #nav > li > a.ftw-root-link:hover,
#header .main-navbar-wrapper #nav > li > a.ftw-root-link:focus,
#header .main-navbar-wrapper #nav > li.show > a.ftw-root-link,
#header .main-navbar-wrapper #nav > li.active > a.ftw-root-link {
    background: #efefef !important;
    color: #202020 !important;
    box-shadow: none !important;
    outline: none;
}

/* Flecha superior */
#header .main-navbar-wrapper #nav > li.dropdown > a.ftw-root-link {
    position: relative;
    padding-right: 27px !important;
}

#header .main-navbar-wrapper #nav > li.dropdown > a.ftw-root-link::before,
#header .main-navbar-wrapper .navbar-nav.ml-auto > li.dropdown > a.ftw-root-link::before {
    content: "";
    position: absolute;
    right: 9px;
    top: 50%;
    width: 8px;
    height: 8px;
    margin-top: -7px;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: rotate(45deg);
    transition: transform 160ms ease;
}

#header .main-navbar-wrapper #nav > li.dropdown.show > a.ftw-root-link::before,
#header .main-navbar-wrapper .navbar-nav.ml-auto > li.dropdown.show > a.ftw-root-link::before {
    transform: rotate(225deg);
    margin-top: -1px;
}

/* Desplegables: mismas proporciones aprobadas en FullTopWeb */
#header .main-navbar-wrapper .ftw-dropdown {
    width: 330px;
    margin-top: 7px;
    padding: 9px;
    border: 1px solid #e7ebf1;
    border-radius: 12px;
    background: #ffffff;
    box-shadow: 0 20px 46px rgba(15, 23, 42, 0.18);
}

#header .main-navbar-wrapper .ftw-dropdown-li {
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
}

#header .main-navbar-wrapper .ftw-dropdown-item {
    width: 100%;
    min-height: 64px;
    padding: 7px 9px !important;
    border-radius: 10px;
    display: flex !important;
    align-items: center;
    gap: 12px;
    background: transparent !important;
    color: #353535 !important;
    text-decoration: none !important;
    white-space: normal;
    transition: background 150ms ease, transform 150ms ease;
}

#header .main-navbar-wrapper .ftw-dropdown-item:hover,
#header .main-navbar-wrapper .ftw-dropdown-item:focus {
    background: #f4f7fb !important;
    color: #202020 !important;
    transform: translateX(2px);
    outline: none;
}

#header .ftw-dropdown-icon {
    width: 34.5px;
    height: 34.5px;
    flex: 0 0 34.5px;
    border: 1px solid #d7ecfa;
    border-radius: 50%;
    background: #066a9f;
    color: #066a9f;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 0 0 .5px #0b6f9f;
    overflow: hidden;
}

#header .ftw-dropdown-icon svg {
    width: 100%;
    height: 100%;
    display: block;
}

#header .ftw-dropdown-icon .ftw-emoji-icon {
    font-size: 12px;
    line-height: 1;
}

#header .ftw-dropdown-copy {
    min-width: 0;
    display: grid;
    gap: 3px;
    text-align: left;
}

#header .ftw-dropdown-copy strong {
    color: #353535;
    font-size: 12px;
    font-weight: 800;
    line-height: 1.05;
}

#header .ftw-dropdown-copy small {
    display: block;
    color: #8a8a8a;
    font-size: 8.25px;
    font-weight: 500;
    line-height: 1.2;
}

/* Botón rojo Clientes */
#header .main-navbar-wrapper .navbar-nav.ml-auto {
    display: flex !important;
    margin-left: 5px !important;
    align-items: center;
}

#header .main-navbar-wrapper .navbar-nav.ml-auto > li {
    position: relative;
    display: flex !important;
    align-items: stretch;
}

#header .main-navbar-wrapper .navbar-nav.ml-auto > li > a.ftw-root-link {
    width: 190px;
    min-height: 58px;
    padding: 8px 22px 8px 18px !important;
    border-radius: 999px;
    background: #ea0000 !important;
    color: #ffffff !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
    text-decoration: none !important;
    box-shadow: 0 12px 26px rgba(234, 0, 0, 0.18);
}

#header .main-navbar-wrapper .navbar-nav.ml-auto .ftw-root-copy strong {
    color: #ffffff;
    font-size: 14px;
    font-weight: 800;
}

#header .main-navbar-wrapper .navbar-nav.ml-auto .ftw-root-copy small {
    color: #ffffff;
    font-size: 10px;
    font-weight: 500;
}

#header .main-navbar-wrapper .navbar-nav.ml-auto > li > a.ftw-root-link:hover,
#header .main-navbar-wrapper .navbar-nav.ml-auto > li > a.ftw-root-link:focus,
#header .main-navbar-wrapper .navbar-nav.ml-auto > li.show > a.ftw-root-link {
    background: #d90000 !important;
    color: #ffffff !important;
}

/* El desplegable Clientes conserva el mismo panel blanco */
#header .main-navbar-wrapper .navbar-nav.ml-auto .ftw-client-dropdown {
    right: 0;
    left: auto;
}

/* Escritorio medio */
@media (min-width: 1200px) and (max-width: 1380px) {
    #header .main-navbar-wrapper #nav > li > a.ftw-root-link {
        min-height: 52px;
        padding-left: 6px !important;
        padding-right: 6px !important;
    }

    #header .main-navbar-wrapper #nav > li.dropdown > a.ftw-root-link {
        padding-right: 22px !important;
    }

    #header .ftw-root-copy strong {
        font-size: 13px;
    }

    #header .ftw-root-copy small {
        font-size: 9px;
    }

    #header .main-navbar-wrapper .navbar-nav.ml-auto > li > a.ftw-root-link {
        width: 176px;
        min-height: 56px;
    }
}

/* Tablet y celular: conserva funcionamiento táctil */
@media (max-width: 1199.98px) {
    #header .main-navbar-wrapper #nav {
        align-items: stretch;
        gap: 3px;
        white-space: normal;
    }

    #header .main-navbar-wrapper #nav > li {
        width: 100%;
    }

    #header .main-navbar-wrapper #nav > li > a.ftw-root-link {
        width: 100%;
        min-height: 56px;
        padding: 8px 12px !important;
        border-radius: 12px;
        justify-content: flex-start;
        text-align: left;
    }

    #header .main-navbar-wrapper #nav .ftw-root-copy {
        justify-items: start;
        text-align: left;
    }

    #header .main-navbar-wrapper #nav > li.dropdown > a.ftw-root-link::before {
        right: 16px;
    }

    #header .main-navbar-wrapper .ftw-dropdown {
        position: static !important;
        width: 100%;
        margin-top: 4px;
        transform: none !important;
        box-shadow: none;
    }

    #header .main-navbar-wrapper .navbar-nav.ml-auto {
        width: 100%;
        margin: 6px 0 0 !important;
    }

    #header .main-navbar-wrapper .navbar-nav.ml-auto > li,
    #header .main-navbar-wrapper .navbar-nav.ml-auto > li > a.ftw-root-link {
        width: 100%;
    }

    #header .main-navbar-wrapper .navbar-nav.ml-auto > li > a.ftw-root-link {
        min-height: 58px;
        border-radius: 14px;
    }

    #header .main-navbar-wrapper .navbar-nav.ml-auto .ftw-root-copy {
        justify-items: center;
    }
}


/* ============================================================
   CORRECCIÓN V2 — SIN SUBRAYADOS EN ENCABEZADOS DESPLEGABLES
   ============================================================ */
#header .main-navbar-wrapper #nav > li.dropdown > a.ftw-root-link,
#header .main-navbar-wrapper #nav > li.dropdown > a.ftw-root-link:hover,
#header .main-navbar-wrapper #nav > li.dropdown > a.ftw-root-link:focus,
#header .main-navbar-wrapper #nav > li.dropdown > a.ftw-root-link:active,
#header .main-navbar-wrapper .navbar-nav.ml-auto > li.dropdown > a.ftw-root-link,
#header .main-navbar-wrapper .navbar-nav.ml-auto > li.dropdown > a.ftw-root-link:hover,
#header .main-navbar-wrapper .navbar-nav.ml-auto > li.dropdown > a.ftw-root-link:focus,
#header .main-navbar-wrapper .navbar-nav.ml-auto > li.dropdown > a.ftw-root-link:active,
#header .main-navbar-wrapper .ftw-root-copy,
#header .main-navbar-wrapper .ftw-root-copy strong,
#header .main-navbar-wrapper .ftw-root-copy small {
    text-decoration: none !important;
    border-bottom: 0 !important;
    box-shadow: none !important;
    background-image: none !important;
}


/* ============================================================
   CORRECCIÓN V3 — OCULTAR EN WHMCS EL ENLACE ESTÁTICO DUPLICADO
   "FullTopWeb" QUE EL HEADER NEXUS IMPRIME ANTES DEL NAVBAR.
   La navegación debe comenzar directamente en Inicio.
   ============================================================ */
#header .main-navbar-wrapper #nav > li:first-child:not([menuItemName]) {
    display: none !important;
}


/* ============================================================
   SELECTOR DE IDIOMA WHMCS — MISMO ESTILO DE FULLTOPWEB.COM
   Se ubica a la derecha del botón rojo Clientes.
   ============================================================ */
#header .main-navbar-wrapper .ftw-whmcs-language-li {
    position: relative;
    display: flex !important;
    align-items: center;
    margin-left: 12px;
    flex: 0 0 auto;
}

#header .ftw-whmcs-language-switcher {
    position: relative;
    z-index: 1500;
    margin: 0;
}

#header .ftw-whmcs-language-switcher > summary {
    min-width: 64px;
    height: 34px;
    padding: 0 8px;
    border: 1px solid #cad5e3;
    border-radius: 10px;
    background: #ffffff;
    color: #202938;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    cursor: pointer;
    list-style: none;
    box-shadow: 0 4px 12px rgba(15, 23, 42, 0.06);
    user-select: none;
}

#header .ftw-whmcs-language-switcher > summary::-webkit-details-marker,
#header .ftw-whmcs-language-switcher > summary::marker {
    display: none;
}

#header .ftw-whmcs-language-switcher > summary::after {
    content: "";
    width: 6px;
    height: 6px;
    margin-left: 1px;
    border-right: 1.5px solid currentColor;
    border-bottom: 1.5px solid currentColor;
    transform: rotate(45deg) translateY(-2px);
    opacity: .62;
}

#header .ftw-whmcs-language-switcher[open] > summary::after {
    transform: rotate(225deg) translate(-1px, -1px);
}

#header .ftw-whmcs-language-switcher > summary:hover,
#header .ftw-whmcs-language-switcher > summary:focus-visible {
    border-color: #aeb9c8;
    outline: none;
}

#header .ftw-whmcs-language-flag {
    width: 24px;
    height: 16px;
    flex: 0 0 24px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    border-radius: 2px;
    box-shadow: 0 0 0 1px rgba(15, 23, 42, .14);
}

#header .ftw-whmcs-language-flag svg {
    display: block;
    width: 24px;
    height: 16px;
}

#header .ftw-whmcs-language-code {
    min-width: 20px;
    color: #172033;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 13px;
    font-weight: 800;
    line-height: 1;
    text-align: center;
    letter-spacing: .3px;
}

#header .ftw-whmcs-language-menu {
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    min-width: 170px;
    padding: 7px;
    border: 1px solid #dfe6ef;
    border-radius: 12px;
    background: #ffffff;
    box-shadow: 0 18px 42px rgba(15, 23, 42, .18);
    overflow: hidden;
    z-index: 1501;
}

#header .ftw-whmcs-language-option {
    width: 100%;
    min-height: 40px;
    padding: 8px 10px;
    border-radius: 8px;
    color: #111827 !important;
    display: flex !important;
    align-items: center;
    gap: 10px;
    text-decoration: none !important;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 13px;
    font-weight: 800;
    white-space: nowrap;
    transition: background .15s ease, color .15s ease;
}

#header .ftw-whmcs-language-option:hover,
#header .ftw-whmcs-language-option:focus-visible {
    background: #eef5ff !important;
    color: #065af6 !important;
    outline: none;
}

#header .ftw-whmcs-language-option.is-active {
    background: #e8f1ff !important;
    color: #065af6 !important;
}

#header .ftw-whmcs-language-option-code {
    min-width: 20px;
    text-align: center;
    letter-spacing: .3px;
}

#header .ftw-whmcs-language-option-name {
    flex: 1;
}

@media (max-width: 1199.98px) {
    #header .main-navbar-wrapper .ftw-whmcs-language-li {
        width: auto;
        margin: 10px 0 4px auto;
    }

    #header .ftw-whmcs-language-menu {
        right: 0;
    }
}

/* ============================================================
   BUSCADOR UNIFICADO FULLTOPWEB + WHMCS
   MISMAS MEDIDAS Y MISMO ACABADO EN AMBOS HEADERS
   340px x 42px en escritorio.
   ============================================================ */
@media (min-width: 1200px) {
    #header .navbar.navbar-light form.form-inline .input-group.search {
        width: 340px !important;
        min-width: 340px !important;
        max-width: 340px !important;
        height: 42px !important;
        display: flex !important;
        align-items: stretch !important;
        flex-wrap: nowrap !important;
    }

    #header .navbar.navbar-light form.form-inline .input-group.search .input-group-prepend {
        display: flex !important;
        height: 42px !important;
        flex: 0 0 42px !important;
    }

    #header .navbar.navbar-light form.form-inline .input-group.search .btn.btn-default {
        width: 42px !important;
        height: 42px !important;
        padding: 0 !important;
        border: 1px solid #d8dee7 !important;
        border-right: 0 !important;
        border-radius: 8px 0 0 8px !important;
        background: #ffffff !important;
        color: #8e949d !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        box-shadow: none !important;
    }

    #header .navbar.navbar-light form.form-inline .input-group.search .btn.btn-default i {
        font-size: 14px !important;
        line-height: 1 !important;
    }

    #header .navbar.navbar-light form.form-inline .input-group.search .form-control {
        width: 298px !important;
        min-width: 0 !important;
        height: 42px !important;
        padding: 0 14px !important;
        border: 1px solid #d8dee7 !important;
        border-left: 0 !important;
        border-radius: 0 8px 8px 0 !important;
        background: #ffffff !important;
        color: #30343b !important;
        font-family: Arial, Helvetica, sans-serif !important;
        font-size: 14px !important;
        font-weight: 400 !important;
        line-height: 42px !important;
        box-shadow: none !important;
    }

    #header .navbar.navbar-light form.form-inline .input-group.search .form-control::placeholder {
        color: #8e949d !important;
        opacity: 1 !important;
    }

    #header .navbar.navbar-light form.form-inline .input-group.search:focus-within .btn.btn-default,
    #header .navbar.navbar-light form.form-inline .input-group.search:focus-within .form-control {
        border-color: #9aa8ba !important;
    }
}

