/*

Theme Name: astra-child

Template: astra

Author: Tvůj Název

Description: Child Theme pro Astra

Version: 1.0.0

*/

.ast-custom-button:hover{
    background-color: #038aff;
}

.elementor-widget-container p {
    text-decoration: none;
    color: black;
}

a:focus, a:active {
    outline: none !important;
    border: none !important;
}

.orderby:focus, .orderby:active{
    border: none !important;
}

.wpcf7-form p label{
    font-weight: 300;
    font-family: 'Kanit';
    font-size: 16px;
}

.nabidka-title{
    margin-bottom: 50px;
}

.ast-primary-header-bar, .ast-primary-header, .main-header-bar, .site-header-focus-item {
    border-radius: 8px;
}

.ast-separate-container #primary, .ast-separate-container.ast-left-sidebar #primary, .ast-separate-container.ast-right-sidebar #primary{
    margin-top: 30px;
    margin-bottom: 30px;
}

footer{
    order: 4;
}

/* Karta auta */

.card {
    display: flex;
    background-color: white;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}  

.custom-product-item{
    border-radius: 8px;
}

.image-container {
    position: relative; /* Důležité pro pozicování štítků */
}

.content {
    padding-left: 30px;
    padding-top: 8px;
    display: flex;
    flex-direction: column;
}

.title {
    font-size: 1.2em; 
    font-weight: bold;
    margin-bottom: 8px;
}

.details {
    display: grid;
    grid-template-columns: auto auto;
}

.vehicle-info img {
    width: 20px; 
    height: auto; 
    vertical-align: top;
    margin-right: 5px;
}

.woocommerce-js ul.products li.product a img {
    margin-bottom: 0;
    border-radius: 8px;
    width: 335px;
    height: 250px;
}

.etikety-container {
    position: absolute;
    top: 10px;
    
}

.etikety-container > div {
    margin-bottom: 5px; 
    padding: 5px 15px;
    color: white;
    font-size: 14px;
    border-radius: 3px;
    white-space: nowrap;
}

.sleva-etiketa {
    background-color: red;
}

.odpocet-dph-etiketa {
    background-color: #00A6FC;
}

.rezervovano-etiketa {
    background-color: orange;
} 

.product-button{
    width: 180px; 
    border-radius: 8px;
    text-decoration: none;
    margin-bottom: 10px;
    text-align: center;
    padding: 12px 0px;
    margin-top: auto;
}

.product-button:hover{
    background-color: #038aff;

}

.wpc-filters-submit-button {
    transition: background-color 0.3s ease;
  }
  
  .wpc-filters-submit-button:hover {
    background-color: #038aff !important;
  }

.cena-container{
    margin-top: auto;
}

.cena-bez-slevy {
    margin-top: auto;
    margin-bottom: 20px;
}

.vehicle-info{
    margin: 5px;
} 

.cena{
    font-size: 20px;
}

.cena-hodnota-akcni{
    font-weight: bold;
    color: red;
}

.akcni-cena {
    font-size: 20px;
    color: red;
    font-weight: bold;
    margin-left: 5px;
}

.cena-hodnota-normal{
    color:#00A6FC;
    font-weight: bold;
    margin-left: 5px;
}

.puvodni-cena-hodnota {
    text-decoration: line-through;
    margin-left: 5px;
}

.woocommerce.ast-separate-container .ast-woocommerce-container{
    background-color: #f5f5f4;
    padding: 0em 1em;
}

#secondary{
    padding: 10px !important;
}


/* Single product */

    .product-grid-container {
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        grid-template-rows: auto auto; /* Dva řádky */
        grid-gap: 20px; /* Mezera mezi sekcemi */
    }
    
    .product-section {
        background-color: white; /* Pro lepší viditelnost sekcí */
        padding: 20px;
        border-radius: 8px;
    }
    
    .product-section-1 {
        /* Obrázky */
        grid-row: 1 / span 2; /* Zabírá dva řádky */
        padding: 0;
        background-color: transparent;
    }
    
    /* Informace o aute (nazev, cena, atd.) */
    .product-section-2 {
        grid-column: 2;
        grid-row: 1;
    }
    
    .ast-custom-button, .product-button, .single-button{
        margin-top: auto;
    }
    
    /* Detail vozu */
    .product-section-3 {
        grid-column: 2; 
        grid-row: 2; 
    }
    
    /* Sekce vybava */
    .product-section-4{
        grid-column: 1;
        grid-row: 3;
        order: 3; /* Umístění před motor */
    }
    
    /* Sekce motor */
    .product-section-5 {
        grid-column: 2;
    }
    
    .product-images {
        width: 100% !important;
        margin-bottom: 20px;
    }
    
    .single-product-title{
        margin-bottom: 15px;
    }
    
    .product-info-top{
        width: 100%;
    }
    
    .single-button{
        margin-top: 20px;
    }
    
    .vybava-table {
        width: 100%;
        border-collapse: collapse; /* Odstranění mezer mezi buňkami */
    }
    
    .vybava-table td {
        width: 50%; /* Dva sloupce se stejnou šířkou */
        padding: 5px;
        vertical-align: top; /* Zarovnání obsahu buněk nahoru */
    }
    
    .vybava-list{
        column-count: 2;
        list-style-type: "•";
    }
    
    .vybava-list li{
        padding-inline-start: 1rem;
        break-inside: avoid;
    }
    
    .vybava-list ul li{
        line-height: 1.25rem;
        margin-block-end: .25rem;
    }
    
    /* Další styly z tvého CSS, které chceš zachovat */
    
    .site-main{
        max-width: 1140px;
        margin: 0 auto;
    }
    
    .d-flex {
        display: flex;
        flex-wrap: wrap; 
    }
    
    .flex-viewport{
        border-radius: 8px;
    }
    
    .woocommerce-product-gallery, .woocommerce-product-gallery--with-images, .woocommerce-product-gallery--columns-4, .images{
        width: 100% !important;
    }
    
    .product-meta{
        display: grid;
        grid-template-columns: auto auto;
    }
    
    .site-content{
        background-color: #f5f5f4;
    }
    
    .flex-control-nav li img{
        border-radius: 8px;
    }
    
    .product-header {
        display: flex;
        flex-wrap: wrap;
        margin-bottom: 30px;
    }
    
    .woocommerce-js, div.product, div.images{
        margin-bottom: -1em !important;
    }
    
    .product-details table, .motor-details table {
        width: 100%;
        border-collapse: collapse; 
        border-spacing: 0;
    }
    
    .product-details th, .product-details td, .motor-details th, .motor-details td {
        border-bottom: 1px solid #ddd;
        padding: 8px;
        text-align: left; 
    }
    
    .product-details th {
        width: 40%;
        font-weight: normal;
    }
    
    .product-details td {
        width: 60%;
        text-align: right;
    }
    
    .motor-details th {
        width: 40%;
        font-weight: normal;
    }
    
    .motor-details td {
        width: 60%;
        text-align: right;
    }
    
    table, td, th{
        border: 1px 0px solid var(--ast-border-color);
    }

@media (max-width: 1200px){
    .ast-plain-container.ast-no-sidebar #primary{
        margin-top: 15px;
        margin-bottom: 15px;
    }
}
@media (max-width: 921px){

    .site-main{
        max-width: 921px;
        margin: 0 auto;
    }

    .product-grid-container {
        grid-template-columns: 1fr; /* Dva sloupce */
        display: block !important;
        grid-gap: 10px;
    }

    .product-section-1 {
        grid-row: auto;
    }

     .product-section-2 {
        grid-column: auto;
        grid-row: auto;
    } 

    .product-section-3 {
        grid-column: auto;
        grid-row: auto;
    }

    .product-section-4 {
        grid-column: auto;
        grid-row: auto;
    }

    .product-section-5 {
        grid-column: auto;
        grid-row: auto;
    } 

     .vybava-column {
        width: 100%;
    } 

     .product-images {
        margin-bottom: 10px;
    } 
}

/* End Single product */

@media (max-width: 992px){
    .ast-separate-container #primary{
        padding: 0;
    }
}

@media (max-width: 922px){
    .card{
        width: auto;
        flex-direction: column;
        margin: 0 auto;
    }

    .woocommerce-js ul.products li.product a img {
    margin-bottom: 0;
    border-radius: 8px;
    width: 335px !important;
    height: 250px !important;
    }

    .ast-separate-container .ast-article-post, .ast-separate-container .ast-article-single:not(.ast-related-post){
        background-color: #f5f5f4;
    }

    .sidebar-main{
        order: 1;
    }
} 

.wpb-pcf-form-fire, .wpb-pcf-btn-small, .wpb-pcf-btn, .wpb-pcf-btn-default{
    font-family: 'Kanit';
    font-size: 1rem !important;
    font-weight: 500;
    margin-top: 20px;
    width: 180px; 
    border-radius: 8px;
    text-decoration: none;
    margin-bottom: 10px;
    justify-content: center;
}

