/*
 * Mobile overrides — loaded after the theme and Bootstrap, only bites under
 * 768px. Written from the 2026-08-23 audit at 375px (tap targets under
 * 32px everywhere, 11px text, bare tables on the event page). The theme's
 * own responsive rules stay; these lift the floor.
 */
@media (max-width: 767px) {
    /* A finger, not a cursor: every button and pill at least 40px tall. */
    .btn, .btn-sm, .btn-xs, .home-cap-btn, .trial-btn, .cw-toggle,
    .pagination > li > a, .nav-tabs > li > a, .cfp-row a.btn, .ev-dl-btn {
        min-height: 40px; padding-top: 9px; padding-bottom: 9px; font-size: 14px;
    }
    .btn-xs { min-height: 36px; }

    /* Links that are the only way into a thing (card titles, list rows)
       get room to be tapped. */
    .events-tabs .entry-event h4 a, .entry-event h4 a, .event-row h4 a,
    .cfp-list a, .search-result a.title, .wl-table a, .rp-list a {
        display: inline-block; padding: 4px 0; line-height: 1.7;
    }

    /* 11px is not a size for a phone. */
    .cal-weekday, .cal-dow, .cfp-days .k, .entry-event .info li, .event-row .info li,
    .featured-meta, .search-hint, .wl-block small, .sg-credit, small {
        font-size: 12px !important;
    }

    /* Tables keep their columns and scroll inside themselves — the page
       never scrolls sideways. Covers the event page's twelve tabs. */
    .tab-content .table, .table-striped, .portlet-body .table, .wl-table, .cfp-table {
        display: block; width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch;
    }

    /* Bootstrap .row without a container bleeds 15px each side (the events
       page). Neutral margins inside anything that is not a container. */
    .events-archive .row .row { margin-left: 0; margin-right: 0; }

    /* Nav tabs wrap as pills, two to a row — fourteen tabs one per line ran
       the page's length; half-width pills make seven short rows. */
    .nav-tabs { display: flex; flex-wrap: wrap; gap: 4px; border: 0; }
    .nav-tabs > li { float: none; margin: 0; width: calc(50% - 2px); }
    .nav-tabs > li > a { border: 1px solid #d6dfc0; border-radius: 8px !important; margin: 0; display: block; text-align: center; padding-left: 6px; padding-right: 6px; }
    .nav-tabs > li.active > a { background: #35470b; color: #fff; border-color: #35470b; }

    /* Form controls tall enough to tap, and a 16px font so iOS does not
       zoom the page on focus. */
    .form-control, select.form-control, textarea.form-control { min-height: 44px; font-size: 16px; }
    textarea.form-control { min-height: 96px; }

    /* Floating chat button clear of the thumb zone edge. */
    .cw-float { bottom: 14px; }

    /* The phone's door on the full event form — hidden on a computer. */
    .quick-mobile-hint { display: block !important; }
}
.quick-mobile-hint { display: none; background: #fdf6e6; border: 1px solid #e0b64f; border-radius: 10px; padding: 12px 14px; margin: 10px 0 16px; font-size: 14.5px; line-height: 1.8; color: #7a5410; }
.quick-mobile-hint a { display: inline-block; margin-top: 6px; background: #c0392b; color: #fff; border-radius: 10px; padding: 9px 16px; font-weight: 700; text-decoration: none; }
