/* * Engravia x Flatsome PRO Stíluslap
 * Komplett átalakítás a Flatsome osztályainak prémium felülírásával.
 */

:root {
    --e-bg-color: #F9F8F6;
    --e-text-main: #2C2B29;
    --e-text-muted: #5A5855;
    --e-border: #D1CCC5;
    --e-white: #FFFFFF;
    --e-font-head: 'Cinzel', serif;
    --e-font-body: 'Montserrat', sans-serif;
}

/* ==========================================================================
   ALAPVETŐ FLATSOME FELÜLÍRÁSOK
   ========================================================================== */
body, .page-wrapper, #wrapper, .main-content {
    background-color: var(--e-bg-color) !important;
    color: var(--e-text-main) !important;
    font-family: var(--e-font-body) !important;
}

h1, h2, h3, h4, h5, h6, 
.uppercase, .widget-title, .nav > li > a {
    font-family: var(--e-font-head) !important;
    color: var(--e-text-main) !important;
    letter-spacing: 1.5px;
}

p, span, div, li, a {
    font-family: var(--e-font-body);
}

/* HEADER (Fejléc letisztítása) */
.header-main {
    background-color: var(--e-bg-color) !important;
    border-bottom: 1px solid var(--e-border) !important;
}
.header-nav .nav > li > a {
    text-transform: uppercase;
    font-weight: 600;
}

/* ==========================================================================
   GOMBOK (Egységesített prémium kinézet)
   ========================================================================== */
.button, button, input[type="submit"], input[type="button"], .button.primary, .button.is-outline {
    border-radius: 0 !important;
    font-family: var(--e-font-head) !important;
    text-transform: uppercase !important;
    letter-spacing: 2px !important;
    transition: all 0.3s ease-in-out !important;
    box-shadow: none !important;
}

/* Normál / Primary gomb (pl. Kosárba, Pénztár) */
.button.primary, button.primary, .checkout-button, .single_add_to_cart_button {
    background-color: var(--e-text-main) !important;
    color: var(--e-white) !important;
    border: 1px solid var(--e-text-main) !important;
    padding: 10px 30px !important;
}

.button.primary:hover, button.primary:hover, .checkout-button:hover, .single_add_to_cart_button:hover {
    background-color: transparent !important;
    color: var(--e-text-main) !important;
}

/* Outline gomb */
.button.is-outline {
    border-color: var(--e-text-main) !important;
    color: var(--e-text-main) !important;
}
.button.is-outline:hover {
    background-color: var(--e-text-main) !important;
    color: var(--e-white) !important;
}

/* ==========================================================================
   TERMÉKKATALÓGUS (Shop oldal - Flatsome .product-small)
   ========================================================================== */
.products .product-small {
    padding: 15px;
    background: transparent;
    border: 1px solid transparent;
    transition: all 0.4s ease;
}

.products .product-small:hover {
    border-color: var(--e-border);
    background: var(--e-white);
    transform: translateY(-5px);
}

.products .product-small .box-image {
    border: 1px solid var(--e-border);
    padding: 10px;
    background: var(--e-white);
}

.product-small .product-title {
    font-family: var(--e-font-head) !important;
    font-size: 1.2em;
    color: var(--e-text-main);
    margin-top: 15px;
}

.product-small .price {
    font-family: var(--e-font-body) !important;
    font-weight: 300;
    color: var(--e-text-muted);
}

.product-small .add-to-cart-button {
    opacity: 0;
    transition: opacity 0.3s ease;
}
.product-small:hover .add-to-cart-button {
    opacity: 1;
}

/* ==========================================================================
   TERMÉKOLDAL (.product-main)
   ========================================================================== */
.product-main {
    padding-top: 50px;
}

.product-gallery .woocommerce-product-gallery__image {
    border: 1px solid var(--e-border);
    padding: 20px;
    background: var(--e-white);
}

.product-info .product-title {
    font-size: 2.8em !important;
    border-bottom: 1px solid var(--e-border);
    padding-bottom: 20px;
    margin-bottom: 20px;
}

.product-info .price {
    font-size: 1.8em !important;
    font-weight: 400 !important;
    color: var(--e-text-main) !important;
}

/* Mennyiségválasztó doboz */
.quantity input.qty {
    border: 1px solid var(--e-border) !important;
    border-radius: 0 !important;
    background: transparent !important;
    height: 45px !important;
}
.quantity .minus, .quantity .plus {
    border: 1px solid var(--e-border) !important;
    border-radius: 0 !important;
    background: var(--e-bg-color) !important;
}

/* Termék tabok (Leírás, Értékelések) */
.product-page-accordian .accordion-title,
.woocommerce-tabs .tab > a {
    font-family: var(--e-font-head) !important;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: var(--e-text-muted) !important;
}
.woocommerce-tabs .tab.active > a {
    color: var(--e-text-main) !important;
    border-bottom: 2px solid var(--e-text-main) !important;
}

/* ==========================================================================
   KOSÁR ÉS PÉNZTÁR (.cart-wrapper, .checkout-wrapper)
   ========================================================================== */
.cart-wrapper, .checkout-wrapper {
    background: var(--e-white);
    padding: 40px;
    border: 1px solid var(--e-border);
    margin-top: 40px;
    margin-bottom: 40px;
}

.woocommerce-cart-form th, .shop_table th {
    background-color: transparent !important;
    color: var(--e-text-main) !important;
    border-bottom: 2px solid var(--e-text-main) !important;
    font-family: var(--e-font-head);
    text-transform: uppercase;
}

.woocommerce-cart-form td, .shop_table td {
    border-bottom: 1px solid var(--e-border) !important;
}

/* Űrlapmezők (Inputok) */
input[type="text"], input[type="email"], input[type="tel"], input[type="password"], textarea, select, .select2-selection {
    background-color: var(--e-bg-color) !important;
    border: 1px solid var(--e-border) !important;
    border-radius: 0 !important;
    padding: 10px 15px !important;
    font-family: var(--e-font-body) !important;
    color: var(--e-text-main) !important;
    box-shadow: none !important;
}

input[type="text"]:focus, input[type="email"]:focus, textarea:focus {
    border-color: var(--e-text-main) !important;
    background-color: var(--e-white) !important;
}

/* Fizetési módok doboz */
#payment {
    background: var(--e-bg-color) !important;
    border: 1px solid var(--e-border) !important;
    border-radius: 0 !important;
    padding: 20px !important;
}
#payment ul.payment_methods {
    border-bottom: 1px solid var(--e-border) !important;
}