/*
Theme Name: Ferrufficio Storefront Child
Template: storefront
Description: Child theme personalizzato per Ferrufficio e-commerce
Version: 1.0
Author: Ferrufficio
*/

/* ==========================================================================
   COLORI BRAND FERRUFFICIO
   ========================================================================== */

:root {
    --ferrufficio-orange: #FF6500;
    --ferrufficio-orange-hover: #e55a00;
    --ferrufficio-green: #2C5F2D;
}

/* Colore primario - Arancione */
.storefront-primary-navigation a:hover,
.site-header-cart .cart-contents:hover,
.main-navigation ul li a:hover,
.site-title a:hover {
    color: var(--ferrufficio-orange);
}

/* Bottoni */
.button,
.button.alt,
button,
input[type="submit"],
input[type="button"],
.woocommerce #respond input#submit,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit.alt,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt {
    background-color: var(--ferrufficio-orange);
    border-color: var(--ferrufficio-orange);
    color: #fff;
}

.button:hover,
.button.alt:hover,
button:hover,
input[type="submit"]:hover,
input[type="button"]:hover,
.woocommerce #respond input#submit:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover {
    background-color: var(--ferrufficio-orange-hover);
    border-color: var(--ferrufficio-orange-hover);
}

/* Header */
.site-header {
    background-color: #ffffff;
    border-bottom: 1px solid #e8e8e8;
}

.site-title a,
.site-description {
    color: #333333;
}

/* Link */
a {
    color: #0066CC;
}

a:hover {
    color: var(--ferrufficio-orange);
}

/* WooCommerce - Prezzi */
.woocommerce .price .amount,
.woocommerce ul.products li.product .price {
    color: var(--ferrufficio-orange);
    font-weight: 700;
}

/* WooCommerce - Stelle recensioni */
.woocommerce .star-rating span {
    color: var(--ferrufficio-orange);
}

/* Badge "In offerta" */
.woocommerce span.onsale {
    background-color: var(--ferrufficio-orange);
}

/* Footer - Stile Kenovo (grigio chiaro, altezza ridotta) */
.site-footer {
    background-color: #f5f5f5;
    color: #333333;
    padding-top: 20px !important;
    padding-bottom: 10px !important;
}

.footer-widgets {
    padding-top: 15px !important;
    padding-bottom: 15px !important;
    margin-bottom: 0 !important;
}

.footer-widgets .widget {
    margin-bottom: 10px !important;
}

.footer-widgets .widget-title {
    margin-bottom: 10px !important;
    padding-bottom: 5px !important;
}

.site-footer a,
.footer-widgets a,
.site-footer .widget a {
    color: #333 !important;
}

.site-footer a:hover,
.footer-widgets a:hover,
.site-footer .widget a:hover {
    color: #FF6500 !important;
    text-decoration: none;
}

.site-footer .widget {
    margin-bottom: 20px;
}

.site-footer .widget-title {
    color: #333333;
    font-size: 16px;
    font-weight: bold;
    margin-bottom: 15px;
}

.site-info {
    background-color: #f5f5f5;
    border-top: 1px solid #e0e0e0;
    padding: 10px 0 !important;
    font-size: 13px;
    color: #666666;
}

/* Elementor compatibility */
.elementor-widget-button .elementor-button {
    background-color: var(--ferrufficio-orange);
}

.elementor-widget-button .elementor-button:hover {
    background-color: var(--ferrufficio-orange-hover);
}

/* Homepage Categories Grid - Kenovo Style */
.categories-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
    max-width: 800px;
    margin: 40px auto;
    padding: 0 20px;
}

.categoria-card {
    position: relative;
    display: block;
    overflow: hidden;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    transition: all 0.3s ease;
    background: #fff;
    text-decoration: none;
}

.categoria-card:hover {
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.2);
}

.categoria-card img {
    width: 100%;
    height: 200px;
    object-fit: contain;
    background: #fff;
    padding: 10px;
    transition: transform 0.3s ease;
}

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

.categoria-card .label {
    background: #FF6500;
    color: white;
    text-align: center;
    padding: 12px;
    font-weight: bold;
    text-transform: uppercase;
    font-size: 14px;
    letter-spacing: 0.5px;
}

/* Mobile responsive */
@media (max-width: 768px) {
    .categories-grid {
        grid-template-columns: 1fr;
        gap: 15px;
    }

    .categoria-card img {
        height: 180px;
    }
}