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

    ** 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%;
}
#main-body {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

/* =========================================================
   TRYBOT — BASE GLOBAL PARA VISTAS WHMCS HEREDADAS

   Esta capa normaliza las páginas que todavía conservan el
   marcado estándar de WHMCS. Los diseños Trybot específicos
   pueden sobrescribirla desde sus estilos locales.
========================================================= */

:root {
    --trybot-page-bg: #030609;
    --trybot-page-bg-raised: #07111c;
    --trybot-surface: rgba(11, 20, 31, .92);
    --trybot-surface-soft: rgba(255, 255, 255, .045);
    --trybot-surface-hover: rgba(0, 157, 255, .085);
    --trybot-line: rgba(255, 255, 255, .10);
    --trybot-line-strong: rgba(0, 157, 255, .42);
    --trybot-blue: #009dff;
    --trybot-blue-bright: #35baff;
    --trybot-blue-soft: #8fd3ff;
    --trybot-green: #18c987;
    --trybot-yellow: #f8c85c;
    --trybot-red: #ff667a;
    --trybot-text: #f7fbff;
    --trybot-text-soft: #a8b7c8;
    --trybot-text-muted: #718296;
    --trybot-radius-sm: 10px;
    --trybot-radius: 14px;
    --trybot-radius-lg: 20px;
    --trybot-shadow: 0 24px 70px rgba(0, 0, 0, .24);
    --trybot-content-width: 1270px;
}

body.trybot-authenticated,
body.trybot-public {
    color: var(--trybot-text);
    background: var(--trybot-page-bg) !important;
}

body.trybot-authenticated #main-body,
body.trybot-public #main-body {
    min-height: 100vh;
    background:
        radial-gradient(circle at 48% 0%, rgba(0, 157, 255, .10), transparent 32%),
        radial-gradient(circle at 94% 18%, rgba(0, 92, 190, .075), transparent 28%),
        linear-gradient(180deg, #06111b 0%, #03080d 48%, #020406 100%);
}

body.trybot-authenticated #main-body::before,
body.trybot-public #main-body::before {
    content: "";
    position: fixed;
    z-index: 0;
    inset: 0;
    pointer-events: none;
    opacity: .42;
    background-image:
        linear-gradient(rgba(255, 255, 255, .018) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, .018) 1px, transparent 1px);
    background-size: 48px 48px;
    -webkit-mask-image: linear-gradient(180deg, #000, transparent 78%);
    mask-image: linear-gradient(180deg, #000, transparent 78%);
}

body.trybot-authenticated #main-body > .container,
body.trybot-authenticated #main-body > div.container,
body.trybot-authenticated #main-body > .container-fluid {
    position: relative;
    z-index: 1;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

body.trybot-authenticated #main-body > .container > .row,
body.trybot-authenticated #main-body > div.container > .row,
body.trybot-authenticated #main-body > .container-fluid > .row {
    margin: 0 !important;
}

body.trybot-authenticated .trybot-client-content {
    position: relative;
    z-index: 2;
    min-width: 0;
    color: var(--trybot-text);
}

/* Contenedor estándar para páginas que aún no tienen shell propio. */
body.trybot-authenticated .trybot-client-content > :not(.trybot-top):not([class*="trybot-"]) {
    width: calc(100% - 64px);
    max-width: var(--trybot-content-width);
    margin-right: auto;
    margin-left: auto;
}

body.trybot-authenticated .trybot-client-content > .alert:first-of-type,
body.trybot-authenticated .trybot-client-content > .card:first-of-type,
body.trybot-authenticated .trybot-client-content > .panel:first-of-type,
body.trybot-authenticated .trybot-client-content > form:first-of-type,
body.trybot-authenticated .trybot-client-content > h1:first-of-type,
body.trybot-authenticated .trybot-client-content > h2:first-of-type,
body.trybot-authenticated .trybot-client-content > h3:first-of-type {
    margin-top: 38px;
}

body.trybot-authenticated .trybot-client-content > :last-child:not(.trybot-top) {
    margin-bottom: 90px;
}

/* Tipografía y enlaces */
body.trybot-authenticated .trybot-client-content :where(h1, h2, h3, h4, h5, h6),
body.trybot-public .primary-content :where(h1, h2, h3, h4, h5, h6) {
    color: var(--trybot-text);
    font-weight: 900;
    letter-spacing: -.025em;
}

body.trybot-authenticated .trybot-client-content :where(p, li, label, .help-block, .text-muted),
body.trybot-public .primary-content :where(p, li, label, .help-block, .text-muted) {
    color: var(--trybot-text-soft);
}

body.trybot-authenticated .trybot-client-content a:not(.btn),
body.trybot-public .primary-content a:not(.btn) {
    color: var(--trybot-blue-soft);
}

body.trybot-authenticated .trybot-client-content a:not(.btn):hover,
body.trybot-public .primary-content a:not(.btn):hover {
    color: #fff;
}

/* Superficies estándar de Bootstrap y WHMCS */
body.trybot-authenticated .trybot-client-content :where(.card, .panel, .well, .list-group-item, .modal-content),
body.trybot-public .primary-content :where(.card, .panel, .well, .list-group-item, .modal-content) {
    color: var(--trybot-text);
    border: 1px solid var(--trybot-line);
    border-radius: var(--trybot-radius);
    background: var(--trybot-surface);
    box-shadow: var(--trybot-shadow);
}

body.trybot-authenticated .trybot-client-content :where(.card-header, .card-footer, .panel-heading, .panel-footer, .modal-header, .modal-footer),
body.trybot-public .primary-content :where(.card-header, .card-footer, .panel-heading, .panel-footer, .modal-header, .modal-footer) {
    color: var(--trybot-text);
    border-color: var(--trybot-line);
    background: rgba(255, 255, 255, .025);
}

body.trybot-authenticated .trybot-client-content :where(.card-body, .panel-body, .modal-body),
body.trybot-public .primary-content :where(.card-body, .panel-body, .modal-body) {
    color: var(--trybot-text-soft);
}

/* Formularios */
body.trybot-authenticated .trybot-client-content :where(.form-control, .custom-select, select, textarea, input[type="text"], input[type="email"], input[type="password"], input[type="number"], input[type="tel"], input[type="url"]),
body.trybot-public .primary-content :where(.form-control, .custom-select, select, textarea, input[type="text"], input[type="email"], input[type="password"], input[type="number"], input[type="tel"], input[type="url"]) {
    min-height: 44px;
    color: var(--trybot-text);
    border: 1px solid var(--trybot-line);
    border-radius: var(--trybot-radius-sm);
    background: rgba(255, 255, 255, .045);
    box-shadow: none;
}

body.trybot-authenticated .trybot-client-content :where(.form-control, .custom-select, select, textarea, input):focus,
body.trybot-public .primary-content :where(.form-control, .custom-select, select, textarea, input):focus {
    color: #fff;
    border-color: rgba(0, 157, 255, .72);
    background: rgba(0, 157, 255, .055);
    box-shadow: 0 0 0 3px rgba(0, 157, 255, .12);
    outline: 0;
}

body.trybot-authenticated .trybot-client-content :where(.form-control, input, textarea)::placeholder,
body.trybot-public .primary-content :where(.form-control, input, textarea)::placeholder {
    color: #6f8195;
}

body.trybot-authenticated .trybot-client-content :where(.input-group-text, .input-group-addon),
body.trybot-public .primary-content :where(.input-group-text, .input-group-addon) {
    color: var(--trybot-text-soft);
    border-color: var(--trybot-line);
    background: rgba(255, 255, 255, .065);
}

body.trybot-authenticated .trybot-client-content :where(.select2-container .select2-selection, .multiselect-container, .bootstrap-select > .dropdown-toggle),
body.trybot-public .primary-content :where(.select2-container .select2-selection, .multiselect-container, .bootstrap-select > .dropdown-toggle) {
    min-height: 44px;
    color: var(--trybot-text);
    border: 1px solid var(--trybot-line);
    border-radius: var(--trybot-radius-sm);
    background: #0b1520;
}

body.trybot-authenticated .trybot-client-content :where(.select2-selection__rendered, .select2-selection__placeholder),
body.trybot-public .primary-content :where(.select2-selection__rendered, .select2-selection__placeholder) {
    color: var(--trybot-text-soft) !important;
    line-height: 42px !important;
}

body.trybot-authenticated .trybot-client-content :where(.dropdown-menu, .popover),
body.trybot-public .primary-content :where(.dropdown-menu, .popover) {
    color: var(--trybot-text-soft);
    border: 1px solid var(--trybot-line);
    border-radius: var(--trybot-radius-sm);
    background: #0a141f;
    box-shadow: var(--trybot-shadow);
}

body.trybot-authenticated .trybot-client-content :where(.dropdown-item, .popover-body),
body.trybot-public .primary-content :where(.dropdown-item, .popover-body) {
    color: var(--trybot-text-soft);
}

body.trybot-authenticated .trybot-client-content :where(.dropdown-item:hover, .dropdown-item:focus, .dropdown-item.active),
body.trybot-public .primary-content :where(.dropdown-item:hover, .dropdown-item:focus, .dropdown-item.active) {
    color: #fff;
    background: rgba(0, 157, 255, .10);
}

/* Botones */
body.trybot-authenticated .trybot-client-content :where(.btn),
body.trybot-public .primary-content :where(.btn) {
    min-height: 42px;
    padding: 9px 16px;
    border-radius: var(--trybot-radius-sm);
    font-weight: 850;
    box-shadow: none;
}

body.trybot-authenticated .trybot-client-content :where(.btn-primary, .btn-success, .btn-info),
body.trybot-public .primary-content :where(.btn-primary, .btn-success, .btn-info) {
    color: #fff;
    border-color: rgba(0, 157, 255, .76);
    background: linear-gradient(135deg, #008fff, #00b7ff);
    box-shadow: 0 12px 28px rgba(0, 157, 255, .18);
}

body.trybot-authenticated .trybot-client-content :where(.btn-default, .btn-secondary, .btn-outline-primary, .btn-outline-secondary),
body.trybot-public .primary-content :where(.btn-default, .btn-secondary, .btn-outline-primary, .btn-outline-secondary) {
    color: var(--trybot-text);
    border-color: var(--trybot-line);
    background: var(--trybot-surface-soft);
}

body.trybot-authenticated .trybot-client-content :where(.btn):hover,
body.trybot-public .primary-content :where(.btn):hover {
    color: #fff;
    border-color: rgba(0, 157, 255, .72);
    background-color: var(--trybot-surface-hover);
    transform: translateY(-1px);
}

/* Tablas y listados */
body.trybot-authenticated .trybot-client-content :where(.table-responsive, .dataTables_wrapper),
body.trybot-public .primary-content :where(.table-responsive, .dataTables_wrapper) {
    overflow: hidden;
    border: 1px solid var(--trybot-line);
    border-radius: var(--trybot-radius);
    background: rgba(6, 14, 23, .78);
}

body.trybot-authenticated .trybot-client-content :where(table, .table),
body.trybot-public .primary-content :where(table, .table) {
    width: 100%;
    margin-bottom: 0;
    color: var(--trybot-text-soft);
    background: transparent;
}

body.trybot-authenticated .trybot-client-content :where(.table thead th, table thead th),
body.trybot-public .primary-content :where(.table thead th, table thead th) {
    color: #dcecff;
    border-color: var(--trybot-line);
    background: rgba(0, 157, 255, .085);
    font-size: 12px;
    font-weight: 900;
    letter-spacing: .06em;
    text-transform: uppercase;
}

body.trybot-authenticated .trybot-client-content :where(.table td, .table th, table td, table th),
body.trybot-public .primary-content :where(.table td, .table th, table td, table th) {
    border-color: var(--trybot-line);
    vertical-align: middle;
}

body.trybot-authenticated .trybot-client-content :where(.table-hover tbody tr:hover, table tbody tr:hover),
body.trybot-public .primary-content :where(.table-hover tbody tr:hover, table tbody tr:hover) {
    color: #fff;
    background: rgba(0, 157, 255, .055);
}

/* Alertas y estados */
body.trybot-authenticated .trybot-client-content :where(.alert),
body.trybot-public .primary-content :where(.alert) {
    color: var(--trybot-text);
    border: 1px solid var(--trybot-line);
    border-radius: var(--trybot-radius);
    background: rgba(255, 255, 255, .045);
}

body.trybot-authenticated .trybot-client-content :where(.alert-info),
body.trybot-public .primary-content :where(.alert-info) {
    border-color: rgba(0, 157, 255, .34);
    background: rgba(0, 157, 255, .085);
}

body.trybot-authenticated .trybot-client-content :where(.alert-success),
body.trybot-public .primary-content :where(.alert-success) {
    border-color: rgba(24, 201, 135, .34);
    background: rgba(24, 201, 135, .075);
}

body.trybot-authenticated .trybot-client-content :where(.alert-warning),
body.trybot-public .primary-content :where(.alert-warning) {
    border-color: rgba(248, 200, 92, .34);
    background: rgba(248, 200, 92, .075);
}

body.trybot-authenticated .trybot-client-content :where(.alert-danger),
body.trybot-public .primary-content :where(.alert-danger) {
    border-color: rgba(255, 102, 122, .36);
    background: rgba(255, 102, 122, .075);
}

/* Navegación secundaria */
body.trybot-authenticated .trybot-client-content :where(.nav-tabs, .nav-pills),
body.trybot-public .primary-content :where(.nav-tabs, .nav-pills) {
    gap: 8px;
    border-color: var(--trybot-line);
}

body.trybot-authenticated .trybot-client-content :where(.nav-tabs .nav-link, .nav-pills .nav-link),
body.trybot-public .primary-content :where(.nav-tabs .nav-link, .nav-pills .nav-link) {
    color: var(--trybot-text-soft);
    border: 1px solid transparent;
    border-radius: var(--trybot-radius-sm);
    background: transparent;
}

body.trybot-authenticated .trybot-client-content :where(.nav-tabs .nav-link.active, .nav-pills .nav-link.active),
body.trybot-public .primary-content :where(.nav-tabs .nav-link.active, .nav-pills .nav-link.active) {
    color: #fff;
    border-color: rgba(0, 157, 255, .34);
    background: rgba(0, 157, 255, .11);
}

body.trybot-authenticated .trybot-client-content :where(.pagination),
body.trybot-public .primary-content :where(.pagination) {
    gap: 6px;
}

body.trybot-authenticated .trybot-client-content :where(.page-link),
body.trybot-public .primary-content :where(.page-link) {
    color: var(--trybot-text-soft);
    border: 1px solid var(--trybot-line);
    border-radius: 9px;
    background: var(--trybot-surface-soft);
}

body.trybot-authenticated .trybot-client-content :where(.page-item.active .page-link),
body.trybot-public .primary-content :where(.page-item.active .page-link) {
    color: #fff;
    border-color: var(--trybot-blue);
    background: var(--trybot-blue);
}

/* Badges y barras de progreso */
body.trybot-authenticated .trybot-client-content :where(.badge, .label),
body.trybot-public .primary-content :where(.badge, .label) {
    padding: 6px 9px;
    border-radius: 999px;
    font-weight: 850;
}

body.trybot-authenticated .trybot-client-content :where(.progress),
body.trybot-public .primary-content :where(.progress) {
    overflow: hidden;
    border-radius: 999px;
    background: rgba(255, 255, 255, .08);
}

body.trybot-authenticated .trybot-client-content :where(.progress-bar),
body.trybot-public .primary-content :where(.progress-bar) {
    background: linear-gradient(90deg, #008fff, #00b7ff);
}

/* Dropdowns y menús que se renderizan dentro del contenido */
body.trybot-authenticated :where(.dropdown-menu),
body.trybot-public :where(.dropdown-menu) {
    color: var(--trybot-text);
    border: 1px solid var(--trybot-line);
    border-radius: var(--trybot-radius-sm);
    background: #09121c;
    box-shadow: 0 24px 60px rgba(0, 0, 0, .38);
}

body.trybot-authenticated :where(.dropdown-item),
body.trybot-public :where(.dropdown-item) {
    color: var(--trybot-text-soft);
}

body.trybot-authenticated :where(.dropdown-item:hover, .dropdown-item:focus),
body.trybot-public :where(.dropdown-item:hover, .dropdown-item:focus) {
    color: #fff;
    background: rgba(0, 157, 255, .09);
}

/* Rutas públicas: centra la base sin interferir con páginas diseñadas. */
body.trybot-public #main-body > .container,
body.trybot-public #main-body > div.container {
    position: relative;
    z-index: 1;
    width: calc(100% - 40px);
    max-width: var(--trybot-content-width);
    margin: 0 auto;
    padding-top: 38px;
    padding-bottom: 80px;
}

body.trybot-public .primary-content {
    min-width: 0;
}

@media (max-width: 1100px) {
    body.trybot-authenticated .trybot-client-content > :not(.trybot-top):not([class*="trybot-"]) {
        width: calc(100% - 28px);
        max-width: calc(100% - 28px);
    }
}

@media (max-width: 767px) {
    body.trybot-authenticated .trybot-client-content > .alert:first-of-type,
    body.trybot-authenticated .trybot-client-content > .card:first-of-type,
    body.trybot-authenticated .trybot-client-content > .panel:first-of-type,
    body.trybot-authenticated .trybot-client-content > form:first-of-type,
    body.trybot-authenticated .trybot-client-content > h1:first-of-type,
    body.trybot-authenticated .trybot-client-content > h2:first-of-type,
    body.trybot-authenticated .trybot-client-content > h3:first-of-type {
        margin-top: 24px;
    }

    body.trybot-authenticated .trybot-client-content > :last-child:not(.trybot-top) {
        margin-bottom: 60px;
    }

    body.trybot-public #main-body > .container,
    body.trybot-public #main-body > div.container {
        width: calc(100% - 28px);
        padding-top: 24px;
        padding-bottom: 60px;
    }

    body.trybot-authenticated .trybot-client-content :where(.table-responsive, .dataTables_wrapper),
    body.trybot-public .primary-content :where(.table-responsive, .dataTables_wrapper) {
        overflow-x: auto;
    }
}

/* Preserve the standard WHMCS captcha layout when a page renders more than one captcha. */
.trybot-google-recaptcha {
    width: 304px;
    height: 78px;
    margin-top: 15px;
    margin-bottom: 15px;
}

.trybot-default-captcha {
    margin-top: 15px;
}

.trybot-default-captcha .trybot-captcha-input {
    width: 100px;
    border-radius: 4px;
}

@media (max-width: 991px) {
    .trybot-google-recaptcha {
        padding-left: 2.5%;
    }

    .trybot-default-captcha {
        margin-bottom: -25px;
    }
}

@media (max-width: 736px) {
    .trybot-google-recaptcha {
        transform: scale(.935);
        transform-origin: 0 0;
    }
}

@media (max-width: 384px) {
    .trybot-google-recaptcha {
        transform: scale(.96);
    }
}

@media (max-width: 360px) {
    .trybot-google-recaptcha {
        transform: scale(.89);
    }
}

@media (max-width: 320px) {
    .trybot-google-recaptcha {
        padding-left: 13.5%;
        transform: scale(.83);
    }
}

/* =========================================================
   TRYBOT — COMPONENTES HEREDADOS ESPECÍFICOS DE WHMCS
========================================================= */

body.trybot-authenticated .trybot-client-content :where(.mw-540),
body.trybot-public .primary-content :where(.mw-540) {
    width: min(100%, 620px);
    max-width: 620px;
    margin-right: auto;
    margin-left: auto;
}

body.trybot-authenticated .trybot-client-content :where(pre, code),
body.trybot-public .primary-content :where(pre, code) {
    color: #d9edff;
    border: 1px solid var(--trybot-line);
    border-radius: var(--trybot-radius-sm);
    background: #050b12;
}

body.trybot-authenticated .trybot-client-content :where(.kb-category, .kb-article-item, .download-category),
body.trybot-public .primary-content :where(.kb-category, .kb-article-item, .download-category) {
    border-color: var(--trybot-line);
    border-radius: var(--trybot-radius-sm);
    background: rgba(255, 255, 255, .035);
    transition: border-color .18s ease, background-color .18s ease, transform .18s ease;
}

body.trybot-authenticated .trybot-client-content :where(.kb-category, .kb-article-item, .download-category):hover,
body.trybot-public .primary-content :where(.kb-category, .kb-article-item, .download-category):hover {
    border-color: rgba(0, 157, 255, .38);
    background: rgba(0, 157, 255, .065);
    transform: translateY(-1px);
}

body.trybot-authenticated .trybot-client-content :where(.announcement),
body.trybot-public .primary-content :where(.announcement) {
    padding: 22px 0;
    border-bottom: 1px solid var(--trybot-line);
}

body.trybot-authenticated .trybot-client-content :where(.domain-pricing .featured-tld),
body.trybot-public .primary-content :where(.domain-pricing .featured-tld) {
    overflow: hidden;
    height: 100%;
    color: var(--trybot-text);
    border: 1px solid var(--trybot-line);
    border-radius: var(--trybot-radius);
    background: var(--trybot-surface);
    box-shadow: var(--trybot-shadow);
}

body.trybot-authenticated .trybot-client-content :where(.domain-pricing .tld-pricing-header, .domain-pricing .tld-row),
body.trybot-public .primary-content :where(.domain-pricing .tld-pricing-header, .domain-pricing .tld-row) {
    color: var(--trybot-text-soft);
    border-color: var(--trybot-line);
    background: rgba(255, 255, 255, .025);
}

body.trybot-authenticated .trybot-client-content :where(.masspay-total),
body.trybot-public .primary-content :where(.masspay-total) {
    color: var(--trybot-text);
    background: rgba(0, 157, 255, .08);
}

body.trybot-authenticated .trybot-client-content :where(.close),
body.trybot-public .primary-content :where(.close),
body.trybot-standalone-document :where(.close) {
    color: #fff;
    text-shadow: none;
    opacity: .72;
}

/* =========================================================
   TRYBOT — DOCUMENTOS HTML INDEPENDIENTES
   Notas de cobro y cotizaciones abiertas fuera del layout.
========================================================= */

body.trybot-standalone-document {
    min-height: 100vh;
    padding: 46px 20px 64px;
    color: var(--trybot-text);
    background:
        radial-gradient(circle at 50% 0%, rgba(0, 157, 255, .13), transparent 34%),
        linear-gradient(180deg, #06111b 0%, #03080d 54%, #020406 100%) !important;
}

body.trybot-standalone-document::before {
    content: "";
    position: fixed;
    inset: 0;
    pointer-events: none;
    opacity: .45;
    background-image:
        linear-gradient(rgba(255, 255, 255, .02) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, .02) 1px, transparent 1px);
    background-size: 48px 48px;
    -webkit-mask-image: linear-gradient(180deg, #000, transparent 82%);
    mask-image: linear-gradient(180deg, #000, transparent 82%);
}

body.trybot-standalone-document .invoice-container {
    position: relative;
    z-index: 1;
    width: min(100%, 1120px);
    max-width: 1120px;
    margin: 0 auto 22px;
    padding: 38px;
    color: var(--trybot-text);
    border: 1px solid rgba(0, 157, 255, .22);
    border-radius: var(--trybot-radius-lg);
    background: rgba(7, 15, 24, .94);
    box-shadow: 0 30px 90px rgba(0, 0, 0, .34);
}

body.trybot-standalone-document .invoice-container :where(h1, h2, h3, h4, h5, strong) {
    color: var(--trybot-text);
}

body.trybot-standalone-document .invoice-container :where(p, address, td, th, small, .small-text) {
    color: var(--trybot-text-soft);
}

body.trybot-standalone-document .invoice-container hr {
    border-color: var(--trybot-line);
}

body.trybot-standalone-document .invoice-container img {
    max-width: 190px;
    max-height: 70px;
    object-fit: contain;
}

body.trybot-standalone-document :where(.card, .modal-content) {
    color: var(--trybot-text);
    border: 1px solid var(--trybot-line);
    border-radius: var(--trybot-radius);
    background: var(--trybot-surface);
    box-shadow: var(--trybot-shadow);
}

body.trybot-standalone-document :where(.card-header, .modal-header, .modal-footer) {
    color: var(--trybot-text);
    border-color: var(--trybot-line);
    background: rgba(0, 157, 255, .075);
}

body.trybot-standalone-document :where(.table) {
    color: var(--trybot-text-soft);
    background: transparent;
}

body.trybot-standalone-document :where(.table td, .table th) {
    color: var(--trybot-text-soft);
    border-color: var(--trybot-line);
}

body.trybot-standalone-document :where(.table thead td, .table thead th, .total-row) {
    color: var(--trybot-text);
    background: rgba(0, 157, 255, .065);
}

body.trybot-standalone-document :where(.btn) {
    min-height: 40px;
    padding: 8px 15px;
    color: var(--trybot-text);
    border: 1px solid var(--trybot-line);
    border-radius: var(--trybot-radius-sm);
    background: var(--trybot-surface-soft);
    font-weight: 850;
}

body.trybot-standalone-document :where(.btn-primary, .btn-success) {
    color: #fff;
    border-color: rgba(0, 157, 255, .72);
    background: linear-gradient(135deg, #008fff, #00b7ff);
}

body.trybot-standalone-document > p.text-center a {
    position: relative;
    z-index: 1;
    color: var(--trybot-blue-soft);
    font-weight: 800;
}

@media print {
    body.trybot-standalone-document {
        padding: 0;
        color: #111;
        background: #fff !important;
    }

    body.trybot-standalone-document::before {
        display: none;
    }

    body.trybot-standalone-document .invoice-container {
        width: 100%;
        max-width: none;
        margin: 0;
        padding: 0;
        color: #111;
        border: 0;
        background: #fff;
        box-shadow: none;
    }

    body.trybot-standalone-document .invoice-container :where(h1, h2, h3, h4, h5, strong, p, address, td, th, small, .small-text) {
        color: #111 !important;
    }
}

@media (max-width: 767px) {
    body.trybot-standalone-document {
        padding: 18px 10px 40px;
    }

    body.trybot-standalone-document .invoice-container {
        padding: 22px 16px;
        border-radius: 16px;
    }
}
