/*
Theme Name: TXQP Theme
Theme URI: https://txqp.net
Description: Official Texas QSO Party child theme of Twenty Twenty-Five. Provides full TXQP branding — navy sticky header, red call-to-action accents, cream body, responsive navigation, news cards, and styling hooks for the TXQP Activity Map plugin.
Author: Texas QSO Party
Author URI: https://txqp.net
Template: twentytwentyfive
Version: 1.0.2
Requires at least: 6.7
Tested up to: 6.7
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: txqp-theme
Tags: full-site-editing, block-styles, custom-logo, custom-menu, one-column, two-columns, right-sidebar, responsive
*/

/* =============================================================
   TXQP Brand Variables
   ============================================================= */
:root {
        --txqp-navy: #1B3168;
        --txqp-navy-dark: #132349;
        --txqp-red: #C8102E;
        --txqp-red-dark: #a50d26;
        --txqp-cream: #F5EFE0;
        --txqp-wood: #8B6234;
        --txqp-gold: #C9A84C;
        --txqp-text: #1A1A1A;
        --txqp-white: #ffffff;
        --txqp-muted: #5a5a5a;
        --txqp-border: #e0d9c6;

        --txqp-radius: 6px;
        --txqp-radius-lg: 10px;
        --txqp-shadow: 0 2px 8px rgba(27, 49, 104, 0.10);
        --txqp-shadow-lg: 0 6px 20px rgba(27, 49, 104, 0.16);
        --txqp-maxwidth: 1200px;
        --txqp-header-height: 76px;

        --txqp-font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
}

/* =============================================================
   Base / Body
   ============================================================= */
body,
.wp-site-blocks {
        background-color: var(--txqp-cream);
        color: var(--txqp-text);
        font-family: var(--txqp-font);
        font-size: 18px;
        line-height: 1.7;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
}

p {
        line-height: 1.7;
        margin: 0 0 1.2em;
}

/* =============================================================
   Headings
   ============================================================= */
h1, h2, h3, h4, h5, h6,
.wp-block-heading {
        color: var(--txqp-navy);
        font-family: var(--txqp-font);
        font-weight: 700;
        line-height: 1.25;
        margin: 0 0 0.6em;
}

h1, .wp-block-heading.h1 { font-size: clamp(2rem, 4vw, 2.75rem); }
h2 { font-size: clamp(1.6rem, 3vw, 2.1rem); }
h3 { font-size: clamp(1.3rem, 2.4vw, 1.6rem); }
h4 { font-size: 1.25rem; }
h5 { font-size: 1.1rem; }
h6 { font-size: 1rem; text-transform: uppercase; letter-spacing: .04em; }

/* =============================================================
   Links
   ============================================================= */
a {
        color: var(--txqp-navy);
        text-decoration: underline;
        text-underline-offset: 2px;
        transition: color .15s ease;
}
a:hover,
a:focus {
        color: var(--txqp-red);
}

/* =============================================================
   Layout helpers
   ============================================================= */
.txqp-container {
        max-width: var(--txqp-maxwidth);
        margin-inline: auto;
        padding-inline: clamp(1rem, 4vw, 2rem);
}

/* =============================================================
   Header — sticky navy bar
   ============================================================= */
.txqp-header,
.wp-block-template-part.txqp-header {
        position: sticky;
        top: 0;
        z-index: 1000;
        background-color: var(--txqp-navy);
        box-shadow: var(--txqp-shadow);
}

.txqp-header-inner {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 1rem;
        max-width: var(--txqp-maxwidth);
        margin-inline: auto;
        padding: 0.5rem clamp(1rem, 4vw, 2rem);
        min-height: var(--txqp-header-height);
}

/* Logo */
.txqp-header .custom-logo-link,
.txqp-logo a {
        display: inline-flex;
        align-items: center;
}
.txqp-header .custom-logo,
.txqp-logo img {
        max-height: 58px;
        width: auto;
        display: block;
}
.txqp-site-title,
.txqp-header .wp-block-site-title {
        color: var(--txqp-white);
        font-size: 1.35rem;
        font-weight: 800;
        letter-spacing: .01em;
}
.txqp-site-title a,
.txqp-header .wp-block-site-title a {
        color: var(--txqp-white);
        text-decoration: none;
}
.txqp-header .wp-block-site-title a:hover {
        color: var(--txqp-gold);
}

/* =============================================================
   Navigation — white on navy, red hover/active underline
   ============================================================= */
.txqp-header .wp-block-navigation,
.txqp-nav {
        --wp--preset--color--contrast: #ffffff;
}
.txqp-header .wp-block-navigation a,
.txqp-header .wp-block-navigation .wp-block-navigation-item__content,
.txqp-nav a {
        color: var(--txqp-white);
        text-decoration: none;
        font-weight: 600;
        font-size: 1rem;
        padding: 0.35rem 0.15rem;
        position: relative;
}

.txqp-header .wp-block-navigation a::after,
.txqp-nav a::after {
        content: "";
        position: absolute;
        left: 0;
        right: 0;
        bottom: -4px;
        height: 3px;
        background: var(--txqp-red);
        border-radius: 2px;
        transform: scaleX(0);
        transform-origin: left center;
        transition: transform .18s ease;
}
.txqp-header .wp-block-navigation a:hover::after,
.txqp-header .wp-block-navigation a:focus::after,
.txqp-header .wp-block-navigation .current-menu-item > a::after,
.txqp-nav a:hover::after,
.txqp-nav a.active::after,
.txqp-nav .current-menu-item > a::after {
        transform: scaleX(1);
}
.txqp-header .wp-block-navigation a:hover,
.txqp-header .wp-block-navigation a:focus,
.txqp-nav a:hover,
.txqp-nav a:focus {
        color: var(--txqp-gold);
}

/* Classic (non-block) menu fallback */
.txqp-nav ul {
        list-style: none;
        display: flex;
        gap: 1.5rem;
        margin: 0;
        padding: 0;
        align-items: center;
}
.txqp-nav li { margin: 0; }

/* =============================================================
   WP Navigation block — hamburger / responsive toggle button.
   Targets all nav blocks site-wide (header uses no txqp-header
   class in the actual rendered DOM, so broad selectors are needed).
   ============================================================= */
.wp-block-navigation__responsive-container-open,
.wp-block-navigation__responsive-container-close {
        background: transparent;
        border: 2px solid rgba(255, 255, 255, 0.55);
        border-radius: var(--txqp-radius);
        color: var(--txqp-white);
        padding: 6px 10px;
        cursor: pointer;
        transition: border-color .15s, background .15s;
        min-width: 44px;
        min-height: 40px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
}
.wp-block-navigation__responsive-container-open:hover,
.wp-block-navigation__responsive-container-close:hover {
        border-color: var(--txqp-white);
        background: rgba(255, 255, 255, 0.1);
}
/* SVG hamburger / close icons — force white fill and stroke */
.wp-block-navigation__responsive-container-open svg,
.wp-block-navigation__responsive-container-close svg {
        fill: var(--txqp-white);
        stroke: var(--txqp-white);
}

/* Mobile overlay panel — navy background */
.wp-block-navigation__responsive-container.is-menu-open {
        background-color: var(--txqp-navy) !important;
        color: var(--txqp-white);
}
.wp-block-navigation__responsive-container.is-menu-open
        .wp-block-navigation-item__content,
.wp-block-navigation__responsive-container.is-menu-open a {
        color: var(--txqp-white) !important;
}
.wp-block-navigation__responsive-dialog
        .wp-block-navigation__responsive-container-close {
        color: var(--txqp-white);
        border-color: rgba(255, 255, 255, 0.55);
}

/* =============================================================
   WP Navigation block — dropdown submenu container
   ============================================================= */
.wp-block-navigation__submenu-container {
        background-color: var(--txqp-navy-dark) !important;
        border: 1px solid rgba(255, 255, 255, 0.15);
        border-radius: var(--txqp-radius);
        box-shadow: var(--txqp-shadow-lg);
        min-width: 180px;
        padding: 0.25rem 0;
}
.wp-block-navigation__submenu-container a,
.wp-block-navigation__submenu-container .wp-block-navigation-item__content {
        color: var(--txqp-white) !important;
        padding: 0.5rem 1rem !important;
        display: block;
        text-decoration: none;
        background: transparent;
}
.wp-block-navigation__submenu-container a:hover,
.wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover {
        background: rgba(255, 255, 255, 0.1) !important;
        color: var(--txqp-gold) !important;
}

/* Submenu toggle button (the chevron arrow) */
.wp-block-navigation-submenu__toggle {
        background: transparent;
        border: none;
        cursor: pointer;
        padding: 0 4px;
        color: var(--txqp-white);
}
/* The SVG chevron arrow — stroke is unset in WP markup, so set it here */
.wp-block-navigation__submenu-icon svg,
.wp-block-navigation-submenu__toggle svg {
        stroke: currentColor;
        fill: none;
}
.wp-block-navigation__submenu-icon svg path,
.wp-block-navigation-submenu__toggle svg path {
        stroke: currentColor;
}

/* Legacy custom nav toggle — never rendered, always hidden */
.txqp-nav-toggle { display: none !important; }

/* =============================================================
   Hero / banner — navy with tagline
   ============================================================= */
.txqp-hero,
.wp-block-cover.txqp-hero {
        background-color: var(--txqp-navy);
        color: var(--txqp-cream);
        text-align: center;
        padding: clamp(2.5rem, 7vw, 5rem) 1rem;
}
.txqp-hero h1,
.txqp-hero h2,
.txqp-hero .wp-block-heading {
        color: var(--txqp-white);
        margin-bottom: .4em;
}
.txqp-hero p,
.txqp-hero .txqp-tagline {
        color: var(--txqp-cream);
        font-size: clamp(1.1rem, 2.4vw, 1.5rem);
        max-width: 720px;
        margin-inline: auto;
        opacity: .95;
}
.txqp-hero .txqp-btn { margin-top: 1.5rem; }

/* =============================================================
   Buttons / CTAs — red bg, white text
   ============================================================= */
.txqp-btn,
.wp-block-button__link,
button.txqp-btn,
input[type="submit"] {
        display: inline-block;
        background-color: var(--txqp-red);
        color: var(--txqp-white) !important;
        font-weight: 700;
        text-decoration: none;
        padding: 0.7rem 1.5rem;
        border: none;
        border-radius: var(--txqp-radius);
        cursor: pointer;
        transition: background-color .15s ease, transform .05s ease;
        line-height: 1.3;
}
.txqp-btn:hover,
.wp-block-button__link:hover,
button.txqp-btn:hover,
input[type="submit"]:hover {
        background-color: var(--txqp-red-dark);
        color: var(--txqp-white) !important;
}
.txqp-btn:active,
.wp-block-button__link:active {
        transform: translateY(1px);
}
/* Secondary / outline button */
.txqp-btn--outline,
.wp-block-button.is-style-outline .wp-block-button__link {
        background-color: transparent;
        color: var(--txqp-navy) !important;
        border: 2px solid var(--txqp-navy);
}
.txqp-btn--outline:hover,
.wp-block-button.is-style-outline .wp-block-button__link:hover {
        background-color: var(--txqp-navy);
        color: var(--txqp-white) !important;
}

/* =============================================================
   News / blog post cards (front page)
   ============================================================= */
.txqp-cards,
.wp-block-query.txqp-cards .wp-block-post-template {
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
        gap: 1.75rem;
        list-style: none;
        margin: 0;
        padding: 0;
}
.txqp-card,
.wp-block-query.txqp-cards .wp-block-post {
        background: var(--txqp-white);
        border: 1px solid var(--txqp-border);
        border-left: 5px solid var(--txqp-red);
        border-radius: var(--txqp-radius-lg);
        box-shadow: var(--txqp-shadow);
        overflow: hidden;
        display: flex;
        flex-direction: column;
        transition: box-shadow .18s ease, transform .18s ease;
}
.txqp-card:hover,
.wp-block-query.txqp-cards .wp-block-post:hover {
        box-shadow: var(--txqp-shadow-lg);
        transform: translateY(-3px);
}
.txqp-card__body,
.wp-block-query.txqp-cards .wp-block-post > * {
        padding-inline: 1.25rem;
}
.txqp-card__body { padding: 1.25rem; }
.txqp-card img,
.wp-block-query.txqp-cards .wp-block-post-featured-image img {
        width: 100%;
        height: 190px;
        object-fit: cover;
        display: block;
}
.txqp-card h3,
.txqp-card__title,
.wp-block-query.txqp-cards .wp-block-post-title {
        margin: 1rem 0 .4rem;
        font-size: 1.3rem;
        line-height: 1.3;
}
.txqp-card h3 a { text-decoration: none; }
.txqp-card__meta,
.wp-block-query.txqp-cards .wp-block-post-date {
        color: var(--txqp-muted);
        font-size: .9rem;
        margin-bottom: .5rem;
}
.txqp-card__excerpt,
.wp-block-query.txqp-cards .wp-block-post-excerpt {
        color: var(--txqp-text);
        font-size: 1rem;
        margin-bottom: 1rem;
}

/* =============================================================
   Single post / page typography
   ============================================================= */
.txqp-content,
.wp-block-post-content {
        max-width: 760px;
        margin-inline: auto;
}
.txqp-content img { border-radius: var(--txqp-radius); }
blockquote,
.wp-block-quote {
        border-left: 4px solid var(--txqp-gold);
        background: rgba(201, 168, 76, 0.10);
        margin: 1.5em 0;
        padding: 1rem 1.25rem;
        font-style: italic;
        border-radius: 0 var(--txqp-radius) var(--txqp-radius) 0;
}
:where(.wp-block-post-content) table th {
        background: var(--txqp-navy);
        color: var(--txqp-white);
}

/* =============================================================
   Footer — dark navy, cream text, centered
   ============================================================= */
.txqp-footer,
.wp-block-template-part.txqp-footer {
        background-color: var(--txqp-navy-dark);
        color: var(--txqp-cream);
        text-align: center;
        padding: 2.5rem 1rem;
}
.txqp-footer a { color: var(--txqp-gold); }
.txqp-footer a:hover { color: var(--txqp-white); }
.txqp-footer .wp-block-navigation {
        justify-content: center;
}
.txqp-footer .wp-block-navigation a {
        color: var(--txqp-cream);
        text-decoration: none;
}
.txqp-footer .wp-block-navigation a:hover { color: var(--txqp-white); }
.txqp-footer .txqp-footer-copy {
        font-size: .9rem;
        opacity: .85;
        margin-top: 1rem;
}

/* =============================================================
   Sidebar widget area
   ============================================================= */
.txqp-sidebar .widget {
        background: var(--txqp-white);
        border: 1px solid var(--txqp-border);
        border-top: 4px solid var(--txqp-navy);
        border-radius: var(--txqp-radius);
        padding: 1.25rem;
        margin-bottom: 1.5rem;
}
.txqp-sidebar .widget-title {
        color: var(--txqp-navy);
        font-size: 1.15rem;
        margin-top: 0;
}

/* =============================================================
   TXQP Activity Map plugin container
   ============================================================= */
.txqp-activity-map-container {
        background: var(--txqp-white);
        border: 1px solid var(--txqp-border);
        border-top: 5px solid var(--txqp-red);
        border-radius: var(--txqp-radius-lg);
        box-shadow: var(--txqp-shadow);
        padding: 1rem;
        margin: 1.5rem 0;
}
.txqp-activity-map-container .leaflet-container,
.txqp-activity-map-container .txqp-map {
        border-radius: var(--txqp-radius);
        min-height: 480px;
}

/* =============================================================
   Responsive breakpoints
   ============================================================= */
@media (max-width: 1024px) {
        body, .wp-site-blocks { font-size: 17px; }
        .txqp-cards,
        .wp-block-query.txqp-cards .wp-block-post-template {
                grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
        }
}

@media (max-width: 768px) {
        /* Shrink header on mobile */
        .txqp-header-inner { min-height: 64px; }
        .txqp-header .custom-logo,
        .txqp-logo img,
        .custom-logo { max-height: 46px; }

        /* WP block manages its own responsive container visibility via JS.
           Do NOT add display:none rules here — they fight WP's Interactivity API. */

        .txqp-cards,
        .wp-block-query.txqp-cards .wp-block-post-template {
                grid-template-columns: 1fr;
        }
        .txqp-content,
        .wp-block-post-content { max-width: 100%; }
}

/* =============================================================
   Accessibility
   ============================================================= */
.txqp-skip-link {
        position: absolute;
        left: -9999px;
}
.txqp-skip-link:focus {
        left: 1rem;
        top: 1rem;
        z-index: 2000;
        background: var(--txqp-white);
        color: var(--txqp-navy);
        padding: .5rem 1rem;
        border-radius: var(--txqp-radius);
}
:where(a, button, input, select, textarea):focus-visible {
        outline: 3px solid var(--txqp-gold);
        outline-offset: 2px;
}