/*
 * BM Product Flow
 * Estilo visual compartido por:
 * - mac_binding_view.php
 * - installer_advancedriskreward_es.php
 * - tutorial_advancedriskreward_es.php
 *
 * Ruta del servidor: /panel/assets/css/bm-product-flow-v.css
 */

.bm-mac-binding-view {
    --brand-primary: #5267ff;
    --brand-primary-hover: #6f82ff;
    --text-primary: #f8fafc;
    --text-secondary: #aab4c6;
    --text-light: #7f8da9;
    --surface-deep: #111827;
    --surface-soft: rgba(255,255,255,.018);
    --border-subtle: rgba(148, 163, 184, .18);
    --border-strong: #64748b;
    --nt-text-main: var(--text-primary);
    --nt-text-muted: var(--text-secondary);
    --nt-border: var(--border-subtle);
    color: var(--text-primary);
}

.bm-mac-binding-view [hidden] {
    display: none !important;
}

.bm-mac-binding-view button,
.bm-mac-binding-view input,
.bm-mac-binding-view select,
.bm-mac-binding-view textarea {
    font: inherit;
}

.bm-mac-binding-view button {
    cursor: pointer;
}

.bm-mac-binding-view .text-muted {
    color: var(--text-secondary) !important;
}

.bm-mac-binding-view .small {
    font-size: .875rem;
}

.bm-mac-binding-view .alert {
    position: relative;
    margin: 0 0 1rem;
    padding: .9rem 1rem;
    border: 1px solid var(--border-subtle);
    border-radius: 12px;
    line-height: 1.5;
    color: var(--text-primary);
    background: rgba(30, 41, 59, .5);
}

.bm-mac-binding-view .alert-info {
    border-color: rgba(96, 165, 250, .30);
    background: rgba(37, 99, 235, .08);
}

.bm-mac-binding-view .alert-warning {
    border-color: rgba(251, 191, 36, .32);
    background: rgba(120, 74, 5, .13);
}

.bm-mac-binding-view .alert-danger {
    border-color: rgba(248, 113, 113, .34);
    background: rgba(127, 29, 29, .13);
}

.bm-mac-binding-view .alert-success {
    border-color: rgba(74, 222, 128, .30);
    background: rgba(20, 83, 45, .13);
}

.bm-mac-binding-view .nt-btn-lang {
    border: 1px solid var(--border-subtle);
    color: var(--text-primary);
    outline: none;
}

.bm-mac-binding-view .main-btn,
.bm-mac-binding-view .nt-btn-download {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    padding: .72rem 1rem;
    border: 1px solid rgba(130, 148, 255, .30);
    border-radius: 11px;
    background: linear-gradient(180deg, var(--brand-primary-hover), var(--brand-primary));
    color: #fff !important;
    font-weight: 800;
    line-height: 1.25;
    text-align: center;
    text-decoration: none !important;
    box-shadow: 0 10px 22px rgba(49, 71, 221, .20), 0 1px 0 rgba(255,255,255,.12) inset;
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}

.bm-mac-binding-view .main-btn:hover,
.bm-mac-binding-view .main-btn:focus-visible,
.bm-mac-binding-view .nt-btn-download:hover,
.bm-mac-binding-view .nt-btn-download:focus-visible {
    transform: translateY(-1px);
    background: linear-gradient(180deg, #7b8cff, #5a6fff);
    box-shadow: 0 13px 26px rgba(49, 71, 221, .28), 0 1px 0 rgba(255,255,255,.14) inset;
}

.bm-mac-binding-view .nt-fade-in {
    animation: bmProductFlowFadeIn .24s ease both;
}

@keyframes bmProductFlowFadeIn {
    from { opacity: 0; transform: translateY(4px); }
    to { opacity: 1; transform: translateY(0); }
}

/*
             * Esta vista NO define fondo, tipografía global ni tarjeta propia.
             * Hereda el diseño de stepbystep.php / index.php y solo organiza el
             * contenido en un flujo vertical inequívoco.
             */
            .bm-mac-binding-view {
                width: 100%;
            }

            .bm-mac-binding-view .bm-mac-shell {
                width: 100%;
                max-width: 1240px;
                margin: 0 auto;
            }

            .bm-mac-binding-view #bmProductHeading {
                width: 100%;
                max-width: none;
                margin: 0;
                text-align: left;
            }

            .bm-mac-binding-view .bm-product-layout {
                display: grid;
                grid-template-columns: minmax(0, 1fr) minmax(220px, auto);
                align-items: center;
                gap: clamp(16px, 2.5vw, 36px);
                width: 100%;
            }

            .bm-mac-binding-view .bm-product-main,
            .bm-mac-binding-view .bm-product-side {
                min-width: 0;
            }

            .bm-mac-binding-view .bm-product-side {
                display: flex;
                align-items: center;
                justify-content: flex-end;
                text-align: right;
                min-width: 0;
            }

            .bm-mac-binding-view .bm-product-side > p {
                margin: 0;
                max-width: 420px;
            }

            .bm-mac-binding-view .bm-product-context {
                display: flex;
                align-items: center;
                justify-content: flex-start;
                flex-wrap: wrap;
                gap: .55rem .8rem;
                margin-bottom: 8px;
            }

            .bm-mac-binding-view .bm-product-action {
                display: inline-flex;
                align-items: center;
                gap: .42rem;
                color: var(--brand-primary, #6b7cff);
                font-size: .76rem;
                font-weight: 800;
                letter-spacing: .075em;
                line-height: 1.2;
                text-transform: uppercase;
            }

            .bm-mac-binding-view .bm-product-action::before {
                content: "";
                width: 7px;
                height: 7px;
                flex: 0 0 7px;
                border-radius: 50%;
                background: currentColor;
                box-shadow: 0 0 0 4px rgba(82, 103, 255, .10);
            }

            .bm-mac-binding-view .bm-product-id {
                color: var(--text-light, #7f8da9);
                font-size: .8rem;
                font-weight: 650;
                letter-spacing: .01em;
            }

            .bm-mac-binding-view .bm-product-name {
                margin: 0 !important;
                color: var(--text-primary, #f8fafc);
                font-size: clamp(1.18rem, 2vw, 1.52rem);
                font-weight: 760;
                line-height: 1.24;
                letter-spacing: -.018em;
                overflow-wrap: anywhere;
            }

            .bm-mac-binding-view #bmProductHeading .text-muted {
                max-width: 760px;
                margin-left: 0;
                margin-right: 0;
            }

            .bm-mac-binding-view .bm-current-device-row {
                display: flex;
                align-items: center;
                justify-content: flex-start;
                flex-wrap: wrap;
                gap: .3rem .45rem;
                width: fit-content;
                max-width: 100%;
                padding: .44rem .72rem;
                border-radius: 12px;
                border: 1px solid var(--border-subtle, rgba(148, 163, 184, .18));
                background: rgba(255,255,255,.012);
                font-size: .8rem;
                line-height: 1.3;
                overflow-wrap: anywhere;
            }

            .bm-mac-binding-view .bm-current-device-label {
                color: var(--text-secondary, #94a3b8);
            }

            .bm-mac-binding-view .bm-current-device-value {
                color: var(--text-primary, #f8fafc);
                font-weight: 700;
                min-width: 0;
                overflow-wrap: anywhere;
            }

            .bm-mac-binding-view #bmLanguageChooser {
                width: 100%;
                max-width: none;
                margin: 20px 0 2px;
                padding-top: 18px;
                border-top: 1px solid var(--border-subtle, rgba(148, 163, 184, .18));
                text-align: left;
            }

            .bm-mac-binding-view #bmLanguageChooser .bm-language-layout {
                display: grid;
                grid-template-columns: minmax(0, 1fr) minmax(300px, 520px);
                align-items: center;
                gap: clamp(18px, 3vw, 42px);
                width: 100%;
            }

            .bm-mac-binding-view #bmLanguageChooser .bm-language-copy,
            .bm-mac-binding-view #bmLanguageChooser .bm-language-actions {
                min-width: 0;
            }

            .bm-mac-binding-view #bmLanguageChooser .bm-language-kicker,
            .bm-mac-binding-view .bm-process-kicker {
                margin: 0 0 6px;
                color: var(--brand-primary, #6b7cff);
                font-size: .71rem;
                font-weight: 800;
                letter-spacing: .085em;
                line-height: 1.2;
                text-transform: uppercase;
            }

            .bm-mac-binding-view #bmLanguageChooser .nt-lang-title {
                margin: 0;
                max-width: 430px;
                color: var(--text-primary, #f8fafc);
                font-size: 1.04rem;
                font-weight: 680;
                line-height: 1.42;
            }

            .bm-mac-binding-view #bmLanguageChooser .bm-language-actions {
                display: grid;
                grid-template-columns: repeat(2, minmax(0, 1fr));
                align-items: stretch;
                gap: 14px;
                width: 100%;
            }

            .bm-mac-binding-view #bmLanguageChooser .nt-btn-lang {
                width: 100%;
                min-width: 0;
                min-height: 52px;
                padding: .72rem 1rem;
                border-radius: 12px;
                background: rgba(255,255,255,.012);
                font-size: .95rem;
                font-weight: 700;
                transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease, background .18s ease;
            }

            .bm-mac-binding-view #bmLanguageChooser .nt-btn-lang:hover,
            .bm-mac-binding-view #bmLanguageChooser .nt-btn-lang:focus-visible {
                transform: translateY(-1px);
                border-color: rgba(82, 103, 255, .5);
                background: rgba(82, 103, 255, .045);
                box-shadow: 0 8px 20px rgba(82, 103, 255, .08);
            }

            .bm-mac-binding-view #bmActivationFlow {
                width: 100%;
                max-width: none;
                margin: 20px 0 0;
                padding-top: 18px;
                border-top: 1px solid var(--border-subtle, rgba(148, 163, 184, .18));
            }

            .bm-mac-binding-view .bm-process-heading {
                display: grid;
                grid-template-columns: minmax(0, 1fr) auto;
                align-items: center;
                gap: 12px 18px;
                margin-bottom: 14px;
            }

            .bm-mac-binding-view .bm-process-heading__copy {
                min-width: 0;
            }

            .bm-mac-binding-view .bm-process-title {
                margin: 0;
                color: var(--text-primary, #f8fafc);
                font-size: 1.04rem;
                font-weight: 680;
                line-height: 1.3;
            }

            .bm-mac-binding-view .bm-mac-flow {
                width: 100%;
                max-width: none;
                margin: 0;
            }

            .bm-mac-binding-view .bm-mac-step {
                position: relative;
                width: 100%;
                padding: 0 0 24px 56px;
            }

            .bm-mac-binding-view .bm-mac-step > .input-style-1,
            .bm-mac-binding-view .bm-mac-step > .alert,
            .bm-mac-binding-view .bm-mac-step > p {
                width: 100%;
                max-width: none;
            }

            .bm-mac-binding-view .bm-mac-step .input-style-1 input[type="text"] {
                width: 100%;
                max-width: none;
            }

            .bm-mac-binding-view .bm-mac-step:not(:last-child)::before {
                content: "";
                position: absolute;
                left: 15px;
                top: 31px;
                bottom: 0;
                width: 2px;
                background: var(--border-subtle, rgba(148, 163, 184, .22));
            }

            .bm-mac-binding-view .bm-mac-step-number {
                position: absolute;
                left: 0;
                top: 0;
                display: inline-flex;
                width: 32px;
                height: 32px;
                align-items: center;
                justify-content: center;
                border-radius: 50%;
                background: var(--brand-primary, #5267ff);
                color: #fff;
                font-size: .88rem;
                font-weight: 800;
                line-height: 1;
            }

            .bm-mac-binding-view .nt-btn-back {
                display: inline-flex;
                align-items: center;
                justify-content: center;
                width: auto !important;
                max-width: 100%;
                min-height: 38px;
                padding: .52rem .78rem;
                white-space: nowrap;
                line-height: 1.1;
                border-radius: 10px;
                border: 1px solid var(--border-subtle, rgba(148, 163, 184, .20));
                background: rgba(255,255,255,.018);
                color: var(--text-secondary, #aab4c6);
                font-size: .84rem;
                font-weight: 700;
                transition: border-color .18s ease, background .18s ease, color .18s ease;
            }

            .bm-mac-binding-view .nt-btn-back:hover,
            .bm-mac-binding-view .nt-btn-back:focus-visible {
                border-color: rgba(82, 103, 255, .42);
                background: rgba(82, 103, 255, .06);
                color: var(--text-primary, #f8fafc);
            }

            .bm-mac-binding-view .bm-flow-topbar {
                display: block;
                padding: 14px 16px;
                border-radius: 12px;
            }

            .bm-mac-binding-view .bm-flow-topbar__copy {
                min-width: 0;
                flex: 1 1 auto;
            }

            .bm-mac-binding-view .bm-process-heading .nt-btn-back {
                flex: 0 0 auto;
                margin: 0;
            }

            .bm-mac-binding-view .bm-mac-step-title {
                margin: 0 0 6px;
                font-size: 1rem;
                font-weight: 700;
            }

            .bm-mac-binding-view .bm-mac-step-description {
                margin: 0 0 12px;
            }

            .bm-mac-binding-view .bm-code-example {
                display: inline-block;
                margin-top: 5px;
                padding: 3px 8px;
                border: 1px solid var(--border-subtle, rgba(148, 163, 184, .22));
                border-radius: 6px;
                font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
                font-size: .84rem;
                letter-spacing: .02em;
            }

            .bm-mac-binding-view .bm-download-row {
                display: grid;
                grid-template-columns: minmax(0, 1fr) auto;
                align-items: center;
                gap: 12px 18px;
                width: 100%;
            }

            .bm-mac-binding-view .bm-download-row .bm-mac-step-description {
                margin: 0;
                min-width: 0;
            }

            .bm-mac-binding-view .bm-download-row .main-btn {
                width: auto !important;
                min-width: 0;
                margin: 0;
                padding: .72rem 1rem;
                white-space: nowrap;
                border-radius: 11px;
            }

            .bm-mac-binding-view #bmMacContinueButton {
                min-height: 46px;
            }

            /*
             * stepbystep.php ya reserva el espacio inferior necesario para la
             * navegación flotante. No se agrega padding dentro de esta plantilla,
             * porque ese espacio terminaría formando un vacío dentro de la tarjeta.
             */
            .bm-mac-binding-view.bm-has-floating-submit {
                padding-bottom: 0;
            }

            .bm-mac-binding-view .bm-required-alert {
                width: 100%;
                margin: 0 0 16px;
                padding: 11px 14px;
                border-radius: 12px;
                font-size: .9rem;
                font-weight: 650;
                line-height: 1.45;
            }

            .bm-mac-binding-view .bm-required-alert[hidden] {
                display: none !important;
            }

            /*
             * IMPORTANTE:
             * El flotante se mueve por JavaScript directamente a <body>.
             * Por eso estas reglas NO dependen de .bm-mac-binding-view.
             * Esto evita que overflow/transform de la tarjeta o del flujo de
             * animación conviertan el "fixed" en un bloque recortado dentro
             * del contenido.
             */
            .bm-mac-floating-submit {
                position: fixed;
                left: 50%;
                bottom: 14px;
                /*
                 * Visible desde el render inicial en mode 0 y mode 1.
                 * JavaScript solo lo mueve a <body> y reajusta su alineación;
                 * la visibilidad ya no depende de que ese montaje se ejecute.
                 */
                display: flex;
                align-items: center;
                justify-content: flex-end;
                gap: 16px;
                box-sizing: border-box;
                width: min(calc(100% - 44px), 1176px);
                margin: 0;
                padding: 10px;
                transform: translateX(-50%);
                z-index: 2147482000;
                background: rgba(30, 41, 59, .94);
                border: 1px solid var(--border-subtle, rgba(148, 163, 184, .16));
                border-radius: 16px;
                box-shadow: 0 18px 46px rgba(0, 0, 0, .34), 0 1px 0 rgba(255,255,255,.05) inset;
                backdrop-filter: blur(14px);
                -webkit-backdrop-filter: blur(14px);
            }

            .bm-mac-floating-submit.bm-is-mounted {
                display: flex;
            }

            .bm-mac-floating-submit__button {
                display: inline-flex;
                align-items: center;
                justify-content: center;
                width: auto;
                max-width: 100%;
                min-height: 46px;
                margin-left: auto;
                padding: 0 18px;
                border: 1px solid rgba(130, 148, 255, .30);
                border-radius: 12px;
                background: linear-gradient(180deg, var(--brand-primary-hover, #6f82ff), var(--brand-primary, #5267ff));
                color: #fff;
                font-weight: 850;
                line-height: 1.25;
                white-space: normal;
                text-align: center;
                overflow-wrap: anywhere;
                box-shadow: 0 12px 26px rgba(49, 71, 221, .24), 0 1px 0 rgba(255,255,255,.15) inset;
                transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
            }

            .bm-mac-floating-submit__button:hover {
                transform: translateY(-1px);
                background: linear-gradient(180deg, #7b8cff, #5a6fff);
                color: #fff;
                box-shadow: 0 15px 30px rgba(49, 71, 221, .32), 0 1px 0 rgba(255,255,255,.16) inset;
            }

            @media (max-width: 820px) {
                .bm-mac-binding-view.bm-has-floating-submit {
                    padding-bottom: 0;
                }

                .bm-mac-floating-submit {
                    bottom: max(10px, env(safe-area-inset-bottom));
                    width: calc(100% - 28px);
                    padding: 8px;
                }
            }

            @media (max-width: 575.98px) {
                .bm-mac-floating-submit {
                    left: 12px;
                    right: 12px;
                    width: auto;
                    max-width: none;
                    transform: none;
                }

                .bm-mac-floating-submit__button {
                    width: 100%;
                    min-width: 0;
                    min-height: 48px;
                    margin-left: 0;
                    padding: 10px 14px;
                    font-size: .94rem;
                }
            }

            @media (max-width: 380px) {
                .bm-mac-floating-submit {
                    left: 8px;
                    right: 8px;
                    padding: 7px;
                }

                .bm-mac-floating-submit__button {
                    padding-left: 10px;
                    padding-right: 10px;
                    font-size: .88rem;
                }
            }

            /*
             * Los inputs siguen usando input-style-1, pero se refuerza su contraste
             * para que sea evidente dónde debe escribir/pegar el usuario.
             * No se altera el fondo ni la tarjeta heredada de stepbystep.php.
             */
            .bm-mac-binding-view .input-style-1 label {
                display: block;
                margin-bottom: 8px;
                color: var(--text-primary, #f1f5f9) !important;
                font-weight: 700;
            }

            .bm-mac-binding-view .input-style-1 input[type="text"] {
                min-height: 50px;
                padding: 12px 14px !important;
                border: 2px solid var(--border-strong, #64748b) !important;
                border-radius: 8px !important;
                background: var(--surface-deep, #111827) !important;
                color: var(--text-primary, #f8fafc) !important;
                font-size: 1rem !important;
                line-height: 1.35;
                box-shadow: 0 1px 0 rgba(255,255,255,.05) inset, 0 0 0 1px rgba(255,255,255,.025);
                transition: border-color .18s ease, box-shadow .18s ease, background .18s ease;
            }

            .bm-mac-binding-view .input-style-1 input[type="text"]::placeholder {
                color: var(--text-secondary, #aab4c6) !important;
                opacity: .9;
            }

            .bm-mac-binding-view .input-style-1 input[type="text"]:focus {
                outline: none !important;
                border-color: var(--brand-primary, #5267ff) !important;
                background: var(--surface-deep, #111827) !important;
                box-shadow: 0 0 0 3px rgba(82, 103, 255, .20) !important;
            }

            .bm-mac-binding-view #macAddress {
                font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
                font-weight: 700;
                letter-spacing: .035em;
            }

            .bm-mac-binding-view .bm-next-step-message {
                margin-bottom: 10px;
            }

            /* Un destino vacío no debe reservar margen dentro de la tarjeta. */
            #bmNextStepDestination:empty {
                display: none;
            }

            @media (max-width: 860px) {
                .bm-mac-binding-view .bm-product-layout {
                    grid-template-columns: minmax(0, 1fr) minmax(190px, auto);
                    gap: 14px 20px;
                }

                .bm-mac-binding-view #bmLanguageChooser .bm-language-layout {
                    grid-template-columns: minmax(0, 1fr) minmax(280px, 420px);
                    gap: 16px 24px;
                }

                .bm-mac-binding-view .bm-product-side {
                    justify-content: flex-end;
                    text-align: right;
                }
            }

            @media (max-width: 680px) {
                .bm-mac-binding-view .bm-product-layout {
                    grid-template-columns: minmax(0, 1fr) minmax(160px, auto);
                    gap: 10px 14px;
                }

                .bm-mac-binding-view #bmLanguageChooser .bm-language-layout {
                    grid-template-columns: 1fr;
                }

                .bm-mac-binding-view .bm-product-side {
                    justify-content: flex-end;
                    text-align: right;
                }

                .bm-mac-binding-view .bm-current-device-row {
                    width: auto;
                    max-width: 100%;
                }

                .bm-mac-binding-view #bmLanguageChooser {
                    margin-top: 20px;
                    padding-top: 18px;
                }

                .bm-mac-binding-view #bmLanguageChooser .nt-lang-title {
                    max-width: none;
                }

                .bm-mac-binding-view .bm-download-row {
                    grid-template-columns: 1fr;
                    gap: 10px;
                }

                .bm-mac-binding-view .bm-download-row .main-btn {
                    width: fit-content !important;
                    max-width: 100%;
                }
            }

            @media (max-width: 560px) {
                .bm-mac-binding-view .bm-product-layout {
                    grid-template-columns: 1fr;
                    gap: 9px;
                }

                .bm-mac-binding-view .bm-product-side {
                    justify-content: flex-start;
                    text-align: left;
                }

                .bm-mac-binding-view .bm-current-device-row {
                    width: fit-content;
                    max-width: 100%;
                }
            }

            @media (max-width: 520px) {
                .bm-mac-binding-view #bmLanguageChooser .bm-language-actions {
                    grid-template-columns: repeat(2, minmax(0, 1fr));
                    gap: 10px;
                }

                .bm-mac-binding-view .bm-process-heading {
                    grid-template-columns: minmax(0, 1fr) auto;
                    align-items: start;
                }

                .bm-mac-binding-view .bm-process-title {
                    font-size: .98rem;
                }

                .bm-mac-binding-view .nt-btn-back {
                    padding: .5rem .65rem;
                    font-size: .78rem;
                }

                .bm-mac-binding-view .bm-mac-step {
                    padding-left: 42px;
                    padding-bottom: 20px;
                }

                .bm-mac-binding-view .bm-mac-step-number {
                    width: 28px;
                    height: 28px;
                    font-size: .8rem;
                }

                .bm-mac-binding-view .bm-mac-step:not(:last-child)::before {
                    left: 13px;
                    top: 27px;
                }

                .bm-mac-binding-view .bm-product-action {
                    font-size: .7rem;
                    letter-spacing: .055em;
                }

                .bm-mac-binding-view .bm-product-context {
                    gap: .4rem .6rem;
                }

                .bm-mac-binding-view .bm-product-name {
                    font-size: 1.12rem;
                }

                .bm-mac-binding-view .bm-flow-topbar {
                    padding: 12px 13px;
                }
            }

            @media (max-width: 380px) {
                .bm-mac-binding-view #bmLanguageChooser .bm-language-actions {
                    grid-template-columns: 1fr;
                }

                .bm-mac-binding-view .bm-process-heading {
                    grid-template-columns: 1fr;
                }

                .bm-mac-binding-view .bm-process-heading .nt-btn-back {
                    justify-self: start;
                }

                .bm-mac-binding-view .bm-download-row .main-btn {
                    width: 100% !important;
                    white-space: normal;
                    text-align: center;
                }
            }


/* ===== Componentes compartidos para instalación y tutorial ===== */
.bm-mac-binding-view .bm-flow-section {
    width: 100%;
    max-width: none;
    margin: 0;
}

.bm-mac-binding-view .bm-flow-section + .bm-flow-section {
    margin-top: 22px;
    padding-top: 22px;
    border-top: 1px solid var(--border-subtle);
}

.bm-mac-binding-view .bm-flow-section-title {
    margin: 0 0 8px;
    color: var(--text-primary);
    font-size: 1.05rem;
    font-weight: 760;
    line-height: 1.35;
}

.bm-mac-binding-view .bm-flow-section-description {
    margin: 0 0 16px;
    color: var(--text-secondary);
    line-height: 1.6;
}

.bm-mac-binding-view .bm-step-copy {
    margin: 0;
    color: var(--text-secondary);
    line-height: 1.62;
}

.bm-mac-binding-view .bm-step-copy strong,
.bm-mac-binding-view .bm-step-copy b {
    color: var(--text-primary);
}

.bm-mac-binding-view .bm-step-copy + .bm-step-copy {
    margin-top: 8px;
}

.bm-mac-binding-view .bm-step-list {
    margin: 10px 0 0;
    padding-left: 1.25rem;
    color: var(--text-secondary);
    line-height: 1.65;
}

.bm-mac-binding-view .bm-step-list li + li {
    margin-top: 4px;
}

.bm-mac-binding-view .nt-dl-wrapper {
    display: flex;
    justify-content: flex-start;
    margin-top: 14px;
}

.bm-mac-binding-view .nt-dl-wrapper a {
    display: inline-flex;
    max-width: 100%;
    text-decoration: none !important;
}

.bm-mac-binding-view .nt-btn-download {
    max-width: 100%;
    white-space: normal;
}

.bm-mac-binding-view .nt-img-wrapper-center {
    display: flex;
    justify-content: flex-start;
    width: 100%;
    margin-top: 14px;
}

.bm-mac-binding-view .bm-image-grid,
.bm-mac-binding-view .d-flex.justify-content-center.flex-wrap.gap-3 {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start !important;
    gap: 12px;
    width: 100%;
}

.bm-mac-binding-view .nt-img-container {
    display: inline-flex;
    max-width: 100%;
    padding: 6px;
    border: 1px solid var(--border-subtle);
    border-radius: 12px;
    background: rgba(255,255,255,.012);
}

.bm-mac-binding-view .nt-img-thumb {
    display: block;
    width: auto;
    max-width: 100%;
    height: auto;
    border-radius: 8px;
    cursor: zoom-in;
    transition: transform .18s ease, opacity .18s ease;
}

.bm-mac-binding-view .nt-img-thumb:hover {
    transform: translateY(-1px);
    opacity: .96;
}

.nt-modal-backdrop {
    position: fixed !important;
    inset: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: 100% !important;
    padding: 18px;
    background: rgba(3, 7, 18, .88);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    transition: opacity .2s ease;
}

.nt-modal-close {
    z-index: 2;
    min-width: 38px;
    min-height: 38px;
    border: 1px solid rgba(255,255,255,.18);
    border-radius: 10px;
    background: rgba(15, 23, 42, .88);
    color: #fff;
    font-size: 1rem;
    font-weight: 800;
}

.bm-mac-binding-view .nt-virus-box,
.bm-mac-binding-view .bm-considerations-box {
    margin: 0 0 20px;
    padding: 14px 16px;
    border: 1px solid rgba(251, 191, 36, .30);
    border-left: 4px solid #fbbf24;
    border-radius: 12px;
    background: rgba(120, 74, 5, .10);
}

.bm-mac-binding-view .nt-virus-text {
    margin: 0;
    color: var(--text-secondary);
    line-height: 1.55;
}

.bm-mac-binding-view .nt-virus-text strong {
    color: var(--text-primary);
}

.bm-mac-binding-view .nt-video-container {
    position: relative;
    width: 100%;
    max-width: 920px;
    aspect-ratio: 16 / 9;
    margin-top: 16px;
    overflow: hidden;
    border: 1px solid var(--border-subtle);
    border-radius: 14px;
    background: #050914;
    box-shadow: 0 16px 36px rgba(0,0,0,.18);
}

.bm-mac-binding-view .nt-video-container iframe {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: 0;
}

@media (max-width: 680px) {
    .bm-mac-binding-view .nt-img-wrapper-center,
    .bm-mac-binding-view .nt-dl-wrapper {
        justify-content: stretch;
    }

    .bm-mac-binding-view .nt-dl-wrapper a,
    .bm-mac-binding-view .nt-btn-download {
        width: 100%;
    }
}


.bm-secondary-machine-notice {
            position: fixed;
            inset: 0;
            z-index: 2147483000;
            display: flex;
            align-items: center;
            justify-content: center;
            padding: 24px;
            background: rgba(4, 10, 20, 0.82);
            backdrop-filter: blur(7px);
            -webkit-backdrop-filter: blur(7px);
        }

        .bm-secondary-machine-notice[hidden] {
            display: none !important;
        }

        .bm-secondary-machine-notice__dialog {
            width: min(100%, 590px);
            overflow: hidden;
            border: 1px solid rgba(96, 165, 250, 0.42);
            border-radius: 18px;
            background:
                radial-gradient(circle at top right, rgba(37, 99, 235, 0.17), transparent 42%),
                #0d1728;
            box-shadow: 0 28px 90px rgba(0, 0, 0, 0.62);
            color: #f8fafc;
        }

        .bm-secondary-machine-notice__header {
            display: flex;
            gap: 15px;
            align-items: flex-start;
            padding: 24px 26px 18px;
            border-bottom: 1px solid rgba(148, 163, 184, 0.18);
        }

        .bm-secondary-machine-notice__icon {
            display: inline-flex;
            flex: 0 0 48px;
            width: 48px;
            height: 48px;
            align-items: center;
            justify-content: center;
            border: 1px solid rgba(96, 165, 250, 0.46);
            border-radius: 14px;
            background: rgba(37, 99, 235, 0.18);
            color: #93c5fd;
        }

        .bm-secondary-machine-notice__title {
            margin: 0;
            color: #ffffff;
            font-size: 1.3rem;
            font-weight: 800;
            line-height: 1.25;
        }

        .bm-secondary-machine-notice__subtitle {
            margin: 6px 0 0;
            color: #b8c5d9;
            font-size: 0.94rem;
            line-height: 1.5;
        }

        .bm-secondary-machine-notice__body {
            padding: 23px 26px 25px;
        }

        .bm-secondary-machine-notice__important {
            margin: 0 0 17px;
            padding: 16px 17px;
            border: 1px solid rgba(251, 191, 36, 0.38);
            border-left: 5px solid #fbbf24;
            border-radius: 11px;
            background: rgba(120, 74, 5, 0.16);
            color: #f8fafc;
            font-size: 1rem;
            line-height: 1.6;
        }

        .bm-secondary-machine-notice__important strong {
            color: #fde68a;
        }

        .bm-secondary-machine-notice__explanation {
            margin: 0 0 19px;
            color: #cbd5e1;
            font-size: 0.94rem;
            line-height: 1.58;
        }

        .bm-secondary-machine-notice__check {
            display: flex;
            gap: 11px;
            align-items: flex-start;
            margin: 0;
            padding: 14px 15px;
            border: 1px solid rgba(148, 163, 184, 0.26);
            border-radius: 11px;
            background: rgba(30, 41, 59, 0.72);
            cursor: pointer;
        }

        .bm-secondary-machine-notice__check input {
            width: 19px;
            height: 19px;
            margin: 2px 0 0;
            flex: 0 0 19px;
            accent-color: #3b82f6;
        }

        .bm-secondary-machine-notice__check span {
            color: #e2e8f0;
            font-size: 0.94rem;
            font-weight: 600;
            line-height: 1.45;
        }

        .bm-secondary-machine-notice__actions {
            display: flex;
            gap: 11px;
            justify-content: flex-end;
            margin-top: 21px;
        }

        .bm-secondary-machine-notice__back,
        .bm-secondary-machine-notice__confirm {
            min-height: 43px;
            padding: 10px 17px;
            border-radius: 10px;
            font-size: 0.93rem;
            font-weight: 750;
            text-decoration: none;
            transition: opacity 0.18s ease, transform 0.18s ease, background 0.18s ease;
        }

        .bm-secondary-machine-notice__back {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            border: 1px solid rgba(148, 163, 184, 0.3);
            background: rgba(30, 41, 59, 0.78);
            color: #dbe7f5;
        }

        .bm-secondary-machine-notice__back:hover {
            color: #ffffff;
            background: rgba(51, 65, 85, 0.9);
        }

        .bm-secondary-machine-notice__confirm {
            border: 1px solid rgba(96, 165, 250, 0.72);
            background: #2563eb;
            color: #ffffff;
        }

        .bm-secondary-machine-notice__confirm:not(:disabled):hover {
            transform: translateY(-1px);
            background: #1d4ed8;
        }

        .bm-secondary-machine-notice__confirm:disabled {
            cursor: not-allowed;
            opacity: 0.42;
        }

        @media (max-width: 575.98px) {
            .bm-secondary-machine-notice {
                padding: 14px;
            }

            .bm-secondary-machine-notice__header,
            .bm-secondary-machine-notice__body {
                padding-left: 19px;
                padding-right: 19px;
            }

            .bm-secondary-machine-notice__actions {
                flex-direction: column-reverse;
            }

            .bm-secondary-machine-notice__back,
            .bm-secondary-machine-notice__confirm {
                width: 100%;
            }
        }


/* ===== BM FLOW V3 · PROGRESO VISUAL + COMPOSICIÓN RESPONSIVE ===== */

/*
 * Un mismo sistema, tres identidades de etapa.
 * El color cambia solo como acento funcional para que el usuario perciba
 * inmediatamente que avanzó, sin romper la homogeneidad entre pantallas.
 */
.bm-mac-binding-view.bm-product-flow-step--1 {
    --bm-flow-accent: #5267ff;
    --bm-flow-accent-rgb: 82, 103, 255;
}

.bm-mac-binding-view.bm-product-flow-step--2 {
    --bm-flow-accent: #14b8a6;
    --bm-flow-accent-rgb: 20, 184, 166;
}

.bm-mac-binding-view.bm-product-flow-step--3 {
    --bm-flow-accent: #8b5cf6;
    --bm-flow-accent-rgb: 139, 92, 246;
}

.bm-mac-binding-view[class*="bm-product-flow-step--"] .bm-product-action,
.bm-mac-binding-view[class*="bm-product-flow-step--"] #bmLanguageChooser .bm-language-kicker,
.bm-mac-binding-view[class*="bm-product-flow-step--"] .bm-process-kicker {
    color: var(--bm-flow-accent);
}

.bm-mac-binding-view[class*="bm-product-flow-step--"] .bm-product-action::before,
.bm-mac-binding-view[class*="bm-product-flow-step--"] .bm-mac-step-number {
    background: var(--bm-flow-accent);
}

.bm-mac-binding-view[class*="bm-product-flow-step--"] .bm-product-action::before {
    box-shadow: 0 0 0 4px rgba(var(--bm-flow-accent-rgb), .11);
}

.bm-mac-binding-view[class*="bm-product-flow-step--"] .bm-flow-topbar {
    border-color: rgba(var(--bm-flow-accent-rgb), .30);
    border-left: 3px solid var(--bm-flow-accent);
    background: linear-gradient(90deg, rgba(var(--bm-flow-accent-rgb), .105), rgba(var(--bm-flow-accent-rgb), .035));
}

.bm-mac-binding-view[class*="bm-product-flow-step--"] #bmLanguageChooser .nt-btn-lang:hover,
.bm-mac-binding-view[class*="bm-product-flow-step--"] #bmLanguageChooser .nt-btn-lang:focus-visible,
.bm-mac-binding-view[class*="bm-product-flow-step--"] .nt-btn-back:hover,
.bm-mac-binding-view[class*="bm-product-flow-step--"] .nt-btn-back:focus-visible {
    border-color: rgba(var(--bm-flow-accent-rgb), .52);
    background: rgba(var(--bm-flow-accent-rgb), .065);
}

/* Indicador visual de las tres etapas. */
.bm-mac-binding-view .bm-stage-progress {
    width: 100%;
    margin: 0 0 24px;
    padding: 14px 16px;
    border: 1px solid var(--border-subtle);
    border-radius: 16px;
    background: rgba(255,255,255,.012);
    overflow: hidden;
}

.bm-mac-binding-view .bm-stage-progress__track {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    align-items: stretch;
    gap: 0;
    width: 100%;
}

.bm-mac-binding-view .bm-stage-progress__item {
    position: relative;
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
    min-height: 52px;
    padding: 7px 18px 7px 8px;
    border-radius: 12px;
    color: var(--text-light);
}

.bm-mac-binding-view .bm-stage-progress__item:not(:last-child)::after {
    content: "";
    position: absolute;
    top: 50%;
    right: -1px;
    width: 1px;
    height: 30px;
    transform: translateY(-50%);
    background: var(--border-subtle);
}

.bm-mac-binding-view .bm-stage-progress__item.is-current {
    color: var(--text-primary);
    background: linear-gradient(135deg, rgba(var(--bm-flow-accent-rgb), .14), rgba(var(--bm-flow-accent-rgb), .045));
    box-shadow: inset 0 0 0 1px rgba(var(--bm-flow-accent-rgb), .18);
}

.bm-mac-binding-view .bm-stage-progress__item.is-complete {
    color: var(--text-secondary);
}

.bm-mac-binding-view .bm-stage-progress__marker {
    position: relative;
    display: inline-flex;
    flex: 0 0 32px;
    width: 32px;
    height: 32px;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--border-strong);
    border-radius: 50%;
    background: rgba(255,255,255,.018);
    color: var(--text-secondary);
    font-size: .78rem;
    font-weight: 800;
    line-height: 1;
}

.bm-mac-binding-view .bm-stage-progress__item.is-current .bm-stage-progress__marker {
    border-color: var(--bm-flow-accent);
    background: var(--bm-flow-accent);
    color: #fff;
    box-shadow: 0 0 0 5px rgba(var(--bm-flow-accent-rgb), .10);
}

.bm-mac-binding-view .bm-stage-progress__item.is-complete .bm-stage-progress__marker {
    border-color: rgba(74, 222, 128, .40);
    background: rgba(34, 197, 94, .13);
    color: #66e39a;
}

.bm-mac-binding-view .bm-stage-progress__check {
    display: none;
    font-size: .84rem;
}

.bm-mac-binding-view .bm-stage-progress__item.is-complete .bm-stage-progress__number {
    display: none;
}

.bm-mac-binding-view .bm-stage-progress__item.is-complete .bm-stage-progress__check {
    display: inline;
}

.bm-mac-binding-view .bm-stage-progress__copy {
    display: flex;
    flex-direction: column;
    min-width: 0;
    line-height: 1.15;
}

.bm-mac-binding-view .bm-stage-progress__eyebrow {
    margin-bottom: 3px;
    color: currentColor;
    opacity: .72;
    font-size: .64rem;
    font-weight: 800;
    letter-spacing: .07em;
    text-transform: uppercase;
}

.bm-mac-binding-view .bm-stage-progress__label {
    overflow: hidden;
    color: currentColor;
    font-size: .86rem;
    font-weight: 740;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.bm-mac-binding-view .bm-stage-progress__item.is-current .bm-stage-progress__eyebrow {
    color: var(--bm-flow-accent);
    opacity: 1;
}

/*
 * Instalador: aprovecha el ancho disponible. En escritorio, cada instrucción
 * con captura se distribuye en dos zonas; en pantallas menores vuelve a una
 * sola columna de forma natural.
 */
.bm-mac-binding-view .bm-mac-step--media {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(280px, 440px);
    column-gap: clamp(24px, 4vw, 58px);
    row-gap: 7px;
    align-items: start;
}

.bm-mac-binding-view .bm-mac-step--media > .bm-mac-step-title,
.bm-mac-binding-view .bm-mac-step--media > .bm-step-copy,
.bm-mac-binding-view .bm-mac-step--media > .bm-step-list {
    grid-column: 1;
    min-width: 0;
}

.bm-mac-binding-view .bm-mac-step--media > .nt-img-wrapper-center {
    grid-column: 2;
    grid-row: 1 / span 12;
    align-self: center;
    justify-content: center;
    margin: 0;
    min-width: 0;
}

.bm-mac-binding-view .bm-mac-step--media .bm-image-grid {
    justify-content: center !important;
}

.bm-mac-binding-view .bm-mac-step--action {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(280px, 430px);
    column-gap: clamp(24px, 4vw, 58px);
    row-gap: 7px;
    align-items: center;
}

.bm-mac-binding-view .bm-mac-step--action > .bm-mac-step-title,
.bm-mac-binding-view .bm-mac-step--action > .bm-step-copy {
    grid-column: 1;
}

.bm-mac-binding-view .bm-mac-step--action > .nt-dl-wrapper {
    grid-column: 2;
    grid-row: 1 / span 4;
    justify-content: center;
    margin: 0;
}

.bm-mac-binding-view .bm-mac-step--action .nt-btn-download {
    width: min(100%, 390px);
}

.bm-mac-binding-view .bm-mac-step--complete {
    margin-top: 4px;
    padding-top: 14px;
    padding-bottom: 14px !important;
    border: 1px solid rgba(74, 222, 128, .20);
    border-radius: 14px;
    background: linear-gradient(90deg, rgba(34, 197, 94, .075), rgba(34, 197, 94, .018));
}

.bm-mac-binding-view .bm-mac-step--complete .bm-mac-step-number {
    top: 14px;
    left: 12px;
    background: #22c55e;
}

.bm-mac-binding-view .bm-mac-step--complete {
    padding-left: 66px;
}

/* Los elementos puramente visuales se centran, evitando acumulación a la izquierda. */
.bm-mac-binding-view .nt-img-wrapper-center,
.bm-mac-binding-view .nt-dl-wrapper {
    justify-content: center;
}

.bm-mac-binding-view .bm-image-grid,
.bm-mac-binding-view .d-flex.justify-content-center.flex-wrap.gap-3 {
    justify-content: center !important;
}

.bm-mac-binding-view .nt-video-container {
    margin-left: auto;
    margin-right: auto;
}

.bm-mac-binding-view .bm-flow-section--featured {
    text-align: center;
}

.bm-mac-binding-view .bm-flow-section--featured .bm-flow-section-description {
    max-width: 900px;
    margin-left: auto;
    margin-right: auto;
}

.bm-mac-binding-view.bm-product-flow-step--3 .bm-considerations-box {
    max-width: 940px;
    margin-left: auto;
    margin-right: auto;
}

/* Mejora del encabezado para que la fase tenga identidad sin agrandar textos. */
.bm-mac-binding-view.bm-product-flow-view #bmProductHeading,
.bm-mac-binding-view.bm-product-flow-step--1 #bmProductHeading {
    position: relative;
    padding: 16px 18px;
    border: 1px solid rgba(var(--bm-flow-accent-rgb), .16);
    border-radius: 15px;
    background:
        radial-gradient(circle at 0 0, rgba(var(--bm-flow-accent-rgb), .075), transparent 42%),
        rgba(255,255,255,.008);
}

@media (max-width: 900px) {
    .bm-mac-binding-view .bm-mac-step--media,
    .bm-mac-binding-view .bm-mac-step--action {
        grid-template-columns: 1fr;
        row-gap: 12px;
    }

    .bm-mac-binding-view .bm-mac-step--media > .bm-mac-step-title,
    .bm-mac-binding-view .bm-mac-step--media > .bm-step-copy,
    .bm-mac-binding-view .bm-mac-step--media > .bm-step-list,
    .bm-mac-binding-view .bm-mac-step--media > .nt-img-wrapper-center,
    .bm-mac-binding-view .bm-mac-step--action > .bm-mac-step-title,
    .bm-mac-binding-view .bm-mac-step--action > .bm-step-copy,
    .bm-mac-binding-view .bm-mac-step--action > .nt-dl-wrapper {
        grid-column: 1;
        grid-row: auto;
    }

    .bm-mac-binding-view .bm-mac-step--media > .nt-img-wrapper-center,
    .bm-mac-binding-view .bm-mac-step--action > .nt-dl-wrapper {
        margin-top: 5px;
    }
}

@media (max-width: 680px) {
    .bm-mac-binding-view .bm-stage-progress {
        margin-bottom: 18px;
        padding: 10px;
    }

    .bm-mac-binding-view .bm-stage-progress__item {
        gap: 7px;
        min-height: 48px;
        padding: 6px 9px;
    }

    .bm-mac-binding-view .bm-stage-progress__marker {
        flex-basis: 28px;
        width: 28px;
        height: 28px;
        font-size: .72rem;
    }

    .bm-mac-binding-view .bm-stage-progress__label {
        font-size: .78rem;
    }

    .bm-mac-binding-view .bm-stage-progress__eyebrow {
        font-size: .58rem;
    }

    .bm-mac-binding-view.bm-product-flow-view #bmProductHeading,
    .bm-mac-binding-view.bm-product-flow-step--1 #bmProductHeading {
        padding: 13px 14px;
    }
}

@media (max-width: 500px) {
    .bm-mac-binding-view .bm-stage-progress__item {
        flex-direction: column;
        justify-content: center;
        gap: 5px;
        padding: 7px 4px;
        text-align: center;
    }

    .bm-mac-binding-view .bm-stage-progress__copy {
        align-items: center;
    }

    .bm-mac-binding-view .bm-stage-progress__item:not(:last-child)::after {
        top: 50%;
        right: 0;
        height: 38px;
    }

    .bm-mac-binding-view .bm-stage-progress__eyebrow {
        display: none;
    }

    .bm-mac-binding-view .bm-stage-progress__label {
        max-width: 92px;
        font-size: .72rem;
    }

    .bm-mac-binding-view .bm-mac-step--complete {
        padding-left: 54px;
    }

    .bm-mac-binding-view .bm-mac-step--complete .bm-mac-step-number {
        left: 10px;
    }
}

/* ===== Extensiones BM Product Flow: tutoriales de bloqueo permanente ===== */
.nt-permanent-device-guide {
    --nt-guide-accent: var(--bm-flow-accent, var(--brand-primary, #5267ff));
    --nt-guide-accent-soft: rgba(var(--bm-flow-accent-rgb, 139, 92, 246), .12);
    --nt-guide-border: var(--border-subtle, rgba(148, 163, 184, .22));
    --nt-guide-surface: var(--surface-deep, #111827);
    --nt-guide-surface-soft: var(--surface-soft, rgba(255,255,255,.018));
    --nt-guide-text: var(--text-primary, #f8fafc);
    --nt-guide-muted: var(--text-secondary, #aab4c6);
}

/* ===== Extensiones BM Product Flow: persona de confianza / instructor ===== */
.bm-trusted-person-view {
    --nt-bg-inner: var(--surface-deep, #111827);
    --nt-border: var(--border-subtle, rgba(148, 163, 184, .18));
    --nt-text-main: var(--text-primary, #f8fafc);
    --nt-text-muted: var(--text-secondary, #aab4c6);
    --nt-primary: var(--brand-primary, #5267ff);
}

/*
    |--------------------------------------------------------------------------
    | Estilos específicos del tutorial
    |--------------------------------------------------------------------------
    */

    .nt-permanent-device-guide {
        --nt-guide-accent: var(--bm-flow-accent, var(--brand-primary, #5267ff));
        --nt-guide-accent-soft: rgba(var(--bm-flow-accent-rgb, 139, 92, 246), 0.12);
        --nt-guide-border: var(--border-subtle, rgba(148, 163, 184, .22));
        --nt-guide-surface: var(--surface-deep, #111827);
        --nt-guide-surface-soft: var(--surface-soft, rgba(255,255,255,.018));
        --nt-guide-text: var(--text-primary, #f8fafc);
        --nt-guide-muted: var(--text-secondary, #aab4c6);
    }

    .nt-permanent-device-guide *,
.nt-permanent-device-modal * {
        box-sizing: border-box;
    }

    .nt-permanent-device-guide .nt-modern-header p {
        margin-bottom: 0;
    }

    .nt-permanent-device-guide .nt-guide-intro {
        display: grid;
        gap: 18px;
        margin: 24px 0 30px;
    }

    .nt-permanent-device-guide .nt-guide-definition {
        padding: 22px;
        border: 1px solid var(--nt-guide-border);
        border-radius: 18px;
        background:
            linear-gradient(
                135deg,
                var(--nt-guide-accent-soft),
                transparent 68%
            ),
            var(--nt-guide-surface-soft);
    }

    .nt-permanent-device-guide .nt-guide-definition h3 {
        margin: 0 0 12px;
        color: var(--nt-guide-text);
        font-size: clamp(1.15rem, 2vw, 1.45rem);
        line-height: 1.3;
    }

    .nt-permanent-device-guide .nt-guide-definition p {
        margin: 0 0 12px;
        color: var(--nt-guide-muted);
        line-height: 1.7;
    }

    .nt-permanent-device-guide .nt-guide-definition p:last-child {
        margin-bottom: 0;
    }

    .nt-permanent-device-guide .nt-guide-definition strong {
        color: var(--nt-guide-text);
    }

    .nt-permanent-device-guide .nt-permanent-definition {
        margin-top: 17px;
        padding: 16px 18px;
        border: 1px solid rgba(var(--bm-flow-accent-rgb, 139, 92, 246), 0.3);
        border-radius: 14px;
        background: rgba(var(--bm-flow-accent-rgb, 139, 92, 246), 0.08);
    }

    .nt-permanent-device-guide .nt-permanent-definition strong {
        display: block;
        margin-bottom: 6px;
        color: var(--nt-guide-text);
    }

    .nt-permanent-device-guide .nt-permanent-definition span {
        display: block;
        color: var(--nt-guide-muted);
        line-height: 1.65;
    }

    .nt-permanent-device-guide .nt-device-structure {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 14px;
    }

    .nt-permanent-device-guide .nt-device-card {
        display: flex;
        gap: 14px;
        align-items: flex-start;
        min-height: 100%;
        padding: 18px;
        border: 1px solid var(--nt-guide-border);
        border-radius: 16px;
        background: var(--nt-guide-surface-soft);
    }

    .nt-permanent-device-guide .nt-device-card.is-primary {
        border-color: rgba(34, 197, 94, 0.28);
        background:
            linear-gradient(
                135deg,
                rgba(34, 197, 94, 0.08),
                transparent 72%
            ),
            var(--nt-guide-surface-soft);
    }

    .nt-permanent-device-guide .nt-device-card.is-secondary {
        border-color: rgba(245, 158, 11, 0.28);
        background:
            linear-gradient(
                135deg,
                rgba(245, 158, 11, 0.08),
                transparent 72%
            ),
            var(--nt-guide-surface-soft);
    }

    .nt-permanent-device-guide .nt-device-icon {
        display: grid;
        flex: 0 0 46px;
        width: 46px;
        height: 46px;
        place-items: center;
        border-radius: 14px;
        background: var(--nt-guide-accent-soft);
        font-size: 1.25rem;
    }

    .nt-permanent-device-guide .nt-device-card strong {
        display: block;
        margin-bottom: 6px;
        color: var(--nt-guide-text);
    }

    .nt-permanent-device-guide .nt-device-card span {
        display: block;
        color: var(--nt-guide-muted);
        font-size: 0.92rem;
        line-height: 1.55;
    }

    .nt-permanent-device-guide .nt-guide-family {
        padding: 18px;
        border: 1px solid var(--nt-guide-border);
        border-radius: 16px;
        background: var(--nt-guide-surface-soft);
    }

    .nt-permanent-device-guide .nt-guide-family-title {
        display: block;
        margin-bottom: 12px;
        color: var(--nt-guide-text);
        font-weight: 800;
    }

    .nt-permanent-device-guide .nt-guide-family-items {
        display: flex;
        flex-wrap: wrap;
        gap: 9px;
    }

    .nt-permanent-device-guide .nt-guide-family-item {
        padding: 7px 11px;
        border: 1px solid rgba(var(--bm-flow-accent-rgb, 139, 92, 246), 0.26);
        border-radius: 999px;
        background: var(--nt-guide-accent-soft);
        color: var(--nt-guide-text);
        font-size: 0.85rem;
        font-weight: 700;
    }

    .nt-permanent-device-guide .nt-guide-family-item.is-current {
        border-color: rgba(34, 197, 94, 0.38);
        background: rgba(34, 197, 94, 0.1);
    }

    .nt-permanent-device-guide .nt-guide-notice {
        display: flex;
        gap: 14px;
        align-items: flex-start;
        padding: 18px;
        border: 1px solid rgba(245, 158, 11, 0.28);
        border-radius: 16px;
        background: rgba(245, 158, 11, 0.08);
        color: var(--nt-guide-muted);
        line-height: 1.65;
    }

    .nt-permanent-device-guide .nt-guide-notice-icon {
        flex: 0 0 auto;
        font-size: 1.2rem;
    }

    .nt-permanent-device-guide .nt-guide-notice strong {
        color: var(--nt-guide-text);
    }

    .nt-permanent-device-guide .nt-guide-progress {
        position: sticky;
        z-index: 15;
        top: 12px;
        display: flex;
        gap: 14px;
        align-items: center;
        margin: 0 0 24px;
        padding: 12px 15px;
        border: 1px solid var(--nt-guide-border);
        border-radius: 14px;
        background: var(--nt-guide-surface);
        box-shadow: 0 12px 30px rgba(0, 0, 0, 0.16);
        backdrop-filter: blur(14px);
        -webkit-backdrop-filter: blur(14px);
    }

    .nt-permanent-device-guide .nt-guide-progress-track {
        overflow: hidden;
        flex: 1;
        height: 7px;
        border-radius: 999px;
        background: rgba(148, 163, 184, 0.18);
    }

    .nt-permanent-device-guide .nt-guide-progress-bar {
        width: 10%;
        height: 100%;
        border-radius: inherit;
        background: linear-gradient(
            90deg,
            var(--nt-guide-accent),
            #8b5cf6
        );
        transition: width 220ms ease;
    }

    .nt-permanent-device-guide .nt-guide-progress-label {
        flex: 0 0 auto;
        color: var(--nt-guide-muted);
        font-size: 0.84rem;
        font-weight: 700;
        white-space: nowrap;
    }

    .nt-permanent-device-guide .nt-timeline {
        margin-top: 0;
    }

    .nt-permanent-device-guide .nt-guide-step {
        scroll-margin-top: 90px;
    }

    .nt-permanent-device-guide .nt-guide-step:last-child {
        border-left-color: transparent;
    }

    .nt-permanent-device-guide .nt-step-heading {
        display: flex;
        gap: 15px;
        align-items: center;
        margin-bottom: 20px;
    }

    .nt-permanent-device-guide .nt-step-number {
        display: grid;
        flex: 0 0 48px;
        width: 48px;
        height: 48px;
        place-items: center;
        border: 1px solid rgba(var(--bm-flow-accent-rgb, 139, 92, 246), 0.35);
        border-radius: 15px;
        background:
            linear-gradient(
                145deg,
                rgba(var(--bm-flow-accent-rgb, 139, 92, 246), 0.2),
                rgba(139, 92, 246, 0.1)
            );
        color: var(--nt-guide-text);
        font-size: 1.05rem;
        font-weight: 800;
        box-shadow: 0 8px 24px rgba(var(--bm-flow-accent-rgb, 139, 92, 246), 0.1);
    }

    .nt-permanent-device-guide .nt-step-kicker {
        display: block;
        margin-bottom: 3px;
        color: var(--nt-guide-accent);
        font-size: 0.76rem;
        font-weight: 800;
        letter-spacing: 0.07em;
        text-transform: uppercase;
    }

    .nt-permanent-device-guide .nt-step-heading h3 {
        margin: 0;
        color: var(--nt-guide-text);
        font-size: clamp(1.12rem, 2vw, 1.4rem);
        line-height: 1.3;
    }

    .nt-permanent-device-guide .nt-step-grid {
        display: grid;
        grid-template-columns:
            minmax(0, 1fr)
            minmax(260px, 350px);
        gap: clamp(22px, 4vw, 42px);
        align-items: start;
    }

    .nt-permanent-device-guide .nt-step-copy {
        min-width: 0;
        color: var(--nt-guide-muted);
        font-size: 0.98rem;
        line-height: 1.72;
    }

    .nt-permanent-device-guide .nt-step-copy p {
        margin: 0 0 15px;
    }

    .nt-permanent-device-guide .nt-step-copy p:last-child {
        margin-bottom: 0;
    }

    .nt-permanent-device-guide .nt-step-copy strong {
        color: var(--nt-guide-text);
    }

    .nt-permanent-device-guide .nt-clean-list {
        display: grid;
        gap: 9px;
        margin: 0 0 16px;
        padding: 0;
        list-style: none;
    }

    .nt-permanent-device-guide .nt-clean-list li {
        position: relative;
        padding-left: 24px;
    }

    .nt-permanent-device-guide .nt-clean-list li::before {
        position: absolute;
        top: 0.72em;
        left: 2px;
        width: 7px;
        height: 7px;
        border-radius: 50%;
        background: var(--nt-guide-accent);
        box-shadow:
            0 0 0 5px
            var(--nt-guide-accent-soft);
        content: "";
        transform: translateY(-50%);
    }

    .nt-permanent-device-guide .nt-inline-example {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
        align-items: center;
        margin: 0 0 16px;
        padding: 13px 15px;
        border: 1px solid var(--nt-guide-border);
        border-radius: 13px;
        background: var(--nt-guide-surface-soft);
    }

    .nt-permanent-device-guide .nt-inline-example span {
        padding: 5px 10px;
        border: 1px solid rgba(var(--bm-flow-accent-rgb, 139, 92, 246), 0.25);
        border-radius: 999px;
        background: var(--nt-guide-accent-soft);
        color: var(--nt-guide-text);
        font-size: 0.85rem;
        font-weight: 700;
    }

    .nt-permanent-device-guide .nt-warning-inline,
.nt-permanent-device-guide .nt-danger-inline,
.nt-permanent-device-guide .nt-success-inline {
        margin: 16px 0;
        padding: 14px 16px;
        border-radius: 13px;
        line-height: 1.6;
    }

    .nt-permanent-device-guide .nt-warning-inline {
        border: 1px solid rgba(245, 158, 11, 0.3);
        background: rgba(245, 158, 11, 0.08);
    }

    .nt-permanent-device-guide .nt-danger-inline {
        border: 1px solid rgba(239, 68, 68, 0.3);
        background: rgba(239, 68, 68, 0.08);
    }

    .nt-permanent-device-guide .nt-success-inline {
        border: 1px solid rgba(34, 197, 94, 0.3);
        background: rgba(34, 197, 94, 0.08);
    }

    .nt-permanent-device-guide .nt-path-box {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
        align-items: center;
        margin: 0 0 17px;
        padding: 13px 15px;
        border: 1px solid rgba(var(--bm-flow-accent-rgb, 139, 92, 246), 0.25);
        border-radius: 13px;
        background: var(--nt-guide-accent-soft);
        color: var(--nt-guide-text);
        font-size: 0.9rem;
        font-weight: 700;
    }

    .nt-permanent-device-guide .nt-path-box span {
        color: var(--nt-guide-accent);
        font-size: 1.1rem;
    }

    .nt-permanent-device-guide .nt-tutorial-shot {
        position: sticky;
        top: 82px;
        width: 100%;
        max-width: 350px;
        margin: 0 auto;
    }

    .nt-permanent-device-guide .nt-shot-trigger {
        position: relative;
        display: block;
        overflow: hidden;
        width: 100%;
        min-height: 320px;
        padding: 0;
        border: 1px solid var(--nt-guide-border);
        border-radius: 20px;
        background:
            linear-gradient(
                145deg,
                rgba(var(--bm-flow-accent-rgb, 139, 92, 246), 0.08),
                rgba(139, 92, 246, 0.06)
            ),
            var(--nt-guide-surface-soft);
        color: inherit;
        cursor: zoom-in;
        box-shadow: 0 16px 35px rgba(0, 0, 0, 0.16);
        transition:
            transform 180ms ease,
            border-color 180ms ease,
            box-shadow 180ms ease;
    }

    .nt-permanent-device-guide .nt-shot-trigger:hover {
        border-color: rgba(var(--bm-flow-accent-rgb, 139, 92, 246), 0.55);
        box-shadow: 0 20px 42px rgba(0, 0, 0, 0.22);
        transform: translateY(-3px);
    }

    .nt-permanent-device-guide .nt-shot-trigger:focus-visible {
        outline: 3px solid rgba(var(--bm-flow-accent-rgb, 139, 92, 246), 0.4);
        outline-offset: 3px;
    }

    .nt-permanent-device-guide .nt-shot-trigger img {
        display: block;
        width: 100%;
        height: auto;
        max-height: 610px;
        object-fit: contain;
        background: rgba(0, 0, 0, 0.12);
    }

    .nt-permanent-device-guide .nt-shot-placeholder {
        display: none;
        min-height: 320px;
        padding: 32px 24px;
        place-content: center;
        place-items: center;
        text-align: center;
    }

    .nt-permanent-device-guide .nt-shot-placeholder-icon {
        display: block;
        margin-bottom: 12px;
        font-size: 2rem;
    }

    .nt-permanent-device-guide .nt-shot-placeholder strong {
        display: block;
        margin-bottom: 8px;
        color: var(--nt-guide-text);
        font-size: 1rem;
    }

    .nt-permanent-device-guide .nt-shot-placeholder small {
        display: block;
        max-width: 260px;
        color: var(--nt-guide-muted);
        font-size: 0.82rem;
        line-height: 1.5;
    }

    .nt-permanent-device-guide .nt-tutorial-shot.is-missing .nt-shot-trigger {
        cursor: default;
    }

    .nt-permanent-device-guide .nt-tutorial-shot.is-missing .nt-shot-trigger img {
        display: none;
    }

    .nt-permanent-device-guide .nt-tutorial-shot.is-missing .nt-shot-placeholder {
        display: grid;
    }

    .nt-permanent-device-guide .nt-shot-hover {
        position: absolute;
        right: 12px;
        bottom: 12px;
        padding: 8px 11px;
        border: 1px solid rgba(255, 255, 255, 0.16);
        border-radius: 999px;
        background: rgba(2, 6, 23, 0.76);
        color: #ffffff;
        font-size: 0.76rem;
        font-weight: 700;
        opacity: 0;
        transform: translateY(5px);
        transition:
            opacity 180ms ease,
            transform 180ms ease;
        backdrop-filter: blur(8px);
        -webkit-backdrop-filter: blur(8px);
    }

    .nt-permanent-device-guide .nt-shot-trigger:hover .nt-shot-hover,
.nt-permanent-device-guide .nt-shot-trigger:focus-visible .nt-shot-hover {
        opacity: 1;
        transform: translateY(0);
    }

    .nt-permanent-device-guide .nt-tutorial-shot.is-missing .nt-shot-hover {
        display: none;
    }

    .nt-permanent-device-guide .nt-tutorial-shot figcaption {
        margin-top: 10px;
        color: var(--nt-guide-muted);
        font-size: 0.78rem;
        line-height: 1.45;
        text-align: center;
    }

    .nt-permanent-device-guide .nt-guide-result {
        margin-top: 30px;
        padding: clamp(22px, 4vw, 32px);
        border: 1px solid rgba(34, 197, 94, 0.28);
        border-radius: 20px;
        background:
            linear-gradient(
                135deg,
                rgba(34, 197, 94, 0.1),
                transparent 70%
            ),
            var(--nt-guide-surface-soft);
    }

    .nt-permanent-device-guide .nt-guide-result-header {
        display: flex;
        gap: 13px;
        align-items: center;
        margin-bottom: 12px;
    }

    .nt-permanent-device-guide .nt-guide-result-icon {
        display: grid;
        flex: 0 0 44px;
        width: 44px;
        height: 44px;
        place-items: center;
        border-radius: 14px;
        background: rgba(34, 197, 94, 0.14);
        font-size: 1.2rem;
    }

    .nt-permanent-device-guide .nt-guide-result h3 {
        margin: 0;
        color: var(--nt-guide-text);
        font-size: 1.25rem;
    }

    .nt-permanent-device-guide .nt-guide-result p {
        margin: 0 0 12px;
        color: var(--nt-guide-muted);
        line-height: 1.7;
    }

    .nt-permanent-device-guide .nt-guide-result p:last-child {
        margin-bottom: 0;
    }

    .nt-permanent-device-guide .nt-guide-result strong {
        color: var(--nt-guide-text);
    }

    /*
    |--------------------------------------------------------------------------
    | Modal para ampliar capturas
    |--------------------------------------------------------------------------
    */

    .nt-permanent-device-modal {
        position: fixed;
        z-index: 99999;
        inset: 0;
        display: none;
        place-items: center;
        padding: 24px;
        background: rgba(2, 6, 23, 0.88);
        opacity: 0;
        transition: opacity 180ms ease;
        backdrop-filter: blur(10px);
        -webkit-backdrop-filter: blur(10px);
    }

    .nt-permanent-device-modal.is-visible {
        display: grid;
        opacity: 1;
    }

    .nt-permanent-device-modal .nt-image-modal-dialog {
        position: relative;
        display: grid;
        max-width: min(1000px, 96vw);
        max-height: 94vh;
        gap: 12px;
        padding: 18px;
        border: 1px solid rgba(148, 163, 184, 0.24);
        border-radius: 22px;
        background: #0f172a;
        box-shadow: 0 30px 90px rgba(0, 0, 0, 0.52);
    }

    .nt-permanent-device-modal img {
        display: block;
        max-width: 100%;
        max-height: calc(94vh - 100px);
        margin: auto;
        border-radius: 14px;
        object-fit: contain;
    }

    .nt-permanent-device-modal .nt-image-modal-caption {
        margin: 0;
        color: #cbd5e1;
        font-size: 0.88rem;
        line-height: 1.5;
        text-align: center;
    }

    .nt-permanent-device-modal .nt-image-modal-close {
        position: absolute;
        z-index: 2;
        top: -13px;
        right: -13px;
        display: grid;
        width: 42px;
        height: 42px;
        place-items: center;
        border: 1px solid rgba(255, 255, 255, 0.18);
        border-radius: 50%;
        background: #111827;
        color: #ffffff;
        cursor: pointer;
        font-size: 1.1rem;
        box-shadow: 0 8px 24px rgba(0, 0, 0, 0.3);
    }

    .nt-permanent-device-modal .nt-image-modal-close:focus-visible {
        outline: 3px solid rgba(var(--bm-flow-accent-rgb, 139, 92, 246), 0.45);
        outline-offset: 3px;
    }

    /*
    |--------------------------------------------------------------------------
    | Responsive
    |--------------------------------------------------------------------------
    */

    @media (max-width: 960px) {
        .nt-permanent-device-guide .nt-device-structure {
            grid-template-columns: 1fr;
        }

        .nt-permanent-device-guide .nt-step-grid {
            grid-template-columns: 1fr;
        }

        .nt-permanent-device-guide .nt-tutorial-shot {
            position: relative;
            top: auto;
            width: min(100%, 390px);
            max-width: none;
        }
    }

    @media (max-width: 640px) {
        .nt-permanent-device-guide .nt-guide-definition,
.nt-permanent-device-guide .nt-device-card,
.nt-permanent-device-guide .nt-guide-family,
.nt-permanent-device-guide .nt-guide-notice {
            border-radius: 14px;
        }

        .nt-permanent-device-guide .nt-guide-progress {
            top: 8px;
            gap: 10px;
            padding: 10px 12px;
        }

        .nt-permanent-device-guide .nt-guide-progress-label {
            font-size: 0.75rem;
        }

        .nt-permanent-device-guide .nt-step-heading {
            gap: 11px;
            align-items: flex-start;
        }

        .nt-permanent-device-guide .nt-step-number {
            flex-basis: 42px;
            width: 42px;
            height: 42px;
            border-radius: 13px;
        }

        .nt-permanent-device-guide .nt-step-copy {
            font-size: 0.94rem;
        }

        .nt-permanent-device-guide .nt-shot-trigger,
.nt-permanent-device-guide .nt-shot-placeholder {
            min-height: 260px;
        }

        .nt-permanent-device-guide .nt-shot-hover {
            display: none;
        }

        .nt-permanent-device-modal {
            padding: 12px;
        }

        .nt-permanent-device-modal .nt-image-modal-dialog {
            width: 100%;
            padding: 12px;
            border-radius: 17px;
        }

        .nt-permanent-device-modal .nt-image-modal-close {
            top: 7px;
            right: 7px;
        }
    }

    @media (prefers-reduced-motion: reduce) {
        .nt-permanent-device-guide .nt-shot-trigger,
.nt-permanent-device-guide .nt-shot-hover,
.nt-permanent-device-guide .nt-guide-progress-bar,
.nt-permanent-device-modal {
            transition: none !important;
        }
    }

/* Estilos de Inputs para Dark Mode y consistencia */
    .bm-trusted-person-view .nt-modern-body select,
.bm-trusted-person-view .nt-modern-body input[type="text"],
.bm-trusted-person-view .nt-modern-body input[type="email"],
.bm-trusted-person-view .nt-modern-body input[type="date"] {
        background-color: var(--nt-bg-inner);
        border: 1px solid var(--nt-border);
        color: var(--nt-text-main);
        border-radius: 8px;
        padding: 12px;
        width: 100%;
        transition: border-color 0.2s, box-shadow 0.2s;
    }
    
    .bm-trusted-person-view .nt-modern-body select:focus,
.bm-trusted-person-view .nt-modern-body input:focus {
        border-color: var(--nt-primary);
        box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.2);
        outline: none;
    }

    /* Cards del Dashboard (Solución al texto que se salía) */
    .bm-trusted-person-view .tp-menu-card {
         background-color: var(--nt-bg-inner) !important;
         border: 1px solid var(--nt-border) !important;
         border-radius: 12px;
         padding: 25px;
         height: 100%;
         display: flex;
         flex-direction: column;
         justify-content: space-between;
         transition: transform 0.2s, border-color 0.2s;
    }
    .bm-trusted-person-view .tp-menu-card:hover {
        transform: translateY(-3px);
        border-color: var(--nt-primary) !important;
        box-shadow: 0 10px 30px rgba(0,0,0,0.3);
    }
    .bm-trusted-person-view .tp-menu-card h3 {
        color: var(--nt-primary);
        font-size: 1.25rem;
        margin-bottom: 15px;
        font-weight: 700;
        border-bottom: 1px solid var(--nt-border);
        padding-bottom: 10px;
    }
    .bm-trusted-person-view .tp-menu-card p {
        flex-grow: 1; /* Empuja el botón hacia abajo */
        margin-bottom: 20px;
        font-size: 0.95rem;
        line-height: 1.6;
        color: var(--nt-text-muted);
    }

    /* Botones primarios mejorados */
    .bm-trusted-person-view .btn-primary {
        background: linear-gradient(135deg, #0ea5e9 0%, #2563eb 100%);
        border: none !important;
        border-radius: 50px;
        font-weight: 700;
        padding: 12px 24px;
        color: white !important;
        box-shadow: 0 4px 15px rgba(14, 165, 233, 0.4);
        width: 100%;
        transition: all 0.2s ease;
        text-transform: uppercase;
        font-size: 0.9rem;
        letter-spacing: 0.5px;
    }
    .bm-trusted-person-view .btn-primary:hover:not(:disabled) {
        background: linear-gradient(135deg, #38bdf8 0%, #3b82f6 100%);
        transform: translateY(-2px);
        box-shadow: 0 6px 20px rgba(14, 165, 233, 0.6);
    }
    .bm-trusted-person-view .btn-primary:disabled {
        background: var(--nt-border);
        color: var(--nt-text-muted) !important;
        cursor: not-allowed;
        box-shadow: none;
    }

    /* BOTÓN ROJO SÓLIDO (Para eliminar/retirar) */
    .bm-trusted-person-view .btn-danger-custom {
        background: linear-gradient(135deg, #ef4444 0%, #dc2626 100%);
        border: none !important;
        border-radius: 50px;
        font-weight: 700;
        padding: 12px 24px;
        color: white !important;
        box-shadow: 0 4px 15px rgba(239, 68, 68, 0.4);
        width: 100%;
        transition: all 0.2s ease;
        text-transform: uppercase;
        font-size: 0.9rem;
        letter-spacing: 0.5px;
    }
    .bm-trusted-person-view .btn-danger-custom:hover:not(:disabled) {
        background: linear-gradient(135deg, #f87171 0%, #ef4444 100%);
        transform: translateY(-2px);
        box-shadow: 0 6px 20px rgba(239, 68, 68, 0.6);
    }
    .bm-trusted-person-view .btn-danger-custom:disabled {
        background: var(--nt-border);
        color: var(--nt-text-muted) !important;
        cursor: not-allowed;
        box-shadow: none;
    }


    /* Botones de Selección (Radio cards) para Instructor */
    .bm-trusted-person-view .btn-selection-card {
        background: var(--nt-bg-inner);
        border: 2px solid var(--nt-border);
        color: var(--nt-text-main);
        border-radius: 12px;
        padding: 15px;
        text-align: left;
        width: 100%;
        transition: all 0.2s;
        display: flex;
        align-items: center;
        gap: 15px;
        margin-bottom: 10px;
        /* Fix text overflow inside selection buttons */
        white-space: normal; 
        height: auto;
    }
    .bm-trusted-person-view .btn-selection-card:hover {
        background: rgba(59, 130, 246, 0.05);
        border-color: var(--nt-primary);
    }
    .bm-trusted-person-view .btn-selection-card.active {
        background: rgba(59, 130, 246, 0.15);
        border-color: var(--nt-primary);
        color: #fff;
    }
    .bm-trusted-person-view .btn-selection-card strong {
        display: block;
        margin-bottom: 4px;
        color: var(--nt-primary);
    }

    /* Alertas Vibrantes */
    .bm-trusted-person-view .alert {
        position: relative;
        padding: 1rem 1.25rem;
        margin-bottom: 1.5rem;
        border: none;
        border-left: 5px solid transparent;
        border-radius: 0 8px 8px 0;
        background: var(--nt-bg-inner); /* Fallback */
    }
    .bm-trusted-person-view .alert-warning {
        background: rgba(245, 158, 11, 0.15) !important;
        border-left-color: #f59e0b !important;
        color: #fbbf24 !important;
    }
    .bm-trusted-person-view .alert-danger {
        background: rgba(239, 68, 68, 0.15) !important;
        border-left-color: #ef4444 !important;
        color: #fca5a5 !important;
    }
    .bm-trusted-person-view .alert-success {
        background: rgba(16, 185, 129, 0.15) !important;
        border-left-color: #10b981 !important;
        color: #6ee7b7 !important;
    }
    .bm-trusted-person-view .alert-secondary {
        background: rgba(71, 85, 105, 0.3) !important;
        border-left-color: #94a3b8 !important;
        color: #cbd5e1 !important;
    }

    /* Utilidades */
    .bm-trusted-person-view .tp-hidden { display: none !important; }
    .bm-trusted-person-view .text-muted { color: var(--nt-text-muted) !important; }
    .bm-trusted-person-view .text-white { color: #fff !important; }
    
    .bm-trusted-person-view .tp-note-box {
        background: rgba(59, 130, 246, 0.1);
        border-left: 4px solid var(--nt-primary);
        padding: 20px;
        border-radius: 0 12px 12px 0;
        margin-bottom: 25px;
        color: var(--nt-text-main);
        font-size: 0.95rem;
        line-height: 1.6;
    }

    /* Animaciones suaves */
    .bm-trusted-person-view .nt-fade-in { animation: fadeIn 0.4s ease-out; }
    @keyframes fadeIn { .bm-trusted-person-view from { opacity: 0; transform: translateY(10px); } .bm-trusted-person-view to { opacity: 1; transform: translateY(0); } }
    /* ==========================================================
       PERSONA DE CONFIANZA · REDISEÑO POSTERIOR AL IDIOMA
       Se activa únicamente después de seleccionar Español/English.
       No altera la pantalla inicial de selección de idioma.
       ========================================================== */
    .bm-trusted-person-view #tp_spanish,
.bm-trusted-person-view #tp_english,
.bm-trusted-person-view #tp_topAlertES,
.bm-trusted-person-view #tp_topAlertEN {
        --tp-bg-deep: #0f172a;
        --tp-surface: rgba(30, 41, 59, .94);
        --tp-surface-raised: rgba(36, 48, 71, .96);
        --tp-surface-hover: rgba(51, 65, 85, .78);
        --tp-text: #f8fafc;
        --tp-muted: #a5b4cf;
        --tp-light: #7f8da9;
        --tp-brand: #5267ff;
        --tp-brand-hover: #6f82ff;
        --tp-brand-dark: #3147dd;
        --tp-brand-soft: rgba(82, 103, 255, .14);
        --tp-border: rgba(148, 163, 184, .16);
        --tp-border-strong: rgba(148, 163, 184, .28);
        --tp-success-soft: rgba(57, 182, 111, .15);
        --tp-success: #55d989;
        --tp-warning-soft: rgba(245, 158, 11, .14);
        --tp-warning: #fbbf24;
        --tp-danger-soft: rgba(255, 95, 87, .14);
        --tp-danger: #ff7a70;
        --tp-info-soft: rgba(56, 189, 248, .12);
        --tp-info: #67d7ff;
        --tp-shadow: 0 20px 54px rgba(0, 0, 0, .28), 0 1px 0 rgba(255,255,255,.04) inset;
        --tp-shadow-hover: 0 28px 72px rgba(0, 0, 0, .38), 0 0 0 1px rgba(82,103,255,.12);
        color: var(--tp-text);
        font-family: "Plus Jakarta Sans", Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    }

    .bm-trusted-person-view #tp_spanish,
.bm-trusted-person-view #tp_english {
        width: 100%;
        animation-duration: .32s !important;
    }

    /* Menú principal posterior al idioma */
    .bm-trusted-person-view #tp_es_menu,
.bm-trusted-person-view #tp_en_menu {
        position: relative;
        padding-top: 2px;
    }

    .bm-trusted-person-view #tp_es_menu > .d-flex:first-child,
.bm-trusted-person-view #tp_en_menu > .d-flex:first-child,
.bm-trusted-person-view #tp_es_trusted > .d-flex:first-child,
.bm-trusted-person-view #tp_es_block > .d-flex:first-child,
.bm-trusted-person-view #tp_es_instructor > .d-flex:first-child,
.bm-trusted-person-view #tp_en_trusted > .d-flex:first-child,
.bm-trusted-person-view #tp_en_block > .d-flex:first-child,
.bm-trusted-person-view #tp_en_instructor > .d-flex:first-child {
        margin-bottom: 22px !important;
    }

    .bm-trusted-person-view #tp_spanish .nt-btn-back,
.bm-trusted-person-view #tp_english .nt-btn-back {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 9px;
        min-height: 42px;
        padding: 9px 15px;
        border: 1px solid var(--tp-border);
        border-radius: 999px;
        background: linear-gradient(180deg, rgba(36,48,71,.96), rgba(24,34,54,.96));
        color: var(--tp-muted);
        font-size: .86rem;
        font-weight: 750;
        line-height: 1;
        box-shadow: 0 10px 24px rgba(0,0,0,.18), 0 1px 0 rgba(255,255,255,.05) inset;
        transition: transform .18s ease, color .18s ease, border-color .18s ease, background .18s ease, box-shadow .18s ease;
    }

    .bm-trusted-person-view #tp_spanish .nt-btn-back span,
.bm-trusted-person-view #tp_english .nt-btn-back span {
        font-size: 1.08rem;
        line-height: 1;
        transition: transform .18s ease;
    }

    .bm-trusted-person-view #tp_spanish .nt-btn-back:hover,
.bm-trusted-person-view #tp_english .nt-btn-back:hover {
        color: var(--tp-text);
        border-color: rgba(82,103,255,.38);
        background: linear-gradient(180deg, rgba(45,59,86,.98), rgba(29,41,64,.98));
        box-shadow: 0 14px 30px rgba(0,0,0,.24), 0 0 0 3px rgba(82,103,255,.07);
        transform: translateY(-1px);
    }

    .bm-trusted-person-view #tp_spanish .nt-btn-back:hover span,
.bm-trusted-person-view #tp_english .nt-btn-back:hover span {
        transform: translateX(-2px);
    }

    .bm-trusted-person-view #tp_spanish .row.g-4,
.bm-trusted-person-view #tp_english .row.g-4 {
        --bs-gutter-x: 20px;
        --bs-gutter-y: 20px;
    }

    .bm-trusted-person-view #tp_spanish .tp-menu-card,
.bm-trusted-person-view #tp_english .tp-menu-card {
        position: relative;
        min-height: 100%;
        padding: 26px;
        border: 1px solid var(--tp-border) !important;
        border-radius: 24px;
        background:
            linear-gradient(135deg, rgba(255,255,255,.045), transparent 36%),
            linear-gradient(180deg, rgba(34,45,66,.97), rgba(26,37,58,.98)) !important;
        box-shadow: var(--tp-shadow);
        isolation: isolate;
        overflow: hidden;
        transition: transform .22s ease, border-color .22s ease, box-shadow .22s ease, background .22s ease;
    }

    .bm-trusted-person-view #tp_spanish .tp-menu-card::before,
.bm-trusted-person-view #tp_english .tp-menu-card::before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 4px;
        background: linear-gradient(90deg, var(--tp-brand), #7c8cff 58%, #38bdf8);
        opacity: .9;
        box-shadow: 0 0 22px rgba(82,103,255,.42);
    }

    .bm-trusted-person-view #tp_spanish .tp-menu-card::after,
.bm-trusted-person-view #tp_english .tp-menu-card::after {
        content: "";
        position: absolute;
        width: 145px;
        height: 145px;
        right: -62px;
        top: -65px;
        border-radius: 50%;
        background: radial-gradient(circle, rgba(82,103,255,.18), transparent 68%);
        pointer-events: none;
        z-index: -1;
        transition: transform .25s ease, opacity .25s ease;
    }

    .bm-trusted-person-view #tp_spanish .tp-menu-card:hover,
.bm-trusted-person-view #tp_english .tp-menu-card:hover {
        transform: translateY(-5px);
        border-color: rgba(82,103,255,.34) !important;
        box-shadow: var(--tp-shadow-hover);
    }

    .bm-trusted-person-view #tp_spanish .tp-menu-card:hover::after,
.bm-trusted-person-view #tp_english .tp-menu-card:hover::after {
        transform: scale(1.14);
        opacity: 1;
    }

    .bm-trusted-person-view #tp_spanish .tp-menu-card h3,
.bm-trusted-person-view #tp_english .tp-menu-card h3 {
        position: relative;
        margin: 0 0 17px;
        padding: 0 0 16px;
        border-bottom: 1px solid var(--tp-border);
        color: var(--tp-text);
        font-size: clamp(1.12rem, 1.8vw, 1.28rem);
        font-weight: 850;
        line-height: 1.25;
        letter-spacing: -.025em;
    }

    .bm-trusted-person-view #tp_spanish .tp-menu-card h3::after,
.bm-trusted-person-view #tp_english .tp-menu-card h3::after {
        content: "";
        position: absolute;
        left: 0;
        bottom: -1px;
        width: 68px;
        height: 2px;
        border-radius: 999px;
        background: linear-gradient(90deg, var(--tp-brand), transparent);
    }

    .bm-trusted-person-view #tp_spanish .tp-menu-card p,
.bm-trusted-person-view #tp_english .tp-menu-card p {
        margin: 0 0 24px;
        color: var(--tp-muted);
        font-size: .91rem;
        line-height: 1.72;
    }

    /* Vistas internas */
    .bm-trusted-person-view #tp_es_trusted,
.bm-trusted-person-view #tp_es_block,
.bm-trusted-person-view #tp_es_instructor,
.bm-trusted-person-view #tp_en_trusted,
.bm-trusted-person-view #tp_en_block,
.bm-trusted-person-view #tp_en_instructor {
        position: relative;
        padding: clamp(20px, 3vw, 34px);
        border: 1px solid var(--tp-border);
        border-radius: 24px;
        background:
            linear-gradient(135deg, rgba(255,255,255,.035), transparent 34%),
            linear-gradient(180deg, rgba(31,43,64,.96), rgba(22,32,52,.98));
        box-shadow: var(--tp-shadow);
        overflow: hidden;
    }

    .bm-trusted-person-view #tp_es_trusted::before,
.bm-trusted-person-view #tp_es_block::before,
.bm-trusted-person-view #tp_es_instructor::before,
.bm-trusted-person-view #tp_en_trusted::before,
.bm-trusted-person-view #tp_en_block::before,
.bm-trusted-person-view #tp_en_instructor::before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        height: 4px;
        background: linear-gradient(90deg, var(--tp-brand), #7c8cff 52%, #38bdf8);
        opacity: .9;
    }

    .bm-trusted-person-view #tp_spanish h3.fw-bold,
.bm-trusted-person-view #tp_spanish h4.fw-bold,
.bm-trusted-person-view #tp_english h3.fw-bold,
.bm-trusted-person-view #tp_english h4.fw-bold {
        margin-bottom: 20px !important;
        color: var(--tp-text) !important;
        font-size: clamp(1.42rem, 2.4vw, 2rem);
        font-weight: 900 !important;
        line-height: 1.12;
        letter-spacing: -.045em;
    }

    .bm-trusted-person-view #tp_spanish .tp-note-box,
.bm-trusted-person-view #tp_english .tp-note-box,
.bm-trusted-person-view #tp_topAlertES .tp-note-box,
.bm-trusted-person-view #tp_topAlertEN .tp-note-box {
        position: relative;
        margin-bottom: 22px;
        padding: 20px 21px 20px 24px;
        border: 1px solid rgba(56,189,248,.20);
        border-left: 4px solid var(--tp-info);
        border-radius: 16px;
        background:
            linear-gradient(90deg, rgba(56,189,248,.12), rgba(56,189,248,.045)),
            rgba(15,23,42,.28);
        color: var(--tp-muted);
        font-size: .93rem;
        line-height: 1.72;
        box-shadow: 0 12px 30px rgba(0,0,0,.15);
    }

    .bm-trusted-person-view #tp_spanish .tp-note-box strong,
.bm-trusted-person-view #tp_english .tp-note-box strong,
.bm-trusted-person-view #tp_topAlertES .tp-note-box strong,
.bm-trusted-person-view #tp_topAlertEN .tp-note-box strong {
        color: var(--tp-text);
    }

    .bm-trusted-person-view #tp_spanish .tp-note-box a,
.bm-trusted-person-view #tp_english .tp-note-box a,
.bm-trusted-person-view #tp_topAlertES .tp-note-box a,
.bm-trusted-person-view #tp_topAlertEN .tp-note-box a {
        color: #93a4ff;
        overflow-wrap: anywhere;
    }

    .bm-trusted-person-view #tp_spanish .nt-timeline,
.bm-trusted-person-view #tp_english .nt-timeline {
        display: grid;
        gap: 18px;
        margin: 0;
        padding: 0;
    }

    .bm-trusted-person-view #tp_spanish .nt-step,
.bm-trusted-person-view #tp_english .nt-step {
        position: relative;
        margin: 0 !important;
        padding: 0;
        border: 1px solid var(--tp-border) !important;
        border-left: 1px solid var(--tp-border) !important;
        border-radius: 18px;
        background: linear-gradient(180deg, rgba(36,48,71,.84), rgba(25,36,56,.88));
        box-shadow: 0 14px 34px rgba(0,0,0,.18), 0 1px 0 rgba(255,255,255,.035) inset;
        overflow: hidden;
    }

    .bm-trusted-person-view #tp_spanish .nt-step::before,
.bm-trusted-person-view #tp_english .nt-step::before {
        content: "";
        position: absolute;
        left: 0;
        top: 0;
        bottom: 0;
        width: 4px;
        background: linear-gradient(180deg, var(--tp-brand), #38bdf8);
        opacity: .82;
    }

    .bm-trusted-person-view #tp_spanish .nt-step-content,
.bm-trusted-person-view #tp_english .nt-step-content {
        padding: clamp(18px, 2.5vw, 26px);
    }

    .bm-trusted-person-view #tp_spanish .nt-step-content > p.text-white,
.bm-trusted-person-view #tp_spanish .nt-step-content > h5.text-white,
.bm-trusted-person-view #tp_english .nt-step-content > p.text-white,
.bm-trusted-person-view #tp_english .nt-step-content > h5.text-white {
        margin-bottom: 16px !important;
        color: var(--tp-text) !important;
        font-size: 1.04rem !important;
        font-weight: 800;
        letter-spacing: -.018em;
    }

    /* Encabezados de paso orientados a usuarios no técnicos */
    .bm-trusted-person-view #tp_spanish .tp-step-header,
.bm-trusted-person-view #tp_english .tp-step-header {
        display: flex;
        align-items: flex-start;
        gap: 14px;
        margin-bottom: 20px;
    }

    .bm-trusted-person-view #tp_spanish .tp-step-number,
.bm-trusted-person-view #tp_english .tp-step-number {
        display: inline-flex;
        flex: 0 0 auto;
        align-items: center;
        justify-content: center;
        min-width: 68px;
        height: 32px;
        padding: 0 12px;
        border: 1px solid rgba(124,140,255,.34);
        border-radius: 999px;
        background: linear-gradient(135deg, rgba(82,103,255,.23), rgba(56,189,248,.12));
        color: #cbd5ff;
        font-size: .72rem;
        font-weight: 850;
        line-height: 1;
        letter-spacing: .055em;
        text-transform: uppercase;
        box-shadow: 0 8px 18px rgba(0,0,0,.14);
    }

    .bm-trusted-person-view #tp_spanish .tp-step-copy,
.bm-trusted-person-view #tp_english .tp-step-copy {
        min-width: 0;
        flex: 1 1 auto;
    }

    .bm-trusted-person-view #tp_spanish .tp-step-title,
.bm-trusted-person-view #tp_english .tp-step-title {
        margin: 0 0 7px !important;
        color: var(--tp-text) !important;
        font-size: 1.06rem !important;
        font-weight: 850;
        line-height: 1.28;
        letter-spacing: -.02em;
    }

    .bm-trusted-person-view #tp_spanish .tp-step-description,
.bm-trusted-person-view #tp_english .tp-step-description {
        max-width: 720px;
        margin: 0;
        color: var(--tp-muted);
        font-size: .9rem;
        line-height: 1.6;
    }

    .bm-trusted-person-view #tp_spanish .tp-field-label,
.bm-trusted-person-view #tp_english .tp-field-label {
        margin-bottom: 9px;
        color: #d8e0ee !important;
        font-size: .84rem;
        font-weight: 760;
    }

    .bm-trusted-person-view #tp_spanish .btn-selection-card .tp-option-description,
.bm-trusted-person-view #tp_english .btn-selection-card .tp-option-description {
        display: block;
        margin-top: 5px;
        color: var(--tp-muted);
        font-size: .8rem;
        font-weight: 500;
        line-height: 1.48;
    }

    @media (max-width: 575.98px) {
        .bm-trusted-person-view #tp_spanish .tp-step-header,
.bm-trusted-person-view #tp_english .tp-step-header {
            flex-direction: column;
            gap: 10px;
        }

        .bm-trusted-person-view #tp_spanish .tp-step-number,
.bm-trusted-person-view #tp_english .tp-step-number {
            min-width: auto;
        }
    }

    /* Formularios */
    .bm-trusted-person-view #tp_spanish .form-label,
.bm-trusted-person-view #tp_english .form-label {
        margin-bottom: 8px;
        color: var(--tp-muted) !important;
        font-size: .85rem;
        font-weight: 700;
    }

    .bm-trusted-person-view #tp_spanish select,
.bm-trusted-person-view #tp_spanish input[type="text"],
.bm-trusted-person-view #tp_spanish input[type="email"],
.bm-trusted-person-view #tp_spanish input[type="date"],
.bm-trusted-person-view #tp_english select,
.bm-trusted-person-view #tp_english input[type="text"],
.bm-trusted-person-view #tp_english input[type="email"],
.bm-trusted-person-view #tp_english input[type="date"] {
        min-height: 50px;
        padding: 12px 15px;
        border: 1px solid var(--tp-border-strong) !important;
        border-radius: 14px !important;
        background: rgba(15,23,42,.68) !important;
        color: var(--tp-text) !important;
        font-size: .92rem;
        box-shadow: 0 1px 0 rgba(255,255,255,.025) inset;
        transition: border-color .18s ease, box-shadow .18s ease, background .18s ease;
    }

    .bm-trusted-person-view #tp_spanish select:hover,
.bm-trusted-person-view #tp_spanish input:hover,
.bm-trusted-person-view #tp_english select:hover,
.bm-trusted-person-view #tp_english input:hover {
        border-color: rgba(148,163,184,.40) !important;
        background: rgba(15,23,42,.84) !important;
    }

    .bm-trusted-person-view #tp_spanish select:focus,
.bm-trusted-person-view #tp_spanish input:focus,
.bm-trusted-person-view #tp_english select:focus,
.bm-trusted-person-view #tp_english input:focus {
        outline: none;
        border-color: rgba(82,103,255,.78) !important;
        background: rgba(15,23,42,.92) !important;
        box-shadow: 0 0 0 4px rgba(82,103,255,.13) !important;
    }

    .bm-trusted-person-view #tp_spanish select:disabled,
.bm-trusted-person-view #tp_spanish input:disabled,
.bm-trusted-person-view #tp_english select:disabled,
.bm-trusted-person-view #tp_english input:disabled {
        opacity: .58;
        cursor: not-allowed;
    }

    .bm-trusted-person-view #tp_spanish select option,
.bm-trusted-person-view #tp_english select option {
        background: #172238;
        color: var(--tp-text);
    }

    .bm-trusted-person-view #tp_spanish small.text-muted,
.bm-trusted-person-view #tp_english small.text-muted,
.bm-trusted-person-view #tp_spanish .text-muted,
.bm-trusted-person-view #tp_english .text-muted {
        color: var(--tp-muted) !important;
    }

    .bm-trusted-person-view #tp_spanish .text-warning,
.bm-trusted-person-view #tp_english .text-warning {
        color: var(--tp-warning) !important;
    }

    .bm-trusted-person-view #tp_spanish .btn-primary,
.bm-trusted-person-view #tp_english .btn-primary,
.bm-trusted-person-view #tp_spanish .btn-danger-custom,
.bm-trusted-person-view #tp_english .btn-danger-custom {
        min-height: 48px;
        padding: 12px 18px;
        border: 0 !important;
        border-radius: 14px;
        color: #fff !important;
        font-size: .88rem;
        font-weight: 800;
        line-height: 1.2;
        letter-spacing: 0;
        text-transform: none;
        box-shadow: 0 12px 28px rgba(0,0,0,.20);
        transition: transform .18s ease, box-shadow .18s ease, filter .18s ease, opacity .18s ease;
    }

    .bm-trusted-person-view #tp_spanish .btn-primary,
.bm-trusted-person-view #tp_english .btn-primary {
        background: linear-gradient(135deg, var(--tp-brand), var(--tp-brand-dark));
    }

    .bm-trusted-person-view #tp_spanish .btn-primary:hover:not(:disabled),
.bm-trusted-person-view #tp_english .btn-primary:hover:not(:disabled) {
        background: linear-gradient(135deg, var(--tp-brand-hover), var(--tp-brand));
        transform: translateY(-2px);
        box-shadow: 0 16px 34px rgba(49,71,221,.32);
    }

    .bm-trusted-person-view #tp_spanish .btn-danger-custom,
.bm-trusted-person-view #tp_english .btn-danger-custom {
        background: linear-gradient(135deg, #ef4444, #c92f2f);
    }

    .bm-trusted-person-view #tp_spanish .btn-danger-custom:hover:not(:disabled),
.bm-trusted-person-view #tp_english .btn-danger-custom:hover:not(:disabled) {
        background: linear-gradient(135deg, #fb625d, #e13b37);
        transform: translateY(-2px);
        box-shadow: 0 16px 34px rgba(239,68,68,.28);
    }

    .bm-trusted-person-view #tp_spanish .btn-primary:disabled,
.bm-trusted-person-view #tp_english .btn-primary:disabled,
.bm-trusted-person-view #tp_spanish .btn-danger-custom:disabled,
.bm-trusted-person-view #tp_english .btn-danger-custom:disabled {
        background: rgba(71,85,105,.58) !important;
        color: rgba(203,213,225,.56) !important;
        box-shadow: none;
        opacity: .76;
    }

    .bm-trusted-person-view #tp_spanish .d-flex.flex-column.flex-md-row.gap-3 > .btn,
.bm-trusted-person-view #tp_english .d-flex.flex-column.flex-md-row.gap-3 > .btn {
        flex: 1 1 0;
    }

    /* Opciones de instructor */
    .bm-trusted-person-view #tp_spanish .btn-selection-card,
.bm-trusted-person-view #tp_english .btn-selection-card {
        position: relative;
        min-height: 66px;
        margin-bottom: 12px;
        padding: 17px 18px 17px 52px;
        border: 1px solid var(--tp-border-strong);
        border-radius: 16px;
        background: rgba(15,23,42,.42);
        color: var(--tp-text);
        box-shadow: 0 10px 24px rgba(0,0,0,.14);
        transition: transform .18s ease, border-color .18s ease, background .18s ease, box-shadow .18s ease;
    }

    .bm-trusted-person-view #tp_spanish .btn-selection-card::before,
.bm-trusted-person-view #tp_english .btn-selection-card::before {
        content: "";
        position: absolute;
        left: 19px;
        top: 50%;
        width: 18px;
        height: 18px;
        border: 2px solid rgba(148,163,184,.55);
        border-radius: 50%;
        transform: translateY(-50%);
        box-shadow: 0 0 0 4px rgba(148,163,184,.06);
        transition: border-color .18s ease, background .18s ease, box-shadow .18s ease;
    }

    .bm-trusted-person-view #tp_spanish .btn-selection-card:hover,
.bm-trusted-person-view #tp_english .btn-selection-card:hover {
        transform: translateY(-2px);
        border-color: rgba(82,103,255,.48);
        background: rgba(82,103,255,.08);
        box-shadow: 0 16px 34px rgba(0,0,0,.20);
    }

    .bm-trusted-person-view #tp_spanish .btn-selection-card.active,
.bm-trusted-person-view #tp_english .btn-selection-card.active {
        border-color: rgba(82,103,255,.74);
        background: linear-gradient(90deg, rgba(82,103,255,.18), rgba(82,103,255,.07));
        box-shadow: 0 0 0 4px rgba(82,103,255,.08), 0 16px 34px rgba(0,0,0,.20);
    }

    .bm-trusted-person-view #tp_spanish .btn-selection-card.active::before,
.bm-trusted-person-view #tp_english .btn-selection-card.active::before {
        border: 5px solid var(--tp-brand);
        background: #fff;
        box-shadow: 0 0 0 4px rgba(82,103,255,.15), 0 0 18px rgba(82,103,255,.35);
    }

    .bm-trusted-person-view #tp_spanish .btn-selection-card strong,
.bm-trusted-person-view #tp_english .btn-selection-card strong {
        margin: 0;
        color: var(--tp-text);
        font-weight: 800;
        line-height: 1.35;
    }

    .bm-trusted-person-view #tp_opt1ESContent,
.bm-trusted-person-view #tp_opt2ESContent,
.bm-trusted-person-view #tp_opt1ENContent,
.bm-trusted-person-view #tp_opt2ENContent {
        padding: 20px !important;
        border: 1px solid var(--tp-border) !important;
        border-radius: 16px !important;
        background: rgba(15,23,42,.38) !important;
        box-shadow: 0 12px 28px rgba(0,0,0,.14);
    }

    /* Checkbox cards generados dinámicamente */
    .bm-trusted-person-view #tp_spanish .form-check,
.bm-trusted-person-view #tp_english .form-check {
        display: flex;
        align-items: flex-start;
        gap: 11px;
        margin-bottom: 11px;
        padding: 14px 15px;
        border: 1px solid var(--tp-border);
        border-radius: 14px;
        background: rgba(15,23,42,.36);
        transition: border-color .18s ease, background .18s ease;
    }

    .bm-trusted-person-view #tp_spanish .form-check:hover,
.bm-trusted-person-view #tp_english .form-check:hover {
        border-color: rgba(82,103,255,.36);
        background: rgba(82,103,255,.065);
    }

    .bm-trusted-person-view #tp_spanish .form-check-input,
.bm-trusted-person-view #tp_english .form-check-input {
        width: 18px;
        height: 18px;
        min-height: 18px;
        margin: 2px 0 0;
        padding: 0;
        border-radius: 5px !important;
        background-color: rgba(15,23,42,.76) !important;
        border: 1px solid rgba(148,163,184,.46) !important;
        flex: 0 0 auto;
    }

    .bm-trusted-person-view #tp_spanish .form-check-input:checked,
.bm-trusted-person-view #tp_english .form-check-input:checked {
        background-color: var(--tp-brand) !important;
        border-color: var(--tp-brand) !important;
    }

    .bm-trusted-person-view #tp_spanish .form-check-label,
.bm-trusted-person-view #tp_english .form-check-label {
        color: var(--tp-text) !important;
        font-size: .91rem;
        line-height: 1.45;
    }

    /* Alertas */
    .bm-trusted-person-view #tp_root_.tp-dashboard-active .alert {
        padding: 16px 18px;
        border: 1px solid var(--tp-border) !important;
        border-left-width: 4px !important;
        border-radius: 14px !important;
        color: var(--tp-muted) !important;
        line-height: 1.55;
        box-shadow: 0 12px 28px rgba(0,0,0,.14) !important;
    }

    .bm-trusted-person-view #tp_root_.tp-dashboard-active .alert strong,
.bm-trusted-person-view #tp_root_.tp-dashboard-active .alert .alert-heading {
        color: inherit;
    }

    .bm-trusted-person-view #tp_root_.tp-dashboard-active .alert-secondary {
        border-color: var(--tp-border) !important;
        border-left-color: #94a3b8 !important;
        background: rgba(15,23,42,.42) !important;
        color: #cbd5e1 !important;
    }

    .bm-trusted-person-view #tp_root_.tp-dashboard-active .alert-success {
        border-color: rgba(57,182,111,.22) !important;
        border-left-color: var(--tp-success) !important;
        background: var(--tp-success-soft) !important;
        color: #88e9ad !important;
    }

    .bm-trusted-person-view #tp_root_.tp-dashboard-active .alert-warning {
        border-color: rgba(245,158,11,.22) !important;
        border-left-color: var(--tp-warning) !important;
        background: var(--tp-warning-soft) !important;
        color: #ffd36a !important;
    }

    .bm-trusted-person-view #tp_root_.tp-dashboard-active .alert-danger {
        border-color: rgba(255,95,87,.22) !important;
        border-left-color: var(--tp-danger) !important;
        background: var(--tp-danger-soft) !important;
        color: #ff9a93 !important;
    }

    .bm-trusted-person-view #tp_root_.tp-dashboard-active #tp_topAlertES,
.bm-trusted-person-view #tp_root_.tp-dashboard-active #tp_topAlertEN {
        margin: 0 0 22px !important;
    }

    .bm-trusted-person-view #tp_root_.tp-dashboard-active #tp_topAlertES > .alert,
.bm-trusted-person-view #tp_root_.tp-dashboard-active #tp_topAlertEN > .alert {
        margin-bottom: 0;
    }

    /* Video */
    .bm-trusted-person-view #tp_spanish .nt-video-container,
.bm-trusted-person-view #tp_english .nt-video-container {
        position: relative;
        width: 100%;
        overflow: hidden;
        border: 1px solid var(--tp-border);
        border-radius: 18px;
        background: #090e19;
        box-shadow: 0 18px 44px rgba(0,0,0,.28);
    }

    .bm-trusted-person-view #tp_spanish .nt-video-container iframe,
.bm-trusted-person-view #tp_english .nt-video-container iframe {
        display: block;
        width: 100%;
        aspect-ratio: 16 / 9;
        height: auto;
        border: 0;
    }

    .bm-trusted-person-view #tp_spanish .border-top,
.bm-trusted-person-view #tp_english .border-top {
        border-color: var(--tp-border) !important;
    }

    .bm-trusted-person-view #tp_spanish a,
.bm-trusted-person-view #tp_english a {
        transition: color .18s ease, opacity .18s ease;
    }

    .bm-trusted-person-view #tp_spanish a:hover,
.bm-trusted-person-view #tp_english a:hover {
        color: #b4beff;
    }

    @media (max-width: 991.98px) {
        .bm-trusted-person-view #tp_spanish .tp-menu-card,
.bm-trusted-person-view #tp_english .tp-menu-card {
            padding: 23px;
        }
    }

    @media (max-width: 767.98px) {
        .bm-trusted-person-view #tp_es_trusted,
.bm-trusted-person-view #tp_es_block,
.bm-trusted-person-view #tp_es_instructor,
.bm-trusted-person-view #tp_en_trusted,
.bm-trusted-person-view #tp_en_block,
.bm-trusted-person-view #tp_en_instructor {
            padding: 20px 16px;
            border-radius: 19px;
        }

        .bm-trusted-person-view #tp_spanish .tp-menu-card,
.bm-trusted-person-view #tp_english .tp-menu-card {
            min-height: auto;
            padding: 22px 20px;
            border-radius: 19px;
        }

        .bm-trusted-person-view #tp_spanish .nt-step,
.bm-trusted-person-view #tp_english .nt-step,
.bm-trusted-person-view #tp_spanish .nt-video-container,
.bm-trusted-person-view #tp_english .nt-video-container {
            border-radius: 15px;
        }

        .bm-trusted-person-view #tp_spanish .nt-step-content,
.bm-trusted-person-view #tp_english .nt-step-content {
            padding: 19px 16px;
        }

        .bm-trusted-person-view #tp_spanish .tp-note-box,
.bm-trusted-person-view #tp_english .tp-note-box,
.bm-trusted-person-view #tp_topAlertES .tp-note-box,
.bm-trusted-person-view #tp_topAlertEN .tp-note-box {
            padding: 17px 16px 17px 19px;
            border-radius: 14px;
        }

        .bm-trusted-person-view #tp_spanish .nt-btn-back,
.bm-trusted-person-view #tp_english .nt-btn-back {
            min-height: 40px;
            padding: 9px 13px;
        }

        .bm-trusted-person-view #tp_spanish select,
.bm-trusted-person-view #tp_spanish input[type="text"],
.bm-trusted-person-view #tp_spanish input[type="email"],
.bm-trusted-person-view #tp_spanish input[type="date"],
.bm-trusted-person-view #tp_english select,
.bm-trusted-person-view #tp_english input[type="text"],
.bm-trusted-person-view #tp_english input[type="email"],
.bm-trusted-person-view #tp_english input[type="date"] {
            min-height: 48px;
            font-size: 16px;
        }

        .bm-trusted-person-view #tp_spanish .btn-primary,
.bm-trusted-person-view #tp_english .btn-primary,
.bm-trusted-person-view #tp_spanish .btn-danger-custom,
.bm-trusted-person-view #tp_english .btn-danger-custom {
            width: 100%;
            min-height: 48px;
        }

        .bm-trusted-person-view #tp_spanish .btn-selection-card,
.bm-trusted-person-view #tp_english .btn-selection-card {
            padding: 16px 15px 16px 47px;
        }

        .bm-trusted-person-view #tp_spanish .btn-selection-card::before,
.bm-trusted-person-view #tp_english .btn-selection-card::before {
            left: 17px;
        }
    }

    @media (prefers-reduced-motion: reduce) {
        .bm-trusted-person-view #tp_spanish *,
.bm-trusted-person-view #tp_english * {
            scroll-behavior: auto !important;
            animation-duration: .01ms !important;
            animation-iteration-count: 1 !important;
            transition-duration: .01ms !important;
        }
    }


    /* Corrección visual de pasos y estados informativos */
    .bm-trusted-person-view #tp_spanish .nt-timeline > form,
.bm-trusted-person-view #tp_english .nt-timeline > form {
        display: grid;
        gap: 24px;
        width: 100%;
        margin: 0;
    }

    .bm-trusted-person-view #tp_instrSectionES:not(.tp-hidden),
.bm-trusted-person-view #tp_instrSectionEN:not(.tp-hidden) {
        display: grid;
        gap: 22px;
        width: 100%;
    }

    .bm-trusted-person-view #tp_instrSectionES > .tp-selection-summary,
.bm-trusted-person-view #tp_instrSectionEN > .tp-selection-summary {
        margin-bottom: 0 !important;
    }

    .bm-trusted-person-view #tp_spanish .nt-step,
.bm-trusted-person-view #tp_english .nt-step {
        isolation: isolate;
        overflow: visible;
    }

    .bm-trusted-person-view #tp_spanish .nt-timeline::before,
.bm-trusted-person-view #tp_spanish .nt-timeline::after,
.bm-trusted-person-view #tp_english .nt-timeline::before,
.bm-trusted-person-view #tp_english .nt-timeline::after,
.bm-trusted-person-view #tp_spanish .nt-step::before,
.bm-trusted-person-view #tp_spanish .nt-step::after,
.bm-trusted-person-view #tp_english .nt-step::before,
.bm-trusted-person-view #tp_english .nt-step::after {
        display: none !important;
        content: none !important;
    }

    .bm-trusted-person-view #tp_spanish .nt-step + .nt-step,
.bm-trusted-person-view #tp_english .nt-step + .nt-step {
        margin-top: 0 !important;
    }

    .bm-trusted-person-view #tp_spanish .tp-selection-summary,
.bm-trusted-person-view #tp_english .tp-selection-summary {
        position: relative;
        display: flex;
        flex-direction: column;
        justify-content: center;
        min-height: 74px;
        margin-left: 0;
        margin-right: 0;
        padding: 16px 18px 16px 62px;
        border: 1px solid rgba(148,163,184,.22);
        border-radius: 16px;
        background:
            linear-gradient(135deg, rgba(255,255,255,.035), transparent 55%),
            rgba(15,23,42,.42);
        color: var(--tp-muted);
        text-align: left !important;
        line-height: 1.55;
        box-shadow: 0 10px 24px rgba(0,0,0,.13);
    }

    .bm-trusted-person-view #tp_spanish .tp-selection-summary::before,
.bm-trusted-person-view #tp_english .tp-selection-summary::before {
        position: absolute;
        left: 18px;
        top: 50%;
        display: grid;
        width: 30px;
        height: 30px;
        place-items: center;
        border: 1px solid rgba(148,163,184,.28);
        border-radius: 50%;
        background: rgba(148,163,184,.10);
        color: #b7c1d3;
        font-size: .88rem;
        font-weight: 900;
        line-height: 1;
        transform: translateY(-50%);
    }

    .bm-trusted-person-view #tp_spanish .tp-selection-summary strong,
.bm-trusted-person-view #tp_english .tp-selection-summary strong {
        color: var(--tp-text);
    }

    .bm-trusted-person-view #tp_spanish .tp-summary-placeholder::before,
.bm-trusted-person-view #tp_english .tp-summary-placeholder::before {
        content: "i";
    }

    .bm-trusted-person-view #tp_spanish .tp-summary-empty,
.bm-trusted-person-view #tp_english .tp-summary-empty {
        border-color: rgba(148,163,184,.22);
        background:
            linear-gradient(135deg, rgba(148,163,184,.07), transparent 58%),
            rgba(15,23,42,.45);
    }

    .bm-trusted-person-view #tp_spanish .tp-summary-empty::before,
.bm-trusted-person-view #tp_english .tp-summary-empty::before {
        content: "—";
        background: rgba(148,163,184,.11);
        color: #c3cbd8;
    }

    .bm-trusted-person-view #tp_spanish .tp-summary-active,
.bm-trusted-person-view #tp_english .tp-summary-active {
        border-color: rgba(52,211,153,.28);
        background:
            linear-gradient(135deg, rgba(52,211,153,.115), transparent 60%),
            rgba(15,23,42,.48);
    }

    .bm-trusted-person-view #tp_spanish .tp-summary-active::before,
.bm-trusted-person-view #tp_english .tp-summary-active::before {
        content: "✓";
        border-color: rgba(52,211,153,.38);
        background: rgba(52,211,153,.14);
        color: #6ee7b7;
    }

    .bm-trusted-person-view #tp_spanish .tp-summary-warning,
.bm-trusted-person-view #tp_english .tp-summary-warning {
        border-color: rgba(251,191,36,.30);
        background:
            linear-gradient(135deg, rgba(251,191,36,.11), transparent 60%),
            rgba(15,23,42,.48);
    }

    .bm-trusted-person-view #tp_spanish .tp-summary-warning::before,
.bm-trusted-person-view #tp_english .tp-summary-warning::before {
        content: "!";
        border-color: rgba(251,191,36,.38);
        background: rgba(251,191,36,.14);
        color: #fcd34d;
    }

    .bm-trusted-person-view #tp_spanish .tp-selection-summary small,
.bm-trusted-person-view #tp_english .tp-selection-summary small,
.bm-trusted-person-view #tp_spanish .tp-selection-summary .text-muted,
.bm-trusted-person-view #tp_english .tp-selection-summary .text-muted {
        color: var(--tp-muted) !important;
    }

    @media (max-width: 767.98px) {
        .bm-trusted-person-view #tp_spanish .nt-timeline > form,
.bm-trusted-person-view #tp_english .nt-timeline > form,
.bm-trusted-person-view #tp_instrSectionES:not(.tp-hidden),
.bm-trusted-person-view #tp_instrSectionEN:not(.tp-hidden) {
            gap: 18px;
        }

        .bm-trusted-person-view #tp_spanish .tp-selection-summary,
.bm-trusted-person-view #tp_english .tp-selection-summary {
            min-height: 68px;
            padding: 15px 15px 15px 54px;
            border-radius: 14px;
        }

        .bm-trusted-person-view #tp_spanish .tp-selection-summary::before,
.bm-trusted-person-view #tp_english .tp-selection-summary::before {
            left: 15px;
            width: 27px;
            height: 27px;
        }
    }

.bm-trusted-person-view .tp-option-panel {
    background: rgba(255,255,255,.02);
    border-color: var(--nt-border) !important;
}
.bm-trusted-person-view .tp-border-top {
    border-color: var(--nt-border) !important;
}
.bm-mac-binding-view .bm-js-required-notice {
    margin: 20px auto;
    max-width: 900px;
    padding: 16px;
    border: 1px solid rgba(245, 158, 11, .35);
    border-radius: 12px;
    background: rgba(245, 158, 11, .08);
    color: var(--text-primary, #f8fafc);
}
.bm-trusted-person-view .tp-step-no-line {
    border-left-color: transparent !important;
}

