/* 
Theme Name: Twenty Twenty-Five Child
Theme URI: 
Author: M.Bates
Author URI: 
Description: Child theme for Twenty Twenty-Five theme.
Requires at least: 6.8
Tested up to: 6.9
Requires PHP: 7.4
Version: 1.0.0
Update URI: false
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Template: twentytwentyfive
Text Domain: twentytwentyfive-child
Tags: 
*/

/* =================================
   GLOBAL LAYOUT 
   ================================= */

:root {
    /* TEC global color overrides (must be root-level) */
    --tec-color-button-primary: var(--wp--preset--color--accent-1) !important;
    --tec-color-accent-primary: var(--wp--preset--color--accent-1) !important;

    /* Global button system variables */
    --button-bg: var(--wp--preset--color--button-bg);
    --button-text: var(--wp--preset--color--button-text);
    --button-bg-hover: color-mix(in srgb, var(--button-bg) 85%, black);
    --button-bg-active: color-mix(in srgb, var(--button-bg) 70%, black);
  
    /* Layout variables */
    --page-top-spacing: var(--wp--preset--spacing--50);
    --content-max-width: 1048px;
    --content-margin-inline: auto;

    --footer-col-width: 130px;   /* change this ONE value */
    --footer-gap: 12px;          /* horizontal gap between columns */

    /* auto-calculated totals */
    --footer-4col-width: calc(4 * var(--footer-col-width) + 3 * var(--footer-gap));
    --footer-2col-width: calc(2 * var(--footer-col-width) + var(--footer-gap));

    --ui-compact-font-size: clamp(17px, 0.95rem + 0.2vw, 19px);
    --ui-radius: 4px;
}

@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
  src: url('/wp-content/themes/twentytwentyfive/assets/fonts/manrope/Manrope-VariableFont_wght.woff2') format('woff2');
}

/* Stabilize layout during scrollbar appearance */
body {
    scrollbar-gutter: stable both-edges !important;
}

/* Fix TT5 mobile breakpoint bug where admin bar loses fixed positioning */
#wpadminbar {
    position: fixed !important;
}

/* Sticky header */
.sticky-header-wrapper {
    position: sticky;
    top: calc(var(--wp-admin--admin-bar--height, 0px));
    z-index: 999;
}

/* Header & Footer template part visual styling */
header.wp-block-template-part,
footer.wp-block-template-part {
    padding-left: var(--wp--preset--spacing--50);
    padding-right: var(--wp--preset--spacing--50);
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    background-color: var(--wp--preset--color--base);
    color: var(--wp--preset--color--contrast);
}

header.wp-block-template-part {
    border-bottom: 1px solid var(--wp--preset--color--contrast);
}

footer.wp-block-template-part {
    border-top: 1px solid var(--wp--preset--color--contrast);
}

/* Header & Footer layout */
.header-inner,
.footer-inner {
    max-width: var(--content-max-width) !important;
    margin-inline: var(--content-margin-inline);
}

.header {
    min-height: 50px;
}

/* Header left rail: logo + title group */
.header-left {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--wp--preset--spacing--30);
}

.header-title-group {
    color: var(--wp--preset--color--contrast);
}

.wp-block-site-title a {
    font-size: clamp(1.25rem, 1rem + .5vw, 1.75rem);
    line-height: 1.3;
    letter-spacing: 0;
    font-weight: 700;
}


/* =================================
   NAVIGATION (header + footer shared)
   ================================= */

.header-nav .wp-block-navigation-item__content,
.footer-nav .wp-block-navigation-item__content {
    color: var(--wp--preset--color--contrast);
    text-decoration: none;
    padding: 0.25rem 0.5rem;
    transition: color 0.2s ease;
    line-height: 1;
    outline-offset: 2px;
}

.footer-nav .wp-block-navigation .wp-block-navigation-item__content {
    padding-inline: 0;
    font-size: var(--ui-compact-font-size);
}


/* =================================
   FOOTER CONTENT/NAVIGATION
   ================================= */
.footer-content-row {
    flex-wrap: wrap;
}
 
.footer-left-group {
    flex: 0 0 auto;
    min-width: max-content;
    margin-right: 20px !important;
}

/* Site Title */
.footer-left-group .wp-block-site-title a {
    font-size: 1.5rem;
}

/* Social Icons */
.footer-left-group .wp-block-social-links {
    width: 100%;
    justify-content: space-between;
    flex-wrap: nowrap;
    margin-top: 1.2rem;
}

.footer-menus-container {
    margin-left: auto;
    flex: 1 1 auto;
    min-width: 0;
}

/* ================================
   FOOTER 4-Column Desktop Layout
   ================================ */
.footer-menu-group {
    display: flex;
    flex-wrap: wrap;
    column-gap: var(--footer-gap);
    row-gap: 20px;
    width: var(--footer-4col-width);
    max-width: var(--footer-4col-width);
    text-align: left;
    margin-inline: auto;
    padding-top: 6px;
}

/* Column width — SINGLE SOURCE OF TRUTH */
.footer-menu-group > .wp-block-group {
    flex: 0 0 var(--footer-col-width);
    max-width: var(--footer-col-width);
    min-width: var(--footer-col-width);
}

/* Reset margins on all direct children */
.footer-menu-group > * {
    margin-block-start: 0 !important;
}

/* Vertical nav inside each column */
.footer-menu-group .wp-block-navigation__container {
    flex-direction: column !important;
    align-items: flex-start !important;
}
.footer-nav {
    margin-block-start: 1rem;
}

/* Column headings */
.footer-menu-group h3 {
    font-size: var(--ui-compact-font-size);
}

/* ================================
   FOOTER 2-Column Tablet Layout
   ================================ */

@media (max-width: 620px) {
    .footer-menu-group {
        width: var(--footer-2col-width);
        max-width: var(--footer-2col-width);
    }

    .footer-menus-container {
        flex-basis: var(--footer-2col-width);
        max-width: var(--footer-2col-width);
        width: var(--footer-2col-width);
        align-items: flex-start;
        margin-left: auto;
    }
}


/* ================================
   NAVIGATION STATES
   ================================ */
.header-nav .wp-block-navigation-item__content:hover,
.footer-nav .wp-block-navigation-item__content:hover {
    color: var(--wp--preset--color--accent-1);
}

.header-nav .wp-block-navigation-item__content[aria-current="page"],
.footer-nav .wp-block-navigation-item__content[aria-current="page"] {
    color: var(--wp--preset--color--accent-1);
    font-weight: 600;
    text-decoration: underline;
    text-decoration-thickness: 1.5px !important; /**/
    text-underline-offset: 4px;
}

.wp-block-navigation-item:focus-within {
    outline: none !important;
    box-shadow: none !important;
}

.wp-block-navigation-item__content:focus-visible {
    display: inline-block;
    outline: 2px solid currentColor;
    outline-offset: 4px;
}

/* Deterministic scroll-padding */
html {
    scroll-padding-top: calc(
        var(--wp-admin--admin-bar--height) +
        var(--wp--custom--header-height)
    );
}

/* Replace default template-part inline top margin */
:where(.wp-site-blocks) > .page-region {
    margin-block-start: var(--page-top-spacing);
}


/* =================================
   WRAPPER SYSTEM
   ================================= */

/* Shared centering behavior */
.layout-wrapper,
.layout-wrapper.alignfull {
    margin-inline: var(--content-margin-inline) !important;
}

/* Default wrapper width */
.layout-wrapper {
    max-width: var(--content-max-width);
}

/* No base-layer max-width rule needed for .alignfull */

.content-container {
    min-height: 500px;
    padding: var(--wp--preset--spacing--50) !important;
    background-color: var(--wp--preset--color--base);
    border: 1px solid var(--wp--preset--color--accent-6);
    border-radius: 1rem;
}


/* =================================
   EDITORIAL LINKS (non-TEC pages)
   ================================= */

/* Style ONLY editorial links inside content */
.entry-content a:not(.wp-block-button__link),
.wp-block-post-content a:not(.wp-block-button__link) {
    color: var(--wp--preset--color--accent-1);
    text-decoration: underline;
    font-size: var(--wp--preset--font-size--medium);
    transition: color .15s ease, text-decoration .15s ease;
}

/* Hover state for editorial links */
.entry-content a:not(.wp-block-button__link):hover,
.wp-block-post-content a:not(.wp-block-button__link):hover {
    text-decoration: none;
}


/* =================================
   GLOBAL LINK SYSTEM – TITLE LINKS
   Applies to: Site Title only
   ================================= */
.wp-block-site-title a {
    color: var(--wp--preset--color--contrast);
    text-decoration: none;
    transition: color .15s ease, text-decoration-color .15s ease;
}

.wp-block-site-title a:hover,
.wp-block-site-title a:focus {
    color: var(--wp--preset--color--accent-1);
    text-decoration: none;
}


/* =================================
   GLOBAL BUTTON SYSTEM
   ================================= */

button,
.wp-block-button__link {
    padding: 0.75em 1.5em;
    font-size: var(--ui-compact-font-size);
    line-height: normal;
    font-weight: 600;
    background-color: var(--button-bg);
    color: var(--button-text);
    border: none; /* or var(--button-bg) */
    border-radius: var(--ui-radius);
    cursor: pointer;
}

/* Hover */
button:hover,
.wp-block-button__link:hover {
    background-color: var(--button-bg-hover);
}

/* Active (pressed) */
button:active,
.wp-block-button__link:active {
    background-color: var(--button-bg-active);
}


/* =================================
   CONTACT PAGE STYLING (Nelio plugin)
   ================================= */

   /* Style all Nelio text, email, and textarea fields */
.nelio-forms-form .nelio-forms-submit a,
.nelio-forms-form .nelio-forms-field--text input,
.nelio-forms-form .nelio-forms-field--email input,
.nelio-forms-form .nelio-forms-field--textarea textarea {
    border-radius: var(--ui-radius);;
    padding-block: .65rem;
    font-size: var(--ui-compact-font-size);
    line-height: normal; /* Mike added */
}

.nelio-forms-form .nelio-forms-field--textarea::placeholder {
    color:red !important;
}

.nelio-forms-form .nelio-forms-field--email {
    margin-bottom:1.75rem;
}

.nelio-forms__response.nelio-forms__response--success {
    color: #4CC552 !important;
}


/* =================================
   CLUB PAGE STYLING
   ================================= */

.club-wrapper img {
    margin-top: 20px;
}

/* List marker styling */
.club-wrapper ul {
    list-style-type: circle;
}


/* =================================
   LOCATION PAGE STYLING
   ================================= */

/* First line of list items is bolded */
.first-line-styled li::first-line {
    font-weight: 600;
}


/* =================================
   FAQs PAGE STYLING
   ================================= */

.faq-wrapper .wp-block-accordion-item {
    padding-inline: 1rem;
    border: 1px solid var(--wp--preset--color--accent-6);
}


/* =================================
   RESPONSIVE RULES
   ================================= */

/* Mobile devicestyling */
@media (max-width: 600px) {
    /* Reduce page gutters */
    .has-global-padding {
        padding-left: 10px;
        padding-right: 10px;
    }

    /* Club page: center and resize images */
    .club-wrapper figure {
        max-width: 250px;
        margin-left: auto !important;
        margin-right: auto !important;
    }

    .wp-block-media-text > .wp-block-media-text__content {
        padding: 0;
    }
}


/* =================================
   LAYER: TEC (The Events Calendar)
   ---------------------------------
   TEC‑specific styling only:
     • link system
     • navigation
     • list view
     • single event view
   All rules scoped to TEC selectors.
   Does not affect global editorial
   links or sitewide components.
   ================================= */
@layer tec {

    /* Preserve aspect ratio so the browser can size the image without CLS */
    .tribe-events-calendar-list__event-featured-image-wrapper {
    aspect-ratio: 300 / 388;
}

    /* =================================
       TEC – LINK SYSTEM
       ---------------------------------
       Defines all link behavior inside
       The Events Calendar.

       Link Families:
         1. Title Links (List View)
         2. Navigation Links (Prev/Next)
         3. Inline Editorial Links (future)

       All selectors scoped to TEC only.
       No impact on sitewide link styles.
       ================================= */

    /* TEC Search Button Hover */
    .tribe-events .tribe-events-c-search__button:hover,
    .tribe-events .tribe-events-c-search__button:focus {
        /* background-color: var(--wp--preset--color--accent-1) !important; */
        background-color: color-mix(in srgb, var(--wp--preset--color--accent-1) 85%, black) !important;
        border-color: var(--wp--preset--color--accent-1) !important;
        color: #fff !important;
    }

    /* ---------------------------------
    1. TITLE LINKS (List View)
    --------------------------------- */
    /* Event titles in List View */
    .tribe-events-calendar-list__event-title a {
        color: var(--wp--preset--color--contrast) !important;
        text-decoration: none;
        border-bottom: none !important;
        transition: color .15s ease, text-decoration-color .15s ease;
    }

    .tribe-events-calendar-list__event-title a:hover {
        color: var(--wp--preset--color--accent-1) !important;
    }

    /* ---------------------------------
       2. NAVIGATION LINKS (Prev/Next)
       ---------------------------------
       Markup patterns:
        • Active = <a class="tribe-events-c-nav__prev">
        • Disabled = <button class="tribe-events-c-nav__prev" disabled>
        • Single Event View uses <a> only; no disabled state.
       --------------------------------- */

    /* Active state (anchors + buttons) */
    .tribe-events-c-nav__prev,
    .tribe-events-c-nav__next,
    .tribe-events-nav-previous a,
    .tribe-events-nav-next a {
        color: var(--wp--preset--color--contrast) !important;
        text-decoration: none;
        transition: color .15s ease;
    }

    /* Hover state */
    .tribe-events-c-nav__prev:hover,
    .tribe-events-c-nav__next:hover,
    .tribe-events-nav-previous a:hover,
    .tribe-events-nav-next a:hover {
        color: var(--wp--preset--color--accent-1) !important;
    }

    /* Disabled state (List View only: <button disabled>) */
    .tribe-events-c-nav__prev:disabled,
    .tribe-events-c-nav__next:disabled {
        color: var(--tec-color-text-disabled) !important;
        transition: none !important;
        pointer-events: none;
        cursor: default;
    }

    /* ---------------------------------
       3. INLINE EDITORIAL LINKS (TEC)
       ---------------------------------
       Reserved for future use.
       Example:
        .tribe-events-meta-group a:hover { ... }
       --------------------------------- */


    /* =================================
       TEC – EVENTS LIST VIEW
       ================================= */

    /* Thumbnail wrapper: size, clickability, and required block behavior */
    .tribe-events-calendar-list__event-featured-image-wrapper {
        width: 150px;
        max-width: 150px;
        position: relative;
        cursor: pointer;

        /* Required so “Details” renders after AJAX */
        display: block !important;
        overflow: visible !important;
    }

    /* Thumbnail image appearance */
    .tribe-events-calendar-list__event-featured-image {
        width: 100%;
        height: auto;
        display: block;
        position: relative;
        z-index: 1;
        border: 1px solid rgba(0, 0, 0, 0.15);
        border-radius: 4px;
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.25);
        transition: all 0.15s ease;
    }

    /* Thumbnail image hover effect */
    .tribe-events-calendar-list__event-featured-image:hover {
        transform: scale(1.03) translateY(-2px);
        box-shadow: 0 6px 14px rgba(0, 0, 0, 0.30);
        transition: transform 0.15s ease, box-shadow 0.15s ease;
    }

    /* "Details" label under thumbnail */
    .tribe-events-calendar-list__event-featured-image-wrapper::after {
        content: "Details";
        display: block;
        margin-top: 6px !important;
        font-size: 14px;
        font-weight: 500;
        letter-spacing: .5px;
        color: #000;
        color: var(--wp--preset--color--contrast);
        text-decoration: underline;
        text-underline-offset: 1.5px;
        text-align: center;
        pointer-events: none;
    }

    /* "Details" label hover effect */
    .tribe-events-calendar-list__event-featured-image-wrapper:hover::after {
        color: var(--wp--preset--color--accent-1);
    }


    /* =================================
       TEC – SINGLE EVENT VIEW
       ================================= */

    /* Event flyer image styling */
    .single-tribe_events .tribe-events-event-image img {
        max-width: 100%;
        height: auto;
        border: 1px solid rgba(0, 0, 0, 0.15);
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25);
        border-radius: 4px;
        margin-left: auto !important;
        margin-right: auto !important;
    }

    /* Back link spacing */
    .tribe-events-back {
        margin-bottom: 1.5rem;
    }

    /* Collapse original TEC text */
    .tribe-events-back a {
        font-size: 0 !important;
        display: inline-flex;
        align-items: center;
    }

    /* Left caret icon */
    .tribe-events-back a::before {
        content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 16' fill='currentColor'%3E%3Cpath d='M9.7 14.4l-1.5 1.5L.3 8 8.2.1l1.5 1.5L3.3 8l6.4 6.4z'%3E%3C/path%3E%3C/svg%3E");
        display: inline-block;
        width: 11px;
        height: 19px;
        margin-right: 10px;
        vertical-align: middle;
        line-height: 1;
    }

    /* Custom label */
    .tribe-events-back a::after {
        content: "All Events";
        font-size: 1.25rem;
        color: #000;
        color: var(--wp--preset--color--contrast);
        font-weight: 400;
        line-height: 1;
        text-decoration: none;
        transition: color 0.15s ease, text-decoration-color 0.15s ease;
    }

    /* Hover styling */
    .tribe-events-back a:hover::after {
        text-decoration: none !important;
        color: var(--wp--preset--color--accent-1);

    }

    /* Hide any internal TEC spans */
    .tribe-events-back a span,
    .tribe-events-back a .tribe-events-c-top-bar__back-text {
        display: none !important;
    }

    /* Classic Editor images inside TEC event descriptions.
       Style a second club flyer image on singe event page */
    .tribe-events-single-event-description img.aligncenter {
        display: block;
        margin-inline: auto;
        height: auto;
        border: 1px solid black;
        border-radius: 4px;
        box-shadow: 0 2px 8px rgba(0,0,0,0.25);
    }

} /* end tec layer */


/* =================================
   LAYER: OVERRIDES
   ---------------------------------
   Final, must-win rules only.
   Used sparingly for:
     • inline-style overrides
     • plugin edge cases
     • unavoidable specificity battles
   This layer should remain minimal.
   ================================= */
@layer overrides {

    /* Fix WordPress full-width breakout */
    .layout-wrapper.alignfull {
        max-width: var(--content-max-width);
    }

    /* Remove extra padding on single event template */
    .tribe-common-l-container {
        padding: 0 !important;
    }

    .tribe-events-pg-template
    {
        padding-top: 0 !important;
    }

    @media (min-width: 768px) {
        .tribe-events-back {
           margin-bottom: var(--tec-spacer-5) !important;
        }    
    }

} /* end overrides layer */