/* ==========================================================================
   TDA WELLNESS - FAQ & LEGAL PAGES (PRIVACY POLICY, TERMS OF SERVICE)
   Responsive, Luxury D2C Typography & Interactive FAQ UI
   ========================================================================== */

/* -------------------------------------------------------------
   0. CONTAINER & ASTRA/ELEMENTOR FULL-WIDTH RESETS
   ------------------------------------------------------------- */
body.page-template-page-faq,
body.page-template-page-privacy-policy,
body.page-template-page-terms-of-service,
body.page-template-page-terms-and-conditions,
body.page-template-page-shipping-returns,
body.page-template-page-shipping-policy,
body.page-id-faq,
body.page-faq,
body.page-privacy-policy,
body.page-terms-of-service,
body.page-terms-and-conditions,
body.page-shipping-returns,
body.page-shipping-policy {
  background: #FCFBF7 !important;
  background-image: none !important;
  overflow-x: hidden !important;
}

.page-template-page-faq #content,
.page-template-page-faq .site-content,
.page-template-page-faq .ast-container,
.page-template-page-faq #primary,
.page-template-page-faq #main,
.page-template-page-privacy-policy #content,
.page-template-page-privacy-policy .site-content,
.page-template-page-privacy-policy .ast-container,
.page-template-page-privacy-policy #primary,
.page-template-page-privacy-policy #main,
.page-template-page-terms-of-service #content,
.page-template-page-terms-of-service .site-content,
.page-template-page-terms-of-service .ast-container,
.page-template-page-terms-of-service #primary,
.page-template-page-terms-of-service #main,
.page-template-page-terms-and-conditions #content,
.page-template-page-terms-and-conditions .site-content,
.page-template-page-terms-and-conditions .ast-container,
.page-template-page-terms-and-conditions #primary,
.page-template-page-terms-and-conditions #main,
.page-terms-and-conditions #content,
.page-terms-and-conditions .site-content,
.page-terms-and-conditions .ast-container,
.page-terms-and-conditions #primary,
.page-terms-and-conditions #main,
.page-template-page-shipping-returns #content,
.page-template-page-shipping-returns .site-content,
.page-template-page-shipping-returns .ast-container,
.page-template-page-shipping-returns #primary,
.page-template-page-shipping-returns #main,
.page-template-page-shipping-policy #content,
.page-template-page-shipping-policy .site-content,
.page-template-page-shipping-policy .ast-container,
.page-template-page-shipping-policy #primary,
.page-template-page-shipping-policy #main,
.page-shipping-policy #content,
.page-shipping-policy .site-content,
.page-shipping-policy .ast-container,
.page-shipping-policy #primary,
.page-shipping-policy #main,
.page-faq #content,
.page-faq .site-content,
.page-faq .ast-container,
.page-faq #primary,
.page-faq #main {
  max-width: 100% !important;
  width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
  display: block !important;
  float: none !important;
  background: transparent !important;
  background-image: none !important;
  border: none !important;
}

/* Hide Astra Sidebar or stray widget columns */
.page-template-page-faq #secondary,
.page-template-page-faq .widget-area,
.page-template-page-faq .sidebar-main,
.page-template-page-privacy-policy #secondary,
.page-template-page-privacy-policy .widget-area,
.page-template-page-terms-of-service #secondary,
.page-template-page-terms-of-service .widget-area,
.page-template-page-shipping-returns #secondary,
.page-template-page-shipping-returns .widget-area,
.page-faq #secondary,
.page-faq .widget-area {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

.tda-legal-page,
.tda-faq-page {
  background: #FCFBF7;
  color: #2D3748;
  font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, sans-serif;
  min-height: 70vh;
  padding-bottom: 80px;
  width: 100% !important;
  max-width: 100% !important;
  display: block !important;
  clear: both !important;
}

/* 1. HERO BANNER */
.tda-page-hero {
  background: linear-gradient(180deg, #11281E 0%, #173628 100%);
  color: #FFFFFF;
  padding: 56px 20px 48px;
  text-align: center;
  position: relative;
  overflow: hidden;
}

.tda-page-hero::before {
  content: '';
  position: absolute;
  top: -50%;
  left: 50%;
  transform: translateX(-50%);
  width: 600px;
  height: 300px;
  background: radial-gradient(circle, rgba(212, 165, 116, 0.15) 0%, transparent 70%);
  pointer-events: none;
}

.tda-page-hero-inner {
  max-width: 1120px;
  margin: 0 auto;
  position: relative;
  z-index: 2;
}

.tda-hero-kicker {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: rgba(212, 165, 116, 0.18);
  border: 1px solid rgba(212, 165, 116, 0.4);
  color: #E6C8A4;
  font-size: 11.5px;
  font-weight: 800;
  letter-spacing: 1px;
  text-transform: uppercase;
  padding: 5px 14px;
  border-radius: 999px;
  margin-bottom: 16px;
}

.tda-page-hero-title {
  font-family: 'Playfair Display', Georgia, serif;
  font-size: 42px;
  font-weight: 700;
  line-height: 1.25;
  color: #FFFFFF;
  margin: 0 0 14px 0;
}

.tda-page-hero-desc {
  font-size: 16px;
  line-height: 1.65;
  color: #D1D5DB;
  max-width: 820px;
  margin: 0 auto 20px;
}

.tda-page-breadcrumbs {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-size: 13px;
  color: #9CA3AF;
}

.tda-page-breadcrumbs a {
  color: #D4A574;
  text-decoration: none;
  transition: color 0.2s;
}

.tda-page-breadcrumbs a:hover {
  color: #FFFFFF;
  text-decoration: underline;
}

.tda-page-meta-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: 14px;
  font-size: 12.5px;
  color: #9CA3AF;
  background: rgba(255, 255, 255, 0.08);
  padding: 4px 12px;
  border-radius: 6px;
}

/* 2. FAQ PAGE SPECIFIC: SEARCH & CATEGORY FILTER */
.tda-faq-search-wrap {
  max-width: 560px;
  margin: 24px auto 0;
  position: relative;
}

.tda-faq-search-input {
  width: 100%;
  height: 52px;
  background: #FFFFFF;
  border: 2px solid rgba(212, 165, 116, 0.5);
  border-radius: 12px;
  padding: 0 50px 0 20px;
  font-size: 15px;
  color: #111827;
  outline: none;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);
  transition: all 0.2s;
}

.tda-faq-search-input:focus {
  border-color: #109648;
  box-shadow: 0 8px 30px rgba(16, 150, 72, 0.25);
}

.tda-faq-search-icon {
  position: absolute;
  right: 18px;
  top: 50%;
  transform: translateY(-50%);
  color: #109648;
  font-size: 20px;
  pointer-events: none;
}

/* Main Container - Full-Width Luxury Layout */
.tda-content-wrapper {
  max-width: 1360px !important;
  width: 95% !important;
  margin: -28px auto 0;
  padding: 0 16px;
  position: relative;
  z-index: 5;
}

/* Card Surface */
.tda-surface-card {
  background: #FFFFFF;
  border: 1px solid #EAE5D9;
  border-radius: 20px;
  padding: 56px 64px;
  box-shadow: 0 12px 36px rgba(20, 66, 45, 0.04);
  box-sizing: border-box;
}

/* FAQ Filters */
.tda-faq-nav-tabs {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 32px;
  overflow-x: auto;
  padding-bottom: 8px;
  border-bottom: 1px solid #EFEAE0;
}

.tda-faq-tab-btn {
  background: #F4F6F4;
  border: 1px solid #E2E8F0;
  color: #374151;
  font-size: 13.5px;
  font-weight: 700;
  padding: 8px 18px;
  border-radius: 999px;
  cursor: pointer;
  white-space: nowrap;
  transition: all 0.2s;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.tda-faq-tab-btn:hover {
  background: #E8F0E9;
  border-color: #109648;
  color: #11281E;
}

.tda-faq-tab-btn.active {
  background: #11281E;
  color: #FFFFFF;
  border-color: #11281E;
}

/* FAQ Section Headers */
.tda-faq-group-title {
  font-family: 'Playfair Display', Georgia, serif;
  font-size: 22px;
  font-weight: 700;
  color: #11281E;
  margin: 32px 0 16px 0;
  display: flex;
  align-items: center;
  gap: 8px;
}

.tda-faq-group-title:first-child {
  margin-top: 0;
}

.tda-faq-group-title i {
  color: #109648;
  font-size: 24px;
}

/* Interactive Accordion */
.tda-faq-accordion {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-bottom: 24px;
}

.tda-faq-item {
  background: #FAF8F5;
  border: 1px solid #ECE7DE;
  border-radius: 12px;
  overflow: hidden;
  transition: all 0.22s ease;
}

.tda-faq-item.active {
  background: #FFFFFF;
  border-color: #109648;
  box-shadow: 0 8px 24px rgba(16, 150, 72, 0.08);
}

.tda-faq-question,
button.tda-faq-question,
summary.tda-faq-question {
  width: 100% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 16px 20px !important;
  background: transparent !important;
  background-color: transparent !important;
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
  cursor: pointer !important;
  text-align: left !important;
  font-family: inherit !important;
  font-size: 15.5px !important;
  font-weight: 700 !important;
  color: #11281E !important;
  text-transform: none !important;
  letter-spacing: normal !important;
  line-height: 1.45 !important;
  gap: 12px !important;
  list-style: none !important;
  transition: color 0.2s ease !important;
}

summary.tda-faq-question::-webkit-details-marker {
  display: none !important;
}

.tda-faq-question:hover,
button.tda-faq-question:hover,
summary.tda-faq-question:hover,
.tda-faq-question:focus,
button.tda-faq-question:focus,
summary.tda-faq-question:focus,
.tda-faq-question:active,
button.tda-faq-question:active {
  background: transparent !important;
  background-color: transparent !important;
  color: #109648 !important;
  outline: none !important;
  box-shadow: none !important;
}

.tda-faq-item[open] .tda-faq-question,
.tda-faq-item.active .tda-faq-question {
  color: #109648 !important;
}

.tda-faq-icon {
  width: 28px !important;
  height: 28px !important;
  border-radius: 50% !important;
  background: #FFFFFF !important;
  border: 1px solid #E2E8F0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: #64748B !important;
  flex-shrink: 0 !important;
  font-size: 18px !important;
  transition: transform 0.25s ease, background 0.2s, color 0.2s !important;
}

.tda-faq-item[open],
.tda-faq-item.active {
  background: #FFFFFF !important;
  border-color: #109648 !important;
  box-shadow: 0 8px 24px rgba(16, 150, 72, 0.08) !important;
}

.tda-faq-item[open] .tda-faq-icon,
.tda-faq-item.active .tda-faq-icon {
  transform: rotate(180deg) !important;
  background: #109648 !important;
  color: #FFFFFF !important;
  border-color: #109648 !important;
}

.tda-faq-answer {
  display: none;
  padding: 0 20px 20px 20px !important;
  color: #4B5563 !important;
  font-size: 14.5px !important;
  line-height: 1.75 !important;
}

.tda-faq-item[open] .tda-faq-answer,
.tda-faq-item.active .tda-faq-answer {
  display: block !important;
  animation: tdaFadeIn 0.25s ease !important;
}

@keyframes tdaFadeIn {
  from {
    opacity: 0;
    transform: translateY(-4px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.tda-faq-answer p {
  margin: 0 0 12px 0 !important;
}

.tda-faq-answer p:last-child {
  margin-bottom: 0;
}

.tda-faq-item.active .tda-faq-answer {
  display: block;
}

/* User Custom Content Container (When user enters HTML in WP Editor) */
.tda-entry-content {
  font-size: 15.5px;
  line-height: 1.8;
  color: #374151;
}

.tda-entry-content h2 {
  font-family: 'Playfair Display', Georgia, serif;
  font-size: 26px;
  font-weight: 700;
  color: #11281E;
  margin: 36px 0 14px;
  border-bottom: 2px solid #EFEAE0;
  padding-bottom: 8px;
}

.tda-entry-content h3 {
  font-family: 'Playfair Display', Georgia, serif;
  font-size: 20px;
  font-weight: 700;
  color: #1B4332;
  margin: 28px 0 10px;
}

.tda-entry-content p {
  margin-bottom: 18px;
}

.tda-entry-content ul,
.tda-entry-content ol {
  margin: 14px 0 20px 24px;
}

.tda-entry-content li {
  margin-bottom: 8px;
}

.tda-entry-content a {
  color: #109648;
  font-weight: 600;
  text-decoration: underline;
}

.tda-entry-content a:hover {
  color: #0D7E3C;
}

.tda-entry-content table {
  width: 100%;
  border-collapse: collapse;
  margin: 24px 0;
  font-size: 14px;
}

.tda-entry-content th,
.tda-entry-content td {
  border: 1px solid #E5E7EB;
  padding: 12px 16px;
  text-align: left;
}

.tda-entry-content th {
  background: #11281E;
  color: #FFFFFF;
}

/* Contact Support Card at Bottom */
.tda-support-callout {
  margin-top: 48px;
  background: linear-gradient(135deg, #F4FAF5 0%, #E8F5E9 100%);
  border: 1px solid #C8E6C9;
  border-radius: 16px;
  padding: 32px;
  text-align: center;
}

.tda-support-callout h3 {
  font-family: 'Playfair Display', Georgia, serif;
  font-size: 24px;
  color: #11281E;
  margin: 0 0 8px 0;
}

.tda-support-callout p {
  font-size: 15px;
  color: #4B5563;
  margin: 0 0 20px 0;
}

.tda-support-btns {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  flex-wrap: wrap;
}

.tda-support-btn-wa {
  background: #25D366;
  color: #FFFFFF;
  padding: 12px 24px;
  border-radius: 8px;
  font-weight: 700;
  font-size: 14px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  text-decoration: none;
  box-shadow: 0 4px 12px rgba(37, 211, 102, 0.3);
  transition: transform 0.2s;
}

.tda-support-btn-wa:hover {
  transform: translateY(-2px);
  color: #FFFFFF;
}

.tda-support-btn-call {
  background: #11281E;
  color: #FFFFFF;
  padding: 12px 24px;
  border-radius: 8px;
  font-weight: 700;
  font-size: 14px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  text-decoration: none;
  transition: transform 0.2s;
}

.tda-support-btn-call:hover {
  transform: translateY(-2px);
  color: #FFFFFF;
}

/* Mobile Responsive */
@media (max-width: 768px) {
  .tda-page-hero-title {
    font-size: 30px;
  }
  .tda-surface-card {
    padding: 24px 16px;
    border-radius: 12px;
  }
  .tda-content-wrapper {
    padding: 0 12px;
  }
  .tda-faq-question {
    font-size: 14.5px;
    padding: 14px 16px;
  }
  .tda-faq-answer {
    padding: 0 16px 16px 16px;
    font-size: 13.5px;
  }
}
