/* Custom styles for Deysi & Laurent's Wedding Website */

/* --- NEW SHIMMER ANIMATION --- */
@keyframes shimmer {
    0% { text-shadow: 0 0 4px rgba(233, 196, 106, 0.2); }
    50% { text-shadow: 0 0 16px rgba(233, 196, 106, 0.8); }
    100% { text-shadow: 0 0 4px rgba(233, 196, 106, 0.2); }
  }
  
  /* Base font settings and custom theme colors */
  body {
      font-family: 'Poppins', sans-serif;
      scroll-behavior: smooth;
      color: #3A5A40;
  }
  h1, h2, h3, h4, .font-serif {
      font-family: 'Playfair Display', serif;
  }
  
  /* Custom Background Classes */
  .bg-creamy-white { background-color: #FDFDF7; }
  .bg-sage-green { background-color: #DDE5B6; }
  
  /* --- BRILLI-BRILLI COLOR SCHEME --- */
  .text-gold-metallic {
      font-family: 'Great Vibes', cursive;
      background: linear-gradient(140deg, #c09f4d 0%, #d4af37 50%, #c09f4d 100%);
      -webkit-background-clip: text;
      background-clip: text;
      color: transparent;
      text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.1);
      line-height: 1.5 !important;
  }

  .wedding-rings-image {
      height: 125px;
      margin: 1.5rem auto 0;
      filter: drop-shadow(1px 1px 2px rgba(0,0,0,0.1));
      mix-blend-mode: multiply;
      opacity: 0.9;
  }
  
  .info-title, .timeline-content h3 {
      background: linear-gradient(125deg, #EACD83, #D4AF37, #EACD83);
      -webkit-background-clip: text;
      background-clip: text;
      color: transparent;
      animation: shimmer 5s infinite linear;
  }
  
  .section-title-wrapper {
      position: relative;
      text-align: center;
      padding: 10px 0;
  }
  .section-title-wrapper::before, .section-title-wrapper::after {
      content: ''; position: absolute; left: 50%; transform: translateX(-50%);
      width: 100px; height: 1px;
      background: linear-gradient(90deg, rgba(233, 196, 106, 0), #E9C46A, rgba(233, 196, 106, 0));
  }
  .section-title-wrapper::before { top: 0; }
  .section-title-wrapper::after { bottom: 0; }
  
  .section-title {
      color: #3A5A40; font-size: 2.25rem; line-height: 2.5rem;
      font-weight: 700; text-align: center; padding: 0 20px;
  }
  @media (min-width: 768px) {
      .section-title { font-size: 3rem; line-height: 1; }
  }
  
  .info-title { font-size: 1.875rem; line-height: 2.25rem; }
  .timeline-content h3 { font-size: 1.5rem; line-height: 2rem; font-weight: 700; }
  
  .lang-btn.active { background-color: #F1E4C3; color: #3A5A40; font-weight: 600; }
  .timeline-item::after { border-color: #E9C46A; }

  /* --- NEW BANK DETAILS STYLES --- */
  .bank-details {
      border: 1px solid #e2e8f0;
      border-radius: 0.5rem;
      padding: 1rem;
      background-color: #fafaf9;
  }
  .detail-item {
      margin-bottom: 0.75rem;
  }
  .detail-label {
      display: block;
      font-size: 0.875rem;
      color: #6b7280;
  }
  .copy-button {
      background-color: #E9C46A;
      color: #3A5A40;
      border: none;
      border-radius: 0.375rem;
      padding: 0.25rem 0.6rem;
      cursor: pointer;
      transition: background-color 0.2s;
  }
  .copy-button:hover {
      background-color: #d4af37;
  }
  .copy-button.copied {
    background-color: #3A5A40;
    color: #F1E4C3;
  }

  /* --- REFINED GALLERY STYLES --- */
  .gallery-container {
      max-width: 900px;
      margin: 3rem auto 0;
      padding: 0 1.5rem;
  }

  .gallery-thumbnail {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 0.5rem;
    cursor: pointer;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    box-shadow: 0 4px 6px rgba(0,0,0,0.1);
  }
  .gallery-thumbnail:hover { 
      transform: scale(1.05);
      box-shadow: 0 10px 15px rgba(0,0,0,0.1);
   }

  .object-right-center {
      object-position: 78% 50%; 
  }
  
  .timeline { position: relative; }
  .timeline::before {
      content: ''; position: absolute; left: 50%; transform: translateX(-50%); top: 0;
      width: 2px; height: 100%; background-color: #e2e8f0;
  }
  .timeline-item { position: relative; width: 50%; padding: 20px 40px; box-sizing: border-box; }
  .timeline-item:nth-child(odd) { left: 0; padding-right: 60px; text-align: right; }
  .timeline-item:nth-child(even) { left: 50%; padding-left: 60px; text-align: left; }
  .timeline-item::after {
      content: ''; position: absolute; width: 20px; height: 20px; background-color: white;
      border: 4px solid; border-radius: 9999px; top: 50%; transform: translateY(-50%); z-index: 1;
  }
  .timeline-item:nth-child(odd)::after { right: -10px; }
  .timeline-item:nth-child(even)::after { left: -10px; }
  .timeline-content p { color: #4b5563; margin-top: 0.25rem; }
  
  @media screen and (max-width: 768px) {
      .timeline::before { left: 31px; }
      .timeline-item { width: 100%; padding-left: 70px; padding-right: 25px; }
      .timeline-item:nth-child(odd), .timeline-item:nth-child(even) { left: 0; text-align: left; }
      .timeline-item:nth-child(odd)::after, .timeline-item:nth-child(even)::after { left: 22px; }
  }
  
  .aspect-w-16 { position: relative; padding-bottom: 56.25%; }
  .aspect-w-16 > * { position: absolute; height: 100%; width: 100%; top: 0; right: 0; bottom: 0; left: 0; }