/**
 * Block Styles for ShopWave Luxe Theme
 * Custom styling for WordPress Blocks
 */

/* ==========================================================================
   Core Block Enhancements
   ========================================================================== */

/* Buttons */
.wp-block-button__link {
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
    overflow: hidden;
}

.wp-block-button__link::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.1);
    transition: left 0.3s ease;
}

.wp-block-button__link:hover::before {
    left: 100%;
}

/* Button Outline Style */
.wp-block-button.is-style-outline .wp-block-button__link {
    border: 1px solid currentColor;
    background: transparent;
}

.wp-block-button.is-style-outline .wp-block-button__link:hover {
    background: var(--wp--preset--color--black);
    color: var(--wp--preset--color--white);
    border-color: var(--wp--preset--color--black);
}

/* Images */
.wp-block-image {
    position: relative;
    overflow: hidden;
}

.wp-block-image img {
    transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);
    display: block;
}

.wp-block-image:hover img {
    transform: scale(1.05);
}

.wp-block-image figcaption {
    margin-top: var(--wp--preset--spacing--4);
    font-size: var(--wp--preset--font-size--sm);
    color: var(--wp--preset--color--slate);
    text-align: center;
    letter-spacing: 0.025em;
}

/* Cover Blocks */
.wp-block-cover {
    position: relative;
}

.wp-block-cover__inner-container {
    z-index: 2;
}

/* Quote Blocks */
.wp-block-quote {
    margin: var(--wp--preset--spacing--12) 0;
}

.wp-block-quote cite {
    font-style: normal;
    font-size: var(--wp--preset--font-size--sm);
    color: var(--wp--preset--color--slate);
    margin-top: var(--wp--preset--spacing--4);
    display: block;
}

/* Pullquote */
.wp-block-pullquote {
    padding: var(--wp--preset--spacing--12) 0;
    border-top: 1px solid var(--wp--preset--color--gold);
    border-bottom: 1px solid var(--wp--preset--color--gold);
}

.wp-block-pullquote blockquote {
    font-family: var(--wp--preset--font-family--accent);
    font-size: var(--wp--preset--font-size--2-xl);
    line-height: 1.4;
}

/* Separator */
.wp-block-separator {
    margin: var(--wp--preset--spacing--12) auto;
}

.wp-block-separator.is-style-wide {
    width: 100%;
}

.wp-block-separator.is-style-dots::before {
    letter-spacing: 2em;
    padding-left: 2em;
}

/* Columns */
.wp-block-columns {
    align-items: stretch;
}

@media (max-width: 781px) {
    .wp-block-columns {
        flex-direction: column;
    }
}

/* Group */
.wp-block-group {
    position: relative;
}

/* ==========================================================================
   WooCommerce Block Styles
   ========================================================================== */

/* Product Grid */
.wc-block-grid__products {
    gap: var(--wp--preset--spacing--10);
}

.wc-block-grid__product {
    position: relative;
    transition: transform 0.3s ease;
}

.wc-block-grid__product:hover {
    transform: translateY(-4px);
}

.wc-block-grid__product-image {
    position: relative;
    overflow: hidden;
    margin-bottom: var(--wp--preset--spacing--5);
}

.wc-block-grid__product-image img {
    transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

.wc-block-grid__product:hover .wc-block-grid__product-image img {
    transform: scale(1.05);
}

.wc-block-grid__product-title {
    font-family: var(--wp--preset--font-family--heading);
    font-size: var(--wp--preset--font-size--base);
    font-weight: 500;
    margin-bottom: var(--wp--preset--spacing--3);
    line-height: 1.4;
}

.wc-block-grid__product-price {
    font-family: var(--wp--preset--font-family--heading);
    font-size: var(--wp--preset--font-size--lg);
    font-weight: 600;
    color: var(--wp--preset--color--black);
}

.wc-block-grid__product-add-to-cart {
    margin-top: var(--wp--preset--spacing--4);
}

/* Product Image Gallery */
.wc-block-product-gallery {
    gap: var(--wp--preset--spacing--4);
}

.wc-block-product-gallery__thumbnail {
    cursor: pointer;
    opacity: 0.7;
    transition: opacity 0.3s ease;
    border: 1px solid transparent;
}

.wc-block-product-gallery__thumbnail:hover,
.wc-block-product-gallery__thumbnail.is-selected {
    opacity: 1;
    border-color: var(--wp--preset--color--black);
}

/* Add to Cart Button */
.wc-block-components-product-button button,
.wp-block-button.wc-block-cart__submit-button .wp-block-button__link {
    width: 100%;
    justify-content: center;
    background: var(--wp--preset--color--black);
    color: var(--wp--preset--color--white);
    padding: 1.25rem 2.5rem;
    font-family: var(--wp--preset--font-family--heading);
    font-size: var(--wp--preset--font-size--sm);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border: none;
    transition: all 0.3s ease;
}

.wc-block-components-product-button button:hover,
.wp-block-button.wc-block-cart__submit-button .wp-block-button__link:hover {
    background: var(--wp--preset--color--charcoal);
    transform: translateY(-2px);
}

/* Price Filter */
.wc-block-price-filter {
    padding: var(--wp--preset--spacing--6);
    background: var(--wp--preset--color--pearl);
}

.wc-block-price-filter__range-input-wrapper {
    margin: var(--wp--preset--spacing--6) 0;
}

/* Rating Stars */
.wc-block-components-review-list-item__rating .wc-block-components-review-list-item__rating__stars {
    color: var(--wp--preset--color--gold);
}

/* Breadcrumbs */
.woocommerce-breadcrumb,
.wc-block-breadcrumbs {
    font-size: var(--wp--preset--font-size--sm);
    color: var(--wp--preset--color--slate);
    margin-bottom: var(--wp--preset--spacing--8);
}

.woocommerce-breadcrumb a,
.wc-block-breadcrumbs a {
    color: var(--wp--preset--color--black);
    text-decoration: none;
    transition: color 0.3s ease;
}

.woocommerce-breadcrumb a:hover,
.wc-block-breadcrumbs a:hover {
    color: var(--wp--preset--color--gold);
}

/* ==========================================================================
   Navigation Block
   ========================================================================== */

.wp-block-navigation {
    gap: var(--wp--preset--spacing--10);
}

.wp-block-navigation-item a {
    position: relative;
    transition: color 0.3s ease;
}

.wp-block-navigation-item a::after {
    content: '';
    position: absolute;
    bottom: -4px;
    left: 0;
    width: 0;
    height: 1px;
    background: var(--wp--preset--color--gold);
    transition: width 0.3s ease;
}

.wp-block-navigation-item a:hover::after,
.wp-block-navigation-item.current-menu-item a::after {
    width: 100%;
}

/* Navigation Submenu */
.wp-block-navigation .wp-block-navigation__submenu-container {
    background: var(--wp--preset--color--white);
    border: 1px solid var(--wp--preset--color--pearl);
    padding: var(--wp--preset--spacing--4);
    box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.1);
}

/* ==========================================================================
   Search Block
   ========================================================================== */

.wp-block-search {
    position: relative;
}

.wp-block-search__input {
    padding: 0.875rem 1.25rem;
    border: 1px solid var(--wp--preset--color--pearl);
    background: var(--wp--preset--color--white);
    font-family: var(--wp--preset--font-family--body);
    font-size: var(--wp--preset--font-size--sm);
    transition: border-color 0.3s ease;
}

.wp-block-search__input:focus {
    outline: none;
    border-color: var(--wp--preset--color--black);
}

.wp-block-search__button {
    background: var(--wp--preset--color--black);
    color: var(--wp--preset--color--white);
    border: none;
    padding: 0.875rem 1.5rem;
    cursor: pointer;
    transition: background 0.3s ease;
}

.wp-block-search__button:hover {
    background: var(--wp--preset--color--charcoal);
}

/* ==========================================================================
   Social Links
   ========================================================================== */

.wp-block-social-links {
    gap: var(--wp--preset--spacing--6);
}

.wp-block-social-links .wp-block-social-link {
    transition: transform 0.3s ease;
}

.wp-block-social-links .wp-block-social-link:hover {
    transform: translateY(-2px);
}

/* ==========================================================================
   Custom Block Patterns Enhancements
   ========================================================================== */

/* Luxury animations */
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes fadeIn {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

/* Scroll animations (requires JavaScript) */
.animate-on-scroll {
    opacity: 0;
    animation: fadeInUp 0.8s cubic-bezier(0.4, 0, 0.2, 1) forwards;
}

/* ==========================================================================
   Responsive Utilities
   ========================================================================== */

@media (max-width: 1024px) {
    .wp-block-columns {
        gap: var(--wp--preset--spacing--8);
    }
}

@media (max-width: 768px) {
    .wp-block-cover__inner-container {
        padding: var(--wp--preset--spacing--8);
    }

    .wc-block-grid__products {
        grid-template-columns: repeat(2, 1fr) !important;
    }
}

@media (max-width: 480px) {
    .wc-block-grid__products {
        grid-template-columns: 1fr !important;
    }
}
