/*
Theme Name:        Anthony Patterson Child
Theme URI:         https://anthonypatterson.com
Author:            Anthony Patterson
Author URI:        https://anthonypatterson.com
Description:       Child theme for Anthony Patterson. Override styles and templates here without touching the parent theme. Includes custom branding slots (logo, favicon, Open Graph image), full social sharing integration, and responsive polish. Requires the "Anthony Patterson" parent theme to be installed.
Template:          anthony-patterson-wp
Version:           1.0.0
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:       anthony-patterson-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 */
