/*
Theme Name: The Strength Co. Gyms
Theme URI: https://thestrengthco.com
Author: The Strength Co.
Author URI: https://thestrengthco.com
Description: Custom block theme for The Strength Co., a Starting Strength affiliate gym in Costa Mesa, CA.
Version: 1.0.10
Requires at least: 6.0
Tested up to: 6.7
Requires PHP: 8.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: tsc_gyms
Tags: full-site-editing, block-patterns, block-styles
*/

@font-face {
    font-family: 'Trim Poster';
    src: url('./assets/fonts/TrimPoster-Lean.otf') format('opentype');
    font-weight: 600;
    font-style: italic;
    font-display: swap;
}
@font-face {
    font-family: 'Trim';
    src: url('./assets/fonts/Trim-Regular.woff2') format('woff2');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Trim';
    src: url('./assets/fonts/Trim-SemiBold.woff2') format('woff2');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

/* Remove gap between header and main content */
.wp-site-blocks {
    gap: 0 !important;
}
.wp-site-blocks > main {
    margin-block-start: 0;
}
.wp-site-blocks > main > .wp-block-group {
    margin-top: 0;
    margin-bottom: 0;
}
.wp-site-blocks > main > .wp-block-group > .wp-block-post-content {
    display: contents;
}

/* Equal height cards in columns */
.wp-block-columns > .wp-block-column {
    display: flex;
    flex-direction: column;
}
.wp-block-columns > .wp-block-column > .wp-block-group {
    flex: 1;
    display: flex;
    flex-direction: column;
}

/* Remove gaps between adjacent full-width sections */
.wp-block-group.alignfull + .wp-block-group.alignfull,
.wp-block-group.alignfull + .wp-block-cover.alignfull,
.wp-block-cover.alignfull + .wp-block-group.alignfull,
.wp-block-columns.alignfull + .wp-block-group.alignfull {
    margin-top: 0;
}

/* Header logo link: white, no underline, non-italic */
header .wp-block-heading a,
header .wp-block-heading a:visited,
header .wp-block-heading a:hover {
    color: #FFFFFF !important;
    text-decoration: none !important;
}
header .wp-block-heading {
    font-style: normal !important;
}

/* Align header buttons with navigation */
header .wp-block-buttons,
header .wp-block-button {
    margin: 0;
}

/* =============================
   HERO SPLIT LAYOUT
   ============================= */
.tsc-hero-split {
    min-height: 90vh;
    gap: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    border-bottom: 4px solid var(--wp--preset--color--accent);
}
.tsc-hero-split > .wp-block-column.tsc-hero-content {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 60px 80px !important;
}
.tsc-hero-split > .wp-block-column.tsc-hero-image {
    padding: 0 !important;
    overflow: hidden;
}
.tsc-hero-split .tsc-hero-image .wp-block-image {
    height: 100%;
    margin: 0;
}
.tsc-hero-split .tsc-hero-image .wp-block-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
@media (max-width: 781px) {
    .tsc-hero-split {
        min-height: auto;
    }
    .tsc-hero-split > .wp-block-column.tsc-hero-content {
        padding: 40px 24px !important;
    }
    .tsc-hero-split .tsc-hero-image .wp-block-image img {
        height: 300px;
    }
}

/* =============================
   TRUST BAR WITH ICONS
   ============================= */
.tsc-trust-item {
    display: flex;
    align-items: center;
    gap: 12px;
}
.tsc-trust-icon {
    width: 48px;
    height: 48px;
    flex-shrink: 0;
}
.tsc-trust-icon svg {
    width: 100%;
    height: 100%;
}

/* =============================
   GALLERY MOSAIC
   ============================= */
.tsc-gallery-mosaic {
    display: grid;
    grid-template-columns: 3fr 2fr 1fr;
    grid-template-rows: 290px 290px;
    gap: 4px;
    width: 100vw;
    margin-left: calc(-50vw + 50%);
}
.tsc-gallery-mosaic img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.tsc-gallery-mosaic img:nth-child(1) {
    grid-column: 1 / 2;
    grid-row: 1 / 3;
}
.tsc-gallery-mosaic img:nth-child(4) {
    grid-column: 2 / 4;
}
@media (max-width: 781px) {
    .tsc-gallery-mosaic {
        grid-template-columns: 1fr 1fr;
        grid-template-rows: auto;
    }
    .tsc-gallery-mosaic img {
        height: 200px;
    }
    .tsc-gallery-mosaic img:nth-child(1) {
        grid-column: 1 / 3;
        grid-row: auto;
    }
    .tsc-gallery-mosaic img:nth-child(4) {
        grid-column: auto;
    }
}

/* Simple gallery (for pages that use the flat grid) */
.tsc-gallery {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
    width: 100vw;
    margin-left: calc(-50vw + 50%);
}
.tsc-gallery img {
    width: 100%;
    aspect-ratio: 1;
    object-fit: cover;
    display: block;
}
@media (max-width: 781px) {
    .tsc-gallery {
        grid-template-columns: repeat(3, 1fr);
        gap: 4px;
    }
}

/* =============================
   STAR RATING
   ============================= */
.tsc-stars {
    color: var(--wp--preset--color--star-yellow);
    font-size: 20px;
    letter-spacing: 3px;
}

/* =============================
   TESTIMONIAL CARDS (white on dark)
   ============================= */
.tsc-testimonial-card {
    background: #FFFFFF !important;
    padding: 32px !important;
    border-top: 3px solid var(--wp--preset--color--accent);
}
.tsc-testimonial-card .tsc-stars {
    margin-bottom: 8px;
    color: var(--wp--preset--color--star-yellow) !important;
}
.tsc-testimonial-card p {
    color: var(--wp--preset--color--text-dark);
}
.tsc-testimonial-card .tsc-review-name {
    font-family: var(--wp--preset--font-family--heading);
    font-size: 18px;
    text-transform: uppercase;
    color: var(--wp--preset--color--text-dark);
    margin-top: 16px;
}

/* =============================
   FAQ / DETAILS BLOCKS
   ============================= */
.wp-block-details {
    border-bottom: 1px solid var(--wp--preset--color--light-gray);
    padding: 1rem 0;
}
.wp-block-details summary {
    font-family: var(--wp--preset--font-family--body);
    font-weight: 700;
    font-size: var(--wp--preset--font-size--large);
    cursor: pointer;
    list-style: none;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.wp-block-details summary::after {
    content: "+";
    font-size: 24px;
    font-weight: 400;
    transition: transform 0.3s ease;
}
.wp-block-details[open] summary::after {
    content: "\2212";
}

/* =============================
   OUTLINE BUTTON
   ============================= */
.is-style-outline .wp-block-button__link {
    border: 2px solid currentColor;
    background: transparent;
}
.is-style-outline .wp-block-button__link:hover {
    background: var(--wp--preset--color--white);
    color: var(--wp--preset--color--primary);
}

/* =============================
   CTA YELLOW SECTION
   ============================= */
.tsc-cta-yellow {
    position: relative;
    overflow: hidden;
}
.tsc-cta-yellow .tsc-cta-bg {
    position: absolute;
    inset: 0;
    z-index: 0;
}
.tsc-cta-yellow .tsc-cta-bg img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: 0.2;
}
.tsc-cta-yellow .tsc-cta-content {
    position: relative;
    z-index: 1;
}

/* =============================
   RESPONSIVE
   ============================= */
@media (max-width: 781px) {
    .wp-block-columns {
        flex-wrap: wrap;
    }
    .wp-block-columns > .wp-block-column {
        flex-basis: 100% !important;
    }
}

/* =============================
   PRICING
   ============================= */
.tsc-pricing-highlight {
    border: 3px solid var(--wp--preset--color--accent);
    position: relative;
}
.wp-block-group.is-layout-flex > .wp-block-buttons {
    align-self: stretch;
}
.tsc-pricing-cards > .wp-block-column {
    display: flex !important;
    flex-direction: column !important;
}
.tsc-pricing-cards > .wp-block-column > .wp-block-group {
    flex: 1 !important;
    display: flex !important;
    flex-direction: column !important;
    border-radius: 8px;
    background-color: #ECECEC !important;
}
.tsc-pricing-cards .wp-block-buttons {
    margin-top: auto;
    flex-grow: 0 !important;
    padding-top: var(--wp--preset--spacing--40);
}
.tsc-pricing-cards .wp-block-button__link {
    white-space: nowrap;
}
.tsc-pricing-tiers {
    margin-top: 8px;
}
.tsc-pricing-tier {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 6px 0;
    font-size: 15px;
}
.tsc-pricing-tier span:last-child {
    font-weight: 700;
    white-space: nowrap;
    padding-left: 12px;
}
/* Cover block minimum heights */
.wp-block-cover.tsc-hero {
    min-height: 500px;
}
@media (max-width: 781px) {
    .wp-block-cover.tsc-hero {
        min-height: 400px;
    }
}

/* Coach cards */
.tsc-coach-card img {
    width: 100%;
    height: 350px;
    object-fit: cover;
}
.tsc-coach-card .wp-block-image {
    margin-bottom: 16px;
}

/* =============================
   FOOTER
   ============================= */
footer ul,
footer .wp-block-list {
    list-style: none;
    padding-left: 0 !important;
}
footer .wp-block-heading {
    font-style: normal !important;
}
footer a,
footer a:visited {
    color: #FFFFFF !important;
    text-decoration: none;
}
footer a:hover {
    color: var(--wp--preset--color--accent) !important;
}
footer .wp-block-social-links .wp-social-link {
    background: transparent !important;
}
footer .wp-block-social-links .wp-social-link svg {
    fill: #FFFFFF;
}

/* Links on light backgrounds: dark text, yellow hover */
.has-white-background-color a:not(.wp-block-button__link),
.has-light-gray-background-color a:not(.wp-block-button__link) {
    color: var(--wp--preset--color--primary) !important;
    text-decoration: underline;
}
.has-white-background-color a:not(.wp-block-button__link):hover,
.has-light-gray-background-color a:not(.wp-block-button__link):hover {
    color: var(--wp--preset--color--accent) !important;
}

/* Black button variant */
.wp-block-button.tsc-btn-black .wp-block-button__link {
    background-color: var(--wp--preset--color--primary) !important;
    color: var(--wp--preset--color--white) !important;
}
.wp-block-button.tsc-btn-black .wp-block-button__link:hover {
    background-color: #1a1a1a !important;
}

/* =============================
   CONTACT FORM (WPForms)
   ============================= */
.wpforms-container.wpforms-render-modern {
    flex: 1;
    width: 100%;
    --wpforms-field-background-color: #FFFFFF;
    --wpforms-field-border-style: solid;
    --wpforms-field-border-size: 1px;
    --wpforms-field-border-color: #CBCBCB;
    --wpforms-field-border-radius: 0px;
    --wpforms-field-text-color: #2B2B2B;
    --wpforms-field-size-input-height: 50px;
    --wpforms-field-size-input-spacing: 16px;
    --wpforms-label-color: #2B2B2B;
    --wpforms-button-background-color: #E8D44D;
    --wpforms-button-text-color: #2B2B2B;
    --wpforms-button-border-radius: 0px;
    --wpforms-button-border-style: none;
    --wpforms-container-padding: 0px;
    --wpforms-container-border-style: none;
    --wpforms-container-shadow-size-box-shadow: none;
}
.wpforms-container .wpforms-field-label {
    font-weight: 700;
    text-transform: uppercase;
    font-size: 18px;
    font-family: var(--wp--preset--font-family--body);
}
div.wpforms-container-full input[type=text],
div.wpforms-container-full input[type=email],
div.wpforms-container-full input[type=tel],
div.wpforms-container-full textarea {
    font-family: var(--wp--preset--font-family--body);
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box;
}
div.wpforms-container-full .wpforms-submit-container .wpforms-submit {
    font-family: var(--wp--preset--font-family--body);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    padding: 14px 32px !important;
    cursor: pointer;
}

/* =============================
   REDUCE SPACING: CONSECUTIVE SECTIONS
   ============================= */
.wp-block-group.alignfull.has-white-background-color + .wp-block-group.alignfull.has-white-background-color {
    padding-top: 0 !important;
}
.wp-block-group.alignfull.has-light-gray-background-color + .wp-block-group.alignfull.has-light-gray-background-color {
    padding-top: 0 !important;
}