/* 
    Tires adn Wheels Front CSS
    Created on : Sep 25, 2023, 12:42:07 PM
    Author     : Tarkhiir
    User: Autotaht
*/
/*
----- MAIN -----
*/
.alert {
    color: red;
}
/*
----- ALIGNING -----
*/
.center {
    text-align: center;
}
.left {
    text-align: left;
}
.right {
    text-align: right;
}
/*
----- FLEX CONTAINER-----
*/
.flex-container {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    padding-bottom: 1%;
}
.flex-container div.tw-container {
    position: relative;
    margin: 2%;
}
.flex-container i, .gb-headline i {
    padding: 10px;
    color: #999;
}
.flex-col-1 {
    flex-basis: 100%;
}
.flex-col-2 {
    flex-basis: 50%;
}
.flex-col-3 {
    flex-basis: 33%;
}
.flex-col-4 {
    flex-basis: 25%;
}
.flex-col-5 {
    flex-basis: 20%;
/*    width: 16%;*/
}
.flex-col-6 {
    flex-basis: 16%;
}
.flex-left {
    justify-content: left;
}
/*
----- AVALEHT -----
*/
h2.avaleht a, p.avaleht a  {
    color: white;
}
/*
----- PAGINATION -----
*/
.pagination {
    width: 50%;
    margin: 0 auto;
    text-align: center;
    padding-bottom: 1.5em;
}
.flex-col-pagination {
    width: 10%;
    padding: 1em;
    border: 1px solid #ddd;
}
.pagination a {
    color: #999;
    font-weight: bold;
}
.pagination a.active, .pagination a:hover {
    border: 1px solid #e3bd00;
    color: #e3bd00;
}
.flex-col-pagination i {
    padding: 0;
}
/*
----- FORM CONTAINER -----
*/
.form-container {
    padding: 1%;
}
.form-container input:focus {
    background: transparent;
}
.form-container h1 {
    color: white;
}
.form-container h2 {
    color: #999;
    margin: 10px 0;
    font-size: 20px;
}
.form-container-element {
    min-width: 100%;
    background: transparent;
    color: white;
    margin-bottom: 0.5em;
    padding: 0.5em;
}
label.form-container-element {
    font-weight: 500;
    color: #999;
}
select.form-container-element {
    background-color: rgba(0,0,0,0.5);
}
select.form-container-element option {
    background-color: black;
    color: #ddd;
}
/*
----- ICON CONTAINER -----
*/
.tw-icon-container {
    margin-bottom: 1em;
}
div.tw-search-icon {
    border: none;
    border-bottom: 1px solid #999;
    padding: 0.25em;
    cursor: pointer;
}
.tw-icon-container i  {
    scale: 1.5;
}
div.tw-active-icon {
    background-color: #e3bd00;
    border-color: white;
}
div.tw-active-icon i, div.tw-active-icon h2 {
    color: white;
}
div.tw-search-icon i:hover {
    color: #eee;
    border-color: white;
}
/*
----- PRODUCT -----
*/
.tw-product {
    padding: 1.5em;
    box-shadow: 0px 0px 15px -4px rgba(0,0,0,0.3);
}
.tw-product:hover {
    box-shadow: 0px 0px 15px -8px rgba(0,0,0,0.3);
}
.tw-product:hover .product-title {
    color: #999;
}
.tw-icons {
    margin: 0;
    padding: 0.5em 0;
    min-height: 3.3em;
    border-top: 1px solid #eee;
    border-bottom: 1px solid #eee;
    color: #999;
}
h6.tw-icons {
    color: #000;
}
.tw-icons i {
    color: #e3bd00;
}
div.tw_category_img img {
/*    max-height: 276px;*/
    height: 276px;
    width: auto;
}
div.tw_category_img2 {
    z-index: 1;
    display: none;
    min-height: 276px;
    padding: 1.5em;
}
/*
---- BRAND LOGO -----
*/
img.brand-logo {
    max-height: 25px;
}
img.nordic-logo {
    max-height: 75px;
    padding-top: 1em;
}
.tire-logo {
    max-height: 25px;
    min-height: 25px;
}
/*
---- TITLE -----
*/
.product-title {
    min-height: 4em;
    margin: 0;
    padding-top: 0.5em;
}
/*
---- SHORT DESCRIPTION -----
*/
div.tw-kirjeldus {
    margin-bottom: 1.5em;
}
div.tw-kirjeldus div.tire-data {
    padding: 0.25em 1em;
    border-bottom: 1px solid #ddd;
}
div.tw-kirjeldus div.flex-container {
    padding: 0;
}
div.tw-kirjeldus div.flex-container div {
    border-bottom: none;
}
div.tw-kirjeldus img.brand-logo {
    max-height: 30px;
    margin-bottom: 1em;
}
div.tw-kirjeldus img.nordic-logo {
    max-height: 75px;
    margin-bottom: 1em;
}
/*
----- LISA REHVIVAHETUS
*/
div.lisa-paigaldus {
    padding: 1.5em;
    margin-bottom: 2em;
    border-bottom: 1px solid #555;
    border-top: 1px solid #555;
}
/*
----- PRICE / STOCK -----
*/
.tw-price {
    font-size: 1.5em;
    color: #e3bd00;
}
.tw-regular-price-on-sale {
    color: #555; 
    font-size: 0.9em;
    font-weight: normal;
    text-decoration: line-through;   
}
.tw-in-stock {
    color: green;
    margin-bottom: 0;
}
.tw-on-backorder {
    color: #999;
    margin-bottom: 0;
}
.woocommerce div.product p.stock {
    font-size: 1.2em !important;
    font-weight: 500;
    margin-bottom: 0.5em;
}
p.alert {
    margin-bottom: 0.5em;
    font-size: 1.2em;
}
/*
----- OVERLAY -----
*/
.overlay {
    position: absolute;
    top: 0;
    left: 0;
}
/*
----- CHECKOUT -----
*/
.autotaht-checkout-input {
    display: none;
}
/*
----- MOBILE -----
*/
@media (max-width: 1024px) {
    .flex-container {
        flex-direction: column;
    }
    .pagination .flex-container {
        flex-direction: row;
    }
    .pagination {
        width: 90%;
    }
    .flex-col-pagination {
        width: calc(100% / 7);
        font-size: 12px;
    }
/*    .flex-col-2, .flex-col-3, .flex-col-4, .flex-col-5, .flex-col-6 {
        width: 96%;
    }*/

}