/*
 * FILE: assets/css/mobile-fixes.css
 * PURPOSE: Extra mobile-friendliness safety net on top of responsive.css
 *          and inner-pages.css. Loaded LAST so it can patch small gaps.
 * USED BY: All public pages (linked from includes/header.php).
 * NOTE: Styling/layout only. Does not change any page text or content.
 */

/* ---- Never allow the page to scroll sideways on small screens ---- */
html, body {
    max-width: 100%;
    overflow-x: hidden;
}

/* ---- Tables (Colleges & States, Open vs Closed States, etc.) ----
   These already sit inside .table-shell { overflow:auto }, this just
   makes the scroll smoother on touch and adds a visible affordance. */
.table-shell {
    -webkit-overflow-scrolling: touch;
}
@media (max-width: 680px) {
    .table-shell {
        box-shadow: inset -14px 0 12px -12px rgba(18, 59, 112, 0.12);
    }
}

/* ---- Comfortable tap targets on touch devices ---- */
@media (max-width: 900px) {
    a, button, .btn, .inner-btn, .premium-submit, .nav-toggle {
        -webkit-tap-highlight-color: rgba(18, 59, 112, 0.12);
    }
    .main-nav > a, .faq-premium summary, .inner-btn, .btn {
        min-height: 44px;
    }
}

/* ---- Prevent long unbroken text (phone numbers, emails, long URLs)
   from forcing horizontal scroll on very narrow phones ---- */
.contact-detail strong,
.contact-detail a,
.hero h1,
.page-hero h1,
h1, h2, h3 {
    overflow-wrap: break-word;
    word-break: break-word;
}

/* ---- Extra breakpoint for small phones (iPhone SE / small Android, ~360px) ---- */
@media (max-width: 380px) {
    .container { width: min(var(--container), calc(100% - 20px)); }
    .page-hero { padding: 60px 0 50px; }
    .page-hero h1 { font-size: 30px; }
    .inner-section { padding: 50px 0; }
    .premium-card, .state-premium-card, .form-premium-card { padding: 18px; }
    .inner-cta h2 { font-size: 26px; }
    .hero h1 { font-size: 32px; }
}

/* ---- Admin panel on phones: keep the top icon-nav usable ---- */
@media (max-width: 420px) {
    .admin-sidebar nav { grid-template-columns: repeat(2, 1fr) !important; }
}