/*
Theme Name: Generic Child Theme
Template: seeko
Version: 1.0.3
*/


/* Header */

/* Header Login Button Styles — AMENDMENT S58: white bg + gold border + gold text
   (Rob's direction 2026-04-14). Replaces previous gold-bg/blue-text variant. */
.header-login-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none !important;
    font-family: "Montserrat", Sans-serif;
    font-weight: 600;
    font-size: 1rem;
    line-height: 1.2;
    text-transform: uppercase;
    padding: 0.2rem 1.25rem;
    border-radius: 2rem;
    background-color: #FFFFFF !important;
    color: #CC9900 !important;
    border: 1px solid #CC9900 !important;
    border-bottom-width: 2px !important;
    outline: none;
    box-shadow: 0 2px 4px rgba(3, 27, 131, 0.12);
    transition: transform 0.3s ease, box-shadow 0.3s ease, background-color 0.3s ease, color 0.3s ease;
}

.header-login-btn.logged-in {
    text-transform: none; /* Natural case for "Hi, Name" */
}

.header-login-btn .login-icon {
    margin-right: 8px;
    display: inline-flex;
    align-items: center;
    height: 1em;
    vertical-align: middle;
}

.header-login-btn .login-icon svg {
    width: 1em;
    height: 1em;
    vertical-align: middle;
    position: relative;
    top: -1px;
}

.header-login-btn:hover {
    transform: scale(1.05);
    box-shadow: 0 6px 12px rgba(2, 22, 106, 0.4);
    background-color: #FFD700 !important;
    color: #031B83 !important;
    text-decoration: none !important;
}

/* AMENDMENT S58 2026-04-14: Unified header button sizing — LOGOUT + DASHBOARD must
   be visually identical. Previous rogue .header-logout-btn block (font-size 0.85rem,
   padding 0.2rem 0.8rem) made LOGOUT smaller than DASHBOARD. This replaces it with
   a combined rule targeting BOTH .header-logout-btn and .header-login-btn.logged-in
   so they share every dimension-related property. Colour is inherited from the
   base .header-login-btn rule above (gold bg + navy text). */
.header-logout-btn,
.header-login-btn.logged-in {
    background-color: #CC9900 !important;
    color: #031B83 !important;
    border: none !important;
    font-family: Montserrat, sans-serif !important;
    font-weight: 700 !important;
    font-size: 0.9rem !important;
    letter-spacing: 0.02em !important;
    text-transform: uppercase !important;
    padding: 0.4rem 1.1rem !important;
    min-width: 185px !important;
    line-height: 1.2 !important;
    text-align: center !important;
    border-radius: 9999px !important;
    margin: 0 4px !important;
    text-decoration: none !important;
    box-shadow: 0 1px 2px rgba(0,0,0,0.08) !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}
.header-logout-btn:hover,
.header-login-btn.logged-in:hover {
    background-color: #FFD700 !important;
    color: #031B83 !important;
    box-shadow: 0 6px 12px rgba(2, 22, 106, 0.4) !important;
    transform: scale(1.05);
    text-decoration: none !important;
}
.header-logout-btn .login-icon svg,
.header-login-btn.logged-in .login-icon svg {
    stroke: #031B83;
}


/* Pricing Page */


/* Pricing cards — base blue style (Free, Premium, Venue) */
.pricing-card {
    background-image: linear-gradient(45deg, #031B83 0%, #00CCFF 100%) !important;
}
.pricing-card * {
    color: #CC9900 !important;
}
/* Gold style — Standard & Organiser */
.pricing-card.pricing-basic,
.pricing-card.pricing-pro {
    background-image: linear-gradient(45deg, #CC9900 0%, #FFD700 100%) !important;
}
.pricing-card.pricing-basic *,
.pricing-card.pricing-pro * {
    color: #031B83 !important;
}
/* Blue style — Premium (same as Free/Venue base) */
.pricing-card.pricing-intermediate {
    background-image: linear-gradient(45deg, #031B83 0%, #00CCFF 100%) !important;
}
.pricing-card.pricing-intermediate * {
    color: #CC9900 !important;
}
/* Force gold titles on blue cards — override PMPro h3 !important from functions.php */
.pricing-card .pricing-title,
.pricing-card h3.pricing-title,
#pmpro_form .pricing-card .pricing-title,
.pmpro_checkout .pricing-card .pricing-title {
    color: #CC9900 !important;
}
/* Standard & Organiser (gold cards) — titles stay blue */
.pricing-card.pricing-basic .pricing-title,
.pricing-card.pricing-pro .pricing-title,
#pmpro_form .pricing-card.pricing-basic .pricing-title,
#pmpro_form .pricing-card.pricing-pro .pricing-title,
.pmpro_checkout .pricing-card.pricing-basic .pricing-title,
.pmpro_checkout .pricing-card.pricing-pro .pricing-title {
    color: #031B83 !important;
}
/* <!-- AMENDMENT v2.4 (2026-04-04): Complete pricing card overhaul — compact, no animations, uniform height --> */

/* Kill ALL pricing animations — Seeko theme hover, Elementor entrance, everything */
.pricing-card,
.pricing-card *,
.pricing-card .pricing-price,
.pricing-card .pricing-price strong,
.pricing-card .pricing-price strong > span,
.pricing-card .pricing-price > span,
.pricing-card h4.pricing-price,
.pricing-card .btn-pricing,
.pricing-card .btn-pricing .btn,
.pricing-card .btn-pricing a.btn {
    transition: none !important;
    animation: none !important;
}
/* Kill Elementor fadeInUp entrance animation on pricing card widget wrappers */
.elementor-widget:has(.pricing-card),
.elementor-element:has(.pricing-card) {
    animation: none !important;
    animation-duration: 0s !important;
    animation-delay: 0s !important;
    transition: none !important;
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
}
.elementor-invisible:has(.pricing-card) {
    visibility: visible !important;
    opacity: 1 !important;
}
.animated:has(.pricing-card),
.fadeInUp:has(.pricing-card) {
    animation: none !important;
    animation-duration: 0s !important;
}

/* Compact card base — override Seeko's bloated 2rem padding */
.pricing-card {
    display: flex !important;
    flex-direction: column !important;
    padding: 1rem 1.25rem !important;
    margin-bottom: 0 !important;
}

/* Compact title — override Seeko's 1rem padding + 27px margin */
.pricing-card .pricing-title {
    padding: 0.4rem 0 !important;
    margin-bottom: 0.5rem !important;
    font-size: 1.5rem !important;
    line-height: 1.3 !important;
}
.pricing-popular.pricing-card {
    margin-top: 0;
}
.pricing-popular.pricing-card .pricing-title::after {
    margin-top: 0.3rem !important;
}

/* Compact feature list */
.pricing-card .pricing-features {
    margin-bottom: 0.5rem !important;
    padding: 0 !important;
}
.pricing-card .pricing-features li {
    padding: 0.15rem 0 !important;
    margin: 0 !important;
    font-size: 0.9rem !important;
    line-height: 1.4 !important;
}

/* Compact description */
.pricing-card .pricing-desc {
    margin-bottom: 0.25rem !important;
    max-height: none !important;
}

/* Compact price — override Seeko's padding and flex layout */
.pricing-card .pricing-price,
.pricing-card h4.pricing-price {
    padding: 0.4rem 0 !important;
    margin-bottom: 0.5rem !important;
}

/* Force price subscription text ("per Month") to always show — Seeko hides it */
.pricing-card .pricing-price > span {
    height: auto !important;
    overflow: visible !important;
    opacity: 1 !important;
    max-width: none !important;
    display: block !important;
}
.pricing-card .pricing-price strong > span {
    max-width: none !important;
    opacity: 1 !important;
    overflow: visible !important;
}

/* Force button to always show — override Seeko's height:0 hover-reveal mechanism */
.pricing-card .btn-pricing {
    height: auto !important;
    overflow: visible !important;
    margin-top: auto !important;
    padding: 0 !important;
}
.pricing-card .btn-pricing:hover {
    border: none !important;
    outline: none !important;
    height: auto !important;
}



/* Button Opposing Colors Per Card — gold button on blue cards, blue button on gold cards */
.pricing-card .btn-pricing a.btn,
.pricing-card.pricing-intermediate .btn-pricing a.btn {
    background: linear-gradient(-135deg, #FFD700 5%, #CC9900 50%) !important;
    border-radius: 0.43rem !important;
    opacity: 1 !important;
    color: #031B83 !important;
    display: block !important;
    width: 100% !important;
    border: none !important;
}
.pricing-card .btn-pricing a.btn:hover,
.pricing-card.pricing-intermediate .btn-pricing a.btn:hover {
    background: linear-gradient(225deg, #FFD700 50%, #CC9900 100%) !important;
    color: black !important;
}
.pricing-card.pricing-basic .btn-pricing a.btn,
.pricing-card.pricing-pro .btn-pricing a.btn {
    background: linear-gradient(-135deg, #00CCFF 5%, #031B83 50%) !important;
    border-radius: 0.43rem !important;
    opacity: 1 !important;
    color: #CC9900 !important;
    display: block !important;
    width: 100% !important;
    border: none !important;
}
.pricing-card.pricing-basic .btn-pricing a.btn:hover,
.pricing-card.pricing-pro .btn-pricing a.btn:hover {
    background: linear-gradient(225deg, #00CCFF 50%, #031B83 100%) !important;
    color: black !important;
}







/* Profile Page */

/* Remove breadcrumbs from profile page */
.svq-breadcrumb { display: none; }


/* Generic Media Upload and Gallery Styles */
.rtmedia-uploader-div {
    background-color: #FAFAFA;
    border: 2px solid #031B83;
    border-radius: 0.43rem;
    padding: 1rem;
}

.rtmedia-uploader-div .rtm-file-input,
.rtmedia-uploader-div button {
    font-family: "Montserrat", sans-serif !important;
    font-weight: 500 !important;
    text-transform: uppercase !important;
    border-radius: 0.43rem !important;
    padding: 0.25rem 1rem !important;
    box-shadow: 0 12px 20px -16px rgba(2, 22, 106, 0.6) !important;
    background-color: #031B83 !important;
    color: #FAFAFA !important;
    transition: transform 0.4s ease-in-out !important;
}

/* P2.33b — only apply hover scale on real hover devices to prevent
   touch-tap overflow on phones/tablets.
   Phase 2a S65: background-color lifted to base (identical across both media queries). */
.rtmedia-uploader-div button:hover,
.rtmedia-uploader-div button.photo-limit-disabled:hover {
    background-color: #002060 !important;
}
@media (hover: hover) and (pointer: fine) {
    .rtmedia-uploader-div button:hover,
    .rtmedia-uploader-div button.photo-limit-disabled:hover {
        transform: scale(1.1) !important;
    }
}
@media (hover: none) {
    .rtmedia-uploader-div button:hover,
    .rtmedia-uploader-div button.photo-limit-disabled:hover {
        transform: none !important;
    }
}

.rtmedia-uploader-div button.photo-limit-disabled {
    background-color: #031B83 !important; /* Preserve base color when disabled */
    opacity: 0.7 !important;
    cursor: not-allowed !important;
}

.rtmedia-container .rtmedia-list {
    border: 2px solid #CC9900;
    border-radius: 0.43rem;
    padding: 1rem;
    background-color: #FAFAFA;
    box-shadow: 0 2px 5px rgba(2, 22, 106, 0.2);
}

.rtmedia-container .rtmedia-list-item {
    border-radius: 0.43rem;
    overflow: hidden;
    margin: 0.5rem;
}

.rtmedia-item-thumbnail img {
    border-radius: 0.43rem;
    box-shadow: 0 1px 3px rgba(2, 22, 106, 0.3);
    transition: transform 0.3s ease;
}

.rtmedia-item-thumbnail img:hover {
    transform: scale(1.05);
}

.rtmedia-item-title h4 {
    font-family: "Montserrat", sans-serif;
    font-size: 1.25rem;
    color: #031B83;
    text-transform: uppercase;
    margin-top: 0.5rem;
}

#buddypress .item-list-tabs li a,
#buddypress .item-list-tabs li span {
    color: #031B83 !important;
}

#rtm-media-options a,
#rtm-media-options button {
    background-color: #031B83 !important;
    color: #FAFAFA !important;
    border-radius: 0.43rem !important;
    padding: 0.25rem 1rem !important;
}

#rtm-media-options a:hover,
#rtm-media-options button:hover {
    background-color: #002060 !important;
}

/* rtMedia success/warning notifications — on brand */
.rtmedia-success {
    background-color: #fff8e1 !important;
    color: #031B83 !important;
    border: 1px solid #CC9900 !important;
    border-bottom: 1px solid #CC9900 !important;
    border-radius: 6px !important;
    text-shadow: none !important;
    font-family: "Montserrat", sans-serif;
    font-weight: 600;
    font-size: 13px;
}

.rtmedia-warning {
    background-color: #fff3cd !important;
    color: #856404 !important;
    border: 1px solid #CC9900 !important;
    border-bottom: 1px solid #CC9900 !important;
    border-radius: 6px !important;
    text-shadow: none !important;
    font-family: "Montserrat", sans-serif;
    font-weight: 600;
    font-size: 13px;
}

/* Tablet top bar — show LOGOUT + DASHBOARD, hide email + social icons.

   KEY CONSTRAINTS (do not violate — each fixes a specific Elementor bug):

   1. Email + social widgets are COLLAPSED, not display:none. Using display:none
      triggers Elementor's frontend JS responsive-visibility system, which then
      re-evaluates sibling widget visibility and applies inline display:none to
      the shortcode widget (ddcd584) after page load. Collapsing to zero-size
      keeps them in the flex layout but invisible, so Elementor JS doesn't fire.

   2. Container 5eb96116 MUST be position:relative. Elementor sticky JS makes
      both 512ec1a5 (outer) and 5eb96116 (inner) position:fixed. When inner goes
      fixed, it pops out of 79b2e73 (navy bg), collapsing the navy bar. Forcing
      relative on inner keeps it inside the navy bg. The outer still handles sticky.

   3. Container 79b2e73 MUST be flex-direction:row. Elementor sets it to column
      at tablet breakpoint. Column + collapsed widgets = bloated height.

   4. Widget ddcd584 has --order:99999 set by Elementor (base rule, no MQ).
      Both the custom property AND the resolved order must be reset to 0,
      or the widget renders outside the visible flex area.

   5. ddcd584 itself needs display:flex forced, not just its child .elementor-shortcode.
      Elementor JS can set display:none as an inline style on the widget wrapper.
      The !important on the stylesheet rule beats a non-!important inline style.
      If Elementor ever adds !important to its inline style, we'd need a JS observer
      — but currently it sets bare inline display:none without !important.
*/
/* TABLET ONLY (768–1024px) — does NOT touch mobile (≤767px).
   Mobile header already works via Elementor's native responsive layout. */
@media (min-width: 768px) and (max-width: 1024px) {
    /* Collapse email + social icons to zero size */
    .elementor-element-3e8df955,
    .elementor-element-c38eb63 {
        visibility: hidden !important;
        width: 0 !important; min-width: 0 !important; max-width: 0 !important;
        height: 0 !important; min-height: 0 !important; max-height: 0 !important;
        padding: 0 !important; margin: 0 !important; border: 0 !important; /* intentional: border:0 part of tablet-only collapse-to-zero; base has no border to drift — Phase 2a S65 */
        overflow: hidden !important; flex: 0 0 0px !important; opacity: 0 !important; /* intentional: tablet-only visual hide (paired with visibility:hidden); 1920/1280/360 must remain opacity 1 — Phase 2a S65 */
    }

    /* Kill Elementor sticky spacer ghost — visibility:hidden still occupies flex space */
    .elementor-element-79b2e73 > .elementor-sticky__spacer {
        display: none !important;
    }

    /* Mask the flash when rtMedia triggers Elementor sticky rebuild —
       buttons briefly disappear then reappear as the observer fixes it.
       A short opacity transition smooths this so it's not a hard flash. */
    .elementor-element-5eb96116,
    .elementor-element-ddcd584 {
        transition: opacity 0.15s ease !important; /* intentional: tablet-only rebuild-flash mask; not needed at other viewports — Phase 2a S65 */
    }

    /* Navy bar: row layout, slim, centre — zero the gap so spacer remnants can't split */
    .elementor-element-79b2e73 {
        flex-direction: row !important; --flex-direction: row !important;
        justify-content: center !important; --justify-content: center !important;
        align-items: center !important; --align-items: center !important;
        min-height: 0 !important; padding: 0 !important; overflow: hidden !important;
        gap: 0px !important; --row-gap: 0px !important; --column-gap: 0px !important; --gap: 0px !important;
    }

    /* Inner top-bar container: in flow, full width, centred.
       flex: 1 1 100% is critical — without it, flex-grow:0 shrinks to content width (367px). */
    .elementor-element-5eb96116 {
        position: relative !important;
        justify-content: center !important; --justify-content: center !important;
        padding: 10px 0 !important;
        width: 100% !important; --width: 100% !important; max-width: 100% !important;
        flex: 1 1 100% !important;
    }

    /* Shortcode widget: force FLEX (not block), centre, reset order.
       text-align:center is the fallback if display reverts to block. */
    .elementor-element-ddcd584 {
        display: flex !important;
        order: 0 !important; --order: 0 !important;
        flex: 1 1 100% !important;
        justify-content: center !important; --justify-content: center !important;
        text-align: center !important;
        width: 100% !important; height: auto !important;
        overflow: visible !important;
    }
    /* .elementor-shortcode is the DIRECT child — .elementor-widget-container does NOT exist here */
    .elementor-element-ddcd584 > .elementor-shortcode {
        display: flex !important; justify-content: center !important; width: 100% !important; gap: 10px; text-align: center !important;
    }

    /* Bring logo + hamburger in from edges — proportional to desktop (210/1280 ≈ 16%) */
    .elementor-element-c49a54f {
        padding-left: 120px !important;
        padding-right: 120px !important;
    }

    /* Kill admin-bar ghost offset */
    .elementor-element-512ec1a5.elementor-sticky--active {
        top: 0px !important;
    }
    #wpadminbar { display: none !important; }
    html { margin-top: 0 !important; }
}

@media (max-width: 768px) {
    .rtmedia-container .rtmedia-list {
        padding: 0.75rem;
    }
    .rtmedia-uploader-div .rtm-file-input,
    .rtmedia-uploader-div button {
        padding: 0.2rem 0.8rem;
        font-size: 0.9rem;
    }

    /* Centre the top bar on mobile with equal vertical padding */
    .elementor-element-5eb96116 {
        justify-content: center !important;
        padding: 10px 0 !important;
    }

    /* Centre Logout + Dashboard buttons side-by-side on mobile */
    .elementor-element-ddcd584 .elementor-shortcode {
        display: flex !important;
        flex-direction: row !important;
        justify-content: center !important;
        gap: 10px;
    }

    /* Push hamburger menu toward the right on mobile — align with content inner edge */
    .elementor-element-73da155c .elementor-menu-toggle {
        margin: 0 15px 0 auto !important;
    }

    /* Hide WP admin bar on mobile frontend — it's noise for a social site */
    #wpadminbar {
        display: none !important;
    }
    html {
        margin-top: 0 !important;
    }
}



/* Desktop header row — equal padding pushes logo and nav inward symmetrically.
   100px per side on a ~1400px container leaves ~1200px for logo + nav. */
@media (min-width: 1025px) {
    .elementor-element-c49a54f {
        padding-left: 100px !important;
        padding-right: 100px !important;
    }
}

/* Hide old BuddyPress "Profile" tab — replaced by custom widget system */
#xprofile-personal-li {
    display: none !important;
}

/* Hide "My Profile" (customise) tab from nav — accessed via header Profile button instead */
#customise-personal-li {
    display: none !important;
}

/* Uniform main nav position across tabs */
#item-body #item-nav {
    position: relative; /* Base relative */
}

.activity #item-body #item-nav {
    margin-top: 50px !important; /* Higher for activity/media */
}

.profile #item-body #item-nav,
.notifications #item-body #item-nav,
.messages #item-body #item-nav,
.friends #item-body #item-nav,
.groups #item-body #item-nav,
.settings #item-body #item-nav {
    margin-top: 15px !important; /* Lower for other tabs; adjust to match */
}

/* Remove white background on all tabs */
#item-body,
#item-body .col-inner {
    background-color: transparent !important; /* Clear background */
}    
    
/* Move main nav down on media tab */
.media #item-body #item-nav {
    margin-top: 50px !important; /* Push down; variant: 40px */
    position: relative;
}

/* Move subnav (rtmedia menu/uploader) down on media tab */
.media #subnav.item-list-tabs,
.media .rtm-media-type-list {
    margin-top: 30px !important; /* Push down; variant: 20px */
    padding-top: 10px; /* Extra space if needed */
}

/* Fix activity subnav offset for items with counts */
.activity #subnav.item-list-tabs ul li a {
    display: flex;
    align-items: center;
}





/* Blog Page */

/* Generic blog index styles */
.blog .entry-title {
    display: none !important;
}
.page-id-[blog-page-id] .site-main .entry-content > *:first-child {
    margin-top: 0; /* Clean top spacing */
}
.blog .svq-blog-intro {
        display: none !important;
}
.author-wrapper {
    display: none !important;
}
.entry-footer {
    display: none !important;
}
.nav2-post {
    display: none !important;
}
.btn-tag {
    background-color: #CC9900;
    color: #031B83 !important; /* AMENDMENT S47: D055 brand rule */
}
.btn-tag:hover {
    background-color: #FFD700 !important;
    color: #031B83 !important;
}
.meta-category {
    margin-bottom: 2.5rem !important;
}
.entry-middle {
    text-align: center;
}
.meta-category {
    text-align: center;
}



/* Blog Cards — clean card design with brand accents */

/* Base card styles — white card, subtle shadow, gold accent border */
.post-card {
    background: #FFFFFF !important;
    border-radius: 12px !important;
    box-shadow: 0 2px 8px rgba(3, 27, 131, 0.08) !important;
    padding: 0 !important;
    transition: box-shadow 0.25s ease, transform 0.25s ease !important;
    overflow: hidden !important;
    border: 1px solid rgba(3, 27, 131, 0.06) !important;
    background-image: none !important;
}

/* Subtle lift on hover — no scale to prevent mobile overflow */
.post-card:hover {
    box-shadow: 0 6px 20px rgba(3, 27, 131, 0.12) !important;
    transform: translateY(-3px) !important;
    border-color: rgba(204, 153, 0, 0.3) !important;
}

/* Text colors — navy headings, muted body */
.post-card * {
    color: #1A1A2E !important;
    font-family: "Nunito Sans", Sans-serif !important;
}
.post-card h2, .post-card h3, .post-card h4 {
    font-family: "Montserrat", Sans-serif !important;
    font-weight: 700 !important;
    color: #031B83 !important;
    line-height: 1.3 !important;
}

/* Category tag — gold pill */
.post-card .btn-tag,
.post-card .meta-category a {
    background: #CC9900 !important;
    color: #031B83 !important;
    border-radius: 9999px !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.04em !important;
    padding: 3px 12px !important;
}

/* Hero image — full width, cropped to ratio */
.aimg-card-hover img {
    border-radius: 12px 12px 0 0 !important;
    box-shadow: none !important;
    width: 100% !important;
    height: 200px !important;
    object-fit: cover !important;
}

/* Gold accent bar at top of card */
.post-card::before {
    content: '';
    display: block;
    height: 4px;
    background: linear-gradient(90deg, #CC9900 0%, #FFD700 100%);
}

/* No alternating backgrounds — consistent clean white cards */

/* Entry content — comfortable padding */
.entry-content {
    padding: 1rem 1.25rem !important;
    margin: 0 !important;
}

/* D055 brand override: Seeko theme .btn-primary gold bg must use blue text */
.btn.btn-primary,
.btn.btn-primary:hover,
.btn.btn-primary:focus {
    color: #031B83 !important;
}


/* ============================================================================
   MOBILE RESPONSIVE — 360px floor (Nothing Phone 3a)
   ============================================================================ */

@media (max-width: 768px) {
    /* Kill all scale hover effects on touch — prevents horizontal overflow */
    .post-card:hover {
        transform: translateY(-2px) !important;
    }

    .rtmedia-uploader-div button:hover,
    .rtmedia-uploader-div button.photo-limit-disabled:hover {
        transform: none !important;
    }

    .rtmedia-item-thumbnail img:hover {
        transform: none !important;
    }

    /* Blog cards — full bleed on mobile */
    .post-card {
        border-radius: 10px !important; /* intentional: mobile-only smaller radius (base is 12px per STYLING_GUIDE) — Phase 2a S65 */
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    .aimg-card-hover img {
        height: 160px !important;
        border-radius: 10px 10px 0 0 !important; /* intentional: mobile-only radius matches parent .post-card 10px (base 12px 12px 0 0) — Phase 2a S65 */
    }

    .entry-content {
        padding: 0.75rem 1rem !important;
    }

    /* Pricing cards — single column, no overflow */
    .pricing-card {
        margin-left: 0 !important;
        margin-right: 0 !important;
        max-width: 100% !important;
    }

    /* Prevent any element from exceeding viewport */
    body {
        overflow-x: hidden !important;
    }

    /* Ensure images never exceed container */
    img {
        max-width: 100%;
        height: auto;
    }
}

/* Extra small — 360px floor */
@media (max-width: 400px) {
    /* S58 2026-04-14: LOGOUT + DASHBOARD shrink together so they stay identical */
    .header-login-btn,
    .header-logout-btn,
    .header-login-btn.logged-in {
        font-size: 0.75rem !important;
        padding: 0.25rem 0.7rem !important;
        min-width: 0 !important;
    }

    .post-card h2, .post-card h3, .post-card h4 {
        font-size: 1.1rem !important;
    }
}

/* REMOVED: T230 mobile hamburger menu dropdown flattening (sub-arrow hiding,
   sub-menu inline, sub-item centering, text-indent compensation).
   Venues/Organisers are now top-level menu items — no dropdown sub-menus exist.
   Previously verified dropdown centering revoked as unnecessary. */