/*
Theme Name: Envo One Child 02
Theme URI: https://envothemes.com/envo-one-woocommerce/
Template: envo-one
Author: EnvoThemes
Author URI: https://envothemes.com/
Description: Envo One is a fast, clean, lightweight, customizable and modern-looking free responsive WooCommerce WordPress theme for e-commerce stores like clothing, fashion, electronics, ebooks, dress store, sports shop, marketplace, multivendor, equipments or online products. Theme works perfectly with the new block editor (Gutenberg) and popular page builders like Elementor, Beaver Builder, SiteOrigin, Thrive Architect, Divi, Brizy, Visual Composer etc. Theme is compatible with YITH WooCommerce Wishlist, YITH WooCommerce Compare, WooCommerce Variation Swatches and other popular plugins. The theme is SEO friendly, WPML and RTL ready. Theme demo ready to import: https://envothemes.com/envo-one/
Tags: one-column,two-columns,full-width-template,right-sidebar,custom-background,custom-menu,custom-header,editor-style,featured-images,translation-ready,custom-logo,threaded-comments,footer-widgets,rtl-language-support,blog,e-commerce
Version: 1.1
Updated: 2026-01-26 12:31:35



@media (min-width: 992px) {
    /* Pääkääre toimii kuin taulukko */
    .kauppa-poyta-rakenne {
        display: table !important;
        width: 100% !important;
        border-spacing: 30px 0 !important; /* Väli valikon ja tuotteiden väliin */
        table-layout: fixed !important;
    }

    /* Valikkosolu */
    .kauppa-solu-vasen {
        display: table-cell !important;
        width: 25% !important; /* Voit säätää tätä: esim. 250px tai 25% */
        vertical-align: top !important;
    }

    /* Tuotesolu */
    .kauppa-solu-oikea {
        display: table-cell !important;
        width: 75% !important;
        vertical-align: top !important;
    }

    /* Poistetaan teeman omat float-häiriöt */
    #primary {
        width: 100% !important;
        float: none !important;
        margin: 0 !important;
    }

    /* Piilotetaan se teeman oma sivuvalikko, joka näkyy edelleen jossain */
    #secondary {
        display: none !important;
    }
}

/* Mobiiliasettelu */
@media (max-width: 991px) {
    .kauppa-poyta-rakenne, .kauppa-solu-vasen, .kauppa-solu-oikea {
        display: block !important;
        width: 100% !important;
    }
}

/* LEIVÄNMURUJEN TYYLI */
.woocommerce-breadcrumb {
    padding: 15px 0 !important;
    font-size: 14px !important;
    color: #777 !important;
    margin-bottom: 20px !important;
    border-bottom: 1px solid #eee !important;
}

.woocommerce-breadcrumb a {
    color: #333 !important;
    text-decoration: none !important;
}

/* LEIVÄNMURUT (BREADCRUMBS) */
.woocommerce-breadcrumb {
    background-color: #f9f9f9 !important;
    padding: 12px 20px !important;
    border-radius: 5px !important;
    font-size: 13px !important;
    color: #888 !important;
    margin-bottom: 25px !important;
    display: block !important;
}

.woocommerce-breadcrumb a {
    color: #cc0000 !important; /* Punainen korostusväri */
    text-decoration: none !important;
    font-weight: 500 !important;
}

.woocommerce-breadcrumb a:hover {
    text-decoration: underline !important;
}

/* KATEGORIAN OTSIKKO JA KUVAUS (KAUPPASIVU) */
.woocommerce-products-header {
    margin-bottom: 30px !important;
    border-bottom: 2px solid #eee !important;
    padding-bottom: 20px !important;
}

.woocommerce-products-header__title {
    font-size: 32px !important;
    font-weight: 800 !important;
    color: #222 !important;
    margin-top: 0 !important;
}

.term-description p {
    font-size: 16px !important;
    color: #555 !important;
    line-height: 1.6 !important;
    max-width: 800px;
}
/* Kohdistetaan kaikkiin muihin paitsi ensimmäiseen listan jäseneen, jos ne ovat peräkkäin */
.oma-valikko-sisus ul li li {
    margin-left: 25px !important;
    padding-left: 10px !important;
    border-left: 1px solid #ccc !important;
    display: block !important;
}

/* Lisätään se nuoli tällä tavalla */

@media (max-width: 991px) {
    .envo-one-sidebar, #secondary, .sidebar {
        display: none !important;
    }
}
/* 1. POISTETAAN TYHJÄT LAATIKOT TUOTTEIDEN SEASTA */
.type-product.product-category, 
.product-category.product, 
.kauppa-solu-oikea .product-category {
    display: none !important;
}

/* 2. TYYLLITELLÄÄN YLÄRIVIN KATEGORIAT (Liite 1 mukaisesti) */
.oma-kategorialista-uusi {
    display: flex !important;
    flex-wrap: wrap;
    gap: 20px;
    list-style: none !important;
    padding: 0 !important;
    margin: 20px 0 !important;
    justify-content: flex-start;
}

.oma-kategorialista-uusi li {
    flex: 0 0 150px;
    text-align: center;
    background: #fff;
    padding: 15px;
    border: 1px solid #eee;
    border-radius: 10px;
    transition: transform 0.2s;
}

.oma-kategorialista-uusi li:hover {
    transform: translateY(-5px);
    box-shadow: 0 5px 15px rgba(0,0,0,0.1);
}

.oma-kategorialista-uusi img {
    width: 60px !important;
    height: 60px !important;
    object-fit: contain;
    margin-bottom: 10px;
}

.oma-kategorialista-uusi span {
    display: block;
    font-weight: 700;
    color: #333;
    font-size: 14px;
}

.valiviiva {
    border: 0;
    border-top: 1px solid #eee;
    margin: 30px 0;
}


/* Kohdistetaan tyylit myös brändi-widgettiin */
.oma-valikko-sisus .widget_layered_nav ul, 
.oma-valikko-sisus .brand-list-widget ul {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

.oma-valikko-sisus .widget_layered_nav li a,
.oma-valikko-sisus .brand-list-widget li a {
    color: #cc0000 !important;
    text-decoration: none !important;
    font-weight: 700 !important;
    display: block;
    padding: 8px 0;
    border-bottom: 1px solid #f2f2f2;
}

/* Piilotetaan oikea sivupalkki kaikkialta */
aside#secondary, 
.widget-area, 
.envo-one-sidebar-right {
    display: none !important;
}

/* Varmistetaan, että pääsisältö täyttää vapautuneen tilan */
#primary.content-area {
    width: 100% !important;
    float: none !important;
}




#oma-etusivu-valikko {
    background: #ffffff !important;
    border: 1px solid #e0e0e0 !important;
    padding: 20px !important;
    border-radius: 12px !important;
    box-shadow: 0 4px 15px rgba(0,0,0,0.06) !important;
}

#oma-etusivu-valikko ul { list-style: none !important; padding: 0 !important; }
#oma-etusivu-valikko li { border-bottom: 1px solid #f2f2f2 !important; padding: 10px 0 !important; }
#oma-etusivu-valikko a { color: #cc0000 !important; font-weight: 700 !important; text-decoration: none !important; }
/* 1. LISÄTÄÄN NUOLET ALAKATEGORIOIDEN ETEEN */



/* 2. SISENNETÄÄN ALAKATEGORIAT OIKEALLE */
#oma-etusivu-valikko li ul {
    padding-left: 20px !important;
    margin: 0 !important;
    display: block !important;
}

/* 3. POISTETAAN PALLURAT (jos niitä ilmestyy) */
#oma-etusivu-valikko li {
    list-style: none !important;
}


/*footer*/
/* PAKOTETAAN ALATUNNISTE JA SEN SISÄLTÖ PUNAISEKSI */
footer, 
[id*="colophon"], 
[class*="site-footer"], 
[class*="footer-section"],
[id*="footer"],
section.footer-widgets-area,
.envo-one-footer-area,
.envo-one-footer-area .container,
.envo-one-footer-area .container-fluid {
    background-color: #cc0000 !important;
    background: #cc0000 !important;
    background-image: none !important;
}

/* PAKOTETAAN ALATUNNISTEEN LINKIT VALKOISIKSI */
footer a, 
[id*="colophon"] a, 
[class*="site-footer"] a, 
[class*="footer-section"] a,
[id*="footer"] a,
section.footer-widgets-area a,
.envo-one-footer-area a,
.envo-one-footer-area .container a,
.envo-one-footer-area .container-fluid a,
.footer-copy-right a {
    color: #ffffff !important;
}
/* ALATUNNISTEEN LINKKIEN VÄRI, KUN HIIRI ON PÄÄLLÄ */
footer a:hover, 
[id*="colophon"] a:hover, 
[class*="site-footer"] a:hover, 
[class*="footer-section"] a:hover,
[id*="footer"] a:hover,
section.footer-widgets-area a:hover,
.envo-one-footer-area a:hover,
.envo-one-footer-area .container a:hover,
.envo-one-footer-area .container-fluid a:hover,
.footer-copy-right a:hover,
footer a:hover span {
    color: #cccccc !important; /* Vaaleanharmaa */
    text-decoration: underline !important;
    transition: 0.3s; /* Pehmentää värin vaihtumista */
}




/* 1. PAKOTETAAN VALIKKOPALKIN TAUSTA PUNAISKSI */
header#masthead .site-navigation-wrapper, 
header#masthead .main-navigation,
.header-area .main-navigation,
div#site-navigation {
    background-color: #cc0000 !important;
    background: #cc0000 !important;
}

/* 2. PAKOTETAAN VALIKON LINKIT VALKOISIKSI */
#site-navigation ul li a, 
#site-navigation ul li a span,
.main-navigation ul li a, 
.main-navigation ul li a span,
header#masthead .main-navigation ul li a {
    color: #ffffff !important;
}

/* 3. POISTETAAN PUNAISET REUNAT TAI PISTEET JOTKA VOIVAT HÄIRITÄ */
.main-navigation ul li {
    background: transparent !important;
}

/* 4. HOVER-EFEKTI (Valkoinen teksti, mutta tausta muuttuu hieman tummemmaksi) */
#site-navigation ul li a:hover,
.main-navigation ul li a:hover {
    color: #ffffff !important;
    background-color: rgba(0,0,0,0.1) !important;
}
/* PAKOTETAAN KOKO VALIKKOALUEEN TAUSTA PUNAISKSI */
.site-header .main-navigation,
.main-navigation .container,
.main-navigation-wrapper,
.header-menu-section,
nav#site-navigation,
.envo-one-main-menu-container {
    background-color: #cc0000 !important;
    background: #cc0000 !important;
}

/* POISTETAAN MAHDOLLINEN VALKOINEN VARJO TAI REUNUS */
header#masthead, 
.site-header {
    border-bottom: none !important;
    box-shadow: none !important;
}

/* VARMISTETAAN ETTÄ VALIKON RIVI TÄYTTÄÄ TAUSTAN */
.main-navigation ul {
    background-color: #cc0000 !important;
}


/* ALAVALIKON TEKSTIT MUSTIKSI */
#site-navigation ul li ul li a, 
.main-navigation ul li ul li a,
.dropdown-menu li a,
.sub-menu li a {
    color: #333333 !important; /* Tummanharmaa/musta */
}





/* Kohdistetaan valikkoon, joka näkyy kuvassasi */
#site-navigation.navbar.navbar-default {
    width: 100vw !important;
    position: relative !important;
    left: 50% !important;
    right: 50% !important;
    margin-left: -50vw !important;
    margin-right: -50vw !important;
    border-radius: 0 !important;
    border: none !important;
    /* Varmistetaan, että taustaväri pysyy punaisena koko matkan */
    background-color: #c40000 !important; 
}

/* Valinnaiset: Jos haluat poistaa tyhjät välit valikon ympäriltä */
.menu-header {
    padding: 0 !important;
}

.heading-row.row {
    margin: 0 !important;
}
/* Pidetään palkki koko näytön levyisenä */
#site-navigation.navbar.navbar-default {
    width: 100vw !important;
    position: relative !important;
    left: 50% !important;
    right: 50% !important;
    margin-left: -50vw !important;
    margin-right: -50vw !important;
    border-radius: 0 !important;
    border: none !important;
    background-color: #c40000 !important;
}

@media (min-width: 1200px) {
    #site-navigation ul.nav {
		
        padding-left: calc((100vw - 1275px) / 2) !important;
    }
}

/* LEIVÄNMURUT (BREADCRUMBS) */
.woocommerce-breadcrumb {
    background-color: #f9f9f9 !important;
    padding: 12px 20px !important;
    border-radius: 5px !important;
    font-size: 13px !important;
    color: #888 !important;
    margin-bottom: 25px !important;
    display: block !important;
}

.woocommerce-breadcrumb a {
    color: #cc0000 !important; /* Punainen korostusväri */
    text-decoration: none !important;
    font-weight: 500 !important;
}

.woocommerce-breadcrumb a:hover {
    text-decoration: underline !important;
}

footer#colophon {
    display: block !important;
    clear: both !important;
}

.archive.post-type-archive-product footer {
    display: block !important;
    visibility: visible !important;
}
/* Piilotetaan kustomoitu kategoria-alue kaupan etusivulla/pääsivulla */
/*body.woocommerce-shop .oma-kategoria-alue,
body.post-type-archive-product .oma-kategoria-alue,
body.home.woocommerce .oma-kategoria-alue {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
}*/


/* Pakotetaan teeman tekijänoikeusteksti piiloon footerin ID:n avulla */
#colophon .footer-credits-text,
footer#colophon .footer-credits-text {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
}


/* Rakennetaan oma harmaa nappi ja yliajetaan teeman punainen linkkiväri */
html body .woocommerce ul.products li.product a.oma-loppu-nappi,
html body ul.products li.product a.oma-loppu-nappi {
    display: inline-block !important;
    background-color: #f7f7f7 !important; /* Vaaleanharmaa tausta */
    color: #999999 !important; /* Pakotetaan teksti harmaaksi (ei punaiseksi) */
    border: 1px solid #dddddd !important; /* Harmaa reunus */
    padding: 10px 25px !important; /* Samat mittasuhteet kuin alkuperäisessä napissa */
    margin-top: 10px !important;
    text-decoration: none !important;
    cursor: not-allowed !important; /* Estomerkki hiirelle */
    font-size: 14px !important;
    font-weight: 400 !important;
    text-align: center !important;
    border-radius: 2px !important;
    min-width: 150px !important; /* Pakotetaan napille leveyttä */
    box-sizing: border-box !important;
}

/* Oma hover-efekti, joka pysyy harmaana */
html body .woocommerce ul.products li.product a.oma-loppu-nappi:hover,
html body ul.products li.product a.oma-loppu-nappi:hover {
    background-color: #eeeeee !important;
    color: #888888 !important;
    border: 1px solid #cccccc !important;
    text-decoration: none !important;
}