/*
Theme Name: Nitu Boutique
Theme URI: https://github.com/sudippodder/wordpress_sharee_nitu
Template: best-shop
Author: Sudip Podder
Author URI: https://github.com/sudippodder
Description: A premium WooCommerce child theme for an elegant boutique shopping experience. Features a modern design with hero sliders, curated collections, featured categories, product carousels, and a fully responsive layout optimized for fashion and lifestyle e-commerce.
Version: 1.0.0
Requires PHP: 7.4
Tested up to: 6.9
License: GNU General Public License v3 or later
License URI: http://www.gnu.org/licenses/gpl-3.0.html
Text Domain: nitu-boutique
Tags: e-commerce, one-column, two-columns, right-sidebar, custom-background, custom-colors, custom-header, custom-logo, custom-menu, featured-images, footer-widgets, full-width-template, theme-options, threaded-comments, translation-ready
*/

/* ==========================================================================
   Design Tokens — CSS Custom Properties
   ========================================================================== */

:root {
    /* ── Primary Palette ── */
    --nb-primary:          #850c52;
    --nb-primary-light:    #a8326f;
    --nb-primary-dark:     #5e0839;
    --nb-primary-rgb:      133, 12, 82;

    /* ── Accent ── */
    --nb-accent:           #d4a853;
    --nb-accent-light:     #e6c97a;
    --nb-accent-dark:      #b8893a;

    /* ── Neutrals ── */
    --nb-white:            #ffffff;
    --nb-off-white:        #fdfaf7;
    --nb-cream:            #f8f3ed;
    --nb-gray-100:         #f5f5f5;
    --nb-gray-200:         #e8e8e8;
    --nb-gray-300:         #d1d1d1;
    --nb-gray-400:         #a0a0a0;
    --nb-gray-500:         #6b6b6b;
    --nb-gray-600:         #4a4a4a;
    --nb-gray-700:         #2c2c2c;
    --nb-gray-800:         #1a1a1a;
    --nb-black:            #0a0a0a;

    /* ── Semantic ── */
    --nb-success:          #28a745;
    --nb-warning:          #f0ad4e;
    --nb-danger:           #dc3545;
    --nb-info:             #17a2b8;

    /* ── Typography ── */
    --nb-font-heading:     'Playfair Display', Georgia, 'Times New Roman', serif;
    --nb-font-body:        'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    --nb-font-size-base:   16px;
    --nb-line-height-base: 1.7;

    /* ── Font Sizes ── */
    --nb-fs-xs:            0.75rem;   /* 12px */
    --nb-fs-sm:            0.875rem;  /* 14px */
    --nb-fs-base:          1rem;      /* 16px */
    --nb-fs-md:            1.125rem;  /* 18px */
    --nb-fs-lg:            1.25rem;   /* 20px */
    --nb-fs-xl:            1.5rem;    /* 24px */
    --nb-fs-2xl:           2rem;      /* 32px */
    --nb-fs-3xl:           2.5rem;    /* 40px */
    --nb-fs-4xl:           3rem;      /* 48px */

    /* ── Spacing ── */
    --nb-space-xs:         0.25rem;
    --nb-space-sm:         0.5rem;
    --nb-space-md:         1rem;
    --nb-space-lg:         1.5rem;
    --nb-space-xl:         2rem;
    --nb-space-2xl:        3rem;
    --nb-space-3xl:        4rem;
    --nb-space-4xl:        6rem;
    --nb-space-section:    5rem;

    /* ── Layout ── */
    --nb-container-max:    1320px;
    --nb-container-padding: 1rem;

    /* ── Borders & Radius ── */
    --nb-radius-sm:        4px;
    --nb-radius-md:        8px;
    --nb-radius-lg:        12px;
    --nb-radius-xl:        16px;
    --nb-radius-full:      9999px;

    /* ── Shadows ── */
    --nb-shadow-sm:        0 1px 3px rgba(0, 0, 0, 0.08);
    --nb-shadow-md:        0 4px 12px rgba(0, 0, 0, 0.1);
    --nb-shadow-lg:        0 8px 30px rgba(0, 0, 0, 0.12);
    --nb-shadow-xl:        0 12px 40px rgba(0, 0, 0, 0.15);

    /* ── Transitions ── */
    --nb-transition-fast:   0.15s ease;
    --nb-transition-base:   0.3s ease;
    --nb-transition-slow:   0.5s ease;
    --nb-transition-bounce: 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);

    /* ── Z-Indices ── */
    --nb-z-dropdown:       100;
    --nb-z-sticky:         200;
    --nb-z-overlay:        300;
    --nb-z-modal:          400;
    --nb-z-toast:          500;
}

/* ==========================================================================
   Base Resets & Overrides
   ========================================================================== */

*,
*::before,
*::after {
    box-sizing: border-box;
}

body {
    font-family: var(--nb-font-body);
    font-size: var(--nb-font-size-base);
    line-height: var(--nb-line-height-base);
    color: var(--nb-gray-700);
    background-color: var(--nb-off-white);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6 {
    font-family: var(--nb-font-heading);
    font-weight: 700;
    line-height: 1.3;
    color: var(--nb-gray-800);
    margin-top: 0;
}

h1 { font-size: var(--nb-fs-4xl); }
h2 { font-size: var(--nb-fs-3xl); }
h3 { font-size: var(--nb-fs-2xl); }
h4 { font-size: var(--nb-fs-xl); }
h5 { font-size: var(--nb-fs-lg); }
h6 { font-size: var(--nb-fs-md); }

a {
    color: var(--nb-primary);
    text-decoration: none;
    transition: color var(--nb-transition-fast);
}

a:hover,
a:focus {
    color: var(--nb-primary-dark);
}

img {
    max-width: 100%;
    height: auto;
    display: block;
}

/* ==========================================================================
   Utility Classes
   ========================================================================== */

.nb-container {
    width: 100%;
    max-width: var(--nb-container-max);
    margin-left: auto;
    margin-right: auto;
    padding-left: var(--nb-container-padding);
    padding-right: var(--nb-container-padding);
}

.nb-section {
    padding-top: var(--nb-space-section);
    padding-bottom: var(--nb-space-section);
}

.nb-section-header {
    text-align: center;
    margin-bottom: var(--nb-space-2xl);
}

.nb-section-title {
    font-family: var(--nb-font-heading);
    font-size: var(--nb-fs-2xl);
    font-weight: 700;
    color: var(--nb-gray-800);
    margin-bottom: var(--nb-space-sm);
    position: relative;
}

.nb-section-subtitle {
    font-size: var(--nb-fs-base);
    color: var(--nb-gray-500);
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
}

.nb-section-divider {
    display: block;
    width: 60px;
    height: 3px;
    background: linear-gradient(90deg, var(--nb-primary), var(--nb-accent));
    margin: var(--nb-space-md) auto var(--nb-space-lg);
    border: none;
    border-radius: var(--nb-radius-full);
}

/* Buttons */
.nb-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--nb-space-sm);
    padding: 0.75rem 2rem;
    font-family: var(--nb-font-body);
    font-size: var(--nb-fs-sm);
    font-weight: 600;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    border: 2px solid transparent;
    border-radius: var(--nb-radius-sm);
    cursor: pointer;
    transition: all var(--nb-transition-base);
    text-decoration: none;
    line-height: 1;
}

.nb-btn-primary {
    background-color: var(--nb-primary);
    color: var(--nb-white);
    border-color: var(--nb-primary);
}

.nb-btn-primary:hover {
    background-color: var(--nb-primary-dark);
    border-color: var(--nb-primary-dark);
    color: var(--nb-white);
    transform: translateY(-2px);
    box-shadow: var(--nb-shadow-md);
}

.nb-btn-outline {
    background-color: transparent;
    color: var(--nb-primary);
    border-color: var(--nb-primary);
}

.nb-btn-outline:hover {
    background-color: var(--nb-primary);
    color: var(--nb-white);
    transform: translateY(-2px);
}

.nb-btn-accent {
    background-color: var(--nb-accent);
    color: var(--nb-gray-800);
    border-color: var(--nb-accent);
}

.nb-btn-accent:hover {
    background-color: var(--nb-accent-dark);
    border-color: var(--nb-accent-dark);
    color: var(--nb-white);
    transform: translateY(-2px);
}

.nb-btn-sm {
    padding: 0.5rem 1.25rem;
    font-size: var(--nb-fs-xs);
}

.nb-btn-lg {
    padding: 1rem 2.5rem;
    font-size: var(--nb-fs-base);
}

/* Screen Reader Text */
.screen-reader-text {
    border: 0;
    clip: rect(1px, 1px, 1px, 1px);
    clip-path: inset(50%);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute !important;
    width: 1px;
    word-wrap: normal !important;
}

.screen-reader-text:focus {
    background-color: var(--nb-gray-100);
    clip: auto !important;
    clip-path: none;
    color: var(--nb-gray-800);
    display: block;
    font-size: var(--nb-fs-sm);
    font-weight: 700;
    height: auto;
    left: 5px;
    line-height: normal;
    padding: 15px 23px 14px;
    text-decoration: none;
    top: 5px;
    width: auto;
    z-index: 100000;
}

/* ==========================================================================
   Parent Theme Overrides
   ========================================================================== */

/* Override parent container width */
.container {
    max-width: var(--nb-container-max);
}

/* Override parent primary color variables */
body {
    --glb-primary-color: var(--nb-primary);
}

/* Hide parent theme preloader */
.preloader-center {
    display: none !important;
}

/* Override parent header styles - we use our own */
#masthead.site-header {
    display: none !important;
}

/* Override parent footer styles - we use our own */
#colophon.site-footer {
    display: none !important;
}

/* Override parent breadcrumb page header */
.page-header-wrap {
    display: none !important;
}