/* =====================================================================
   SDFM — Sitewide CSS
   Minimal, cleaned version with only required fixes.
   ===================================================================== */

/* Basic body font */
body {
    font-family: Arial, sans-serif;
}

/* =====================================================================
   HEADER2 — Slimmer dropdown menu
   These override Bootstrap + theme padding.
   ===================================================================== */

/* Top-level dropdown items */
nav#primary-nav ul.dropdown-menu > li > a {
    padding: 4px 10px !important;
    line-height: 1.1 !important;
    font-size: 13px !important;
    height: auto !important;
    display: block;
    white-space: nowrap;
}

/* Remove Bootstrap top/bottom padding from dropdown container */
nav#primary-nav ul.dropdown-menu {
    padding-top: 2px !important;
    padding-bottom: 2px !important;
}

/* Sub-menu items */
nav#primary-nav ul.sub-menu > li > a {
    padding: 4px 10px !important;
    line-height: 1.1 !important;
    font-size: 13px !important;
    height: auto !important;
}
nav#primary-nav ul.sub-menu {
    padding-top: 2px !important;
    padding-bottom: 2px !important;
}

/* Remove padding added by Bootstrap on <li> inside dropdown */
nav#primary-nav ul.dropdown-menu > li {
    padding: 0 !important;
}

/* Nested sub-menus (About Us → Committee etc) */
nav#primary-nav ul.dropdown.menu li.dropdown ul.dropdown-menu > li > a {
    padding: 4px 8px !important;
    font-size: 13px !important;
    line-height: 1.1 !important;
    height: auto !important;
}

/* =====================================================================
   Membership Page Banner (register/login etc)
   Overrides hero-slider.css and style.css which set 400–700px height.
   ===================================================================== */

section.banner.banner-secondary#top {
    height: 260px !important;
    min-height: 260px !important;
    padding: 40px 0 !important;
    background-size: cover !important;
    background-position: center !important;
}
/* Force shrink banner caption on membership pages */
section.banner.banner-secondary#top .banner-caption {
    padding: 40px 0 !important;
    min-height: 0 !important;
}
/* FINAL OVERRIDE — Fix Membership Banner Height */
section.banner.banner-secondary#top .banner-caption {
    padding: 40px 0 !important;  /* adjust height */
}

section.banner.banner-secondary#top {
    height: 260px !important;
    min-height: 260px !important;
    padding: 0 !important;
    background-size: cover !important;
    background-position: center !important;
}
/* FINAL FIX — force height override on membership banners */
body section.banner.banner-secondary#top {
    height: 260px !important;
    min-height: 260px !important;
    padding: 0 !important;
    background-size: cover !important;
    background-position: center !important;
}

body section.banner.banner-secondary#top .banner-caption {
    padding: 20px 0 !important;
    margin: 0 !important;
    height: auto !important;
}
/* FINAL OVERRIDE – shrink Membership Page banner */
body section.banner.banner-secondary#top {
    height: 260px !important;
    min-height: 260px !important;
    padding-top: 40px !important;
    padding-bottom: 40px !important;
    background-size: cover !important;
    background-position: center !important;
}

body section.banner.banner-secondary#top .banner-caption {
    padding-top: 10px !important;
    padding-bottom: 10px !important;
}

/* Remove borders/frame/shadow but KEEP TinyMCE width/height */
.cms-content iframe,
.cms-content video {
    border: none !important;
    background: transparent !important;
    box-shadow: none !important;

    padding: 0 !important;
    margin: 0 0 20px 0 !important;
    display: block !important;

    /* DO NOT override width/height */
    width: auto !important;
    height: auto !important;
}

/* Remove wrapper styling around iframe/video */
.cms-content p:has(iframe),
.cms-content p:has(video) {
    padding: 0 !important;
    margin: 0 !important;
    border: none !important;
    background: none !important;
}
/* FORCE TinyMCE iframe size and override PHPJabbers video box */
.cms-content iframe {
    height: auto !important;     /* Stop theme forcing 150px */
    width: auto !important;      /* Keep TinyMCE width, not container width */
    max-width: 100% !important;  /* Allow it to scale down if needed */
    max-height: none !important; /* No forced shrink */
}

/* Remove wrapper constraints */
.cms-content p {
    width: auto !important;
    height: auto !important;
}
/* -------- Fix Vimeo forced tiny size -------- */
.cms-content .player,
.cms-content .vp-video-wrapper,
.cms-content .vp-video {
    position: static !important;
    width: auto !important;
    height: auto !important;
    max-width: 100% !important;
}

/* Vimeo sets video to 100% height of wrapper — override that */
.cms-content .player video,
.cms-content .player iframe {
    width: 100% !important;    /* scale to container */
    height: auto !important;   /* keep aspect ratio */
}

/* Remove absolute positioning that collapses height */
.cms-content .vp-video-wrapper {
    position: relative !important;
}
/* Force all Vimeo iframes inside CMS to behave responsively */
.cms-content iframe[src*="vimeo.com"] {
    width: 100% !important;
    max-width: 100% !important;
    aspect-ratio: 16 / 9 !important; /* Or 4/3 if needed */
    height: auto !important; /* Let aspect-ratio control height */
    display: block !important;
    border: none !important;
    padding: 0 !important;
    margin: 20px 0 !important;
}

/* Remove wrapper <p> issues */
.cms-content p:has(iframe) {
    padding: 0 !important;
    margin: 0 !important;
}