/*
Theme Name: Føroya Bilasøla
Description: This is a child theme for Flatsome Theme
Author: UX Themes
Template: flatsome
Version: 3.0
*/

/*************** ADD CUSTOM CSS HERE.   ***************/

/* PRODUKT SÍÐAN */
/* PRODUKT SÍÐAN */
/* PRODUKT SÍÐAN */
/* PRODUKT SÍÐAN */
.fyrrprisur {
    font-size: 0.8em;
}

.prisur {
    font-weight: bolder;
    font-size: 1.1em;
}
table.tableizer-table tr {
    font-weight: bold;
} 



/* TEST */
div.product-small.col.has-hover.product {
    min-height: 460px;
}



/* FLIP BOOK */
/* FLIP BOOK */
/* FLIP BOOK */
/* FLIP BOOK */
/* FLIP BOOK */
/* FLIP BOOK */
/* FLIP BOOK */
.fyrrprisur {
    text-decoration: line-through 2px;
    text-decoration-color: red;
}
.nav-box>li.active>a, .nav-pills>li.active>a {
    background-color: #D32F2F;
}

div.col.stuttumbilin {
    border: 1px solid #444;
    border-radius: 8px;
    overflow: hidden;
    background-color: #2b2b2b;
    transition: transform 0.3s ease-in-out, box-shadow 0.3s ease-in-out;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.15);
}
.dark .col-divided {
    border-right: 2px solid hsla(0, 0%, 100%, .3);
}


div.flickity-viewport div.slide div.product-info.col-inner.inner-padding div.product-short-description {
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 7;
    -webkit-box-orient: vertical;
}
div.slider.flipContainer.slider-nav-circle.slide.box-shadow-2.is-draggable.flickity-enabled {
    background-color: unset !important;
    box-shadow: none;
}
div.slider.flipContainer.slider-nav-circle.slide.box-shadow-2.is-draggable.flickity-enabled div.flickity-viewport div.flickity-slider div.slide {
    border: 1px solid #444;
    border-radius: 8px;
    overflow: hidden;
    background-color: unset !important;
    transition: transform 0.3s ease-in-out, box-shadow 0.3s ease-in-out;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.15);
}

div.flickity-viewport a.button {
    background-color: #D32F2F;
}
.flickity-page-dots .dot.is-selected {
    background-color: white;
}
.flickity-page-dots .dot.is-selected, .flickity-page-dots li.dot {
    border: solid 3px white;
}
.flickity-prev-next-button {
    color: white;
}


/* TABS INNI I PRODUKTUM */
/* TABS INNI I PRODUKTUM */
/* TABS INNI I PRODUKTUM */
/* TABS INNI I PRODUKTUM */
/* TABS INNI I PRODUKTUM */
/* TABS INNI I PRODUKTUM */
/* TABS INNI I PRODUKTUM */

/* Tab list items */
ul.nav.nav-pills.nav-uppercase.nav-size-normal.nav-left li.tab {
    width: auto;
    display: inline-block;
    margin-right: 10px;
    font-size: 1em;
}

/* Tab content wrapper */
ul.nav.nav-pills.nav-uppercase.nav-size-normal.nav-left li.tab a {
    display: inline-block;
    padding: 3px 5px;
    cursor: pointer;
    border-radius: 5px;
    font-weight: 400;
    text-align: center;
    line-height: 1.6;
    position: relative; /* Necessary for pseudo-element positioning */
    margin-bottom: 10px;
    color: #9E9E9E; /* Gray color for links */
    text-decoration: none;
}

/* Bottom border only visible on hover or when active */
ul.nav.nav-pills.nav-uppercase.nav-size-normal.nav-left li.tab a::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: -2px; /* Adjusted space between label and border */
    height: 2px; /* Thickness of the bottom border */
    background-color: #D32F2F; /* Color of the bottom border */
    transform: scaleX(0); /* Initially scale the border down to zero */
    transform-origin: center; /* Start scaling from the center */
    transition: transform 0.2s ease-in-out; /* Smooth transition for hover effect */
}

/* Show and animate the bottom border on hover */
ul.nav.nav-pills.nav-uppercase.nav-size-normal.nav-left li.tab a:hover::after {
    transform: scaleX(1); /* Scale the border to full width on hover */
}

/* Show and animate the bottom border for the active tab */
ul.nav.nav-pills.nav-uppercase.nav-size-normal.nav-left li.tab.active a::after {
    transform: scaleX(1); /* Scale the border to full width for the active tab */
}

/* Active tab link color */
ul.nav.nav-pills.nav-uppercase.nav-size-normal.nav-left li.tab.active a {
    color: #fff;
    background-color: unset;
    font-weight: bold;
}




/* OUTLINE TABS */



/* ACCORDION */
/* ACCORDION */
/* ACCORDION */
/* ACCORDION */
/* ACCORDION */
div.accordion-item.knapfixcenter a.accordion-title.plain {
    background-color: #D32F2F;
    text-align: center;
    font-weight: 600;
    border: 1px solid transparent;
    border-radius: 0;
    color: currentColor;
    cursor: pointer;
    font-size: .97em;
    font-weight: bolder;
    letter-spacing: .03em;
    line-height: 2.4em;
    min-height: 2.5em;
    padding: 0 1.2em;
    text-decoration: none;
    text-rendering: optimizeLegibility;
    text-shadow: none;
    text-transform: uppercase;
    transition: transform .3s, border .3s, background .3s, box-shadow .3s, opacity .3s, color .3s;
    vertical-align: middle;
}






/* FILTER */
/* FILTER */
/* FILTER */
/* FILTER */
/* FILTER */
/* FILTER */
/* FILTER */
/* FILTER */
/* FILTER */
input[type="radio"] {
    display: none;
}

li.wpc-radio-item {
    width: auto;
    display: inline-block;
    margin-right: 10px;
    font-size: 1em;
}

.wpc-term-item-content-wrapper {
    padding-top: 3px;
    padding-bottom: 3px;
    padding-left: 5px;
    padding-right: 5px;
}

div.wpc-term-item-content-wrapper label {
    display: inline-block;
    padding: 3px 5px;
    cursor: pointer;
    border-radius: 5px;
    font-weight: 400;
    text-align: center;
    line-height: 1.6;
    position: relative; /* Necessary for pseudo-element positioning */
    margin-bottom: 10px;
}

/* Bottom border only visible on hover or when selected */
div.wpc-term-item-content-wrapper label::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: -2px; /* Adjusted space between label and border */
    height: 2px; /* Thickness of the bottom border */
    background-color: #D32F2F; /* Color of the bottom border */
    transform: scaleX(0); /* Initially scale the border down to zero */
    transform-origin: center; /* Start scaling from the center */
    transition: transform 0.2s ease-in-out; /* Smooth transition for hover effect */
}

/* Show and animate the bottom border on hover */
div.wpc-term-item-content-wrapper label:hover::after {
    transform: scaleX(1); /* Scale the border to full width on hover */
}

/* Show and animate the bottom border for the selected item */
li.wpc-radio-item.wpc-term-item.wpc-term-selected div.wpc-term-item-content-wrapper label::after {
    transform: scaleX(1); /* Scale the border to full width for the selected item */
}







/* Contact Form 7 Custom Styles */
/* Contact Form 7 Custom Styles */
/* Contact Form 7 Custom Styles */
/* Contact Form 7 Custom Styles */
/* Contact Form 7 Custom Styles */
/* Contact Form 7 Custom Styles */
/* Contact Form 7 Custom Styles */
/* Contact Form 7 Custom Styles */
/* Contact Form 7 Custom Styles */
/* Contact Form 7 Custom Styles */
.contact-form {
    max-width: 600px;
    margin: 0 auto;
    background-color: #2C2C2C;
    padding: 20px;
    border-radius: 8px;
    color: #FFFFFF;
    font-family: Arial, sans-serif;
}

.contact-form label {
    display: block;
    margin-bottom: 10px;
}

.contact-form input[type="text"],
.contact-form input[type="email"],
.contact-form input[type="tel"],
.contact-form select,
.contact-form textarea {
    width: 100%;
    padding: 10px;
    margin-bottom: 20px;
    background-color: #3B3B3B;
    border: 1px solid #4A4A4A;
    border-radius: 4px;
    color: #FFFFFF;
}

.contact-form input[type="text"]::placeholder,
.contact-form input[type="email"]::placeholder,
.contact-form input[type="tel"]::placeholder,
.contact-form textarea::placeholder {
    color: #CCCCCC;
}

.contact-form input[type="text"]:focus,
.contact-form input[type="email"]:focus,
.contact-form input[type="tel"]:focus,
.contact-form select:focus,
.contact-form textarea:focus {
    border-color: #5B5B5B;
    outline: none;
}

.contact-form .button.primary {
    background-color: #1A1A1A;
    color: #FFFFFF;
    border: none;
    padding: 10px 20px;
    border-radius: 5px;
    cursor: pointer;
    transition: background-color 0.3s ease;
}

.contact-form .button.primary:hover {
    background-color: #333333;
}
input.wpcf7-form-control.wpcf7-text.wpcf7-validates-as-required.form-control, textarea.wpcf7-form-control.wpcf7-textarea.wpcf7-validates-as-required.form-control {
    border-radius: 15px;
}
span.wpcf7-form-control-wrap {
    margin-left: 10px;
    margin-right: 10px;
}



/* BLANDA */
/* BLANDA */
/* BLANDA */
/* BLANDA */
/* BLANDA */
/* BLANDA */
/* BLANDA */
/* BLANDA */
/* BLANDA */
/* BLANDA */
.out-of-stock-label {
    display: none;
}

.box-text.box-text-products {
    text-align: left;
}

div.related.related-products-wrapper.product-section p.category.uppercase.is-smaller.no-text-overflow.product-cat.op-7 {
    display: none;
}
.autocomplete-suggestion img {
    width: 76px;
    height: 53px;
    border-radius: 2px;
}


/* TIKIÐ VIÐ */
.product-small .price-wrapper {
    font-size: 0.9em;
    font-weight: bold;
    color: #D32F2F;
    line-height: 1.2;
}




div.product-small.col.has-hover .col-inner {
    padding-top: 2px;
    padding-left: 10px;
    padding-right: 10px;
    border: 1px solid #444;
    border-radius: 8px;
    overflow: hidden;
    background-color: #2b2b2b;
    transition: transform 0.3s ease-in-out, box-shadow 0.3s ease-in-out;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.15);
}

/* BADGE */
/* BADGE */
/* BADGE */
/* BADGE */
/* BADGE */
.badge {
        position: absolute;
        top: 139px; 
        left: -33px;
        background: #D32F2F;
        color: white;
        width: 250px;
        height: 35px;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 14px;
        font-weight: bold;
        z-index: 10;
        text-align: center;
        transform: rotate(-45deg);
        transform-origin: 0 0;
    }
.badge {



}
.woocommerce ul.products li.product .badge {
    top: 10px;
    left: -25px;
}
.woocommerce div.product .badge {
    top: 20px;
    left: -25px;
}
.woocommerce ul.products li.product .product-inner,
.woocommerce div.product .images,
.box-image,
.slide .product-image {
    position: relative;
}
.sold-message-wrapper {
    margin-top: 20px;
    text-align: center;
}
.sold-message {
    font-size: 18px;
    color: white;
}


/* Hover effect for the product box */
/* Hover effect for the product box */
/* Hover effect for the product box */
/* Hover effect for the product box */
/* Hover effect for the product box */
div.product-small.col.has-hover .col-inner:hover {
    transform: translateY(-5px); /* Slight lift on hover */
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.25); /* Deeper shadow on hover */
    transition: transform 0.3s ease-in-out, box-shadow 0.3s ease-in-out;

}
.product-small .product-category-list .category {
    font-size: 0.9em;
    font-weight: bold;
    color: #D32F2F; /* Lighter red color for the category */
    text-transform: uppercase;
}
div.related.related-products-wrapper.product-section .badge {
    top: 109px;
    left: -25px;
}


.woocommerce-product-gallery__wrapper.product-gallery-slider.slider .badge {
    top: 210px;
    left: -39px !important;
    width: 370px !important;
    height: 50px;
    font-size: 18px;
}

div.slider.flipContainer.slider-nav-circle div.flip-slide div.badge {
    display: none;
}



@media only screen and (min-width: 1280px) {
  div.related.related-products-wrapper.product-section .badge {
      top: 109px;
      font-size: 13px;
      height: 33px;
      left: -32px;
      width: 200px;
  }
}

@media only screen and (min-width: 1100px) and (max-width: 1279px) {
  div.related.related-products-wrapper.product-section .badge {
      top: 106px;
      font-size: 12px;
      height: 27px;
      left: -35px;
      width: 200px;
      
  }
    .badge {
    position: absolute;
    top: 139px;
    left: -33px;
    height: 35px;
    width: 250px;
    }
}


@media only screen and (min-width: 600px) and (max-width: 1099px) {
  div.related.related-products-wrapper.product-section .badge {
      top: 79px;
      font-size: 10px;
      height: 27px;
      left: -26px;
      width: 150px;
  }
    .badge {
    position: absolute;
    top: 110px;
    left: -31px;
    background: #D32F2F;
    color: white;
    width: 200px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    font-weight: bold;
    z-index: 10;
    text-align: center;
    transform: rotate(-45deg);
    transform-origin: 0 0;
}
        div.product-small.col.has-hover.product {
    min-height: 395px;
}
}

@media only screen and (min-width: 10px) and (max-width: 599px) {
  div.related.related-products-wrapper.product-section .badge {
      top: 79px;
      font-size: 8px;
      height: 18px;
      left: -26px;
      width: 150px;
  }
    .badge {
    position: absolute;
    top: 98px;
    left: -42px;
    width: 200px;
    height: 25px;
    font-size: 10px;
}
    
    div.product-small.col.has-hover.product {
    min-height: 395px;
}

    
}


@media only screen and (max-width: 48em) {
/*************** ADD MOBILE ONLY CSS HERE  ***************/
.dark .col-divided {
    border-right:none;
}