/**
Theme Name: JAB Child
Author: Brainstorm Force
Author URI: http://wpastra.com/about/
Description: Astra is the fastest, fully customizable & beautiful theme suitable for blogs, personal portfolios and business websites. It is very lightweight (less than 50KB on frontend) and offers unparalleled speed. Built with SEO in mind, Astra comes with schema.org code integrated so search engines will love your site. Astra offers plenty of sidebar options and widget areas giving you a full control for customizations. Furthermore, we have included special features and templates so feel free to choose any of your favorite page builder plugin to create pages flexibly. Some of the other features: # WooCommerce Ready # Responsive # Compatible with major plugins # Translation Ready # Extendible with premium addons # Regularly updated # Designed, Developed, Maintained & Supported by Brainstorm Force. Looking for a perfect base theme? Look no further. Astra is fast, fully customizable and beautiful theme!
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: jab-child
Template: astra
*/
.site-primary-header-wrap { min-height: 90px !important; }
.home #content { padding-top: 50px; }

/* =========================================
   Fascination 127 – JAB Track Templates
   Single + Track Archive + Album Cards
   Scope: jab templates only
========================================= */

/* =========================================
   0) Design Tokens (F127 dark stage)
========================================= */:root { --f127-purple: #390050; --f127-purple-mid: #6a00b9; --f127-pink: #c00088; --f127-ink: #08000b; --f127-ink-2:#120016; --f127-line: rgba(255, 255, 255, .14); --f127-soft: rgba(255, 255, 255, .08);  /* text on dark */ --f127-text: rgba(255, 255, 255, .88); --f127-muted: rgba(255, 255, 255, .70); --f127-dim: rgba(255, 255, 255, .55);  /* card */ --f127-card-bg: rgba(0, 0, 0, .34); --f127-card-shadow: 0 18px 60px rgba(0, 0, 0, .45); --f127-radius: 18px; }

/* =========================================
   0) header
========================================= */

/* =========================================
   1) Astra Container Overrides (transparent)
   - Remove Astra “separate container” bg/shadow
   - Let our dark stage show through
========================================= */
.single-jab_track.ast-separate-container .ast-article-single:not(.ast-related-post), .post-type-archive-jab_track.ast-separate-container .ast-article-single, .post-type-archive-jab_track.ast-separate-container .ast-archive-description { background-color: transparent; box-shadow: none; }

/* =========================================
   2) Dark Stage Background (matches homepage)
   - Track single
   - Track archive
   - Optional section: #latest-tracks
========================================= */
.single-jab_track #content, .post-type-archive-jab_track #content, #content #latest-tracks, body.page-template-template-albums-archive #content, body.archive.tax-jab_album #content, .archive #page, .blog #page { background: radial-gradient(1200px 500px at 50% -120px, rgba(122, 28, 255, .40), transparent 60%), radial-gradient(1000px 520px at 20% 0px, rgba(57, 0, 80, .55), transparent 60%), linear-gradient(180deg, var(--f127-ink-2), var(--f127-ink)); }

/* Shared inner container width/padding */
.jab-track-single .jab-container, .post-type-archive-jab_track .jab-container { max-width: 1100px; margin: 0 auto; padding: 0 18px; }

/* =========================================
   3) Global Components (used across templates)
========================================= */

/* Pills */
.jab-pill { display: inline-flex; align-items: center; gap: 8px; padding: 7px 12px; border-radius: 999px; border: 1px solid rgba(255, 255, 255, .18); background: rgba(0, 0, 0, .22); color: rgba(255, 255, 255, .92); font-size: 12px; letter-spacing: .04em; text-transform: uppercase; }

/* Buttons */
.jab-btn { border: 1px solid rgba(255, 255, 255, .18); background: rgba(0, 0, 0, .22); color: #fff; border-radius: 999px; padding: 10px 16px; font-size: 12px; letter-spacing: .08em; text-transform: uppercase; font-weight: 700; cursor: pointer; transition: transform .15s ease, background .15s ease, border-color .15s ease; }
.jab-btn.jab-btn--ghost { padding-top: 11px; padding-bottom: 11px; text-decoration: none !important; }
.jab-btn--primary { background: #fff; color: var(--f127-purple); flex: 1 1 auto; text-align: center; }
.jab-btn:hover { transform: translateY(-1px); background: var(--ast-global-color-1); border-color: var(--ast-global-color-1); color: var(--ast-global-color-7); }

/* Cards (glass on dark) */
.jab-card { border-radius: var(--f127-radius); border: 1px solid var(--f127-line); background: var(--f127-card-bg); box-shadow: var(--f127-card-shadow); backdrop-filter: blur(10px); }
.jab-card-inner { padding: 18px; }

/* Typography */
.jab-h2, .jab-h3 { margin: 0 0 10px; color: #fff; text-transform: uppercase; letter-spacing: .08em; font-weight: 800; }
.jab-h2 { font-size: 18px; }
.jab-h3 { font-size: 14px; }
.jab-prose { color: var(--f127-text); font-size: 16px; line-height: 1.7; }
.jab-prose p { margin: 0 0 12px; }
.jab-prose a { color: #fff; text-decoration: underline; text-underline-offset: 3px; }

/* Archive card heading links */
.jab-archive-item-head a { color: #fff; text-decoration: none !important; }
.jab-archive-item-head a:hover, .jab-archive-item-head a:focus { color: var(--ast-global-color-1); }

/* Player styling */
.jab-card--player iframe { border-radius: 14px; box-shadow: 0 18px 50px rgba(0, 0, 0, .55); }

/* =========================================
   4) Single Track Layout
========================================= */

/* Hero */
.jab-track-single .jab-track-hero { padding: 56px 20px 28px; position: relative; overflow: hidden; }
.jab-track-single .jab-track-hero::before { content: ""; position: absolute; inset: -2px; background: linear-gradient(135deg, rgb(57, 0, 80) 0%, rgb(106, 0, 185) 50%, rgb(192, 0, 136) 100%); pointer-events: none; }
.jab-track-single .jab-track-hero::after { content: ""; position: absolute; inset: 0; background: radial-gradient(500px 220px at 50% 0%, rgba(255, 255, 255, .18), transparent 65%); pointer-events: none; }
.jab-track-single .jab-track-hero .jab-container { position: relative; z-index: 2; text-align: center; }
.jab-track-single .jab-track-title { margin: 0 0 14px; color: #fff; text-transform: uppercase; letter-spacing: .08em; font-weight: 800; line-height: 1.05; font-size: clamp(34px, 4vw, 54px); }

/* Body grid */
.jab-track-single .jab-track-body { padding: 30px 0 80px; }
.jab-track-single .jab-grid { display: grid; grid-template-columns: 1.7fr .95fr; gap: 24px; }
@media (max-width:980px) {
   .jab-track-single .jab-grid { grid-template-columns: 1fr; }
}

/* Card spacing (main + sidebar stacks) */
.jab-track-single .jab-main > .jab-card { margin-bottom: 18px; }
.jab-track-single .jab-main > .jab-card:last-child { margin-bottom: 0; }
.jab-track-single .jab-side > .jab-card { margin-bottom: 18px; }
.jab-track-single .jab-side > .jab-card:last-child { margin-bottom: 0; }

/* Sidebar meta rows */
.jab-meta-row { display: flex; justify-content: space-between; gap: 12px; padding: 10px 0; border-top: 1px solid rgba(255, 255, 255, .10); }
.jab-meta-row:first-child { border-top: 0; }
.jab-meta-k { color: var(--f127-muted); font-size: 12px; text-transform: uppercase; }
.jab-meta-v { color: #fff; font-size: 13px; }
.jab-side .jab-cta-stack { padding-top: 5px; padding-bottom: 10px; display: flex; flex-wrap: wrap; gap: 15px; }
.jab-card.jab-card--meta a { color: var(--ast-global-color-1); transition: .3s ease-out; }
.jab-card.jab-card--meta a:hover, .jab-card.jab-card--meta a:focus { color: var(--ast-global-color-7); transition: .3s ease-out; }

/* Related tracks (“More Like This”) */
.single-jab_track .jab-related-tracks { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.single-jab_track .jab-related-track { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 16px; border: 1px solid rgba(255, 255, 255, .14); border-radius: 14px; background: rgba(0, 0, 0, .22); }
.single-jab_track .jab-related-title { color: rgba(255, 255, 255, .92); font-weight: 700; letter-spacing: .02em; }

/* Optional future markup: <a class="jab-related-link"> */
.single-jab_track .jab-related-link { color: rgba(255, 255, 255, .92); text-decoration: none; font-weight: 700; letter-spacing: .02em; }
.single-jab_track .jab-related-link:hover { text-decoration: underline; text-underline-offset: 3px; }

/* =========================================
   5) Archives & Collections (Tracks / Albums)
========================================= */

/* Track archive wrapper */
.post-type-archive-jab_track .jab-tracks-archive { max-width: 1100px; margin: 0 auto; padding: 30px 18px 80px; }

/* Albums archive wrapper matches Tracks archive spacing */
.jab-albums-archive { max-width: 1100px; margin: 0 auto; padding: 30px 18px 80px; }

/* Collection grid used by your shortcodes */
.jab-media-collection { display: grid; gap: 18px; max-width: 1064px; margin: 0 auto; }

/* Album cards (cover + description) */
.jab-card--album .jab-album-cover-wrap { aspect-ratio: 1 / 1; border-radius: 12px; overflow: hidden; margin-bottom: 10px; background: rgba(255, 255, 255, .06); }
.jab-card--album .jab-album-cover { width: 100%; height: 100%; object-fit: cover; display: block; }
.jab-card--album .jab-album-desc { font: 300 14px/1.6 system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif; opacity: .9; margin-top: 10px; }
.jab-album-head { display: block; text-decoration: none; }
.jab-album-head:hover .jab-album-title { text-decoration: underline; }
.jab-album-cover-wrap { aspect-ratio: 1 / 1; width: 100%; }
.jab-album-cover { width: 100%; height: auto; display: block; }

/* =========================================
   5) Albums
========================================= */

/* Full-width layout for Album taxonomy pages */
.tax-jab_album .ast-container { display: block; }
.tax-jab_album #primary { width: 100% !important; max-width: 100% !important; flex: 0 0 100% !important; }
.tax-jab_album #secondary { display: none !important; }

/* =========================================
   6) Pagination (Astra) on Dark Stage
========================================= */
.post-type-archive-jab_track .ast-pagination .page-numbers { background: rgba(0, 0, 0, 0); border: 0; color: #fff; transition: .3s ease-out; }
.post-type-archive-jab_track .ast-pagination .current { background: var(--ast-global-color-1); color: var(--ast-global-color-7); transition: .3s ease-out; }
.post-type-archive-jab_track .ast-pagination .page-numbers:hover, .post-type-archive-jab_track .ast-pagination .page-numbers:focus { background: var(--ast-global-color-1); color: var(--ast-global-color-7); transition: .3s ease-out; }
.post-type-archive-jab_track .ast-pagination .next.page-numbers, .post-type-archive-jab_track .ast-pagination .prev.page-numbers { border: 0; color: var(--ast-global-color-7); transition: .3s ease-out; }
.post-type-archive-jab_track .ast-pagination .next.page-numbers:hover, .post-type-archive-jab_track .ast-pagination .prev.page-numbers:hover, .post-type-archive-jab_track .ast-pagination .next.page-numbers:focus, .post-type-archive-jab_track .ast-pagination .prev.page-numbers:focus { border: 0; background: transparent; color: var(--ast-global-color-1); transition: .3s ease-out; }

/* lists */
ul.wp-block-list.has-ast-global-color-7-color a { color: var(--ast-global-color-1); transition: .3s ease-out; }
ul.wp-block-list.has-ast-global-color-7-color a:hover, ul.wp-block-list.has-ast-global-color-7-color a:focus { color: var(--ast-global-color-7); transition: .3s ease-out; }
@media screen and (max-width:921px) {
   body.archive .ast-archive-description { text-align: center; }
}
@media screen and (max-width:767px) {
   body .jab-track-single .jab-container, body.post-type-archive-jab_track .jab-container, .jab_track-template-default.single.single-jab_track .jab-track-single { padding: 0; }
   .jab-hero-actions { display: flex; gap: 10px; flex-wrap: wrap; justify-content: center; }
   .jab-track-single .jab-track-hero { padding: 56px 20px 30px; margin-top: 60px; }
   .tax-jab_album #primary { padding-left: 20px; padding-right: 20px; }
}
@media screen and (max-width:640px) {
   .jab-btn.jab-btn--primary { flex: 0 0 100%; width: 100%; }
}
.jab-embed-actions { display: flex; gap: 10px; align-items: center; justify-content: center; flex-wrap: wrap }
.jab-embed-open { white-space: nowrap }

/* =========================================
   Blog
========================================= */
/* Force Spectra blocks to match Astra content width */
.single-post .entry-content[data-ast-blocks-layout]
.wp-block-uagb-advanced-heading {
    max-width: var(--wp--custom--ast-content-width-size);
    margin-left: auto;
    margin-right: auto;
}
.ast-blog-layout-4-grid .ast-article-inner .wp-post-image { object-fit: cover; }
p.ast-terms-link a { text-transform: uppercase; font-weight: 500; letter-spacing: 1px; }
.post-intro {
    font-size: clamp(1.45rem, 1.2rem + 1vw, 1.65rem);
    line-height: 1.2;
    font-weight: 500;
    letter-spacing: 0.2px;
    color: #1f2937;
    margin-bottom: 2rem;
}
@media screen and (max-width:921px) {
   .ast-separate-container .site-content .ast-single-post-featured-section + article { margin-top: 10px; padding-left: 0; padding-right: 0; }
   header.entry-header .post-thumb img, .ast-single-post-featured-section.post-thumb img {
    aspect-ratio: 3 / 2;
}
}
