/* =========================================================
   QBIT CHECKOUT 4.2
   ========================================================= */


/* =========================================================
   GENERAL
   ========================================================= */

body.cl-user {

    background: #f4f6f8;
}

body.cl-user .content {

    background: #f4f6f8;
}


/* =========================================================
   CABECERA DE CHECKOUT
   ========================================================= */

.qbit-checkout-heading {

    border-top: 1px solid #e5eaee;

    border-bottom: 1px solid #dce5ec;

    background: #fff;
}

.qbit-checkout-heading .container-xxl,
.qbit-checkout .container-xxl {

    max-width: 1320px;
}

.qbit-checkout-topline {

    min-height: 51px;

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 20px;

    border-bottom: 1px solid #edf1f4;
}

.qbit-checkout-secure {

    color: #526a7d;

    display: inline-flex;

    align-items: center;

    gap: 8px;

    font-family: Arial, Helvetica, sans-serif;

    font-size: 12px;

    font-weight: 600;
}

.qbit-checkout-secure svg {

    width: 18px;

    height: 18px;

    color: #0872cf;
}

.qbit-checkout-support {

    color: #5e7385;

    display: inline-flex;

    align-items: center;

    gap: 5px;

    font-size: 11.5px;

    text-decoration: none;
}

.qbit-checkout-support strong {

    color: #0872cf;
}


/* =========================================================
   PASOS
   ========================================================= */

.qbit-checkout-steps {

    min-height: 68px;

    display: grid;

    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    align-items: center;
}

.qbit-checkout-step {

    position: relative;

    min-width: 0;

    color: #8b98a4;

    display: flex;

    align-items: center;

    gap: 9px;

    font-family: Arial, Helvetica, sans-serif;

    text-decoration: none;
}

.qbit-checkout-step:not(:last-child)::after {

    content: "";

    position: absolute;

    top: 50%;

    right: 15px;

    width: calc(100% - 125px);

    height: 1px;

    background: #dbe3e9;
}

.qbit-checkout-step > span {

    position: relative;

    z-index: 2;

    width: 30px;

    height: 30px;

    flex: 0 0 30px;

    border: 1px solid #d2dce4;

    border-radius: 50%;

    background: #fff;

    display: flex;

    align-items: center;

    justify-content: center;

    font-size: 11px;

    font-weight: 700;
}

.qbit-checkout-step strong,
.qbit-checkout-step small {

    display: block;
}

.qbit-checkout-step strong {

    color: #596d7f;

    font-size: 11.5px;

    font-weight: 600;
}

.qbit-checkout-step small {

    margin-top: 2px;

    font-size: 9.5px;
}

.qbit-checkout-step.is-active > span {

    border-color: #0872cf;

    background: #0872cf;

    color: #fff;
}

.qbit-checkout-step.is-active strong {

    color: #17466f;
}

.qbit-checkout-step.is-complete > span {

    border-color: #9bc5e9;

    background: #edf7ff;

    color: #0872cf;
}


/* =========================================================
   CONTENIDO
   ========================================================= */

.qbit-checkout {

    padding: 27px 0 40px;
}

.qbit-checkout-intro {

    margin-bottom: 19px;
}

.qbit-checkout-intro > span {

    color: #0872cf;

    font-size: 10px;

    font-weight: 700;

    letter-spacing: .05em;

    text-transform: uppercase;
}

.qbit-checkout-intro h1 {

    margin: 4px 0 3px;

    color: #183f68;

    font-family: Arial, Helvetica, sans-serif;

    font-size: 25px;

    line-height: 1.25;

    font-weight: 600;
}

.qbit-checkout-intro p {

    margin: 0;

    color: #738392;

    font-size: 12px;
}


/* =========================================================
   LAYOUT
   ========================================================= */

.qbit-checkout-layout {

    display: grid;

    grid-template-columns:
        minmax(0, 1fr)
        330px;

    gap: 18px;

    align-items: start;
}

.qbit-checkout-main {

    min-width: 0;
}

.qbit-checkout-summary {

    min-width: 0;
}

.qbit-checkout-summary-sticky {

    position: sticky;

    top: 145px;
}


/* =========================================================
   OPCIONES HORIZONTALES
   ========================================================= */

.qbit-checkout-options {

    display: grid;

    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    gap: 12px;
}

.qbit-checkout-option {

    min-width: 0;

    padding: 19px;

    border: 1px solid #dce5ec;

    border-radius: 10px;

    background: #fff;

    display: flex;

    flex-direction: column;

    transition:
        border-color .15s ease,
        box-shadow .15s ease;
}

.qbit-checkout-option:hover {

    border-color: #aacbe6;

    box-shadow:
        0 7px 22px rgba(34, 66, 98, .06);
}

.qbit-option-heading {

    display: flex;

    align-items: center;

    gap: 10px;
}

.qbit-option-icon {

    width: 38px;

    height: 38px;

    flex: 0 0 38px;

    border-radius: 8px;

    background: #edf6ff;

    color: #0872cf;

    display: flex;

    align-items: center;

    justify-content: center;

    font-size: 20px;
}

.qbit-option-icon svg {

    width: 20px;

    height: 20px;
}

.qbit-option-heading span {

    color: #0872cf;

    display: block;

    font-size: 9.5px;

    font-weight: 700;

    letter-spacing: .04em;
}

.qbit-option-heading h2 {

    margin: 2px 0 0;

    color: #254861;

    font-family: Arial, Helvetica, sans-serif;

    font-size: 17px;

    font-weight: 600;
}

.qbit-option-description {

    min-height: 48px;

    margin: 14px 0;

    color: #6b7c8b;

    font-size: 11.5px;

    line-height: 1.45;
}

.qbit-option-benefits {

    margin: 0 0 16px;

    padding: 0;

    list-style: none;
}

.qbit-option-benefits li {

    margin-bottom: 7px;

    color: #52687a;

    font-size: 11px;
}

.qbit-option-benefits li::before {

    content: "✓";

    margin-right: 7px;

    color: #279565;

    font-weight: 700;
}

.qbit-checkout-option form:last-child {

    margin-top: auto;
}

.qbit-option-button {

    width: 100%;

    min-height: 41px;

    padding: 8px 11px;

    border: 1px solid #bed0df;

    border-radius: 6px;

    background: #fff;

    color: #0872cf;

    display: flex;

    align-items: center;

    justify-content: space-between;

    font-size: 11.5px;

    font-weight: 600;
}

.qbit-option-button:hover {

    border-color: #0872cf;

    background: #f4f9fd;
}


/* =========================================================
   LOGIN
   ========================================================= */

.qbit-option-login-form {

    margin-top: auto;
}

.qbit-option-login-form .form-floating {

    margin-bottom: 8px !important;
}

.qbit-option-login-form .form-control {

    height: 48px;

    border: 1px solid #d1dce5;

    border-radius: 6px;

    background: #fff;

    font-size: 12px;
}

.qbit-option-login-form .form-floating > label {

    color: #778795;

    font-size: 11px;
}

.qbit-option-login-form .forgotPasswordOpener {

    margin: 0 0 10px !important;

    color: #0872cf;

    font-size: 10.5px;
}

.qbit-option-login-form .btn-highlight {

    min-height: 41px;

    border: 1px solid #0872cf !important;

    border-radius: 6px !important;

    background: #0872cf !important;

    color: #fff !important;

    font-family: Arial, Helvetica, sans-serif !important;

    font-size: 11.5px !important;

    font-weight: 600 !important;
}


/* =========================================================
   FORM CARD
   ========================================================= */

.qbit-checkout-form-card {

    overflow: hidden;

    border: 1px solid #dce5ec;

    border-radius: 10px;

    background: #fff;
}

.qbit-checkout-card-heading {

    min-height: 73px;

    padding: 15px 19px;

    border-bottom: 1px solid #e3e9ee;

    background: #fbfcfd;

    display: flex;

    align-items: center;

    gap: 10px;
}

.qbit-checkout-card-icon {

    width: 36px;

    height: 36px;

    border-radius: 8px;

    background: #edf6ff;

    color: #0872cf;

    display: flex;

    align-items: center;

    justify-content: center;

    font-size: 17px;

    font-weight: 600;
}

.qbit-checkout-card-heading span {

    color: #0872cf;

    font-size: 9px;

    font-weight: 700;

    letter-spacing: .045em;
}

.qbit-checkout-card-heading h2 {

    margin: 2px 0 0;

    color: #244861;

    font-family: Arial, Helvetica, sans-serif;

    font-size: 17px;

    font-weight: 600;
}

.qbit-checkout-card-body {

    padding: 18px;
}


/* =========================================================
   CAPAS DEL FORMULARIO
   ========================================================= */

.qbit-form-section {

    margin-bottom: 13px;

    padding: 17px;

    border: 1px solid #e0e7ed;

    border-radius: 8px;

    background: #fff;
}

.qbit-form-section:last-child {

    margin-bottom: 0;
}

.qbit-form-section-heading {

    margin-bottom: 15px;

    display: flex;

    align-items: flex-start;

    gap: 10px;
}

.qbit-form-step {

    width: 27px;

    height: 27px;

    flex: 0 0 27px;

    border-radius: 50%;

    background: #edf6ff;

    color: #0872cf;

    display: flex;

    align-items: center;

    justify-content: center;

    font-size: 10px;

    font-weight: 700;
}

.qbit-form-section-heading h3 {

    margin: 0;

    color: #294a64;

    font-family: Arial, Helvetica, sans-serif;

    font-size: 15px;

    font-weight: 600;
}

.qbit-form-section-heading p {

    margin: 3px 0 0;

    color: #7c8a96;

    font-size: 10.5px;
}


/* =========================================================
   CAMPOS
   ========================================================= */

.qbit-user-form .form-control,
.qbit-user-form .form-select {

    min-height: 48px;

    border-color: #d3dde5;

    border-radius: 6px;

    background-color: #fff;

    color: #344c61;

    font-size: 12px;

    box-shadow: none;
}

.qbit-user-form .form-control:focus,
.qbit-user-form .form-select:focus {

    border-color: #7fb4e6;

    box-shadow:
        0 0 0 2px rgba(8,114,207,.08);
}

.qbit-user-form .form-floating > label {

    color: #718392;

    font-size: 11px;
}

.qbit-user-form .mb-3 {

    margin-bottom: 10px !important;
}

.qbit-user-form .text-muted,
.qbit-user-form .req-warning {

    font-size: 10px;
}


/* Cuenta en tres columnas desktop */

.qbit-account-fields {

    display: grid;

    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    gap: 9px;
}

.qbit-account-fields > .mb-3 {

    margin: 0 !important;
}

.qbit-account-fields > .form-check {

    grid-column: 1 / -1;
}


/* Facturación */

.qbit-billing-fields {

    max-width: none;
}

.qbit-billing-fields > .row {

    margin-left: -4px;

    margin-right: -4px;
}

.qbit-billing-fields > .row > [class*="col-"] {

    padding-left: 4px !important;

    padding-right: 4px !important;
}


/* =========================================================
   ENVÍO
   ========================================================= */

.qbit-shipping-same {

    padding: 11px 12px;

    border-radius: 6px;

    background: #f3f8fc;

    color: #4e6679;

    font-size: 11.5px;
}

.qbit-shipping-fields {

    margin-top: 13px;

    padding-top: 13px;

    border-top: 1px solid #e5ebef;
}


/* =========================================================
   RESUMEN CHECKOUT
   ========================================================= */

.qbit-checkout-summary .card {

    border: 1px solid #dce5ec !important;

    border-radius: 9px !important;

    background: #fff !important;

    overflow: hidden;
}

.qbit-checkout-summary .card-title {

    padding: 15px 16px !important;

    border-bottom: 1px solid #e2e8ed !important;

    background: #fff !important;

    color: #24496d !important;

    font-family: Arial, Helvetica, sans-serif !important;

    font-size: 17px !important;

    font-weight: 600 !important;
}

.qbit-checkout-summary .list-group-item {

    padding: 7px 16px !important;

    border: 0 !important;

    color: #5e7181;

    font-family: Arial, Helvetica, sans-serif;

    font-size: 11.5px;
}

.qbit-checkout-summary .list-group-item.h5 {

    margin-top: 7px !important;

    padding-top: 12px !important;

    border-top: 1px solid #e3e9ee !important;

    color: #153f70 !important;

    font-size: 16px !important;

    font-weight: 700 !important;
}


/* =========================================================
   BOTÓN SIGUIENTE
   ========================================================= */

.qbit-checkout-next {

    width: 100%;

    min-height: 45px;

    margin-top: 9px;

    padding: 8px 13px;

    border: 1px solid #0872cf;

    border-radius: 7px;

    background: #0872cf;

    color: #fff;

    display: flex;

    align-items: center;

    justify-content: space-between;

    font-family: Arial, Helvetica, sans-serif;

    font-size: 12px;

    font-weight: 600;
}

.qbit-checkout-next:hover {

    background: #075fae;

    border-color: #075fae;
}


/* =========================================================
   AYUDA / TRUST
   ========================================================= */

.qbit-checkout-help,
.qbit-checkout-trust {

    margin-top: 9px;

    padding: 12px;

    border: 1px solid #dce5ec;

    border-radius: 8px;

    background: #fff;

    color: #65788a;

    font-size: 10.5px;
}

.qbit-checkout-help strong,
.qbit-checkout-help span {

    display: block;
}

.qbit-checkout-help strong {

    color: #31516a;

    font-size: 11.5px;
}

.qbit-checkout-help a {

    margin-top: 6px;

    color: #0872cf;

    display: inline-block;

    font-weight: 600;

    text-decoration: none;
}

.qbit-checkout-trust > span {

    margin-bottom: 6px;

    color: #0872cf;

    display: block;

    font-size: 9.5px;

    font-weight: 700;

    letter-spacing: .04em;
}

.qbit-checkout-trust > div {

    padding: 4px 0;
}


/* =========================================================
   VOLVER
   ========================================================= */

.qbit-checkout-back {

    margin-top: 11px;

    color: #617789;

    display: inline-flex;

    align-items: center;

    font-size: 11px;

    font-weight: 600;

    text-decoration: none;
}

.qbit-checkout-back:hover {

    color: #0872cf;
}


/* =========================================================
   CORRECCIÓN HEADER DEL CARRITO
   ========================================================= */

body.cl-basket .qbit-header-main .container,
body.cl-basket .qbit-header-main .container-fluid {

    max-width: 1360px;

    margin-left: auto;

    margin-right: auto;
}

body.cl-basket .qbit-header-row {

    gap: 14px !important;

    align-items: center !important;
}

body.cl-basket .qbit-header-row > * {

    min-width: 0;
}

body.cl-basket .qbit-search {

    min-width: 360px;

    flex: 1 1 auto;
}


/* =========================================================
   CORRECCIÓN CANTIDAD CARRITO
   ========================================================= */

body.cl-basket .qbit-quantity-wrap {

    display: flex;

    align-items: center;

    gap: 8px;
}

body.cl-basket .qbit-qty-label {

    color: #738393;

    font-family: Arial, Helvetica, sans-serif;

    font-size: 10.5px;

    white-space: nowrap;
}

body.cl-basket .quantity {

    min-width: 122px;
}

body.cl-basket .quantity .input-group {

    width: 122px !important;

    min-width: 122px !important;

    border: 1px solid #ccd8e2;

    border-radius: 6px;

    overflow: hidden;
}

body.cl-basket .quantity .btn-less,
body.cl-basket .quantity .btn-more,
body.cl-basket .quantity .form-control {

    border: 0 !important;
}


/* =========================================================
   CONTEXTO BAJO CARRITO
   ========================================================= */

.qbit-cart-context {

    margin-top: 13px;

    padding: 15px 17px;

    border: 1px solid #dce5ec;

    border-radius: 9px;

    background: #fff;

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 18px;
}

.qbit-cart-context-label {

    color: #0872cf;

    font-size: 9.5px;

    font-weight: 700;

    letter-spacing: .04em;
}

.qbit-cart-context h3 {

    margin: 3px 0 2px;

    color: #294b65;

    font-family: Arial, Helvetica, sans-serif;

    font-size: 14px;

    font-weight: 600;
}

.qbit-cart-context p {

    margin: 0;

    color: #738392;

    font-size: 10.5px;
}

.qbit-cart-context-actions {

    display: flex;

    align-items: center;

    gap: 7px;

    flex: 0 0 auto;
}

.qbit-cart-context-actions a {

    min-height: 35px;

    padding: 7px 10px;

    border: 1px solid #c7d5e0;

    border-radius: 6px;

    color: #0872cf;

    display: inline-flex;

    align-items: center;

    font-size: 10.5px;

    font-weight: 600;

    text-decoration: none;
}


/* =========================================================
   RESPONSIVE
   ========================================================= */

@media (max-width: 1050px) {

    .qbit-checkout-layout {

        grid-template-columns:
            minmax(0, 1fr)
            290px;
    }

    .qbit-checkout-options {

        grid-template-columns: 1fr;
    }

    .qbit-option-description {

        min-height: 0;
    }
}

@media (max-width: 767.98px) {

    .qbit-checkout-steps {

        grid-template-columns:
            repeat(4, 1fr);
    }

    .qbit-checkout-step {

        justify-content: center;
    }

    .qbit-checkout-step div {

        display: none;
    }

    .qbit-checkout-step:not(:last-child)::after {

        right: -50%;

        width: 100%;
    }

    .qbit-checkout-layout {

        grid-template-columns: 1fr;
    }

    .qbit-checkout-summary-sticky {

        position: static;
    }

    .qbit-account-fields {

        grid-template-columns: 1fr;
    }

    .qbit-cart-context {

        align-items: stretch;

        flex-direction: column;
    }

    .qbit-cart-context-actions {

        flex-wrap: wrap;
    }
}


/* =========================================================
   QBIT CHECKOUT 4.2 END
   ========================================================= */


/* =========================================================
   QBIT CHECKOUT 4.3 START
   México + accesibilidad tipográfica
   ========================================================= */


/* =========================================================
   BASE TIPOGRÁFICA
   ========================================================= */

body.cl-user .qbit-checkout,
body.cl-payment .content,
body.cl-order .content,
body.cl-thankyou .content {

    font-family:
        Arial,
        Helvetica,
        sans-serif !important;

    font-size:
        13px !important;
}


/* =========================================================
   FRANJA COMPRA SEGURA
   ========================================================= */

.qbit-checkout-secure {

    font-size:
        13px !important;
}

.qbit-checkout-support {

    font-size:
        12.5px !important;
}


/* =========================================================
   PASOS CHECKOUT
   ========================================================= */

.qbit-checkout-step strong {

    font-size:
        13px !important;
}

.qbit-checkout-step small {

    margin-top:
        3px !important;

    font-size:
        11px !important;

    line-height:
        1.3 !important;
}


/* =========================================================
   INTRO
   ========================================================= */

.qbit-checkout-intro > span {

    font-size:
        11px !important;
}

.qbit-checkout-intro h1 {

    font-size:
        26px !important;

    line-height:
        1.25 !important;
}

.qbit-checkout-intro p {

    font-size:
        13px !important;
}


/* =========================================================
   TARJETAS INGRESAR / CUENTA / INVITADO
   ========================================================= */

.qbit-option-heading span {

    font-size:
        10.5px !important;
}

.qbit-option-heading h2 {

    font-size:
        18px !important;
}

.qbit-option-description {

    font-size:
        13px !important;

    line-height:
        1.45 !important;
}

.qbit-option-benefits li {

    font-size:
        12.5px !important;

    line-height:
        1.4 !important;
}

.qbit-option-button,
.qbit-option-login-form .btn-highlight {

    font-size:
        13px !important;
}


/* =========================================================
   LOGIN
   ========================================================= */

.qbit-option-login-form
.form-floating > label {

    font-size:
        12px !important;
}

.qbit-option-login-form
.form-control {

    font-size:
        13px !important;
}

.qbit-option-login-form
.forgotPasswordOpener {

    font-size:
        12px !important;
}


/* =========================================================
   CABECERAS DE CAPA
   ========================================================= */

.qbit-checkout-card-heading span {

    font-size:
        10.5px !important;
}

.qbit-checkout-card-heading h2 {

    font-size:
        18px !important;
}

.qbit-form-section-heading h3 {

    font-size:
        16px !important;
}

.qbit-form-section-heading p {

    font-size:
        12px !important;

    line-height:
        1.4 !important;
}


/* =========================================================
   FORMULARIOS
   ========================================================= */

.qbit-user-form .form-control,
.qbit-user-form .form-select {

    min-height:
        52px !important;

    font-size:
        13px !important;
}

.qbit-user-form
.form-floating > label {

    font-size:
        12px !important;
}

.qbit-user-form
.form-check-label {

    color:
        #455e73 !important;

    font-size:
        12.5px !important;
}

.qbit-user-form
.text-muted,
.qbit-user-form
.req-warning,
.qbit-user-form
.form-text {

    font-size:
        11.5px !important;

    line-height:
        1.4 !important;
}


/* =========================================================
   TRATAMIENTO
   ========================================================= */

.qbit-user-form select[name*="oxsal"] {

    min-height:
        52px !important;

    font-size:
        13px !important;
}


/* =========================================================
   ESTADO
   ========================================================= */

.qbit-user-form
select[name*="oxstateid"] {

    min-height:
        52px !important;

    font-size:
        13px !important;

    background-color:
        #fff !important;
}


/* =========================================================
   OCULTAR CAMPOS HEREDADOS
   SIN ELIMINARLOS DEL DOM
   ========================================================= */

.qbit-mx-hidden-field {

    display:
        none !important;
}


/* =========================================================
   TELÉFONOS
   ========================================================= */

.qbit-user-form
input[name="invadr[oxuser__oxmobfon]"],
.qbit-user-form
input[name="invadr[oxuser__oxfon]"],
.qbit-user-form
input[name="deladr[oxaddress__oxfon]"] {

    font-size:
        14px !important;
}


/* =========================================================
   RESUMEN
   ========================================================= */

.qbit-checkout-summary .card-title {

    font-size:
        18px !important;
}

.qbit-checkout-summary
.list-group-item {

    font-size:
        13px !important;

    line-height:
        1.45 !important;
}

.qbit-checkout-summary
.list-group-item.h5 {

    font-size:
        17px !important;
}


/* =========================================================
   AYUDA
   ========================================================= */

.qbit-checkout-help,
.qbit-checkout-trust {

    font-size:
        12px !important;

    line-height:
        1.4 !important;
}

.qbit-checkout-help strong {

    font-size:
        13px !important;
}


/* =========================================================
   BOTONES
   ========================================================= */

.qbit-checkout-next {

    min-height:
        48px !important;

    font-size:
        13px !important;
}

.qbit-checkout-back {

    font-size:
        12.5px !important;
}


/* =========================================================
   PAGO / ORDER TODAVÍA APEX
   Evitar por ahora tipografía diminuta/condensada
   hasta su rediseño completo.
   ========================================================= */

body.cl-payment .card,
body.cl-order .card {

    font-family:
        Arial,
        Helvetica,
        sans-serif !important;
}

body.cl-payment .card-title,
body.cl-order .card-title {

    color:
        #21476c !important;

    font-family:
        Arial,
        Helvetica,
        sans-serif !important;

    font-size:
        20px !important;

    font-weight:
        600 !important;

    letter-spacing:
        0 !important;
}

body.cl-payment .card-body,
body.cl-payment .list-group-item,
body.cl-order .card-body,
body.cl-order .list-group-item {

    font-size:
        13px !important;
}


/* =========================================================
   QBIT CHECKOUT 4.3 END
   ========================================================= */


/* =========================================================
   QBIT ACCOUNT 4.3B START
   Registro independiente
   ========================================================= */


/* =========================================================
   PÁGINA
   ========================================================= */

body.cl-register {

    background: #f4f6f8 !important;

    font-family:
        Arial,
        Helvetica,
        sans-serif !important;
}

body.cl-register .content {

    background:
        #f4f6f8 !important;
}


/* =========================================================
   CONTENEDOR
   ========================================================= */

body.cl-register .content > .container,
body.cl-register .content > .container-md,
body.cl-register .content > .container-lg,
body.cl-register .content > .container-xl,
body.cl-register .content > .container-xxl {

    max-width:
        1180px !important;

    margin-left:
        auto !important;

    margin-right:
        auto !important;

    padding-top:
        28px !important;

    padding-bottom:
        40px !important;
}


/* =========================================================
   TÍTULO PRINCIPAL
   ========================================================= */

body.cl-register h1 {

    margin-bottom:
        18px !important;

    color:
        #183f68 !important;

    font-family:
        Arial,
        Helvetica,
        sans-serif !important;

    font-size:
        26px !important;

    line-height:
        1.25 !important;

    font-weight:
        600 !important;

    letter-spacing:
        0 !important;
}


/* =========================================================
   TARJETA PRINCIPAL
   ========================================================= */

body.cl-register form[name="order"],
body.cl-register .card {

    max-width:
        none !important;
}

body.cl-register form[name="order"] {

    padding:
        22px !important;

    border:
        1px solid #dce5ec !important;

    border-radius:
        10px !important;

    background:
        #ffffff !important;
}


/* =========================================================
   ENCABEZADOS APEX ANTIGUOS
   ========================================================= */

body.cl-register h2,
body.cl-register h3,
body.cl-register .h2,
body.cl-register .h3,
body.cl-register .card-title {

    color:
        #254861 !important;

    font-family:
        Arial,
        Helvetica,
        sans-serif !important;

    font-weight:
        600 !important;

    letter-spacing:
        0 !important;
}

body.cl-register h2,
body.cl-register .h2 {

    font-size:
        20px !important;
}

body.cl-register h3,
body.cl-register .h3 {

    font-size:
        17px !important;
}


/* =========================================================
   SECCIONES
   ========================================================= */

body.cl-register fieldset,
body.cl-register .form-group {

    border-color:
        #e0e7ed !important;
}

body.cl-register legend {

    color:
        #254861 !important;

    font-family:
        Arial,
        Helvetica,
        sans-serif !important;

    font-size:
        18px !important;

    font-weight:
        600 !important;
}


/* =========================================================
   CAMPOS
   ========================================================= */

body.cl-register .form-control,
body.cl-register .form-select {

    min-height:
        52px !important;

    border:
        1px solid #d3dde5 !important;

    border-radius:
        6px !important;

    background-color:
        #ffffff !important;

    color:
        #344c61 !important;

    font-family:
        Arial,
        Helvetica,
        sans-serif !important;

    font-size:
        13px !important;

    box-shadow:
        none !important;
}

body.cl-register .form-control:focus,
body.cl-register .form-select:focus {

    border-color:
        #7fb4e6 !important;

    box-shadow:
        0 0 0 2px
        rgba(8,114,207,.08) !important;
}

body.cl-register
.form-floating > label {

    color:
        #718392 !important;

    font-family:
        Arial,
        Helvetica,
        sans-serif !important;

    font-size:
        12px !important;
}


/* =========================================================
   CHECKBOX
   ========================================================= */

body.cl-register .form-check-label {

    color:
        #455e73 !important;

    font-size:
        12.5px !important;
}

body.cl-register .text-muted,
body.cl-register .req-warning,
body.cl-register .form-text {

    font-size:
        11.5px !important;

    line-height:
        1.4 !important;
}


/* =========================================================
   OCULTOS MÉXICO
   ========================================================= */

body.cl-register
.qbit-mx-hidden-field {

    display:
        none !important;
}


/* =========================================================
   BOTÓN
   ========================================================= */

body.cl-register
button[type="submit"],
body.cl-register
.btn-highlight {

    min-height:
        46px !important;

    padding:
        8px 18px !important;

    border:
        1px solid #0872cf !important;

    border-radius:
        6px !important;

    background:
        #0872cf !important;

    color:
        #ffffff !important;

    font-family:
        Arial,
        Helvetica,
        sans-serif !important;

    font-size:
        13px !important;

    font-weight:
        600 !important;
}

body.cl-register
button[type="submit"]:hover {

    border-color:
        #075fae !important;

    background:
        #075fae !important;
}


/* =========================================================
   ESTADOS
   Evitar dropdown visual gigantesco por estilos heredados
   ========================================================= */

body.cl-register
select[name*="oxstateid"],
body.cl-user
select[name*="oxstateid"] {

    width:
        100% !important;

    min-height:
        52px !important;

    max-height:
        none !important;

    overflow:
        visible !important;

    color:
        #344c61 !important;

    background-color:
        #ffffff !important;

    font-size:
        13px !important;
}


/* =========================================================
   RESPONSIVE
   ========================================================= */

@media (max-width: 767.98px) {

    body.cl-register form[name="order"] {

        padding:
            14px !important;
    }
}


/* =========================================================
   QBIT ACCOUNT 4.3B END
   ========================================================= */


/* =========================================================
   QBIT ACCOUNT 4.3C START
   Formulario mexicano horizontal
   ========================================================= */


/* =========================================================
   REGISTRO INDEPENDIENTE
   ========================================================= */

body.cl-register
.content > .container-xxl {

    max-width:
        1320px !important;
}

body.cl-register
.qbit-register-card {

    width:
        100%;

    max-width:
        1180px;

    margin:
        0 auto;
}

body.cl-register
.qbit-register-form {

    padding:
        0 !important;

    border:
        1px solid #dce5ec !important;

    border-radius:
        10px !important;

    background:
        #fff !important;

    overflow:
        hidden;
}


/* =========================================================
   SECCIONES DEL REGISTRO
   ========================================================= */

.qbit-register-section {

    padding:
        20px
        22px;

    border-bottom:
        1px solid #e3e9ee;
}

.qbit-register-section:last-child {

    border-bottom:
        0;
}

.qbit-register-section-head {

    margin-bottom:
        16px;

    display:
        flex;

    align-items:
        flex-start;

    gap:
        10px;
}

.qbit-register-step {

    width:
        28px;

    height:
        28px;

    flex:
        0 0 28px;

    border-radius:
        50%;

    background:
        #edf6ff;

    color:
        #0872cf;

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    font-size:
        11px;

    font-weight:
        700;
}

.qbit-register-eyebrow {

    color:
        #0872cf;

    display:
        block;

    font-size:
        10.5px;

    font-weight:
        700;

    letter-spacing:
        .045em;
}

.qbit-register-section-head h2 {

    margin:
        2px
        0
        2px !important;

    color:
        #254861 !important;

    font-family:
        Arial,
        Helvetica,
        sans-serif !important;

    font-size:
        18px !important;

    font-weight:
        600 !important;
}

.qbit-register-section-head p {

    margin:
        0;

    color:
        #748493;

    font-size:
        12px;
}


/* =========================================================
   CUENTA — 3 CAMPOS EN UNA FILA
   ========================================================= */

.qbit-register-account-grid,
.qbit-account-fields {

    display:
        grid !important;

    grid-template-columns:
        repeat(3, minmax(0, 1fr))
        !important;

    gap:
        10px !important;
}

.qbit-register-account-grid
> .mb-3,
.qbit-account-fields
> .mb-3 {

    margin:
        0 !important;
}

.qbit-register-account-grid
> .form-check,
.qbit-account-fields
> .form-check {

    grid-column:
        1 / -1;

    margin-top:
        2px;
}


/* =========================================================
   BILLING GRID 12 COLUMNAS
   ========================================================= */

.qbit-billing-grid {

    display:
        grid;

    grid-template-columns:
        repeat(12, minmax(0, 1fr));

    gap:
        10px;
}

.qbit-field {

    min-width:
        0;
}

.qbit-col-2 {
    grid-column: span 2;
}

.qbit-col-3 {
    grid-column: span 3;
}

.qbit-col-4 {
    grid-column: span 4;
}

.qbit-col-5 {
    grid-column: span 5;
}

.qbit-col-6 {
    grid-column: span 6;
}

.qbit-col-8 {
    grid-column: span 8;
}

.qbit-col-12 {
    grid-column: span 12;
}


/* =========================================================
   CAMPOS
   ========================================================= */

.qbit-billing-grid
.form-control,
.qbit-billing-grid
.form-select {

    width:
        100% !important;

    min-height:
        52px !important;

    border:
        1px solid #ccd9e3 !important;

    border-radius:
        6px !important;

    background-color:
        #fff !important;

    color:
        #314a60 !important;

    font-family:
        Arial,
        Helvetica,
        sans-serif !important;

    font-size:
        13px !important;

    box-shadow:
        none !important;
}

.qbit-billing-grid
.form-control:focus,
.qbit-billing-grid
.form-select:focus {

    border-color:
        #67a9e3 !important;

    box-shadow:
        0 0 0 2px
        rgba(8,114,207,.08)
        !important;
}

.qbit-billing-grid
.form-floating > label {

    color:
        #6e8191 !important;

    font-size:
        12px !important;
}


/* =========================================================
   ESTADO
   ========================================================= */

.qbit-billing-grid
select.stateselect {

    width:
        100% !important;

    min-height:
        52px !important;

    max-height:
        none !important;

    background-color:
        #fff !important;
}


/* =========================================================
   CAMPOS OBLIGATORIOS / SAVE
   ========================================================= */

.qbit-required-note {

    margin:
        8px
        0
        0;

    color:
        #748493;

    font-size:
        11.5px;
}

.qbit-save-cell {

    display:
        flex;

    align-items:
        flex-end;

    justify-content:
        flex-end;
}

.qbit-register-save {

    width:
        100%;

    min-height:
        46px;

    padding:
        8px
        13px;

    border:
        1px solid #0872cf;

    border-radius:
        6px;

    background:
        #0872cf;

    color:
        #fff;

    display:
        flex;

    align-items:
        center;

    justify-content:
        space-between;

    font-family:
        Arial,
        Helvetica,
        sans-serif;

    font-size:
        13px;

    font-weight:
        600;
}


/* =========================================================
   CHECKOUT UNA SOLA PÁGINA
   Aprovechar también todo el ancho de su columna.
   ========================================================= */

body.cl-user
.qbit-checkout-card-body {

    padding:
        17px !important;
}

body.cl-user
.qbit-form-section {

    padding:
        15px !important;
}

body.cl-user
.qbit-billing-grid {

    gap:
        9px;
}


/* =========================================================
   ESTADO — EVITAR SELECT VISUAL GIGANTE
   ========================================================= */

body.cl-register
select.stateselect,
body.cl-user
select.stateselect {

    appearance:
        auto !important;

    height:
        52px !important;

    min-height:
        52px !important;

    overflow:
        visible !important;
}


/* =========================================================
   RESPONSIVE
   ========================================================= */

@media (max-width: 991.98px) {

    .qbit-register-account-grid,
    .qbit-account-fields {

        grid-template-columns:
            repeat(2, minmax(0, 1fr))
            !important;
    }

    .qbit-register-account-grid
    > .form-check,
    .qbit-account-fields
    > .form-check {

        grid-column:
            1 / -1;
    }

    .qbit-col-2,
    .qbit-col-3,
    .qbit-col-4 {

        grid-column:
            span 6;
    }

    .qbit-col-5,
    .qbit-col-6,
    .qbit-col-8,
    .qbit-col-12 {

        grid-column:
            span 12;
    }
}


@media (max-width: 575.98px) {

    .qbit-register-account-grid,
    .qbit-account-fields {

        grid-template-columns:
            1fr !important;
    }

    .qbit-field {

        grid-column:
            1 / -1 !important;
    }

    .qbit-register-section {

        padding:
            15px;
    }
}


/* =========================================================
   QBIT ACCOUNT 4.3C END
   ========================================================= */





/* =========================================================
   QBIT ACCOUNT 4.3E START
   Billing definitivo
   ========================================================= */


/* =========================================================
   CONTENEDOR
   ========================================================= */

.qbit-mx-billing {

    width: 100% !important;

    max-width: none !important;

    display: grid !important;

    grid-template-columns:
        repeat(12, minmax(0, 1fr)) !important;

    gap: 10px !important;

    align-items: start !important;
}

.qbit-mx-field {

    min-width: 0 !important;

    width: auto !important;

    max-width: none !important;
}


/* =========================================================
   FILA 1
   2 + 5 + 5
   ========================================================= */

.qbit-mx-salutation {

    grid-column:
        span 2 !important;
}

.qbit-mx-firstname {

    grid-column:
        span 5 !important;
}

.qbit-mx-lastname {

    grid-column:
        span 5 !important;
}


/* =========================================================
   FILA 2
   5 + 2 + 2 + 3
   ========================================================= */

.qbit-mx-street {

    grid-column:
        span 5 !important;
}

.qbit-mx-streetnr {

    grid-column:
        span 2 !important;
}

.qbit-mx-zip {

    grid-column:
        span 2 !important;
}

.qbit-mx-city {

    grid-column:
        span 3 !important;
}


/* =========================================================
   FILA 3
   3 + 3 + 3 + 3
   ========================================================= */

.qbit-mx-country,
.qbit-mx-state,
.qbit-mx-mobile,
.qbit-mx-phone {

    grid-column:
        span 3 !important;
}


/* =========================================================
   FILA 4
   5 + 3 + 4
   ========================================================= */

.qbit-mx-company {

    grid-column:
        span 5 !important;
}

.qbit-mx-rfc {

    grid-column:
        span 3 !important;
}

.qbit-mx-reference {

    grid-column:
        span 4 !important;
}


/* =========================================================
   NOTA
   ========================================================= */

.qbit-mx-required {

    grid-column:
        span 8 !important;

    min-height:
        44px;

    display:
        flex;

    align-items:
        center;

    color:
        #748493;

    font-size:
        11.5px;
}

.qbit-mx-submit {

    grid-column:
        span 4 !important;

    display:
        flex;

    align-items:
        center;
}


/* =========================================================
   INPUTS
   ========================================================= */

.qbit-mx-billing
.form-floating {

    width:
        100% !important;

    max-width:
        none !important;
}

.qbit-mx-billing
.form-control,
.qbit-mx-billing
.form-select {

    width:
        100% !important;

    max-width:
        none !important;

    min-height:
        52px !important;

    font-size:
        13px !important;
}


/* =========================================================
   ESTADO
   ========================================================= */

.qbit-mx-billing
.stateselect {

    width:
        100% !important;

    max-width:
        none !important;

    height:
        52px !important;

    min-height:
        52px !important;

    font-size:
        13px !important;
}


/* =========================================================
   FORMULARIO PADRE
   IMPORTANTÍSIMO: quitar límites APEX anteriores
   ========================================================= */

body.cl-register
#registerAdrressForm,
body.cl-register
.qbit-register-section,
body.cl-register
.qbit-register-card,

body.cl-user
.qbit-billing-fields,
body.cl-user
.qbit-form-section,
body.cl-user
.qbit-checkout-card-body {

    width:
        100% !important;

    max-width:
        none !important;
}


/* =========================================================
   CUENTA
   ========================================================= */

.qbit-register-account-grid,
.qbit-account-fields {

    width:
        100% !important;

    max-width:
        none !important;

    grid-template-columns:
        repeat(3, minmax(0, 1fr))
        !important;
}


/* =========================================================
   SUBMIT
   ========================================================= */

.qbit-register-save {

    width:
        100% !important;

    min-height:
        46px;
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 991.98px) {

    .qbit-mx-salutation {

        grid-column:
            span 3 !important;
    }

    .qbit-mx-firstname {

        grid-column:
            span 4 !important;
    }

    .qbit-mx-lastname {

        grid-column:
            span 5 !important;
    }

    .qbit-mx-street {

        grid-column:
            span 6 !important;
    }

    .qbit-mx-streetnr,
    .qbit-mx-zip {

        grid-column:
            span 3 !important;
    }

    .qbit-mx-city,
    .qbit-mx-country,
    .qbit-mx-state,
    .qbit-mx-mobile,
    .qbit-mx-phone,
    .qbit-mx-rfc {

        grid-column:
            span 6 !important;
    }

    .qbit-mx-company,
    .qbit-mx-reference {

        grid-column:
            span 12 !important;
    }
}


/* =========================================================
   MÓVIL
   ========================================================= */

@media (max-width: 575.98px) {

    .qbit-mx-billing
    > .qbit-mx-field,
    .qbit-mx-required,
    .qbit-mx-submit {

        grid-column:
            1 / -1 !important;
    }

    .qbit-register-account-grid,
    .qbit-account-fields {

        grid-template-columns:
            1fr !important;
    }
}


/* =========================================================
   QBIT ACCOUNT 4.3E END
   ========================================================= */


/* =========================================================
   QBIT ACCOUNT 4.3F START
   Formulario equilibrado
   ========================================================= */


/* =========================================================
   GRID BASE
   ========================================================= */

.qbit-mx-billing {

    display: grid !important;

    grid-template-columns:
        repeat(12, minmax(0, 1fr)) !important;

    gap:
        10px 12px !important;

    align-items:
        start !important;
}


/* =========================================================
   FILA 1
   Tratamiento / Nombre / Apellido
   ========================================================= */

.qbit-mx-salutation {

    grid-column:
        span 2 !important;
}

.qbit-mx-firstname {

    grid-column:
        span 5 !important;
}

.qbit-mx-lastname {

    grid-column:
        span 5 !important;
}


/* =========================================================
   FILA 2
   Calle / Número
   ========================================================= */

.qbit-mx-street {

    grid-column:
        span 9 !important;
}

.qbit-mx-streetnr {

    grid-column:
        span 3 !important;
}


/* =========================================================
   FILA 3
   Código postal / Ciudad
   ========================================================= */

.qbit-mx-zip {

    grid-column:
        span 4 !important;
}

.qbit-mx-city {

    grid-column:
        span 8 !important;
}


/* =========================================================
   FILA 4
   País / Estado
   ========================================================= */

.qbit-mx-country,
.qbit-mx-state {

    grid-column:
        span 6 !important;
}


/* =========================================================
   FILA 5
   Celular / Teléfono alternativo
   ========================================================= */

.qbit-mx-mobile,
.qbit-mx-phone {

    grid-column:
        span 6 !important;
}


/* =========================================================
   FILA 6
   Empresa / RFC
   ========================================================= */

.qbit-mx-company {

    grid-column:
        span 8 !important;
}

.qbit-mx-rfc {

    grid-column:
        span 4 !important;
}


/* =========================================================
   FILA 7
   Referencia
   ========================================================= */

.qbit-mx-reference {

    grid-column:
        1 / -1 !important;
}


/* =========================================================
   CAMPOS
   ========================================================= */

.qbit-mx-field {

    min-width:
        0 !important;

    width:
        auto !important;
}

.qbit-mx-billing
.form-floating,
.qbit-mx-billing
.form-control,
.qbit-mx-billing
.form-select,
.qbit-mx-billing
.stateselect {

    width:
        100% !important;

    max-width:
        none !important;
}


/* =========================================================
   NOTA / BOTÓN
   ========================================================= */

.qbit-mx-required {

    grid-column:
        1 / 8 !important;

    min-height:
        44px;

    display:
        flex;

    align-items:
        center;
}

.qbit-mx-submit {

    grid-column:
        8 / -1 !important;
}


/* =========================================================
   RESPIRACIÓN VISUAL
   ========================================================= */

body.cl-user
.qbit-form-section,
body.cl-register
.qbit-register-section {

    padding:
        18px 20px !important;
}

.qbit-mx-billing
.form-control,
.qbit-mx-billing
.form-select,
.qbit-mx-billing
.stateselect {

    min-height:
        52px !important;

    font-size:
        13px !important;
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 991.98px) {

    .qbit-mx-salutation {

        grid-column:
            span 3 !important;
    }

    .qbit-mx-firstname {

        grid-column:
            span 4 !important;
    }

    .qbit-mx-lastname {

        grid-column:
            span 5 !important;
    }

    .qbit-mx-street,
    .qbit-mx-streetnr,
    .qbit-mx-zip,
    .qbit-mx-city,
    .qbit-mx-country,
    .qbit-mx-state,
    .qbit-mx-mobile,
    .qbit-mx-phone,
    .qbit-mx-company,
    .qbit-mx-rfc {

        grid-column:
            span 6 !important;
    }

    .qbit-mx-reference {

        grid-column:
            1 / -1 !important;
    }
}


/* =========================================================
   MÓVIL
   ========================================================= */

@media (max-width: 575.98px) {

    .qbit-mx-billing
    > .qbit-mx-field,
    .qbit-mx-required,
    .qbit-mx-submit {

        grid-column:
            1 / -1 !important;
    }
}


/* =========================================================
   QBIT ACCOUNT 4.3F END
   ========================================================= */


/* =========================================================
   QBIT ACCOUNT 4.3G START
   Registro independiente sincronizado con checkout
   ========================================================= */

body.cl-register .qbit-register-section,
body.cl-user .qbit-register-section {
    max-width: 1240px !important;
    margin: 0 auto 24px auto !important;
    padding: 20px 24px !important;
    background: #fff !important;
    border: 1px solid #d7e3f0 !important;
    border-radius: 12px !important;
}

body.cl-register .qbit-register-shared,
body.cl-user .qbit-register-shared {
    width: 100% !important;
}

body.cl-register .qbit-mx-billing,
body.cl-user .qbit-mx-billing {
    display: grid !important;
    grid-template-columns: repeat(12, minmax(0, 1fr)) !important;
    gap: 12px 12px !important;
    align-items: start !important;
}

body.cl-register .qbit-mx-billing > *,
body.cl-user .qbit-mx-billing > * {
    min-width: 0 !important;
}

body.cl-register .qbit-mx-billing .form-floating,
body.cl-register .qbit-mx-billing .form-control,
body.cl-register .qbit-mx-billing .form-select,
body.cl-register .qbit-mx-billing .stateselect,
body.cl-user .qbit-mx-billing .form-floating,
body.cl-user .qbit-mx-billing .form-control,
body.cl-user .qbit-mx-billing .form-select,
body.cl-user .qbit-mx-billing .stateselect {
    width: 100% !important;
    max-width: none !important;
}

body.cl-register .qbit-mx-salutation,
body.cl-user .qbit-mx-salutation { grid-column: span 2 !important; }

body.cl-register .qbit-mx-firstname,
body.cl-user .qbit-mx-firstname { grid-column: span 5 !important; }

body.cl-register .qbit-mx-lastname,
body.cl-user .qbit-mx-lastname { grid-column: span 5 !important; }

body.cl-register .qbit-mx-street,
body.cl-user .qbit-mx-street { grid-column: span 9 !important; }

body.cl-register .qbit-mx-streetnr,
body.cl-user .qbit-mx-streetnr { grid-column: span 3 !important; }

body.cl-register .qbit-mx-zip,
body.cl-user .qbit-mx-zip { grid-column: span 4 !important; }

body.cl-register .qbit-mx-city,
body.cl-user .qbit-mx-city { grid-column: span 8 !important; }

body.cl-register .qbit-mx-country,
body.cl-register .qbit-mx-state,
body.cl-user .qbit-mx-country,
body.cl-user .qbit-mx-state { grid-column: span 6 !important; }

body.cl-register .qbit-mx-mobile,
body.cl-register .qbit-mx-phone,
body.cl-user .qbit-mx-mobile,
body.cl-user .qbit-mx-phone { grid-column: span 6 !important; }

body.cl-register .qbit-mx-company,
body.cl-user .qbit-mx-company { grid-column: span 8 !important; }

body.cl-register .qbit-mx-rfc,
body.cl-user .qbit-mx-rfc { grid-column: span 4 !important; }

body.cl-register .qbit-mx-reference,
body.cl-user .qbit-mx-reference { grid-column: 1 / -1 !important; }

body.cl-register .qbit-mx-required,
body.cl-user .qbit-mx-required {
    grid-column: 1 / 8 !important;
    display: flex !important;
    align-items: center !important;
    min-height: 44px !important;
    font-size: 14px !important;
    color: #5f7390 !important;
}

body.cl-register .qbit-mx-submit,
body.cl-user .qbit-mx-submit {
    grid-column: 8 / -1 !important;
    display: flex !important;
    justify-content: flex-end !important;
    align-items: center !important;
}

body.cl-register .qbit-mx-submit .btn,
body.cl-user .qbit-mx-submit .btn {
    min-width: 280px !important;
    height: 44px !important;
}

body.cl-register .qbit-register-section h1,
body.cl-register .qbit-register-section h2,
body.cl-register .qbit-register-section h3,
body.cl-user .qbit-register-section h1,
body.cl-user .qbit-register-section h2,
body.cl-user .qbit-register-section h3 {
    font-size: 20px !important;
    line-height: 1.25 !important;
}

body.cl-register .qbit-register-section p,
body.cl-register .qbit-register-section label,
body.cl-register .qbit-register-section .form-text,
body.cl-user .qbit-register-section p,
body.cl-user .qbit-register-section label,
body.cl-user .qbit-register-section .form-text {
    font-size: 14px !important;
    line-height: 1.45 !important;
}

@media (max-width: 991.98px) {
    body.cl-register .qbit-mx-salutation,
    body.cl-user .qbit-mx-salutation { grid-column: span 3 !important; }

    body.cl-register .qbit-mx-firstname,
    body.cl-user .qbit-mx-firstname { grid-column: span 4 !important; }

    body.cl-register .qbit-mx-lastname,
    body.cl-user .qbit-mx-lastname { grid-column: span 5 !important; }

    body.cl-register .qbit-mx-street,
    body.cl-register .qbit-mx-streetnr,
    body.cl-register .qbit-mx-zip,
    body.cl-register .qbit-mx-city,
    body.cl-register .qbit-mx-country,
    body.cl-register .qbit-mx-state,
    body.cl-register .qbit-mx-mobile,
    body.cl-register .qbit-mx-phone,
    body.cl-register .qbit-mx-company,
    body.cl-register .qbit-mx-rfc,
    body.cl-user .qbit-mx-street,
    body.cl-user .qbit-mx-streetnr,
    body.cl-user .qbit-mx-zip,
    body.cl-user .qbit-mx-city,
    body.cl-user .qbit-mx-country,
    body.cl-user .qbit-mx-state,
    body.cl-user .qbit-mx-mobile,
    body.cl-user .qbit-mx-phone,
    body.cl-user .qbit-mx-company,
    body.cl-user .qbit-mx-rfc {
        grid-column: span 6 !important;
    }

    body.cl-register .qbit-mx-submit,
    body.cl-user .qbit-mx-submit {
        grid-column: 1 / -1 !important;
        justify-content: flex-start !important;
    }

    body.cl-register .qbit-mx-required,
    body.cl-user .qbit-mx-required {
        grid-column: 1 / -1 !important;
    }
}

@media (max-width: 575.98px) {
    body.cl-register .qbit-mx-billing > *,
    body.cl-user .qbit-mx-billing > * {
        grid-column: 1 / -1 !important;
    }

    body.cl-register .qbit-mx-submit .btn,
    body.cl-user .qbit-mx-submit .btn {
        width: 100% !important;
        min-width: 0 !important;
    }
}

/* =========================================================
   QBIT ACCOUNT 4.3G END
   ========================================================= */


/* =========================================================
   QBIT CHECKOUT 4.4 START
   Dirección y datos de compra
   ========================================================= */


/* =========================================================
   GENERAL
   ========================================================= */

.qbit-user-change-form {

    display:
        flex;

    flex-direction:
        column;

    gap:
        12px;
}


/* =========================================================
   CARD FACTURACIÓN
   ========================================================= */

.qbit-address-card,
.qbit-shipping-card,
.qbit-order-preferences,
.qbit-order-comment,
.qbit-address-edit-panel {

    border:
        1px solid #dce5ec;

    border-radius:
        9px;

    background:
        #fff;
}

.qbit-address-card {

    padding:
        18px;
}

.qbit-address-card-head,
.qbit-shipping-card-head,
.qbit-address-edit-panel-head {

    display:
        flex;

    align-items:
        flex-start;

    justify-content:
        space-between;

    gap:
        16px;
}

.qbit-address-eyebrow {

    color:
        #0872cf;

    display:
        block;

    margin-bottom:
        3px;

    font-size:
        10px;

    line-height:
        1.2;

    font-weight:
        700;

    letter-spacing:
        .045em;
}

.qbit-address-card h3,
.qbit-shipping-card h3,
.qbit-address-edit-panel h3,
.qbit-order-comment h3 {

    margin:
        0;

    color:
        #244a69;

    font-family:
        Arial,
        Helvetica,
        sans-serif;

    font-size:
        17px;

    line-height:
        1.3;

    font-weight:
        600;
}

.qbit-address-card-head p,
.qbit-shipping-card-head p,
.qbit-order-comment p {

    margin:
        3px 0 0;

    color:
        #758695;

    font-size:
        12px;
}


/* =========================================================
   EDITAR
   ========================================================= */

.qbit-address-edit {

    min-height:
        36px;

    padding:
        7px 10px;

    border:
        1px solid #c8d6e1;

    border-radius:
        6px;

    background:
        #fff;

    color:
        #0872cf;

    display:
        inline-flex;

    align-items:
        center;

    gap:
        6px;

    font-size:
        11.5px;

    font-weight:
        600;
}

.qbit-address-edit svg {

    width:
        16px;

    height:
        16px;
}


/* =========================================================
   GRID DATOS
   ========================================================= */

.qbit-address-grid {

    margin-top:
        16px;

    padding-top:
        15px;

    border-top:
        1px solid #e4eaf0;

    display:
        grid;

    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap:
        10px;
}

.qbit-address-item {

    min-width:
        0;

    padding:
        10px 12px;

    border-radius:
        6px;

    background:
        #f6f9fb;
}

.qbit-address-item span {

    color:
        #7a8996;

    display:
        block;

    margin-bottom:
        2px;

    font-size:
        10.5px;
}

.qbit-address-item strong {

    color:
        #29475f;

    display:
        block;

    overflow-wrap:
        anywhere;

    font-size:
        12.5px;

    line-height:
        1.4;

    font-weight:
        600;
}

.qbit-address-wide {

    grid-column:
        1 / -1;
}


/* =========================================================
   PANEL EDITAR
   ========================================================= */

.qbit-address-edit-panel {

    padding:
        18px;
}

.qbit-address-edit-panel[hidden] {

    display:
        none !important;
}

.qbit-address-edit-close {

    min-height:
        34px;

    padding:
        6px 10px;

    border:
        1px solid #cbd8e2;

    border-radius:
        6px;

    background:
        #fff;

    color:
        #60768a;

    font-size:
        11px;
}


/* =========================================================
   ENVÍO
   ========================================================= */

.qbit-shipping-card {

    padding:
        18px;
}

.qbit-shipping-choice {

    margin-top:
        14px;

    padding-top:
        14px;

    border-top:
        1px solid #e4eaf0;
}


/* =========================================================
   CHECKBOX QBIT
   ========================================================= */

.qbit-choice-check {

    cursor:
        pointer;

    display:
        flex;

    align-items:
        flex-start;

    gap:
        9px;

    color:
        #425c71;
}

.qbit-choice-check
> input {

    position:
        absolute;

    opacity:
        0;

    pointer-events:
        none;
}

.qbit-choice-box {

    width:
        18px;

    height:
        18px;

    flex:
        0 0 18px;

    margin-top:
        1px;

    border:
        1px solid #bfcdd8;

    border-radius:
        4px;

    background:
        #fff;

    position:
        relative;
}

.qbit-choice-check
> input:checked
+ .qbit-choice-box {

    border-color:
        #0872cf;

    background:
        #0872cf;
}

.qbit-choice-check
> input:checked
+ .qbit-choice-box::after {

    content:
        "";

    position:
        absolute;

    left:
        5px;

    top:
        2px;

    width:
        5px;

    height:
        9px;

    border:
        solid #fff;

    border-width:
        0 2px 2px 0;

    transform:
        rotate(45deg);
}

.qbit-choice-check strong {

    color:
        #294a64;

    display:
        block;

    font-size:
        12.5px;

    font-weight:
        600;
}

.qbit-choice-check small {

    margin-top:
        2px;

    color:
        #7a8996;

    display:
        block;

    font-size:
        11px;
}


/* =========================================================
   SHIPPING FORM
   ========================================================= */

.qbit-shipping-address-form {

    margin-top:
        14px;

    padding-top:
        14px;

    border-top:
        1px solid #e4eaf0;
}


/* =========================================================
   NEWSLETTER
   ========================================================= */

.qbit-order-preferences {

    padding:
        14px 16px;
}


/* =========================================================
   COMENTARIOS
   ========================================================= */

.qbit-order-comment {

    padding:
        16px 18px;
}

.qbit-order-comment textarea {

    min-height:
        92px;

    margin-top:
        12px;

    padding:
        12px;

    border:
        1px solid #ccd9e3;

    border-radius:
        6px;

    background:
        #fff;

    color:
        #334d61;

    font-family:
        Arial,
        Helvetica,
        sans-serif;

    font-size:
        12.5px;

    line-height:
        1.45;

    resize:
        vertical;

    box-shadow:
        none;
}

.qbit-order-comment textarea:focus {

    border-color:
        #70afe3;

    box-shadow:
        0 0 0 2px
        rgba(8,114,207,.08);
}


/* =========================================================
   RESPONSIVE
   ========================================================= */

@media (max-width: 575.98px) {

    .qbit-address-grid {

        grid-template-columns:
            1fr;
    }

    .qbit-address-wide {

        grid-column:
            auto;
    }

    .qbit-address-card-head,
    .qbit-shipping-card-head,
    .qbit-address-edit-panel-head {

        flex-direction:
            column;
    }
}


/* =========================================================
   QBIT CHECKOUT 4.4 END
   ========================================================= */


/* =========================================================
   QBIT CHECKOUT 4.6B START
   Paso 2 compacto
   ========================================================= */


/* =========================================================
   CONTENEDOR GENERAL
   ========================================================= */

body.cl-user .qbit-checkout-main {
    gap: 14px !important;
}

body.cl-user .qbit-checkout-form-card {
    padding: 14px 16px !important;
}


/* =========================================================
   FACTURACION
   ========================================================= */

body.cl-user .qbit-address-card {
    padding: 14px 16px !important;
    margin-bottom: 10px !important;
}

body.cl-user .qbit-address-card-head {
    margin-bottom: 10px !important;
    padding-bottom: 9px !important;
}

body.cl-user .qbit-address-card-head h3 {
    margin: 2px 0 1px !important;
    font-size: 16px !important;
    line-height: 1.2 !important;
}

body.cl-user .qbit-address-card-head p {
    margin: 0 !important;
    font-size: 11px !important;
    line-height: 1.25 !important;
}

body.cl-user .qbit-address-eyebrow {
    font-size: 9px !important;
    line-height: 1.1 !important;
}

body.cl-user .qbit-address-edit {
    min-height: 32px !important;
    padding: 5px 10px !important;
    font-size: 11px !important;
}


/* =========================================================
   GRID DATOS
   ========================================================= */

body.cl-user .qbit-address-grid {
    display: grid !important;
    grid-template-columns:
        repeat(4, minmax(0, 1fr)) !important;
    gap: 7px !important;
}

body.cl-user .qbit-address-item {
    min-height: 48px !important;
    padding: 8px 10px !important;
    border-radius: 7px !important;
}

body.cl-user .qbit-address-item span {
    display: block !important;
    margin-bottom: 2px !important;
    font-size: 9px !important;
    line-height: 1.1 !important;
}

body.cl-user .qbit-address-item strong {
    display: block !important;
    font-size: 11px !important;
    line-height: 1.2 !important;
    overflow-wrap: anywhere;
}

body.cl-user .qbit-address-wide {
    grid-column: span 2 !important;
}


/* Empresa y RFC pueden ocupar dos columnas cada uno */

body.cl-user .qbit-address-grid
.qbit-address-item:nth-child(1),
body.cl-user .qbit-address-grid
.qbit-address-item:nth-child(2) {
    grid-column: span 2;
}


/* =========================================================
   ENVIO
   ========================================================= */

body.cl-user .qbit-shipping-card {
    padding: 12px 16px !important;
    margin-top: 0 !important;
    margin-bottom: 9px !important;
}

body.cl-user .qbit-shipping-card-head {
    margin-bottom: 8px !important;
    padding-bottom: 7px !important;
}

body.cl-user .qbit-shipping-card-head h3 {
    margin: 2px 0 1px !important;
    font-size: 15px !important;
    line-height: 1.2 !important;
}

body.cl-user .qbit-shipping-card-head p {
    margin: 0 !important;
    font-size: 10.5px !important;
    line-height: 1.2 !important;
}

body.cl-user .qbit-shipping-choice {
    margin: 0 !important;
}

body.cl-user .qbit-choice-check {
    min-height: 42px !important;
    padding: 8px 10px !important;
    gap: 9px !important;
}

body.cl-user .qbit-choice-check strong {
    font-size: 11px !important;
    line-height: 1.2 !important;
}

body.cl-user .qbit-choice-check small {
    margin-top: 1px !important;
    font-size: 9.5px !important;
    line-height: 1.2 !important;
}

body.cl-user .qbit-choice-box {
    width: 17px !important;
    height: 17px !important;
    min-width: 17px !important;
}


/* =========================================================
   CAMPOS DE DIRECCION ALTERNATIVA
   Si se despliegan, mantenerlos compactos
   ========================================================= */

body.cl-user .qbit-shipping-fields {
    margin-top: 9px !important;
    padding-top: 9px !important;
}

body.cl-user .qbit-shipping-fields
.form-control,
body.cl-user .qbit-shipping-fields
.form-select,
body.cl-user .qbit-shipping-fields
.stateselect {
    min-height: 42px !important;
    height: 42px !important;
    font-size: 12px !important;
}


/* =========================================================
   NEWSLETTER / CHECK SIMPLE
   ========================================================= */

body.cl-user .qbit-user-change-form
> .form-check,
body.cl-user .qbit-user-change-form
.qbit-newsletter,
body.cl-user .qbit-user-change-form
[class*="newsletter"] {
    margin: 8px 0 !important;
    padding-top: 8px !important;
    padding-bottom: 8px !important;
}


/* =========================================================
   COMENTARIOS
   ========================================================= */

body.cl-user textarea[name="order_remark"],
body.cl-user textarea[name*="remark"] {
    min-height: 62px !important;
    height: 62px !important;
    resize: vertical !important;
    padding: 8px 10px !important;
    font-size: 11px !important;
    line-height: 1.3 !important;
}


/* =========================================================
   ESPACIADO ENTRE BLOQUES
   ========================================================= */

body.cl-user .qbit-user-change-form > section {
    margin-bottom: 9px !important;
}

body.cl-user .qbit-user-change-form > section:last-child {
    margin-bottom: 0 !important;
}


/* =========================================================
   RESPONSIVE
   ========================================================= */

@media (max-width: 991.98px) {

    body.cl-user .qbit-address-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;
    }

    body.cl-user .qbit-address-grid
    .qbit-address-item:nth-child(1),
    body.cl-user .qbit-address-grid
    .qbit-address-item:nth-child(2),
    body.cl-user .qbit-address-wide {
        grid-column: span 2 !important;
    }
}


@media (max-width: 575.98px) {

    body.cl-user .qbit-address-grid {
        grid-template-columns: 1fr !important;
    }

    body.cl-user .qbit-address-grid
    .qbit-address-item,
    body.cl-user .qbit-address-grid
    .qbit-address-item:nth-child(1),
    body.cl-user .qbit-address-grid
    .qbit-address-item:nth-child(2),
    body.cl-user .qbit-address-wide {
        grid-column: 1 / -1 !important;
    }
}


/* =========================================================
   QBIT CHECKOUT 4.6B END
   ========================================================= */


/* =========================================================
   QBIT CHECKOUT 4.6C START
   Tipografía legible manteniendo layout compacto
   ========================================================= */

body.cl-user .qbit-address-eyebrow {
    font-size: 10.5px !important;
}

body.cl-user .qbit-address-card-head h3 {
    font-size: 17px !important;
}

body.cl-user .qbit-address-card-head p {
    font-size: 11.5px !important;
    line-height: 1.35 !important;
}

body.cl-user .qbit-address-edit {
    font-size: 11.5px !important;
}

body.cl-user .qbit-address-item span {
    font-size: 10.5px !important;
    line-height: 1.2 !important;
}

body.cl-user .qbit-address-item strong {
    font-size: 12.5px !important;
    line-height: 1.3 !important;
}

body.cl-user .qbit-shipping-card-head h3 {
    font-size: 16.5px !important;
}

body.cl-user .qbit-shipping-card-head p {
    font-size: 11.5px !important;
    line-height: 1.3 !important;
}

body.cl-user .qbit-choice-check strong {
    font-size: 12px !important;
    line-height: 1.3 !important;
}

body.cl-user .qbit-choice-check small {
    font-size: 10.5px !important;
    line-height: 1.3 !important;
}

body.cl-user textarea[name="order_remark"],
body.cl-user textarea[name*="remark"] {
    font-size: 12px !important;
    line-height: 1.4 !important;
}

/* =========================================================
   QBIT CHECKOUT 4.6C END
   ========================================================= */


/* =========================================================
   QBIT CHECKOUT UI 4.6D START
   Buscador visible y header ordenado en checkout
   ========================================================= */


/* Contenedor principal */

body.cl-user .qbit-header-main .container-xxl,
body.cl-payment .qbit-header-main .container-xxl,
body.cl-order .qbit-header-main .container-xxl,
body.cl-thankyou .qbit-header-main .container-xxl {

    width: 100% !important;
    max-width: 1440px !important;

    margin-left: auto !important;
    margin-right: auto !important;

    padding-left: 24px !important;
    padding-right: 24px !important;
}


/* Estructura */

body.cl-user .qbit-header-row,
body.cl-payment .qbit-header-row,
body.cl-order .qbit-header-row,
body.cl-thankyou .qbit-header-row {

    display: grid !important;

    grid-template-columns:
        150px
        minmax(320px, 1fr)
        auto !important;

    align-items: center !important;

    gap: 18px !important;

    width: 100% !important;
}


/* Logo */

body.cl-user .qbit-logo,
body.cl-payment .qbit-logo,
body.cl-order .qbit-logo,
body.cl-thankyou .qbit-logo {

    width: 150px !important;
    max-width: 150px !important;

    margin: 0 !important;
}


body.cl-user .qbit-logo img,
body.cl-payment .qbit-logo img,
body.cl-order .qbit-logo img,
body.cl-thankyou .qbit-logo img {

    width: 145px !important;
    max-width: 145px !important;

    height: auto !important;
}


/* Buscador */

body.cl-user .qbit-search,
body.cl-payment .qbit-search,
body.cl-order .qbit-search,
body.cl-thankyou .qbit-search {

    display: block !important;

    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;

    margin: 0 !important;
}


body.cl-user .qbit-search form,
body.cl-payment .qbit-search form,
body.cl-order .qbit-search form,
body.cl-thankyou .qbit-search form {

    width: 100% !important;
    max-width: none !important;
}


/* Acciones derecha */

body.cl-user .qbit-header-actions,
body.cl-payment .qbit-header-actions,
body.cl-order .qbit-header-actions,
body.cl-thankyou .qbit-header-actions {

    display: flex !important;

    align-items: center !important;
    justify-content: flex-end !important;

    gap: 8px !important;

    width: auto !important;
    min-width: max-content !important;

    margin: 0 !important;
}


body.cl-user .qbit-contact,
body.cl-user .qbit-account,
body.cl-user .qbit-cart,

body.cl-payment .qbit-contact,
body.cl-payment .qbit-account,
body.cl-payment .qbit-cart,

body.cl-order .qbit-contact,
body.cl-order .qbit-account,
body.cl-order .qbit-cart,

body.cl-thankyou .qbit-contact,
body.cl-thankyou .qbit-account,
body.cl-thankyou .qbit-cart {

    flex: 0 0 auto !important;
}


/* No permitir que widgets se estiren */

body.cl-user .qbit-header-row > *,
body.cl-payment .qbit-header-row > *,
body.cl-order .qbit-header-row > *,
body.cl-thankyou .qbit-header-row > * {

    min-width: 0 !important;
}


/* Responsive intermedio */

@media (max-width: 1199.98px) {

    body.cl-user .qbit-header-row,
    body.cl-payment .qbit-header-row,
    body.cl-order .qbit-header-row,
    body.cl-thankyou .qbit-header-row {

        grid-template-columns:
            125px
            minmax(220px, 1fr)
            auto !important;

        gap: 10px !important;
    }

    body.cl-user .qbit-logo,
    body.cl-user .qbit-logo img,
    body.cl-payment .qbit-logo,
    body.cl-payment .qbit-logo img,
    body.cl-order .qbit-logo,
    body.cl-order .qbit-logo img,
    body.cl-thankyou .qbit-logo,
    body.cl-thankyou .qbit-logo img {

        width: 120px !important;
        max-width: 120px !important;
    }
}


/* =========================================================
   QBIT CHECKOUT UI 4.6D END
   ========================================================= */


/* =========================================================
   QBIT CHECKOUT 4.6F START
   Panel Editar datos
   ========================================================= */


/* =========================================================
   CONTENEDOR
   ========================================================= */

body.cl-user .qbit-address-edit-panel {
    margin-top: 10px !important;
    margin-bottom: 10px !important;

    padding: 16px 18px !important;

    border: 1px solid #d7e3ee !important;
    border-radius: 10px !important;

    background: #ffffff !important;

    box-shadow: none !important;
}


/* =========================================================
   CABECERA
   ========================================================= */

body.cl-user .qbit-address-edit-panel-head {
    display: flex !important;

    align-items: center !important;
    justify-content: space-between !important;

    gap: 16px !important;

    margin-bottom: 13px !important;
    padding-bottom: 10px !important;

    border-bottom: 1px solid #e6edf3 !important;
}


body.cl-user .qbit-address-edit-panel-head h3 {
    margin: 2px 0 0 !important;

    color: #153b63 !important;

    font-size: 17px !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
}


body.cl-user .qbit-address-edit-panel-head
.qbit-address-eyebrow {
    color: #0872cf !important;

    font-size: 10px !important;
    font-weight: 700 !important;

    letter-spacing: .04em !important;
}


body.cl-user .qbit-address-edit-close {
    min-height: 34px !important;

    padding: 6px 12px !important;

    border: 1px solid #cddae5 !important;
    border-radius: 7px !important;

    background: #ffffff !important;
    color: #486277 !important;

    font-size: 11.5px !important;
    font-weight: 500 !important;

    box-shadow: none !important;
}


body.cl-user .qbit-address-edit-close:hover {
    border-color: #0872cf !important;

    background: #f5f9fd !important;
    color: #0872cf !important;
}


/* =========================================================
   GRID FORMULARIO
   ========================================================= */

body.cl-user .qbit-address-edit-panel
.qbit-mx-billing {
    display: grid !important;

    grid-template-columns:
        repeat(12, minmax(0, 1fr)) !important;

    gap: 10px 12px !important;

    width: 100% !important;

    padding: 0 !important;
}


/* =========================================================
   CAMPOS
   ========================================================= */

body.cl-user .qbit-address-edit-panel
.qbit-mx-field {
    min-width: 0 !important;
}


body.cl-user .qbit-address-edit-panel
.form-floating {
    width: 100% !important;

    margin: 0 !important;
}


body.cl-user .qbit-address-edit-panel
.form-control,

body.cl-user .qbit-address-edit-panel
.form-select,

body.cl-user .qbit-address-edit-panel
.stateselect {
    width: 100% !important;

    min-height: 46px !important;
    height: 46px !important;

    padding:
        17px 12px 5px !important;

    border: 1px solid #d7e1e9 !important;
    border-radius: 7px !important;

    background: #ffffff !important;

    color: #18364f !important;

    font-size: 12.5px !important;
    font-weight: 500 !important;

    box-shadow: none !important;
    outline: none !important;
}


body.cl-user .qbit-address-edit-panel
.form-control:focus,

body.cl-user .qbit-address-edit-panel
.form-select:focus,

body.cl-user .qbit-address-edit-panel
.stateselect:focus {
    border-color: #7bb6e7 !important;

    box-shadow:
        0 0 0 2px rgba(8,114,207,.08)
        !important;
}


/* =========================================================
   LABELS FLOTANTES
   ========================================================= */

body.cl-user .qbit-address-edit-panel
.form-floating > label {
    padding:
        7px 12px !important;

    color: #718394 !important;

    font-size: 10.5px !important;
}


/* =========================================================
   SELECTS
   ========================================================= */

body.cl-user .qbit-address-edit-panel
.form-select,

body.cl-user .qbit-address-edit-panel
.stateselect {
    padding-top: 16px !important;
    padding-bottom: 5px !important;

    background-color: #ffffff !important;
}


/* Evitar aspecto gris heredado de Apex */

body.cl-user .qbit-address-edit-panel
.form-control:not(:disabled),

body.cl-user .qbit-address-edit-panel
.form-select:not(:disabled) {
    background-color: #ffffff !important;
}


/* =========================================================
   DISTRIBUCION
   ========================================================= */

/* Tratamiento */
body.cl-user .qbit-address-edit-panel
.qbit-mx-salutation {
    grid-column: span 2 !important;
}

/* Nombre */
body.cl-user .qbit-address-edit-panel
.qbit-mx-firstname {
    grid-column: span 5 !important;
}

/* Apellido */
body.cl-user .qbit-address-edit-panel
.qbit-mx-lastname {
    grid-column: span 5 !important;
}


/* Calle */
body.cl-user .qbit-address-edit-panel
.qbit-mx-street {
    grid-column: span 9 !important;
}

/* Número */
body.cl-user .qbit-address-edit-panel
.qbit-mx-streetnr {
    grid-column: span 3 !important;
}


/* CP */
body.cl-user .qbit-address-edit-panel
.qbit-mx-zip {
    grid-column: span 4 !important;
}

/* Ciudad */
body.cl-user .qbit-address-edit-panel
.qbit-mx-city {
    grid-column: span 8 !important;
}


/* País */
body.cl-user .qbit-address-edit-panel
.qbit-mx-country {
    grid-column: span 6 !important;
}

/* Estado */
body.cl-user .qbit-address-edit-panel
.qbit-mx-state {
    grid-column: span 6 !important;
}


/* Teléfonos */
body.cl-user .qbit-address-edit-panel
.qbit-mx-mobile,
body.cl-user .qbit-address-edit-panel
.qbit-mx-phone {
    grid-column: span 6 !important;
}


/* Empresa */
body.cl-user .qbit-address-edit-panel
.qbit-mx-company {
    grid-column: span 8 !important;
}

/* RFC */
body.cl-user .qbit-address-edit-panel
.qbit-mx-vatid {
    grid-column: span 4 !important;
}


/* Información adicional */
body.cl-user .qbit-address-edit-panel
.qbit-mx-addinfo {
    grid-column: 1 / -1 !important;
}


/* =========================================================
   BOTON GUARDAR / SUBMIT SI EXISTE
   ========================================================= */

body.cl-user .qbit-address-edit-panel
.qbit-mx-submit {
    grid-column: 1 / -1 !important;

    display: flex !important;

    justify-content: flex-end !important;

    margin-top: 2px !important;
}


body.cl-user .qbit-address-edit-panel
.qbit-mx-submit .btn {
    min-height: 40px !important;

    padding: 8px 18px !important;

    border-radius: 7px !important;

    font-size: 12px !important;
}


/* =========================================================
   RESPONSIVE
   ========================================================= */

@media (max-width: 991.98px) {

    body.cl-user .qbit-address-edit-panel
    .qbit-mx-salutation {
        grid-column: span 3 !important;
    }

    body.cl-user .qbit-address-edit-panel
    .qbit-mx-firstname,
    body.cl-user .qbit-address-edit-panel
    .qbit-mx-lastname {
        grid-column: span 9 !important;
    }

    body.cl-user .qbit-address-edit-panel
    .qbit-mx-street,
    body.cl-user .qbit-address-edit-panel
    .qbit-mx-streetnr,
    body.cl-user .qbit-address-edit-panel
    .qbit-mx-zip,
    body.cl-user .qbit-address-edit-panel
    .qbit-mx-city,
    body.cl-user .qbit-address-edit-panel
    .qbit-mx-country,
    body.cl-user .qbit-address-edit-panel
    .qbit-mx-state,
    body.cl-user .qbit-address-edit-panel
    .qbit-mx-mobile,
    body.cl-user .qbit-address-edit-panel
    .qbit-mx-phone,
    body.cl-user .qbit-address-edit-panel
    .qbit-mx-company,
    body.cl-user .qbit-address-edit-panel
    .qbit-mx-vatid {
        grid-column: span 6 !important;
    }
}


@media (max-width: 575.98px) {

    body.cl-user .qbit-address-edit-panel
    .qbit-mx-billing > * {
        grid-column:
            1 / -1 !important;
    }
}


/* =========================================================
   QBIT CHECKOUT 4.6F END
   ========================================================= */



/* =========================================================
   QBIT CHECKOUT 4.6G START
   Acciones Editar datos
   ========================================================= */

body.cl-user .qbit-address-edit-actions {
    display: flex !important;
    justify-content: flex-end !important;
    align-items: center !important;
    gap: 10px !important;

    margin-top: 14px !important;
    padding-top: 12px !important;

    border-top: 1px solid #e6edf3 !important;
}

body.cl-user .qbit-address-save {
    min-height: 40px !important;
    padding: 8px 20px !important;

    border: 1px solid #0872cf !important;
    border-radius: 7px !important;

    background: #0872cf !important;
    color: #ffffff !important;

    font-size: 12.5px !important;
    font-weight: 600 !important;

    box-shadow: none !important;
}

body.cl-user .qbit-address-save:hover {
    background: #0564b7 !important;
    border-color: #0564b7 !important;
}

body.cl-user .qbit-address-save:focus {
    outline: none !important;
    box-shadow: 0 0 0 3px rgba(8,114,207,.12) !important;
}

body.cl-user .qbit-address-edit-cancel {
    min-height: 40px !important;
}

/* =========================================================
   QBIT CHECKOUT 4.6G END
   ========================================================= */


/* =========================================================
   QBIT CHECKOUT 4.6H TYPOGRAPHY START
   Estándar tipográfico QBIT
   ========================================================= */

/*
 * Desktop:
 * labels/captions: 11.5–12px
 * datos/inputs:    13–14px
 * auxiliares:      11.5–12px
 * títulos:         16–18px
 * botones:         12.5–14px
 */

body.cl-user .qbit-address-edit-panel-head
.qbit-address-eyebrow {
    font-size: 11.5px !important;
}

body.cl-user .qbit-address-edit-panel-head h3 {
    font-size: 17px !important;
}

body.cl-user .qbit-address-edit-panel
.form-floating > label {
    font-size: 11.5px !important;
    line-height: 1.2 !important;
    color: #667d91 !important;
}

body.cl-user .qbit-address-edit-panel
.form-control,
body.cl-user .qbit-address-edit-panel
.form-select,
body.cl-user .qbit-address-edit-panel
.stateselect {
    font-size: 13.5px !important;
    line-height: 1.3 !important;
}

body.cl-user .qbit-address-edit-panel
.qbit-address-edit-close,
body.cl-user .qbit-address-edit-panel
.qbit-address-save {
    font-size: 13px !important;
}

body.cl-user .qbit-address-edit-panel
.qbit-mx-required,
body.cl-user .qbit-address-edit-panel
.form-text,
body.cl-user .qbit-address-edit-panel
small {
    font-size: 12px !important;
    line-height: 1.35 !important;
}

/* =========================================================
   QBIT CHECKOUT 4.6H TYPOGRAPHY END
   ========================================================= */



/* =========================================================
   QBIT CHECKOUT — PAYMENT / PASO 3
   ========================================================= */

body.cl-payment,
body.cl-payment .content {

    background: #f4f6f8;
}


.qbit-payment-card {

    overflow: hidden;

    border: 1px solid #dce5ec;

    border-radius: 10px;

    background: #fff;
}


.qbit-payment-card-heading {

    padding: 18px 20px;

    border-bottom: 1px solid #e5ebf0;

    background: #fff;
}


.qbit-payment-card-heading span {

    display: block;

    margin-bottom: 2px;

    color: #0872cf;

    font-size: 11px;

    font-weight: 700;

    letter-spacing: .05em;
}


.qbit-payment-card-heading h2 {

    margin: 0;

    color: #183f68;

    font-family: Arial, Helvetica, sans-serif;

    font-size: 17px;

    line-height: 1.3;

    font-weight: 600;
}


.qbit-payment-card-heading p {

    margin: 4px 0 0;

    color: #708292;

    font-size: 12px;

    line-height: 1.45;
}


.qbit-payment-form {

    margin: 0;

    padding: 18px 20px 20px;
}


.qbit-payment-methods {

    display: grid;

    gap: 10px;
}


.qbit-payment-method {

    position: relative;

    min-height: 72px;

    margin: 0;

    padding: 14px 16px;

    border: 1px solid #d9e3ea;

    border-radius: 8px;

    background: #fff;

    display: flex;

    align-items: center;

    gap: 13px;

    cursor: pointer;

    transition:
        border-color .15s ease,
        box-shadow .15s ease,
        background .15s ease;
}


.qbit-payment-method:hover {

    border-color: #9bc5e9;

    background: #fbfdff;
}


.qbit-payment-method:has(input:checked) {

    border-color: #0872cf;

    box-shadow: 0 0 0 2px rgba(8, 114, 207, .08);

    background: #fbfdff;
}


.qbit-payment-method-radio {

    width: 20px;

    height: 20px;

    flex: 0 0 20px;

    position: relative;
}


.qbit-payment-method-radio input {

    position: absolute;

    opacity: 0;

    pointer-events: none;
}


.qbit-payment-method-radio > span {

    width: 18px;

    height: 18px;

    border: 1.5px solid #a8b8c5;

    border-radius: 50%;

    background: #fff;

    display: block;

    position: relative;
}


.qbit-payment-method-radio input:checked + span {

    border-color: #0872cf;
}


.qbit-payment-method-radio input:checked + span::after {

    content: "";

    position: absolute;

    top: 4px;

    left: 4px;

    width: 8px;

    height: 8px;

    border-radius: 50%;

    background: #0872cf;
}


.qbit-payment-method-copy {

    min-width: 0;

    display: block;
}


.qbit-payment-method-copy strong {

    display: block;

    color: #183f68;

    font-size: 14px;

    line-height: 1.3;

    font-weight: 600;
}


.qbit-payment-method-copy small {

    display: block;

    margin-top: 3px;

    color: #718291;

    font-size: 12px;

    line-height: 1.4;
}


.qbit-payment-empty {

    padding: 14px;

    border: 1px solid #ecd8ae;

    border-radius: 8px;

    background: #fffaf0;

    color: #6d5b36;

    font-size: 12px;
}


body.cl-payment .qbit-checkout-back {

    margin-top: 14px;
}


@media (max-width: 767.98px) {

    .qbit-payment-card-heading,
    .qbit-payment-form {

        padding-left: 15px;

        padding-right: 15px;
    }


    .qbit-payment-method {

        padding: 13px;
    }

}


/* =========================================================
   QBIT STRIPE — EMBEDDED CHECKOUT
   ========================================================= */

.qbit-stripe-panel {

    margin-top: 14px;

    padding-top: 16px;

    border-top: 1px solid #e5ebf0;
}


.qbit-stripe-loading {

    padding: 18px;

    border: 1px solid #dce5ec;

    border-radius: 8px;

    background: #f8fafc;

    color: #607486;

    font-size: 12px;
}


.qbit-stripe-error {

    padding: 14px;

    border: 1px solid #e7b9b9;

    border-radius: 8px;

    background: #fff5f5;

    color: #9b2c2c;

    font-size: 12px;
}


.qbit-stripe-checkout {

    min-height: 320px;
}


.qbit-stripe-checkout iframe {

    width: 100% !important;
}


body.cl-payment .qbit-payment-card {

    overflow: visible;
}


@media (max-width: 767.98px) {

    .qbit-stripe-checkout {

        min-height: 420px;
    }

}


/* =========================================================
   QBIT STRIPE ELEMENTS
   ========================================================= */

.qbit-stripe-elements-form {

    margin-top: 4px;

    padding: 0;
}


.qbit-stripe-payment-element {

    width: 100%;
}


.qbit-stripe-pay {

    width: 100%;

    min-height: 46px;

    margin-top: 16px;

    border: 0;

    border-radius: 7px;

    background: #0872cf;

    color: #fff;

    font-family: Arial, Helvetica, sans-serif;

    font-size: 13px;

    font-weight: 700;

    cursor: pointer;
}


.qbit-stripe-pay:hover:not(:disabled) {

    background: #075fae;
}


.qbit-stripe-pay:disabled {

    opacity: .55;

    cursor: not-allowed;
}


.qbit-stripe-panel {

    margin-top: 12px;

    padding-top: 14px;
}


@media (min-width: 992px) {

    .qbit-stripe-panel {

        max-width: 100%;
    }

}


/* =========================================================
   QBIT STRIPE — EXPRESS CHECKOUT
   ========================================================= */

.qbit-stripe-express-wrap {
    margin-bottom: 14px;
}

.qbit-stripe-express-title {
    margin-bottom: 8px;
    color: #183f68;
    font-size: 13px;
    font-weight: 600;
}

.qbit-stripe-express-checkout {
    width: 100%;
    min-height: 46px;
}

.qbit-stripe-divider {
    position: relative;
    margin: 16px 0;
    text-align: center;
    color: #738392;
    font-size: 11.5px;
}

.qbit-stripe-divider::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    height: 1px;
    background: #dce5ec;
}

.qbit-stripe-divider span {
    position: relative;
    z-index: 1;
    padding: 0 10px;
    background: #fff;
}

@media (min-width: 992px) {
    .qbit-stripe-express-checkout {
        max-width: 100%;
    }
}


/* =========================================================
   QBIT STRIPE — PAYMENT PRIORITY LAYOUT 2.4-H
   ========================================================= */

.qbit-stripe-payment-layout {

    display: grid;

    grid-template-columns:
        minmax(0, 1fr)
        240px;

    gap: 16px;

    align-items: start;
}


.qbit-stripe-primary-card {

    min-width: 0;

    padding: 16px;

    border: 1px solid #dce5ec;

    border-radius: 9px;

    background: #fff;
}


.qbit-stripe-section-heading {

    margin-bottom: 16px;
}


.qbit-stripe-section-heading > span {

    display: block;

    margin-bottom: 3px;

    color: #0872cf;

    font-size: 11px;

    font-weight: 700;

    letter-spacing: .05em;
}


.qbit-stripe-section-heading > strong {

    display: block;

    color: #183f68;

    font-size: 15px;

    line-height: 1.35;

    font-weight: 600;
}


.qbit-stripe-section-heading > small {

    display: block;

    margin-top: 3px;

    color: #718291;

    font-size: 11.5px;

    line-height: 1.45;
}


.qbit-stripe-express-wrap {

    margin: 0;

    padding: 15px;

    border: 1px solid #dce5ec;

    border-radius: 9px;

    background: #f8fafc;
}


.qbit-stripe-express-title {

    margin: 0 0 4px;

    color: #183f68;

    font-size: 14px;

    font-weight: 600;
}


.qbit-stripe-express-copy {

    margin: 0 0 13px;

    color: #718291;

    font-size: 11.5px;

    line-height: 1.4;
}


.qbit-stripe-express-checkout {

    width: 100%;

    min-height: 48px;
}


.qbit-stripe-express-note {

    display: block;

    margin-top: 10px;

    color: #8795a1;

    font-size: 10.5px;

    line-height: 1.4;
}


.qbit-stripe-pay {

    margin-top: 16px;
}


@media (max-width: 1099.98px) {

    .qbit-stripe-payment-layout {

        grid-template-columns:
            minmax(0, 1fr)
            210px;
    }

}


@media (max-width: 899.98px) {

    .qbit-stripe-payment-layout {

        grid-template-columns: 1fr;
    }


    .qbit-stripe-express-wrap {

        order: 2;
    }

}


@media (max-width: 575.98px) {

    .qbit-stripe-primary-card,
    .qbit-stripe-express-wrap {

        padding: 13px;
    }

}


/* =========================================================
   QBIT CHECKOUT — STEP 4 / ORDER
   ========================================================= */

.qbit-order-checkout {
    min-height: 520px;
}


.qbit-order-card {

    overflow: hidden;

    margin-bottom: 16px;

    border: 1px solid #dce5ec;

    border-radius: 10px;

    background: #fff;
}


.qbit-order-card-heading {

    display: flex;

    align-items: center;

    gap: 12px;

    padding: 15px 17px;

    border-bottom: 1px solid #e5ebf0;

    background: #fbfcfd;
}


.qbit-order-card-icon {

    display: flex;

    align-items: center;

    justify-content: center;

    flex: 0 0 34px;

    width: 34px;

    height: 34px;

    border-radius: 8px;

    background: #edf6fd;

    color: #0872cf;

    font-size: 13px;

    font-weight: 700;
}


.qbit-order-card-heading span {

    display: block;

    margin-bottom: 2px;

    color: #0872cf;

    font-size: 11.5px;

    font-weight: 700;

    letter-spacing: .045em;
}


.qbit-order-card-heading h2 {

    margin: 0;

    color: #173e67;

    font-size: 16px;

    line-height: 1.3;

    font-weight: 600;
}


.qbit-order-card-body {

    padding: 17px;
}


.qbit-order-address-grid,
.qbit-order-method-grid {

    display: grid;

    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 14px;
}


.qbit-order-info-block {

    min-width: 0;

    padding: 14px;

    border: 1px solid #e1e8ee;

    border-radius: 8px;

    background: #fff;
}


.qbit-order-label {

    display: block;

    margin-bottom: 8px;

    color: #708192;

    font-size: 11.5px;

    font-weight: 600;

    text-transform: uppercase;

    letter-spacing: .035em;
}


.qbit-order-value {

    color: #344b60;

    font-size: 13px;

    line-height: 1.55;
}


.qbit-order-method {

    display: flex;

    gap: 10px;

    align-items: flex-start;
}


.qbit-order-method-icon {

    display: flex;

    align-items: center;

    justify-content: center;

    flex: 0 0 29px;

    width: 29px;

    height: 29px;

    border-radius: 7px;

    background: #eef6fc;

    color: #0872cf;

    font-size: 12px;

    font-weight: 700;
}


.qbit-order-method strong,
.qbit-order-method small {

    display: block;
}


.qbit-order-method strong {

    margin-top: 1px;

    color: #1d405f;

    font-size: 13px;

    font-weight: 600;
}


.qbit-order-method small {

    margin-top: 3px;

    color: #788894;

    font-size: 11.5px;

    line-height: 1.4;
}


.qbit-order-products {

    padding: 0;
}


.qbit-order-products .card {

    margin: 0 !important;

    border: 0 !important;

    border-radius: 0 !important;

    box-shadow: none !important;
}


.qbit-order-products .card-header {

    display: none;
}


.qbit-order-products .card-body {

    padding: 15px 17px;
}


.qbit-order-remark {

    margin: 0;

    color: #485f72;

    font-size: 13px;

    line-height: 1.55;
}


.qbit-order-confirm-form {

    margin-top: 14px;
}


.qbit-order-confirm-form .form-check {

    margin-bottom: 8px;
}


.qbit-order-confirm-form label {

    color: #526777;

    font-size: 12px;

    line-height: 1.45;
}


.qbit-order-finalize {

    margin-top: 14px;
}


.qbit-order-finalize:disabled {

    cursor: not-allowed;

    opacity: .55;

    background: #7f98ae;

    border-color: #7f98ae;
}


.qbit-order-safety-note {

    margin-top: 12px;

    padding: 12px 13px;

    border: 1px solid #d9e7f2;

    border-radius: 8px;

    background: #f7fbfe;
}


.qbit-order-safety-note strong,
.qbit-order-safety-note span {

    display: block;
}


.qbit-order-safety-note strong {

    color: #27577f;

    font-size: 12px;

    font-weight: 600;
}


.qbit-order-safety-note span {

    margin-top: 3px;

    color: #718595;

    font-size: 11.5px;

    line-height: 1.45;
}


@media (max-width: 767.98px) {

    .qbit-order-address-grid,
    .qbit-order-method-grid {

        grid-template-columns: 1fr;
    }


    .qbit-order-card-heading {

        padding: 14px;
    }


    .qbit-order-card-body {

        padding: 14px;
    }

}


/* =========================================================
   QBIT CHECKOUT — STEP 4 / E1 PRODUCT + SHIPPING REFINEMENT
   ========================================================= */

.qbit-order-method-content {
    flex: 1 1 auto;
    min-width: 0;
}


.qbit-order-shipping-base {
    display: block;
    margin-top: 2px;
    color: #718496;
    font-size: 11.5px;
    line-height: 1.4;
}


.qbit-order-shipment-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    margin-top: 9px;
    padding-top: 8px;
    border-top: 1px solid #edf1f4;
    color: #425d73;
    font-size: 12px;
}


.qbit-order-shipment-row strong {
    margin: 0;
    color: #163f67;
    font-size: 12.5px;
    white-space: nowrap;
}


.qbit-order-payment-status {
    display: block;
    margin-top: 3px;
    color: #26734d;
    font-size: 11.5px;
    font-weight: 600;
}


.qbit-order-products {
    padding: 0;
}


.qbit-order-product {
    display: grid;
    grid-template-columns: 76px minmax(0, 1fr);
    gap: 14px;
    padding: 15px 17px;
    background: #fff;
}


.qbit-order-product + .qbit-order-product {
    border-top: 1px solid #e7edf2;
}


.qbit-order-product-image {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 76px;
    height: 76px;
    padding: 5px;
    border: 1px solid #e5ebf0;
    border-radius: 8px;
    background: #fff;
}


.qbit-order-product-image img {
    display: block;
    width: 64px;
    height: 64px;
    object-fit: contain;
}


.qbit-order-product-content {
    min-width: 0;
}


.qbit-order-product-top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
}


.qbit-order-product-title-wrap {
    min-width: 0;
}


.qbit-order-product-title-wrap h3 {
    margin: 0;
    color: #183f68;
    font-family: inherit !important;
    font-size: 13.5px !important;
    font-weight: 600 !important;
    line-height: 1.38 !important;
    letter-spacing: 0 !important;
}


.qbit-order-product-sku {
    display: block;
    margin-top: 5px;
    color: #758695;
    font-size: 11.5px;
    line-height: 1.35;
}


.qbit-order-product-total {
    flex: 0 0 auto;
    min-width: 94px;
    text-align: right;
}


.qbit-order-product-total small,
.qbit-order-product-total strong {
    display: block;
}


.qbit-order-product-total small {
    color: #81909c;
    font-size: 11.5px;
}


.qbit-order-product-total strong {
    margin-top: 2px;
    color: #163f67;
    font-size: 14px;
    font-weight: 700;
    white-space: nowrap;
}


.qbit-order-product-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 7px 20px;
    margin-top: 11px;
    padding-top: 10px;
    border-top: 1px solid #edf1f4;
}


.qbit-order-product-meta > span {
    display: flex;
    gap: 5px;
    align-items: baseline;
}


.qbit-order-product-meta small {
    color: #7a8a98;
    font-size: 11.5px;
}


.qbit-order-product-meta strong {
    color: #425c70;
    font-size: 12px;
    font-weight: 600;
}


.qbit-order-summary-shipping {
    margin-top: 12px;
    padding: 12px 13px;
    border: 1px solid #dce5ec;
    border-radius: 8px;
    background: #fff;
}


.qbit-order-summary-shipping > span {
    display: block;
    margin-bottom: 8px;
    color: #0872cf;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .04em;
}


.qbit-order-summary-shipping > div {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    padding: 5px 0;
}


.qbit-order-summary-shipping strong {
    color: #36546d;
    font-size: 12px;
    font-weight: 600;
}


.qbit-order-summary-shipping small {
    color: #163f67;
    font-size: 12px;
    white-space: nowrap;
}


@media (max-width: 767.98px) {

    .qbit-order-product {
        grid-template-columns: 58px minmax(0, 1fr);
        gap: 11px;
        padding: 13px;
    }


    .qbit-order-product-image {
        width: 58px;
        height: 58px;
    }


    .qbit-order-product-image img {
        width: 48px;
        height: 48px;
    }


    .qbit-order-product-top {
        display: block;
    }


    .qbit-order-product-total {
        margin-top: 8px;
        text-align: left;
    }


    .qbit-order-product-meta {
        gap: 6px 14px;
    }

}


/* =========================================================
   QBIT CHECKOUT — STEP 4 / E2B
   ADDRESS + AGGREGATED SHIPPING + PURCHASE TOTAL
   ========================================================= */

.qbit-order-address {
    display: flex;
    flex-direction: column;
    gap: 3px;
    color: #304c63;
    font-size: 13px;
    line-height: 1.4;
}


.qbit-order-address strong {
    color: #173f67;
    font-size: 13px;
    font-weight: 600;
}


.qbit-order-address-muted {
    margin-top: 2px;
    color: #61778a;
    font-size: 12px;
}


.qbit-order-shipping-total-row,
.qbit-order-shipping-eta-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
    margin-top: 9px;
    padding-top: 8px;
    border-top: 1px solid #edf1f4;
}


.qbit-order-shipping-total-row > span,
.qbit-order-shipping-eta-row > span {
    color: #64798b;
    font-size: 11.5px;
}


.qbit-order-shipping-total-row > strong {
    margin: 0;
    color: #163f67;
    font-size: 13px;
    font-weight: 700;
    white-space: nowrap;
}


.qbit-order-shipping-eta-row > strong {
    margin: 0;
    color: #5c7183;
    font-size: 11.5px;
    font-weight: 600;
    text-align: right;
}


.qbit-order-summary-eta {
    margin-top: 4px;
    padding-top: 8px !important;
    border-top: 1px solid #edf1f4;
}


.qbit-order-summary-eta small,
.qbit-order-summary-eta strong {
    font-size: 11.5px;
}


.qbit-order-summary-eta small {
    color: #778896;
}


.qbit-order-summary-eta strong {
    color: #526a7d;
    font-weight: 600;
}


.qbit-order-purchase-total {
    margin-top: 12px;
    padding: 13px;
    border: 1px solid #dce5ec;
    border-radius: 8px;
    background: #fff;
}


.qbit-order-purchase-total > span {
    display: block;
    margin-bottom: 9px;
    color: #0872cf;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .04em;
}


.qbit-order-purchase-total > div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}


.qbit-order-purchase-total small {
    color: #526a7d;
    font-size: 12px;
}


.qbit-order-purchase-total strong {
    color: #123e6b;
    font-size: 16px;
    font-weight: 700;
    white-space: nowrap;
}


.qbit-order-purchase-total p {
    margin: 5px 0 0;
    color: #82909c;
    font-size: 11.5px;
    line-height: 1.35;
}


/*
 * APEX genera .agb aunque card-body no tenga
 * ningún elemento visible.
 *
 * Solo ocultamos el contenedor realmente vacío.
 * Si existen términos, checkbox o contenido legal,
 * permanece visible.
 */
body.cl-order
.qbit-order-confirm-form
.agb:not(:has(.card-body > *)) {
    display: none !important;
}


@media (max-width: 767.98px) {

    .qbit-order-shipping-total-row,
    .qbit-order-shipping-eta-row {
        align-items: flex-start;
    }

}

/* QBIT E2B1 EMPTY AGB START */

/*
 * APEX genera el card .agb aunque en determinados estados
 * no contenga ninguna acción o contenido útil.
 *
 * Lo ocultamos solamente cuando NO contiene elementos
 * funcionales o legales interactivos.
 */
body.cl-order
.qbit-order-confirm-form
.agb:not(
    :has(
        input,
        textarea,
        select,
        button,
        a[href],
        label,
        .form-check,
        .alert,
        [role="alert"]
    )
) {
    display: none !important;
}

/* QBIT E2B1 EMPTY AGB END */

/* QBIT E2B2B EMPTY AGB START */

/*
 * Conservar AGB cuando realmente contiene
 * controles, enlaces o información legal.
 *
 * Ocultar únicamente el contenedor vacío
 * que APEX genera en determinados estados.
 */
body.cl-order
.qbit-order-confirm-form
.agb:not(
    :has(
        input,
        textarea,
        select,
        button,
        label,
        a[href],
        .form-check,
        .agbConfirmation:not(:empty),
        .alert,
        [role="alert"]
    )
) {
    display: none !important;
}

/* QBIT E2B2B EMPTY AGB END */

/* QBIT THANK YOU E4.2 START */

.qbit-thankyou {
    min-height: 560px;
    padding: 34px 0 54px;
    background: #f5f8fa;
}


.qbit-thankyou-hero {
    display: flex;
    align-items: center;
    gap: 18px;
    margin-bottom: 18px;
    padding: 22px 24px;
    border: 1px solid #d9e6df;
    border-radius: 12px;
    background: #fff;
}


.qbit-thankyou-success-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 48px;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: #e8f6ee;
    color: #238251;
    font-size: 23px;
    font-weight: 700;
}


.qbit-thankyou-hero-copy {
    flex: 1 1 auto;
    min-width: 0;
}


.qbit-thankyou-eyebrow {
    display: block;
    margin-bottom: 4px;
    color: #238251;
    font-size: 11.5px;
    font-weight: 700;
    letter-spacing: .055em;
}


.qbit-thankyou-hero h1 {
    margin: 0;
    color: #173e67;
    font-family: inherit !important;
    font-size: 24px !important;
    font-weight: 700 !important;
    line-height: 1.25 !important;
    letter-spacing: 0 !important;
}


.qbit-thankyou-hero p {
    max-width: 690px;
    margin: 6px 0 0;
    color: #607487;
    font-size: 13px;
    line-height: 1.5;
}


.qbit-thankyou-order-number {
    flex: 0 0 auto;
    min-width: 145px;
    padding-left: 20px;
    border-left: 1px solid #e1e8ed;
    text-align: right;
}


.qbit-thankyou-order-number small,
.qbit-thankyou-order-number strong {
    display: block;
}


.qbit-thankyou-order-number small {
    color: #788997;
    font-size: 11.5px;
}


.qbit-thankyou-order-number strong {
    margin-top: 3px;
    color: #123f6b;
    font-size: 20px;
    font-weight: 700;
}


.qbit-thankyou-notice {
    display: flex;
    align-items: flex-start;
    gap: 11px;
    margin-bottom: 18px;
    padding: 12px 14px;
    border-radius: 9px;
}


.qbit-thankyou-notice > span {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 24px;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    font-size: 12px;
    font-weight: 700;
}


.qbit-thankyou-notice strong,
.qbit-thankyou-notice p {
    display: block;
}


.qbit-thankyou-notice strong {
    color: #294b63;
    font-size: 12.5px;
    font-weight: 600;
}


.qbit-thankyou-notice p {
    margin: 2px 0 0;
    color: #657989;
    font-size: 11.5px;
    line-height: 1.4;
}


.qbit-thankyou-notice.is-success {
    border: 1px solid #d8e9df;
    background: #f4faf6;
}


.qbit-thankyou-notice.is-success > span {
    background: #dff2e7;
    color: #23784e;
}


.qbit-thankyou-notice.is-warning {
    border: 1px solid #eadfca;
    background: #fffaf1;
}


.qbit-thankyou-notice.is-warning > span {
    background: #f6e8cd;
    color: #8a6420;
}


.qbit-thankyou-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 330px;
    gap: 22px;
    align-items: start;
}


.qbit-thankyou-main {
    min-width: 0;
}


.qbit-thankyou-summary {
    min-width: 0;
}


.qbit-thankyou-summary-sticky {
    position: sticky;
    top: 18px;
}


.qbit-thankyou-status-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}


.qbit-thankyou-status-item {
    min-width: 0;
    padding: 13px;
    border: 1px solid #e2e9ee;
    border-radius: 8px;
    background: #fff;
}


.qbit-thankyou-status-item small,
.qbit-thankyou-status-item strong,
.qbit-thankyou-status-item span {
    display: block;
}


.qbit-thankyou-status-item small {
    color: #798a98;
    font-size: 11.5px;
}


.qbit-thankyou-status-item strong {
    margin-top: 4px;
    color: #264b68;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.4;
}


.qbit-thankyou-status-item span {
    margin-top: 4px;
    color: #748593;
    font-size: 11.5px;
    line-height: 1.35;
}


.qbit-thankyou-status-item
.qbit-thankyou-status-ok {
    color: #26734d;
    font-weight: 600;
}


.qbit-thankyou-summary-card {
    padding: 18px;
    border: 1px solid #dce5ec;
    border-radius: 10px;
    background: #fff;
}


.qbit-thankyou-summary-label {
    display: block;
    color: #0872cf;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .045em;
}


.qbit-thankyou-summary-card h2 {
    margin: 4px 0 15px;
    color: #173f67;
    font-family: inherit !important;
    font-size: 17px !important;
    font-weight: 700 !important;
    line-height: 1.3 !important;
}


.qbit-thankyou-summary-row {
    display: flex;
    justify-content: space-between;
    gap: 14px;
    padding: 7px 0;
}


.qbit-thankyou-summary-row span {
    color: #687c8d;
    font-size: 12px;
}


.qbit-thankyou-summary-row strong {
    color: #36546d;
    font-size: 12px;
    font-weight: 600;
    white-space: nowrap;
}


.qbit-thankyou-summary-total {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    margin-top: 8px;
    padding-top: 13px;
    border-top: 1px solid #e4eaf0;
}


.qbit-thankyou-summary-total span {
    color: #36536b;
    font-size: 13px;
    font-weight: 600;
}


.qbit-thankyou-summary-total strong {
    color: #123f6b;
    font-size: 18px;
    font-weight: 700;
    white-space: nowrap;
}


.qbit-thankyou-paid-badge {
    display: flex;
    align-items: center;
    gap: 7px;
    margin-top: 14px;
    padding: 9px 10px;
    border-radius: 7px;
    background: #edf8f1;
    color: #26734d;
    font-size: 11.5px;
    font-weight: 600;
}


.qbit-thankyou-paid-badge span {
    font-size: 12px;
}


.qbit-thankyou-trust {
    margin-top: 12px;
    padding: 12px 13px;
    border: 1px solid #d9e7f2;
    border-radius: 8px;
    background: #f7fbfe;
}


.qbit-thankyou-trust strong,
.qbit-thankyou-trust span {
    display: block;
}


.qbit-thankyou-trust strong {
    color: #27577f;
    font-size: 12px;
    font-weight: 600;
}


.qbit-thankyou-trust span {
    margin-top: 3px;
    color: #718595;
    font-size: 11.5px;
    line-height: 1.45;
}


.qbit-thankyou-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 18px;
}


.qbit-thankyou-primary,
.qbit-thankyou-secondary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 43px;
    padding: 10px 17px;
    border-radius: 8px;
    font-size: 12.5px;
    font-weight: 600;
    line-height: 1.2;
    text-decoration: none !important;
    transition:
        background-color .18s ease,
        border-color .18s ease,
        color .18s ease;
}


.qbit-thankyou-primary {
    gap: 8px;
    border: 1px solid #0872cf;
    background: #0872cf;
    color: #fff !important;
}


.qbit-thankyou-primary:hover {
    border-color: #075eaa;
    background: #075eaa;
}


.qbit-thankyou-secondary {
    border: 1px solid #ccd8e1;
    background: #fff;
    color: #315b7d !important;
}


.qbit-thankyou-secondary:hover {
    border-color: #9eb4c5;
    background: #f7fafc;
}


body.cl-thankyou
#thankyouPage {
    display: none !important;
}


@media (max-width: 991.98px) {

    .qbit-thankyou-layout {
        grid-template-columns: 1fr;
    }


    .qbit-thankyou-summary-sticky {
        position: static;
    }


    .qbit-thankyou-summary {
        order: -1;
    }

}


@media (max-width: 767.98px) {

    .qbit-thankyou {
        padding: 22px 0 38px;
    }


    .qbit-thankyou-hero {
        align-items: flex-start;
        padding: 17px;
    }


    .qbit-thankyou-success-icon {
        flex-basis: 40px;
        width: 40px;
        height: 40px;
        font-size: 19px;
    }


    .qbit-thankyou-hero h1 {
        font-size: 20px !important;
    }


    .qbit-thankyou-order-number {
        display: none;
    }


    .qbit-thankyou-status-grid {
        grid-template-columns: 1fr;
    }


    .qbit-thankyou-actions {
        display: grid;
        grid-template-columns: 1fr;
    }


    .qbit-thankyou-primary,
    .qbit-thankyou-secondary {
        width: 100%;
    }

}

/* QBIT THANK YOU E4.2 END */

/* QBIT THANK YOU E4.4 PRODUCT TITLE START */

.qbit-thankyou
.qbit-order-product-title-wrap h3 {
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    line-clamp: 2;
}

/* QBIT THANK YOU E4.4 PRODUCT TITLE END */

/* =========================================================
   QBIT 4.11U — EDICION EN EL MISMO CUERPO
   ========================================================= */

body.cl-user #qbitBillingSummary[hidden],
body.cl-user #qbitBillingEditPanel[hidden] {
    display: none !important;
}

body.cl-user
.qbit-address-card
#qbitBillingEditPanel {
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

body.cl-user
.qbit-address-card
#qbitBillingEditPanel
.qbit-address-edit-panel-head {
    display: none !important;
}

body.cl-user
.qbit-address-card
#qbitBillingEditPanel
.qbit-address-edit-actions {
    margin-top: 12px !important;
}


/* =========================================================
   QBIT 4.11Y — EDICION EN EL MISMO GRID VISUAL
   ========================================================= */

body.cl-user #qbitBillingSummary[hidden],
body.cl-user #qbitBillingEditPanel[hidden] {
    display: none !important;
}

body.cl-user .qbit-address-edit-body {
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

body.cl-user .qbit-address-edit-body
.qbit-mx-address-grid {
    margin: 0 !important;
}

body.cl-user .qbit-address-edit-body
.qbit-address-edit-actions {
    margin-top: 12px !important;
    padding-top: 12px !important;
    border-top: 1px solid #e3e9ee !important;
}


/* QBIT CHECKOUT 4.12F START */
/* =========================================================
   CAMPOS DE EDICION — MAS REDONDEADOS Y MAS CHICOS
   SOLO VISUAL / NO TOCA LOGICA
   ========================================================= */

#qbitBillingEditPanel input[type="text"],
#qbitBillingEditPanel input[type="email"],
#qbitBillingEditPanel input[type="tel"],
#qbitBillingEditPanel select,
#qbitBillingEditPanel textarea {
    min-height: 40px;
    height: 40px;
    padding: 8px 12px;
    font-size: 14px;
    line-height: 1.2;
    border-radius: 10px;
    box-sizing: border-box;
}

#qbitBillingEditPanel textarea {
    min-height: 58px;
    height: 58px;
    padding-top: 10px;
    padding-bottom: 10px;
    resize: vertical;
}

#qbitBillingEditPanel .form-label,
#qbitBillingEditPanel label {
    font-size: 12px;
}

#qbitBillingEditPanel .form-control,
#qbitBillingEditPanel .form-select {
    border-radius: 10px;
}

#qbitBillingEditPanel .btn,
#qbitBillingEditPanel button {
    border-radius: 10px;
}

#qbitBillingEditPanel .row,
#qbitBillingEditPanel .form-group,
#qbitBillingEditPanel .form-floating {
    margin-bottom: 10px;
}

/* QBIT CHECKOUT 4.12F END */


/* QBIT CHECKOUT 4.12I START */
/* =========================================================
   CFDI DENTRO DEL MISMO PANEL DE EDICION
   SOLO PRESENTACION
   ========================================================= */

#qbitBillingEditPanel .qbit-billing-inline-fiscal {
    margin-top: 16px;
    padding-top: 15px;
    border-top: 1px solid #dfe6ec;
}

#qbitBillingEditPanel
.qbit-billing-inline-fiscal
.qbit-fiscal-checkout {
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
}

#qbitBillingEditPanel
.qbit-billing-inline-fiscal
.form-check {
    margin: 0 !important;
}

#qbitBillingEditPanel
.qbit-billing-inline-fiscal
.form-check-label {
    font-size: 13px !important;
    font-weight: 600 !important;
}

#qbitBillingEditPanel
.qbit-billing-inline-fiscal
[data-qbit-fiscal-fields] {
    margin-top: 10px !important;
}

#qbitBillingEditPanel
.qbit-billing-inline-fiscal
.form-select {
    border-radius: 10px !important;
}

#qbitBillingEditPanel
.qbit-billing-inline-fiscal
.form-label {
    font-size: 12px !important;
}

/* QBIT CHECKOUT 4.12I END */


/* QBIT FORGOT PASSWORD 4.15B START */
/* =========================================================
   QBIT — RECUPERACION DE CONTRASEÑA
   ========================================================= */

body.cl-forgotpwd {
    background: #f4f7fa;
}

body.cl-forgotpwd .qbit-forgot-page {
    width: 100%;
    padding: 46px 18px 60px;
}

body.cl-forgotpwd .qbit-forgot-shell {
    width: 100%;
    max-width: 620px;
    margin: 0 auto;
}

body.cl-forgotpwd .qbit-forgot-card {
    overflow: hidden;
    background: #fff;
    border: 1px solid #dce6ee;
    border-radius: 14px;
    box-shadow: 0 7px 28px rgba(21, 63, 112, .06);
}

body.cl-forgotpwd .qbit-forgot-card-head {
    display: flex;
    align-items: flex-start;
    gap: 15px;
    padding: 28px 30px 24px;
    border-bottom: 1px solid #e5edf3;
}

body.cl-forgotpwd .qbit-forgot-icon {
    display: flex;
    flex: 0 0 44px;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border-radius: 11px;
    background: #eef7ff;
    color: #0875d1;
}

body.cl-forgotpwd .qbit-forgot-eyebrow {
    display: block;
    margin: 1px 0 4px;
    color: #0875d1;
    font-size: 11px;
    line-height: 15px;
    font-weight: 700;
    letter-spacing: .5px;
}

body.cl-forgotpwd .qbit-forgot-card-head h1 {
    margin: 0;
    color: #123f6b;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 24px;
    line-height: 30px;
    font-weight: 700;
}

body.cl-forgotpwd .qbit-forgot-card-head p {
    margin: 5px 0 0;
    color: #687e91;
    font-size: 13px;
    line-height: 19px;
}

body.cl-forgotpwd .qbit-forgot-card-body {
    padding: 28px 30px 30px;
}

body.cl-forgotpwd .qbit-forgot-form-intro {
    margin: 0 0 20px;
    color: #526b80;
    font-size: 13px;
    line-height: 20px;
}

body.cl-forgotpwd .qbit-forgot-field {
    margin: 0 0 15px;
}

body.cl-forgotpwd .qbit-forgot-field label {
    display: block;
    margin: 0 0 6px;
    color: #456178;
    font-size: 12px;
    line-height: 17px;
    font-weight: 600;
}

body.cl-forgotpwd .qbit-forgot-field .form-control {
    width: 100%;
    min-height: 44px;
    height: 44px;
    padding: 9px 12px;
    border: 1px solid #ccd9e3;
    border-radius: 9px;
    background: #fff;
    color: #173f67;
    font-size: 13.5px;
    line-height: 20px;
    box-shadow: none;
}

body.cl-forgotpwd .qbit-forgot-field .form-control:hover {
    border-color: #adbfcd;
}

body.cl-forgotpwd .qbit-forgot-field .form-control:focus {
    border-color: #78afe1;
    outline: 0;
    box-shadow: 0 0 0 3px rgba(8, 117, 209, .09);
}

body.cl-forgotpwd .qbit-forgot-primary-button,
body.cl-forgotpwd .qbit-forgot-primary-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 42px;
    padding: 10px 18px;
    border: 0;
    border-radius: 9px;
    background: #0875d1;
    color: #fff !important;
    font-size: 13px;
    line-height: 18px;
    font-weight: 700;
    text-align: center;
    text-decoration: none !important;
    cursor: pointer;
}

body.cl-forgotpwd .qbit-forgot-primary-button:hover,
body.cl-forgotpwd .qbit-forgot-primary-link:hover {
    background: #0668bb;
}

body.cl-forgotpwd .qbit-forgot-form
.qbit-forgot-primary-button {
    width: 100%;
    margin-top: 3px;
}

body.cl-forgotpwd .qbit-forgot-security-note {
    margin-top: 17px;
    padding-top: 15px;
    border-top: 1px solid #e5edf3;
    color: #7b8e9e;
    font-size: 11.5px;
    line-height: 18px;
}

body.cl-forgotpwd .qbit-forgot-message {
    margin-bottom: 20px;
    padding: 15px 17px;
    border: 1px solid #dce7ef;
    border-radius: 9px;
    background: #f8fafc;
}

body.cl-forgotpwd .qbit-forgot-message strong,
body.cl-forgotpwd .qbit-forgot-message span {
    display: block;
}

body.cl-forgotpwd .qbit-forgot-message strong {
    margin-bottom: 4px;
    color: #173f67;
    font-size: 13px;
    line-height: 18px;
}

body.cl-forgotpwd .qbit-forgot-message span {
    color: #5e7589;
    font-size: 12px;
    line-height: 19px;
}

body.cl-forgotpwd .qbit-forgot-message-success {
    border-color: #cce7d7;
    background: #f3fbf6;
}

body.cl-forgotpwd .qbit-forgot-message-success strong {
    color: #187447;
}

body.cl-forgotpwd .qbit-forgot-message-error {
    border-color: #efd2d2;
    background: #fff7f7;
}

body.cl-forgotpwd .qbit-forgot-message-error strong {
    color: #a73e3e;
}

body.cl-forgotpwd .qbit-forgot-message-info {
    border-color: #d3e6f7;
    background: #f5faff;
}

body.cl-forgotpwd .qbit-forgot-help {
    margin-top: 14px;
    padding: 17px 20px;
    border: 1px solid #dce6ee;
    border-radius: 10px;
    background: #fff;
    color: #6b8092;
    font-size: 11.5px;
    line-height: 18px;
    text-align: center;
}

body.cl-forgotpwd .qbit-forgot-help strong {
    display: block;
    color: #173f67;
    font-size: 12.5px;
}

body.cl-forgotpwd .qbit-forgot-help a {
    color: #0875d1;
    text-decoration: none;
}

body.cl-forgotpwd .qbit-forgot-help div {
    margin-top: 4px;
}

@media (max-width: 575.98px) {

    body.cl-forgotpwd .qbit-forgot-page {
        padding: 24px 12px 40px;
    }

    body.cl-forgotpwd .qbit-forgot-card-head {
        padding: 22px 20px 19px;
    }

    body.cl-forgotpwd .qbit-forgot-card-body {
        padding: 22px 20px 24px;
    }

    body.cl-forgotpwd .qbit-forgot-card-head h1 {
        font-size: 21px;
        line-height: 27px;
    }

    body.cl-forgotpwd .qbit-forgot-icon {
        flex-basis: 40px;
        width: 40px;
        height: 40px;
    }
}

/* QBIT FORGOT PASSWORD 4.15B END */


/* QBIT ACCOUNT DASHBOARD 4.18B START */
/* =========================================================
   MI CUENTA — DASHBOARD
   ========================================================= */

body.cl-account {
    background: #f4f7fa;
}

body.cl-account .qbit-account-page {
    padding: 36px 18px 54px;
    font-family: Arial, Helvetica, sans-serif;
}

body.cl-account .qbit-account-container {
    width: 100%;
    max-width: 1180px;
    margin: 0 auto;
}


/* =========================================================
   CABECERA
   ========================================================= */

body.cl-account .qbit-account-page-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 24px;

    margin-bottom: 22px;
}

body.cl-account .qbit-account-page-eyebrow {
    display: block;

    margin-bottom: 4px;

    color: #0875d1;

    font-size: 11px;
    line-height: 15px;
    font-weight: 700;

    letter-spacing: .5px;
}

body.cl-account .qbit-account-page-head h1 {
    margin: 0;

    color: #123f6b;

    font-family: Arial, Helvetica, sans-serif !important;
    font-size: 28px;
    line-height: 34px;
    font-weight: 700;
}

body.cl-account .qbit-account-page-head p {
    margin: 5px 0 0;

    color: #6c8091;

    font-size: 13px;
    line-height: 20px;
}


/* =========================================================
   GRID
   ========================================================= */

body.cl-account .qbit-account-dashboard-grid {
    display: grid;

    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 14px;
}


/* =========================================================
   TARJETAS
   ========================================================= */

body.cl-account .qbit-account-dashboard-card {
    position: relative;

    display: grid;

    grid-template-columns:
        46px
        minmax(0, 1fr);

    column-gap: 14px;

    min-height: 145px;

    padding: 20px;

    border: 1px solid #dce6ee;
    border-radius: 12px;

    background: #fff;

    color: #294b67 !important;

    text-decoration: none !important;

    transition:
        border-color .15s ease,
        box-shadow .15s ease,
        transform .15s ease;
}

body.cl-account .qbit-account-dashboard-card:hover,
body.cl-account .qbit-account-dashboard-card:focus {
    border-color: #aaccea;

    box-shadow:
        0 8px 24px rgba(22, 65, 105, .08);

    transform: translateY(-1px);

    outline: none;
}


/* icono */

body.cl-account .qbit-account-dashboard-icon {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 46px;
    height: 46px;

    border-radius: 11px;

    background: #eef7ff;

    color: #0875d1;
}

body.cl-account .qbit-account-dashboard-icon svg {
    width: 23px;
    height: 23px;
}


/* textos */

body.cl-account .qbit-account-dashboard-copy {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

body.cl-account .qbit-account-dashboard-copy > strong {
    color: #173f67;

    font-size: 15px;
    line-height: 20px;
    font-weight: 700;
}

body.cl-account .qbit-account-dashboard-copy > small {
    margin-top: 3px;

    color: #748797;

    font-size: 11.5px;
    line-height: 17px;
}

body.cl-account .qbit-account-dashboard-meta {
    margin-top: 13px;

    color: #536c80;

    font-size: 12px;
    line-height: 17px;
    font-weight: 600;
}

body.cl-account .qbit-account-dashboard-action {
    grid-column: 2;

    align-self: end;

    margin-top: 12px;

    color: #0875d1;

    font-size: 12px;
    line-height: 17px;
    font-weight: 700;
}


/* =========================================================
   MENU INTERNO
   ========================================================= */

body.cl-account .qbit-account-nav {
    position: relative;
}

body.cl-account .qbit-account-nav-button {
    min-height: 40px;

    padding: 8px 13px;

    border: 1px solid #cfdce6;
    border-radius: 8px;

    background: #fff;

    color: #31536e;

    font-size: 12px;
    line-height: 17px;
    font-weight: 600;
}

body.cl-account .qbit-account-nav-button:hover,
body.cl-account .qbit-account-nav-button:focus,
body.cl-account .qbit-account-nav-button.show {
    border-color: #8eb9dc;

    background: #f5faff;

    color: #0875d1;

    outline: none;
}

body.cl-account .qbit-account-nav-menu {
    width: 245px;

    padding: 7px;

    border: 1px solid #dbe5ec !important;
    border-radius: 10px !important;

    background: #fff !important;

    box-shadow:
        0 12px 30px rgba(19, 57, 91, .13) !important;
}

body.cl-account .qbit-account-nav-item {
    display: block;

    padding: 9px 10px;

    border-radius: 7px;

    color: #49647a !important;

    font-size: 12px;
    line-height: 17px;

    text-decoration: none !important;
}

body.cl-account .qbit-account-nav-item:hover,
body.cl-account .qbit-account-nav-item:focus {
    background: #f1f7fc;

    color: #0875d1 !important;
}

body.cl-account .qbit-account-nav-item.active {
    background: #eaf5fd;

    color: #0875d1 !important;

    font-weight: 700;
}

body.cl-account .qbit-account-nav-divider {
    height: 1px;

    margin: 6px 5px;

    background: #e5ecf1;
}


/* =========================================================
   FOOTER CUENTA
   ========================================================= */

body.cl-account .qbit-account-dashboard-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;

    margin-top: 18px;

    padding: 17px 18px;

    border: 1px solid #dce6ee;
    border-radius: 10px;

    background: #fff;
}

body.cl-account .qbit-account-dashboard-footer > div:first-child {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

body.cl-account .qbit-account-dashboard-footer strong {
    color: #31536e;

    font-size: 12px;
    line-height: 17px;
}

body.cl-account .qbit-account-dashboard-footer span {
    overflow: hidden;

    margin-top: 2px;

    color: #8595a2;

    font-size: 11px;
    line-height: 16px;

    text-overflow: ellipsis;
    white-space: nowrap;
}

body.cl-account .qbit-account-dashboard-footer-actions {
    display: flex;
    align-items: center;
    gap: 8px;
}

body.cl-account .qbit-account-logout-button,
body.cl-account .qbit-account-delete-button {
    min-height: 36px;

    padding: 8px 13px;

    border-radius: 8px;

    font-size: 11.5px;
    line-height: 17px;
    font-weight: 600;

    text-decoration: none !important;
}

body.cl-account .qbit-account-logout-button {
    border: 1px solid #cbdbe7;

    background: #fff;

    color: #315a7a !important;
}

body.cl-account .qbit-account-logout-button:hover {
    border-color: #8fb7d7;

    background: #f4faff;

    color: #0875d1 !important;
}

body.cl-account .qbit-account-delete-button {
    border: 1px solid #ead4d4;

    background: #fff;

    color: #a14b4b;
}

body.cl-account .qbit-account-delete-button:hover {
    background: #fff5f5;
}


/* =========================================================
   EVITAR ESTILO APEX EN ESTE DASHBOARD
   ========================================================= */

body.cl-account .qbit-account-page h1,
body.cl-account .qbit-account-page h2,
body.cl-account .qbit-account-page h3,
body.cl-account .qbit-account-page h4 {
    font-family: Arial, Helvetica, sans-serif !important;
}


/* =========================================================
   RESPONSIVE
   ========================================================= */

@media (max-width: 767.98px) {

    body.cl-account .qbit-account-page {
        padding: 24px 12px 40px;
    }

    body.cl-account .qbit-account-page-head {
        align-items: stretch;
        flex-direction: column;
    }

    body.cl-account .qbit-account-dashboard-grid {
        grid-template-columns: 1fr;
    }

    body.cl-account .qbit-account-page-menu,
    body.cl-account .qbit-account-nav-button {
        width: 100%;
    }

    body.cl-account .qbit-account-nav-menu {
        width: 100%;
    }

    body.cl-account .qbit-account-dashboard-footer {
        align-items: stretch;
        flex-direction: column;
    }

    body.cl-account .qbit-account-dashboard-footer-actions {
        justify-content: flex-end;
    }

}

@media (max-width: 479.98px) {

    body.cl-account .qbit-account-dashboard-card {
        min-height: 132px;

        padding: 16px;
    }

    body.cl-account .qbit-account-dashboard-footer-actions {
        align-items: stretch;
        flex-direction: column;
    }

    body.cl-account .qbit-account-logout-button,
    body.cl-account .qbit-account-delete-button {
        width: 100%;

        text-align: center;
    }

}

/* QBIT ACCOUNT DASHBOARD 4.18B END */


/* QBIT ACCOUNT ORDERS 4.19B START */
/* =========================================================
   MI CUENTA — HISTORIAL DE PEDIDOS
   ========================================================= */

body.cl-account_order {
    background: #f4f7fa;
}

body.cl-account_order
.qbit-account-orders-page {
    padding: 36px 18px 54px;
    font-family: Arial, Helvetica, sans-serif;
}

body.cl-account_order
.qbit-account-container {
    width: 100%;
    max-width: 1180px;
    margin: 0 auto;
}


/* reutilizar cabecera account */

body.cl-account_order
.qbit-account-page-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 22px;
}

body.cl-account_order
.qbit-account-page-eyebrow {
    display: block;
    margin-bottom: 4px;
    color: #0875d1;
    font-size: 11px;
    line-height: 15px;
    font-weight: 700;
    letter-spacing: .5px;
}

body.cl-account_order
.qbit-account-page-head h1 {
    margin: 0;
    color: #123f6b;
    font-family: Arial, Helvetica, sans-serif !important;
    font-size: 28px;
    line-height: 34px;
    font-weight: 700;
}

body.cl-account_order
.qbit-account-page-head p {
    margin: 5px 0 0;
    color: #6c8091;
    font-size: 13px;
    line-height: 20px;
}


/* lista */

body.cl-account_order
.qbit-account-orders-list {
    display: grid;
    gap: 14px;
}


/* tarjeta */

body.cl-account_order
.qbit-account-order-card {
    overflow: hidden;

    border: 1px solid #dce6ee;
    border-radius: 12px;

    background: #fff;

    box-shadow:
        0 4px 16px rgba(22, 65, 105, .035);
}


/* header tarjeta */

body.cl-account_order
.qbit-account-order-card-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;

    padding: 17px 19px;

    border-bottom: 1px solid #e7edf2;

    background: #fbfcfd;
}

body.cl-account_order
.qbit-account-order-label {
    display: block;

    margin-bottom: 2px;

    color: #8293a1;

    font-size: 10px;
    line-height: 14px;
    font-weight: 700;
    letter-spacing: .5px;
}

body.cl-account_order
.qbit-account-order-number {
    color: #153f70;

    font-size: 17px;
    line-height: 22px;
    font-weight: 700;
}


/* status */

body.cl-account_order
.qbit-account-order-status {
    display: inline-flex;
    align-items: center;

    min-height: 28px;

    padding: 5px 10px;

    border-radius: 14px;

    font-size: 11px;
    line-height: 16px;
    font-weight: 700;
}

body.cl-account_order
.qbit-account-order-status.is-shipped {
    background: #eef9f3;
    color: #18784a;
}

body.cl-account_order
.qbit-account-order-status.is-pending {
    background: #fff8e9;
    color: #9a6b12;
}

body.cl-account_order
.qbit-account-order-status.is-canceled {
    background: #fff1f1;
    color: #a64949;
}


/* meta */

body.cl-account_order
.qbit-account-order-meta {
    display: grid;

    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 12px;

    padding: 15px 19px;

    border-bottom: 1px solid #edf1f4;
}

body.cl-account_order
.qbit-account-order-meta > div {
    min-width: 0;
}

body.cl-account_order
.qbit-account-order-meta span {
    display: block;

    margin-bottom: 3px;

    color: #8798a5;

    font-size: 10.5px;
    line-height: 15px;
}

body.cl-account_order
.qbit-account-order-meta strong {
    color: #3e5b72;

    font-size: 12.5px;
    line-height: 18px;
    font-weight: 600;
}


/* productos */

body.cl-account_order
.qbit-account-order-products {
    padding: 16px 19px 17px;
}

body.cl-account_order
.qbit-account-order-products-title {
    margin-bottom: 10px;

    color: #31536e;

    font-size: 11px;
    line-height: 16px;
    font-weight: 700;

    text-transform: uppercase;
    letter-spacing: .4px;
}

body.cl-account_order
.qbit-account-order-products ul {
    margin: 0;
    padding: 0;

    list-style: none;
}

body.cl-account_order
.qbit-account-order-products li {
    padding: 8px 0;

    border-bottom: 1px solid #edf1f4;
}

body.cl-account_order
.qbit-account-order-products li:last-child {
    border-bottom: 0;
}

body.cl-account_order
.qbit-account-order-product-main {
    display: flex;
    align-items: flex-start;
    gap: 7px;

    color: #466278;

    font-size: 12px;
    line-height: 18px;
}

body.cl-account_order
.qbit-account-order-qty {
    flex: 0 0 auto;

    color: #718696;

    font-weight: 700;
}

body.cl-account_order
.qbit-account-order-product-main a {
    color: #0875d1 !important;

    font-weight: 600;

    text-decoration: none !important;
}

body.cl-account_order
.qbit-account-order-product-main a:hover {
    text-decoration: underline !important;
}

body.cl-account_order
.qbit-account-order-products small {
    display: block;

    margin-top: 3px;
    margin-left: 24px;

    color: #8b9aa6;

    font-size: 10.5px;
    line-height: 15px;
}


/* tracking */

body.cl-account_order
.qbit-account-order-track {
    padding: 0 19px 17px;

    text-align: right;
}

body.cl-account_order
.qbit-account-order-track a {
    color: #0875d1 !important;

    font-size: 12px;
    line-height: 17px;
    font-weight: 700;

    text-decoration: none !important;
}


/* vacío */

body.cl-account_order
.qbit-account-orders-empty {
    padding: 34px 22px;

    border: 1px solid #dce6ee;
    border-radius: 12px;

    background: #fff;

    text-align: center;
}

body.cl-account_order
.qbit-account-orders-empty strong,
body.cl-account_order
.qbit-account-orders-empty span {
    display: block;
}

body.cl-account_order
.qbit-account-orders-empty strong {
    color: #173f67;

    font-size: 15px;
    line-height: 20px;
}

body.cl-account_order
.qbit-account-orders-empty span {
    margin-top: 4px;

    color: #75899a;

    font-size: 12px;
    line-height: 18px;
}


/* locator */

body.cl-account_order
.qbit-account-orders-locator {
    margin-top: 18px;
}


/* menú interno también aquí */

body.cl-account_order
.qbit-account-nav-button {
    min-height: 40px;

    padding: 8px 13px;

    border: 1px solid #cfdce6;
    border-radius: 8px;

    background: #fff;

    color: #31536e;

    font-size: 12px;
    line-height: 17px;
    font-weight: 600;
}

body.cl-account_order
.qbit-account-nav-button:hover,
body.cl-account_order
.qbit-account-nav-button:focus,
body.cl-account_order
.qbit-account-nav-button.show {
    border-color: #8eb9dc;
    background: #f5faff;
    color: #0875d1;
    outline: none;
}

body.cl-account_order
.qbit-account-nav-menu {
    width: 245px;

    padding: 7px;

    border: 1px solid #dbe5ec !important;
    border-radius: 10px !important;

    background: #fff !important;

    box-shadow:
        0 12px 30px rgba(19, 57, 91, .13) !important;
}

body.cl-account_order
.qbit-account-nav-item {
    display: block;

    padding: 9px 10px;

    border-radius: 7px;

    color: #49647a !important;

    font-size: 12px;
    line-height: 17px;

    text-decoration: none !important;
}

body.cl-account_order
.qbit-account-nav-item:hover,
body.cl-account_order
.qbit-account-nav-item:focus {
    background: #f1f7fc;
    color: #0875d1 !important;
}

body.cl-account_order
.qbit-account-nav-item.active {
    background: #eaf5fd;
    color: #0875d1 !important;
    font-weight: 700;
}

body.cl-account_order
.qbit-account-nav-divider {
    height: 1px;
    margin: 6px 5px;
    background: #e5ecf1;
}


/* responsive */

@media (max-width: 767.98px) {

    body.cl-account_order
    .qbit-account-orders-page {
        padding: 24px 12px 40px;
    }

    body.cl-account_order
    .qbit-account-page-head {
        align-items: stretch;
        flex-direction: column;
    }

    body.cl-account_order
    .qbit-account-page-menu,
    body.cl-account_order
    .qbit-account-nav-button {
        width: 100%;
    }

    body.cl-account_order
    .qbit-account-nav-menu {
        width: 100%;
    }

    body.cl-account_order
    .qbit-account-order-meta {
        grid-template-columns: 1fr;
    }

}

@media (max-width: 479.98px) {

    body.cl-account_order
    .qbit-account-order-card-head {
        align-items: flex-start;
        flex-direction: column;
    }

}

/* QBIT ACCOUNT ORDERS 4.19B END */


/* QBIT TYPOGRAPHY ORDERS 4.20B TEST START */
/* =========================================================
   PRUEBA DE ESCALA TIPOGRAFICA QBIT
   SOLO: MI CUENTA > MIS PEDIDOS
   ========================================================= */

body.cl-account_order {

    --qbit-font-caption: 12.5px;
    --qbit-font-small: 13px;
    --qbit-font-body: 14px;
    --qbit-font-body-large: 14.5px;
    --qbit-font-card-title: 16px;
    --qbit-font-order-number: 19px;
    --qbit-font-page-title: 30px;

}


/* ---------------------------------------------------------
   CABECERA
   --------------------------------------------------------- */

body.cl-account_order
.qbit-account-page-eyebrow {

    font-size:
        var(--qbit-font-caption) !important;

    line-height:
        17px !important;
}


body.cl-account_order
.qbit-account-page-head h1 {

    font-size:
        var(--qbit-font-page-title) !important;

    line-height:
        37px !important;
}


body.cl-account_order
.qbit-account-page-head p {

    font-size:
        var(--qbit-font-body-large) !important;

    line-height:
        22px !important;
}


/* ---------------------------------------------------------
   PEDIDO / NUMERO
   --------------------------------------------------------- */

body.cl-account_order
.qbit-account-order-label {

    font-size:
        var(--qbit-font-caption) !important;

    line-height:
        17px !important;
}


body.cl-account_order
.qbit-account-order-number {

    font-size:
        var(--qbit-font-order-number) !important;

    line-height:
        25px !important;
}


/* ---------------------------------------------------------
   ESTADO
   --------------------------------------------------------- */

body.cl-account_order
.qbit-account-order-status {

    min-height:
        30px;

    padding:
        6px 11px;

    font-size:
        var(--qbit-font-caption) !important;

    line-height:
        18px !important;
}


/* ---------------------------------------------------------
   FECHA / ENTREGA A
   --------------------------------------------------------- */

body.cl-account_order
.qbit-account-order-meta span {

    margin-bottom:
        4px;

    font-size:
        var(--qbit-font-caption) !important;

    line-height:
        17px !important;
}


body.cl-account_order
.qbit-account-order-meta strong {

    font-size:
        var(--qbit-font-body) !important;

    line-height:
        20px !important;
}


/* ---------------------------------------------------------
   PRODUCTOS
   --------------------------------------------------------- */

body.cl-account_order
.qbit-account-order-products-title {

    font-size:
        var(--qbit-font-caption) !important;

    line-height:
        18px !important;
}


body.cl-account_order
.qbit-account-order-product-main {

    gap:
        8px;

    font-size:
        var(--qbit-font-body) !important;

    line-height:
        21px !important;
}


body.cl-account_order
.qbit-account-order-qty {

    font-size:
        13.5px !important;

    line-height:
        21px !important;
}


body.cl-account_order
.qbit-account-order-product-main a,

body.cl-account_order
.qbit-account-order-product-main > span {

    font-size:
        var(--qbit-font-body) !important;

    line-height:
        21px !important;
}


body.cl-account_order
.qbit-account-order-products small {

    font-size:
        12px !important;

    line-height:
        17px !important;
}


/* ---------------------------------------------------------
   TRACKING
   --------------------------------------------------------- */

body.cl-account_order
.qbit-account-order-track a {

    font-size:
        13.5px !important;

    line-height:
        19px !important;
}


/* ---------------------------------------------------------
   MENU NAVEGAR POR MI CUENTA
   --------------------------------------------------------- */

body.cl-account_order
.qbit-account-nav-button {

    min-height:
        42px;

    padding:
        9px 14px;

    font-size:
        13.5px !important;

    line-height:
        19px !important;
}


body.cl-account_order
.qbit-account-nav-item {

    padding:
        10px 11px;

    font-size:
        13.5px !important;

    line-height:
        19px !important;
}


/* ---------------------------------------------------------
   AJUSTE DE ESPACIADO POR LA NUEVA ESCALA
   --------------------------------------------------------- */

body.cl-account_order
.qbit-account-order-card-head {

    padding:
        18px 20px;
}


body.cl-account_order
.qbit-account-order-meta {

    padding:
        17px 20px;
}


body.cl-account_order
.qbit-account-order-products {

    padding:
        17px 20px 19px;
}


body.cl-account_order
.qbit-account-order-products li {

    padding:
        9px 0;
}


/* QBIT TYPOGRAPHY ORDERS 4.20B TEST END */


/* QBIT ACCOUNT USER 4.21B START */
/* =========================================================
   MI CUENTA — DATOS Y DIRECCIONES
   ESCALA TIPOGRAFICA QBIT APROBADA
   ========================================================= */

body.cl-account_user {
    background: #f4f7fa;
}

body.cl-account_user
.qbit-account-user-page {
    padding: 36px 18px 54px;
    font-family: Arial, Helvetica, sans-serif;
}

body.cl-account_user
.qbit-account-container {
    width: 100%;
    max-width: 1180px;
    margin: 0 auto;
}


/* ---------------------------------------------------------
   CABECERA PAGINA
   --------------------------------------------------------- */

body.cl-account_user
.qbit-account-page-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;

    gap: 24px;

    margin-bottom: 22px;
}

body.cl-account_user
.qbit-account-page-eyebrow {
    display: block;

    margin-bottom: 4px;

    color: #0875d1;

    font-size: 12.5px;
    line-height: 17px;

    font-weight: 700;
    letter-spacing: .5px;
}

body.cl-account_user
.qbit-account-page-head h1 {
    margin: 0;

    color: #123f6b;

    font-family: Arial, Helvetica, sans-serif !important;
    font-size: 30px;
    line-height: 37px;

    font-weight: 700;
}

body.cl-account_user
.qbit-account-page-head p {
    margin: 5px 0 0;

    color: #6c8091;

    font-size: 14.5px;
    line-height: 22px;
}


/* ---------------------------------------------------------
   TARJETAS
   --------------------------------------------------------- */

body.cl-account_user
.qbit-account-user-sections {
    display: grid;
    gap: 16px;
}

body.cl-account_user
.qbit-account-user-card {
    overflow: hidden;

    border: 1px solid #dce6ee;
    border-radius: 12px;

    background: #fff;

    box-shadow:
        0 4px 16px
        rgba(22, 65, 105, .035);
}

body.cl-account_user
.qbit-account-user-card-head {
    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 18px;

    padding: 18px 20px;

    border-bottom: 1px solid #e7edf2;

    background: #fbfcfd;
}

body.cl-account_user
.qbit-account-user-card-eyebrow {
    display: block;

    margin-bottom: 2px;

    color: #0875d1;

    font-size: 12px;
    line-height: 17px;

    font-weight: 700;
    letter-spacing: .45px;
}

body.cl-account_user
.qbit-account-user-card-head h2 {
    margin: 0;

    color: #173f67;

    font-family: Arial, Helvetica, sans-serif !important;

    font-size: 19px;
    line-height: 25px;

    font-weight: 700;
}

body.cl-account_user
.qbit-account-user-card-head p {
    margin: 3px 0 0;

    color: #75899a;

    font-size: 13.5px;
    line-height: 20px;
}

body.cl-account_user
.qbit-account-user-card-body {
    padding: 20px;
}


/* ---------------------------------------------------------
   EDITAR
   --------------------------------------------------------- */

body.cl-account_user
.qbit-account-user-edit {
    display: inline-flex;
    align-items: center;
    gap: 6px;

    min-height: 38px;

    padding: 8px 12px;

    border: 1px solid #bfd3e3;
    border-radius: 8px;

    background: #fff;

    color: #0875d1;

    font-size: 13.5px;
    line-height: 19px;

    font-weight: 600;
}

body.cl-account_user
.qbit-account-user-edit svg {
    width: 16px;
    height: 16px;
}

body.cl-account_user
.qbit-account-user-edit:hover {
    border-color: #8fb8d8;
    background: #f5faff;
}


/* ---------------------------------------------------------
   RESUMEN DIRECCION NATIVO
   --------------------------------------------------------- */

body.cl-account_user
.qbit-account-user-address-summary {
    color: #3f5c73;

    font-size: 14px;
    line-height: 22px;
}

body.cl-account_user
.qbit-account-user-address-summary * {
    font-size: inherit;
}


/* ---------------------------------------------------------
   FORMULARIOS
   --------------------------------------------------------- */

body.cl-account_user
.qbit-account-user-edit-form,

body.cl-account_user
.qbit-account-user-shipping {
    width: 100%;
}

body.cl-account_user
.qbit-account-user-form
.form-control,

body.cl-account_user
.qbit-account-user-form
.form-select,

body.cl-account_user
.qbit-account-user-form
.qbit-mx-billing
.form-control,

body.cl-account_user
.qbit-account-user-form
.qbit-mx-billing
.form-select {
    min-height: 46px;

    border: 1px solid #ccd9e3;
    border-radius: 9px;

    background: #fff;

    color: #173f67;

    font-size: 14px !important;
    line-height: 20px;

    box-shadow: none;
}

body.cl-account_user
.qbit-account-user-form
.form-control:focus,

body.cl-account_user
.qbit-account-user-form
.form-select:focus {
    border-color: #78afe1;

    box-shadow:
        0 0 0 3px
        rgba(8, 117, 209, .09);
}

body.cl-account_user
.qbit-account-user-form
.form-floating > label {
    color: #6c8091;

    font-size: 12.5px !important;
    line-height: 18px;
}

body.cl-account_user
.qbit-account-user-form
.req-warning,

body.cl-account_user
.qbit-account-user-form
.text-muted,

body.cl-account_user
.qbit-account-user-form
.invalid-feedback {
    font-size: 12px !important;
    line-height: 18px;
}


/* ---------------------------------------------------------
   BILLING MX
   --------------------------------------------------------- */

body.cl-account_user
.qbit-mx-billing {
    gap: 11px;
}

body.cl-account_user
.qbit-mx-field {
    min-width: 0;
}


/* ---------------------------------------------------------
   ENVIO
   --------------------------------------------------------- */

body.cl-account_user
.qbit-account-user-shipping-choice {
    padding: 13px 14px;

    border: 1px solid #dbe7ef;
    border-radius: 9px;

    background: #f6faff;
}

body.cl-account_user
.qbit-account-user-shipping-choice
.form-check-label {
    color: #355771;

    font-size: 14px;
    line-height: 20px;

    font-weight: 600;
}

body.cl-account_user
.qbit-account-user-shipping-choice
.form-check-input {
    width: 18px;
    height: 18px;

    margin-top: 1px;
}

body.cl-account_user
.qbit-account-user-shipping {
    margin-top: 18px;
}


/* direcciones guardadas */

body.cl-account_user
.qbit-account-user-shipping
.list-group-item {
    margin-bottom: 10px;

    padding: 14px;

    border: 1px solid #dce6ee !important;
    border-radius: 9px !important;

    background: #fff;
}

body.cl-account_user
.qbit-account-user-shipping
.address-info {
    flex: 1 1 auto;

    color: #405f76;

    font-size: 14px;
    line-height: 21px;
}

body.cl-account_user
.qbit-account-user-shipping
.btn {
    font-size: 13px;
}


/* ---------------------------------------------------------
   GUARDAR
   --------------------------------------------------------- */

body.cl-account_user
.qbit-account-user-actions {
    display: flex;
    justify-content: flex-end;

    margin-top: 16px;
}

body.cl-account_user
.qbit-account-user-save {
    min-height: 42px;

    padding: 10px 17px;

    border: 1px solid #0875d1;
    border-radius: 9px;

    background: #0875d1;

    color: #fff;

    font-size: 13.5px;
    line-height: 19px;

    font-weight: 700;
}

body.cl-account_user
.qbit-account-user-save:hover {
    border-color: #0668bb;
    background: #0668bb;
}


/* ---------------------------------------------------------
   MENU ACCOUNT
   --------------------------------------------------------- */

body.cl-account_user
.qbit-account-nav-button {
    min-height: 42px;

    padding: 9px 14px;

    border: 1px solid #cfdce6;
    border-radius: 8px;

    background: #fff;

    color: #31536e;

    font-size: 13.5px;
    line-height: 19px;

    font-weight: 600;
}

body.cl-account_user
.qbit-account-nav-button:hover,

body.cl-account_user
.qbit-account-nav-button:focus,

body.cl-account_user
.qbit-account-nav-button.show {
    border-color: #8eb9dc;

    background: #f5faff;

    color: #0875d1;

    outline: none;
}

body.cl-account_user
.qbit-account-nav-menu {
    width: 255px;

    padding: 7px;

    border: 1px solid #dbe5ec !important;
    border-radius: 10px !important;

    background: #fff !important;

    box-shadow:
        0 12px 30px
        rgba(19, 57, 91, .13)
        !important;
}

body.cl-account_user
.qbit-account-nav-item {
    display: block;

    padding: 10px 11px;

    border-radius: 7px;

    color: #49647a !important;

    font-size: 13.5px;
    line-height: 19px;

    text-decoration: none !important;
}

body.cl-account_user
.qbit-account-nav-item:hover,

body.cl-account_user
.qbit-account-nav-item:focus {
    background: #f1f7fc;

    color: #0875d1 !important;
}

body.cl-account_user
.qbit-account-nav-item.active {
    background: #eaf5fd;

    color: #0875d1 !important;

    font-weight: 700;
}

body.cl-account_user
.qbit-account-nav-divider {
    height: 1px;

    margin: 6px 5px;

    background: #e5ecf1;
}


/* ---------------------------------------------------------
   RESPONSIVE
   --------------------------------------------------------- */

@media (max-width: 767.98px) {

    body.cl-account_user
    .qbit-account-user-page {
        padding: 24px 12px 40px;
    }

    body.cl-account_user
    .qbit-account-page-head {
        align-items: stretch;
        flex-direction: column;
    }

    body.cl-account_user
    .qbit-account-page-menu,

    body.cl-account_user
    .qbit-account-nav-button {
        width: 100%;
    }

    body.cl-account_user
    .qbit-account-nav-menu {
        width: 100%;
    }

    body.cl-account_user
    .qbit-account-user-card-head {
        align-items: flex-start;
    }

}

@media (max-width: 575.98px) {

    body.cl-account_user
    .qbit-account-user-card-head {
        flex-direction: column;
    }

    body.cl-account_user
    .qbit-account-user-edit {
        align-self: flex-start;
    }

    body.cl-account_user
    .qbit-account-user-card-body {
        padding: 16px;
    }

}

/* QBIT ACCOUNT USER 4.21B END */


/* QBIT ACCOUNT PASSWORD 4.22B START */
/* =========================================================
   MI CUENTA — CAMBIAR CONTRASEÑA
   ESCALA TIPOGRAFICA QBIT APROBADA
   ========================================================= */

body.cl-account_password {
    background: #f4f7fa;
}

body.cl-account_password
.qbit-account-password-page {
    padding: 36px 18px 54px;

    font-family:
        Arial,
        Helvetica,
        sans-serif;
}

body.cl-account_password
.qbit-account-container {
    width: 100%;
    max-width: 1180px;

    margin: 0 auto;
}


/* ---------------------------------------------------------
   CABECERA
   --------------------------------------------------------- */

body.cl-account_password
.qbit-account-page-head {
    display: flex;

    align-items: flex-start;
    justify-content: space-between;

    gap: 24px;

    margin-bottom: 22px;
}

body.cl-account_password
.qbit-account-page-eyebrow {
    display: block;

    margin-bottom: 4px;

    color: #0875d1;

    font-size: 12.5px;
    line-height: 17px;

    font-weight: 700;
    letter-spacing: .5px;
}

body.cl-account_password
.qbit-account-page-head h1 {
    margin: 0;

    color: #123f6b;

    font-family:
        Arial,
        Helvetica,
        sans-serif
        !important;

    font-size: 30px;
    line-height: 37px;

    font-weight: 700;
}

body.cl-account_password
.qbit-account-page-head p {
    margin: 5px 0 0;

    color: #6c8091;

    font-size: 14.5px;
    line-height: 22px;
}


/* ---------------------------------------------------------
   TARJETA
   --------------------------------------------------------- */

body.cl-account_password
.qbit-account-password-card {
    max-width: 760px;

    overflow: hidden;

    border: 1px solid #dce6ee;
    border-radius: 12px;

    background: #fff;

    box-shadow:
        0 4px 16px
        rgba(22, 65, 105, .035);
}

body.cl-account_password
.qbit-account-password-card-head {
    display: flex;

    align-items: center;

    gap: 14px;

    padding: 20px 22px;

    border-bottom:
        1px solid #e7edf2;

    background: #fbfcfd;
}

body.cl-account_password
.qbit-account-password-lock {
    display: flex;

    align-items: center;
    justify-content: center;

    width: 46px;
    height: 46px;

    flex: 0 0 46px;

    border-radius: 11px;

    background: #eef7ff;

    color: #0875d1;
}

body.cl-account_password
.qbit-account-password-lock svg {
    width: 23px;
    height: 23px;
}

body.cl-account_password
.qbit-account-password-eyebrow {
    display: block;

    margin-bottom: 2px;

    color: #0875d1;

    font-size: 12px;
    line-height: 17px;

    font-weight: 700;

    letter-spacing: .45px;
}

body.cl-account_password
.qbit-account-password-card-head h2 {
    margin: 0;

    color: #173f67;

    font-family:
        Arial,
        Helvetica,
        sans-serif
        !important;

    font-size: 19px;
    line-height: 25px;

    font-weight: 700;
}

body.cl-account_password
.qbit-account-password-card-head p {
    margin: 3px 0 0;

    color: #75899a;

    font-size: 13.5px;
    line-height: 20px;
}

body.cl-account_password
.qbit-account-password-card-body {
    padding: 22px;
}


/* ---------------------------------------------------------
   FORMULARIO
   --------------------------------------------------------- */

body.cl-account_password
.qbit-account-password-form {
    width: 100%;
    max-width: 600px;

    margin: 0;
}

body.cl-account_password
.qbit-account-password-fields {
    display: grid;

    gap: 15px;
}

body.cl-account_password
.qbit-account-password-field label {
    display: block;

    margin-bottom: 6px;

    color: #456178;

    font-size: 12.5px;
    line-height: 18px;

    font-weight: 600;
}

body.cl-account_password
.qbit-account-password-field
.form-control {
    width: 100%;

    min-height: 46px;

    padding: 10px 12px;

    border: 1px solid #ccd9e3;
    border-radius: 9px;

    background: #fff;

    color: #173f67;

    font-size: 14px;
    line-height: 20px;

    box-shadow: none;
}

body.cl-account_password
.qbit-account-password-field
.form-control:hover {
    border-color: #adbfcd;
}

body.cl-account_password
.qbit-account-password-field
.form-control:focus {
    border-color: #78afe1;

    outline: none;

    box-shadow:
        0 0 0 3px
        rgba(8, 117, 209, .09);
}

body.cl-account_password
.qbit-account-password-field small {
    display: block;

    margin-top: 5px;

    color: #7b8e9e;

    font-size: 12px;
    line-height: 17px;
}

body.cl-account_password
.qbit-account-password-field
.invalid-feedback {
    margin-top: 5px;

    font-size: 12px;
    line-height: 18px;
}


/* ---------------------------------------------------------
   GUARDAR
   --------------------------------------------------------- */

body.cl-account_password
.qbit-account-password-actions {
    display: flex;

    justify-content: flex-start;

    margin-top: 18px;
}

body.cl-account_password
.qbit-account-password-save {
    min-height: 42px;

    padding: 10px 17px;

    border: 1px solid #0875d1;
    border-radius: 9px;

    background: #0875d1;

    color: #fff;

    font-size: 13.5px;
    line-height: 19px;

    font-weight: 700;
}

body.cl-account_password
.qbit-account-password-save:hover {
    border-color: #0668bb;
    background: #0668bb;
}


/* ---------------------------------------------------------
   MENSAJES
   --------------------------------------------------------- */

body.cl-account_password
.qbit-account-password-message {
    display: flex;

    align-items: flex-start;

    gap: 11px;

    max-width: 760px;

    margin-bottom: 14px;

    padding: 14px 16px;

    border: 1px solid #dce6ee;
    border-radius: 9px;
}

body.cl-account_password
.qbit-account-password-message-icon {
    display: flex;

    align-items: center;
    justify-content: center;

    width: 28px;
    height: 28px;

    flex: 0 0 28px;

    border-radius: 50%;

    font-size: 14px;
    line-height: 28px;

    font-weight: 700;
}

body.cl-account_password
.qbit-account-password-message strong,

body.cl-account_password
.qbit-account-password-message span {
    display: block;
}

body.cl-account_password
.qbit-account-password-message strong {
    font-size: 14px;
    line-height: 20px;
}

body.cl-account_password
.qbit-account-password-message span {
    margin-top: 2px;

    font-size: 13px;
    line-height: 19px;
}

body.cl-account_password
.qbit-account-password-message.is-success {
    border-color: #cde7d8;
    background: #f4fbf7;
}

body.cl-account_password
.qbit-account-password-message.is-success
.qbit-account-password-message-icon {
    background: #e3f5ea;
    color: #17764a;
}

body.cl-account_password
.qbit-account-password-message.is-success
strong {
    color: #17764a;
}

body.cl-account_password
.qbit-account-password-message.is-error {
    border-color: #efd2d2;
    background: #fff7f7;
}

body.cl-account_password
.qbit-account-password-message.is-error
.qbit-account-password-message-icon {
    background: #fde6e6;
    color: #a74747;
}

body.cl-account_password
.qbit-account-password-message.is-error
strong {
    color: #a74747;
}


/* ---------------------------------------------------------
   AYUDA
   --------------------------------------------------------- */

body.cl-account_password
.qbit-account-password-help {
    max-width: 760px;

    margin-top: 14px;

    padding: 14px 16px;

    border: 1px solid #dce6ee;
    border-radius: 9px;

    background: #fff;
}

body.cl-account_password
.qbit-account-password-help strong,

body.cl-account_password
.qbit-account-password-help span {
    display: block;
}

body.cl-account_password
.qbit-account-password-help strong {
    color: #31536e;

    font-size: 13.5px;
    line-height: 19px;
}

body.cl-account_password
.qbit-account-password-help span {
    margin-top: 2px;

    color: #75899a;

    font-size: 12.5px;
    line-height: 18px;
}


/* ---------------------------------------------------------
   MENU ACCOUNT
   --------------------------------------------------------- */

body.cl-account_password
.qbit-account-nav-button {
    min-height: 42px;

    padding: 9px 14px;

    border: 1px solid #cfdce6;
    border-radius: 8px;

    background: #fff;

    color: #31536e;

    font-size: 13.5px;
    line-height: 19px;

    font-weight: 600;
}

body.cl-account_password
.qbit-account-nav-button:hover,

body.cl-account_password
.qbit-account-nav-button:focus,

body.cl-account_password
.qbit-account-nav-button.show {
    border-color: #8eb9dc;

    background: #f5faff;

    color: #0875d1;

    outline: none;
}

body.cl-account_password
.qbit-account-nav-menu {
    width: 255px;

    padding: 7px;

    border: 1px solid #dbe5ec !important;
    border-radius: 10px !important;

    background: #fff !important;

    box-shadow:
        0 12px 30px
        rgba(19, 57, 91, .13)
        !important;
}

body.cl-account_password
.qbit-account-nav-item {
    display: block;

    padding: 10px 11px;

    border-radius: 7px;

    color: #49647a !important;

    font-size: 13.5px;
    line-height: 19px;

    text-decoration: none !important;
}

body.cl-account_password
.qbit-account-nav-item:hover,

body.cl-account_password
.qbit-account-nav-item:focus {
    background: #f1f7fc;

    color: #0875d1 !important;
}

body.cl-account_password
.qbit-account-nav-item.active {
    background: #eaf5fd;

    color: #0875d1 !important;

    font-weight: 700;
}

body.cl-account_password
.qbit-account-nav-divider {
    height: 1px;

    margin: 6px 5px;

    background: #e5ecf1;
}


/* ---------------------------------------------------------
   RESPONSIVE
   --------------------------------------------------------- */

@media (max-width: 767.98px) {

    body.cl-account_password
    .qbit-account-password-page {
        padding: 24px 12px 40px;
    }

    body.cl-account_password
    .qbit-account-page-head {
        align-items: stretch;

        flex-direction: column;
    }

    body.cl-account_password
    .qbit-account-page-menu,

    body.cl-account_password
    .qbit-account-nav-button {
        width: 100%;
    }

    body.cl-account_password
    .qbit-account-nav-menu {
        width: 100%;
    }

}

@media (max-width: 575.98px) {

    body.cl-account_password
    .qbit-account-password-card-head {
        align-items: flex-start;
    }

    body.cl-account_password
    .qbit-account-password-card-body {
        padding: 17px;
    }

}

/* QBIT ACCOUNT PASSWORD 4.22B END */


/* QBIT ACCOUNT PASSWORD TYPOGRAPHY 4.22C START */
/* =========================================================
   ESCALA TIPOGRAFICA QBIT DEFINITIVA
   PRUEBA APROBACION: ACCOUNT PASSWORD
   ========================================================= */


/* ---------------------------------------------------------
   CABECERA
   --------------------------------------------------------- */

body.cl-account_password
.qbit-account-page-eyebrow {
    font-size: 13px !important;
    line-height: 18px !important;
}

body.cl-account_password
.qbit-account-page-head h1 {
    font-size: 30px !important;
    line-height: 37px !important;
}

body.cl-account_password
.qbit-account-page-head p {
    font-size: 15px !important;
    line-height: 22px !important;
}


/* ---------------------------------------------------------
   TARJETA SEGURIDAD
   --------------------------------------------------------- */

body.cl-account_password
.qbit-account-password-eyebrow {
    font-size: 13px !important;
    line-height: 18px !important;
}

body.cl-account_password
.qbit-account-password-card-head h2 {
    font-size: 20px !important;
    line-height: 26px !important;
}

body.cl-account_password
.qbit-account-password-card-head p {
    font-size: 14.5px !important;
    line-height: 21px !important;
}


/* ---------------------------------------------------------
   LABELS
   --------------------------------------------------------- */

body.cl-account_password
.qbit-account-password-field label {
    margin-bottom: 7px;

    font-size: 14px !important;
    line-height: 20px !important;
}


/* ---------------------------------------------------------
   INPUTS
   --------------------------------------------------------- */

body.cl-account_password
.qbit-account-password-field
.form-control {
    min-height: 48px;

    padding: 11px 13px;

    font-size: 15px !important;
    line-height: 21px !important;
}


/* ---------------------------------------------------------
   TEXTO AUXILIAR
   --------------------------------------------------------- */

body.cl-account_password
.qbit-account-password-field small {
    margin-top: 6px;

    font-size: 13px !important;
    line-height: 19px !important;
}

body.cl-account_password
.qbit-account-password-field
.invalid-feedback {
    font-size: 13px !important;
    line-height: 19px !important;
}


/* ---------------------------------------------------------
   BOTON
   --------------------------------------------------------- */

body.cl-account_password
.qbit-account-password-save {
    min-height: 44px;

    padding: 10px 18px;

    font-size: 14px !important;
    line-height: 20px !important;
}


/* ---------------------------------------------------------
   MENSAJES
   --------------------------------------------------------- */

body.cl-account_password
.qbit-account-password-message strong {
    font-size: 15px !important;
    line-height: 21px !important;
}

body.cl-account_password
.qbit-account-password-message span {
    font-size: 14px !important;
    line-height: 20px !important;
}


/* ---------------------------------------------------------
   RECOMENDACION SEGURIDAD
   --------------------------------------------------------- */

body.cl-account_password
.qbit-account-password-help strong {
    font-size: 14px !important;
    line-height: 20px !important;
}

body.cl-account_password
.qbit-account-password-help span {
    margin-top: 3px;

    font-size: 13.5px !important;
    line-height: 20px !important;
}


/* ---------------------------------------------------------
   MENU MI CUENTA
   --------------------------------------------------------- */

body.cl-account_password
.qbit-account-nav-button {
    min-height: 43px;

    font-size: 14px !important;
    line-height: 20px !important;
}

body.cl-account_password
.qbit-account-nav-item {
    font-size: 14px !important;
    line-height: 20px !important;
}


/* QBIT ACCOUNT PASSWORD TYPOGRAPHY 4.22C END */


/* QBIT ACCOUNT TYPOGRAPHY STANDARD 4.23A START */
/* =========================================================
   ESCALA TIPOGRAFICA QBIT DEFINITIVA
   ACCOUNT YA REDISEÑADO
   ========================================================= */


/* =========================================================
   DASHBOARD — MI CUENTA
   ========================================================= */

body.cl-account
.qbit-account-page-eyebrow {
    font-size: 13px !important;
    line-height: 18px !important;
}

body.cl-account
.qbit-account-page-head h1 {
    font-size: 30px !important;
    line-height: 37px !important;
}

body.cl-account
.qbit-account-page-head p {
    font-size: 15px !important;
    line-height: 22px !important;
}

body.cl-account
.qbit-account-dashboard-copy > strong {
    font-size: 17px !important;
    line-height: 23px !important;
}

body.cl-account
.qbit-account-dashboard-copy > small {
    font-size: 14px !important;
    line-height: 20px !important;
}

body.cl-account
.qbit-account-dashboard-meta {
    font-size: 14px !important;
    line-height: 20px !important;
}

body.cl-account
.qbit-account-dashboard-action {
    font-size: 14px !important;
    line-height: 20px !important;
}

body.cl-account
.qbit-account-dashboard-footer strong {
    font-size: 14px !important;
    line-height: 20px !important;
}

body.cl-account
.qbit-account-dashboard-footer span {
    font-size: 13px !important;
    line-height: 19px !important;
}

body.cl-account
.qbit-account-logout-button,

body.cl-account
.qbit-account-delete-button {
    font-size: 14px !important;
    line-height: 20px !important;
}


/* =========================================================
   MIS PEDIDOS
   ========================================================= */

body.cl-account_order
.qbit-account-page-eyebrow {
    font-size: 13px !important;
    line-height: 18px !important;
}

body.cl-account_order
.qbit-account-page-head h1 {
    font-size: 30px !important;
    line-height: 37px !important;
}

body.cl-account_order
.qbit-account-page-head p {
    font-size: 15px !important;
    line-height: 22px !important;
}

body.cl-account_order
.qbit-account-order-label {
    font-size: 13px !important;
    line-height: 18px !important;
}

body.cl-account_order
.qbit-account-order-number {
    font-size: 19px !important;
    line-height: 25px !important;
}

body.cl-account_order
.qbit-account-order-status {
    font-size: 13px !important;
    line-height: 18px !important;
}

body.cl-account_order
.qbit-account-order-meta span {
    font-size: 13px !important;
    line-height: 18px !important;
}

body.cl-account_order
.qbit-account-order-meta strong {
    font-size: 15px !important;
    line-height: 21px !important;
}

body.cl-account_order
.qbit-account-order-products-title {
    font-size: 13px !important;
    line-height: 18px !important;
}

body.cl-account_order
.qbit-account-order-product-main,

body.cl-account_order
.qbit-account-order-product-main a,

body.cl-account_order
.qbit-account-order-product-main > span {
    font-size: 15px !important;
    line-height: 22px !important;
}

body.cl-account_order
.qbit-account-order-qty {
    font-size: 14px !important;
    line-height: 22px !important;
}

body.cl-account_order
.qbit-account-order-products small {
    font-size: 13px !important;
    line-height: 19px !important;
}

body.cl-account_order
.qbit-account-order-track a {
    font-size: 14px !important;
    line-height: 20px !important;
}


/* =========================================================
   DATOS Y DIRECCIONES
   ========================================================= */

body.cl-account_user
.qbit-account-page-eyebrow {
    font-size: 13px !important;
    line-height: 18px !important;
}

body.cl-account_user
.qbit-account-page-head h1 {
    font-size: 30px !important;
    line-height: 37px !important;
}

body.cl-account_user
.qbit-account-page-head p {
    font-size: 15px !important;
    line-height: 22px !important;
}

body.cl-account_user
.qbit-account-user-card-eyebrow {
    font-size: 13px !important;
    line-height: 18px !important;
}

body.cl-account_user
.qbit-account-user-card-head h2 {
    font-size: 20px !important;
    line-height: 26px !important;
}

body.cl-account_user
.qbit-account-user-card-head p {
    font-size: 14.5px !important;
    line-height: 21px !important;
}

body.cl-account_user
.qbit-account-user-address-summary,

body.cl-account_user
.qbit-account-user-address-summary * {
    font-size: 15px !important;
    line-height: 22px !important;
}

body.cl-account_user
.qbit-account-user-form
.form-control,

body.cl-account_user
.qbit-account-user-form
.form-select,

body.cl-account_user
.qbit-account-user-form
.qbit-mx-billing
.form-control,

body.cl-account_user
.qbit-account-user-form
.qbit-mx-billing
.form-select {
    font-size: 15px !important;
    line-height: 21px !important;
}

body.cl-account_user
.qbit-account-user-form
.form-floating > label {
    font-size: 14px !important;
    line-height: 20px !important;
}

body.cl-account_user
.qbit-account-user-form
.req-warning,

body.cl-account_user
.qbit-account-user-form
.text-muted,

body.cl-account_user
.qbit-account-user-form
.invalid-feedback {
    font-size: 13px !important;
    line-height: 19px !important;
}

body.cl-account_user
.qbit-account-user-shipping-choice
.form-check-label {
    font-size: 15px !important;
    line-height: 21px !important;
}

body.cl-account_user
.qbit-account-user-shipping
.address-info {
    font-size: 15px !important;
    line-height: 22px !important;
}

body.cl-account_user
.qbit-account-user-edit,

body.cl-account_user
.qbit-account-user-save,

body.cl-account_user
.qbit-account-user-shipping
.btn {
    font-size: 14px !important;
    line-height: 20px !important;
}


/* =========================================================
   MENU INTERNO ACCOUNT — TODAS LAS PAGINAS
   ========================================================= */

body.cl-account
.qbit-account-nav-button,

body.cl-account_order
.qbit-account-nav-button,

body.cl-account_user
.qbit-account-nav-button,

body.cl-account_password
.qbit-account-nav-button {
    min-height: 43px;

    font-size: 14px !important;
    line-height: 20px !important;
}

body.cl-account
.qbit-account-nav-item,

body.cl-account_order
.qbit-account-nav-item,

body.cl-account_user
.qbit-account-nav-item,

body.cl-account_password
.qbit-account-nav-item {
    font-size: 14px !important;
    line-height: 20px !important;
}


/* QBIT ACCOUNT TYPOGRAPHY STANDARD 4.23A END */


/* QBIT ACCOUNT NEWSLETTER 4.24B START */
/* =========================================================
   MI CUENTA — NEWSLETTER
   ESCALA TIPOGRAFICA QBIT DEFINITIVA
   ========================================================= */

body.cl-account_newsletter {
    background: #f4f7fa;
}

body.cl-account_newsletter
.qbit-account-newsletter-page {
    padding: 36px 18px 54px;

    font-family:
        Arial,
        Helvetica,
        sans-serif;
}

body.cl-account_newsletter
.qbit-account-container {
    width: 100%;
    max-width: 1180px;

    margin: 0 auto;
}


/* ---------------------------------------------------------
   CABECERA
   --------------------------------------------------------- */

body.cl-account_newsletter
.qbit-account-page-head {
    display: flex;

    align-items: flex-start;
    justify-content: space-between;

    gap: 24px;

    margin-bottom: 22px;
}

body.cl-account_newsletter
.qbit-account-page-eyebrow {
    display: block;

    margin-bottom: 4px;

    color: #0875d1;

    font-size: 13px;
    line-height: 18px;

    font-weight: 700;

    letter-spacing: .5px;
}

body.cl-account_newsletter
.qbit-account-page-head h1 {
    margin: 0;

    color: #123f6b;

    font-family:
        Arial,
        Helvetica,
        sans-serif
        !important;

    font-size: 30px;
    line-height: 37px;

    font-weight: 700;
}

body.cl-account_newsletter
.qbit-account-page-head p {
    margin: 5px 0 0;

    color: #6c8091;

    font-size: 15px;
    line-height: 22px;
}


/* ---------------------------------------------------------
   TARJETA
   --------------------------------------------------------- */

body.cl-account_newsletter
.qbit-account-newsletter-card {
    max-width: 760px;

    overflow: hidden;

    border: 1px solid #dce6ee;
    border-radius: 12px;

    background: #fff;

    box-shadow:
        0 4px 16px
        rgba(22, 65, 105, .035);
}

body.cl-account_newsletter
.qbit-account-newsletter-card-head {
    display: flex;

    align-items: center;

    gap: 14px;

    padding: 20px 22px;

    border-bottom:
        1px solid #e7edf2;

    background: #fbfcfd;
}

body.cl-account_newsletter
.qbit-account-newsletter-icon {
    display: flex;

    align-items: center;
    justify-content: center;

    width: 46px;
    height: 46px;

    flex: 0 0 46px;

    border-radius: 11px;

    background: #eef7ff;

    color: #0875d1;
}

body.cl-account_newsletter
.qbit-account-newsletter-icon svg {
    width: 23px;
    height: 23px;
}

body.cl-account_newsletter
.qbit-account-newsletter-eyebrow {
    display: block;

    margin-bottom: 2px;

    color: #0875d1;

    font-size: 13px;
    line-height: 18px;

    font-weight: 700;

    letter-spacing: .45px;
}

body.cl-account_newsletter
.qbit-account-newsletter-card-head h2 {
    margin: 0;

    color: #173f67;

    font-family:
        Arial,
        Helvetica,
        sans-serif
        !important;

    font-size: 20px;
    line-height: 26px;

    font-weight: 700;
}

body.cl-account_newsletter
.qbit-account-newsletter-card-head p {
    margin: 3px 0 0;

    color: #75899a;

    font-size: 14.5px;
    line-height: 21px;
}

body.cl-account_newsletter
.qbit-account-newsletter-card-body {
    padding: 22px;
}


/* ---------------------------------------------------------
   FORMULARIO
   --------------------------------------------------------- */

body.cl-account_newsletter
.qbit-account-newsletter-form {
    width: 100%;
    max-width: 600px;
}

body.cl-account_newsletter
.qbit-account-newsletter-field label {
    display: block;

    margin-bottom: 7px;

    color: #456178;

    font-size: 14px;
    line-height: 20px;

    font-weight: 600;
}

body.cl-account_newsletter
.qbit-account-newsletter-field
.form-select {
    width: 100%;

    min-height: 48px;

    padding: 10px 38px 10px 13px;

    border: 1px solid #ccd9e3;
    border-radius: 9px;

    background-color: #fff;

    color: #173f67;

    font-size: 15px;
    line-height: 21px;

    box-shadow: none;
}

body.cl-account_newsletter
.qbit-account-newsletter-field
.form-select:hover {
    border-color: #adbfcd;
}

body.cl-account_newsletter
.qbit-account-newsletter-field
.form-select:focus {
    border-color: #78afe1;

    outline: none;

    box-shadow:
        0 0 0 3px
        rgba(8, 117, 209, .09);
}


/* ---------------------------------------------------------
   NOTA
   --------------------------------------------------------- */

body.cl-account_newsletter
.qbit-account-newsletter-note {
    margin-top: 16px;

    padding: 14px 15px;

    border: 1px solid #dce7ef;
    border-radius: 9px;

    background: #f7fbfe;
}

body.cl-account_newsletter
.qbit-account-newsletter-note strong,

body.cl-account_newsletter
.qbit-account-newsletter-note span {
    display: block;
}

body.cl-account_newsletter
.qbit-account-newsletter-note strong {
    color: #31536e;

    font-size: 14px;
    line-height: 20px;
}

body.cl-account_newsletter
.qbit-account-newsletter-note span {
    margin-top: 3px;

    color: #6f8394;

    font-size: 13.5px;
    line-height: 20px;
}


/* ---------------------------------------------------------
   BOTON
   --------------------------------------------------------- */

body.cl-account_newsletter
.qbit-account-newsletter-actions {
    margin-top: 18px;
}

body.cl-account_newsletter
.qbit-account-newsletter-save {
    min-height: 44px;

    padding: 10px 18px;

    border: 1px solid #0875d1;
    border-radius: 9px;

    background: #0875d1;

    color: #fff;

    font-size: 14px;
    line-height: 20px;

    font-weight: 700;
}

body.cl-account_newsletter
.qbit-account-newsletter-save:hover {
    border-color: #0668bb;
    background: #0668bb;
}


/* ---------------------------------------------------------
   MENSAJES
   --------------------------------------------------------- */

body.cl-account_newsletter
.qbit-account-newsletter-message {
    display: flex;

    align-items: flex-start;

    gap: 11px;

    max-width: 760px;

    margin-bottom: 14px;

    padding: 14px 16px;

    border-radius: 9px;
}

body.cl-account_newsletter
.qbit-account-newsletter-message-icon {
    display: flex;

    align-items: center;
    justify-content: center;

    width: 28px;
    height: 28px;

    flex: 0 0 28px;

    border-radius: 50%;

    font-size: 14px;
    line-height: 28px;

    font-weight: 700;
}

body.cl-account_newsletter
.qbit-account-newsletter-message strong,

body.cl-account_newsletter
.qbit-account-newsletter-message span {
    display: block;
}

body.cl-account_newsletter
.qbit-account-newsletter-message strong {
    font-size: 15px;
    line-height: 21px;
}

body.cl-account_newsletter
.qbit-account-newsletter-message span {
    margin-top: 2px;

    font-size: 14px;
    line-height: 20px;
}

body.cl-account_newsletter
.qbit-account-newsletter-message.is-success {
    border: 1px solid #cde7d8;

    background: #f4fbf7;
}

body.cl-account_newsletter
.qbit-account-newsletter-message.is-success
.qbit-account-newsletter-message-icon {
    background: #e3f5ea;

    color: #17764a;
}

body.cl-account_newsletter
.qbit-account-newsletter-message.is-success
strong {
    color: #17764a;
}

body.cl-account_newsletter
.qbit-account-newsletter-message.is-neutral {
    border: 1px solid #d8e3eb;

    background: #f7fafc;
}

body.cl-account_newsletter
.qbit-account-newsletter-message.is-neutral
.qbit-account-newsletter-message-icon {
    background: #eaf2f8;

    color: #456b88;
}

body.cl-account_newsletter
.qbit-account-newsletter-message.is-neutral
strong {
    color: #365c78;
}


/* ---------------------------------------------------------
   MENU ACCOUNT
   --------------------------------------------------------- */

body.cl-account_newsletter
.qbit-account-nav-button {
    min-height: 43px;

    padding: 9px 14px;

    border: 1px solid #cfdce6;
    border-radius: 8px;

    background: #fff;

    color: #31536e;

    font-size: 14px;
    line-height: 20px;

    font-weight: 600;
}

body.cl-account_newsletter
.qbit-account-nav-button:hover,

body.cl-account_newsletter
.qbit-account-nav-button:focus,

body.cl-account_newsletter
.qbit-account-nav-button.show {
    border-color: #8eb9dc;

    background: #f5faff;

    color: #0875d1;

    outline: none;
}

body.cl-account_newsletter
.qbit-account-nav-menu {
    width: 255px;

    padding: 7px;

    border: 1px solid #dbe5ec !important;
    border-radius: 10px !important;

    background: #fff !important;

    box-shadow:
        0 12px 30px
        rgba(19, 57, 91, .13)
        !important;
}

body.cl-account_newsletter
.qbit-account-nav-item {
    display: block;

    padding: 10px 11px;

    border-radius: 7px;

    color: #49647a !important;

    font-size: 14px;
    line-height: 20px;

    text-decoration: none !important;
}

body.cl-account_newsletter
.qbit-account-nav-item:hover,

body.cl-account_newsletter
.qbit-account-nav-item:focus {
    background: #f1f7fc;

    color: #0875d1 !important;
}

body.cl-account_newsletter
.qbit-account-nav-item.active {
    background: #eaf5fd;

    color: #0875d1 !important;

    font-weight: 700;
}

body.cl-account_newsletter
.qbit-account-nav-divider {
    height: 1px;

    margin: 6px 5px;

    background: #e5ecf1;
}


/* ---------------------------------------------------------
   RESPONSIVE
   --------------------------------------------------------- */

@media (max-width: 767.98px) {

    body.cl-account_newsletter
    .qbit-account-newsletter-page {
        padding: 24px 12px 40px;
    }

    body.cl-account_newsletter
    .qbit-account-page-head {
        align-items: stretch;

        flex-direction: column;
    }

    body.cl-account_newsletter
    .qbit-account-page-menu,

    body.cl-account_newsletter
    .qbit-account-nav-button {
        width: 100%;
    }

    body.cl-account_newsletter
    .qbit-account-nav-menu {
        width: 100%;
    }

}

@media (max-width: 575.98px) {

    body.cl-account_newsletter
    .qbit-account-newsletter-card-head {
        align-items: flex-start;
    }

    body.cl-account_newsletter
    .qbit-account-newsletter-card-body {
        padding: 17px;
    }

}

/* QBIT ACCOUNT NEWSLETTER 4.24B END */


/* QBIT ACCOUNT NOTICELIST 4.25B START */
/* =========================================================
   MI CUENTA — LISTA DE DESEOS
   ESCALA TIPOGRAFICA QBIT DEFINITIVA
   ========================================================= */

body.cl-account_noticelist {
    background: #f4f7fa;
}

body.cl-account_noticelist
.qbit-account-noticelist-page {
    padding: 36px 18px 54px;

    font-family:
        Arial,
        Helvetica,
        sans-serif;
}

body.cl-account_noticelist
.qbit-account-container {
    width: 100%;
    max-width: 1180px;

    margin: 0 auto;
}


/* ---------------------------------------------------------
   CABECERA
   --------------------------------------------------------- */

body.cl-account_noticelist
.qbit-account-page-head {
    display: flex;

    align-items: flex-start;
    justify-content: space-between;

    gap: 24px;

    margin-bottom: 22px;
}

body.cl-account_noticelist
.qbit-account-page-eyebrow {
    display: block;

    margin-bottom: 4px;

    color: #0875d1;

    font-size: 13px;
    line-height: 18px;

    font-weight: 700;
    letter-spacing: .5px;
}

body.cl-account_noticelist
.qbit-account-page-head h1 {
    margin: 0;

    color: #123f6b;

    font-family:
        Arial,
        Helvetica,
        sans-serif
        !important;

    font-size: 30px;
    line-height: 37px;

    font-weight: 700;
}

body.cl-account_noticelist
.qbit-account-page-head p {
    margin: 5px 0 0;

    color: #6c8091;

    font-size: 15px;
    line-height: 22px;
}


/* ---------------------------------------------------------
   CARD CON PRODUCTOS
   --------------------------------------------------------- */

body.cl-account_noticelist
.qbit-account-noticelist-card {
    overflow: hidden;

    border: 1px solid #dce6ee;
    border-radius: 12px;

    background: #fff;

    box-shadow:
        0 4px 16px
        rgba(22, 65, 105, .035);
}

body.cl-account_noticelist
.qbit-account-noticelist-card-head {
    padding: 20px 22px;

    border-bottom:
        1px solid #e7edf2;

    background: #fbfcfd;
}

body.cl-account_noticelist
.qbit-account-noticelist-eyebrow {
    display: block;

    margin-bottom: 3px;

    color: #0875d1;

    font-size: 13px;
    line-height: 18px;

    font-weight: 700;
    letter-spacing: .45px;
}

body.cl-account_noticelist
.qbit-account-noticelist-card-head h2 {
    margin: 0;

    color: #173f67;

    font-family:
        Arial,
        Helvetica,
        sans-serif
        !important;

    font-size: 20px;
    line-height: 26px;

    font-weight: 700;
}

body.cl-account_noticelist
.qbit-account-noticelist-card-head p {
    margin: 3px 0 0;

    color: #75899a;

    font-size: 14.5px;
    line-height: 21px;
}

body.cl-account_noticelist
.qbit-account-noticelist-products {
    padding: 18px 20px;
}


/* ---------------------------------------------------------
   LISTADO NATIVO OXID DENTRO DE ACCOUNT
   Solo ajuste tipografico y visual del contenedor.
   No altera funciones.
   --------------------------------------------------------- */

body.cl-account_noticelist
.qbit-account-noticelist-products
a {
    font-family:
        Arial,
        Helvetica,
        sans-serif;
}

body.cl-account_noticelist
.qbit-account-noticelist-products
.productData {

    font-size: 15px;
    line-height: 22px;
}

body.cl-account_noticelist
.qbit-account-noticelist-products
.productData
a {
    font-size: 15px;
    line-height: 22px;
}

body.cl-account_noticelist
.qbit-account-noticelist-products
.productData
h3,

body.cl-account_noticelist
.qbit-account-noticelist-products
.productData
h4 {
    font-family:
        Arial,
        Helvetica,
        sans-serif
        !important;

    font-size: 17px !important;
    line-height: 23px !important;
}

body.cl-account_noticelist
.qbit-account-noticelist-products
.btn {
    font-size: 14px;
    line-height: 20px;
}


/* ---------------------------------------------------------
   ESTADO VACIO
   --------------------------------------------------------- */

body.cl-account_noticelist
.qbit-account-noticelist-empty {
    display: flex;

    align-items: center;

    gap: 18px;

    max-width: 760px;

    padding: 24px;

    border: 1px solid #dce6ee;
    border-radius: 12px;

    background: #fff;

    box-shadow:
        0 4px 16px
        rgba(22, 65, 105, .035);
}

body.cl-account_noticelist
.qbit-account-noticelist-empty-icon {
    display: flex;

    align-items: center;
    justify-content: center;

    width: 54px;
    height: 54px;

    flex: 0 0 54px;

    border-radius: 13px;

    background: #eef7ff;

    color: #0875d1;
}

body.cl-account_noticelist
.qbit-account-noticelist-empty-icon svg {
    width: 27px;
    height: 27px;
}

body.cl-account_noticelist
.qbit-account-noticelist-empty-copy {
    min-width: 0;

    flex: 1 1 auto;
}

body.cl-account_noticelist
.qbit-account-noticelist-empty-copy h2 {
    margin: 0;

    color: #173f67;

    font-family:
        Arial,
        Helvetica,
        sans-serif
        !important;

    font-size: 20px;
    line-height: 26px;

    font-weight: 700;
}

body.cl-account_noticelist
.qbit-account-noticelist-empty-copy p {
    max-width: 520px;

    margin: 4px 0 0;

    color: #6f8394;

    font-size: 14.5px;
    line-height: 21px;
}

body.cl-account_noticelist
.qbit-account-noticelist-shop {
    flex: 0 0 auto;

    min-height: 44px;

    padding: 10px 17px;

    border: 1px solid #0875d1;
    border-radius: 9px;

    background: #0875d1;

    color: #fff !important;

    font-size: 14px;
    line-height: 22px;

    font-weight: 700;

    text-decoration: none !important;
}

body.cl-account_noticelist
.qbit-account-noticelist-shop:hover {
    border-color: #0668bb;

    background: #0668bb;
}


/* ---------------------------------------------------------
   MENU ACCOUNT
   --------------------------------------------------------- */

body.cl-account_noticelist
.qbit-account-nav-button {
    min-height: 43px;

    padding: 9px 14px;

    border: 1px solid #cfdce6;
    border-radius: 8px;

    background: #fff;

    color: #31536e;

    font-size: 14px;
    line-height: 20px;

    font-weight: 600;
}

body.cl-account_noticelist
.qbit-account-nav-button:hover,

body.cl-account_noticelist
.qbit-account-nav-button:focus,

body.cl-account_noticelist
.qbit-account-nav-button.show {
    border-color: #8eb9dc;

    background: #f5faff;

    color: #0875d1;

    outline: none;
}

body.cl-account_noticelist
.qbit-account-nav-menu {
    width: 255px;

    padding: 7px;

    border: 1px solid #dbe5ec !important;
    border-radius: 10px !important;

    background: #fff !important;

    box-shadow:
        0 12px 30px
        rgba(19, 57, 91, .13)
        !important;
}

body.cl-account_noticelist
.qbit-account-nav-item {
    display: block;

    padding: 10px 11px;

    border-radius: 7px;

    color: #49647a !important;

    font-size: 14px;
    line-height: 20px;

    text-decoration: none !important;
}

body.cl-account_noticelist
.qbit-account-nav-item:hover,

body.cl-account_noticelist
.qbit-account-nav-item:focus {
    background: #f1f7fc;

    color: #0875d1 !important;
}

body.cl-account_noticelist
.qbit-account-nav-item.active {
    background: #eaf5fd;

    color: #0875d1 !important;

    font-weight: 700;
}

body.cl-account_noticelist
.qbit-account-nav-divider {
    height: 1px;

    margin: 6px 5px;

    background: #e5ecf1;
}


/* ---------------------------------------------------------
   RESPONSIVE
   --------------------------------------------------------- */

@media (max-width: 767.98px) {

    body.cl-account_noticelist
    .qbit-account-noticelist-page {
        padding: 24px 12px 40px;
    }

    body.cl-account_noticelist
    .qbit-account-page-head {
        align-items: stretch;

        flex-direction: column;
    }

    body.cl-account_noticelist
    .qbit-account-page-menu,

    body.cl-account_noticelist
    .qbit-account-nav-button {
        width: 100%;
    }

    body.cl-account_noticelist
    .qbit-account-nav-menu {
        width: 100%;
    }

    body.cl-account_noticelist
    .qbit-account-noticelist-empty {
        align-items: flex-start;

        flex-direction: column;
    }

    body.cl-account_noticelist
    .qbit-account-noticelist-shop {
        width: 100%;

        text-align: center;
    }

}

/* QBIT ACCOUNT NOTICELIST 4.25B END */


/* QBIT ACCOUNT WISHLIST 4.26B START */
/* =========================================================
   MI CUENTA — LISTA DE REGALOS
   ESCALA TIPOGRAFICA QBIT DEFINITIVA
   ========================================================= */

body.cl-account_wishlist {
    background: #f4f7fa;
}

body.cl-account_wishlist
.qbit-account-wishlist-page {
    padding: 36px 18px 54px;

    font-family:
        Arial,
        Helvetica,
        sans-serif;
}

body.cl-account_wishlist
.qbit-account-container {
    width: 100%;
    max-width: 1180px;

    margin: 0 auto;
}


/* CABECERA */

body.cl-account_wishlist
.qbit-account-page-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;

    gap: 24px;

    margin-bottom: 22px;
}

body.cl-account_wishlist
.qbit-account-page-eyebrow {
    display: block;

    margin-bottom: 4px;

    color: #0875d1;

    font-size: 13px;
    line-height: 18px;

    font-weight: 700;
    letter-spacing: .5px;
}

body.cl-account_wishlist
.qbit-account-page-head h1 {
    margin: 0;

    color: #123f6b;

    font-family:
        Arial,
        Helvetica,
        sans-serif !important;

    font-size: 30px;
    line-height: 37px;

    font-weight: 700;
}

body.cl-account_wishlist
.qbit-account-page-head p {
    margin: 5px 0 0;

    max-width: 650px;

    color: #6c8091;

    font-size: 15px;
    line-height: 22px;
}


/* GRID */

body.cl-account_wishlist
.qbit-account-wishlist-grid {
    display: grid;

    grid-template-columns:
        minmax(0, 1fr)
        minmax(0, 1.25fr);

    gap: 16px;

    align-items: start;
}


/* CARDS */

body.cl-account_wishlist
.qbit-account-wishlist-card {
    overflow: hidden;

    border: 1px solid #dce6ee;
    border-radius: 12px;

    background: #fff;

    box-shadow:
        0 4px 16px
        rgba(22, 65, 105, .035);
}

body.cl-account_wishlist
.qbit-account-wishlist-card-head {
    display: flex;

    align-items: center;

    gap: 14px;

    padding: 20px 22px;

    border-bottom: 1px solid #e7edf2;

    background: #fbfcfd;
}

body.cl-account_wishlist
.qbit-account-wishlist-card-icon {
    display: flex;

    align-items: center;
    justify-content: center;

    width: 46px;
    height: 46px;

    flex: 0 0 46px;

    border-radius: 11px;

    background: #eef7ff;

    color: #0875d1;
}

body.cl-account_wishlist
.qbit-account-wishlist-card-icon svg {
    width: 23px;
    height: 23px;
}

body.cl-account_wishlist
.qbit-account-wishlist-eyebrow {
    display: block;

    margin-bottom: 2px;

    color: #0875d1;

    font-size: 13px;
    line-height: 18px;

    font-weight: 700;
    letter-spacing: .45px;
}

body.cl-account_wishlist
.qbit-account-wishlist-card-head h2 {
    margin: 0;

    color: #173f67;

    font-family:
        Arial,
        Helvetica,
        sans-serif !important;

    font-size: 20px;
    line-height: 26px;

    font-weight: 700;
}

body.cl-account_wishlist
.qbit-account-wishlist-card-head p {
    margin: 3px 0 0;

    color: #75899a;

    font-size: 14.5px;
    line-height: 21px;
}

body.cl-account_wishlist
.qbit-account-wishlist-card-body {
    padding: 22px;
}


/* CAMPOS */

body.cl-account_wishlist
.qbit-wishlist-search-field label,

body.cl-account_wishlist
.qbit-wishlist-publish-field label,

body.cl-account_wishlist
.qbit-wishlist-suggest-field label {
    display: block;

    margin-bottom: 7px;

    color: #456178;

    font-size: 14px;
    line-height: 20px;

    font-weight: 600;
}

body.cl-account_wishlist
.qbit-wishlist-search-row {
    display: grid;

    grid-template-columns:
        minmax(0, 1fr)
        auto;

    gap: 8px;
}

body.cl-account_wishlist
.form-control,

body.cl-account_wishlist
.form-select {
    min-height: 48px;

    border: 1px solid #ccd9e3;
    border-radius: 9px;

    background: #fff;

    color: #173f67;

    font-size: 15px !important;
    line-height: 21px !important;

    box-shadow: none;
}

body.cl-account_wishlist
.form-control:focus,

body.cl-account_wishlist
.form-select:focus {
    border-color: #78afe1;

    box-shadow:
        0 0 0 3px
        rgba(8, 117, 209, .09);
}

body.cl-account_wishlist
textarea.form-control {
    min-height: 120px;

    resize: vertical;
}


/* BOTONES */

body.cl-account_wishlist
.qbit-wishlist-search-button,

body.cl-account_wishlist
.qbit-wishlist-primary-button,

body.cl-account_wishlist
.qbit-wishlist-secondary-button {
    display: inline-flex;

    align-items: center;
    justify-content: center;

    min-height: 44px;

    padding: 10px 17px;

    border-radius: 9px;

    font-size: 14px;
    line-height: 20px;

    font-weight: 700;

    text-decoration: none !important;
}

body.cl-account_wishlist
.qbit-wishlist-search-button,

body.cl-account_wishlist
.qbit-wishlist-primary-button {
    border: 1px solid #0875d1;

    background: #0875d1;

    color: #fff;
}

body.cl-account_wishlist
.qbit-wishlist-search-button:hover,

body.cl-account_wishlist
.qbit-wishlist-primary-button:hover {
    border-color: #0668bb;

    background: #0668bb;
}

body.cl-account_wishlist
.qbit-wishlist-secondary-button {
    border: 1px solid #bfd3e3;

    background: #fff;

    color: #0875d1 !important;
}

body.cl-account_wishlist
.qbit-wishlist-secondary-button:hover {
    border-color: #8fb8d8;

    background: #f5faff;
}


/* BUSQUEDA RESULTADOS */

body.cl-account_wishlist
.qbit-wishlist-search-results {
    margin-top: 18px;

    padding-top: 16px;

    border-top: 1px solid #e5ecf1;
}

body.cl-account_wishlist
.qbit-wishlist-search-results > strong {
    display: block;

    color: #31536e;

    font-size: 15px;
    line-height: 21px;
}

body.cl-account_wishlist
.qbit-wishlist-search-results ul {
    margin: 9px 0 0;
    padding: 0;

    list-style: none;
}

body.cl-account_wishlist
.qbit-wishlist-search-results li {
    margin-top: 6px;
}

body.cl-account_wishlist
.qbit-wishlist-search-results a {
    color: #0875d1 !important;

    font-size: 14px;
    line-height: 20px;

    text-decoration: none !important;
}


/* PRIVACIDAD */

body.cl-account_wishlist
.qbit-wishlist-publish-field small {
    display: block;

    margin-top: 6px;

    color: #768b9b;

    font-size: 13px;
    line-height: 19px;
}

body.cl-account_wishlist
.qbit-wishlist-publish-actions {
    display: flex;

    flex-wrap: wrap;

    gap: 8px;

    margin-top: 16px;
}


/* COMPARTIR */

body.cl-account_wishlist
.qbit-wishlist-suggest {
    margin-top: 20px;
}

body.cl-account_wishlist
.qbit-wishlist-suggest-head {
    margin-bottom: 14px;

    padding-top: 18px;

    border-top: 1px solid #e5ecf1;
}

body.cl-account_wishlist
.qbit-wishlist-suggest-head strong,

body.cl-account_wishlist
.qbit-wishlist-suggest-head span {
    display: block;
}

body.cl-account_wishlist
.qbit-wishlist-suggest-head strong {
    color: #173f67;

    font-size: 16px;
    line-height: 22px;
}

body.cl-account_wishlist
.qbit-wishlist-suggest-head span {
    margin-top: 2px;

    color: #75899a;

    font-size: 13.5px;
    line-height: 20px;
}

body.cl-account_wishlist
.qbit-wishlist-suggest-form {
    display: grid;

    gap: 14px;
}

body.cl-account_wishlist
.qbit-wishlist-suggest-errors {
    margin-bottom: 14px;

    padding: 12px 14px;

    border: 1px solid #efd2d2;
    border-radius: 9px;

    background: #fff7f7;

    color: #a74747;

    font-size: 14px;
    line-height: 20px;
}


/* VACIO */

body.cl-account_wishlist
.qbit-account-wishlist-empty {
    display: flex;

    align-items: center;

    gap: 14px;

    padding: 18px;

    border: 1px solid #dce7ef;
    border-radius: 10px;

    background: #f8fbfd;
}

body.cl-account_wishlist
.qbit-account-wishlist-empty-icon {
    display: flex;

    align-items: center;
    justify-content: center;

    width: 44px;
    height: 44px;

    flex: 0 0 44px;

    border-radius: 10px;

    background: #eef7ff;

    color: #0875d1;
}

body.cl-account_wishlist
.qbit-account-wishlist-empty-icon svg {
    width: 22px;
    height: 22px;
}

body.cl-account_wishlist
.qbit-account-wishlist-empty strong,

body.cl-account_wishlist
.qbit-account-wishlist-empty span {
    display: block;
}

body.cl-account_wishlist
.qbit-account-wishlist-empty strong {
    color: #173f67;

    font-size: 16px;
    line-height: 22px;
}

body.cl-account_wishlist
.qbit-account-wishlist-empty span {
    margin-top: 2px;

    color: #6f8394;

    font-size: 14px;
    line-height: 20px;
}


/* PRODUCTOS NATIVOS */

body.cl-account_wishlist
.qbit-account-wishlist-products {
    margin-top: 20px;

    padding-top: 18px;

    border-top: 1px solid #e5ecf1;
}

body.cl-account_wishlist
.qbit-account-wishlist-products
.productData,

body.cl-account_wishlist
.qbit-account-wishlist-products
.productData a {
    font-size: 15px !important;
    line-height: 22px !important;
}

body.cl-account_wishlist
.qbit-account-wishlist-products
.productData h3,

body.cl-account_wishlist
.qbit-account-wishlist-products
.productData h4 {
    font-family:
        Arial,
        Helvetica,
        sans-serif !important;

    font-size: 17px !important;
    line-height: 23px !important;
}

body.cl-account_wishlist
.qbit-account-wishlist-products
.btn {
    font-size: 14px !important;
}


/* MENSAJES */

body.cl-account_wishlist
.qbit-account-wishlist-message {
    display: flex;

    align-items: flex-start;

    gap: 11px;

    margin-bottom: 14px;

    padding: 14px 16px;

    border-radius: 9px;
}

body.cl-account_wishlist
.qbit-account-wishlist-message-icon {
    display: flex;

    align-items: center;
    justify-content: center;

    width: 28px;
    height: 28px;

    flex: 0 0 28px;

    border-radius: 50%;

    font-size: 14px;

    font-weight: 700;
}

body.cl-account_wishlist
.qbit-account-wishlist-message strong,

body.cl-account_wishlist
.qbit-account-wishlist-message span {
    display: block;
}

body.cl-account_wishlist
.qbit-account-wishlist-message strong {
    font-size: 15px;
    line-height: 21px;
}

body.cl-account_wishlist
.qbit-account-wishlist-message span {
    margin-top: 2px;

    font-size: 14px;
    line-height: 20px;
}

body.cl-account_wishlist
.qbit-account-wishlist-message.is-error {
    border: 1px solid #efd2d2;

    background: #fff7f7;
}

body.cl-account_wishlist
.qbit-account-wishlist-message.is-error
.qbit-account-wishlist-message-icon {
    background: #fde6e6;

    color: #a74747;
}

body.cl-account_wishlist
.qbit-account-wishlist-message.is-success {
    border: 1px solid #cde7d8;

    background: #f4fbf7;
}

body.cl-account_wishlist
.qbit-account-wishlist-message.is-success
.qbit-account-wishlist-message-icon {
    background: #e3f5ea;

    color: #17764a;
}


/* MENU ACCOUNT */

body.cl-account_wishlist
.qbit-account-nav-button {
    min-height: 43px;

    padding: 9px 14px;

    border: 1px solid #cfdce6;
    border-radius: 8px;

    background: #fff;

    color: #31536e;

    font-size: 14px;
    line-height: 20px;

    font-weight: 600;
}

body.cl-account_wishlist
.qbit-account-nav-button:hover,

body.cl-account_wishlist
.qbit-account-nav-button:focus,

body.cl-account_wishlist
.qbit-account-nav-button.show {
    border-color: #8eb9dc;

    background: #f5faff;

    color: #0875d1;

    outline: none;
}

body.cl-account_wishlist
.qbit-account-nav-menu {
    width: 255px;

    padding: 7px;

    border: 1px solid #dbe5ec !important;
    border-radius: 10px !important;

    background: #fff !important;

    box-shadow:
        0 12px 30px
        rgba(19,57,91,.13)
        !important;
}

body.cl-account_wishlist
.qbit-account-nav-item {
    display: block;

    padding: 10px 11px;

    border-radius: 7px;

    color: #49647a !important;

    font-size: 14px;
    line-height: 20px;

    text-decoration: none !important;
}

body.cl-account_wishlist
.qbit-account-nav-item:hover,

body.cl-account_wishlist
.qbit-account-nav-item:focus {
    background: #f1f7fc;

    color: #0875d1 !important;
}

body.cl-account_wishlist
.qbit-account-nav-item.active {
    background: #eaf5fd;

    color: #0875d1 !important;

    font-weight: 700;
}

body.cl-account_wishlist
.qbit-account-nav-divider {
    height: 1px;

    margin: 6px 5px;

    background: #e5ecf1;
}


/* RESPONSIVE */

@media (max-width: 900px) {

    body.cl-account_wishlist
    .qbit-account-wishlist-grid {
        grid-template-columns: 1fr;
    }

}

@media (max-width: 767.98px) {

    body.cl-account_wishlist
    .qbit-account-wishlist-page {
        padding: 24px 12px 40px;
    }

    body.cl-account_wishlist
    .qbit-account-page-head {
        align-items: stretch;

        flex-direction: column;
    }

    body.cl-account_wishlist
    .qbit-account-page-menu,

    body.cl-account_wishlist
    .qbit-account-nav-button {
        width: 100%;
    }

    body.cl-account_wishlist
    .qbit-account-nav-menu {
        width: 100%;
    }

}

@media (max-width: 575.98px) {

    body.cl-account_wishlist
    .qbit-wishlist-search-row {
        grid-template-columns: 1fr;
    }

    body.cl-account_wishlist
    .qbit-wishlist-search-button {
        width: 100%;
    }

    body.cl-account_wishlist
    .qbit-account-wishlist-card-head {
        align-items: flex-start;
    }

}

/* QBIT ACCOUNT WISHLIST 4.26B END */


/* QBIT COMPARE 4.30H START */
/* =========================================================
   COMPARACION QBIT
   MATRIZ UNICA POR FILAS CSS GRID

   ESTRUCTURA:
   [ RESUMEN ][ PRODUCTO ][ PRODUCTO ][ PRODUCTO ][ PRODUCTO ]
   [ LABEL   ][ VALOR    ][ VALOR    ][ VALOR    ][ VALOR    ]
   [ LABEL   ][ VALOR    ][ VALOR    ][ VALOR    ][ VALOR    ]

   Ya NO existen dos sistemas independientes de filas.
   ========================================================= */


/* ---------------------------------------------------------
   PAGINA
   --------------------------------------------------------- */

body.cl-compare {
    background: #f4f7fa;
}


body.cl-compare
.qbit-compare-page {
    width: 100% !important;

    margin-left: auto !important;
    margin-right: auto !important;

    padding-top: 34px !important;
    padding-bottom: 48px !important;
}


/* ---------------------------------------------------------
   HEADER
   --------------------------------------------------------- */

body.cl-compare
.qbit-account-page-head {
    width: 100%;

    display: flex;

    align-items: flex-start;
    justify-content: space-between;

    gap: 24px;

    margin-bottom: 22px;
}


body.cl-compare
.qbit-account-page-head > div:first-child {
    min-width: 0;

    flex: 1 1 auto;
}


body.cl-compare
.qbit-account-page-head-menu {
    flex: 0 0 auto;

    margin-left: auto;
}


body.cl-compare
.qbit-account-page-eyebrow {
    display: block;

    margin-bottom: 4px;

    color: #0872cf;

    font-family:
        Arial,
        Helvetica,
        sans-serif;

    font-size: 13px;
    line-height: 18px;

    font-weight: 700;

    letter-spacing: .04em;
}


body.cl-compare
.qbit-account-page-head h1 {
    margin: 0;

    color: #123f6b;

    font-family:
        Arial,
        Helvetica,
        sans-serif !important;

    font-size: 30px;
    line-height: 37px;

    font-weight: 700;
}


body.cl-compare
.qbit-account-page-head p {
    max-width: 680px;

    margin: 5px 0 0;

    color: #6c8091;

    font-family:
        Arial,
        Helvetica,
        sans-serif;

    font-size: 15px;
    line-height: 22px;
}


/* ---------------------------------------------------------
   STATUS
   --------------------------------------------------------- */

body.cl-compare
.qbit-compare-status-card {
    display: flex;

    flex-direction: column;

    gap: 4px;

    width: 100%;

    margin: 0 0 18px;

    padding: 13px 15px;

    border: 1px solid #cfdeeb;
    border-radius: 10px;

    background: #fff;

    box-sizing: border-box;
}


body.cl-compare
.qbit-compare-status-card strong {
    color: #173f67;

    font-size: 13.5px;
    line-height: 19px;
}


body.cl-compare
.qbit-compare-status-card span {
    color: #6a8092;

    font-size: 12.5px;
    line-height: 18px;
}


body.cl-compare
.qbit-compare-status-card
.qbit-compare-status-warning {
    color: #966300;
}


/* ---------------------------------------------------------
   MATRIZ
   --------------------------------------------------------- */

body.cl-compare
.qbit-compare-playground {
    width: 100%;

    overflow: hidden;

    border: 1px solid #d6e2ec;
    border-radius: 12px;

    background: #fff;

    box-sizing: border-box;
}


body.cl-compare
.qbit-compare-landscape {
    width: 100%;

    overflow-x: hidden;
}


body.cl-compare
.qbit-compare-matrix {
    display: grid;

    width: 100%;

    align-items: stretch;

    background: #fff;
}


/* Numero real de columnas visibles */

body.cl-compare
.qbit-compare-cols-1 {
    grid-template-columns:
        180px
        minmax(0, 1fr);
}


body.cl-compare
.qbit-compare-cols-2 {
    grid-template-columns:
        180px
        repeat(
            2,
            minmax(0, 1fr)
        );
}


body.cl-compare
.qbit-compare-cols-3 {
    grid-template-columns:
        180px
        repeat(
            3,
            minmax(0, 1fr)
        );
}


body.cl-compare
.qbit-compare-cols-4 {
    grid-template-columns:
        180px
        repeat(
            4,
            minmax(0, 1fr)
        );
}


/* Todas las celdas comparten bordes */

body.cl-compare
.qbit-compare-summary-corner,

body.cl-compare
.qbit-compare-product-top,

body.cl-compare
.qbit-compare-attribute-label,

body.cl-compare
.qbit-compare-attribute-value {
    min-width: 0;

    box-sizing: border-box;

    border-right:
        1px solid #dce6ee;

    border-bottom:
        1px solid #dce6ee;
}


/* Cada quinta celda, último producto */
body.cl-compare
.qbit-compare-cols-4
> :nth-child(5n) {
    border-right: 0;
}


/* ---------------------------------------------------------
   RESUMEN SUPERIOR IZQUIERDO
   Misma fila física que productos.
   --------------------------------------------------------- */

body.cl-compare
.qbit-compare-summary-corner {
    padding: 18px 14px;

    display: flex;

    flex-direction: column;

    gap: 8px;

    background:
        linear-gradient(
            180deg,
            #f8fbff,
            #f4f8fc
        );
}


body.cl-compare
.qbit-compare-summary-label {
    color: #0872cf;

    font-size: 10.5px;
    line-height: 15px;

    font-weight: 700;

    letter-spacing: .08em;
}


body.cl-compare
.qbit-compare-summary-corner h2 {
    margin: 0;

    color: #123f6b;

    font-family:
        Arial,
        Helvetica,
        sans-serif !important;

    font-size: 17px;
    line-height: 22px;

    font-weight: 700;
}


body.cl-compare
.qbit-compare-summary-corner p {
    margin: 0;

    color: #647b90;

    font-size: 12px;
    line-height: 17px;
}


body.cl-compare
.qbit-compare-summary-list {
    margin: 2px 0 0;

    padding-left: 16px;
}


body.cl-compare
.qbit-compare-summary-list li {
    margin-bottom: 6px;

    color: #405d77;

    font-size: 11.5px;
    line-height: 16px;
}


body.cl-compare
.qbit-compare-summary-note {
    margin-top: auto;

    padding: 9px;

    border-radius: 8px;

    background: #eaf4fe;

    color: #456581;

    font-size: 11px;
    line-height: 16px;
}


/* ---------------------------------------------------------
   CELDA SUPERIOR DE PRODUCTO
   --------------------------------------------------------- */

body.cl-compare
.qbit-compare-product-top {
    display: flex;

    flex-direction: column;

    background: #fff;
}


/* mover */

body.cl-compare
.qbit-compare-move-controls {
    height: 44px;

    flex: 0 0 44px;

    display: grid;

    grid-template-columns:
        30px
        1fr
        30px;

    gap: 6px;

    align-items: center;

    padding: 6px 9px;

    border-bottom:
        1px solid #e1e9ef;

    background: #fbfcfd;

    box-sizing: border-box;
}


body.cl-compare
.qbit-compare-move-label {
    color: #778a9b;

    font-size: 11px;
    line-height: 16px;

    text-align: center;
}


body.cl-compare
.qbit-compare-move-button,

body.cl-compare
.qbit-compare-move-placeholder {
    width: 30px;
    height: 30px;
}


body.cl-compare
.qbit-compare-move-button {
    display: flex;

    align-items: center;
    justify-content: center;

    border: 1px solid #bdd0df;
    border-radius: 7px;

    background: #fff;

    color: #0872cf;

    font-size: 16px;

    text-decoration: none;
}


/* ---------------------------------------------------------
   PRODUCT ITEM
   Sin altura fija.
   La FILA GRID determina la altura común.
   --------------------------------------------------------- */

body.cl-compare
.qbit-compare-item {
    flex: 1 1 auto;

    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;

    padding: 12px;

    display: flex;

    flex-direction: column;

    border: 0 !important;

    box-sizing: border-box;

    overflow: visible !important;
}


body.cl-compare
.qbit-compare-product-image {
    width: 100%;

    height: 105px !important;
    min-height: 105px !important;
    max-height: 105px !important;

    margin: 0 0 8px !important;
    padding: 5px !important;

    display: flex;

    align-items: center;
    justify-content: center;

    border:
        1px solid #e4ebf1;

    border-radius: 8px;

    box-sizing: border-box;
}


body.cl-compare
.qbit-compare-product-image a {
    width: 100%;
    height: 100%;

    display: flex;

    align-items: center;
    justify-content: center;
}


body.cl-compare
.qbit-compare-product-image img {
    width: auto !important;
    height: auto !important;

    max-width: 92% !important;
    max-height: 88px !important;

    object-fit: contain;
}


/* información */

body.cl-compare
.qbit-compare-product-info {
    flex: 1 1 auto;

    min-height: 0 !important;

    display: flex;

    flex-direction: column;

    gap: 0 !important;
}


body.cl-compare
.qbit-compare-product-title {
    height: 56px;
    min-height: 56px;
    max-height: 56px;

    margin: 0 0 5px !important;

    overflow: hidden;

    color: #0060af !important;

    font-size: 12.5px !important;
    line-height: 18px !important;

    font-weight: 600 !important;

    text-decoration: none;
}


body.cl-compare
.qbit-compare-product-meta {
    min-height: 18px !important;

    margin: 0 !important;

    display: flex;

    gap: 6px;

    color: #738698;

    font-size: 11.5px !important;
    line-height: 18px !important;
}


body.cl-compare
.qbit-compare-product-meta strong {
    color: #405c75;

    font-weight: 500;
}


/* precio */

body.cl-compare
.qbit-compare-product-price {
    min-height: 28px;

    margin: 5px 0 8px !important;
}


body.cl-compare
.qbit-compare-product-price > strong {
    color: #003b70;

    font-size: 15px !important;
    line-height: 20px !important;

    font-weight: 700;
}


body.cl-compare
.qbit-compare-old-price,

body.cl-compare
.qbit-compare-unit-price {
    font-size: 11px !important;
    line-height: 16px !important;
}


/* ---------------------------------------------------------
   ACCIONES
   Todas quedan al fondo de la fila superior compartida.
   --------------------------------------------------------- */

body.cl-compare
.qbit-compare-buy-form {
    width: 100%;

    margin-top: auto !important;
    margin-bottom: 0 !important;

    padding: 0 !important;
}


body.cl-compare
.qbit-compare-buy-row {
    width: 100%;

    display: grid;

    grid-template-columns:
        46px
        minmax(0, 1fr);

    gap: 7px;

    margin: 0 0 8px;

    box-sizing: border-box;
}


body.cl-compare
.qbit-compare-amount {
    width: 46px !important;
    height: 40px !important;

    min-height: 40px !important;
    max-height: 40px !important;

    padding: 5px;

    box-sizing: border-box;

    font-size: 13px !important;

    text-align: center;
}


body.cl-compare
.qbit-compare-cart-button,

body.cl-compare
.qbit-compare-info-button {
    width: 100%;

    height: 40px;
    min-height: 40px;
    max-height: 40px;

    padding: 6px 8px;

    border-radius: 7px;

    box-sizing: border-box;

    font-size: 12px !important;
    line-height: 17px !important;

    font-weight: 600 !important;
}


body.cl-compare
.qbit-compare-remove-form {
    width: 100%;

    margin: 0 !important;
    padding: 0 0 12px !important;

    box-sizing: border-box;
}


body.cl-compare
.qbit-compare-remove-button {
    width: 100%;

    height: 36px;
    min-height: 36px;
    max-height: 36px;

    display: flex;

    align-items: center;
    justify-content: center;

    border-radius: 7px;

    box-sizing: border-box;

    font-size: 11.5px !important;
    line-height: 16px !important;

    font-weight: 500 !important;
}


/* ---------------------------------------------------------
   FILAS DE ATRIBUTOS

   CLAVE:
   Ya no imponemos height.
   Grid calcula UNA altura para label + todos sus valores.
   --------------------------------------------------------- */

body.cl-compare
.qbit-compare-attribute-label,

body.cl-compare
.qbit-compare-attribute-value {
    min-height: 48px;

    padding: 9px 10px;

    display: flex;

    align-items: center;

    box-sizing: border-box;

    overflow-wrap: anywhere;
}


body.cl-compare
.qbit-compare-attribute-label {
    background: #f7fafc;

    color: #304f6a;

    font-size: 12px;
    line-height: 17px;

    font-weight: 600;
}


body.cl-compare
.qbit-compare-attribute-value {
    background: #fff;

    color: #244766;

    font-size: 12.5px;
    line-height: 18px;
}


body.cl-compare
.qbit-compare-empty-value {
    color: #9aabb9;
}


/* ---------------------------------------------------------
   ESTADO VACIO
   --------------------------------------------------------- */

body.cl-compare
.qbit-compare-empty {
    padding: 28px;

    display: flex;

    align-items: center;

    gap: 16px;

    border: 1px solid #d6e2ec;
    border-radius: 12px;

    background: #fff;
}


body.cl-compare
.qbit-compare-empty-icon {
    width: 50px;
    height: 50px;

    flex: 0 0 50px;

    display: flex;

    align-items: center;
    justify-content: center;

    border-radius: 12px;

    background: #eaf4fe;

    color: #0872cf;

    font-size: 24px;
}


body.cl-compare
.qbit-compare-empty-eyebrow {
    display: block;

    color: #0872cf;

    font-size: 11px;

    font-weight: 700;
}


body.cl-compare
.qbit-compare-empty h2 {
    margin: 2px 0 4px;

    color: #123f6b;

    font-family:
        Arial,
        Helvetica,
        sans-serif !important;

    font-size: 20px;
}


body.cl-compare
.qbit-compare-empty p {
    margin: 0;

    color: #697e90;

    font-size: 13px;
}


/* ---------------------------------------------------------
   RESPONSIVE
   --------------------------------------------------------- */

@media (max-width: 991.98px) {

    body.cl-compare
    .qbit-compare-landscape {
        overflow-x: auto;
    }


    body.cl-compare
    .qbit-compare-matrix {
        width: max-content;

        min-width: max-content;
    }


    body.cl-compare
    .qbit-compare-cols-4 {
        grid-template-columns:
            165px
            repeat(
                4,
                220px
            );
    }


    body.cl-compare
    .qbit-compare-cols-3 {
        grid-template-columns:
            165px
            repeat(
                3,
                220px
            );
    }


    body.cl-compare
    .qbit-compare-cols-2 {
        grid-template-columns:
            165px
            repeat(
                2,
                220px
            );
    }

}


@media (max-width: 767.98px) {

    body.cl-compare
    .qbit-account-page-head {
        flex-direction: column;

        gap: 14px;
    }


    body.cl-compare
    .qbit-account-page-head-menu {
        width: 100%;

        margin-left: 0;
    }


    body.cl-compare
    .qbit-account-nav-button {
        width: 100%;
    }


    body.cl-compare
    .qbit-account-page-head h1 {
        font-size: 26px;
        line-height: 32px;
    }

}

/* QBIT COMPARE 4.30H END */


/* QBIT COMPARE SHELL 4.30I START */
/* =========================================================
   SOLO PRESENTACION EXTERIOR DE COMPARE
   SIN TOCAR MATRIZ / FILAS / GEOMETRIA INTERNA
   ========================================================= */

/* ---------------------------------------------------------
   1. ANCHO PRINCIPAL
   --------------------------------------------------------- */

body.cl-compare .qbit-compare-page {
    width: 100% !important;
    max-width: 1220px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 16px !important;
    padding-right: 16px !important;
    box-sizing: border-box !important;
}

body.cl-compare .qbit-account-page-head,
body.cl-compare .qbit-compare-status-card,
body.cl-compare .qbit-compare-playground,
body.cl-compare .qbit-compare-empty {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
}

/* ---------------------------------------------------------
   2. HEADER ACCOUNT
   --------------------------------------------------------- */

body.cl-compare .qbit-account-page-head {
    display: flex !important;
    align-items: flex-start !important;
    justify-content: space-between !important;
    gap: 24px !important;
    margin: 0 0 20px !important;
}

body.cl-compare .qbit-account-page-head > div:first-child {
    flex: 1 1 auto !important;
    min-width: 0 !important;
}

body.cl-compare .qbit-account-page-head-menu {
    flex: 0 0 auto !important;
    margin-left: auto !important;
    display: flex !important;
    justify-content: flex-end !important;
    align-items: flex-start !important;
}

/* ---------------------------------------------------------
   3. MENU NAVEGAR POR MI CUENTA
   --------------------------------------------------------- */

body.cl-compare .qbit-account-nav {
    position: relative !important;
    display: inline-block !important;
    width: auto !important;
    min-width: 220px !important;
}

body.cl-compare .qbit-account-nav-button {
    width: 220px !important;
    min-width: 220px !important;
    min-height: 42px !important;
    padding: 9px 14px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 8px !important;
    border: 1px solid #cad8e4 !important;
    border-radius: 8px !important;
    background: #fff !important;
    color: #31536e !important;
    font-family: Arial, Helvetica, sans-serif !important;
    font-size: 14px !important;
    line-height: 20px !important;
    font-weight: 600 !important;
    white-space: nowrap !important;
    box-shadow: none !important;
    text-align: left !important;
}

body.cl-compare .qbit-account-nav-button:hover,
body.cl-compare .qbit-account-nav-button:focus,
body.cl-compare .qbit-account-nav-button.show {
    border-color: #8eb9dc !important;
    background: #f5faff !important;
    color: #0872cf !important;
    outline: none !important;
}

body.cl-compare .qbit-account-nav-menu {
    position: absolute !important;
    top: calc(100% + 8px) !important;
    right: 0 !important;
    left: auto !important;
    z-index: 1050 !important;
    display: none;
    width: 220px !important;
    min-width: 220px !important;
    max-width: 220px !important;
    padding: 7px !important;
    margin: 0 !important;
    border: 1px solid #d9e4ec !important;
    border-radius: 10px !important;
    background: #fff !important;
    box-shadow: 0 12px 30px rgba(19,57,91,.13) !important;
    box-sizing: border-box !important;
}

body.cl-compare .qbit-account-nav-menu.show {
    display: block !important;
}

body.cl-compare .qbit-account-nav-item {
    display: block !important;
    width: 100% !important;
    padding: 9px 11px !important;
    border-radius: 7px !important;
    background: transparent !important;
    color: #49647a !important;
    font-family: Arial, Helvetica, sans-serif !important;
    font-size: 14px !important;
    line-height: 20px !important;
    font-weight: 400 !important;
    text-decoration: none !important;
    box-sizing: border-box !important;
}

body.cl-compare .qbit-account-nav-item:hover,
body.cl-compare .qbit-account-nav-item:focus {
    background: #f1f7fc !important;
    color: #0872cf !important;
}

body.cl-compare .qbit-account-nav-item.active {
    background: #eaf5fd !important;
    color: #0872cf !important;
    font-weight: 700 !important;
}

body.cl-compare .qbit-account-nav-divider {
    height: 1px !important;
    margin: 6px 5px !important;
    background: #e4ebf1 !important;
}

/* ---------------------------------------------------------
   4. BOTONES PRODUCTO
   --------------------------------------------------------- */

body.cl-compare .qbit-compare-amount {
    border: 1px solid #ccd9e3 !important;
    border-radius: 8px !important;
    background: #fff !important;
    color: #173f67 !important;
    box-shadow: none !important;
}

body.cl-compare .qbit-compare-amount:focus {
    border-color: #78afe1 !important;
    box-shadow: 0 0 0 3px rgba(8,117,209,.09) !important;
    outline: none !important;
}

body.cl-compare .qbit-compare-cart-button,
body.cl-compare .qbit-compare-info-button {
    border: 1px solid #0875d1 !important;
    border-radius: 8px !important;
    background: #0875d1 !important;
    color: #fff !important;
    font-family: Arial, Helvetica, sans-serif !important;
    font-weight: 500 !important;
    text-decoration: none !important;
    box-shadow: none !important;
}

body.cl-compare .qbit-compare-cart-button:hover,
body.cl-compare .qbit-compare-info-button:hover {
    border-color: #0668bb !important;
    background: #0668bb !important;
    color: #fff !important;
}

body.cl-compare .qbit-compare-remove-button {
    border: 1px solid #cfdbe5 !important;
    border-radius: 8px !important;
    background: #fff !important;
    color: #5c7386 !important;
    font-family: Arial, Helvetica, sans-serif !important;
    font-weight: 500 !important;
    box-shadow: none !important;
}

body.cl-compare .qbit-compare-remove-button:hover {
    border-color: #e1bcbc !important;
    background: #fff7f7 !important;
    color: #a24848 !important;
}

body.cl-compare .qbit-compare-move-button {
    border: 1px solid #bdd0df !important;
    border-radius: 7px !important;
    background: #fff !important;
    color: #0872cf !important;
    text-decoration: none !important;
}

body.cl-compare .qbit-compare-move-button:hover {
    border-color: #8eb9dc !important;
    background: #f2f8fd !important;
}

/* ---------------------------------------------------------
   RESPONSIVE
   --------------------------------------------------------- */

@media (max-width: 991.98px) {
    body.cl-compare .qbit-compare-page {
        max-width: 100% !important;
        padding-left: 14px !important;
        padding-right: 14px !important;
    }
}

@media (max-width: 767.98px) {
    body.cl-compare .qbit-account-page-head {
        flex-direction: column !important;
        gap: 14px !important;
    }

    body.cl-compare .qbit-account-page-head-menu,
    body.cl-compare .qbit-account-nav,
    body.cl-compare .qbit-account-nav-button {
        width: 100% !important;
        min-width: 100% !important;
    }

    body.cl-compare .qbit-account-nav-menu {
        right: 0 !important;
        left: 0 !important;
        width: 100% !important;
        min-width: 100% !important;
        max-width: 100% !important;
    }
}

/* QBIT COMPARE SHELL 4.30I END */

/* ============================================================
   QBIT SERVICES — START
   ============================================================ 

.qbit-service-page {
    --qbit-service-border: #dce6ef;
    --qbit-service-soft: #f5f9fc;
    --qbit-service-text: #18334f;
    --qbit-service-muted: #5d7185;
    --qbit-service-blue: #1667a8;

    color: var(--qbit-service-text);
}

.qbit-service-page * {
    box-sizing: border-box;
}

.qbit-service-hero {
    padding: 54px 0 46px;
}

.qbit-service-hero-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(320px, .72fr);
    gap: 38px;
    align-items: stretch;
}

.qbit-service-hero-copy {
    padding: 20px 0;
}

.qbit-service-eyebrow {
    display: block;
    margin-bottom: 10px;
    font-size: 13px;
    line-height: 1.3;
    font-weight: 700;
    letter-spacing: .08em;
    color: var(--qbit-service-blue);
}

.qbit-service-hero h1 {
    max-width: 790px;
    margin: 0;
    font-size: 38px;
    line-height: 1.13;
    font-weight: 650;
    letter-spacing: -.02em;
    color: #153b61;
}

.qbit-service-lead {
    max-width: 760px;
    margin: 20px 0 0;
    font-size: 17px;
    line-height: 1.65;
    color: var(--qbit-service-muted);
}

.qbit-service-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 28px;
}

.qbit-service-primary,
.qbit-service-secondary {
    min-height: 46px;
    padding: 12px 20px;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
}

.qbit-service-primary {
    border: 1px solid #1769aa;
    background: #1769aa;
    color: #fff;
}

.qbit-service-primary:hover,
.qbit-service-primary:focus {
    background: #12598f;
    color: #fff;
}

.qbit-service-secondary {
    border: 1px solid #c8d8e6;
    background: #fff;
    color: #174a76;
}

.qbit-service-secondary:hover,
.qbit-service-secondary:focus {
    background: #f4f8fb;
    color: #153f65;
}

.qbit-service-trust {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 25px;
}

.qbit-service-trust span {
    padding: 6px 10px;
    border: 1px solid #dbe5ee;
    border-radius: 999px;
    background: #fff;
    font-size: 13px;
    color: #516a80;
}

.qbit-service-hero-card {
    padding: 28px;
    border: 1px solid var(--qbit-service-border);
    border-radius: 12px;
    background: linear-gradient(180deg, #f8fbfd 0%, #fff 100%);
    box-shadow: 0 12px 30px rgba(18, 56, 88, .07);
}

.qbit-service-card-kicker {
    display: block;
    margin-bottom: 9px;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .07em;
    color: #1769aa;
}

.qbit-service-hero-card h2 {
    margin: 0;
    font-size: 22px;
    line-height: 1.3;
    font-weight: 650;
    color: #163e62;
}

.qbit-service-hero-card p {
    margin: 14px 0;
    font-size: 14.5px;
    line-height: 1.6;
    color: #617386;
}

.qbit-service-hero-card ul {
    margin: 18px 0;
    padding-left: 19px;
}

.qbit-service-hero-card li {
    margin: 8px 0;
    font-size: 14px;
    color: #304f69;
}

.qbit-service-card-link {
    display: inline-block;
    margin-top: 2px;
    font-size: 14px;
    font-weight: 600;
    color: #1769aa;
    text-decoration: none;
}

.qbit-service-hero-card small {
    display: block;
    margin-top: 18px;
    font-size: 13px;
    line-height: 1.45;
    color: #758799;
}

.qbit-service-selector {
    padding: 48px 0 58px;
    border-top: 1px solid #edf2f6;
    background: #f7fafc;
}

.qbit-service-section-heading {
    max-width: 720px;
    margin-bottom: 28px;
}

.qbit-service-section-heading h2,
.qbit-service-feature h2 {
    margin: 0;
    font-size: 30px;
    line-height: 1.2;
    font-weight: 650;
    color: #173f67;
}

.qbit-service-section-heading p {
    margin: 12px 0 0;
    font-size: 15px;
    line-height: 1.6;
    color: #647688;
}

.qbit-service-option-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
}

.qbit-service-option {
    position: relative;
    min-height: 205px;
    padding: 22px;
    border: 1px solid var(--qbit-service-border);
    border-radius: 10px;
    background: #fff;
    color: inherit;
    text-decoration: none;
    transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}

.qbit-service-option:hover,
.qbit-service-option:focus {
    transform: translateY(-2px);
    border-color: #b7cede;
    box-shadow: 0 10px 26px rgba(26, 66, 99, .08);
    color: inherit;
}

.qbit-service-option-number {
    display: block;
    margin-bottom: 22px;
    font-size: 13px;
    font-weight: 700;
    color: #79a0bf;
}

.qbit-service-option strong {
    display: block;
    margin-bottom: 9px;
    font-size: 16px;
    line-height: 1.35;
    font-weight: 650;
    color: #173f67;
}

.qbit-service-option p {
    margin: 0;
    padding-right: 10px;
    font-size: 14px;
    line-height: 1.55;
    color: #67798a;
}

.qbit-service-option-arrow {
    position: absolute;
    right: 18px;
    bottom: 16px;
    font-size: 20px;
    color: #3577a9;
}

.qbit-service-feature {
    padding: 62px 0;
}

.qbit-service-feature-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(300px, .75fr);
    gap: 42px;
    align-items: start;
}

.qbit-service-feature-lead {
    max-width: 760px;
    margin: 16px 0 24px;
    font-size: 15px;
    line-height: 1.7;
    color: #617386;
}

.qbit-service-check-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px 24px;
}

.qbit-service-check-grid span {
    font-size: 14.5px;
    color: #35546d;
}

.qbit-service-contact-card {
    padding: 26px;
    border: 1px solid var(--qbit-service-border);
    border-radius: 10px;
    background: #f7fafc;
}

.qbit-service-contact-card h3 {
    margin: 0;
    font-size: 20px;
    font-weight: 650;
    color: #173f67;
}

.qbit-service-contact-card p {
    margin: 12px 0 20px;
    font-size: 14px;
    line-height: 1.6;
    color: #647688;
}

.qbit-service-block-button {
    display: block;
    width: 100%;
    text-align: center;
}

.qbit-service-downloads {
    display: grid;
    gap: 7px;
    margin-top: 18px;
}

.qbit-service-downloads span {
    font-size: 13px;
    color: #728397;
}

.qbit-service-downloads a {
    font-size: 13.5px;
    color: #1769aa;
    text-decoration: none;
}

.qbit-service-native-content {
    display: none;
}

.qbit-service-coming {
    height: 1px;
    overflow: hidden;
}

@media (max-width: 991px) {
    .qbit-service-hero-grid,
    .qbit-service-feature-grid {
        grid-template-columns: 1fr;
    }

    .qbit-service-option-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .qbit-service-hero h1 {
        font-size: 34px;
    }
}

@media (max-width: 575px) {
    .qbit-service-hero {
        padding: 34px 0 36px;
    }

    .qbit-service-hero h1 {
        font-size: 30px;
    }

    .qbit-service-lead {
        font-size: 15px;
    }

    .qbit-service-option-grid,
    .qbit-service-check-grid {
        grid-template-columns: 1fr;
    }

    .qbit-service-option {
        min-height: auto;
        padding-bottom: 44px;
    }

    .qbit-service-section-heading h2,
    .qbit-service-feature h2 {
        font-size: 26px;
    }
}

/* ============================================================
   QBIT SERVICES 1.41 — GEOMETRIA START
   ============================================================ */

/*
 * Contenedor propio de páginas de servicios.
 * Evita que el contenido quede pegado a los extremos
 * en resoluciones grandes y conserva margen seguro en móvil.
 */
.qbit-service-page .container-xxl {
    width: calc(100% - 48px);
    max-width: 1180px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 0;
    padding-right: 0;
}


/* HERO */

.qbit-service-hero {
    padding-top: 36px;
    padding-bottom: 34px;
}

.qbit-service-hero-grid {
    gap: 30px;
}

.qbit-service-hero-copy {
    padding-top: 10px;
    padding-bottom: 10px;
}

.qbit-service-lead {
    margin-top: 14px;
}

.qbit-service-actions {
    margin-top: 20px;
}

.qbit-service-trust {
    margin-top: 17px;
}

.qbit-service-hero-card {
    padding: 24px;
}


/* SELECTOR */

.qbit-service-selector {
    padding-top: 32px;
    padding-bottom: 36px;
}

.qbit-service-section-heading {
    margin-bottom: 20px;
}

.qbit-service-section-heading p {
    margin-top: 8px;
}

.qbit-service-option-grid {
    gap: 12px;
}

.qbit-service-option {
    min-height: 175px;
    padding: 19px 20px;
}

.qbit-service-option-number {
    margin-bottom: 16px;
}

.qbit-service-option strong {
    margin-bottom: 7px;
}


/* BLOQUE SOPORTE REMOTO */

.qbit-service-feature {
    padding-top: 38px;
    padding-bottom: 40px;
}

.qbit-service-feature-grid {
    gap: 34px;
}

.qbit-service-feature-lead {
    margin-top: 12px;
    margin-bottom: 19px;
}

.qbit-service-contact-card {
    padding: 22px;
}

.qbit-service-contact-card p {
    margin-top: 9px;
    margin-bottom: 16px;
}


/* RESPONSIVE */

@media (max-width: 991px) {

    .qbit-service-page .container-xxl {
        width: calc(100% - 36px);
    }

    .qbit-service-hero {
        padding-top: 30px;
        padding-bottom: 30px;
    }

    .qbit-service-selector {
        padding-top: 30px;
        padding-bottom: 32px;
    }

    .qbit-service-feature {
        padding-top: 34px;
        padding-bottom: 36px;
    }
}


@media (max-width: 575px) {

    .qbit-service-page .container-xxl {
        width: calc(100% - 28px);
    }

    .qbit-service-hero {
        padding-top: 25px;
        padding-bottom: 27px;
    }

    .qbit-service-selector {
        padding-top: 26px;
        padding-bottom: 28px;
    }

    .qbit-service-feature {
        padding-top: 29px;
        padding-bottom: 31px;
    }

    .qbit-service-hero-card,
    .qbit-service-contact-card {
        padding: 20px;
    }
}

/* ============================================================
   QBIT SERVICES 1.41 — GEOMETRIA END
   ============================================================ */

/* ============================================================
   QBIT SERVICES 1.47 — DETAIL SECTIONS
   ============================================================ */

.qbit-service-detail-section {
    scroll-margin-top: 145px;
    padding: 42px 0;
    border-top: 1px solid #e8eef3;
    background: #ffffff;
}

.qbit-service-detail-soft {
    background: #f6f9fb;
}

.qbit-service-detail-head {
    display: grid;
    grid-template-columns: 1.2fr .8fr;
    gap: 42px;
    align-items: end;
    margin-bottom: 24px;
}

.qbit-service-detail-head h2,
.qbit-service-business h2 {
    margin: 4px 0 0;
    font-size: 28px;
    line-height: 1.22;
    color: #183f65;
}

.qbit-service-detail-head > p,
.qbit-service-business p {
    margin: 0;
    font-size: 14.5px;
    line-height: 1.6;
    color: #63798c;
}

.qbit-service-problem-grid,
.qbit-service-warranty-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}

.qbit-service-problem-card,
.qbit-service-warranty-step {
    padding: 18px;
    border: 1px solid #dce6ef;
    border-radius: 9px;
    background: #fff;
}

.qbit-service-problem-card strong,
.qbit-service-warranty-step strong {
    display: block;
    margin-bottom: 6px;
    font-size: 15px;
    color: #20496c;
}

.qbit-service-problem-card p,
.qbit-service-warranty-step p {
    margin: 0;
    font-size: 13.5px;
    line-height: 1.55;
    color: #657a8c;
}

.qbit-service-warranty-step > span {
    display: block;
    margin-bottom: 15px;
    font-size: 13px;
    font-weight: 700;
    color: #7d99ae;
}

.qbit-service-process {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    margin-top: 16px;
    border: 1px solid #dce6ef;
    border-radius: 9px;
    overflow: hidden;
}

.qbit-service-process > span {
    display: flex;
    align-items: center;
    gap: 9px;
    min-height: 50px;
    padding: 11px 15px;
    border-right: 1px solid #dce6ef;
    background: #f8fafc;
}

.qbit-service-process > span:last-child {
    border-right: 0;
}

.qbit-service-process b {
    color: #7c9ab2;
}

.qbit-service-process strong {
    font-size: 13.5px;
    color: #315670;
}

.qbit-service-maintenance-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
}

.qbit-service-maintenance-card {
    padding: 22px;
    border: 1px solid #dce6ef;
    border-radius: 10px;
    background: #fff;
}

.qbit-service-card-kicker {
    display: inline-block;
    margin-bottom: 8px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .05em;
    color: #6f8ca3;
}

.qbit-service-maintenance-card h3 {
    margin: 0 0 15px;
    font-size: 19px;
    color: #20496c;
}

.qbit-service-maintenance-card ul {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 7px 22px;
    margin: 0;
    padding-left: 18px;
}

.qbit-service-maintenance-card li {
    font-size: 13.5px;
    line-height: 1.5;
    color: #587086;
}

.qbit-service-mode-row {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
    margin-top: 16px;
}

.qbit-service-mode-row > span {
    padding: 14px 16px;
    border: 1px solid #dce6ef;
    border-radius: 8px;
    background: #fff;
    font-size: 13px;
    color: #6b8091;
}

.qbit-service-mode-row strong {
    display: block;
    margin-bottom: 3px;
    font-size: 14px;
    color: #284f70;
}

.qbit-service-notice {
    display: flex;
    gap: 14px;
    margin-top: 16px;
    padding: 14px 16px;
    border: 1px solid #dce6ef;
    border-radius: 8px;
    background: #f7fafc;
}

.qbit-service-notice strong {
    flex: 0 0 auto;
    color: #244d70;
}

.qbit-service-notice p {
    margin: 0;
    font-size: 13px;
    line-height: 1.5;
    color: #687e90;
}

.qbit-service-section-action {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    margin-top: 18px;
    padding-top: 17px;
    border-top: 1px solid #e3eaf0;
}

.qbit-service-section-action > div {
    display: grid;
    gap: 3px;
}

.qbit-service-section-action strong {
    font-size: 14.5px;
    color: #244c6d;
}

.qbit-service-section-action span {
    font-size: 13.5px;
    color: #6d8193;
}

.qbit-service-business {
    padding: 40px 0;
    background: #eef4f8;
}

.qbit-service-business-box {
    display: grid;
    grid-template-columns: 1fr .9fr auto;
    gap: 30px;
    align-items: center;
    padding: 26px;
    border: 1px solid #d7e3ec;
    border-radius: 10px;
    background: #fff;
}

.qbit-service-business-list {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 7px 18px;
}

.qbit-service-business-list span {
    font-size: 13.5px;
    color: #4f6b81;
}

@media (max-width: 991px) {

    .qbit-service-detail-head,
    .qbit-service-business-box {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .qbit-service-problem-grid,
    .qbit-service-warranty-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .qbit-service-maintenance-card ul {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 575px) {

    .qbit-service-detail-section {
        scroll-margin-top: 110px;
        padding: 31px 0;
    }

    .qbit-service-problem-grid,
    .qbit-service-warranty-grid,
    .qbit-service-maintenance-grid,
    .qbit-service-mode-row,
    .qbit-service-process {
        grid-template-columns: 1fr;
    }

    .qbit-service-process > span {
        border-right: 0;
        border-bottom: 1px solid #dce6ef;
    }

    .qbit-service-process > span:last-child {
        border-bottom: 0;
    }

    .qbit-service-section-action {
        align-items: stretch;
        flex-direction: column;
    }

    .qbit-service-section-action .btn {
        width: 100%;
    }

    .qbit-service-business-list {
        grid-template-columns: 1fr;
    }
}

/* ============================================================
   QBIT SERVICES 1.48 — COMPACTACION
   ============================================================ */

.qbit-service-detail-section {
    padding-top: 34px;
    padding-bottom: 34px;
}

.qbit-service-detail-head {
    margin-bottom: 18px;
}

.qbit-service-problem-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}

.qbit-service-problem-card {
    padding: 15px 16px;
}

.qbit-service-process {
    margin-top: 13px;
}

.qbit-service-maintenance-card {
    padding: 19px 20px;
}

.qbit-service-maintenance-card ul {
    gap: 6px 18px;
}

.qbit-service-inline-note {
    margin: 14px 0 0;
    font-size: 13.5px;
    line-height: 1.5;
    color: #647b8e;
}

.qbit-service-warranty-grid {
    gap: 10px;
}

.qbit-service-warranty-step {
    padding: 16px;
}

.qbit-service-section-action {
    margin-top: 14px;
    padding-top: 14px;
}

@media (max-width: 991px) {

    .qbit-service-problem-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 575px) {

    .qbit-service-detail-section {
        padding-top: 28px;
        padding-bottom: 28px;
    }

    .qbit-service-problem-grid {
        grid-template-columns: 1fr;
    }
}

/* ============================================================
   QBIT SERVICES 1.49 — SOPORTE REMOTO COMO HERO
   ============================================================ */

.qbit-service-feature-primary {
    padding-top: 38px;
    padding-bottom: 38px;
    border-top: 0;
    background: #eef3f7;
}

.qbit-service-feature-primary .qbit-service-feature-grid {
    align-items: center;
}

.qbit-service-feature-primary h2 {
    margin-top: 5px;
    font-size: 30px;
    line-height: 1.18;
}

.qbit-service-feature-primary .qbit-service-feature-lead {
    max-width: 720px;
    font-size: 15px;
    line-height: 1.6;
}

.qbit-service-feature-primary .qbit-service-contact-card {
    background: #ffffff;
}

@media (max-width: 575px) {

    .qbit-service-feature-primary {
        padding-top: 28px;
        padding-bottom: 30px;
    }

    .qbit-service-feature-primary h2 {
        font-size: 27px;
    }
}

/* ============================================================
   QBIT SERVICES 1.52 — IMAGEN ATENCION REMOTA
   ============================================================ */

.qbit-service-remote-visual {
    display: grid;
    gap: 12px;
}

.qbit-service-remote-image {
    display: block;
    width: 100%;
    height: 220px;
    object-fit: cover;
    object-position: center right;
    border: 1px solid #d7e3ec;
    border-radius: 11px;
    background: #fff;
}

.qbit-service-remote-visual .qbit-service-contact-card {
    padding: 18px 20px;
}

.qbit-service-remote-visual .qbit-service-contact-card p {
    margin-bottom: 12px;
}

@media (max-width: 991px) {

    .qbit-service-remote-image {
        height: 260px;
    }
}

@media (max-width: 575px) {

    .qbit-service-remote-image {
        height: 200px;
    }
}

/* ============================================================
   QBIT SERVICES 1.53 — IMAGEN REMOTA
   ============================================================ */

.qbit-service-contact-card .qbit-service-remote-image {
    display: block;
    width: 100%;
    height: 185px;
    margin: -4px 0 18px;
    object-fit: cover;
    object-position: center right;
    border-radius: 8px;
}

@media (max-width: 991px) {

    .qbit-service-contact-card .qbit-service-remote-image {
        height: 240px;
    }
}

@media (max-width: 575px) {

    .qbit-service-contact-card .qbit-service-remote-image {
        height: 190px;
        margin-bottom: 16px;
    }
}

/* ============================================================
   QBIT SERVICES 1.54 — REMOTE HERO LATERAL
   ============================================================ */

#soporte-remoto.qbit-service-feature {
    padding: 30px 0;
    background: #eef3f7;
}

#soporte-remoto .qbit-service-feature-grid {
    grid-template-columns: minmax(0, 1.08fr) minmax(420px, .92fr);
    gap: 34px;
    align-items: stretch;
}

#soporte-remoto .qbit-service-feature-grid > div:first-child {
    align-self: center;
    padding: 8px 0;
}

#soporte-remoto .qbit-service-feature-lead {
    max-width: 690px;
    margin-top: 10px;
    margin-bottom: 16px;
}

#soporte-remoto .qbit-service-check-grid {
    margin-top: 14px;
    margin-bottom: 0;
}


/* LATERAL DERECHO */

.qbit-service-remote-media {
    position: relative;
    min-height: 330px;
    overflow: hidden;
    border-radius: 12px;
    background: #dce8f1;
}

.qbit-service-remote-photo {
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(
            90deg,
            rgba(238,243,247,.92) 0%,
            rgba(238,243,247,.48) 18%,
            rgba(238,243,247,.08) 42%,
            rgba(238,243,247,0) 64%
        ),
        url("/out/qbit/img/services/atencion-remota.png");

    background-size: cover;
    background-position: center right;
    background-repeat: no-repeat;
}


/* DIFUMINADO SUAVE EN BORDE IZQUIERDO */

.qbit-service-remote-media::before {
    content: "";
    position: absolute;
    z-index: 1;
    top: 0;
    bottom: 0;
    left: 0;
    width: 30%;
    pointer-events: none;

    background: linear-gradient(
        90deg,
        #eef3f7 0%,
        rgba(238,243,247,.78) 35%,
        rgba(238,243,247,0) 100%
    );
}


/* CARD SUPERPUESTA */

.qbit-service-remote-media .qbit-service-contact-card {
    position: absolute;
    z-index: 2;

    right: 18px;
    bottom: 18px;

    width: min(330px, calc(100% - 36px));

    padding: 16px 18px;

    border: 1px solid rgba(214,226,235,.96);
    border-radius: 10px;

    background: rgba(255,255,255,.94);

    box-shadow:
        0 8px 24px rgba(22,55,85,.10);

    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
}

.qbit-service-remote-media .qbit-service-contact-card h3 {
    margin-top: 0;
    margin-bottom: 7px;
}

.qbit-service-remote-media .qbit-service-contact-card p {
    margin-bottom: 11px;
}

.qbit-service-remote-media
.qbit-service-block-button {
    min-height: 40px;
}


/* YA NO SE USA COMO IMG INLINE */

.qbit-service-contact-card .qbit-service-remote-image {
    display: none !important;
}


/* RESPONSIVE */

@media (max-width: 991px) {

    #soporte-remoto .qbit-service-feature-grid {
        grid-template-columns: 1fr;
        gap: 22px;
    }

    .qbit-service-remote-media {
        min-height: 380px;
    }

    .qbit-service-remote-photo {
        background-image:
            linear-gradient(
                180deg,
                rgba(238,243,247,0) 45%,
                rgba(238,243,247,.30) 70%,
                rgba(238,243,247,.65) 100%
            ),
            url("/out/qbit/img/services/atencion-remota.png");
    }

    .qbit-service-remote-media::before {
        display: none;
    }
}


@media (max-width: 575px) {

    #soporte-remoto.qbit-service-feature {
        padding: 24px 0 26px;
    }

    .qbit-service-remote-media {
        min-height: 390px;
    }

    .qbit-service-remote-media
    .qbit-service-contact-card {
        right: 12px;
        bottom: 12px;
        width: calc(100% - 24px);
    }
}

/* ============================================================
   QBIT SERVICES 1.55 — REMOTE MEDIA SIN OVERLAY
   ============================================================ */

#soporte-remoto.qbit-service-feature {
    padding-top: 28px;
    padding-bottom: 30px;
}

#soporte-remoto .qbit-service-feature-grid {
    grid-template-columns: minmax(0, 1.05fr) minmax(430px, .95fr);
    gap: 34px;
    align-items: start;
}

#soporte-remoto .qbit-service-feature-grid > div:first-child {
    align-self: start;
    padding-top: 14px;
}

#soporte-remoto .qbit-service-feature-lead {
    margin-top: 9px;
    margin-bottom: 14px;
}

#soporte-remoto .qbit-service-check-grid {
    margin-top: 12px;
}


/* CONTENEDOR DERECHO */

.qbit-service-remote-media {
    position: relative;
    display: grid;
    gap: 12px;

    min-height: 0;
    overflow: visible;

    border-radius: 0;
    background: transparent;
}


/* IMAGEN COMPLETA */

.qbit-service-remote-photo {
    position: relative;
    inset: auto;

    width: 100%;
    height: 245px;

    overflow: hidden;

    border: 1px solid #d7e3ec;
    border-radius: 11px;

    background-image:
        linear-gradient(
            90deg,
            rgba(238,243,247,.45) 0%,
            rgba(238,243,247,.16) 18%,
            rgba(238,243,247,0) 38%
        ),
        url("/out/qbit/img/services/atencion-remota.png");

    background-size: cover;
    background-position: center right;
    background-repeat: no-repeat;
}


/* RETIRAR EL PSEUDO DIFUMINADO ANTERIOR */

.qbit-service-remote-media::before {
    display: none;
}


/* CARD DEBAJO, YA NO SUPERPUESTA */

.qbit-service-remote-media .qbit-service-contact-card {
    position: relative;

    right: auto;
    bottom: auto;

    width: 100%;

    padding: 15px 18px;

    border: 1px solid #d7e3ec;
    border-radius: 10px;

    background: #ffffff;

    box-shadow: none;

    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}

.qbit-service-remote-media .qbit-service-contact-card h3 {
    margin-top: 0;
    margin-bottom: 5px;
}

.qbit-service-remote-media .qbit-service-contact-card p {
    margin-top: 0;
    margin-bottom: 10px;
}

.qbit-service-remote-media .qbit-service-downloads {
    margin-top: 10px;
}


/* RESPONSIVE */

@media (max-width: 991px) {

    #soporte-remoto .qbit-service-feature-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .qbit-service-remote-photo {
        height: 300px;
    }
}

@media (max-width: 575px) {

    #soporte-remoto.qbit-service-feature {
        padding-top: 23px;
        padding-bottom: 25px;
    }

    .qbit-service-remote-photo {
        height: 215px;
    }

    .qbit-service-remote-media .qbit-service-contact-card {
        width: 100%;
        padding: 15px;
    }
}

/* ============================================================
   QBIT SERVICES 1.56 — WHATSAPP + DESCARGAS
   ============================================================ */

.qbit-service-whatsapp-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;

    background: #25D366;
    border-color: #25D366;
    color: #ffffff !important;
}

.qbit-service-whatsapp-button:hover,
.qbit-service-whatsapp-button:focus {
    background: #1ebe5b;
    border-color: #1ebe5b;
    color: #ffffff !important;
}

.qbit-service-whatsapp-icon {
    display: inline-flex;
    width: 18px;
    height: 18px;
    flex: 0 0 18px;
}

.qbit-service-whatsapp-icon svg {
    width: 100%;
    height: 100%;
    display: block;
}

.qbit-service-download-links {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 14px;
    align-items: center;
    margin-top: 8px;
}

.qbit-service-download-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;

    font-size: 14px;
    font-weight: 500;
    color: #1f5f96;
    text-decoration: none;
}

.qbit-service-download-link:hover,
.qbit-service-download-link:focus {
    text-decoration: underline;
}

.qbit-service-download-icon {
    display: inline-flex;
    width: 16px;
    height: 16px;
    flex: 0 0 16px;
    color: #5d7890;
}

.qbit-service-download-icon svg {
    width: 100%;
    height: 100%;
    display: block;
}

@media (max-width: 575px) {

    .qbit-service-download-links {
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
    }
}

/* ============================================================
   QBIT SERVICES 1.57 — CARD REMOTA INTEGRADA EN IMAGEN
   ============================================================ */

#soporte-remoto .qbit-service-feature-grid {
    align-items: center;
}

.qbit-service-remote-media {
    position: relative;
    min-height: 320px;
}

.qbit-service-remote-photo {
    position: relative;
    width: 100%;
    height: 320px;
    overflow: hidden;
    border: 1px solid #d7e3ec;
    border-radius: 12px;

    background-image:
        linear-gradient(
            90deg,
            rgba(238,243,247,.82) 0%,
            rgba(238,243,247,.58) 20%,
            rgba(238,243,247,.26) 38%,
            rgba(238,243,247,.06) 56%,
            rgba(238,243,247,0) 72%
        ),
        url("/out/qbit/img/services/atencion-remota.png");

    background-size: cover;
    background-position: center right;
    background-repeat: no-repeat;
}

.qbit-service-remote-media .qbit-service-contact-card {
    position: absolute;
    z-index: 3;

    top: 18px;
    left: 18px;
    right: auto;
    bottom: auto;

    width: min(330px, calc(100% - 36px));
    max-width: 330px;

    padding: 14px 16px;

    border: 1px solid rgba(214,226,235,.95);
    border-radius: 10px;

    background: rgba(255,255,255,.90);

    box-shadow: 0 10px 24px rgba(19, 49, 77, .10);

    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
}

.qbit-service-remote-media .qbit-service-contact-card h3 {
    margin: 0 0 6px;
    font-size: 17px;
    line-height: 1.2;
}

.qbit-service-remote-media .qbit-service-contact-card p {
    margin: 0 0 10px;
    font-size: 13.5px;
    line-height: 1.45;
}

.qbit-service-remote-media .qbit-service-block-button,
.qbit-service-whatsapp-button {
    min-height: 40px;
    padding: 10px 14px;
    border-radius: 8px;
    font-size: 14.5px;
    line-height: 1.2;
}

.qbit-service-whatsapp-icon {
    width: 17px;
    height: 17px;
    flex: 0 0 17px;
}

.qbit-service-remote-media .qbit-service-downloads {
    margin-top: 10px;
}

.qbit-service-remote-media .qbit-service-downloads > span {
    display: block;
    margin-bottom: 8px;
    font-size: 13px;
    line-height: 1.35;
    color: #677f92;
}

.qbit-service-download-links {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 14px;
    align-items: center;
    margin-top: 0;
}

.qbit-service-download-link {
    font-size: 13.5px;
    line-height: 1.2;
}

.qbit-service-download-icon {
    width: 15px;
    height: 15px;
    flex: 0 0 15px;
}

/* Evitar que se vea la card como bloque separado debajo */
.qbit-service-remote-media > .qbit-service-contact-card {
    margin-top: 0;
}

/* TABLET / MOBILE */
@media (max-width: 991px) {

    .qbit-service-remote-media {
        min-height: 360px;
    }

    .qbit-service-remote-photo {
        height: 360px;
        background-image:
            linear-gradient(
                180deg,
                rgba(238,243,247,.70) 0%,
                rgba(238,243,247,.35) 26%,
                rgba(238,243,247,.08) 52%,
                rgba(238,243,247,0) 72%
            ),
            url("/out/qbit/img/services/atencion-remota.png");
    }

    .qbit-service-remote-media .qbit-service-contact-card {
        top: 14px;
        left: 14px;
        width: min(340px, calc(100% - 28px));
        max-width: none;
    }
}

@media (max-width: 575px) {

    .qbit-service-remote-media {
        min-height: 390px;
    }

    .qbit-service-remote-photo {
        height: 390px;
    }

    .qbit-service-remote-media .qbit-service-contact-card {
        top: 12px;
        left: 12px;
        width: calc(100% - 24px);
        padding: 13px 14px;
    }

    .qbit-service-download-links {
        gap: 8px 12px;
    }
}

/* ============================================================
   QBIT SERVICES 1.58 — CARD REMOTA SEMITRANSPARENTE
   ============================================================ */

.qbit-service-remote-media .qbit-service-contact-card {
    background: rgba(255,255,255,.78);

    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);

    border-color: rgba(210,224,234,.82);

    box-shadow:
        0 10px 26px rgba(19,49,77,.10);
}

/* ============================================================
   QBIT SERVICES 1.58A — CARD REMOTA MAS TRANSPARENTE
   ============================================================ */

.qbit-service-remote-media .qbit-service-contact-card {
    background: rgba(255,255,255,.66);
    backdrop-filter: blur(7px);
    -webkit-backdrop-filter: blur(7px);
    border-color: rgba(210,224,234,.72);
}

/* ============================================================
   QBIT SERVICES 1.59 — MINI-CARDS EN SOPORTE REMOTO
   ============================================================ */

.qbit-service-mini-cards {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    margin-top: 16px;
    max-width: 760px;
}

.qbit-service-mini-card {
    display: flex;
    flex-direction: column;
    gap: 6px;

    min-height: 118px;
    padding: 14px 15px;

    border: 1px solid #d7e3ec;
    border-radius: 10px;

    background: rgba(255,255,255,.72);
    text-decoration: none;

    transition:
        transform .18s ease,
        box-shadow .18s ease,
        border-color .18s ease,
        background .18s ease;
}

.qbit-service-mini-card:hover,
.qbit-service-mini-card:focus {
    transform: translateY(-1px);
    border-color: #b9d0e1;
    background: rgba(255,255,255,.86);
    box-shadow: 0 8px 18px rgba(19,49,77,.08);
    text-decoration: none;
}

.qbit-service-mini-card.is-active {
    border-color: #c8d9e6;
    background: rgba(255,255,255,.80);
}

.qbit-service-mini-card-number {
    display: inline-block;
    font-size: 12px;
    font-weight: 700;
    line-height: 1;
    color: #7c9ab4;
    letter-spacing: .04em;
}

.qbit-service-mini-card strong {
    display: block;
    margin: 0;
    font-size: 15px;
    line-height: 1.28;
    color: #163f68;
}

.qbit-service-mini-card small {
    display: block;
    margin: 0;
    font-size: 13px;
    line-height: 1.45;
    color: #5f778a;
}

@media (max-width: 991px) {

    .qbit-service-mini-cards {
        max-width: none;
    }
}

@media (max-width: 575px) {

    .qbit-service-mini-cards {
        grid-template-columns: 1fr;
        gap: 10px;
    }

    .qbit-service-mini-card {
        min-height: 0;
        padding: 13px 14px;
    }
}

/* ============================================================
   QBIT SERVICES 1.60 — MINI-CARDS COMPACTAS
   ============================================================ */

#soporte-remoto .qbit-service-feature-grid {
    align-items: stretch;
}


/* Igualar altura útil del lado izquierdo al bloque visual derecho */

#soporte-remoto .qbit-service-feature-grid > div:first-child {
    display: flex;
    flex-direction: column;
    min-height: 320px;
    padding-top: 0;
    padding-bottom: 0;
}


/* Texto principal más compacto */

#soporte-remoto .qbit-service-feature-lead {
    margin-top: 8px;
    margin-bottom: 12px;
}


/* Grid de cards */

.qbit-service-mini-cards {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px;

    width: 100%;
    max-width: none;

    margin-top: auto;
}


/* Cards más chicas */

.qbit-service-mini-card {
    gap: 4px;

    min-height: 0;
    padding: 10px 12px;

    border-radius: 8px;
}


/* Numeración */

.qbit-service-mini-card-number {
    font-size: 11.5px;
    line-height: 1;
}


/* Título */

.qbit-service-mini-card strong {
    margin: 0;
    font-size: 14px;
    line-height: 1.22;
}


/* Descripción completa pero compacta */

.qbit-service-mini-card small {
    margin: 0;

    font-size: 12.5px;
    line-height: 1.38;

    color: #5f778a;
}


/* Evitar altura extra por hover */

.qbit-service-mini-card:hover,
.qbit-service-mini-card:focus {
    transform: none;
}


/* Responsive */

@media (max-width: 991px) {

    #soporte-remoto .qbit-service-feature-grid > div:first-child {
        min-height: 0;
    }

    .qbit-service-mini-cards {
        margin-top: 14px;
    }
}


@media (max-width: 575px) {

    .qbit-service-mini-cards {
        grid-template-columns: 1fr;
    }

    .qbit-service-mini-card {
        padding: 10px 11px;
    }
}

/* ============================================================
   QBIT SERVICES 1.61 — ALINEACION CARDS / IMAGEN
   ============================================================ */

#soporte-remoto .qbit-service-feature-grid {
    align-items: stretch;
}

#soporte-remoto .qbit-service-feature-grid > div:first-child {
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 320px;
}

#soporte-remoto .qbit-service-mini-cards {
    margin-top: auto;
}

#soporte-remoto .qbit-service-mini-card {
    padding-top: 12px;
    padding-bottom: 12px;
}

#soporte-remoto .qbit-service-remote-media,
#soporte-remoto .qbit-service-remote-photo {
    height: 100%;
    min-height: 320px;
}

@media (max-width: 991px) {

    #soporte-remoto .qbit-service-feature-grid > div:first-child {
        min-height: 0;
    }

    #soporte-remoto .qbit-service-remote-media,
    #soporte-remoto .qbit-service-remote-photo {
        height: auto;
        min-height: 360px;
    }
}

/* ============================================================
   QBIT SERVICES 1.64 — IMAGENES CARDS DIAGNOSTICO
   ============================================================ */

.qbit-service-problem-card {
    position: relative;
    overflow: hidden;
    isolation: isolate;

    min-height: 126px;

    padding-right: 42%;
}


/*
 * Capa visual lateral.
 * La imagen queda justificada a la derecha y desaparece
 * progresivamente hacia la izquierda.
 */
.qbit-service-problem-card::after {
    content: "";

    position: absolute;
    z-index: -1;

    top: 0;
    right: 0;
    bottom: 0;

    width: 58%;

    background-position: center right;
    background-repeat: no-repeat;
    background-size: cover;

    opacity: .90;

    -webkit-mask-image:
        linear-gradient(
            90deg,
            transparent 0%,
            rgba(0,0,0,.10) 12%,
            rgba(0,0,0,.55) 34%,
            #000 62%,
            #000 100%
        );

    mask-image:
        linear-gradient(
            90deg,
            transparent 0%,
            rgba(0,0,0,.10) 12%,
            rgba(0,0,0,.55) 34%,
            #000 62%,
            #000 100%
        );
}


/* 1 — Equipo lento */

.qbit-service-problem-card:nth-child(1)::after {
    background-image:
        url("/out/qbit/img/services/diagnostico/equipo-lento.png");
}


/* 2 — No enciende o no inicia */

.qbit-service-problem-card:nth-child(2)::after {
    background-image:
        url("/out/qbit/img/services/diagnostico/no-enciende.png");
}


/* 3 — Errores de Windows */

.qbit-service-problem-card:nth-child(3)::after {
    background-image:
        url("/out/qbit/img/services/diagnostico/errores-windows.png");
}


/* 4 — Disco, SSD o memoria */

.qbit-service-problem-card:nth-child(4)::after {
    background-image:
        url("/out/qbit/img/services/diagnostico/disco-ssd-memoria.png");
}


/* 5 — Sobrecalentamiento */

.qbit-service-problem-card:nth-child(5)::after {
    background-image:
        url("/out/qbit/img/services/diagnostico/sobrecalentamiento.png");
}


/* 6 — Red, pantalla y periféricos */

.qbit-service-problem-card:nth-child(6)::after {
    background-image:
        url("/out/qbit/img/services/diagnostico/red-pantalla-perifericos.png");
}


/*
 * Suavizar zona donde está el texto.
 */
.qbit-service-problem-card::before {
    content: "";

    position: absolute;
    z-index: -1;

    inset: 0;

    background:
        linear-gradient(
            90deg,
            #ffffff 0%,
            rgba(255,255,255,.98) 38%,
            rgba(255,255,255,.82) 55%,
            rgba(255,255,255,.12) 78%,
            rgba(255,255,255,0) 100%
        );
}


.qbit-service-problem-card strong,
.qbit-service-problem-card p {
    position: relative;
    z-index: 2;
}


/* TABLET */

@media (max-width: 991px) {

    .qbit-service-problem-card {
        padding-right: 38%;
    }

    .qbit-service-problem-card::after {
        width: 52%;
    }
}


/* MOVIL */

@media (max-width: 575px) {

    .qbit-service-problem-card {
        min-height: 132px;
        padding-right: 34%;
    }

    .qbit-service-problem-card::after {
        width: 48%;
    }

    .qbit-service-problem-card::before {
        background:
            linear-gradient(
                90deg,
                #ffffff 0%,
                rgba(255,255,255,.98) 46%,
                rgba(255,255,255,.72) 67%,
                rgba(255,255,255,0) 100%
            );
    }
}

/* ============================================================
   QBIT SERVICES 1.64C — IMAGENES MAS A LA DERECHA
   ============================================================ */

.qbit-service-problem-card {
    padding-right: 24%;
}

.qbit-service-problem-card::after {
    right: 0;
    left: auto;
    width: 40%;

    background-position: right center;
    background-size: contain;

    -webkit-mask-image:
        linear-gradient(
            90deg,
            transparent 0%,
            rgba(0,0,0,.02) 18%,
            rgba(0,0,0,.18) 34%,
            rgba(0,0,0,.62) 58%,
            #000 78%,
            #000 100%
        );

    mask-image:
        linear-gradient(
            90deg,
            transparent 0%,
            rgba(0,0,0,.02) 18%,
            rgba(0,0,0,.18) 34%,
            rgba(0,0,0,.62) 58%,
            #000 78%,
            #000 100%
        );
}

.qbit-service-problem-card::before {
    background:
        linear-gradient(
            90deg,
            #ffffff 0%,
            rgba(255,255,255,.99) 46%,
            rgba(255,255,255,.94) 63%,
            rgba(255,255,255,.72) 77%,
            rgba(255,255,255,.22) 90%,
            rgba(255,255,255,0) 100%
        );
}

@media (max-width: 991px) {

    .qbit-service-problem-card {
        padding-right: 22%;
    }

    .qbit-service-problem-card::after {
        width: 36%;
    }
}

@media (max-width: 575px) {

    .qbit-service-problem-card {
        padding-right: 18%;
    }

    .qbit-service-problem-card::after {
        width: 32%;
    }

    .qbit-service-problem-card::before {
        background:
            linear-gradient(
                90deg,
                #ffffff 0%,
                rgba(255,255,255,.99) 58%,
                rgba(255,255,255,.78) 82%,
                rgba(255,255,255,0) 100%
            );
    }
}

/* ============================================================
   QBIT SERVICES 1.64D — IMAGENES MAS GRANDES
   ============================================================ */

.qbit-service-problem-card {
    padding-right: 27%;
}

.qbit-service-problem-card::after {
    right: -7%;
    width: 52%;

    background-size: cover;
    background-position: center right;
}

.qbit-service-problem-card::before {
    background:
        linear-gradient(
            90deg,
            #ffffff 0%,
            rgba(255,255,255,.99) 45%,
            rgba(255,255,255,.92) 60%,
            rgba(255,255,255,.60) 75%,
            rgba(255,255,255,.12) 90%,
            rgba(255,255,255,0) 100%
        );
}

@media (max-width: 991px) {

    .qbit-service-problem-card {
        padding-right: 25%;
    }

    .qbit-service-problem-card::after {
        right: -6%;
        width: 48%;
    }
}

@media (max-width: 575px) {

    .qbit-service-problem-card {
        padding-right: 22%;
    }

    .qbit-service-problem-card::after {
        right: -8%;
        width: 44%;
    }
}

/* ============================================================
   QBIT SERVICES 1.64E — MOVER IMAGENES A LA DERECHA
   ============================================================ */

.qbit-service-problem-card::after {
    right: -12%;
    width: 52%;
    background-position: right center;
}

@media (max-width: 991px) {
    .qbit-service-problem-card::after {
        right: -10%;
    }
}

@media (max-width: 575px) {
    .qbit-service-problem-card::after {
        right: -8%;
    }
}

/* ============================================================
   QBIT SERVICES 1.64F — IMAGENES MUCHO MAS A LA DERECHA
   ============================================================ */

.qbit-service-problem-card::after {
    right: -22%;
    width: 58%;
    background-position: right center;
    background-size: cover;
}

.qbit-service-problem-card::before {
    background:
        linear-gradient(
            90deg,
            #ffffff 0%,
            rgba(255,255,255,.995) 48%,
            rgba(255,255,255,.95) 66%,
            rgba(255,255,255,.68) 82%,
            rgba(255,255,255,.18) 93%,
            rgba(255,255,255,0) 100%
        );
}

@media (max-width: 991px) {
    .qbit-service-problem-card::after {
        right: -18%;
        width: 54%;
    }
}

@media (max-width: 575px) {
    .qbit-service-problem-card::after {
        right: -12%;
        width: 48%;
    }
}

/* ============================================================
   QBIT SERVICES 1.64G — MAS A LA DERECHA Y MENOS DIFUMINADO
   ============================================================ */

.qbit-service-problem-card::after {
    right: -26%;
    width: 60%;
    background-position: right center;
    background-size: cover;

    -webkit-mask-image:
        linear-gradient(
            90deg,
            transparent 0%,
            rgba(0,0,0,.10) 22%,
            rgba(0,0,0,.42) 38%,
            rgba(0,0,0,.82) 56%,
            #000 70%,
            #000 100%
        );

    mask-image:
        linear-gradient(
            90deg,
            transparent 0%,
            rgba(0,0,0,.10) 22%,
            rgba(0,0,0,.42) 38%,
            rgba(0,0,0,.82) 56%,
            #000 70%,
            #000 100%
        );
}

.qbit-service-problem-card::before {
    background:
        linear-gradient(
            90deg,
            #ffffff 0%,
            rgba(255,255,255,.992) 46%,
            rgba(255,255,255,.88) 61%,
            rgba(255,255,255,.42) 76%,
            rgba(255,255,255,.08) 89%,
            rgba(255,255,255,0) 100%
        );
}

@media (max-width: 991px) {
    .qbit-service-problem-card::after {
        right: -20%;
        width: 56%;
    }
}

@media (max-width: 575px) {
    .qbit-service-problem-card::after {
        right: -14%;
        width: 50%;
    }

    .qbit-service-problem-card::before {
        background:
            linear-gradient(
                90deg,
                #ffffff 0%,
                rgba(255,255,255,.99) 54%,
                rgba(255,255,255,.66) 78%,
                rgba(255,255,255,0) 100%
            );
    }
}

/* ============================================================
   QBIT SERVICES 1.65 — SVG CLAROS A LA DERECHA
   ============================================================ */

/* Desactivar fondos difuminados previos */
.qbit-service-problem-card::before,
.qbit-service-problem-card::after {
    content: none !important;
    display: none !important;
}

/* Card con SVG fijo a la derecha */
.qbit-service-problem-card {
    position: relative;
    overflow: hidden;

    min-height: 154px;
    padding: 18px 190px 18px 22px;

    background-color: #ffffff;
    background-repeat: no-repeat;
    background-position: right 14px center;
    background-size: 168px auto;
}

/* 1 */
.qbit-service-problem-card:nth-child(1) {
    background-image: url("/out/qbit/img/services/diagnostico-svg/equipo-lento.svg");
}

/* 2 */
.qbit-service-problem-card:nth-child(2) {
    background-image: url("/out/qbit/img/services/diagnostico-svg/no-enciende.svg");
}

/* 3 */
.qbit-service-problem-card:nth-child(3) {
    background-image: url("/out/qbit/img/services/diagnostico-svg/errores-windows.svg");
}

/* 4 */
.qbit-service-problem-card:nth-child(4) {
    background-image: url("/out/qbit/img/services/diagnostico-svg/disco-ssd-memoria.svg");
}

/* 5 */
.qbit-service-problem-card:nth-child(5) {
    background-image: url("/out/qbit/img/services/diagnostico-svg/sobrecalentamiento.svg");
}

/* 6 */
.qbit-service-problem-card:nth-child(6) {
    background-image: url("/out/qbit/img/services/diagnostico-svg/red-pantalla-perifericos.svg");
}

/* Refinar tipografía de este bloque */
.qbit-service-problem-card strong {
    display: block;
    margin-bottom: 8px;
}

.qbit-service-problem-card p {
    margin: 0;
}

/* Tablet */
@media (max-width: 991px) {
    .qbit-service-problem-card {
        min-height: 148px;
        padding-right: 164px;
        background-size: 144px auto;
        background-position: right 10px center;
    }
}

/* Móvil */
@media (max-width: 575px) {
    .qbit-service-problem-card {
        min-height: 132px;
        padding: 16px 118px 16px 16px;
        background-size: 104px auto;
        background-position: right 8px center;
    }
}

/* ============================================================
   QBIT SERVICES 1.66 — PROCESO DIAGNOSTICO
   ============================================================ */

.qbit-service-process {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));

    margin-top: 14px;

    overflow: hidden;

    border: 1px solid #d9e4ed;
    border-radius: 10px;

    background: #ffffff;
}


/* Cada paso */

.qbit-service-process > span {
    display: grid;
    grid-template-columns: auto 1fr;
    grid-template-rows: auto auto;
    column-gap: 9px;
    row-gap: 3px;

    align-items: start;

    min-height: 88px;

    padding: 14px 16px;

    border-right: 1px solid rgba(166,187,204,.34);
}


/* 1 — Diagnóstico */

.qbit-service-process > span:nth-child(1) {
    background: #eef7ff;
}


/* 2 — Propuesta */

.qbit-service-process > span:nth-child(2) {
    background: #fff9e8;
}


/* 3 — Autorización */

.qbit-service-process > span:nth-child(3) {
    background: #f5f1ff;
}


/* 4 — Reparación */

.qbit-service-process > span:nth-child(4) {
    background: #eefaf3;
    border-right: 0;
}


/* Número */

.qbit-service-process > span > b {
    grid-row: 1 / 3;

    display: flex;
    align-items: center;
    justify-content: center;

    width: 26px;
    height: 26px;

    border-radius: 50%;

    font-size: 13px;
    font-weight: 700;

    background: rgba(255,255,255,.78);
    color: #527794;
}


/* Colores representativos del número */

.qbit-service-process > span:nth-child(1) > b {
    color: #2778bd;
    background: #dceeff;
}

.qbit-service-process > span:nth-child(2) > b {
    color: #a77608;
    background: #ffedb8;
}

.qbit-service-process > span:nth-child(3) > b {
    color: #7655b7;
    background: #e7ddff;
}

.qbit-service-process > span:nth-child(4) > b {
    color: #30845b;
    background: #d9f2e4;
}


/* Título */

.qbit-service-process > span > strong {
    display: block;

    margin: 1px 0 0;

    font-size: 14px;
    line-height: 1.25;

    color: #234a69;
}


/* Descripción */

.qbit-service-process-description {
    display: block;

    grid-column: 2;

    margin: 0;

    max-width: 230px;

    font-size: 12.5px;
    line-height: 1.38;
    font-weight: 400;

    color: #61798b;
}


/* Responsive */

@media (max-width: 991px) {

    .qbit-service-process {
        grid-template-columns: repeat(2, 1fr);
    }

    .qbit-service-process > span:nth-child(2) {
        border-right: 0;
    }

    .qbit-service-process > span:nth-child(1),
    .qbit-service-process > span:nth-child(2) {
        border-bottom: 1px solid rgba(166,187,204,.34);
    }
}


@media (max-width: 575px) {

    .qbit-service-process {
        grid-template-columns: 1fr;
    }

    .qbit-service-process > span {
        min-height: 0;
        border-right: 0;
        border-bottom: 1px solid rgba(166,187,204,.34);
    }

    .qbit-service-process > span:last-child {
        border-bottom: 0;
    }

    .qbit-service-process-description {
        max-width: none;
    }
}

/* ============================================================
   QBIT SERVICES 1.67 — IMAGEN GESTION DE GARANTIAS
   ============================================================ */

#garantias .qbit-service-detail-head {
    position: relative;

    grid-template-columns:
        minmax(0, 1fr)
        minmax(360px, .78fr);

    gap: 32px;

    align-items: stretch;
}


/* Imagen ocupa lateral derecho */

#garantias .qbit-service-warranty-visual {
    grid-column: 2;
    grid-row: 1 / span 2;

    min-height: 250px;

    overflow: hidden;

    border: 1px solid #d7e3ec;
    border-radius: 11px;

    background: #f5f8fb;
}


#garantias .qbit-service-warranty-visual img {
    display: block;

    width: 100%;
    height: 100%;

    min-height: 250px;

    object-fit: cover;
    object-position: center right;
}


/* Texto queda a la izquierda */

#garantias .qbit-service-detail-head > div:not(.qbit-service-warranty-visual) {
    grid-column: 1;
}


#garantias .qbit-service-detail-head > p {
    grid-column: 1;

    align-self: start;

    max-width: 680px;
}


/* Responsive */

@media (max-width: 991px) {

    #garantias .qbit-service-detail-head {
        grid-template-columns: 1fr;
    }

    #garantias .qbit-service-warranty-visual {
        grid-column: 1;
        grid-row: auto;

        min-height: 300px;
    }

    #garantias .qbit-service-warranty-visual img {
        min-height: 300px;
    }
}


@media (max-width: 575px) {

    #garantias .qbit-service-warranty-visual {
        min-height: 210px;
    }

    #garantias .qbit-service-warranty-visual img {
        min-height: 210px;
    }
}

/* ============================================================
   QBIT SERVICES 1.68 — GARANTIAS MISMO FORMATO QUE REMOTO
   ============================================================ */

.qbit-service-feature--warranty {
    padding-top: 34px;
}

.qbit-service-feature-grid--warranty {
    align-items: stretch;
}

.qbit-service-feature--warranty .qbit-service-feature-copy {
    display: flex;
    flex-direction: column;
}

.qbit-service-feature--warranty .qbit-service-feature-lead {
    max-width: 820px;
    margin-bottom: 22px;
}


/* 4 cards pequeñas como en soporte remoto */

.qbit-service-warranty-steps {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.qbit-service-warranty-step {
    min-height: 102px;
    padding: 16px 18px;

    border: 1px solid #d8e4ed;
    border-radius: 12px;

    background: #ffffff;
}

.qbit-service-warranty-step strong {
    display: block;
    margin-bottom: 8px;

    font-size: 15px;
    line-height: 1.3;
    color: #143f6b;
}

.qbit-service-warranty-step p {
    margin: 0;

    font-size: 13.8px;
    line-height: 1.48;
    color: #5e778b;
}


/* Lado derecho con imagen y card flotante */

.qbit-service-warranty-visual {
    position: relative;

    min-height: 402px;

    overflow: hidden;

    border: 1px solid #d8e4ed;
    border-radius: 14px;

    background: #eef4f9;
}

.qbit-service-warranty-visual > img {
    display: block;

    width: 100%;
    height: 100%;

    min-height: 402px;

    object-fit: cover;
    object-position: center;
}

.qbit-service-contact-card--warranty {
    position: absolute;
    top: 22px;
    left: 22px;

    width: min(100%, 390px);

    background: rgba(255,255,255,.90);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
}

.qbit-service-downloads--warranty {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 10px;
}

.qbit-service-downloads--warranty > span:first-child {
    display: block;
    width: 100%;
}

.qbit-service-downloads--warranty > span:not(:first-child) {
    display: inline-flex;
    align-items: center;

    min-height: 32px;
    padding: 6px 10px;

    border: 1px solid #d7e3ec;
    border-radius: 999px;

    background: rgba(255,255,255,.72);

    font-size: 13px;
    line-height: 1.2;
    color: #5e778b;
}


/* Nota inferior */

.qbit-service-important-note--warranty {
    margin-top: 18px;
}


/* Responsive */

@media (max-width: 991px) {

    .qbit-service-warranty-visual {
        min-height: 360px;
    }

    .qbit-service-warranty-visual > img {
        min-height: 360px;
    }

    .qbit-service-contact-card--warranty {
        width: calc(100% - 44px);
    }
}

@media (max-width: 767px) {

    .qbit-service-warranty-steps {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 575px) {

    .qbit-service-warranty-visual {
        min-height: 300px;
    }

    .qbit-service-warranty-visual > img {
        min-height: 300px;
    }

    .qbit-service-contact-card--warranty {
        top: 14px;
        left: 14px;
        width: calc(100% - 28px);
    }
}

/* ============================================================
   QBIT SERVICES — END
   ============================================================ */


/* =========================================================
   QBIT CHECKOUT — BILLING UNIFIED CARD 4.42A
   ---------------------------------------------------------
   OBJETIVO:
   - conservar los controles OXID reales;
   - conservar #addressForm;
   - conservar CP -> colonia;
   - conservar País -> Estado;
   - eliminar visualmente el cambio a un segundo formulario;
   - edición y lectura pertenecen a la misma tarjeta QBIT.
   ========================================================= */


/* ---------------------------------------------------------
   PANEL DE EDICIÓN
   Debe sentirse como contenido de la tarjeta, no como
   un segundo formulario independiente.
   --------------------------------------------------------- */

body.cl-user
.qbit-address-card
#qbitBillingEditPanel {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}


/* Contrato funcional OXID: se conserva #addressForm */
body.cl-user
.qbit-address-card
#qbitBillingEditPanel
#addressForm {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
}


/* ---------------------------------------------------------
   GRID PRINCIPAL
   Mantiene la lectura visual limpia de la tarjeta QBIT.
   --------------------------------------------------------- */

body.cl-user
.qbit-address-card
#qbitBillingEditPanel
.qbit-mx-billing {
    display: grid !important;
    grid-template-columns:
        repeat(12, minmax(0, 1fr)) !important;
    gap: 14px 16px !important;

    width: 100% !important;
    max-width: none !important;

    margin: 0 !important;
    padding: 4px 0 0 !important;

    border: 0 !important;
    background: transparent !important;
}


/* ---------------------------------------------------------
   DISTRIBUCIÓN
   --------------------------------------------------------- */

/* Tratamiento */
body.cl-user
#qbitBillingEditPanel
.qbit-mx-salutation {
    grid-column: span 2 !important;
}

/* Nombre */
body.cl-user
#qbitBillingEditPanel
.qbit-mx-firstname {
    grid-column: span 5 !important;
}

/* Apellido */
body.cl-user
#qbitBillingEditPanel
.qbit-mx-lastname {
    grid-column: span 5 !important;
}


/* Calle */
body.cl-user
#qbitBillingEditPanel
.qbit-mx-street {
    grid-column: span 5 !important;
}

/* Número */
body.cl-user
#qbitBillingEditPanel
.qbit-mx-streetnr {
    grid-column: span 2 !important;
}

/* CP */
body.cl-user
#qbitBillingEditPanel
.qbit-mx-zip {
    grid-column: span 2 !important;
}

/* Colonia */
body.cl-user
#qbitBillingEditPanel
.qbit-mx-colony {
    grid-column: span 3 !important;
}


/* Municipio */
body.cl-user
#qbitBillingEditPanel
.qbit-mx-city {
    grid-column: span 4 !important;
}

/* Estado */
body.cl-user
#qbitBillingEditPanel
.qbit-mx-state {
    grid-column: span 3 !important;
}

/* País */
body.cl-user
#qbitBillingEditPanel
.qbit-mx-country {
    grid-column: span 2 !important;
}

/* Celular */
body.cl-user
#qbitBillingEditPanel
.qbit-mx-mobile {
    grid-column: span 3 !important;
}


/* Teléfono alternativo */
body.cl-user
#qbitBillingEditPanel
.qbit-mx-phone {
    grid-column: span 3 !important;
}

/* Razón social */
body.cl-user
#qbitBillingEditPanel
.qbit-mx-company {
    grid-column: span 4 !important;
}

/* RFC */
body.cl-user
#qbitBillingEditPanel
.qbit-mx-rfc {
    grid-column: span 3 !important;
}

/* Referencia */
body.cl-user
#qbitBillingEditPanel
.qbit-mx-reference {
    grid-column: span 5 !important;
}


/* ---------------------------------------------------------
   CADA CAMPO
   --------------------------------------------------------- */

body.cl-user
#qbitBillingEditPanel
.qbit-mx-field {
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
}


body.cl-user
#qbitBillingEditPanel
.form-floating {
    width: 100% !important;
    margin: 0 !important;
}


/* ---------------------------------------------------------
   INPUTS / SELECTS
   Apariencia QBIT consistente con la tarjeta.
   --------------------------------------------------------- */

body.cl-user
#qbitBillingEditPanel
.form-control,

body.cl-user
#qbitBillingEditPanel
.form-select,

body.cl-user
#qbitBillingEditPanel
select.stateselect {
    width: 100% !important;

    min-height: 44px !important;
    height: 44px !important;

    padding:
        15px 12px 5px !important;

    border:
        1px solid #ced9e2 !important;

    border-radius:
        8px !important;

    background-color:
        #fff !important;

    color:
        #273b4d !important;

    font-family:
        Arial,
        Helvetica,
        sans-serif !important;

    font-size:
        14px !important;

    font-weight:
        400 !important;

    line-height:
        1.25 !important;

    box-shadow:
        none !important;
}


/* Focus discreto */
body.cl-user
#qbitBillingEditPanel
.form-control:focus,

body.cl-user
#qbitBillingEditPanel
.form-select:focus,

body.cl-user
#qbitBillingEditPanel
select.stateselect:focus {
    border-color:
        #5a9bd5 !important;

    box-shadow:
        0 0 0 2px
        rgba(8, 114, 207, .08)
        !important;
}


/* ---------------------------------------------------------
   LABELS
   --------------------------------------------------------- */

body.cl-user
#qbitBillingEditPanel
.form-floating > label {
    padding:
        8px 12px !important;

    color:
        #64798b !important;

    font-family:
        Arial,
        Helvetica,
        sans-serif !important;

    font-size:
        13px !important;

    font-weight:
        400 !important;
}


/* ---------------------------------------------------------
   MENSAJE CAMPOS OBLIGATORIOS
   --------------------------------------------------------- */

body.cl-user
#qbitBillingEditPanel
.qbit-mx-required {
    grid-column:
        1 / -1 !important;

    margin:
        2px 0 0 !important;

    padding:
        0 !important;

    color:
        #6d7e8d !important;

    font-size:
        13px !important;

    line-height:
        1.4 !important;
}


/* ---------------------------------------------------------
   ACCIONES
   --------------------------------------------------------- */

body.cl-user
.qbit-address-card
#qbitBillingEditPanel
.qbit-address-edit-actions {
    display: flex !important;
    justify-content: flex-end !important;
    align-items: center !important;
    gap: 10px !important;

    margin:
        18px 0 0 !important;

    padding:
        16px 0 0 !important;

    border-top:
        1px solid #e3e9ee !important;
}


/* Cancelar */
body.cl-user
#qbitBillingEditPanel
.qbit-address-edit-cancel {
    min-height:
        40px !important;

    padding:
        8px 16px !important;

    border:
        1px solid #cad6df !important;

    border-radius:
        7px !important;

    background:
        #fff !important;

    color:
        #40576b !important;

    font-size:
        14px !important;

    font-weight:
        500 !important;
}


/* Guardar */
body.cl-user
#qbitBillingEditPanel
.qbit-address-save {
    min-height:
        40px !important;

    padding:
        8px 18px !important;

    border:
        1px solid #0872cf !important;

    border-radius:
        7px !important;

    background:
        #0872cf !important;

    color:
        #fff !important;

    font-size:
        14px !important;

    font-weight:
        500 !important;

    box-shadow:
        none !important;
}


/* ---------------------------------------------------------
   RESPONSIVE
   --------------------------------------------------------- */

@media (max-width: 991.98px) {

    body.cl-user
    #qbitBillingEditPanel
    .qbit-mx-salutation,

    body.cl-user
    #qbitBillingEditPanel
    .qbit-mx-firstname,

    body.cl-user
    #qbitBillingEditPanel
    .qbit-mx-lastname,

    body.cl-user
    #qbitBillingEditPanel
    .qbit-mx-street,

    body.cl-user
    #qbitBillingEditPanel
    .qbit-mx-streetnr,

    body.cl-user
    #qbitBillingEditPanel
    .qbit-mx-zip,

    body.cl-user
    #qbitBillingEditPanel
    .qbit-mx-colony,

    body.cl-user
    #qbitBillingEditPanel
    .qbit-mx-city,

    body.cl-user
    #qbitBillingEditPanel
    .qbit-mx-country,

    body.cl-user
    #qbitBillingEditPanel
    .qbit-mx-state,

    body.cl-user
    #qbitBillingEditPanel
    .qbit-mx-mobile,

    body.cl-user
    #qbitBillingEditPanel
    .qbit-mx-phone,

    body.cl-user
    #qbitBillingEditPanel
    .qbit-mx-company,

    body.cl-user
    #qbitBillingEditPanel
    .qbit-mx-rfc,

    body.cl-user
    #qbitBillingEditPanel
    .qbit-mx-reference {
        grid-column:
            span 6 !important;
    }
}


@media (max-width: 575.98px) {

    body.cl-user
    .qbit-address-card
    #qbitBillingEditPanel
    .qbit-mx-billing {
        grid-template-columns:
            1fr !important;
        gap:
            10px !important;
    }

    body.cl-user
    #qbitBillingEditPanel
    .qbit-mx-field {
        grid-column:
            1 / -1 !important;
    }

    body.cl-user
    .qbit-address-card
    #qbitBillingEditPanel
    .qbit-address-edit-actions {
        flex-direction:
            column-reverse !important;
        align-items:
            stretch !important;
    }
}


/* QBIT CHECKOUT — BILLING UNIFIED CARD 4.42A END */



/* =========================================================
   QBIT CHECKOUT — EDIT CYCLE 4.42D
   ========================================================= */

/*
 * En modo visual Guardar permanece visible para que
 * la acción resulte predecible, pero no puede ejecutarse
 * hasta entrar en Editar.
 */
body.cl-user
.qbit-address-card
.qbit-address-save:disabled {
    opacity: .55 !important;
    cursor: not-allowed !important;
    box-shadow: none !important;
}


/* Cancelar solo existe visualmente durante edición. */
body.cl-user
.qbit-address-card
.qbit-address-edit-cancel[hidden] {
    display: none !important;
}


/* Controles fiscales visibles pero bloqueados en lectura. */
body.cl-user
.qbit-address-card
.qbit-fiscal-checkout
.form-control:disabled,

body.cl-user
.qbit-address-card
.qbit-fiscal-checkout
.form-select:disabled,

body.cl-user
.qbit-address-card
.qbit-fiscal-checkout
.form-check-input:disabled {
    cursor: not-allowed !important;
    opacity: .68 !important;
}


/* QBIT CHECKOUT — EDIT CYCLE 4.42D END */



/* =========================================================
   QBIT_CART_CONTEXT_WIDTH_1_06C

   Selector REAL:
   section.qbit-cart-context

   qbit-checkout.js inserta este bloque justo después de
   #basket_list.

   Objetivo:
   alinear sus bordes exactamente con la tarjeta de producto.
   ========================================================= */

body.cl-basket
.qbit-cart-context {
    position: relative;

    left: 11px;

    width: calc(100% - 22px);
    max-width: calc(100% - 22px);

    margin-left: 0;
    margin-right: 0;

    box-sizing: border-box;
}


/*
 * Mantener su altura compacta.
 */
body.cl-basket
.qbit-cart-context {
    padding-top: 10px;
    padding-bottom: 10px;
}


/*
 * Evitar espacio sobrante en el párrafo.
 */
body.cl-basket
.qbit-cart-context p {
    margin-bottom: 0;
}


/*
 * Responsive:
 * en pantallas estrechas dejamos que utilice
 * nuevamente todo el ancho disponible.
 */
@media (max-width: 991.98px) {

    body.cl-basket
    .qbit-cart-context {
        left: 0;

        width: 100%;
        max-width: 100%;
    }

}

/* QBIT_CART_CONTEXT_WIDTH_1_06C END */



/* =========================================================
   QBIT_CART_CONTEXT_TYPOGRAPHY_1_02

   Contexto auxiliar bajo carrito.
   ========================================================= */

body.cl-basket
.qbit-cart-context-label {
    font-size: 13px !important;
    line-height: 1.2 !important;
    font-weight: 600 !important;
    letter-spacing: .02em !important;
}


body.cl-basket
.qbit-cart-context h3 {
    font-size: 14px !important;
    line-height: 1.35 !important;
    font-weight: 500 !important;
}


body.cl-basket
.qbit-cart-context p {
    font-size: 13px !important;
    line-height: 1.4 !important;
}


body.cl-basket
.qbit-cart-context-actions a {
    font-size: 13px !important;
    line-height: 18px !important;
    font-weight: 500 !important;
}

/* QBIT_CART_CONTEXT_TYPOGRAPHY_1_02 END */



/* =========================================================
   QBIT_ADDRESS_TWO_COLUMN_LAYOUT_1_01

   Dirección de compra:
   izquierda  = datos cliente + facturación + CFDI
   derecha    = envío + newsletter + comentarios
   ========================================================= */

body.cl-user
.qbit-address-two-column-layout {
    display: grid;

    grid-template-columns:
        minmax(0, 1.12fr)
        minmax(0, .88fr);

    gap: 16px;

    align-items: start;

    width: 100%;
}


body.cl-user
.qbit-address-column {
    min-width: 0;
}


body.cl-user
.qbit-address-column-main,
body.cl-user
.qbit-address-column-side {
    display: flex;

    flex-direction: column;

    gap: 14px;
}


/*
 * Los bloques ya poseen sus propios bordes.
 * Quitamos márgenes externos que puedan romper
 * la alineación vertical de las dos columnas.
 */
body.cl-user
.qbit-address-two-column-layout
.qbit-address-card,

body.cl-user
.qbit-address-two-column-layout
.qbit-shipping-card,

body.cl-user
.qbit-address-two-column-layout
.qbit-order-preferences,

body.cl-user
.qbit-address-two-column-layout
.qbit-order-comment,

body.cl-user
.qbit-address-two-column-layout
.qbit-address-edit-body {
    width: 100%;

    max-width: none;

    margin-left: 0;
    margin-right: 0;

    box-sizing: border-box;
}


/*
 * Columna derecha algo más compacta verticalmente.
 */
body.cl-user
.qbit-address-column-side
.qbit-shipping-card,

body.cl-user
.qbit-address-column-side
.qbit-order-preferences,

body.cl-user
.qbit-address-column-side
.qbit-order-comment {
    margin-top: 0;
    margin-bottom: 0;
}


/*
 * Tablet/móvil:
 * recuperar lectura lineal natural.
 */
@media (max-width: 991.98px) {

    body.cl-user
    .qbit-address-two-column-layout {
        grid-template-columns: 1fr;

        gap: 14px;
    }


    body.cl-user
    .qbit-address-column-main,
    body.cl-user
    .qbit-address-column-side {
        gap: 14px;
    }

}

/* QBIT_ADDRESS_TWO_COLUMN_LAYOUT_1_01 END */



/* =========================================================
   QBIT_ADDRESS_COMPACT_FISCAL_1_03

   Columna izquierda de Dirección de compra:
   - datos del cliente más compactos;
   - RFC trasladado visualmente a CFDI;
   - Régimen / Uso CFDI menos altos;
   - sin alterar controles OXID reales.
   ========================================================= */


/* ---------------------------------------------------------
   DATOS DEL CLIENTE — GRID COMPACTO DE 3 COLUMNAS
   --------------------------------------------------------- */

body.cl-user
.qbit-address-column-main
.qbit-address-grid {
    grid-template-columns:
        repeat(3, minmax(0, 1fr)) !important;

    gap:
        7px !important;

    margin-top:
        12px !important;

    padding-top:
        12px !important;
}


/*
 * Anular la regla histórica:
 * nth-child(1) / nth-child(2) = span 2.
 */
body.cl-user
.qbit-address-column-main
.qbit-address-grid
.qbit-address-item:nth-child(1),

body.cl-user
.qbit-address-column-main
.qbit-address-grid
.qbit-address-item:nth-child(2) {
    grid-column:
        auto !important;
}


/* Empresa necesita más espacio */
body.cl-user
.qbit-address-column-main
.qbit-address-company {
    grid-column:
        span 2 !important;
}


/* Dirección conserva dos columnas */
body.cl-user
.qbit-address-column-main
.qbit-address-wide {
    grid-column:
        span 2 !important;
}


/*
 * Resumen CFDI ocupa toda la fila.
 */
body.cl-user
.qbit-address-column-main
.qbit-address-fiscal-summary {
    grid-column:
        1 / -1 !important;
}


/* Tarjetas más bajas */
body.cl-user
.qbit-address-column-main
.qbit-address-item {
    min-height:
        42px !important;

    padding:
        6px 9px !important;
}


/* Mantener escala QBIT legible */
body.cl-user
.qbit-address-column-main
.qbit-address-item span {
    margin-bottom:
        2px !important;

    font-size:
        12px !important;

    line-height:
        1.15 !important;
}


body.cl-user
.qbit-address-column-main
.qbit-address-item strong {
    font-size:
        13.5px !important;

    line-height:
        1.25 !important;

    font-weight:
        500 !important;
}


/* ---------------------------------------------------------
   BLOQUE FISCAL
   --------------------------------------------------------- */

body.cl-user
.qbit-address-column-main
.qbit-billing-inline-fiscal {
    margin-top:
        12px !important;
}


body.cl-user
.qbit-address-column-main
.qbit-fiscal-checkout {
    padding-top:
        12px !important;
}


/* ---------------------------------------------------------
   RFC VISUAL DENTRO DE CFDI
   --------------------------------------------------------- */

body.cl-user
.qbit-fiscal-rfc-summary {
    display:
        flex;

    align-items:
        center;

    justify-content:
        space-between;

    gap:
        12px;

    min-height:
        38px;

    margin-top:
        11px;

    padding:
        7px 10px;

    border:
        1px solid #dce5ec;

    border-radius:
        7px;

    background:
        #f6f9fb;

    box-sizing:
        border-box;
}


body.cl-user
.qbit-fiscal-rfc-summary span {
    color:
        #708394;

    font-size:
        12px;

    line-height:
        1.2;
}


body.cl-user
.qbit-fiscal-rfc-summary strong {
    color:
        #24496d;

    font-size:
        13.5px;

    line-height:
        1.2;

    font-weight:
        500;
}


/* ---------------------------------------------------------
   REGIMEN + USO CFDI
   --------------------------------------------------------- */

body.cl-user
.qbit-address-column-main
.qbit-fiscal-checkout
[data-qbit-fiscal-fields] {
    margin-top:
        8px !important;
}


body.cl-user
.qbit-address-column-main
.qbit-fiscal-checkout
.form-label {
    margin-bottom:
        5px !important;

    font-size:
        13px !important;

    line-height:
        1.2 !important;
}


body.cl-user
.qbit-address-column-main
.qbit-fiscal-checkout
.form-select {
    min-height:
        42px !important;

    height:
        42px !important;

    padding:
        7px 34px 7px 10px !important;

    border-radius:
        7px !important;

    font-size:
        13.5px !important;

    line-height:
        1.2 !important;
}


/*
 * Menos separación entre Régimen/Uso y acciones.
 */
body.cl-user
.qbit-address-column-main
.qbit-address-edit-actions {
    margin-top:
        14px !important;

    padding-top:
        12px !important;
}


/* ---------------------------------------------------------
   RESPONSIVE
   --------------------------------------------------------- */

@media (max-width: 1199.98px) {

    body.cl-user
    .qbit-address-column-main
    .qbit-address-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;
    }


    body.cl-user
    .qbit-address-column-main
    .qbit-address-company,

    body.cl-user
    .qbit-address-column-main
    .qbit-address-wide,

    body.cl-user
    .qbit-address-column-main
    .qbit-address-fiscal-summary {
        grid-column:
            1 / -1 !important;
    }

}


@media (max-width: 575.98px) {

    body.cl-user
    .qbit-address-column-main
    .qbit-address-grid {
        grid-template-columns:
            1fr !important;
    }


    body.cl-user
    .qbit-address-column-main
    .qbit-address-item {
        grid-column:
            1 / -1 !important;
    }

}

/* QBIT_ADDRESS_COMPACT_FISCAL_1_03 END */



/* =========================================================
   QBIT_ADDRESS_DATA_SCALE_1_04

   - Empresa/Razón social pasa a contexto CFDI
   - valores del resumen superior = 10px
   - identidad fiscal compacta en dos columnas
   ========================================================= */


/* ---------------------------------------------------------
   DATOS SUPERIORES
   --------------------------------------------------------- */

body.cl-user
.qbit-address-column-main
.qbit-address-grid {
    grid-template-columns:
        repeat(3, minmax(0, 1fr)) !important;
}


/*
 * Etiquetas siguen diferenciadas pero compactas.
 */
body.cl-user
.qbit-address-column-main
.qbit-address-item span {
    font-size:
        10px !important;

    line-height:
        1.15 !important;
}


/*
 * Datos solicitados a 10 px.
 */
body.cl-user
.qbit-address-column-main
.qbit-address-item strong {
    font-size:
        10px !important;

    line-height:
        1.25 !important;

    font-weight:
        500 !important;
}


/*
 * Reducir todavía un poco la altura de las celdas.
 */
body.cl-user
.qbit-address-column-main
.qbit-address-item {
    min-height:
        38px !important;

    padding:
        6px 8px !important;
}


/* ---------------------------------------------------------
   IDENTIDAD FISCAL
   --------------------------------------------------------- */

body.cl-user
.qbit-fiscal-identity-summary {
    display:
        grid;

    grid-template-columns:
        minmax(0, 1.35fr)
        minmax(0, .65fr);

    gap:
        7px;

    margin-top:
        10px;
}


body.cl-user
.qbit-fiscal-identity-item {
    min-width:
        0;

    min-height:
        40px;

    padding:
        7px 9px;

    border:
        1px solid #dce5ec;

    border-radius:
        7px;

    background:
        #f6f9fb;

    box-sizing:
        border-box;
}


body.cl-user
.qbit-fiscal-identity-item span {
    display:
        block;

    margin-bottom:
        2px;

    color:
        #708394;

    font-size:
        10px;

    line-height:
        1.15;
}


body.cl-user
.qbit-fiscal-identity-item strong {
    display:
        block;

    overflow-wrap:
        anywhere;

    color:
        #24496d;

    font-size:
        12.5px;

    line-height:
        1.25;

    font-weight:
        500;
}


/*
 * La antigua regla de RFC individual ya no aplica.
 */
body.cl-user
.qbit-fiscal-rfc-summary {
    display:
        none !important;
}


/* ---------------------------------------------------------
   RESPONSIVE
   --------------------------------------------------------- */

@media (max-width: 575.98px) {

    body.cl-user
    .qbit-fiscal-identity-summary {
        grid-template-columns:
            1fr;
    }

}

/* QBIT_ADDRESS_DATA_SCALE_1_04 END */



/* =========================================================
   QBIT_ADDRESS_DATA_SCALE_1_05

   Ajuste final de legibilidad:
   - etiqueta = 10px
   - valor = 11px
   ========================================================= */

body.cl-user
.qbit-address-column-main
.qbit-address-item span {
    font-size:
        10px !important;

    line-height:
        1.15 !important;
}


body.cl-user
.qbit-address-column-main
.qbit-address-item strong {
    font-size:
        11px !important;

    line-height:
        1.25 !important;

    font-weight:
        500 !important;
}


/*
 * Mantener las celdas compactas sin comprimir demasiado.
 */
body.cl-user
.qbit-address-column-main
.qbit-address-item {
    min-height:
        39px !important;

    padding:
        6px 8px !important;
}

/* QBIT_ADDRESS_DATA_SCALE_1_05 END */



/* =========================================================
   QBIT_ADDRESS_WIDE_MAIN_1_06

   Dirección de compra:
   - columna principal más ancha;
   - columna entrega/opciones más compacta;
   - mejor legibilidad de datos sin perder densidad.
   ========================================================= */


/* ---------------------------------------------------------
   PROPORCION DE COLUMNAS
   --------------------------------------------------------- */

@media (min-width: 992px) {

    body.cl-user
    .qbit-address-two-column-layout {
        grid-template-columns:
            minmax(0, 1.30fr)
            minmax(0, .70fr) !important;

        gap:
            16px !important;
    }

}


/* ---------------------------------------------------------
   DATOS GENERALES — COLUMNA IZQUIERDA
   --------------------------------------------------------- */

body.cl-user
.qbit-address-column-main
.qbit-address-item span {
    font-size:
        11px !important;

    line-height:
        1.18 !important;
}


body.cl-user
.qbit-address-column-main
.qbit-address-item strong {
    font-size:
        12px !important;

    line-height:
        1.28 !important;

    font-weight:
        500 !important;
}


/*
 * Con mayor anchura ya no necesitamos comprimir tanto
 * verticalmente las celdas.
 */
body.cl-user
.qbit-address-column-main
.qbit-address-item {
    min-height:
        41px !important;

    padding:
        6px 9px !important;
}


/* ---------------------------------------------------------
   IDENTIDAD FISCAL — EMPRESA / RFC
   --------------------------------------------------------- */

body.cl-user
.qbit-fiscal-identity-item span {
    font-size:
        11px !important;

    line-height:
        1.2 !important;
}


body.cl-user
.qbit-fiscal-identity-item strong {
    font-size:
        12.5px !important;

    line-height:
        1.25 !important;

    font-weight:
        500 !important;
}


body.cl-user
.qbit-fiscal-identity-item {
    min-height:
        42px !important;

    padding:
        7px 10px !important;
}


/*
 * Más espacio para Razón social;
 * RFC conserva suficiente anchura.
 */
body.cl-user
.qbit-fiscal-identity-summary {
    grid-template-columns:
        minmax(0, 1.45fr)
        minmax(150px, .55fr) !important;

    gap:
        8px !important;
}


/* ---------------------------------------------------------
   REGIMEN / USO CFDI
   --------------------------------------------------------- */

body.cl-user
.qbit-address-column-main
.qbit-fiscal-checkout
.form-label {
    font-size:
        13px !important;

    line-height:
        1.25 !important;
}


body.cl-user
.qbit-address-column-main
.qbit-fiscal-checkout
.form-select {
    min-height:
        42px !important;

    height:
        42px !important;

    font-size:
        13px !important;
}


/* ---------------------------------------------------------
   COLUMNA DERECHA
   --------------------------------------------------------- */

/*
 * No reducimos tipografía de Entrega/Novedades/Comentarios.
 * Solo dejamos que use menos ancho.
 */
body.cl-user
.qbit-address-column-side {
    min-width:
        0;
}


/* ---------------------------------------------------------
   TABLET / MOVIL
   --------------------------------------------------------- */

@media (max-width: 991.98px) {

    body.cl-user
    .qbit-address-two-column-layout {
        grid-template-columns:
            1fr !important;
    }

}


@media (max-width: 575.98px) {

    body.cl-user
    .qbit-fiscal-identity-summary {
        grid-template-columns:
            1fr !important;
    }

}

/* QBIT_ADDRESS_WIDE_MAIN_1_06 END */



/* =========================================================
   QBIT_ADDRESS_DATA_14PX_1_07

   Resumen de datos del cliente:
   - etiqueta = 14px
   - dato     = 14px

   No afecta:
   - títulos de sección
   - bloque fiscal
   - columna derecha
   ========================================================= */

body.cl-user
.qbit-address-column-main
.qbit-address-grid
.qbit-address-item span {
    font-size:
        14px !important;

    line-height:
        1.25 !important;
}


body.cl-user
.qbit-address-column-main
.qbit-address-grid
.qbit-address-item strong {
    font-size:
        14px !important;

    line-height:
        1.3 !important;

    font-weight:
        500 !important;
}


/*
 * Ajustar altura para que 14px no quede comprimido.
 */
body.cl-user
.qbit-address-column-main
.qbit-address-grid
.qbit-address-item {
    min-height:
        48px !important;

    padding:
        7px 10px !important;
}


/* QBIT_ADDRESS_DATA_14PX_1_07 END */


/* =========================================================
   QBIT_HIDE_REFERENCE_EDIT_1_09R
   - Oculta Referencia / información adicional
   - Revierte el parche visual agresivo 1.09
   - No modifica lógica ni guardado
   ========================================================= */

#qbitBillingEditPanel .qbit-mx-reference,
#qbitBillingEditPanel [class*="qbit-mx-reference"],
#qbitBillingEditPanel .qbit-mx-field.qbit-mx-reference {
    display: none !important;
}

/* seguridad adicional por si el campo quedó sin clase */
#qbitBillingEditPanel textarea[name="invadr[oxuser__oxaddinfo]"],
#qbitBillingEditPanel textarea[name="userform[oxaddinfo]"] {
    display: none !important;
}

#qbitBillingEditPanel textarea[name="invadr[oxuser__oxaddinfo]"] + label,
#qbitBillingEditPanel textarea[name="userform[oxaddinfo]"] + label {
    display: none !important;
}

/* compactar hueco si existía wrapper vacío */
#qbitBillingEditPanel .qbit-mx-reference:empty {
    display: none !important;
}

/* QBIT_HIDE_REFERENCE_EDIT_1_09R END */



/* =========================================================
   QBIT_EDIT_LAYOUT_REFINED_1_10

   Edición alineada con la vista normal, sin comprimir:
   - grid de 12 columnas;
   - anchos específicos por campo;
   - tipografía 14px;
   - referencia sigue oculta por 1.09R.
   ========================================================= */

body.cl-user
#qbitBillingEditPanel
.qbit-mx-billing {
    display: grid !important;
    grid-template-columns: repeat(12, minmax(0, 1fr)) !important;
    gap: 8px !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    align-items: start !important;
}

body.cl-user
#qbitBillingEditPanel
.qbit-mx-field {
    min-width: 0 !important;
    width: 100% !important;
    margin: 0 !important;
}

/* fila 1 */
body.cl-user #qbitBillingEditPanel .qbit-mx-salutation { grid-column: span 2 !important; }
body.cl-user #qbitBillingEditPanel .qbit-mx-firstname  { grid-column: span 5 !important; }
body.cl-user #qbitBillingEditPanel .qbit-mx-lastname   { grid-column: span 5 !important; }

/* fila 2 */
body.cl-user #qbitBillingEditPanel .qbit-mx-street     { grid-column: span 6 !important; }
body.cl-user #qbitBillingEditPanel .qbit-mx-streetnr   { grid-column: span 2 !important; }
body.cl-user #qbitBillingEditPanel .qbit-mx-zip        { grid-column: span 4 !important; }

/* fila 3 */
body.cl-user #qbitBillingEditPanel .qbit-mx-colony     { grid-column: span 4 !important; }
body.cl-user #qbitBillingEditPanel .qbit-mx-city       { grid-column: span 4 !important; }
body.cl-user #qbitBillingEditPanel .qbit-mx-country    { grid-column: span 4 !important; }

/* fila 4 */
body.cl-user #qbitBillingEditPanel .qbit-mx-state      { grid-column: span 4 !important; }
body.cl-user #qbitBillingEditPanel .qbit-mx-mobile     { grid-column: span 4 !important; }
body.cl-user #qbitBillingEditPanel .qbit-mx-phone      { grid-column: span 4 !important; }

/* fiscal editable */
body.cl-user #qbitBillingEditPanel .qbit-mx-company    { grid-column: span 8 !important; }
body.cl-user #qbitBillingEditPanel .qbit-mx-rfc        { grid-column: span 4 !important; }

/* referencia permanece oculta por 1.09R */
body.cl-user #qbitBillingEditPanel .qbit-mx-reference {
    display: none !important;
}

/* inputs */
body.cl-user
#qbitBillingEditPanel
.qbit-mx-field
.form-control,

body.cl-user
#qbitBillingEditPanel
.qbit-mx-field
.form-select,

body.cl-user
#qbitBillingEditPanel
.qbit-mx-field
select.stateselect {
    width: 100% !important;
    min-height: 48px !important;
    height: 48px !important;
    padding: 18px 10px 5px !important;
    border: 1px solid #dce5ec !important;
    border-radius: 7px !important;
    background: #f6f9fb !important;
    color: #183d61 !important;
    font-size: 14px !important;
    line-height: 1.25 !important;
    box-shadow: none !important;
    box-sizing: border-box !important;
}

/* labels */
body.cl-user
#qbitBillingEditPanel
.qbit-mx-field
.form-floating > label {
    padding: 6px 10px !important;
    color: #64798b !important;
    font-size: 14px !important;
    line-height: 1.15 !important;
    font-weight: 400 !important;
    opacity: 1 !important;
}

/* foco */
body.cl-user
#qbitBillingEditPanel
.qbit-mx-field
.form-control:focus,

body.cl-user
#qbitBillingEditPanel
.qbit-mx-field
.form-select:focus,

body.cl-user
#qbitBillingEditPanel
.qbit-mx-field
select.stateselect:focus {
    border-color: #5a9bd5 !important;
    background: #fff !important;
    box-shadow: 0 0 0 2px rgba(8,114,207,.08) !important;
}

/* responsive */
@media (max-width: 1199.98px) {
    body.cl-user
    #qbitBillingEditPanel
    .qbit-mx-billing {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    body.cl-user
    #qbitBillingEditPanel
    .qbit-mx-field {
        grid-column: auto !important;
    }

    body.cl-user
    #qbitBillingEditPanel
    .qbit-mx-company {
        grid-column: 1 / -1 !important;
    }
}

@media (max-width: 575.98px) {
    body.cl-user
    #qbitBillingEditPanel
    .qbit-mx-billing {
        grid-template-columns: 1fr !important;
    }

    body.cl-user
    #qbitBillingEditPanel
    .qbit-mx-field {
        grid-column: 1 / -1 !important;
    }
}

/* QBIT_EDIT_LAYOUT_REFINED_1_10 END */



/* =========================================================
   QBIT_EDIT_HIDE_FISCAL_DUPLICATES_1_11

   Empresa / Razón social y RFC ya se muestran en el
   bloque fiscal inferior.

   Durante edición se ocultan únicamente sus wrappers
   del formulario general.

   IMPORTANTE:
   los inputs permanecen en el DOM y siguen enviándose
   dentro de invadr[] a OXID.
   ========================================================= */

body.cl-user
#qbitBillingEditPanel
.qbit-mx-company,

body.cl-user
#qbitBillingEditPanel
.qbit-mx-rfc {
    display: none !important;
}


/*
 * Asegurar que la última fila de datos generales
 * quede formada únicamente por:
 * Estado / Celular / Teléfono alternativo.
 */
body.cl-user
#qbitBillingEditPanel
.qbit-mx-state,

body.cl-user
#qbitBillingEditPanel
.qbit-mx-mobile,

body.cl-user
#qbitBillingEditPanel
.qbit-mx-phone {
    grid-column:
        span 4 !important;
}


/* QBIT_EDIT_HIDE_FISCAL_DUPLICATES_1_11 END */



/* =========================================================
   QBIT_HIDE_SALUTATION_ONLY_1_14R

   Oculta únicamente Tratamiento en el formulario Editar.

   No modifica:
   - Twig
   - grid existente
   - campos OXID
   - guardado
   - fiscal
   ========================================================= */

body.cl-user
#qbitBillingEditPanel
.qbit-mx-salutation {
    display: none !important;
}

/* QBIT_HIDE_SALUTATION_ONLY_1_14R END */



/* =========================================================
   QBIT_PAYMENT_CARD_DIVIDER_1_03

   Paso Pago:
   elimina únicamente la línea inferior del encabezado
   "Selecciona tu método de pago".

   Elemento real auditado:
   .qbit-payment-card-heading
   ========================================================= */

body.cl-payment
.qbit-payment-card-heading {
    border-bottom:
        0 !important;
}

/* QBIT_PAYMENT_CARD_DIVIDER_1_03 END */



/* =========================================================
   QBIT_PAYMENT_SUMMARY_DIVIDER_1_04

   Paso Pago:
   elimina únicamente el divisor situado bajo
   el título "Resumen" de la columna derecha.

   No afecta:
   - líneas internas de importes;
   - separador del total;
   - contenido del resumen.
   ========================================================= */

body.cl-payment
.qbit-checkout-summary
.card-header {
    border-bottom:
        0 !important;
}


body.cl-payment
.qbit-checkout-summary
.card-title {
    border-bottom:
        0 !important;

    padding-bottom:
        0 !important;
}


/*
 * Compatibilidad si la línea está implementada
 * como pseudo-elemento del título.
 */
body.cl-payment
.qbit-checkout-summary
.card-title::before,

body.cl-payment
.qbit-checkout-summary
.card-title::after {
    display:
        none !important;

    content:
        none !important;
}


/*
 * Compatibilidad si existe un HR inmediatamente
 * después del título.
 */
body.cl-payment
.qbit-checkout-summary
.card-title + hr {
    display:
        none !important;

    border:
        0 !important;

    margin:
        0 !important;
}


/* QBIT_PAYMENT_SUMMARY_DIVIDER_1_04 END */



/* =========================================================
   QBIT_CHECKOUT_PROGRESS_SUBTITLE_12PX_1_05

   Subtítulos grises del progreso global del checkout:
   Productos / Identificación y dirección /
   Método de pago / Revisar pedido.

   Aplica a todos los pasos donde se reutiliza
   .qbit-checkout-step.
   ========================================================= */

.qbit-checkout-step small {
    font-size:
        12px !important;

    line-height:
        1.3 !important;
}

/* QBIT_CHECKOUT_PROGRESS_SUBTITLE_12PX_1_05 END */



/* =========================================================
   QBIT_THANKYOU_CONTAINER_ALIGN_1_02

   Pedido confirmado:
   el contenido principal utiliza exactamente el mismo
   contrato horizontal que el header QBIT en cl-thankyou.

   Header auditado:
   - width: 100%
   - max-width: 1440px
   - padding lateral: 24px
   - centrado

   No modifica tarjetas ni columnas internas.
   ========================================================= */

body.cl-thankyou
.qbit-thankyou
> .container-xxl {

    width:
        100% !important;

    max-width:
        1440px !important;

    margin-left:
        auto !important;

    margin-right:
        auto !important;

    padding-left:
        24px !important;

    padding-right:
        24px !important;

    box-sizing:
        border-box !important;
}


/*
 * Seguridad:
 * ningún bloque directo de la página podrá extenderse
 * fuera del contenedor principal.
 */
body.cl-thankyou
.qbit-thankyou-hero,

body.cl-thankyou
.qbit-thankyou-notice,

body.cl-thankyou
.qbit-thankyou-layout {

    width:
        100% !important;

    max-width:
        100% !important;

    box-sizing:
        border-box !important;
}


/*
 * Las dos columnas internas pueden encogerse sin
 * provocar overflow horizontal.
 */
body.cl-thankyou
.qbit-thankyou-main,

body.cl-thankyou
.qbit-thankyou-summary {

    min-width:
        0 !important;
}


/* Tablet */
@media (max-width: 991.98px) {

    body.cl-thankyou
    .qbit-thankyou
    > .container-xxl {

        padding-left:
            18px !important;

        padding-right:
            18px !important;
    }

}


/* Móvil */
@media (max-width: 575.98px) {

    body.cl-thankyou
    .qbit-thankyou
    > .container-xxl {

        padding-left:
            14px !important;

        padding-right:
            14px !important;
    }

}

/* QBIT_THANKYOU_CONTAINER_ALIGN_1_02 END */

/* QBIT MERCADO PAGO UNIFIED PAYMENT UI — START */

.qbit-payment-provider {
    margin-top: 14px;
    padding: 18px 16px 16px;
    border: 1px solid #d9e2ec;
    border-radius: 10px;
    background: #fff;
}

.qbit-payment-provider__intro {
    margin-bottom: 16px;
}

.qbit-payment-provider__eyebrow {
    display: block;
    margin-bottom: 3px;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: .02em;
    color: #006dcc;
}

.qbit-payment-provider__title {
    margin: 0 0 4px;
    font-size: 20px;
    line-height: 1.25;
    font-weight: 600;
    color: #0b3765;
}

.qbit-payment-provider__description {
    margin: 0;
    font-size: 14px;
    line-height: 1.45;
    color: #536b82;
}

.qbit-payment-choice-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.qbit-payment-choice {
    appearance: none;
    width: 100%;
    min-height: 68px;
    display: flex;
    align-items: center;
    gap: 11px;
    padding: 12px 14px;
    border: 1px solid #d8e1ea;
    border-radius: 8px;
    background: #fff;
    text-align: left;
    cursor: pointer;
}

.qbit-payment-choice.is-active {
    border: 2px solid #0b7de3;
    padding: 11px 13px;
    background: #fbfdff;
}

.qbit-payment-choice.is-disabled {
    opacity: .66;
    cursor: not-allowed;
    background: #f7f9fb;
}

.qbit-payment-choice__icon {
    flex: 0 0 auto;
    font-size: 20px;
    line-height: 1;
}

.qbit-payment-choice__content {
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: 2px;
}

.qbit-payment-choice__content strong {
    font-size: 14px;
    line-height: 1.3;
    font-weight: 600;
    color: #123f6d;
}

.qbit-payment-choice__content small {
    font-size: 13px;
    line-height: 1.3;
    color: #60758a;
}

.qbit-payment-method-panel {
    padding-top: 2px;
}

.qbit-mercadopago-card-container {
    width: 100%;
}

.qbit-mercadopago-loading {
    padding: 12px 0;
    font-size: 14px;
    color: #60758a;
}

.qbit-mercadopago-error {
    margin-bottom: 12px;
    padding: 10px 12px;
    border: 1px solid #d9a8a8;
    border-radius: 6px;
    font-size: 14px;
}

.qbit-payment-security-note {
    margin: 12px 0 0;
    font-size: 13px;
    line-height: 1.45;
    color: #60758a;
}

@media (max-width: 640px) {
    .qbit-payment-choice-grid {
        grid-template-columns: 1fr;
    }

    .qbit-payment-provider {
        padding: 15px 12px 14px;
    }
}

/* QBIT MERCADO PAGO UNIFIED PAYMENT UI — END */

/* QBIT MERCADO PAGO STRIPE-LIKE UI — START */

.qbit-mercadopago-panel {
    margin-top: 0;
}

.qbit-mercadopago-payment-layout {
    grid-template-columns: minmax(0, 1fr);
}

.qbit-mercadopago-primary-card {
    width: 100%;
    max-width: none;
}

.qbit-mercadopago-elements-form {
    width: 100%;
}

.qbit-payment-choice-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    margin: 16px 0 18px;
}

.qbit-payment-choice {
    appearance: none;
    width: 100%;
    min-height: 58px;
    display: flex;
    align-items: center;
    padding: 10px 12px;
    border: 1px solid #d7e0ea;
    border-radius: 7px;
    background: #fff;
    text-align: left;
    cursor: pointer;
    transition:
        border-color .15s ease,
        box-shadow .15s ease,
        background-color .15s ease;
}

.qbit-payment-choice.is-active {
    border-color: #0b7de3;
    box-shadow: 0 0 0 1px #0b7de3;
    background: #fbfdff;
}

.qbit-payment-choice.is-disabled {
    cursor: not-allowed;
    opacity: .58;
    background: #f7f9fb;
}

.qbit-payment-choice__content {
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: 2px;
}

.qbit-payment-choice__content strong {
    font-size: 14px;
    line-height: 1.3;
    font-weight: 600;
    color: #123f6d;
}

.qbit-payment-choice__content small {
    font-size: 13px;
    line-height: 1.3;
    color: #60758a;
}

.qbit-mercadopago-card-container {
    width: 100%;
    margin-top: 2px;
}

.qbit-mercadopago-security-note {
    display: block;
    margin-top: 12px;
    font-size: 13px;
    line-height: 1.45;
    color: #60758a;
}

@media (max-width: 640px) {
    .qbit-payment-choice-grid {
        grid-template-columns: 1fr;
    }
}

/* QBIT MERCADO PAGO STRIPE-LIKE UI — END */

/* QBIT MERCADO PAGO FINAL COMPACT UI — START */

/*
 * PASO 3:
 * elimina definitivamente el divisor superior heredado
 * por qbit-stripe-panel y compacta el espacio entre el
 * encabezado general y PAGO SEGURO.
 */

body.cl-payment
.qbit-payment-card-heading {
    padding-bottom: 8px !important;
    margin-bottom: 0 !important;
    border-bottom: 0 !important;
}

body.cl-payment
.qbit-payment-form {
    padding-top: 7px !important;
}

body.cl-payment
.qbit-payment-methods {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

body.cl-payment
.qbit-mercadopago-panel.qbit-stripe-panel {
    margin-top: 0 !important;
    padding-top: 0 !important;
    border-top: 0 !important;
}

body.cl-payment
.qbit-mercadopago-primary-card {
    padding-top: 14px !important;
}


/*
 * Selector Tarjeta / Transferencia:
 * mantiene lenguaje QBIT pero reduce altura sobrante.
 */

body.cl-payment
.qbit-payment-choice-grid {
    margin-top: 11px !important;
    margin-bottom: 12px !important;
}

body.cl-payment
.qbit-payment-choice {
    min-height: 54px !important;
    padding-top: 9px !important;
    padding-bottom: 9px !important;
}


/*
 * Ocultar títulos redundantes nativos del Brick.
 */

#qbit-mercadopago-card-container
.qbit-mp-brick-native-title,
#qbit-mercadopago-card-container
.qbit-mp-email-section-title {
    display: none !important;
}


/*
 * GRID DEFINITIVO — ESCRITORIO
 *
 * 58% / 17% / 25%
 *
 * FILA 1:
 * Número | Vencimiento | Seguridad
 *
 * FILA 2:
 * Titular | Email (ocupa columnas 2 + 3)
 */

#qbit-mercadopago-card-container
.qbit-mp-brick-fields {
    display: grid !important;

    width: 100% !important;
    max-width: 790px !important;

    grid-template-columns:
        minmax(0, 58fr)
        minmax(105px, 17fr)
        minmax(125px, 25fr) !important;

    column-gap: 10px !important;
    row-gap: 10px !important;

    align-items: start;
}


/*
 * El wrapper que originalmente contiene vencimiento + CVV
 * deja de crear otro grid anidado: sus hijos participan
 * directamente en nuestro grid principal.
 */

#qbit-mercadopago-card-container
.qbit-mp-field-exp-security-row {
    display: contents !important;
}


#qbit-mercadopago-card-container
.qbit-mp-field-card-number {
    grid-column: 1;
    grid-row: 1;

    min-width: 0;
    margin: 0 !important;
}


#qbit-mercadopago-card-container
.qbit-mp-field-expiration {
    grid-column: 2;
    grid-row: 1;

    width: 100% !important;
    min-width: 0;
    margin: 0 !important;
}


#qbit-mercadopago-card-container
.qbit-mp-field-security {
    grid-column: 3;
    grid-row: 1;

    width: 100% !important;
    min-width: 0;
    margin: 0 !important;
}


#qbit-mercadopago-card-container
.qbit-mp-field-holder {
    grid-column: 1;
    grid-row: 2;

    width: 100% !important;
    min-width: 0;
    margin: 0 !important;
}


/*
 * El wrapper externo del email no debe ocupar una celda
 * propia. Su campo interior entra directamente al grid.
 */

#qbit-mercadopago-card-container
.qbit-mp-field-email-section {
    display: contents !important;
}


#qbit-mercadopago-card-container
.qbit-mp-field-email {
    grid-column: 2 / 4;
    grid-row: 2;

    width: 100% !important;
    min-width: 0;
    margin: 0 !important;
}


/*
 * ALTURA QBIT:
 * reducir inputs normales y los contenedores exteriores
 * de Secure Fields sin tocar los iframes internos.
 */

#qbit-mercadopago-card-container
.qbit-mp-field-holder input,
#qbit-mercadopago-card-container
.qbit-mp-field-email input {
    box-sizing: border-box;

    width: 100% !important;
    min-height: 34px !important;
    height: 34px !important;

    padding-top: 5px !important;
    padding-bottom: 5px !important;
}


#qbit-mercadopago-card-container
.qbit-mp-field-card-number
[role="textbox"],

#qbit-mercadopago-card-container
.qbit-mp-field-expiration
[role="textbox"],

#qbit-mercadopago-card-container
.qbit-mp-field-security
[role="textbox"] {
    box-sizing: border-box;

    min-height: 34px !important;
    height: 34px !important;
}


#qbit-mercadopago-card-container
label {
    margin-bottom: 3px !important;
    font-size: 13px !important;
    line-height: 1.25 !important;
}


/*
 * Eliminar completamente la fila original de marcas.
 */

#qbit-mercadopago-card-container
.qbit-mp-native-logo-row {
    display: none !important;
}


/*
 * FILA FINAL:
 * botón a izquierda, marcas aceptadas a derecha,
 * todo dentro del mismo ancho de formulario.
 */

#qbit-mercadopago-card-container
.qbit-mp-submit-row {
    box-sizing: border-box;

    width: 100% !important;
    max-width: 790px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;

    gap: 18px;

    margin-top: 11px !important;
    padding: 0 !important;
}


#qbit-mercadopago-card-container
.qbit-mp-submit-row
[data-testid="submit-wrapper"] {
    flex: 0 0 auto;

    width: auto !important;

    margin: 0 !important;
    padding: 0 !important;
}


#qbit-mercadopago-card-container
.qbit-mp-submit-row
[data-testid="submit-button"] {
    width: auto !important;
    margin: 0 !important;
}

#qbit-mercadopago-card-container
.qbit-mp-submit-row
button[type="submit"] {
    box-sizing: border-box !important;

    min-width: 138px !important;
    width: 138px !important;

    min-height: 38px !important;
    height: 38px !important;

    padding: 7px 16px !important;

    font-size: 14px !important;
    line-height: 1.2 !important;

    border-radius: 6px !important;
}


/*
 * Logos QBIT propios:
 * ya no heredan posicionamiento/clases del wrapper Svelte.
 */

#qbit-mercadopago-card-container
.qbit-mp-payment-logos {
    position: static !important;

    flex: 0 0 auto;

    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;

    gap: 10px;

    width: auto !important;
    max-width: 180px;

    margin: 0 0 0 auto !important;
    padding: 0 !important;

    transform: none !important;
}


#qbit-mercadopago-card-container
.qbit-mp-payment-logo {
    position: static !important;

    box-sizing: border-box;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 38px !important;
    min-width: 38px !important;
    height: 25px !important;

    margin: 0 !important;
    padding: 2px !important;

    inset: auto !important;
    transform: none !important;
}


#qbit-mercadopago-card-container
.qbit-mp-payment-logo svg {
    display: block !important;

    width: 100% !important;
    height: 100% !important;

    max-width: 100% !important;
    max-height: 100% !important;
}


/*
 * Nota de seguridad más próxima a la fila de pago.
 */

body.cl-payment
.qbit-mercadopago-security-note {
    margin-top: 10px !important;
}


/*
 * MOBILE / TABLET
 */

@media (max-width: 760px) {

    #qbit-mercadopago-card-container
    .qbit-mp-brick-fields {
        grid-template-columns:
            minmax(0, 1fr) !important;

        row-gap: 10px !important;
    }


    #qbit-mercadopago-card-container
    .qbit-mp-field-exp-security-row {
        display: grid !important;

        grid-column: 1;
        grid-row: auto;

        grid-template-columns:
            minmax(0, 1fr)
            minmax(0, 1fr) !important;

        gap: 10px !important;
    }


    #qbit-mercadopago-card-container
    .qbit-mp-field-card-number,

    #qbit-mercadopago-card-container
    .qbit-mp-field-holder,

    #qbit-mercadopago-card-container
    .qbit-mp-field-email-section {
        grid-column: 1;
        grid-row: auto;
    }


    #qbit-mercadopago-card-container
    .qbit-mp-field-expiration,
    #qbit-mercadopago-card-container
    .qbit-mp-field-security {
        grid-column: auto;
        grid-row: auto;
    }


    #qbit-mercadopago-card-container
    .qbit-mp-field-email-section {
        display: block !important;
    }


    #qbit-mercadopago-card-container
    .qbit-mp-field-email {
        grid-column: auto;
        grid-row: auto;
    }


    #qbit-mercadopago-card-container
    .qbit-mp-submit-row {
        width: 100% !important;
    }


    #qbit-mercadopago-card-container
    .qbit-mp-payment-logo {
        width: 38px !important;
        min-width: 38px !important;
        height: 26px !important;
    }
}

/* QBIT MERCADO PAGO FINAL COMPACT UI — END */


/* QBIT MERCADO PAGO CARD CHOICE MICRO-POLISH START */

#qbit-mercadopago-panel .qbit-payment-choice-grid {
    margin-bottom: 10px !important;
}

#qbit-mercadopago-panel .qbit-mercadopago-primary-card {
    padding-top: 8px !important;
}

#qbit-mercadopago-card-container > form > div:first-child {
    display: none !important;
}

#qbit-mercadopago-card-container > form > div:nth-child(2) {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

#qbit-mercadopago-panel .qbit-payment-choice {
    position: relative !important;
}

#qbit-mercadopago-panel .qbit-payment-choice--with-logos {
    padding-right: 118px !important;
}

#qbit-mercadopago-panel .qbit-payment-choice--with-logos #qbitMpPaymentLogos {
    position: absolute !important;
    top: 50% !important;
    right: 14px !important;
    transform: translateY(-50%) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 6px !important;
    margin: 0 !important;
    pointer-events: none !important;
    width: auto !important;
    max-width: 96px !important;
}

#qbit-mercadopago-panel .qbit-payment-choice--with-logos .qbit-mp-payment-logo {
    width: 28px !important;
    min-width: 28px !important;
    height: 18px !important;
    object-fit: contain !important;
}

#qbit-mercadopago-panel .qbit-payment-choice--with-logos .qbit-mp-payment-logo svg,
#qbit-mercadopago-panel .qbit-payment-choice--with-logos .qbit-mp-payment-logo img {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
}

#qbit-mercadopago-panel .qbit-mp-submit-row #qbitMpPaymentLogos {
    justify-content: flex-end !important;
}

/* QBIT MERCADO PAGO CARD CHOICE MICRO-POLISH END */


/* QBIT MERCADO PAGO CHOICE LOGOS START */

#qbit-mercadopago-panel .qbit-payment-choice {
    position: relative !important;
}

#qbit-mercadopago-panel .qbit-payment-choice--with-logos,
#qbit-mercadopago-panel .qbit-payment-choice--with-spei {
    padding-right: 122px !important;
}

#qbit-mercadopago-panel .qbit-payment-choice__logos,
#qbit-mercadopago-panel #qbitMpPaymentLogos,
#qbit-mercadopago-panel #qbitMpSpeiChoiceLogo {
    position: absolute !important;
    right: 14px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 6px !important;
    margin: 0 !important;
    width: auto !important;
    max-width: 104px !important;
    pointer-events: none !important;
}

#qbit-mercadopago-panel .qbit-mp-payment-logo {
    width: 27px !important;
    min-width: 27px !important;
    height: 18px !important;
    object-fit: contain !important;
}

#qbit-mercadopago-panel .qbit-mp-payment-logo svg,
#qbit-mercadopago-panel .qbit-mp-payment-logo img {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
}

#qbit-mercadopago-panel .qbit-mp-spei-badge {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 56px !important;
    height: 22px !important;
    padding: 0 8px !important;
    border: 1px solid #d7e0ea !important;
    border-radius: 6px !important;
    background: #ffffff !important;
    color: #24476f !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    letter-spacing: 0.04em !important;
    line-height: 1 !important;
    text-transform: uppercase !important;
    box-sizing: border-box !important;
}

#qbit-mercadopago-panel .qbit-mp-submit-row #qbitMpPaymentLogos {
    position: static !important;
    transform: none !important;
    right: auto !important;
    top: auto !important;
    display: none !important;
}

/* QBIT MERCADO PAGO CHOICE LOGOS END */

/* QBIT MERCADO PAGO STRIPE SELECTOR — START */

#qbit-mercadopago-panel
.qbit-payment-choice {
    position: relative !important;

    display: grid !important;
    grid-template-columns:
        22px
        minmax(0, 1fr)
        auto !important;

    align-items: center !important;

    column-gap: 8px !important;

    min-height: 58px !important;

    padding:
        9px
        12px !important;

    text-align: left !important;
}

#qbit-mercadopago-panel
.qbit-payment-choice__leading-icon {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 20px;
    height: 20px;

    color: #087ce1;
}

#qbit-mercadopago-panel
.qbit-payment-choice.is-disabled
.qbit-payment-choice__leading-icon {
    color: #6f88a0;
}

#qbit-mercadopago-panel
.qbit-payment-choice__content {
    min-width: 0;
}

#qbit-mercadopago-panel
.qbit-payment-choice__content strong {
    display: block;

    font-size: 14px !important;
    line-height: 1.25 !important;
    font-weight: 600 !important;
}

#qbit-mercadopago-panel
.qbit-payment-choice__content small {
    display: block;

    margin-top: 2px;

    font-size: 13px !important;
    line-height: 1.2 !important;
}

#qbit-mercadopago-panel
.qbit-payment-choice__brands {
    position: static !important;

    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;

    gap: 5px !important;

    min-width: 0;
    margin: 0 !important;

    transform: none !important;
}

#qbit-mercadopago-panel
#qbit-card-choice-logos
.qbit-mp-payment-logo {
    position: static !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 25px !important;
    min-width: 25px !important;
    height: 17px !important;

    margin: 0 !important;
    padding: 1px !important;

    transform: none !important;
}

#qbit-mercadopago-panel
#qbit-card-choice-logos
.qbit-mp-payment-logo svg {
    display: block !important;

    width: 100% !important;
    height: 100% !important;
}

#qbit-mercadopago-panel
.qbit-spei-wordmark {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-width: 48px;
    height: 22px;

    padding: 0 7px;

    border: 1px solid #ccd8e4;
    border-radius: 5px;

    background: #fff;

    color: #406486;

    font-size: 11px;
    line-height: 1;
    font-weight: 700;
    letter-spacing: .035em;
}

#qbit-mercadopago-panel
.qbit-mp-submit-row
#qbitMpPaymentLogos {
    display: none !important;
}


/*
 * Botón como Stripe:
 * ancho completo del formulario.
 */
#qbit-mercadopago-card-container
.qbit-mp-submit-row {
    max-width: 790px !important;
    width: 100% !important;

    display: block !important;

    margin-top: 12px !important;
}

#qbit-mercadopago-card-container
.qbit-mp-submit-row
[data-testid="submit-wrapper"],

#qbit-mercadopago-card-container
.qbit-mp-submit-row
[data-testid="submit-button"] {
    width: 100% !important;
    max-width: none !important;
}

#qbit-mercadopago-card-container
.qbit-mp-submit-row
button[type="submit"] {
    width: 100% !important;
    max-width: none !important;

    height: 38px !important;
    min-height: 38px !important;

    padding: 7px 16px !important;

    border-radius: 6px !important;

    font-size: 14px !important;
    font-weight: 600 !important;
}


/*
 * En móvil conservar composición clara.
 */
@media (max-width: 640px) {

    #qbit-mercadopago-panel
    .qbit-payment-choice {
        grid-template-columns:
            20px
            minmax(0, 1fr)
            auto !important;
    }

    #qbit-mercadopago-panel
    #qbit-card-choice-logos
    .qbit-mp-payment-logo {
        width: 22px !important;
        min-width: 22px !important;
        height: 15px !important;
    }
}

/* QBIT MERCADO PAGO STRIPE SELECTOR — END */