/*
Theme Name:        Artist One Page Child
Theme URI:         https://your-website.com
Author:            Your Artist Name
Author URI:        https://your-website.com
Description:       Child theme for Your Artist Name. Override styles and templates here without touching the parent theme. Includes custom branding slots (logo, favicon, Open Graph image), full social sharing integration, responsive polish, and the Press/EPK page template. Synced with parent v1.2 — Show Dates, Music Videos (Customizer columns control), Sticky Player, and Press/EPK. Requires the "Artist One Page" parent theme to be installed.
Template:          artist-one-page
Version:           2.0.3
Requires at least: 6.0
Tested up to:      6.5
Requires PHP:      8.0
License:           GNU General Public License v2 or later
License URI:       https://www.gnu.org/licenses/gpl-2.0.html
Text Domain:       artist-one-page-child
Tags:              child-theme, one-page, music, woocommerce, social-sharing, responsive, dark, western
*/

/* ═══════════════════════════════════════════════════════════
   ANTHONY PATTERSON — CHILD THEME STYLESHEET
   -------------------------------------------------------
   HOW TO USE:
   • Add your custom CSS overrides BELOW this comment block.
   • The parent theme's style.css loads first automatically.
   • All parent CSS custom properties (--ap-*) are available.
   • To change a color, override the custom property here:
       :root { --ap-color-copper: #c0703a; }
   ═══════════════════════════════════════════════════════════ */

/* ── CUSTOM PROPERTY OVERRIDES ───────────────────────────── */
/* Uncomment and edit any of these to restyle the theme:     */

/*
:root {
  --ap-color-copper:        #b87333;
  --ap-color-copper-light:  #d4944a;
  --ap-color-gold:          #c8922a;
  --ap-color-gold-light:    #e8b84a;
  --ap-color-bg:            #0e0c08;
  --ap-color-text:          #e8dcc8;
  --ap-font-display:        'Playfair Display', Georgia, serif;
  --ap-font-body:           'Lato', 'Helvetica Neue', Arial, sans-serif;
}
*/

/* ── SOCIAL SHARING — FULL-PAGE SHARE BAR ────────────────── */
.apcs-share-bar {
  position: fixed;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  z-index: 900;
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  padding: 0.5rem 0;
}

.apcs-share-bar-btn {
  width: 44px;
  height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 0 var(--ap-radius-md, 0.5rem) var(--ap-radius-md, 0.5rem) 0;
  border: none;
  cursor: pointer;
  text-decoration: none;
  transition: all 200ms cubic-bezier(0.16, 1, 0.3, 1);
  color: #fff;
  transform: translateX(-4px);
  box-shadow: 2px 2px 8px rgba(0,0,0,0.4);
}
.apcs-share-bar-btn:hover {
  transform: translateX(0);
  box-shadow: 4px 4px 16px rgba(0,0,0,0.5);
  color: #fff;
}
.apcs-share-bar-btn.fb  { background: #1877f2; }
.apcs-share-bar-btn.tw  { background: #000; }
.apcs-share-bar-btn.ig  { background: linear-gradient(45deg,#f09433,#e6683c,#dc2743,#cc2366,#bc1888); }
.apcs-share-bar-btn.tk  { background: #010101; }
.apcs-share-bar-btn.cp  { background: var(--ap-color-copper, #b87333); }
.apcs-share-bar-btn.wapp { background: #25d366; }

/* Tooltip labels */
.apcs-share-bar-btn::after {
  content: attr(data-label);
  position: absolute;
  left: 52px;
  background: rgba(14,12,8,0.92);
  color: var(--ap-color-gold-light, #e8b84a);
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  padding: 0.25rem 0.5rem;
  border-radius: 0.25rem;
  white-space: nowrap;
  opacity: 0;
  pointer-events: none;
  transition: opacity 200ms ease;
  border: 1px solid var(--ap-color-border, #3a3020);
}
.apcs-share-bar-btn:hover::after { opacity: 1; }

/* ── SECTION SHARE BUTTONS ───────────────────────────────── */
.apcs-section-share {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  flex-wrap: wrap;
  margin-top: 2rem;
  padding-top: 1.5rem;
  border-top: 1px solid var(--ap-color-border, #3a3020);
}

.apcs-section-share-label {
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--ap-color-text-faint, #5a4e3a);
  margin-right: 0.25rem;
}

.apcs-section-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  padding: 0.375rem 0.875rem;
  border-radius: 9999px;
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  text-decoration: none;
  transition: all 200ms cubic-bezier(0.16,1,0.3,1);
  border: none;
  cursor: pointer;
  color: #fff;
  white-space: nowrap;
}
.apcs-section-btn:hover { opacity: 0.88; transform: translateY(-1px); color: #fff; }
.apcs-section-btn.fb   { background: #1877f2; }
.apcs-section-btn.tw   { background: #000; }
.apcs-section-btn.wapp { background: #25d366; }
.apcs-section-btn.cp   { background: var(--ap-color-copper, #b87333); color: #0e0c08; }

/* Copy success flash */
.apcs-section-btn.cp.copied {
  background: var(--ap-color-patina, #5a7a60);
}

/* ── RESPONSIVE — HIDE SIDE BAR ON MOBILE ────────────────── */
@media (max-width: 768px) {
  .apcs-share-bar {
    position: relative;
    left: auto;
    top: auto;
    transform: none;
    flex-direction: row;
    justify-content: center;
    padding: 0.75rem 1rem;
    background: var(--ap-color-surface, #151209);
    border-bottom: 1px solid var(--ap-color-border, #3a3020);
    flex-wrap: wrap;
    gap: 0.5rem;
    order: -1;
  }
  .apcs-share-bar-btn {
    border-radius: var(--ap-radius-full, 9999px);
    transform: none;
    width: 40px;
    height: 40px;
  }
  .apcs-share-bar-btn::after { display: none; }
  body { padding-left: 0 !important; }
}

/* Desktop — push content right to avoid overlap with share bar */
@media (min-width: 769px) {
  body.has-share-bar {
    padding-left: 44px;
  }
  #ap-header {
    left: 44px;
  }
}

/* ── RESPONSIVE POLISH (child overrides) ─────────────────── */

/* Ensure slider images are not cropped on small screens */
@media (max-width: 480px) {
  #ap-hero {
    min-height: 420px;
    height: 70svh;
  }
  .ap-slide img {
    object-position: 65% center;
  }
}

/* Tighter section padding on phones */
@media (max-width: 480px) {
  #ap-music,
  #ap-store,
  #ap-bookings {
    padding-left: 1rem;
    padding-right: 1rem;
  }
  .ap-form-wrap {
    padding: 1.25rem;
  }
  .ap-player-container {
    padding: 1.25rem;
  }
}

/* Wrap long email addresses in contact cards */
.ap-contact-value {
  word-break: break-all;
}

/* Stack product grid to 1 column on very small screens */
@media (max-width: 340px) {
  .ap-product-grid {
    grid-template-columns: 1fr !important;
  }
}

/* Make track list scroll horizontally on very small screens */
@media (max-width: 380px) {
  .ap-track-item {
    grid-template-columns: 32px 1fr auto;
    gap: 0.5rem;
    padding: 0.75rem 0.75rem;
  }
}

/* Booking form: single-column on mobile */
@media (max-width: 600px) {
  .ap-bookings-layout {
    gap: 2rem;
  }
  .ap-form-grid {
    grid-template-columns: 1fr;
  }
}

/* Footer: stack on mobile */
@media (max-width: 600px) {
  .ap-footer-inner {
    grid-template-columns: 1fr;
    text-align: center;
    gap: 1.5rem;
  }
  .ap-footer-nav {
    flex-wrap: wrap;
    justify-content: center;
  }
  .ap-footer-social {
    justify-content: center;
  }
}

/* ── CUSTOM BRANDING OVERRIDES ───────────────────────────── */
/* Logo image sizing — override when using a real logo image */
.ap-logo img {
  max-height: 48px;
  width: auto;
}

/* Favicon is set via wp_head in functions.php */

/* ═══════════════════════════════════════════════════════════
   TOUR DATES SECTION (#ap-tour)
   Added by child theme — CPT-driven, images + Google Maps +
   multiple ticket vendor links.
   ═══════════════════════════════════════════════════════════ */

#ap-tour {
	padding: clamp(3rem, 6vw, 6rem) clamp(1rem, 5vw, 3rem);
	background: var(--ap-color-bg);
}

.ap-tour-list {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
	gap: clamp(1.25rem, 3vw, 2rem);
	max-width: 1200px;
	margin: 0 auto;
}

.ap-tour-card {
	display: flex;
	flex-direction: column;
	background: var(--ap-color-surface);
	border: 1px solid var(--ap-color-border);
	border-radius: var(--ap-radius-lg);
	overflow: hidden;
	box-shadow: var(--ap-shadow-md);
	transition: transform var(--ap-trans), box-shadow var(--ap-trans), border-color var(--ap-trans);
}
.ap-tour-card:hover {
	transform: translateY(-4px);
	box-shadow: var(--ap-shadow-lg);
	border-color: var(--ap-color-copper-dark);
}
.ap-tour-card--past { opacity: 0.55; filter: saturate(0.6); }
.ap-tour-card--sold_out .ap-tour-venue::after {
	content: " · Sold Out";
	color: var(--ap-color-text-faint);
	font-size: 0.7em;
	font-family: var(--ap-font-body);
}

/* Media + date badge */
.ap-tour-media {
	position: relative;
	aspect-ratio: 16 / 9;
	overflow: hidden;
	background: var(--ap-color-surface-2);
}
.ap-tour-media img {
	width: 100%; height: 100%;
	object-fit: cover;
	display: block;
	transition: transform var(--ap-trans-slow);
}
.ap-tour-card:hover .ap-tour-media img { transform: scale(1.05); }

.ap-tour-datebadge {
	position: absolute;
	top: 12px; left: 12px;
	display: flex; flex-direction: column;
	align-items: center; justify-content: center;
	min-width: 58px; padding: 6px 8px;
	background: linear-gradient(135deg, var(--ap-color-copper), var(--ap-color-bronze));
	border-radius: var(--ap-radius-md);
	box-shadow: var(--ap-shadow-md);
	color: #fff; line-height: 1;
	text-align: center;
}
.ap-tour-datebadge--inline {
	position: static;
	margin-bottom: 12px;
	align-self: flex-start;
}
.ap-tour-datebadge__month { font-size: 0.7rem; text-transform: uppercase; letter-spacing: 0.08em; font-weight: 700; }
.ap-tour-datebadge__day   { font-size: 1.6rem; font-weight: 800; font-family: var(--ap-font-display); }
.ap-tour-datebadge__year  { font-size: 0.65rem; opacity: 0.85; }

/* Body */
.ap-tour-body { padding: clamp(1rem, 2.5vw, 1.5rem); display: flex; flex-direction: column; gap: 0.7rem; }
.ap-tour-venue {
	margin: 0;
	font-family: var(--ap-font-display);
	font-size: 1.35rem;
	color: var(--ap-color-gold-light);
	line-height: 1.2;
}
.ap-tour-meta {
	display: flex; flex-wrap: wrap; gap: 0.4rem 1rem;
	color: var(--ap-color-text-muted);
	font-size: 0.9rem;
}
.ap-tour-loc, .ap-tour-time { display: inline-flex; align-items: center; gap: 0.35rem; }
.ap-tour-loc svg, .ap-tour-time svg { color: var(--ap-color-copper-light); flex-shrink: 0; }
.ap-tour-note { margin: 0; color: var(--ap-color-text); font-size: 0.85rem; font-style: italic; }
.ap-tour-desc { color: var(--ap-color-text-muted); font-size: 0.9rem; }
.ap-tour-desc p { margin: 0 0 0.5rem; }

.ap-tour-extra { border-radius: var(--ap-radius-md); overflow: hidden; }
.ap-tour-extra img { width: 100%; height: auto; display: block; }

/* Google map */
.ap-tour-map {
	border-radius: var(--ap-radius-md);
	overflow: hidden;
	border: 1px solid var(--ap-color-border);
}
.ap-tour-map iframe { display: block; width: 100%; }
.ap-tour-directions {
	display: block;
	padding: 0.5rem 0.75rem;
	background: var(--ap-color-surface-2);
	color: var(--ap-color-copper-light);
	font-size: 0.85rem;
	font-weight: 600;
	text-align: right;
	transition: background var(--ap-trans), color var(--ap-trans);
}
.ap-tour-directions:hover { background: var(--ap-color-surface-3); color: var(--ap-color-gold-light); }

/* Ticket actions */
.ap-tour-actions {
	display: flex; flex-wrap: wrap; gap: 0.5rem;
	margin-top: 0.4rem;
}
.ap-tour-actions .ap-btn-show { flex: 1 1 auto; justify-content: center; }

/* Reuse parent badge styles if present; provide fallbacks. */
.ap-tour-actions .ap-show-badge {
	display: inline-flex; align-items: center; justify-content: center;
	padding: 0.55rem 1rem;
	border-radius: var(--ap-radius-sm);
	font-size: 0.8rem; font-weight: 700;
	text-transform: uppercase; letter-spacing: 0.05em;
	border: 1px solid var(--ap-color-border);
	color: var(--ap-color-text-muted);
	width: 100%;
}
.ap-tour-actions .ap-show-badge--sold-out { color: #c46; border-color: #c46; }
.ap-tour-actions .ap-show-badge--past { color: var(--ap-color-text-faint); }

@media (max-width: 640px) {
	.ap-tour-list { grid-template-columns: 1fr; }
}

/* ═══════════════════════════════════════════════════════════
   CUSTOM HOME SECTIONS (Admin → Home Sections)
   Rendered by template-parts/section-custom.php
   ═══════════════════════════════════════════════════════════ */

.ap-custom-section {
	padding: clamp(3rem, 6vw, 6rem) clamp(1rem, 5vw, 3rem);
}
.ap-custom-section--tint-default { background: var(--ap-color-bg); }
.ap-custom-section--tint-surface { background: var(--ap-color-surface); }
.ap-custom-section--tint-accent  {
	background: linear-gradient(135deg,
		rgba(184,115,51,0.10),
		rgba(200,146,42,0.06));
}

.ap-custom-inner { width: 100%; }
.ap-custom-section--contained .ap-custom-inner {
	max-width: 1100px;
	margin-inline: auto;
}
.ap-custom-section--full .ap-custom-inner { max-width: none; }

/* Content typography — inherits theme colors, keeps media tidy */
.ap-custom-content { color: var(--ap-color-text); line-height: 1.7; }
.ap-custom-content > * { margin-top: 0; }
.ap-custom-content p { margin: 0 0 1rem; }
.ap-custom-content h1,
.ap-custom-content h2,
.ap-custom-content h3,
.ap-custom-content h4 {
	font-family: var(--ap-font-display);
	color: var(--ap-color-gold-light);
	line-height: 1.2;
	margin: 1.5rem 0 0.75rem;
}
.ap-custom-content a { color: var(--ap-color-copper-light); }
.ap-custom-content a:hover { color: var(--ap-color-gold-light); }
.ap-custom-content img,
.ap-custom-content video,
.ap-custom-content iframe {
	max-width: 100%;
	height: auto;
	border-radius: var(--ap-radius-md);
	display: block;
}
.ap-custom-content figure { margin: 1.25rem 0; }
.ap-custom-content figcaption {
	color: var(--ap-color-text-muted);
	font-size: 0.85rem;
	margin-top: 0.4rem;
	text-align: center;
}
.ap-custom-content ul,
.ap-custom-content ol { margin: 0 0 1rem 1.25rem; }
.ap-custom-content blockquote {
	border-left: 3px solid var(--ap-color-copper);
	margin: 1.25rem 0;
	padding: 0.25rem 0 0.25rem 1rem;
	color: var(--ap-color-text-muted);
	font-style: italic;
}
.ap-custom-content .wp-block-columns { display: flex; gap: 1.5rem; flex-wrap: wrap; }
.ap-custom-content .wp-block-column { flex: 1; min-width: 240px; }

/* ═══════════════════════════════════════════════════════════
   BLANK CANVAS PAGE TEMPLATE (template-blank.php)
   Minimal, full-width, editor-content-only layout.
   ═══════════════════════════════════════════════════════════ */

.ap-blank-canvas {
	/* Clear the fixed header (~80px) plus breathing room. */
	padding: clamp(6rem, 9vw, 8rem) clamp(1rem, 5vw, 3rem) clamp(3rem, 6vw, 5rem);
	min-height: 60vh;
}
.ap-blank-article {
	max-width: 1100px;
	margin-inline: auto;
}
.ap-blank-header { margin-bottom: 1.5rem; }
.ap-blank-title {
	font-family: var(--ap-font-display);
	font-size: clamp(2rem, 5vw, 3rem);
	color: var(--ap-color-gold-light);
	line-height: 1.15;
	margin: 0;
}
.ap-blank-content { color: var(--ap-color-text); line-height: 1.7; }
.ap-blank-content > *:first-child { margin-top: 0; }
.ap-blank-content p { margin: 0 0 1rem; }
.ap-blank-content h1,
.ap-blank-content h2,
.ap-blank-content h3,
.ap-blank-content h4 {
	font-family: var(--ap-font-display);
	color: var(--ap-color-gold-light);
	line-height: 1.2;
	margin: 1.75rem 0 0.75rem;
}
.ap-blank-content a { color: var(--ap-color-copper-light); }
.ap-blank-content a:hover { color: var(--ap-color-gold-light); }
.ap-blank-content img,
.ap-blank-content video,
.ap-blank-content iframe {
	max-width: 100%;
	height: auto;
	border-radius: var(--ap-radius-md);
	display: block;
}
.ap-blank-content figure { margin: 1.25rem 0; }
.ap-blank-content figcaption {
	color: var(--ap-color-text-muted);
	font-size: 0.85rem;
	margin-top: 0.4rem;
	text-align: center;
}
.ap-blank-content ul,
.ap-blank-content ol { margin: 0 0 1rem 1.25rem; }
.ap-blank-content blockquote {
	border-left: 3px solid var(--ap-color-copper);
	margin: 1.25rem 0;
	padding: 0.25rem 0 0.25rem 1rem;
	color: var(--ap-color-text-muted);
	font-style: italic;
}
.ap-blank-content .wp-block-columns { display: flex; gap: 1.5rem; flex-wrap: wrap; }
.ap-blank-content .wp-block-column { flex: 1; min-width: 240px; }

/* Alignfull / alignwide support inside the blank canvas. */
.ap-blank-content .alignwide { margin-inline: calc(50% - 50vw + 1rem); max-width: 100vw; }
.ap-blank-content .alignfull { margin-inline: calc(50% - 50vw); max-width: 100vw; }

/* When the Blank Canvas hides the header, remove the top offset
   that normally clears the fixed header. */
.ap-blank-canvas--no-header {
	padding-top: clamp(2rem, 5vw, 4rem);
}
body.aopc-no-header { padding-top: 0; }

/* Smooth-scroll fallback + fixed-header offset for anchor targets.
   JS handles the offset precisely; this covers no-JS / native jumps. */
html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
[id^="ap-"] { scroll-margin-top: 90px; }