/*
Theme Name: Bridal View 
Theme URI: https://mainexpo.com.au/
Author: Emma Ocholla
Author URI: https://yourwebsite.com
Description: A luxury bridal boutique WordPress theme for Style View Grafton NSW. Features elegant design, appointment booking integration, dress collections, and bridal content management.
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: style-view-bridal
Tags: custom-logo, custom-menu, featured-images, threaded-comments, translation-ready, e-commerce, full-width-template

Style View Bridal WordPress Theme
*/

/* Base Styles */
:root {
    --color-ivory: #FFFFF0;
    --color-blush: #F4C2C2;
    --color-champagne: #F7E7CE;
    --color-gold: #D4AF37;
    --color-rose: #E8B4B8;
    --color-charcoal: #2C2C2C;
    --color-warmgray: #F5F5F0;
}

body {
    font-family: 'Montserrat', sans-serif;
    color: var(--color-charcoal);
    background-color: var(--color-ivory);
}

.font-serif {
    font-family: 'Cormorant Garamond', serif;
}

/* Custom Classes */
.glass-effect {
    background: rgba(255, 255, 240, 0.85);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}

.text-shadow {
    text-shadow: 2px 2px 4px rgba(0,0,0,0.3);
}

.gold-gradient {
    background: linear-gradient(135deg, #D4AF37 0%, #F7E7CE 50%, #D4AF37 100%);
}

.hero-overlay {
    background: linear-gradient(to bottom, rgba(0,0,0,0.2) 0%, rgba(0,0,0,0.4) 50%, rgba(0,0,0,0.6) 100%);
}

/* Dress Cards */
.dress-card {
    transition: all 0.3s ease;
}

.dress-card:hover .dress-overlay {
    opacity: 1;
}

.dress-card:hover img {
    transform: scale(1.05);
}

.dress-overlay {
    opacity: 0;
    transition: opacity 0.3s ease;
}

.zoom-container {
    overflow: hidden;
}

.zoom-container img {
    transition: transform 0.5s ease;
}

.zoom-container:hover img {
    transform: scale(1.1);
}

/* Wishlist */
.wishlist-heart {
    transition: all 0.3s ease;
}

.wishlist-heart.active {
    color: var(--color-rose);
    transform: scale(1.2);
}

.wishlist-heart.active svg {
    fill: var(--color-rose);
}

/* Navigation */
.nav-link {
    position: relative;
}

.nav-link::after {
    content: '';
    position: absolute;
    bottom: -2px;
    left: 0;
    width: 0;
    height: 1px;
    background: var(--color-gold);
    transition: width 0.3s ease;
}

.nav-link:hover::after {
    width: 100%;
}

/* Filter Buttons */
.filter-btn.active {
    background: var(--color-gold);
    color: white;
}

/* Testimonials */
.testimonial-card {
    transition: transform 0.3s ease;
}

.testimonial-card:hover {
    transform: translateY(-5px);
}

/* Sticky CTA */
.sticky-cta {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 50;
    transform: translateY(100%);
    transition: transform 0.3s ease;
}

.sticky-cta.visible {
    transform: translateY(0);
}

/* Exit Popup */
.exit-popup {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0,0,0,0.7);
    z-index: 100;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.3s ease;
}

.exit-popup.active {
    opacity: 1;
    pointer-events: all;
}

/* Confetti */
.confetti {
    position: fixed;
    width: 10px;
    height: 10px;
    background: var(--color-gold);
    animation: confetti-fall 3s ease-out forwards;
    z-index: 9999;
}

@keyframes confetti-fall {
    0% { transform: translateY(-100vh) rotate(0deg); opacity: 1; }
    100% { transform: translateY(100vh) rotate(720deg); opacity: 0; }
}

/* Scroll Reveal */
.scroll-reveal {
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 0.8s ease, transform 0.8s ease;
}

.scroll-reveal.revealed {
    opacity: 1;
    transform: translateY(0);
}

/* Bridal Countdown */
.bridal-countdown {
    background: linear-gradient(135deg, #F4C2C2 0%, #F7E7CE 100%);
}

/* Quick View Modal */
.quick-view-modal {
    display: none;
}

.quick-view-modal.active {
    display: flex;
}

/* WordPress Specific */
.wp-block-image img {
    height: auto;
    max-width: 100%;
}

.alignwide {
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
}

.alignfull {
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
}

/* Responsive */
@media (max-width: 768px) {
    .hero-section h1 {
        font-size: 2.5rem;
    }
}

/* StyleView Bridal - Custom WooCommerce Styles */

/* Tailwind Configuration */
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,500;0,600;1,400&family=Montserrat:wght@300;400;500;600&display=swap');

/* Custom Colors */
:root {
    --ivory: #FFFFF0;
    --blush: #F4C2C2;
    --champagne: #F7E7CE;
    --gold: #D4AF37;
    --rose: #E8B4B8;
    --charcoal: #2C2C2C;
    --warmgray: #F5F5F0;
}

/* Base Styles */
body {
    font-family: 'Montserrat', sans-serif;
    color: var(--charcoal);
    background-color: var(--ivory);
}

.font-serif {
    font-family: 'Cormorant Garamond', serif;
}

.font-sans {
    font-family: 'Montserrat', sans-serif;
}

/* Colors */
.bg-ivory { background-color: var(--ivory); }
.bg-blush { background-color: var(--blush); }
.bg-blush\/30 { background-color: rgba(244, 194, 194, 0.3); }
.bg-blush\/50 { background-color: rgba(244, 194, 194, 0.5); }
.bg-champagne { background-color: var(--champagne); }
.bg-gold { background-color: var(--gold); }
.bg-gold\/20 { background-color: rgba(212, 175, 55, 0.2); }
.bg-rose { background-color: var(--rose); }
.bg-charcoal { background-color: var(--charcoal); }
.bg-warmgray { background-color: var(--warmgray); }

.text-gold { color: var(--gold); }
.text-charcoal { color: var(--charcoal); }
.text-rose { color: var(--rose); }

.border-gold { border-color: var(--gold); }
.border-gold\/20 { border-color: rgba(212, 175, 55, 0.2); }

/* Glass Effect */
.glass-effect {
    background: rgba(255, 255, 240, 0.95);
    backdrop-filter: blur(10px);
}

/* Size Buttons */
.size-btn {
    transition: all 0.2s ease;
}

.size-btn.selected {
    background: var(--gold);
    color: white;
    border-color: var(--gold);
}

.size-btn:hover:not(.selected):not(:disabled) {
    border-color: var(--gold);
    color: var(--gold);
}

/* Tab Buttons */
.tab-btn {
    position: relative;
}

.tab-btn.active::after {
    content: '';
    position: absolute;
    bottom: -1px;
    left: 0;
    right: 0;
    height: 2px;
    background: var(--gold);
}

/* Review Cards */
.review-card {
    transition: transform 0.3s ease;
}

.review-card:hover {
    transform: translateY(-4px);
}

/* Sticky CTA */
.sticky-booking {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 50;
    transform: translateY(100%);
    transition: transform 0.3s ease;
}

.sticky-booking.visible {
    transform: translateY(0);
}

/* Real Bride Cards */
.real-bride-card {
    transition: all 0.3s ease;
}

.real-bride-card:hover {
    transform: translateY(-8px);
}

/* Magnifier */
.magnifier {
    position: absolute;
    border: 3px solid var(--gold);
    border-radius: 50%;
    cursor: none;
    width: 150px;
    height: 150px;
    display: none;
    pointer-events: none;
    box-shadow: 0 4px 20px rgba(0,0,0,0.2);
}

/* 360 Viewer */
.viewer-360 {
    cursor: grab;
}

.viewer-360:active {
    cursor: grabbing;
}

/* Video Play Button */
.video-play-btn {
    background: rgba(212, 175, 55, 0.9);
    backdrop-filter: blur(4px);
}

.video-play-btn:hover {
    background: var(--gold);
    transform: scale(1.1);
}

/* Navigation Links */
.nav-link {
    position: relative;
}

.nav-link::after {
    content: '';
    position: absolute;
    bottom: -2px;
    left: 0;
    width: 0;
    height: 1px;
    background: var(--gold);
    transition: width 0.3s ease;
}

.nav-link:hover::after {
    width: 100%;
}

/* WooCommerce Overrides */
.woocommerce-breadcrumb {
    margin: 0 !important;
    padding: 0 !important;
    font-size: 0.875rem;
    color: rgba(44, 44, 44, 0.6);
}

.woocommerce-breadcrumb a {
    color: rgba(44, 44, 44, 0.6);
    text-decoration: none;
}

.woocommerce-breadcrumb a:hover {
    color: var(--gold);
}

/* Hide default WooCommerce elements */
.woocommerce-product-gallery__trigger,
.woocommerce-product-gallery__image img {
    display: none !important;
}

/* Custom Wishlist Button */
.yith-wcwl-add-to-wishlist {
    margin-top: 0 !important;
}

.yith-wcwl-add-button a {
    display: flex !important;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    width: 100%;
    padding: 1rem;
    border: 2px solid var(--charcoal);
    border-radius: 9999px;
    font-weight: 500;
    transition: all 0.3s;
}

.yith-wcwl-add-button a:hover {
    background: var(--charcoal);
    color: white;
}

/* Confetti Animation */
.confetti {
    position: fixed;
    width: 10px;
    height: 10px;
    background: var(--gold);
    animation: confetti-fall 3s ease-out forwards;
    z-index: 9999;
}

@keyframes confetti-fall {
    0% { transform: translateY(-100vh) rotate(0deg); opacity: 1; }
    100% { transform: translateY(100vh) rotate(720deg); opacity: 0; }
}

/* Alpine.js cloak */
[x-cloak] { 
    display: none !important; 
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .sticky-booking .hidden.md\:flex {
        display: none;
    }
}


/* WooCommerce Tabs - StyleView Bridal */

/* Tab Container */
.woocommerce-tabs {
	margin-top: 2rem;
}

/* Tab Navigation */
.wc-tabs {
	display: flex;
	border-bottom: 1px solid rgba(44, 44, 44, 0.1);
	margin-bottom: 2rem;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	scrollbar-width: none;
	-ms-overflow-style: none;
}

.wc-tabs::-webkit-scrollbar {
	display: none;
}

/* Individual Tab Button */
.wc-tabs .tab-btn {
	position: relative;
	padding: 1rem 1.5rem;
	font-family: 'Montserrat', sans-serif;
	font-weight: 500;
	font-size: 0.875rem;
	white-space: nowrap;
	background: transparent;
	border: none;
	cursor: pointer;
	transition: color 0.3s ease;
	outline: none;
}

/* Active Tab Indicator */
.wc-tabs .tab-btn::after {
	content: '';
	position: absolute;
	bottom: -1px;
	left: 0;
	right: 0;
	height: 2px;
	background-color: #D4AF37;
	transform: scaleX(0);
	transition: transform 0.3s ease;
}

.wc-tabs .tab-btn.active::after,
.wc-tabs .tab-btn:hover::after {
	transform: scaleX(1);
}

/* Tab States */
.wc-tabs .tab-btn.active,
.wc-tabs .tab-btn.text-charcoal {
	color: #2C2C2C;
}

.wc-tabs .tab-btn.text-charcoal\/60 {
	color: rgba(44, 44, 44, 0.6);
}

.wc-tabs .tab-btn:hover {
	color: #2C2C2C;
}

/* Tab Panels Container */
.wc-tab-panels {
	max-width: 56rem; /* max-w-4xl */
}

/* Individual Tab Panel */
.wc-tab-panel {
	animation: tabFadeIn 0.3s ease-out;
}

.wc-tab-panel[hidden] {
	display: none;
}

/* Tab Panel Animation */
@keyframes tabFadeIn {
	from {
		opacity: 0;
		transform: translateY(10px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

/* Accessibility */
.wc-tabs .tab-btn:focus-visible {
	outline: 2px solid #D4AF37;
	outline-offset: -2px;
	border-radius: 4px;
}

/* Responsive */
@media (max-width: 768px) {
	.wc-tabs .tab-btn {
		padding: 0.75rem 1rem;
		font-size: 0.8125rem;
	}
	
	.wc-tab-panels {
		padding: 0 0.5rem;
	}
}

/* WooCommerce Default Overrides */
.woocommerce-tabs ul.tabs {
	display: none !important; /* Hide default WooCommerce tabs */
}

.woocommerce-tabs .panel {
	margin: 0 !important;
	padding: 0 !important;
	background: transparent !important;
	border: none !important;
	box-shadow: none !important;
}

/* Ensure our custom tabs show */
.woocommerce-tabs .wc-tabs-wrapper {
	display: block !important;
}


[x-cloak] { display: none !important; }

.glass-effect {
    background: rgba(255, 255, 240, 0.95);
    backdrop-filter: blur(10px);
}

.article-card {
    transition: all 0.4s ease;
}

.article-card:hover {
    transform: translateY(-8px);
}

.article-card:hover .article-image {
    transform: scale(1.05);
}

.article-image {
    transition: transform 0.6s ease;
}

.category-pill {
    transition: all 0.2s ease;
}

.category-pill:hover {
    transform: translateY(-2px);
}

.category-pill.active {
    background: #D4AF37;
    color: white;
    border-color: #D4AF37;
}

.featured-article {
    position: relative;
    overflow: hidden;
}

.featured-article::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(0,0,0,0.8) 0%, transparent 60%);
    pointer-events: none;
}

.reading-progress {
    position: fixed;
    top: 0;
    left: 0;
    height: 3px;
    background: #D4AF37;
    z-index: 100;
    transition: width 0.1s;
}

.newsletter-float {
    position: fixed;
    bottom: 2rem;
    right: 2rem;
    z-index: 40;
    transform: translateY(150%);
    transition: transform 0.3s ease;
}

.newsletter-float.visible {
    transform: translateY(0);
}

.toc-link {
    position: relative;
    padding-left: 1rem;
}

.toc-link::before {
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 4px;
    height: 4px;
    background: #D4AF37;
    border-radius: 50%;
    opacity: 0;
    transition: opacity 0.2s;
}

.toc-link.active::before {
    opacity: 1;
}

.toc-link.active {
    color: #D4AF37;
}

.share-btn {
    transition: all 0.2s ease;
}

.share-btn:hover {
    transform: translateY(-2px);
    background: #D4AF37;
    color: white;
}

.author-card {
    transition: all 0.3s ease;
}

.author-card:hover {
    transform: translateX(4px);
}

.related-card {
    transition: all 0.3s ease;
}

.related-card:hover {
    transform: translateY(-4px);
}

.nav-link::after {
    content: '';
    position: absolute;
    bottom: -2px;
    left: 0;
    width: 0;
    height: 1px;
    background: #D4AF37;
    transition: width 0.3s ease;
}

.nav-link:hover::after {
    width: 100%;
}

.scroll-reveal {
    opacity: 0;
    transform: translateY(30px);
}

.search-input:focus {
    box-shadow: 0 0 0 3px rgba(212, 175, 55, 0.2);
}