/*
 * Small additions for the Statamic build (the original styles are in divi.css).
 */

/* Background photos chosen in the Control Panel (sections, rows, columns, banners). */
:where([style*="--bgi"]) {
    background-image: var(--bgi);
    background-size: cover;
    background-position: center;
}

/* "Hide on" design setting. */
@media (min-width: 981px) { .hide-desktop { display: none !important; } }
@media (min-width: 768px) and (max-width: 980px) { .hide-tablet { display: none !important; } }
@media (max-width: 767px) { .hide-phone { display: none !important; } }

/* Background videos fill their section (Divi sized these with its media player script). */
.et_pb_section_video_bg video {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Clickable modules. */
.et_clickable { cursor: pointer; }

/* FitVids (Divi injected these rules with its script). */
.fluid-width-video-wrapper { width: 100%; position: relative; padding: 0; }
.fluid-width-video-wrapper iframe, .fluid-width-video-wrapper object, .fluid-width-video-wrapper embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

/* Text that sat directly in a module on the original site (no paragraph around it). */
div.wp-bare { padding: 0; margin: 0; }

/* Buttons added in the Control Panel (no migrated design): the site's standard green button. */
body #page-container .et_pb_section .et_pb_button.gcpe-btn {
    color: #fff !important;
    background-color: #00A94C !important;
    border: 2px solid #00A94C !important;
    border-radius: 7px;
    font-size: 20px;
    font-weight: 500;
    line-height: 34px !important;
    padding: 6px 20px !important;
}
body #page-container .et_pb_section .et_pb_button.gcpe-btn:after { display: none; }

/* The original site's custom CSS pushed the mobile menu 325px right at 375px and below (iPhone mini),
   so the burger and phone button sat off screen. Only the mobile header is shown at that width. */
@media (max-width: 375px) {
    .mobile-main-header #et-top-navigation { padding-left: 0 !important; }
}