/*
Theme Name:        CraftNest
Theme URI:         https://yoursite.com/craftnest
Author:            Your Name
Author URI:        https://yoursite.com
Description:       A beautiful handmade marketplace WordPress theme built for Elementor. Perfect for artisan shops, handmade product stores, vintage sellers, and Etsy-style marketplaces. Fully compatible with WooCommerce and Elementor Pro.
Version:           1.0.0
Requires at least: 6.0
Tested up to:      6.7
Requires PHP:      7.4
License:           GPL-2.0-or-later
License URI:       https://www.gnu.org/licenses/gpl-2.0.html
Text Domain:       craftnest
Tags:              e-commerce, woocommerce, elementor, handmade, marketplace, blog, portfolio, custom-menu, custom-logo, featured-images, footer-widgets, full-width-template, theme-options, threaded-comments, translation-ready

CraftNest WordPress Theme
Copyright (C) 2026 Your Name

This program is free software: you can redistribute it and/or modify
it under the terms of the GNU General Public License as published by
the Free Software Foundation, either version 2 of the License, or
(at your option) any later version.
*/

/* =============================================
   CRAFTNEST BASE STYLES
   These load on every page as a foundation.
   Elementor templates layer on top of these.
============================================= */

:root {
    --cn-cream:       #FAF7F2;
    --cn-warm:        #F5EFE4;
    --cn-sand:        #E8DDD0;
    --cn-terracotta:  #C4704A;
    --cn-tc-light:    #E8956D;
    --cn-tc-pale:     #F7E8DF;
    --cn-sage:        #7A9E7E;
    --cn-sage-light:  #EEF4EF;
    --cn-dark:        #2C2118;
    --cn-mid:         #6B5744;
    --cn-muted:       #A08C7A;
    --cn-border:      #E2D8CE;
    --cn-white:       #FFFFFF;
    --cn-gold:        #C9A84C;
    --cn-font-head:   'Cormorant Garamond', Georgia, serif;
    --cn-font-body:   'Jost', 'Helvetica Neue', sans-serif;
    --cn-radius:      16px;
    --cn-radius-sm:   10px;
    --cn-radius-lg:   24px;
    --cn-shadow:      0 8px 32px rgba(44,33,24,0.08);
    --cn-shadow-lg:   0 16px 48px rgba(44,33,24,0.14);
}

/* Reset & Base */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
    background: var(--cn-cream);
    color: var(--cn-dark);
    font-family: var(--cn-font-body);
    font-size: 15px;
    line-height: 1.7;
    -webkit-font-smoothing: antialiased;
}
img { max-width: 100%; height: auto; display: block; }
a { color: var(--cn-terracotta); text-decoration: none; transition: color 0.2s; }
a:hover { color: var(--cn-tc-light); }

/* Typography */
h1,h2,h3,h4,h5,h6 {
    font-family: var(--cn-font-head);
    color: var(--cn-dark);
    line-height: 1.2;
    font-weight: 700;
}
h1 { font-size: clamp(32px, 5vw, 52px); }
h2 { font-size: clamp(26px, 4vw, 38px); }
h3 { font-size: clamp(20px, 3vw, 26px); }
h4 { font-size: 20px; }
p { color: var(--cn-mid); line-height: 1.75; margin-bottom: 1rem; }
em { font-style: italic; color: var(--cn-terracotta); }

/* Layout */
.cn-container { max-width: 1200px; margin: 0 auto; padding: 0 24px; }
.cn-section { padding: 60px 0; }
.cn-section-sm { padding: 40px 0; }

/* Site wrapper for Elementor full-width pages */
.site { display: flex; flex-direction: column; min-height: 100vh; }
.site-content { flex: 1; }

/* Announcement Bar */
.cn-announce {
    background: var(--cn-terracotta);
    color: #fff;
    text-align: center;
    padding: 9px 24px;
    font-size: 13px;
    font-weight: 400;
    letter-spacing: 0.3px;
}
.cn-announce strong { font-weight: 600; }
.cn-announce a { color: #fff; text-decoration: underline; }

/* Site Header */
.site-header {
    background: var(--cn-white);
    border-bottom: 1px solid var(--cn-border);
    position: sticky;
    top: 0;
    z-index: 1000;
    box-shadow: 0 2px 12px rgba(44,33,24,0.04);
}
.site-header .cn-container {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    padding-top: 16px;
    padding-bottom: 16px;
    gap: 20px;
}

/* Logo */
.site-logo { text-align: center; }
.site-logo a { text-decoration: none; }
.site-logo .logo-name {
    font-family: var(--cn-font-head);
    font-size: 32px;
    font-weight: 700;
    color: var(--cn-dark);
    line-height: 1;
    letter-spacing: -0.5px;
}
.site-logo .logo-name span { color: var(--cn-terracotta); }
.site-logo .logo-tagline {
    font-size: 10px;
    color: var(--cn-muted);
    letter-spacing: 2.5px;
    text-transform: uppercase;
    margin-top: 2px;
}

/* Search */
.header-search .search-form {
    display: flex;
    align-items: center;
    background: var(--cn-warm);
    border: 1px solid var(--cn-border);
    border-radius: 30px;
    padding: 8px 16px;
    gap: 8px;
    width: 220px;
    transition: border-color 0.2s;
}
.header-search .search-form:focus-within { border-color: var(--cn-terracotta); }
.header-search .search-field {
    background: none;
    border: none;
    outline: none;
    font-family: var(--cn-font-body);
    font-size: 13px;
    color: var(--cn-dark);
    width: 100%;
}
.header-search .search-field::placeholder { color: var(--cn-muted); }
.header-search .search-submit {
    background: none;
    border: none;
    color: var(--cn-muted);
    font-size: 14px;
    cursor: pointer;
    padding: 0;
    line-height: 1;
}

/* Header Actions */
.header-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 16px;
}
.header-icon-btn {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
    color: var(--cn-mid);
    transition: color 0.2s;
    position: relative;
    font-size: 18px;
    text-decoration: none;
}
.header-icon-btn:hover { color: var(--cn-terracotta); }
.header-icon-btn .label { font-size: 10px; letter-spacing: 0.5px; }
.header-icon-btn .count {
    position: absolute;
    top: -4px;
    right: -6px;
    background: var(--cn-terracotta);
    color: #fff;
    font-size: 9px;
    font-weight: 700;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Primary Navigation */
.main-navigation {
    border-top: 1px solid var(--cn-border);
    background: var(--cn-white);
}
.main-navigation .cn-container {
    padding-top: 0;
    padding-bottom: 0;
    max-width: 1200px;
}
.main-navigation ul {
    display: flex;
    align-items: center;
    justify-content: center;
    list-style: none;
    gap: 2px;
    overflow-x: auto;
    scrollbar-width: none;
}
.main-navigation ul::-webkit-scrollbar { display: none; }
.main-navigation a {
    display: block;
    padding: 11px 16px;
    font-size: 13px;
    font-weight: 500;
    color: var(--cn-mid);
    white-space: nowrap;
    position: relative;
    text-decoration: none;
    transition: color 0.2s;
}
.main-navigation a::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 16px;
    right: 16px;
    height: 2px;
    background: var(--cn-terracotta);
    transform: scaleX(0);
    transition: transform 0.2s;
}
.main-navigation a:hover,
.main-navigation .current-menu-item > a,
.main-navigation .current_page_item > a {
    color: var(--cn-terracotta);
}
.main-navigation a:hover::after,
.main-navigation .current-menu-item > a::after { transform: scaleX(1); }

/* Buttons */
.cn-btn {
    display: inline-block;
    padding: 10px 24px;
    border-radius: 30px;
    font-family: var(--cn-font-body);
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s;
    text-decoration: none;
    border: none;
    letter-spacing: 0.3px;
}
.cn-btn-primary {
    background: var(--cn-terracotta);
    color: #fff;
}
.cn-btn-primary:hover { background: var(--cn-tc-light); color: #fff; }
.cn-btn-outline {
    background: transparent;
    color: var(--cn-terracotta);
    border: 1.5px solid var(--cn-terracotta);
}
.cn-btn-outline:hover { background: var(--cn-tc-pale); }
.cn-btn-sage { background: var(--cn-sage); color: #fff; }
.cn-btn-lg { padding: 13px 32px; font-size: 15px; }
.cn-btn-sm { padding: 7px 16px; font-size: 12px; }

/* Trust Bar */
.cn-trust-bar {
    background: var(--cn-white);
    border-top: 1px solid var(--cn-border);
    border-bottom: 1px solid var(--cn-border);
    padding: 18px 0;
}
.cn-trust-bar .cn-container {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
}
.trust-item { display: flex; align-items: center; gap: 12px; }
.trust-icon { font-size: 22px; flex-shrink: 0; }
.trust-text strong { font-size: 13px; font-weight: 600; color: var(--cn-dark); display: block; }
.trust-text span { font-size: 12px; color: var(--cn-muted); }

/* Product Cards */
.cn-product-card {
    background: var(--cn-white);
    border-radius: var(--cn-radius);
    overflow: hidden;
    border: 1px solid var(--cn-border);
    transition: all 0.25s;
    position: relative;
}
.cn-product-card:hover {
    transform: translateY(-5px);
    box-shadow: var(--cn-shadow-lg);
    border-color: var(--cn-sand);
}
.cn-product-card .card-img { 
    position: relative; 
    overflow: hidden; 
    height: 200px; 
}
.cn-product-card .card-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.4s;
}
.cn-product-card:hover .card-img img { transform: scale(1.05); }
.cn-product-card .card-badge {
    position: absolute;
    top: 12px;
    left: 12px;
    font-size: 10px;
    font-weight: 700;
    padding: 3px 10px;
    border-radius: 20px;
    letter-spacing: 0.5px;
}
.badge-hot { background: var(--cn-terracotta); color: #fff; }
.badge-new { background: var(--cn-sage); color: #fff; }
.badge-sale { background: var(--cn-gold); color: var(--cn-dark); }
.cn-product-card .card-wishlist {
    position: absolute;
    top: 12px;
    right: 12px;
    width: 32px;
    height: 32px;
    background: #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    border: 1px solid var(--cn-border);
    opacity: 0;
    transition: all 0.2s;
    cursor: pointer;
}
.cn-product-card:hover .card-wishlist { opacity: 1; }
.cn-product-card .card-wishlist:hover { background: var(--cn-terracotta); color: #fff; border-color: var(--cn-terracotta); }
.cn-product-card .card-body { padding: 14px 16px; }
.cn-product-card .card-shop { font-size: 11px; color: var(--cn-muted); margin-bottom: 3px; }
.cn-product-card .card-title { font-size: 14px; font-weight: 500; color: var(--cn-dark); line-height: 1.4; margin-bottom: 7px; font-family: var(--cn-font-body); }
.cn-product-card .card-rating { display: flex; align-items: center; gap: 5px; margin-bottom: 8px; }
.cn-product-card .stars { color: var(--cn-gold); font-size: 12px; }
.cn-product-card .review-count { font-size: 11px; color: var(--cn-muted); }
.cn-product-card .card-price { display: flex; align-items: center; gap: 8px; }
.cn-product-card .price-now { font-size: 16px; font-weight: 600; color: var(--cn-dark); }
.cn-product-card .price-was { font-size: 12px; color: var(--cn-muted); text-decoration: line-through; }
.cn-product-card .price-save { font-size: 11px; color: var(--cn-sage); font-weight: 600; }

/* Product Grid */
.cn-product-grid { display: grid; gap: 22px; }
.cn-grid-4 { grid-template-columns: repeat(4, 1fr); }
.cn-grid-3 { grid-template-columns: repeat(3, 1fr); }
.cn-grid-2 { grid-template-columns: repeat(2, 1fr); }

/* Category Pills */
.cn-cat-pills { display: flex; gap: 10px; flex-wrap: wrap; }
.cn-cat-pills.center { justify-content: center; }
.cn-cat-pill {
    padding: 8px 20px;
    border-radius: 30px;
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    border: 1.5px solid var(--cn-border);
    background: var(--cn-white);
    color: var(--cn-mid);
    transition: all 0.2s;
}
.cn-cat-pill:hover, .cn-cat-pill.active {
    background: var(--cn-terracotta);
    color: #fff;
    border-color: var(--cn-terracotta);
}

/* Section Labels */
.cn-section-label {
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: var(--cn-terracotta);
    margin-bottom: 8px;
    display: block;
}
.cn-section-title {
    font-family: var(--cn-font-head);
    font-size: clamp(26px, 4vw, 36px);
    font-weight: 700;
    color: var(--cn-dark);
    margin-bottom: 8px;
}
.cn-section-sub {
    font-size: 15px;
    color: var(--cn-muted);
    max-width: 520px;
}
.cn-section-sub.center { margin: 0 auto; text-align: center; }

/* General Card */
.cn-card {
    background: var(--cn-white);
    border: 1px solid var(--cn-border);
    border-radius: var(--cn-radius);
    padding: 28px;
}
.cn-card-sm {
    background: var(--cn-white);
    border: 1px solid var(--cn-border);
    border-radius: var(--cn-radius-sm);
    padding: 20px;
}

/* Page Hero */
.cn-page-hero {
    background: var(--cn-warm);
    border-bottom: 1px solid var(--cn-border);
    padding: 52px 24px;
    text-align: center;
}

/* Breadcrumb */
.cn-breadcrumb {
    padding: 16px 0;
    font-size: 12px;
    color: var(--cn-muted);
    display: flex;
    gap: 8px;
    align-items: center;
}
.cn-breadcrumb a { color: var(--cn-muted); }
.cn-breadcrumb a:hover { color: var(--cn-terracotta); }
.cn-breadcrumb .sep { opacity: 0.5; }

/* Newsletter Section */
.cn-newsletter {
    background: var(--cn-dark);
    border-radius: var(--cn-radius-lg);
    padding: 64px;
    text-align: center;
    position: relative;
    overflow: hidden;
}
.cn-newsletter-input {
    flex: 1;
    background: rgba(255,255,255,0.08);
    border: 1px solid rgba(255,255,255,0.15);
    border-radius: 30px;
    padding: 12px 20px;
    color: #fff;
    font-family: var(--cn-font-body);
    font-size: 14px;
    outline: none;
}
.cn-newsletter-input::placeholder { color: rgba(255,255,255,0.35); }
.cn-newsletter-input:focus { border-color: var(--cn-tc-light); }

/* WooCommerce Base Overrides */
.woocommerce .button,
.woocommerce button.button {
    background: var(--cn-terracotta) !important;
    color: #fff !important;
    border-radius: 30px !important;
    font-family: var(--cn-font-body) !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    padding: 10px 24px !important;
    border: none !important;
    transition: background 0.2s !important;
}
.woocommerce .button:hover,
.woocommerce button.button:hover {
    background: var(--cn-tc-light) !important;
}
.woocommerce ul.products li.product .price { color: var(--cn-dark); font-weight: 600; }
.woocommerce ul.products li.product a.button { border-radius: 30px !important; }
.woocommerce-page .woocommerce-breadcrumb { color: var(--cn-muted); font-size: 12px; }
.woocommerce div.product .product_title { font-family: var(--cn-font-head); }
.woocommerce-cart table.cart img { border-radius: 10px; }
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea { border-radius: 10px !important; border: 1.5px solid var(--cn-border) !important; font-family: var(--cn-font-body) !important; }
.woocommerce form .form-row input.input-text:focus { border-color: var(--cn-terracotta) !important; outline: none !important; }

/* Elementor Compatibility */
.elementor-page .site-content { padding: 0; }
.elementor-section-wrap { width: 100%; }
body.elementor-page header.site-header { z-index: 1000; }

/* Site Footer */
.site-footer { background: var(--cn-dark); color: rgba(255,255,255,0.4); margin-top: 0; }
.footer-widgets {
    max-width: 1200px;
    margin: 0 auto;
    padding: 56px 24px 40px;
    display: grid;
    grid-template-columns: 1.6fr 1fr 1fr 1fr;
    gap: 40px;
}
.footer-logo {
    font-family: var(--cn-font-head);
    font-size: 28px;
    font-weight: 700;
    color: #fff;
    margin-bottom: 12px;
    display: block;
}
.footer-logo span { color: var(--cn-tc-light); }
.footer-about {
    font-size: 13px;
    color: rgba(255,255,255,0.38);
    line-height: 1.8;
    margin-bottom: 20px;
}
.footer-social { display: flex; gap: 10px; }
.footer-social a {
    width: 34px; height: 34px;
    border-radius: 50%;
    background: rgba(255,255,255,0.06);
    border: 1px solid rgba(255,255,255,0.1);
    display: flex; align-items: center; justify-content: center;
    font-size: 13px; color: rgba(255,255,255,0.5);
    transition: all 0.2s;
    text-decoration: none;
}
.footer-social a:hover { background: var(--cn-terracotta); border-color: var(--cn-terracotta); color: #fff; }
.footer-col h4 {
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    color: rgba(255,255,255,0.4);
    margin-bottom: 16px;
    font-family: var(--cn-font-body);
}
.footer-col ul { list-style: none; }
.footer-col li { margin-bottom: 9px; }
.footer-col a { font-size: 13px; color: rgba(255,255,255,0.35); transition: color 0.2s; text-decoration: none; }
.footer-col a:hover { color: #fff; }
.footer-bottom {
    border-top: 1px solid rgba(255,255,255,0.08);
    padding: 18px 24px;
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 12px;
    color: rgba(255,255,255,0.25);
    flex-wrap: wrap;
    gap: 10px;
}
.footer-bottom-links { display: flex; gap: 20px; }
.footer-bottom-links a { color: rgba(255,255,255,0.25); text-decoration: none; }
.footer-bottom-links a:hover { color: rgba(255,255,255,0.7); }

/* Responsive */
@media (max-width: 960px) {
    .site-header .cn-container { grid-template-columns: auto 1fr; }
    .header-search { display: none; }
    .cn-grid-4 { grid-template-columns: repeat(2, 1fr); }
    .cn-trust-bar .cn-container { grid-template-columns: repeat(2, 1fr); }
    .footer-widgets { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 600px) {
    .cn-grid-4, .cn-grid-3 { grid-template-columns: 1fr; }
    .footer-widgets { grid-template-columns: 1fr; }
    .cn-newsletter { padding: 40px 24px; }
    .footer-bottom { flex-direction: column; text-align: center; }
}