/*
Theme Name: White Daisy Weddings
Theme URI: https://whitedaisystudios.com/
Author: White Daisy Studios
Author URI: https://whitedaisystudios.com/
Description: Ultra-luxury fine art wedding and editorial photography theme inspired by Blush Wedding Photography. Featuring Cormorant Garamond typography, responsive portfolio filtering, fullscreen lightbox, vendor directory, bespoke inquiry experience, and branded favicon suite.
Version: 1.2.4
Tested up to: 6.7
Requires at least: 6.0
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: white-daisy
Tags: photography, portfolio, grid-layout, custom-menu, featured-images, full-width-template, theme-options, translation-ready
*/

/* ==========================================================================
   White Daisy Weddings — Fine Art Luxury Editorial Design System
   Inspired by Blush Wedding Photography (blushweddingphotography.org)
   Vancouver Flagship & Worldwide Destinations
   ========================================================================== */

/* 1. Color Palette Tokens */
:root {
  /* Surfaces & Canvases */
  --color-canvas: #FFFFFF;
  --color-canvas-subtle: #FAF9F6;      /* Fine Art Cotton Paper */
  --color-canvas-warm: #F5F2EB;        /* Warm Alabaster Linen */
  --color-canvas-blush: #F9F4F2;       /* Soft Whispering Blush */

  /* Text & Ink */
  --color-ink-primary: #1C1B1A;        /* Deep Charcoal / Soft Black */
  --color-ink-secondary: #524F4C;      /* Muted Warm Slate */
  --color-ink-muted: #524F4C;          /* Muted Warm Slate (WCAG AAA compliant) */
  --color-ink-light: #6E6862;          /* Subtle Caption Slate */

  /* Accents & Metallics */
  --color-blush-accent: #E5D5D0;       /* Fine Art Rose Dust */
  --color-blush-deep: #C7ABA3;         /* Antique Rose */
  --color-gold-accent: #C5A880;        /* Burnished Champagne Gold */
  --color-gold-deep: #7D5E33;          /* Rich Antique Bronze (WCAG AA compliant) */

  /* Borders & Dividers */
  --border-subtle: rgba(28, 27, 26, 0.08);
  --border-medium: rgba(28, 27, 26, 0.15);
  --border-blush: rgba(229, 213, 208, 0.4);

  /* Typography Stacks */
  --font-serif: 'Cormorant Garamond', 'EB Garamond', Garamond, 'Playfair Display', Georgia, serif;
  --font-sans: 'Plus Jakarta Sans', 'Montserrat', -apple-system, BlinkMacSystemFont, sans-serif;

  /* Smooth Motion */
  --ease-fine-art: cubic-bezier(0.25, 1, 0.5, 1);
  --duration-normal: 400ms;
}

/* Global Resets */
*, *::before, *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html {
  scroll-behavior: smooth;
  font-size: 16px;
  background-color: var(--color-canvas);
  color: var(--color-ink-primary);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

body {
  font-family: var(--font-sans);
  font-weight: 300;
  line-height: 1.8;
  color: var(--color-ink-primary);
  background-color: var(--color-canvas);
  overflow-x: hidden;
}

/* Typography Utilities */
.font-serif {
  font-family: var(--font-serif);
}

.font-sans {
  font-family: var(--font-sans);
}

/* Selection Color */
::selection {
  background-color: rgba(229, 213, 208, 0.45);
  color: var(--color-ink-primary);
}

/* Header & Navigation Styling */
.header-top-bar {
  background-color: var(--color-canvas-subtle);
  border-bottom: 1px solid var(--border-subtle);
  font-family: var(--font-sans);
  font-size: 0.65rem;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  color: var(--color-ink-muted);
  transition: all 0.3s ease;
}

@media (max-width: 1023px) {
  .header-top-bar {
    display: none !important;
  }
}

.blush-header {
  position: relative;
  background: #FFFFFF;
  border-bottom: 1px solid var(--border-subtle);
}

/* Editorial Masthead & Navigation Proportions (Breathing Room Architecture) */
.editorial-masthead {
  padding-top: 34px;
  padding-bottom: 22px;
}

.editorial-nav-bar {
  display: flex;
  align-items: center;
  justify-content: center;
  border-top: 1px solid var(--border-subtle);
  padding: 22px 0;
  gap: 48px;
}

@media (min-width: 1280px) {
  .editorial-nav-bar {
    gap: 60px;
    padding: 24px 0;
  }
}

.mobile-nav-drawer {
  max-height: calc(100vh - 80px);
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}

/* Nav Item & Dropdowns (Haute Editorial Breathing Room) */
.nav-link {
  font-family: var(--font-sans);
  font-size: 0.76rem;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  color: var(--color-ink-primary);
  text-decoration: none;
  font-weight: 400;
  transition: color 0.3s ease;
  position: relative;
  padding: 10px 4px;
  display: inline-flex;
  align-items: center;
}

.nav-link:hover,
.nav-link.active {
  color: var(--color-gold-deep);
}

/* Subtle centered micro-dash active/hover indicator (Vogue / Blush style) */
.nav-link::after {
  content: '';
  position: absolute;
  bottom: 0px;
  left: 50%;
  width: 0;
  height: 1.5px;
  background-color: var(--color-gold-deep);
  transform: translateX(-50%);
  transition: width 0.3s var(--ease-fine-art);
}

.nav-link:hover::after,
.nav-link.active::after {
  width: 18px;
}

/* Elegant Fine-Line Inquire Button */
.nav-inquire-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 9px 24px;
  font-family: var(--font-sans);
  font-size: 0.70rem;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  color: var(--color-ink-primary);
  border: 1px solid rgba(28, 27, 26, 0.34);
  text-decoration: none;
  font-weight: 400;
  transition: all 0.35s var(--ease-fine-art);
  border-radius: 0;
  background-color: transparent;
}

.nav-inquire-btn:hover {
  background-color: var(--color-ink-primary);
  color: #FFFFFF;
  border-color: var(--color-ink-primary);
  transform: translateY(-1px);
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.08);
}

/* Dropdown Menu Container (Spacious Editorial Layout) */
.dropdown-parent {
  position: relative;
}

/* Invisible hit-bridge preventing premature close on mouse movement */
.dropdown-parent::after {
  content: '';
  position: absolute;
  top: 100%;
  left: -12px;
  right: -12px;
  height: 18px;
  background: transparent;
  z-index: 99;
}

.dropdown-menu {
  position: absolute;
  top: calc(100% + 10px);
  left: 50%;
  transform: translateX(-50%) translateY(8px);
  background: #FFFFFF;
  border: 1px solid var(--border-subtle);
  padding: 24px 28px;
  min-width: 270px;
  box-shadow: 0 20px 45px rgba(0, 0, 0, 0.08);
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s var(--ease-fine-art), transform 0.3s var(--ease-fine-art), visibility 0.3s;
  z-index: 100;
  text-align: left;
}

.dropdown-parent:hover .dropdown-menu,
.dropdown-parent:focus-within .dropdown-menu {
  opacity: 1;
  visibility: visible;
  transform: translateX(-50%) translateY(0);
}

.dropdown-item {
  display: block;
  font-family: var(--font-sans);
  font-size: 0.72rem;
  letter-spacing: 0.20em;
  text-transform: uppercase;
  color: var(--color-ink-secondary);
  padding: 11px 0;
  text-decoration: none;
  transition: color 0.25s ease, transform 0.25s ease;
  border-bottom: 1px solid rgba(28, 27, 26, 0.05);
}

.dropdown-item:first-child {
  padding-top: 2px;
}

.dropdown-item:last-child {
  border-bottom: none;
  padding-bottom: 2px;
}

.dropdown-item:hover {
  color: var(--color-gold-deep);
  transform: translateX(5px);
}

/* Fine Art Buttons */
.btn-blush-primary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 14px 34px;
  background-color: var(--color-ink-primary);
  color: #FFFFFF;
  font-family: var(--font-sans);
  font-size: 0.75rem;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  text-decoration: none;
  font-weight: 400;
  border: 1px solid var(--color-ink-primary);
  cursor: pointer;
  transition: all 0.4s var(--ease-fine-art);
}

.btn-blush-primary:hover {
  background-color: #FFFFFF;
  color: var(--color-ink-primary);
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
}

.btn-blush-outline {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 14px 34px;
  background-color: transparent;
  color: var(--color-ink-primary);
  font-family: var(--font-sans);
  font-size: 0.75rem;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  text-decoration: none;
  font-weight: 400;
  border: 1px solid var(--color-ink-primary);
  cursor: pointer;
  transition: all 0.4s var(--ease-fine-art);
}

.btn-blush-outline:hover {
  background-color: var(--color-ink-primary);
  color: #FFFFFF;
  transform: translateY(-2px);
}

.btn-blush-gold {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 14px 34px;
  background-color: var(--color-gold-accent);
  color: #FFFFFF;
  font-family: var(--font-sans);
  font-size: 0.75rem;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  text-decoration: none;
  font-weight: 400;
  border: 1px solid var(--color-gold-accent);
  cursor: pointer;
  transition: all 0.4s var(--ease-fine-art);
}

.btn-blush-gold:hover {
  background-color: var(--color-gold-deep);
  border-color: var(--color-gold-deep);
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(197, 168, 128, 0.25);
}

/* Delicate Underline Link */
.blush-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-family: var(--font-sans);
  font-size: 0.76rem;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--color-ink-primary);
  text-decoration: none;
  padding-bottom: 3px;
  border-bottom: 1px solid var(--color-ink-primary);
  transition: all 0.3s ease;
}

.blush-link:hover {
  color: var(--color-gold-deep);
  border-bottom-color: var(--color-gold-deep);
  padding-left: 6px;
}

/* Editorial Portfolio Frame & Image Effects */
.fineart-frame {
  position: relative;
  overflow: hidden;
  background-color: #F2EFE9;
}

.fineart-frame img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 1.2s var(--ease-fine-art), filter 0.8s ease;
}

.fineart-frame:hover img {
  transform: scale(1.035);
}

/* Numbered Portfolio Pillar Card (01 Engagements, 02 Weddings, 03 Lifestyle) */
.portfolio-pillar-card {
  position: relative;
  transition: transform 0.6s var(--ease-fine-art);
}

.portfolio-pillar-card:hover {
  transform: translateY(-6px);
}

.portfolio-pillar-number {
  font-family: var(--font-serif);
  font-size: 1.4rem;
  font-style: italic;
  color: var(--color-gold-deep);
}

/* Blush Editorial Vertical Line Accent */
.editorial-line {
  width: 1px;
  height: 48px;
  background-color: var(--color-ink-muted);
  opacity: 0.35;
  margin: 0 auto 16px auto;
}

/* Awards & Street Cred Block */
.awards-banner {
  background-color: var(--color-canvas-subtle);
  border-top: 1px solid var(--border-subtle);
  border-bottom: 1px solid var(--border-subtle);
}

/* Publication Badges */
.publication-logo {
  filter: grayscale(100%) opacity(0.65);
  transition: all 0.3s ease;
}

.publication-logo:hover {
  filter: grayscale(0%) opacity(1);
  transform: scale(1.04);
}

/* Testimonial Quote Cards */
.quote-card {
  background: #FFFFFF;
  border: 1px solid var(--border-subtle);
  padding: 44px;
  transition: transform 0.4s var(--ease-fine-art), box-shadow 0.4s ease;
}

.quote-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 16px 36px rgba(0, 0, 0, 0.05);
}

/* Fine Art Underline Input Fields */
.blush-input {
  width: 100%;
  background: transparent;
  border: none;
  border-bottom: 1px solid var(--border-medium);
  padding: 14px 0;
  font-family: var(--font-sans);
  font-size: 0.9rem;
  color: var(--color-ink-primary);
  outline: none;
  border-radius: 0;
  transition: border-color 0.3s ease;
}

.blush-input:focus {
  border-bottom-color: var(--color-gold-deep);
}

.blush-input::placeholder {
  color: var(--color-ink-light);
  font-weight: 300;
  font-size: 0.85rem;
}

/* Scroll Cue Animation */
@keyframes scrollIndicator {
  0% { transform: scaleY(0); transform-origin: top; }
  50% { transform: scaleY(1); transform-origin: top; }
  50.1% { transform: scaleY(1); transform-origin: bottom; }
  100% { transform: scaleY(0); transform-origin: bottom; }
}

.scroll-line {
  width: 1px;
  height: 44px;
  background-color: var(--color-ink-primary);
  margin: 0 auto;
  animation: scrollIndicator 2.2s cubic-bezier(0.65, 0, 0.35, 1) infinite;
}

/* Custom Scrollbar */
::-webkit-scrollbar {
  width: 6px;
}
::-webkit-scrollbar-track {
  background: #FAF9F6;
}
::-webkit-scrollbar-thumb {
  background: #D9D3CA;
}
::-webkit-scrollbar-thumb:hover {
  background: var(--color-gold-deep);
}

/* Lightbox Dark Scrollbar Utility */
.scrollbar-thin::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}
.scrollbar-thin::-webkit-scrollbar-track {
  background: rgba(255, 255, 255, 0.05);
}
.scrollbar-thin::-webkit-scrollbar-thumb {
  background: rgba(197, 168, 128, 0.45);
  border-radius: 3px;
}
.scrollbar-thin::-webkit-scrollbar-thumb:hover {
  background: rgba(197, 168, 128, 0.85);
}

/* ==========================================================================
   Hero Luxury Editorial Auto-Slider
   ========================================================================== */
.hero-slide {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  visibility: hidden;
  z-index: 0;
  transition: opacity 1.4s cubic-bezier(0.25, 1, 0.5, 1), visibility 1.4s cubic-bezier(0.25, 1, 0.5, 1);
  will-change: opacity, transform;
}

.hero-slide.is-active {
  opacity: 1 !important;
  visibility: visible !important;
  z-index: 5;
}

.hero-slide-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  transform: scale(1.0);
  transition: transform 7.5s cubic-bezier(0.25, 1, 0.5, 1);
}

.hero-slide.is-active .hero-slide-img {
  transform: scale(1.045);
}

@media (prefers-reduced-motion: reduce) {
  .hero-slide {
    transition: opacity 0.5s ease;
  }
  .hero-slide.is-active .hero-slide-img,
  .hero-slide-img {
    transform: none !important;
    transition: none !important;
  }
}

.hero-dot {
  cursor: pointer;
  transition: all 0.4s cubic-bezier(0.25, 1, 0.5, 1);
}

.hero-dot.is-active {
  background-color: #FFFFFF !important;
  opacity: 1 !important;
  width: 2rem !important;
}

/* ==========================================================================
   Smash Balloon Live Instagram Feed — Ultra-Luxury Editorial Styling
   ========================================================================== */
#sb_instagram {
  padding: 0 !important;
  width: 100% !important;
  background: transparent !important;
}

#sb_instagram #sbi_images {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 1rem !important;
  padding: 0 !important;
}

@media (min-width: 768px) {
  #sb_instagram #sbi_images {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 1.5rem !important;
  }
}

#sb_instagram .sbi_item {
  aspect-ratio: 1 / 1 !important;
  overflow: hidden !important;
  position: relative !important;
  border: 1px solid rgba(28, 27, 26, 0.08) !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04) !important;
  transition: all 0.5s ease !important;
  background-color: #FBF9F5 !important;
}

#sb_instagram .sbi_photo_wrap {
  height: 100% !important;
  width: 100% !important;
}

#sb_instagram .sbi_photo {
  height: 100% !important;
  width: 100% !important;
  object-fit: cover !important;
  transition: transform 0.7s cubic-bezier(0.25, 1, 0.5, 1) !important;
}

#sb_instagram .sbi_item:hover .sbi_photo {
  transform: scale(1.06) !important;
}

#sb_instagram .sbi_header,
#sb_instagram .sbi_load_btn,
#sb_instagram .sbi_follow_btn {
  display: none !important;
}

