/* ═══════════════════════════════════════════════
   wp-fixes.css
   WordPress-only additions.
   The static site CSS is untouched.
   This file handles ONLY WP-specific behaviour.
═══════════════════════════════════════════════ */

/* ── 1. Admin bar offset (desktop 32px, mobile 46px) ── */
.admin-bar .sidebar {
    top: 32px !important;
    height: calc(100vh - 32px) !important;
}
.admin-bar .main-content {
    height: calc(100vh - 32px) !important;
    margin-top: 32px !important;
}
.admin-bar .detail-main {
    height: calc(100vh - 32px) !important;
}
.admin-bar .menu-toggle {
    top: 50px !important;
}
@media screen and (max-width: 782px) {
    .admin-bar .sidebar {
        top: 46px !important;
        height: calc(100vh - 46px) !important;
    }
    .admin-bar .main-content {
        height: calc(100vh - 46px) !important;
        margin-top: 46px !important;
    }
    .admin-bar .detail-main {
        height: calc(100vh - 46px) !important;
    }
    .admin-bar .menu-toggle {
        top: 64px !important;
    }
}

/* ── 2. Bootstrap link underline override ── */
a,
a:hover,
a:focus,
a:visited {
    text-decoration: none;
}

/* ── 3. Sidebar nav — no underline ── */
.sidebar-nav a,
.sidebar-nav a:hover,
.sidebar-nav a:focus {
    text-decoration: none !important;
}

/* ── 4. Footer links — no underline ── */
.footer-list a,
.footer-list a:hover {
    text-decoration: none !important;
    color: rgba(255,255,255,0.78);
}

/* ── 5. WP body class — homepage SPA scroll ── */
body.home {
    overflow: hidden !important;
    height: 100vh !important;
}

/* ── 6. WhatsApp float button ── */
.whatsapp-float {
    position: fixed;
    bottom: 2rem;
    right: 2rem;
    z-index: 9999;
    width: 52px;
    height: 52px;
    background: #25d366;
    color: #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.6rem;
    box-shadow: 0 4px 16px rgba(0,0,0,0.18);
    transition: transform 0.2s ease;
    text-decoration: none;
}
.whatsapp-float:hover {
    background: #1ebe5d;
    color: #fff;
    transform: scale(1.08);
}

/* ── 7. Photo card grid column modifiers ── */
.photo-card-grid {
    display: grid;
    gap: 1rem;
}
.photo-card-grid--2col { grid-template-columns: repeat(2, 1fr); }
.photo-card-grid--3col { grid-template-columns: repeat(3, 1fr); }
.photo-card-grid--4col { grid-template-columns: repeat(4, 1fr); }
@media (max-width: 768px) {
    .photo-card-grid--3col,
    .photo-card-grid--4col { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 480px) {
    .photo-card-grid--2col,
    .photo-card-grid--3col,
    .photo-card-grid--4col { grid-template-columns: 1fr; }
}

/* ── 8. Video embed wrapper ── */
.video-embed-wrap {
    position: relative;
    padding-bottom: 56.25%;
    border-radius: var(--radius);
    overflow: hidden;
    background: #000;
}
.video-embed-wrap iframe {
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 100%;
    border: none;
}

/* ── 9. Page split content white background ── */
.page-split-main {
    background: var(--white);
}

/* ── 10. Sidebar region — prevent wrapping ── */
.sidebar-region {
    white-space: nowrap;
}

/* ── 11. text-white-bold utility ── */
.text-white-bold {
    color: #fff;
    font-weight: 700;
}

/* ── 12. footer-role inline text ── */
.footer-role {
    font-size: 0.75rem;
    color: rgba(255,255,255,0.5);
    font-weight: 400;
}

/* ═══════════════════════════════════════════════
   GUTENBERG BLOCK STYLES
═══════════════════════════════════════════════ */

/* ── Image block ── */
.article-body .wp-block-image {
    margin: 2rem 0;
}
.article-body .wp-block-image img {
    width: 100%;
    height: auto;
    border-radius: var(--radius);
    display: block;
}
.article-body .wp-block-image figcaption {
    font-size: 0.8rem;
    color: var(--text-muted);
    text-align: center;
    margin-top: 0.5rem;
}

/* ── Gallery block ── */
.article-body .wp-block-gallery {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr);
    gap: 1rem;
    margin: 2rem 0;
}
.article-body .wp-block-gallery .wp-block-image {
    margin: 0;
    overflow: hidden;
    border-radius: var(--radius);
    position: relative;
    cursor: zoom-in;
}
.article-body .wp-block-gallery .wp-block-image img {
    width: 100%;
    height: 220px;
    object-fit: cover;
    border-radius: var(--radius);
    transition: transform 0.35s ease;
}
.article-body .wp-block-gallery .wp-block-image:hover img {
    transform: scale(1.04);
}
.article-body .wp-block-gallery figcaption {
    position: absolute;
    bottom: 0;
    left: 0; right: 0;
    background: rgba(0,0,0,0.55);
    color: #fff;
    font-size: 0.78rem;
    padding: 0.4rem 0.6rem;
    border-radius: 0 0 var(--radius) var(--radius);
}
.article-body .wp-block-gallery:has(> :nth-child(3)) {
    grid-template-columns: repeat(3, 1fr);
}
@media (max-width: 768px) {
    .article-body .wp-block-gallery,
    .article-body .wp-block-gallery:has(> :nth-child(3)) {
        grid-template-columns: repeat(2, 1fr);
    }
}
@media (max-width: 480px) {
    .article-body .wp-block-gallery,
    .article-body .wp-block-gallery:has(> :nth-child(3)) {
        grid-template-columns: 1fr;
    }
}

/* ── Embed / Video block ── */
.article-body .wp-block-embed {
    margin: 2rem 0;
}
.article-body .wp-block-embed__wrapper {
    position: relative;
    padding-bottom: 56.25%;
    height: 0;
    overflow: hidden;
    border-radius: var(--radius);
    background: #000;
}
.article-body .wp-block-embed__wrapper iframe {
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 100%;
    border: none;
}
.article-body .wp-block-embed figcaption {
    font-size: 0.8rem;
    color: var(--text-muted);
    text-align: center;
    margin-top: 0.5rem;
}

/* ── Quote block ── */
.article-body .wp-block-quote {
    border-left: 4px solid var(--accent);
    padding: 0.75rem 1.25rem;
    margin: 2rem 0;
    color: #4a5a6b;
    font-style: italic;
    background: rgba(0,0,0,0.025);
    border-radius: 0 4px 4px 0;
}
.article-body .wp-block-quote p { margin: 0; }
.article-body .wp-block-quote cite {
    font-size: 0.85rem;
    color: var(--text-muted);
    font-style: normal;
    display: block;
    margin-top: 0.5rem;
}

/* ── Table block ── */
.article-body .wp-block-table {
    margin: 1.5rem 0;
    overflow-x: auto;
}
.article-body .wp-block-table table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9rem;
}
.article-body .wp-block-table th {
    background: var(--navy);
    color: #fff;
    padding: 0.6rem 1rem;
    text-align: left;
    font-weight: 600;
    font-size: 0.8rem;
    letter-spacing: 0.03em;
    text-transform: uppercase;
}
.article-body .wp-block-table td {
    padding: 0.6rem 1rem;
    border-bottom: 1px solid var(--border-solid);
    color: var(--text-body);
}
.article-body .wp-block-table tr:last-child td {
    font-weight: 700;
    border-bottom: 2px solid var(--navy);
}

/* ── Heading blocks ── */
.article-body .wp-block-heading {
    margin-top: 2rem;
    margin-bottom: 0.75rem;
}

/* ── Separator ── */
.article-body .wp-block-separator {
    border: none;
    border-top: 2px solid var(--accent);
    width: 48px;
    margin: 2rem 0;
}

/* ── Gutenberg content width override ── */
.article-body .wp-block-group,
.article-body .wp-block-paragraph,
.article-body .wp-block-heading,
.article-body .wp-block-list,
.article-body .wp-block-quote,
.article-body .wp-block-table,
.article-body .wp-block-image,
.article-body .wp-block-gallery,
.article-body .wp-block-embed,
.article-body .wp-block-separator,
.article-body > * {
    max-width: 100% !important;
    box-sizing: border-box;
}

.page-split-content .pp-stats {
    grid-template-columns: repeat(auto-fit, minmax(100px, 1fr)) !important;
    width: 100% !important;
}

.article-body.mt-4 { margin-top: 1.5rem; }

.article-body h2,
.article-body .wp-block-heading h2 {
    font-family: var(--font-serif);
    font-size: 1.5rem;
    font-weight: 900;
    color: var(--primary);
    margin: 2rem 0 0.75rem;
}
.article-body h3,
.article-body .wp-block-heading h3 {
    font-family: var(--font-serif);
    font-size: 1.25rem;
    font-weight: 900;
    color: var(--primary);
    margin: 2rem 0 0.75rem;
}
.article-body h4,
.article-body .wp-block-heading h4 {
    font-family: var(--font-serif);
    font-size: 1.1rem;
    font-weight: 900;
    color: var(--primary);
    margin: 2rem 0 0.75rem;
}

/* ── Media & Text block ── */
.article-body .wp-block-media-text {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
    align-items: start;
    background: var(--white);
    border: 1px solid var(--border-solid);
    border-radius: var(--radius);
    box-shadow: var(--shadow-sm);
    padding: 1.5rem;
    margin: 1.5rem 0;
}
.article-body .wp-block-media-text.has-media-on-the-right {
    grid-template-columns: 1fr 1fr;
}
.article-body .wp-block-media-text__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: var(--radius-sm);
    display: block;
}
.article-body .wp-block-media-text__content { padding: 0.5rem; }
.article-body .wp-block-media-text__content p {
    font-size: 1rem !important;
    line-height: 1.85 !important;
    color: var(--body-text) !important;
}
@media (max-width: 768px) {
    .article-body .wp-block-media-text {
        grid-template-columns: 1fr !important;
    }
    .article-body .wp-block-media-text.has-media-on-the-right .wp-block-media-text__media {
        order: -1;
    }
}

/* ── Full width fix ── */
.article-body .wp-block,
.article-body .wp-block-classic,
.article-body .wp-block-freeform,
.article-body figure,
.article-body p,
.article-body h1,
.article-body h2,
.article-body h3,
.article-body h4,
.article-body h5,
.article-body ul,
.article-body ol,
.article-body table,
.article-body blockquote {
    max-width: 100% !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

.article-body {
    --wp--style--global--content-size: 100% !important;
    --wp--style--global--wide-size: 100% !important;
    width: 100% !important;
    max-width: 100% !important;
}

.wp-block-freeform.block-library-rich-text__tinymce,
.article-body .block-library-classic,
.wp-block-freeform {
    max-width: 100% !important;
    width: 100% !important;
}

.article-body .wp-block-freeform,
.article-body .mce-content-body,
.article-body > div,
.article-body > p,
.article-body > h1,
.article-body > h2,
.article-body > h3,
.article-body > h4,
.article-body > ul,
.article-body > ol,
.article-body > blockquote,
.article-body > table,
.article-body > figure {
    max-width: 100% !important;
    width: 100% !important;
}

/* ── Program band spacing fixes ── */
.program-band-head p.section-label,
.program-band-head .section-label { margin-bottom: 0.35rem !important; }
.program-band-head h3,
.program-band-head h4 { margin-top: 0 !important; }

.program-band p.section-label,
.program-intro-card p.section-label,
.program-mini-card p.section-label,
.program-table-card p.section-label,
.program-cta-card p.section-label {
    margin-bottom: 0.35rem !important;
    margin-top: 0 !important;
}

.article-body .program-band > p:first-child,
.article-body .program-intro-card > p:first-child { margin-top: 0 !important; }

.article-body .program-stack > p:empty,
.article-body .program-band > p:empty,
.article-body .program-card-grid > p:empty,
.article-body .program-timeline-grid > p:empty {
    display: none !important;
    margin: 0 !important;
}

/* ── Pull-quote ── */
.article-body .pull-quote {
    max-width: 100% !important;
    width: 100% !important;
    box-sizing: border-box !important;
    display: block !important;
}

/* ── Data table ── */
.article-body .data-table-wrap {
    width: 100% !important;
    overflow-x: auto;
    margin: 1.5rem 0;
}
.article-body .data-table {
    width: 100% !important;
    border-collapse: collapse;
    font-size: 0.9rem;
}
.article-body .data-table th {
    background: var(--navy);
    color: #fff;
    padding: 0.6rem 1rem;
    text-align: left;
    font-size: 0.8rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}
.article-body .data-table td {
    padding: 0.55rem 1rem;
    border-bottom: 1px solid var(--border-solid);
    color: var(--text-body);
}
.article-body .data-table .td-bold-primary { font-weight: 700; color: var(--primary); }
.article-body .data-table .td-center { text-align: center; }
.article-body .data-table tbody tr:last-child td { border-bottom: none; }

/* ── Fix Section Media video height ── */
.video-embed-wrap {
    position: relative !important;
    width: 100% !important;
    padding-bottom: 56.25% !important;
    height: 0 !important;
    overflow: hidden !important;
    border-radius: var(--radius) !important;
    background: #000 !important;
}
.video-embed-wrap iframe {
    position: absolute !important;
    top: 0 !important; left: 0 !important;
    width: 100% !important; height: 100% !important;
    border: none !important;
}
.video-embed-wrap > * {
    position: absolute !important;
    top: 0 !important; left: 0 !important;
    width: 100% !important; height: 100% !important;
}

/* ── Article body spacing ── */
.article-body h2,
.article-body h3,
.article-body h4 {
    margin-top: 1.75rem !important;
    margin-bottom: 0.5rem !important;
}
.article-body p + h2,
.article-body p + h3,
.article-body p + h4 { margin-top: 1.5rem !important; }
.article-body p { margin-bottom: 1rem !important; }
.article-body ul,
.article-body ol {
    margin-bottom: 1rem !important;
    padding-left: 1.5rem !important;
}

/* Section media container */
.article-section-media { margin: 2rem 0; }

/* ── data-table additional styles ── */
.article-body .data-table .th-primary td { background: rgba(0, 48, 87, 0.04); }
.article-body .data-table .td-center,
.article-body .data-table .td-center-highlight,
.article-body .data-table .td-center-bold { text-align: center !important; }
.article-body .data-table .td-center-highlight { font-weight: 900; color: var(--accent); font-size: 1rem; }
.article-body .data-table .td-center-bold { font-weight: 700; color: var(--primary); }
.article-body .data-table .td-bold,
.article-body .data-table .td-bold-primary { font-weight: 700; }
.article-body .data-table .td-bold-primary { color: var(--primary); }
.article-body .data-table .td-muted { color: var(--text-muted); font-size: 0.85rem; }
.article-body .data-table .td-left { text-align: left; }

/* ── list-spaced ── */
.article-body ul.list-spaced { line-height: 2.2; padding-left: 1.5rem; }
.article-body ul.list-spaced li { margin-bottom: 0.25rem; }

/* ── program-split-card ── */
.article-body .program-split-card {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 1.5rem !important;
}
@media (max-width: 768px) {
    .article-body .program-split-card { grid-template-columns: 1fr !important; }
}


/* ══════════════════════════════════════════
   CF7 CONTACT FORM — mirrors original hardcoded form
══════════════════════════════════════════ */

/* CF7 wrapper */
.wpcf7 { width: 100%; }
.wpcf7 .wpcf7-form p { margin: 0; }
.wpcf7 br { display: none; }

/* Custom grid */
.hsft-form-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}
.hsft-form-full { grid-column: 1 / -1; }

/* Each group = label + input stacked */
.hsft-form-group {
    display: flex;
    flex-direction: column;
}

/* CF7 control-wrap span — block, zero margin */
.hsft-form-group span.wpcf7-form-control-wrap {
    display: block;
    margin: 0;
    padding: 0;
}

/* Inputs — matches .form-control-custom exactly */
.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 input[type="tel"],
.wpcf7 textarea {
    width: 100%;
    padding: 0.75rem 1rem;
    border-radius: var(--radius-sm);
    border: 1px solid var(--border-solid);
    background: #fafafa;
    font-size: 0.9rem;
    font-family: var(--font-main);
    color: var(--dark-text);
    transition: border-color 0.2s, box-shadow 0.2s;
    outline: none;
    resize: vertical;
    box-sizing: border-box;
}
.wpcf7 input[type="text"]:focus,
.wpcf7 input[type="email"]:focus,
.wpcf7 input[type="tel"]:focus,
.wpcf7 textarea:focus {
    border-color: var(--accent);
    box-shadow: 0 0 0 3px rgba(230, 126, 34, 0.12);
    background: var(--white);
}
.wpcf7 input::placeholder,
.wpcf7 textarea::placeholder { color: var(--muted); }

/* Textarea height — matches rows="5" */
.wpcf7 textarea {
    min-height: 80px;
    height: 120px;
}

/* Submit button — matches .btn-submit exactly */
.wpcf7 input[type="submit"] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 0.85rem 1.75rem;
    border-radius: var(--radius-sm);
    border: none;
    background: var(--accent);
    color: var(--white);
    font-family: var(--font-main);
    font-size: 0.88rem;
    font-weight: 700;
    letter-spacing: 0.5px;
    cursor: pointer;
    transition: var(--transition);
    box-shadow: 0 6px 20px rgba(230, 126, 34, 0.28);
}
.wpcf7 input[type="submit"]:hover {
    background: var(--accent-hover);
    transform: translateY(-2px);
    box-shadow: 0 10px 28px rgba(230, 126, 34, 0.4);
}

/* Loading state — inline spinner inside button */
.wpcf7 .wpcf7-spinner { display: none !important; }
.wpcf7.submitting input[type="submit"] {
    opacity: 0.75;
    cursor: not-allowed;
    pointer-events: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='10' fill='none' stroke='white' stroke-width='3' stroke-dasharray='31.4' stroke-dashoffset='10'%3E%3CanimateTransform attributeName='transform' type='rotate' from='0 12 12' to='360 12 12' dur='0.8s' repeatCount='indefinite'/%3E%3C/circle%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 1rem center;
    padding-right: 2.75rem;
}

/* Validation */
.wpcf7 .wpcf7-not-valid-tip {
    font-size: 0.75rem;
    color: #e53e3e;
    margin-top: 0.25rem;
    display: block;
}
.wpcf7 input.wpcf7-not-valid,
.wpcf7 textarea.wpcf7-not-valid { border-color: #e53e3e; }

/* Response messages */
.wpcf7 .wpcf7-response-output {
    margin-top: 1rem;
    padding: 0.75rem 1rem;
    border-radius: var(--radius-sm);
    font-size: 0.88rem;
    font-weight: 600;
    border: none !important;
}
.wpcf7 .wpcf7-mail-sent-ok {
    background: rgba(56, 161, 105, 0.1);
    color: #276749;
}
.wpcf7 .wpcf7-mail-sent-ng,
.wpcf7 .wpcf7-aborted {
    background: rgba(229, 62, 62, 0.1);
    color: #c53030;
}
.wpcf7 .wpcf7-spam-blocked {
    background: rgba(237, 137, 54, 0.1);
    color: #c05621;
}

/* CF7 sent state — green button */
.wpcf7.sent input[type="submit"] {
    background: #38a169 !important;
    box-shadow: 0 6px 20px rgba(56, 161, 105, 0.3) !important;
    cursor: default;
    pointer-events: none;
}

a.btn-outline-nav,
a.btn-outline-nav:hover,
a.btn-outline-nav:focus,
a.btn-outline-nav:visited {
    text-decoration: none !important;
}