/*
Theme Name: Shree Krishna Fashion
Theme URI: https://shreekrishnafashion.com/
Author: Shree Krishna Fashion
Author URI: https://shreekrishnafashion.com/
Description: Premium Indian ethnic fashion e-commerce theme for Shree Krishna Fashion. WooCommerce-native, Tailwind-styled, mobile-first with gold & navy boutique aesthetic. Converted from the React 18 + Vite site.
Version: 1.0.0
Requires at least: 6.2
Tested up to: 6.6
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: shree-krishna-fashion
Tags: e-commerce, woocommerce, custom-colors, custom-menu, featured-images, threaded-comments, translation-ready, mobile-first
WC requires at least: 8.0
WC tested up to: 9.3
*/

/* ==========================================================================
   Base styles — mirrors src/index.css from the React source.
   Custom utilities (.indian-floral-pattern, .underline-animation), fonts,
   colors, and scrollbar are defined here so the theme renders correctly
   even before the Tailwind Play CDN loads.
   ========================================================================== */

:root {
  --color-primary-gold:   #FABD20;
  --color-primary-navy:   #0A1931;
  --color-warm-ivory:     #FCF8F2;
  --color-almost-black:   #121212;
  --color-dark-grey:      #4A4A4A;
  --color-soft-gold:      #D4AF37;
  --font-serif: "Playfair Display", Georgia, serif;
  --font-sans:  "Poppins", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

html { scroll-behavior: smooth; }

body {
  background-color: #FCF8F2;
  color: #121212;
  font-family: "Poppins", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  position: relative;
  overflow-x: hidden;
  margin: 0;
}

/* WooCommerce image defaults */
.woocommerce img,
.woocommerce-page img { height: auto; max-width: 100%; }

/* Decorative Indian floral pattern overlay.
   Uses a small inline SVG mandala, tiled, at 3% opacity — matches the
   .indian-floral-pattern utility from index.css exactly. */
.indian-floral-pattern { position: relative; }
.indian-floral-pattern::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: 0.03;
  z-index: 0;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120' viewBox='0 0 120 120'%3E%3Cg fill='%23FABD20' fill-rule='evenodd'%3E%3Ccircle cx='60' cy='60' r='3'/%3E%3Ccircle cx='30' cy='30' r='1.5'/%3E%3Ccircle cx='90' cy='30' r='1.5'/%3E%3Ccircle cx='30' cy='90' r='1.5'/%3E%3Ccircle cx='90' cy='90' r='1.5'/%3E%3Ccircle cx='60' cy='10' r='2'/%3E%3Ccircle cx='60' cy='110' r='2'/%3E%3Ccircle cx='10' cy='60' r='2'/%3E%3Ccircle cx='110' cy='60' r='2'/%3E%3Cpath d='M60 35c8 5 12 12 12 25s-4 20-12 25c-8-5-12-12-12-25s4-20 12-25z' opacity='.6'/%3E%3Cpath d='M35 60c5-8 12-12 25-12s20 4 25 12c-5 8-12 12-25 12s-20-4-25-12z' opacity='.4'/%3E%3C/g%3E%3C/svg%3E");
  background-repeat: repeat;
}

/* Animated underline-on-hover for footer links */
.underline-animation { position: relative; display: inline-block; }
.underline-animation::after {
  content: "";
  position: absolute;
  left: 0; bottom: -1px;
  width: 100%; height: 1.5px;
  background-color: currentColor;
  transform: scaleX(0);
  transform-origin: bottom right;
  transition: transform 0.35s cubic-bezier(0.25, 1, 0.5, 1);
}
.underline-animation:hover::after { transform: scaleX(1); transform-origin: bottom left; }

/* Slim gold scrollbar */
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: #FCF8F2; }
::-webkit-scrollbar-thumb { background: #D4AF37; border-radius: 3px; }
* { scrollbar-width: thin; scrollbar-color: #D4AF37 #FCF8F2; }

/* Hide scrollbar utility used by horizontal reels scroller */
.no-scrollbar::-webkit-scrollbar { display: none; }
.no-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }

/* Line clamp helpers (Tailwind utility equivalents for non-CDN fallback) */
.line-clamp-1, .line-clamp-2, .line-clamp-3 {
  display: -webkit-box; -webkit-box-orient: vertical; overflow: hidden;
}
.line-clamp-1 { -webkit-line-clamp: 1; }
.line-clamp-2 { -webkit-line-clamp: 2; }
.line-clamp-3 { -webkit-line-clamp: 3; }

/* WordPress core alignment classes kept minimal — theme uses utility-first layout */
.alignleft, .alignright, .aligncenter, .alignwide, .alignfull { max-width: 100%; }
.aligncenter { display: block; margin-left: auto; margin-right: auto; }

/* Screen-reader text */
.screen-reader-text {
  position: absolute !important;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0, 0, 0, 0);
  white-space: nowrap; border: 0;
}

/* WooCommerce message/promote cleanup — keep them unstyled, layout handles spacing */
.woocommerce-message,
.woocommerce-info,
.woocommerce-error {
  list-style: none; padding: 12px 16px; margin: 0 0 16px;
  border-radius: 16px; font-size: 13px;
}

/* Reset link underlines inside the theme — buttons styled per-component */
a { text-decoration: none; color: inherit; }
img { max-width: 100%; height: auto; display: block; }

/* Sticky container for WooCommerce notices so they don't push layout */
.woocommerce-notices-wrapper { margin-bottom: 16px; }