/*
Theme Name:   Kadence Child - Apex This
Theme URI:    https://apexthis.racing
Description:  Child theme for Kadence, customized for Apex This Racing League
Author:       Kent Krueger
Author URI:   https://apexthis.racing
Template:     kadence
Version:      1.0.0
License:      GNU General Public License v2 or later
License URI:  https://www.gnu.org/licenses/gpl-2.0.html
Text Domain:  kadence-child
*/

/* ==========================================================================
   Google Fonts Import
   ========================================================================== */
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700&family=Righteous&family=Roboto:wght@400;500;700&display=swap');

/* Fix: Kadence global.min.css sets img { display: block } which breaks
   text-align: center on parent containers. Auto margins center any block
   image that's narrower than its container. No effect on full-width images. */
img {
    margin-left: auto;
    margin-right: auto;
}

/* ==========================================================================
   Apex This Custom Styles
   ========================================================================== */

body {
    font-family: Roboto, sans-serif;
    color: #333;
}

h1, h2, h3, h4, h5, h6 {
    font-family: Poppins, sans-serif;
}

a {
    color: #0693e3;
}

a:hover {
    color: #cf2e2e;
}

.entry-content {
    font-family: Roboto, sans-serif;
    font-size: 16px;
    line-height: 1.8;
}

/* Fix: Kadence customizer inherited 0.5em letter-spacing from DB clone */
h1 {
    letter-spacing: normal;
}

/* Center content images — must override Kadence content.min.css rule:
   .single-content p>img { display:inline-block } (specificity 0,1,2)
   which loads AFTER the child theme and reverts block to inline-block.
   Second selector at 0,2,2 beats it. */
.entry-content img,
.entry-content.single-content p > img {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

/* ==========================================================================
   Secondary Page Layout
   Scoped to .page-template-default so race night pages (Elementor) are unaffected.
   ========================================================================== */

/* Constrain content width and center it */
.page-template-default .content-container.site-container {
    max-width: 1140px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 20px;
    padding-right: 20px;
}

/* Article padding — generous top for breathing room below header/nav,
   generous bottom for spacing before footer.
   Must beat Kadence: .content-style-unboxed .entry:not(.loop-entry) > .entry-content-wrap (0,4,0) */
.page-template-default.content-style-unboxed .entry:not(.loop-entry) > .entry-content-wrap {
    padding: 60px 5px 80px;
}

/* Page title header container */
.page-template-default .entry-header.page-title {
    margin-bottom: 25px;
    padding-bottom: 20px;
    border-bottom: 3px solid #cf2e2e;
}

/* Page title text */
.page-template-default .entry-header .entry-title {
    font-family: Poppins, sans-serif;
    font-size: 2.4em;
    font-weight: 700;
    color: #1a1a2e;
    letter-spacing: normal;
    line-height: 1.2;
    margin: 0;
    padding: 0 5px;
}

/* Paragraph spacing */
.page-template-default .entry-content p {
    margin-bottom: 1.2em;
}

/* Headings inside content */
.page-template-default .entry-content h2 {
    font-size: 1.65em;
    margin-top: 1.5em;
    margin-bottom: 0.6em;
    color: #3a3a3a;
}

.page-template-default .entry-content h3 {
    font-size: 1.35em;
    margin-top: 1.3em;
    margin-bottom: 0.5em;
    color: #3a3a3a;
}

.page-template-default .entry-content h4 {
    font-size: 1.15em;
    margin-top: 1.2em;
    margin-bottom: 0.4em;
    color: #3a3a3a;
}

/* Ordered & unordered lists — proper indentation and spacing */
.page-template-default .entry-content ol,
.page-template-default .entry-content ul {
    padding-left: 2em;
    margin-bottom: 1.2em;
}

.page-template-default .entry-content ol ol,
.page-template-default .entry-content ul ul,
.page-template-default .entry-content ol ul,
.page-template-default .entry-content ul ol {
    padding-left: 1.5em;
    margin-bottom: 0.3em;
}

.page-template-default .entry-content li {
    margin-bottom: 0.4em;
    line-height: 1.7;
}

/* Table styling */
.page-template-default .entry-content table {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 1.5em;
}

.page-template-default .entry-content th,
.page-template-default .entry-content td {
    padding: 10px 12px;
    border: 1px solid #ddd;
    text-align: left;
}

.page-template-default .entry-content th {
    background-color: #1a1a2e;
    color: #fff;
    font-weight: 600;
}

.page-template-default .entry-content tr:nth-child(even) {
    background-color: #f9f9f9;
}

/* Strong/bold emphasis — match production weight */
.page-template-default .entry-content strong,
.page-template-default .entry-content b {
    font-weight: 700;
}

/* ==========================================================================
   Header — Align with Page Content
   ========================================================================== */

/* Constrain header rows to same max-width as page content so logo left edge
   aligns with the left margin of body text below.
   Kadence header.min.css loads AFTER child theme (specificity 0,3,0).
   Prepend .site-header to beat it (specificity 0,4,0). */
.site-header .site-header-row-layout-fullwidth > .site-header-row-container-inner > .site-container {
    max-width: 1140px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 20px;
    padding-right: 20px;
}

/* ==========================================================================
   Header Branding — Logo & Tagline
   ========================================================================== */

/* Make the branding area flex so logo and tagline sit side-by-side */
.site-header-item[data-section="title_tagline"] {
    display: flex !important;
    align-items: center;
}

/* Larger logo to fill more header space */
.site-header .custom-logo {
    max-width: 280px !important;
    width: 280px !important;
    height: auto !important;
}

/* Tagline next to logo */
.apex-header-tagline {
    font-family: Poppins, sans-serif;
    font-size: 13px;
    font-weight: 500;
    color: #555;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    margin-left: 25px;
    padding-left: 25px;
    border-left: 2px solid #cf2e2e;
    line-height: 1.6;
    white-space: nowrap;
}

/* ==========================================================================
   Footer Fixes
   ========================================================================== */

/* Fix: Kadence customizer has 1em letter-spacing on footer widget titles — way too wide */
.site-footer .widget-title,
.site-footer .footer-widget-area .widget-title {
    letter-spacing: 0.05em !important;
}

/* Footer links: visible on dark background with hover effect */
.site-footer .footer-widget-area a {
    color: #CBD5E0;
    text-decoration: none;
    transition: color 0.2s ease;
}

.site-footer .footer-widget-area a:hover {
    color: #FFFFFF;
    text-decoration: underline;
}

/* ==========================================================================
   Responsive Adjustments
   ========================================================================== */
@media (max-width: 768px) {
    .page-template-default .content-container.site-container {
        padding-left: 15px;
        padding-right: 15px;
    }

    .page-template-default .entry-content h2 {
        font-size: 1.4em;
    }

    .page-template-default .entry-content h3 {
        font-size: 1.2em;
    }

    .page-template-default .entry-header .entry-title {
        font-size: 1.8em;
    }

    .page-template-default.content-style-unboxed .entry:not(.loop-entry) > .entry-content-wrap {
        padding-top: 25px;
    }

    /* Hide tagline on mobile */
    .apex-header-tagline {
        display: none;
    }

    /* Restore logo size on mobile */
    .site-header .custom-logo {
        max-width: 180px !important;
        width: 180px !important;
    }
}

@media (max-width: 1024px) and (min-width: 769px) {
    .apex-header-tagline {
        font-size: 11px;
        letter-spacing: 1px;
    }
}