/*
 Theme Name:   Thrive Child Theme
 Description:  Child theme for Thrive Theme
 Author:       NSTC
 Template:     thrive-theme
 Version:      1.0.0
*/

/* ============================================================
 * SEO, AEO & GEO Semantic Stylings
 * ============================================================ */

/* Improve list styles inside product descriptions (AEO format) */
.woocommerce-Tabs-panel--description ul {
    list-style: none;
    padding-left: 0;
    margin-bottom: 24px;
}

.woocommerce-Tabs-panel--description ul li {
    position: relative;
    padding-left: 28px;
    margin-bottom: 12px;
    line-height: 1.6;
    color: var(--ns-text, #334155);
}

.woocommerce-Tabs-panel--description ul li::before {
    content: "✓";
    position: absolute;
    left: 0;
    top: 0;
    color: var(--ns-accent-hover, #D4A017);
    font-weight: bold;
    font-size: 1.1em;
}

/* Ensure clean semantic visual margins for LLM parsing and readability */
.woocommerce-Tabs-panel--description h2 {
    margin-top: 40px;
    margin-bottom: 16px;
    font-size: 1.5rem;
    color: var(--ns-primary, #1A365D);
    border-bottom: 2px solid var(--ns-bg-page, #F1F5F9);
    padding-bottom: 8px;
}

.woocommerce-Tabs-panel--description h3 {
    margin-top: 32px;
    margin-bottom: 12px;
    font-size: 1.25rem;
    color: var(--ns-text, #334155);
}


/* ============================================
   FIX 1: Skeleton loader for lazy-loaded images
   ============================================ */
.woocommerce ul.products li.product a img[src*="data:image/svg+xml"],
.woocommerce ul.products li.product a img[data-lazy-src],
.woocommerce ul.products li.product a img:not(.ns-loaded) {
  background: linear-gradient(
    90deg,
    #f0efe8 25%,
    #e8e6df 50%,
    #f0efe8 75%
  );
  background-size: 200% 100%;
  animation: ns-skeleton-pulse 1.5s ease-in-out infinite;
  min-height: 200px;
  border-radius: 8px 8px 0 0;
}

@keyframes ns-skeleton-pulse {
  0% { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}

.woocommerce ul.products li.product a img.ns-loaded {
  animation: none;
  background: none;
}

/* ============================================
   FIX 2: Consistent image sizing across GCS + local sources
   ============================================ */
.woocommerce ul.products li.product a img {
  width: 100%;
  height: 220px;
  object-fit: cover;
  border-radius: 8px 8px 0 0;
  display: block;
  transition: opacity 0.3s ease, transform 0.3s ease;
}

.woocommerce ul.products li.product:hover a img {
  transform: scale(1.03);
}

/* Ensure the image container clips the zoom */
.woocommerce ul.products li.product a {
  display: block;
  overflow: hidden;
  border-radius: 8px 8px 0 0;
}

/* ============================================
   FIX 3: Domain badge on course cards
   ============================================ */
.ns-domain-badge {
  position: absolute;
  top: 12px;
  left: 12px;
  color: #fff;
  font-size: 11px;
  font-weight: 600;
  padding: 4px 10px;
  border-radius: 4px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  z-index: 2;
  line-height: 1.3;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

/* Ensure product card is positioned for badge */
.woocommerce ul.products li.product {
  position: relative !important;
}

/* ============================================
   FIX 4: Clean up price display
   ============================================ */
/* Hide leaked accessibility text */
.woocommerce ul.products li.product .price .screen-reader-text {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
  clip: rect(0,0,0,0) !important;
}

/* Clean price styling — override Thrive styles */
.woocommerce ul.products li.product .price {
  font-size: 15px !important;
  font-weight: 600 !important;
  color: #2c2c2a !important;
  margin: 8px 0 !important;
  line-height: 1.4 !important;
}

.woocommerce ul.products li.product .price del {
  color: #888780 !important;
  font-weight: 400 !important;
  font-size: 13px !important;
  opacity: 0.7;
}

.woocommerce ul.products li.product .price ins {
  text-decoration: none !important;
  font-weight: 600 !important;
}

/* ============================================
   FIX 5: Clean "View Course" button
   ============================================ */
.ns-view-course {
  display: block !important;
  padding: 10px 20px !important;
  background: #534AB7 !important;
  color: #fff !important;
  border-radius: 6px !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  text-decoration: none !important;
  transition: background 0.2s !important;
  text-align: center !important;
  border: none !important;
  margin: 8px 14px 14px !important;
}

.ns-view-course:hover {
  background: #3C3489 !important;
  color: #fff !important;
}

/* ============================================
   FIX 6: Hide duplicate TI Wishlist button
   ============================================ */
/* TI WooCommerce Wishlist uses .tinvwl_add_to_wishlist-text */
.woocommerce ul.products li.product 
  .tinv-wraper.tinv-wishlist + .tinv-wraper.tinv-wishlist {
  display: none !important;
}

/* If using different wrapper, catch all duplicates */
.woocommerce ul.products li.product .tinv-wraper:nth-of-type(n+2) {
  display: none !important;
}

/* Style the remaining wishlist link cleanly */
.woocommerce ul.products li.product .tinv-wraper {
  margin: 4px 14px 0 !important;
  font-size: 12px;
}

.woocommerce ul.products li.product .tinv-wraper a {
  color: #888780 !important;
  text-decoration: none !important;
  font-size: 12px !important;
  display: inline-flex;
  align-items: center;
  gap: 4px;
}

.woocommerce ul.products li.product .tinv-wraper a:hover {
  color: #534AB7 !important;
}

/* ============================================
   FIX 8: Improved pagination styling
   ============================================ */
.woocommerce nav.woocommerce-pagination {
  margin: 40px 0 !important;
  text-align: center;
}

.woocommerce nav.woocommerce-pagination ul {
  display: flex !important;
  justify-content: center;
  align-items: center;
  gap: 4px;
  flex-wrap: wrap;
  border: none !important;
}

.woocommerce nav.woocommerce-pagination ul li {
  border: none !important;
  margin: 0 !important;
}

.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span {
  display: flex !important;
  align-items: center;
  justify-content: center;
  min-width: 36px;
  height: 36px;
  padding: 0 10px !important;
  border-radius: 6px !important;
  font-size: 14px !important;
  font-weight: 500;
  color: #444441 !important;
  background: #f1efe8 !important;
  border: none !important;
  text-decoration: none !important;
  transition: all 0.2s;
}

.woocommerce nav.woocommerce-pagination ul li a:hover {
  background: #534AB7 !important;
  color: #fff !important;
}

.woocommerce nav.woocommerce-pagination ul li span.current {
  background: #534AB7 !important;
  color: #fff !important;
}

/* ============================================
   FIX 9: Course search + filter bar
   ============================================ */
.ns-course-filters {
  margin-bottom: 28px;
  padding: 0 0 24px;
  border-bottom: 1px solid #e8e6df;
}

.ns-filter-search {
  display: flex;
  gap: 8px;
  margin-bottom: 16px;
  position: relative;
}

.ns-filter-search input {
  flex: 1;
  padding: 10px 16px 10px 40px;
  border: 1px solid #d3d1c7;
  border-radius: 8px;
  font-size: 14px;
  outline: none;
  transition: border-color 0.2s;
  background: #fff;
  font-family: inherit;
}

.ns-filter-search input:focus {
  border-color: #534AB7;
  box-shadow: 0 0 0 3px rgba(83, 74, 183, 0.1);
}

.ns-search-btn {
  padding: 10px 24px;
  background: #534AB7;
  color: #fff;
  border: none;
  border-radius: 8px;
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
  transition: background 0.2s;
  font-family: inherit;
}

.ns-search-btn:hover { background: #3C3489; }

.ns-filter-categories {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.ns-cat-pill {
  padding: 6px 14px;
  border-radius: 20px;
  font-size: 13px;
  font-weight: 500;
  text-decoration: none !important;
  color: #444441;
  background: #f1efe8;
  border: 1px solid transparent;
  transition: all 0.2s;
  white-space: nowrap;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.ns-cat-pill:hover {
  border-color: #534AB7;
  color: #534AB7;
}

.ns-cat-pill.active {
  background: #534AB7;
  color: #fff;
}

.ns-cat-pill.active .ns-cat-count {
  background: rgba(255,255,255,0.25);
  color: #fff;
}

.ns-cat-count {
  font-size: 11px;
  background: #d3d1c7;
  color: #5F5E5A;
  padding: 1px 6px;
  border-radius: 10px;
  font-weight: 600;
}

/* ============================================
   FIX 10: Standardized sale badge
   ============================================ */
.woocommerce ul.products li.product .onsale,
.woocommerce span.onsale {
  position: absolute !important;
  top: 12px !important;
  right: 12px !important;
  left: auto !important;
  background: #E24B4A !important;
  color: #fff !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  padding: 4px 10px !important;
  border-radius: 4px !important;
  line-height: 1.3 !important;
  min-width: auto !important;
  min-height: auto !important;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  z-index: 3;
  margin: 0 !important;
  width: auto !important;
  height: auto !important;
}

/* ============================================
   FIX 11: Mentor card cleanup
   ============================================ */
/* Hide empty bio modals */
.mentor-bio-modal:empty,
.mentor-bio-popup *:empty {
  display: none;
}

/* De-emphasize generic domain labels until data is corrected */
.mentor-card .mentor-domain-label,
.frm_forms .mentor-domain {
  font-size: 11px;
  color: #888780;
}

/* Improve mentor card styling */
.mentor-card, .frm-mentor-card {
  border: 1px solid #e8e6df;
  border-radius: 10px;
  padding: 20px;
  text-align: center;
  transition: box-shadow 0.2s;
}

.mentor-card:hover {
  box-shadow: 0 4px 16px rgba(0,0,0,0.06);
}

/* ============================================
   FIX 14: Footer cleanup
   ============================================ */
/* If footer is Thrive-managed, override with high specificity */
.thrv_footer .thrv_wrapper,
footer .widget-area,
.site-footer .footer-widgets {
  font-size: 13px !important;
}

/* Remove random bold from footer links */
footer a, .site-footer a, .thrv_footer a {
  font-weight: 400 !important;
  text-decoration: none;
  transition: color 0.2s;
}

footer a:hover, .site-footer a:hover, .thrv_footer a:hover {
  color: #534AB7 !important;
}

/* Footer headings */
footer .widget-title,
.thrv_footer h4,
.thrv_footer .thrv_text_element h4 {
  font-size: 14px !important;
  font-weight: 600 !important;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin-bottom: 14px !important;
}

/* Copyright bar */
footer .copyright,
.thrv_footer .ns-copyright {
  font-size: 12px;
  color: #888780;
  padding: 16px 0;
  border-top: 1px solid #e8e6df;
}

/* ============================================
   FIX 16: Course card grid + typography overhaul
   Overrides both WooCommerce defaults and Thrive styles
   ============================================ */

/* Grid layout — replaces float-based WooCommerce grid */
.woocommerce ul.products {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)) !important;
  gap: 20px !important;
  padding: 0 !important;
  list-style: none !important;
}

/* Individual card */
.woocommerce ul.products li.product {
  display: flex !important;
  flex-direction: column;
  background: #fff;
  border: 1px solid #e8e6df;
  border-radius: 10px;
  overflow: hidden;
  transition: box-shadow 0.25s ease, transform 0.25s ease;
  margin: 0 !important;
  padding: 0 !important;
  width: 100% !important;
  float: none !important;
}

.woocommerce ul.products li.product:hover {
  box-shadow: 0 6px 20px rgba(0,0,0,0.08);
  transform: translateY(-3px);
}

/* Title — fixed height with line-clamp */
.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce ul.products li.product h2 {
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 1.45 !important;
  color: #2c2c2a !important;
  margin: 12px 14px 4px !important;
  padding: 0 !important;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  min-height: 41px; /* exactly 2 lines */
}

/* Price section */
.woocommerce ul.products li.product .price {
  padding: 0 14px !important;
  margin: 4px 0 8px !important;
}

/* Push button + wishlist to bottom */
.woocommerce ul.products li.product .ns-view-course,
.woocommerce ul.products li.product .button {
  margin-top: auto !important;
}

/* Card content wrapper for flex spacing */
.woocommerce ul.products li.product > a:first-of-type {
  display: flex;
  flex-direction: column;
  flex-grow: 1;
}

/* ============================================
   FIX 18: Mobile responsive overrides
   Thrive breakpoints: 1024px (tablet), 768px (mobile)
   ============================================ */

/* Tablet */
@media (max-width: 1024px) {
  .woocommerce ul.products {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 16px !important;
  }
}

/* Mobile */
@media (max-width: 768px) {
  /* Single column cards */
  .woocommerce ul.products {
    grid-template-columns: 1fr !important;
    gap: 14px !important;
  }
  
  /* Adjust image height for mobile */
  .woocommerce ul.products li.product a img {
    height: 180px;
  }

  /* Filter bar stacks */
  .ns-course-filters { padding: 12px 0; }
  .ns-filter-search { flex-direction: column; gap: 8px; }
  .ns-filter-search svg { top: 12px; }
  .ns-search-btn { width: 100%; padding: 12px; }

  /* Category pills scroll horizontally */
  .ns-filter-categories {
    overflow-x: auto;
    flex-wrap: nowrap;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 6px;
    scrollbar-width: none; /* Firefox */
  }
  .ns-filter-categories::-webkit-scrollbar { display: none; }

  /* Compact pagination */
  .woocommerce nav.woocommerce-pagination ul {
    gap: 2px;
  }
  .woocommerce nav.woocommerce-pagination ul li a,
  .woocommerce nav.woocommerce-pagination ul li span {
    min-width: 30px;
    height: 30px;
    font-size: 12px !important;
    padding: 0 6px !important;
  }

  /* Price text control */
  .woocommerce ul.products li.product .price {
    font-size: 14px !important;
  }

  /* Footer single column */
  footer .widget-area,
  .thrv_footer .thrv_columns {
    flex-direction: column !important;
  }
}

/* Small mobile */
@media (max-width: 480px) {
  .woocommerce ul.products li.product a img {
    height: 160px;
  }
  
  .ns-domain-badge {
    font-size: 10px;
    padding: 3px 8px;
  }
}

/* ============================================
   FIX 19: Brand color system
   ============================================ */
:root {
  --ns-primary: #534AB7;
  --ns-primary-dark: #3C3489;
  --ns-primary-light: #EEEDFE;
  --ns-ai: #534AB7;
  --ns-biotech: #0F6E56;
  --ns-nano: #185FA5;
  --ns-text-primary: #2c2c2a;
  --ns-text-secondary: #5F5E5A;
  --ns-text-muted: #888780;
  --ns-bg-light: #f9f8f5;
  --ns-border: #e8e6df;
}

/* Global link colors */
body a:not(.button):not(.ns-view-course):not(.ns-cat-pill) {
  color: var(--ns-primary);
}
body a:not(.button):not(.ns-view-course):not(.ns-cat-pill):hover {
  color: var(--ns-primary-dark);
}

/* WooCommerce button overrides */
.woocommerce .button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt {
  background-color: var(--ns-primary) !important;
  border-color: var(--ns-primary) !important;
}

.woocommerce .button.alt:hover,
.woocommerce button.button.alt:hover {
  background-color: var(--ns-primary-dark) !important;
  border-color: var(--ns-primary-dark) !important;
}

/* Thrive button overrides for consistency */
.thrv_wrapper .tve_btn_txt,
.thrv-button .tcb-button-link {
  font-weight: 500 !important;
}

/* ============================================
   FIX 20: Clean cart display — hide when empty
   ============================================ */
/* Hide cart total text, show only icon */
.site-header-cart .cart-contents .amount,
.thrv_wrapper .thrive-cart-count-empty,
header .woocommerce-Price-amount {
  display: none;
}

/* Hide "No products in the cart" dropdown */
.widget_shopping_cart .woocommerce-mini-cart__empty-message,
.site-header-cart .widget_shopping_cart_content p.woocommerce-mini-cart__empty-message {
  display: none !important;
}

/* Style cart icon cleanly */
.site-header-cart .cart-contents,
header .thrv-cart-icon {
  position: relative;
  text-decoration: none !important;
}

/* Cart count badge — only visible when items > 0 */
.site-header-cart .cart-contents .count,
header .thrv-cart-count {
  position: absolute;
  top: -6px;
  right: -8px;
  background: var(--ns-primary, #534AB7);
  color: #fff;
  font-size: 10px;
  font-weight: 600;
  min-width: 16px;
  height: 16px;
  line-height: 16px;
  text-align: center;
  border-radius: 50%;
  padding: 0 4px;
}

/* Hide count badge when it shows 0 */
.site-header-cart .cart-contents .count:empty,
header .thrv-cart-count:empty {
  display: none;
}