/* Mediora V2 mobile responsive pass — 2026-06-10
   Targeted @media overrides for all V2/V3 surfaces. Designed-for-mobile
   layout adjustments at 720px and below, plus extra polish at 480px.
   Loaded site-wide after the design system + page-scoped styles. */

@media (max-width: 720px) {

    /* ─── HomeLandingV2 hero + sections ─── */
    .v2-hero { padding: 56px 0 40px; }
    .v2-hero__title { font-size: clamp(26px, 7vw, 36px); }
    .v2-hero__sub { font-size: 14px; }
    .v2-hero__cta { flex-direction: column; align-items: stretch; padding: 0 16px; }
    .v2-hero__cta .v2-btn { width: 100%; justify-content: center; }
    .v2-hero__trust { gap: 14px; font-size: 12px; flex-direction: column; align-items: center; }

    .v2-section { padding: 48px 0; }
    .v2-section-title { font-size: 22px; }
    .v2-section-lead  { font-size: 14px; }

    .v2-price-card--rec { transform: none; }
    .v2-final-cta { padding: 32px 22px; border-radius: 16px; }

    /* ─── Login split ─── */
    /* Already handled via in-page @media (max-width: 900px). */

    /* ─── DashboardV2 ─── */
    .dashv2 { padding: 16px; }
    .dashv2__hero { flex-direction: column; align-items: flex-start; padding: 22px 22px; }
    .dashv2__hero h1 { font-size: 22px; }
    .dashv2__quota { align-items: flex-start; text-align: start; min-width: 0; width: 100%; }
    .dashv2__tiles { grid-template-columns: 1fr; }
    .report-card { flex-direction: column; align-items: flex-start; gap: 10px; }
    .report-card__flags { align-items: flex-start; text-align: start; flex-direction: row; flex-wrap: wrap; }
    .dashv2__cta-band { flex-direction: column; align-items: flex-start; gap: 12px; }
    .dashv2__cta-band-btn { width: 100%; justify-content: center; }

    /* ─── Marketplace listing + doctor profile ─── */
    .doctor-grid { grid-template-columns: 1fr; }
    .doctor-card { padding: 16px; }
    .price-tiers { flex-direction: column; }
    /* Public doctor profile sticky sidebar collapses below main on mobile */
    .ds-grid--3-2 { grid-template-columns: 1fr !important; }

    /* ─── Marketplace request form ─── */
    .tier-grid { grid-template-columns: 1fr; }

    /* ─── Doctor cabinet NavBar ─── */
    .doctor-navbar {
        overflow-x: auto;
        flex-wrap: nowrap;
        -webkit-overflow-scrolling: touch;
    }
    .doctor-navbar-link { white-space: nowrap; flex-shrink: 0; }
    .doctor-navbar-sep { display: none; }

    /* ─── Doctor consultation review split ─── */
    .ds-grid--3-2 { grid-template-columns: 1fr !important; }
    /* Sticky aside loses sticky on mobile so it sits below main */
    aside[style*="position:sticky"] { position: static !important; top: auto !important; }

    /* ─── HistoryV2 ─── */
    .hv2 { padding: 20px 16px; }
    .hv2__head { flex-direction: column; align-items: flex-start; }
    .hv2__upload-btn { width: 100%; justify-content: center; }
    .hv2-card { flex-direction: column; align-items: flex-start; gap: 12px; }
    .hv2-card__flags { flex-direction: row; flex-wrap: wrap; align-items: center; min-width: 0; width: 100%; }
    .hv2-card__chev { display: none; }

    /* ─── ArticlesListV2 ─── */
    .alv2 { padding: 32px 16px; }
    .alv2__head h1 { font-size: 22px; }
    .alv2__bar { flex-direction: column; align-items: stretch; }
    .alv2__chips { width: 100%; }

    /* ─── ArticleDetailV2 ─── */
    .adv2 { padding: 32px 18px 56px; }
    .adv2__title { font-size: 26px; }
    .adv2__excerpt { font-size: 15px; }
    .adv2__body { font-size: 15.5px; }
    .adv2__body h2 { font-size: 20px; }
    .adv2__cross-sell { flex-direction: column; align-items: flex-start; padding: 18px 20px; }
    .adv2__cross-btn { width: 100%; justify-content: center; }

    /* ─── DynamicsV2 ─── */
    .dynv2 { padding: 20px 16px; }
    .dynv2__head h1 { font-size: 22px; }
    .dynv2__picker-list { max-height: 240px; }
    .dynv2__chart-card { padding: 16px 18px; }
    .dynv2__chart-head { flex-direction: column; align-items: flex-start; }
    .dynv2__svg { height: 200px; }
    .dynv2__legend { grid-template-columns: 1fr 1fr; }

    /* ─── PricingV2 ─── */
    .pv2 { padding: 32px 16px 48px; }
    .pv2__hero h1 { font-size: 24px; }
    .pv2__grid { gap: 14px; }
    .pv2__card--featured { transform: none; }
    .pv2__doctor-cta { padding: 28px 22px; }

    /* ─── Report V2 hero + meta ─── */
    .report-v2-hero { padding: 22px 22px; flex-direction: column; align-items: flex-start; }
    .report-v2-hero__copy h1 { font-size: 24px; }
    .report-v2-risk { min-width: 0; width: 100%; flex-direction: row; align-items: center; justify-content: space-between; padding: 12px 18px; }
    .report-v2-risk i { margin-bottom: 0; }
    .report-v2-meta { grid-template-columns: repeat(2, 1fr); }

    /* ─── Doctor cabinet tile grids on mobile ─── */
    .cabinet-grid { grid-template-columns: 1fr; }
    .assignments-table, .rewards-table, .inbox-table, .req-table {
        font-size: 12px;
    }
    .assignments-table th, .assignments-table td,
    .rewards-table th, .rewards-table td,
    .inbox-table th, .inbox-table td,
    .req-table th, .req-table td {
        padding: 8px 8px;
    }

    /* ─── Doctors recruitment landing ─── */
    .doctors-landing { padding: 0 18px 48px; }
    .hero h1 { font-size: 26px; }
    .pillars, .trust-grid, .earnings-grid, .steps { grid-template-columns: 1fr !important; }
    .earnings-card.featured { transform: none; }
    .cta { padding: 40px 22px; }

    /* ─── Upload V2 chips ─── */
    .upload-v2__pitch-row { flex-direction: column; align-items: center; }
    .upload-v2__crosslink { flex-direction: column; align-items: flex-start; }
    .upload-v2__crosslink > i:last-child { display: none; }

    /* ─── Admin escalation queue cards ─── */
    /* MudBlazor handles its own breakpoints; nothing forced here. */
}

@media (max-width: 480px) {
    /* Hero compresses further */
    .v2-hero__title { font-size: clamp(22px, 8vw, 30px); }
    .v2-hero__sub   { font-size: 13px; padding: 0 4px; }
    .dashv2__hero h1 { font-size: 19px; }
    .pv2__price strong { font-size: 32px; }
    .report-v2-meta { grid-template-columns: 1fr; }
}