/*
Theme Name: TiBaza
Theme URI: https://tibaza.com
Author: TiBaza
Author URI: https://tibaza.com
Description: Custom WordPress theme for the TiBaza marketplace — Home, New Arrivals, Best Seller, Flash Sale, Track Order, Affiliate and Contact pages, built to match the original TiBaza design system (navy/purple/orange palette, Poppins + Inter typography).
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.6
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: tibaza
*/

/* =============================================================
   Everything below is loaded automatically via functions.php
   (wp_enqueue_style( 'tibaza-style', get_stylesheet_uri() )).
   Tailwind's CDN engine (also enqueued in functions.php) supplies
   the utility classes used throughout the markup — this file only
   covers what Tailwind's utilities can't express: fonts, custom
   scrollbars, timeline connectors, countdown chips, focus rings,
   card hover states, and form field styling.
   ============================================================= */

:root{
  --tb-navy:#2E2A78;
  --tb-purple:#4B3FA0;
  --tb-orange:#F5841F;
  --tb-orange-dark:#D96F12;
  --tb-gold:#FBBF24;
  --tb-green:#2E9B4F;
  --tb-lavender:#F3F1F8;
  --tb-muted:#6B7280;
}

body{
  font-family:'Inter',ui-sans-serif,system-ui,sans-serif;
  color:#1A1A1A;
  -webkit-font-smoothing:antialiased;
}
.font-heading{ font-family:'Poppins',ui-sans-serif,system-ui,sans-serif; }

/* ---------- Accessible focus states ---------- */
a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible{
  outline:3px solid var(--tb-orange);
  outline-offset:2px;
  border-radius:4px;
}

/* ---------- Horizontal carousels ---------- */
.no-scrollbar::-webkit-scrollbar{ display:none; }
.no-scrollbar{ -ms-overflow-style:none; scrollbar-width:none; scroll-behavior:smooth; }

/* ---------- Product / benefit cards ---------- */
.product-card{
  transition:transform .2s ease, box-shadow .2s ease;
  box-shadow:0 2px 10px rgba(46,42,120,.08);
}
.product-card:hover{
  transform:translateY(-4px);
  box-shadow:0 14px 26px rgba(46,42,120,.14);
}
.product-card .cart-btn{ transition:background-color .15s ease, transform .15s ease; }
.product-card .cart-btn:hover{ background-color:var(--tb-orange-dark); transform:scale(1.06); }

/* ---------- Badges ---------- */
.badge-pill{
  font-size:.65rem;
  font-weight:700;
  letter-spacing:.02em;
  text-transform:uppercase;
  padding:.2rem .55rem;
  border-radius:9999px;
  display:inline-block;
}

/* ---------- Star rating ---------- */
.stars svg{ width:14px; height:14px; }

/* ---------- Countdown chips (Today's Deals / Flash Sale) ---------- */
.countdown-box{
  background:#fff;
  color:var(--tb-navy);
  border-radius:.5rem;
  padding:.35rem .6rem;
  font-weight:800;
  font-family:'Poppins',sans-serif;
  min-width:2.75rem;
  text-align:center;
  line-height:1;
}
.countdown-box span{ display:block; font-size:.55rem; font-weight:500; color:var(--tb-muted); margin-top:.15rem; }

/* ---------- Track Order / Affiliate step timeline ---------- */
.timeline-wrap{ display:flex; align-items:flex-start; }
.timeline-step{ position:relative; flex:1; text-align:center; }
.timeline-step:not(:last-child)::after{
  content:'';
  position:absolute;
  top:1.35rem;
  left:55%;
  width:90%;
  height:3px;
  background:#E2E1EF;
  z-index:0;
}
.timeline-step.completed:not(:last-child)::after{ background:var(--tb-orange); }
.timeline-dot{
  position:relative;
  z-index:1;
  width:2.75rem;
  height:2.75rem;
  border-radius:9999px;
  display:flex;
  align-items:center;
  justify-content:center;
  margin:0 auto;
  background:#E2E1EF;
  color:#9490B8;
  font-weight:700;
  border:3px solid #fff;
  box-shadow:0 0 0 3px #E2E1EF;
}
.timeline-step.completed .timeline-dot{
  background:var(--tb-orange);
  color:#fff;
  box-shadow:0 0 0 3px rgba(245,132,31,.25);
}
.timeline-step.current .timeline-dot{
  background:#fff;
  color:var(--tb-orange);
  box-shadow:0 0 0 3px var(--tb-orange);
}

/* ---------- Section background rhythm ---------- */
.section-lavender{ background:var(--tb-lavender); }

/* ---------- Form fields (Track order / Affiliate / Contact) ---------- */
.tb-input{
  width:100%;
  background:#fff;
  border:1px solid #E2E1EF;
  border-radius:.75rem;
  padding:.75rem 1rem;
  font-family:'Inter',sans-serif;
  color:#1A1A1A;
}
.tb-input:focus{ border-color:var(--tb-orange); }

/* ---------- Active nav underline (fallback + real WP menu) ---------- */
#navLinks a.underline{ text-decoration-color: var(--tb-orange); }
#navLinks .current-menu-item > a,
#navLinks .current_page_item > a{
  text-decoration: underline;
  text-decoration-color: var(--tb-orange);
  text-underline-offset: 4px;
}

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion: reduce){
  *{ animation-duration:0.001ms !important; animation-iteration-count:1 !important; transition-duration:0.001ms !important; scroll-behavior:auto !important; }
}

/* ---------- Line clamp fallback ---------- */
.tb-clamp-2{
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}

/* ---------- Screen-reader-only utility (used by header.php labels) ---------- */
.sr-only{
  position:absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0;
}

/* =============================================================
   WooCommerce re-skin — matches shop/cart/checkout/single-product/
   my-account pages to the rest of the theme instead of WooCommerce's
   default plain styling. Loaded automatically; no setup needed.
   ============================================================= */

.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.woocommerce-Button{
  background-color:var(--tb-orange) !important;
  color:#fff !important;
  border-radius:9999px !important;
  border:none !important;
  font-family:'Poppins',sans-serif !important;
  font-weight:700 !important;
  padding:.75rem 1.75rem !important;
  transition:background-color .15s ease !important;
}
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover{
  background-color:var(--tb-orange-dark) !important;
}
.woocommerce a.button.alt,
.woocommerce #respond input#submit.alt{
  background-color:var(--tb-navy) !important;
}

.woocommerce-Price-amount{ color:var(--tb-orange); font-weight:800; font-family:'Poppins',sans-serif; }
.woocommerce del .woocommerce-Price-amount{ color:#9CA3AF; font-weight:400; }

.woocommerce-message, .woocommerce-info{
  border-top-color:var(--tb-orange) !important;
}
.woocommerce-message::before, .woocommerce-info::before{ color:var(--tb-orange) !important; }
.woocommerce-error{ border-top-color:#EF4444 !important; }

.woocommerce div.product .woocommerce-tabs ul.tabs li.active,
.woocommerce table.shop_table th{
  border-bottom-color:var(--tb-orange) !important;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li a{ font-family:'Poppins',sans-serif; font-weight:600; color:var(--tb-navy); }

.woocommerce .quantity input.qty{
  border:1px solid #E2E1EF; border-radius:.5rem; padding:.5rem; font-family:'Inter',sans-serif;
}

.star-rating{ color:var(--tb-gold) !important; }
.star-rating span::before{ color:var(--tb-gold) !important; }

.woocommerce table.shop_table{ border-color:#E2E1EF !important; border-radius:1rem; overflow:hidden; }
.woocommerce-checkout #payment{ background:var(--tb-lavender) !important; border-radius:1rem; }

.woocommerce ul.products li.product .price,
.woocommerce div.product p.price{ font-family:'Poppins',sans-serif; }

.woocommerce-account .woocommerce-MyAccount-navigation ul{ background:#fff; border-radius:1rem; overflow:hidden; border:1px solid #E2E1EF; }
.woocommerce-account .woocommerce-MyAccount-navigation ul li.is-active a{ color:var(--tb-orange); font-weight:700; }



/* =========================================
   TiBaza - Logo Header
   ========================================= */

/* Conteneur du logo */
header a[aria-label$="home"] {
    display: flex;
    align-items: center;
    flex-shrink: 0;
    max-width: 180px;
}

/* Logo WordPress */
header a[aria-label$="home"] .custom-logo-link {
    display: flex;
    align-items: center;
    max-width: 150px;
    max-height: 44px;
}

/* Image du logo */
header a[aria-label$="home"] .custom-logo {
    display: block;
    width: auto;
    height: auto;
    max-width: 150px;
    max-height: 44px;
    object-fit: contain;
}

/* =========================================
   TABLETTE
   ========================================= */

@media (max-width: 1024px) {
    header a[aria-label$="home"] {
        max-width: 150px;
    }

    header a[aria-label$="home"] .custom-logo-link,
    header a[aria-label$="home"] .custom-logo {
        max-width: 125px;
        max-height: 40px;
    }
}

/* =========================================
   MOBILE
   ========================================= */

@media (max-width: 640px) {
    header a[aria-label$="home"] {
        max-width: 125px;
    }

    header a[aria-label$="home"] .custom-logo-link,
    header a[aria-label$="home"] .custom-logo {
        max-width: 110px;
        max-height: 36px;
    }
}

/* Très petits écrans */
@media (max-width: 380px) {
    header a[aria-label$="home"] {
        max-width: 105px;
    }

    header a[aria-label$="home"] .custom-logo-link,
    header a[aria-label$="home"] .custom-logo {
        max-width: 95px;
        max-height: 32px;
    }
}