/*
Theme Name: Bazar CHILD
Theme URI: https://webid.ba
Version: 0.4.1
Author: WebID
Author URI: https:///webid.ba
Description: Bazar Custome Theme (2022)
Text Domain: hdd_lang
Template: wp_template_2020
*/

:root {
    --color-a: #ED1C24;
    --color-b: #2C2C2C;
    --price-color: #ED1C24;
    --button-bg: #ED1C24;
    --button-bg-hover: #ED1C24;
    --primary-bg:  #ED1C24;
    //--primary-rgba-a: rgba(237, 28, 36, 1);
    --primary-rgba-a: rgba(140, 19, 23, 1);
    --primary-rgba-b: rgba(184, 22, 28, 1);
    --secondary-bg: #262626;
    --third-bg: #D9000D;
    --footer-bg: #ED1C24;
    --footer-rgba-a: rgba(44, 44, 44, 1);
    --footer-rgba-b: rgba(38, 38, 38, 1);
    --copyright-bg: #262626;
}

html, body {
    font-family: 'Source Sans Pro', sans-serif;
    background: #FCFCFC;
}

p {
    font-family: 'Source Sans Pro', sans-serif;
}

.uk-logo {
    padding: 5px 1%;
    max-height: 70px;
    background-color: var(--third-bg);
}

.uk-navbar-center .uk-logo {
    margin-top: 55px;
}

.uk-navbar {
    min-height: 60px;
}

.uk-navbar-nav {
    gap: 15px;
}

.uk-navbar-item, .uk-navbar-nav>li>a, .uk-navbar-toggle {
    font-family: 'Source Sans Pro', sans-serif;
	font-size: 0.83rem;
	letter-spacing: 1px;
	padding-left: 10px;
    padding-right: 10px;
    text-transform: none;
    font-weight: 600;
}

.uk-navbar-dropdown-nav>li>a {
    font-family: 'Source Sans Pro', sans-serif;
	letter-spacing: 1px;
	font-size: 0.83rem;
}

.uk-nav-primary>li>a {
    font-size: 1.1rem;
}

.uk-footer-logo {
    max-height: 60px;
}

.uk-light {
    color: rgba(255,255,255,1) !important;
}

.uk-slider >*:focus {
    outline: transparent;
}

.uk-card-primary.uk-card-body, .uk-card-primary>:not([class*=uk-card-media]), .uk-card-secondary.uk-card-body, .uk-card-secondary>:not([class*=uk-card-media]), .uk-light, .uk-offcanvas-bar, .uk-overlay-primary, .uk-section-primary:not(.uk-preserve-color), .uk-section-secondary:not(.uk-preserve-color), .uk-tile-primary:not(.uk-preserve-color), .uk-tile-secondary:not(.uk-preserve-color),
.uk-card-primary.uk-card-body .uk-nav-default>li>a, .uk-card-primary>:not([class*=uk-card-media]) .uk-nav-default>li>a, .uk-card-secondary.uk-card-body .uk-nav-default>li>a, .uk-card-secondary>:not([class*=uk-card-media]) .uk-nav-default>li>a, .uk-light .uk-nav-default>li>a, .uk-offcanvas-bar .uk-nav-default>li>a, .uk-overlay-primary .uk-nav-default>li>a, .uk-section-primary:not(.uk-preserve-color) .uk-nav-default>li>a, .uk-section-secondary:not(.uk-preserve-color) .uk-nav-default>li>a, .uk-tile-primary:not(.uk-preserve-color) .uk-nav-default>li>a, .uk-tile-secondary:not(.uk-preserve-color) .uk-nav-default>li>a {
    color: rgba(255,255,255,0.8);
}

h1, h2, h3, h4, h5, h6, .uk-h3, .uk-button {
    font-family: 'Roboto Slab', serif;
    font-weight: 600;
}

.uk-slider-text {
    color: var(--color-a);
    font-family: 'Roboto Slab', serif;
}

.uk-button {
    border-radius: 10px;
    text-transform: none;
}

.wpcf7-submit {
    width: 100%;
    border-radius: 10px;
    text-transform: none;
    background: var(--button-bg);
    color: #fff;
    border: none;
    padding: 15px;
    font-size: 1rem;
}

.uk-card-title {
    font-size: 2rem;
    line-height: 1.4;
    position: relative;
    margin-bottom: 30px;
    font-weight: 600;
    text-transform: uppercase;
}


.uk-post-title {
    font-size: 1.2rem;
    line-height: 1.2;
    position: relative;
    font-weight: 600;
    margin-top: 10px;
}

.uk-post-card p {
    font-size: 14px;
}

.uk-social-icon {
    color: var(--color-a);
    background-color: #fff;
    box-shadow: 1px 1px 5px rgb(0 0 0 / 20%);
    margin-right: 10px;
    margin-top: -10px;
    border: none;
}

.uk-social-icon:hover {
    color: #fff;
    background-color: var(--primary-bg);
    box-shadow: 1px 1px 5px rgb(0 0 0 / 20%);
    margin-right: 10px;
    margin-top: -10px;
    border: none;
}

.uk-card-title1::after {
    content: " ";
    position: absolute;
    border-bottom: 1px solid var(--color-a);
    width: 50px;
    bottom: -10px;
    left: 0;
}

.uk-text-center.uk-card-title1::after {
    left: 50%;
    margin-left: -25px;
}


.uk-background-bazar {
    background-image: url('assets/bazar-bg.png');
    background-repeat: repeat-x;
    background-size: contain;
    min-height: 30px;
    background-color: var(--primary-bg)
}

.uk-background-yellow {
    background-color: #ffcb08;
}

.uk-background-bazar-yellow {
    background-image: url('assets/bazar-bg.png');
    background-repeat: repeat-x;
    background-size: contain;
    min-height: 30px;
    background-color: #ffcb08;
}

.uk-link, a {
    color: var(--color-b);
}

.button-wrapper #chart-button {
    color: var(--color-a);
    font-weight: bold;
}

.uk-link-toggle:focus .uk-link, .uk-link-toggle:hover .uk-link, .uk-link:hover, a:hover {
    color: var(--color-a);
}

.uk-input:focus, .uk-select:focus, .uk-textarea:focus {
    color: #666;
    border-color: var(--color-a);
}


.uk-button-text {
    color: var(--button-bg);

}

.uk-button-primary {
    background-color: var(--button-bg) !important;
}

.uk-button-primary:hover {
    background-color: var(--button-bg-hover) !important;
}

.uk-button-primary.disabled {
    color: #000;
}

.uk-checkbox:checked, .uk-checkbox:indeterminate, .uk-radio:checked {
    background-color: var(--color-a);
}

.uk-checkbox:checked:focus, .uk-checkbox:indeterminate:focus, .uk-radio:checked:focus {
    background-color: var(--color-a);
}

.uk-tab>.uk-active>a, .uk-tab>.active>a, .uk-tab>.is-active>a {
    color:  var(--color-a);
    border-color: var(--color-a);
}

.uk-dotnav>.uk-active>* {
    background-color: var(--color-a);
}

.uk-button-text:focus, .uk-button-text:hover {
    color: var(--color-a);
}

.uk-button-text::before {
    border-bottom: 1px solid var(--color-a);
}

.uk-background-primary {
    background: var(--third-bg);
    /*background: linear-gradient(100deg, var(--primary-rgba-a) 0%, var(--primary-rgba-b) 100%);*/
}

.uk-section-footer {
    background: var(--third-bg);

    font-size: .875rem;
    color: rgba(255,255,255,0.6);
}

.uk-footer-bg-image {
    background-image: url('assets/footer-image.jpg');
    background-repeat: repeat-x;
    background-size: contain;
    background-position: bottom center;

}

.uk-section-copy {
    background-color: var(--copyright-bg);
}

.uk-section-shop-sale .uk-card-body {
    background: rgb(242,242,242);
    background: linear-gradient(270deg, rgba(242,242,242,1) 0%, rgba(255,255,255,1) 100%);
}

.uk-tile-primary {
    background: var(--primary-bg) !important;
}

.uk-label {
    background-color: var(--color-a);
}

.uk-label-danger {
    background-color: var(--color-a);
}

.uk-badge {
    background-color: var(--primary-bg);
}

mark {
    color: var(--color-a);
}

.page-title {
}

.uk-heading-bullet::before {
    border-color: var(--color-a);
}

.uk-footer-logo {
    filter: none;
}

.product-image-loop {
    background: #fff;
    border: 1px solid #F3F3F3;
    border-radius: 8px;
    overflow: hidden;
}

.uk-section-third {
    background-color: var(--third-bg);
}

.woocommerce .widget_price_filter .ui-slider .ui-slider-range {
    background-color: var(--secondary-bg);
}

.woocommerce .widget_price_filter .ui-slider .ui-slider-handle {
    background-color: var(--secondary-bg);
}

.widget_layered_nav_filters li a:hover {
   
    border-color: var(--color-a);
    background: #bdbdbd;
}

.flex-viewport {
    border-radius: 0;
}

.woocommerce div.product div.images .flex-control-thumbs li img {
    border-radius: 0;
}

.woocommerce-message {
    border-top-color: var(--color-a);
}

.woocommerce-message::before {
    color: var(--color-a);
}

.woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button {
    background-color: var(--button-bg);
    border-radius:10px;
}


.woocommerce #respond input#submit:hover, .woocommerce a.button:hover, .woocommerce button.button:hover, .woocommerce input.button:hover {
    color: #fff;
    background-color: var(--button-bg-hover);
}

.woocommerce a.added_to_cart {
    background-color: #F7F7F7;
    color: #58473B;
}

.woocommerce div.product p.price del, .woocommerce div.product span.price del, .woocommerce-grouped-product-list-item__price del, .woocommerce-grouped-product-list-item__price span.price del {
    color: var(--price-color);
    font-family: 'Source Sans Pro', sans-serif;
}


.woocommerce div.product p.price, .woocommerce div.product span.price {
    color: #555;
}

.woocommerce div.product p.price ins, .woocommerce div.product span.price ins, .woocommerce-grouped-product-list-item__price ins span.amount   {
    color: #555;
    
}

.woocommerce div.product div.images .woocommerce-product-gallery__trigger {
    right: auto;
}

.woocommerce span.onsale {
    background-color: var(--color-a);
    right: 5px;
    top: 5px;
    left: auto;
    line-height: inherit;
    border-radius: 10%;
    padding: 2px 5px;
    font-weight: 500;
    text-transform: uppercase;
    min-height: auto;
    min-width: auto;
}

.woocommerce-loop-product__title {
    font-weight: 500;
	font-size: 1.1rem;
	margin-bottom: 10px;
    font-family: 'Roboto Slab', serif;
}



.woocommerce div.product p.price, .woocommerce div.product span.price {
	color: var(--price-color);
    font-family: 'Roboto Slab', serif;
	font-size: 1.3rem;
}

.product-item span.price, .product-item p.price {
    font-size: 0.87rem !important;
}

.product-item:hover img {
    filter: brightness(120%);
}

.woocommerce-store-notice, p.demo_store {
    background-color: var(--primary-bg);
}

.uk-more-button > .uk-button {
    font-size: 0.68em;
	margin-top: 25px !important;
}



.uk-card-default {
    box-shadow: 0 0px 2px rgba(0,0,0,.1);

    border-radius: 0;
}

.widget_block .wc-block-product-categories-list {
    list-style: none;
    padding: 0;
}

@media only screen and (max-width: 640px) {
    
    .woocommerce-page .woocommerce-message .button {
        margin-bottom: 10px;
        float: unset;
        text-align: center;
        display: block;
    }

    .woocommerce-message::before {
        top: 20px;
    }
  }

