/* ============================================================
   MRTESTS — Responsive global (móvil / tablet)
   Carga después de style, user/admin y nav.
   ============================================================ */

/* ---- Base y contenedores ---- */
@media (max-width: 991.98px) {
    body:not(.auth-body) .container {
        max-width: 100%;
    }
}

@media (max-width: 575.98px) {
    .container,
    .container-fluid {
        padding-left: max(0.875rem, env(safe-area-inset-left, 0px));
        padding-right: max(0.875rem, env(safe-area-inset-right, 0px));
    }

    body:not(.auth-body) .container.mt-4 {
        margin-top: 1rem !important;
    }

    .modal-dialog {
        margin: 0.75rem;
        max-width: calc(100% - 1.5rem);
    }

    .modal-body {
        padding: 1rem;
    }

    .modern-card-body {
        padding: 1.25rem;
    }

    .modern-card-header {
        padding: 1.5rem 1rem;
    }

    .btn-modern {
        min-height: 44px;
    }
}

/* Medios y tablas */
img,
video,
canvas {
    max-width: 100%;
    height: auto;
}

.mrt-scroll-x,
.table-responsive {
    -webkit-overflow-scrolling: touch;
}

@media (max-width: 767.98px) {
    .mrt-scroll-x,
    .admin-content .table-responsive,
    .admin-content .admin-modern-table,
    .results-table-wrap,
    .admin-settings-page .cfg-section-body {
        overflow-x: auto;
    }

    .admin-content .table:not(.table-stack-mobile) {
        min-width: 520px;
    }
}

/* Sidebars sticky → flujo en móvil */
@media (max-width: 991.98px) {
    .modern-card[style*="position: sticky"],
    div[style*="position: sticky"][style*="top:"] {
        position: static !important;
        top: auto !important;
    }
}

/* ---- Navegación / barras fijas ---- */
@media (max-width: 575.98px) {
    #cookieBanner .container {
        padding-top: 0.75rem;
        padding-bottom: calc(0.75rem + env(safe-area-inset-bottom, 0px));
    }

    #cookieBanner .d-flex.gap-2 {
        width: 100%;
    }

    #cookieBanner button {
        flex: 1;
        min-height: 44px;
    }

    .public-sticky-cta-inner {
        flex-direction: column;
        align-items: stretch;
        text-align: center;
    }

    .public-sticky-cta-actions {
        justify-content: center;
        width: 100%;
    }

    .public-sticky-cta-btn {
        flex: 1;
        text-align: center;
        min-height: 44px;
        display: flex;
        align-items: center;
        justify-content: center;
    }
}

/* ---- Admin general ---- */
@media (max-width: 991.98px) {
    .admin-content {
        padding: 12px 10px;
    }

    .stats-card-mini:hover,
    .test-card:hover {
        transform: none;
    }
}

@media (max-width: 767.98px) {
    .admin-tests-table .att-desc {
        display: none;
    }

    .admin-tests-table .att-title {
        max-width: 160px;
    }

    .builder-wrapper {
        margin: 0 -0.5rem;
    }

    .builder-header {
        flex-direction: column;
        align-items: stretch;
    }

    .builder-header-right {
        width: 100%;
        justify-content: flex-end;
        flex-wrap: wrap;
    }

    .builder-stat-row {
        grid-template-columns: repeat(2, 1fr) !important;
    }

    .admin-content .form-control[style*="width:"],
    .admin-content .form-select[style*="width:"] {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }

    .admin-content .d-flex.gap-2,
    .admin-content .d-flex.gap-3 {
        flex-wrap: wrap;
    }
}

@media (max-width: 575.98px) {
    .d-flex.gap-3.flex-wrap > .btn-glow,
    .d-flex.gap-2.flex-wrap > .btn-glow {
        width: 100%;
        justify-content: center;
        box-sizing: border-box;
    }

    .au-stats {
        grid-template-columns: 1fr !important;
    }

    .admin-settings-page .settings-savebar {
        padding: 10px 12px;
    }

    .admin-settings-page .settings-savebar-inner {
        flex-direction: column;
        align-items: stretch;
    }

    .admin-settings-page .settings-savebar-hint {
        text-align: center;
        font-size: 0.8rem;
    }

    .admin-settings-page .settings-savebar-actions {
        width: 100%;
    }

    .admin-settings-page .settings-savebar-actions .btn {
        flex: 1;
        min-width: 0;
        min-height: 44px;
    }

    .admin-settings-page #settingsSavebarSave {
        min-width: 0 !important;
        width: 100%;
    }
}

/* ---- Panel usuario: test en curso ---- */
@media (max-width: 991.98px) {
    .test-layout {
        margin: 0 !important;
        min-height: auto;
    }

    .test-main {
        padding: 16px 12px calc(100px + env(safe-area-inset-bottom, 0px));
    }

    .test-question {
        padding: 16px 14px;
        scroll-margin-top: 88px;
    }

    .test-question-text {
        font-size: 1rem;
    }

    .test-option {
        padding: 12px 14px;
        font-size: 0.9rem;
    }

    .test-mobile-bar {
        padding: 10px 12px calc(10px + env(safe-area-inset-bottom, 0px));
    }

    .test-finish-summary {
        grid-template-columns: 1fr;
    }

    .test-main .btn-lg.px-5 {
        width: 100%;
        padding-left: 1rem !important;
        padding-right: 1rem !important;
    }

    #finishModal .modal-footer {
        flex-direction: column;
        gap: 8px;
    }

    #finishModal .modal-footer .btn {
        width: 100%;
        margin: 0;
        min-height: 44px;
    }
}

/* ---- Ficha test / paquetes ---- */
@media (max-width: 767.98px) {
    .pretest-hero,
    .pkg-hero {
        padding: 24px 18px !important;
        border-radius: 14px;
    }

    .pretest-title {
        font-size: 1.45rem;
    }

    .pretest-meta {
        gap: 12px;
    }

    .pretest-meta-item {
        min-width: calc(50% - 8px);
        flex: 1 1 calc(50% - 8px);
        padding: 10px 14px;
    }

    .pretest-start-btn {
        width: 100%;
        box-sizing: border-box;
        justify-content: center;
    }

    .pretest-modal {
        padding: 24px 20px;
        width: calc(100% - 2rem);
        max-width: none;
    }

    .pretest-modal-actions {
        flex-direction: column;
    }

    .pretest-modal-actions button {
        width: 100%;
        min-height: 44px;
    }

    .pkg-hero h1 {
        font-size: 1.4rem;
    }

    .pkg-card:hover {
        transform: none;
    }

    .pkg-body {
        padding: 20px 18px;
    }
}

/* ---- Blog / artículo ---- */
@media (max-width: 991.98px) {
    .blog-content {
        font-size: 0.95rem !important;
        line-height: 1.75 !important;
    }

    .blog-content h2 {
        font-size: 1.2rem;
    }

    .blog-content h3 {
        font-size: 1.05rem;
    }
}

@media (max-width: 575.98px) {
    article .d-flex.align-items-center.gap-3.mb-4 {
        flex-direction: column;
        align-items: flex-start !important;
        gap: 0.35rem !important;
    }

    article [style*="padding: 2.5rem"] {
        padding: 1.5rem !important;
    }
}

/* ---- Perfil de usuario ---- */
@media (max-width: 767.98px) {
    .profile-page .pf-txn-row {
        flex-wrap: wrap;
        gap: 10px;
    }

    .profile-page .pf-txn-row > div:last-child {
        width: 100%;
        text-align: left !important;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 8px;
    }

    .profile-page .profile-section-hdr a {
        margin-left: 0 !important;
        width: 100%;
        margin-top: 4px;
    }
}

/* ---- Página pricing (pública) ---- */
.pricing-page {
    width: 100%;
    max-width: 100%;
    overflow: visible;
}
.pricing-page .pricing-inner {
    width: 100%;
    max-width: 1140px;
    margin-left: auto;
    margin-right: auto;
}

/* ---- Página oposición (hero público) ---- */
@media (max-width: 767.98px) {
    .opp-page-hero {
        padding: 48px 0 36px !important;
    }

    .opp-page-hero .d-flex.gap-3.flex-wrap {
        flex-direction: column;
        width: 100%;
    }

    .opp-page-hero .d-flex.gap-3.flex-wrap .btn-glow {
        width: 100%;
        justify-content: center;
        box-sizing: border-box;
    }

    .opp-page-hero .d-flex.align-items-center.gap-3.mb-3 {
        flex-wrap: wrap;
    }

    .opp-page-hero p[style*="max-width"] {
        font-size: 1rem !important;
        margin-bottom: 1.25rem !important;
    }
}

/* ---- Resultados / filtros ---- */
@media (max-width: 575.98px) {
    .filter-input[style*="min-width"] {
        min-width: 0 !important;
        max-width: none !important;
        width: 100% !important;
    }

    .results-stats {
        gap: 8px;
    }
}

/* Panel usuario: reglas ampliadas en assets/css/user-panel.css */

/* ---- Utilidades táctiles ---- */
@media (max-width: 991.98px) {
    .hover-lift:hover,
    .user-card:hover {
        transform: none;
    }
}

@media (hover: none) and (pointer: coarse) {
    .btn,
    .user-btn,
    .nav-link,
    .dropdown-item {
        -webkit-tap-highlight-color: transparent;
    }
}