/**********/
/* Farben */
/**********/

:root {
    /* Colors */
    --main: #AC1842;
    --main-rgb: 172, 24, 66;
    --main-lighten: #B71441;

    --light: #efefef;
    --dark: #242422;

    --alert-danger: #E8CCD2;
    --alert-danger-font: #b90000;
    --alert-success: #cee8d1;
    --alert-success-font: #1C871E;

    --badge-primary: var(--main);
    --badge-primary-font: #ffffff;
    --badge-seconday: #525252;
    --badge-secondary-font: #ffffff;

    --button-font: #ffffff;
    --button-lighten-font: #525252;

    --footer-font: #ffffff;
}

a:hover {
    color: var(--main);
}

/**********/
/* Alerts */
/**********/

.alert-danger {
    color: var(--alert-danger-font);
    background-color: var(--alert-danger);
    border-color: var(--alert-danger);
}

.alert-success {
    color: var(--alert-success-font);
    background-color: var(--alert-success);
    border-color: var(--alert-success);
}

/**********/
/* Badges */
/**********/

.badge-primary {
    background-color: var(--badge-primary);
    color: var(--badge-primary-font);
}

.badge-secondary {
    background-color: var(--badge-seconday);
    color: var(--badge-secondary-font);
}

.fa-sup {
    background-color: var(--badge-primary);
    color: var(--badge-primary-font);
}

/***********/
/* Buttons */
/***********/

.btn {
    transition: all 0.15s ease-in-out;
}

.btn-link:hover {
    color: var(--main);
}

.btn-primary {
    background-color: var(--main);
    border-color: var(--main);
    color: var(--button-font);
}

.btn-primary:not(:disabled):not(.disabled):active,
.btn-primary:not(:disabled):not(.disabled).active,
.show > .btn-primary.dropdown-toggle, .show > .btn-primary[data-toggle=collapse]:not(.navbar-toggler) {
    background-color: var(--main);
    border-color: var(--main);
}

.btn-primary:hover {
    background-color: var(--main);
    border-color: var(--main);
    filter: brightness(1.1);
    color: var(--button-font);
}

.btn-outline-primary {
    border-color: var(--main);
}

.btn-outline-primary:not(:disabled):not(.disabled):active,
.btn-outline-primary:not(:disabled):not(.disabled).active,
.show > .btn-outline-primary.dropdown-toggle,
.show > .btn-outline-primary[data-toggle=collapse]:not(.navbar-toggler) {
    border-color: var(--main);
    background-color: var(--main);
}

.btn-outline-primary:hover {
    background-color: var(--main-lighten);
    border-color: var(--main);
}

.btn-primary:focus, .btn-primary.focus {
    color: #fff;
    background-color: var(--main);
    border-color: var(--main);    
}

/****************************/
/* Checkbox / Form / Select */
/****************************/

.form-control:focus {
    border-color: var(--main);
}

.custom-control-input:checked ~ .custom-control-label::before {
    border-color: var(--main);
    background-color: var(--main);
}

.custom-select:focus {
    border-color: var(--main);
    box-shadow: 0 0 0 0.2rem rgba(var(--main-rgb), 0.25);
}

/*********/
/* Modal */
/*********/

.modal-header .close:hover {
    background-color: var(--main);
}

/**********/
/* Header */
/**********/

#header-top-bar a:hover:not(.dropdown-item):not(.btn),
header a:hover:not(.dropdown-item):not(.btn) {
    color: var(--main);
}

@media (min-width: 992px) {
    header .navbar-nav > .nav-item > .nav-link::before {
        border-color: var(--main);
    }
}

/******************/
/* Article-slider */
/******************/

.slick-arrow:hover {
    background-color: var(--main);
}

/***************/
/* Productlist */
/***************/

aside .nav-panel > .nav > .active > .nav-link {
    border-color: var(--main);
}

.noUi-horizontal .noUi-connect {
    background: var(--main);
}

.noUi-horizontal .noUi-handle {
    background-color: var(--main);
    box-shadow: 0px 0px 0px 5px rgba(var(--main-rgb), 0.5);
}

.page-item.active .page-link:after, .page-item.active .page-text:after {    
    border-bottom: 4px solid var(--main);
}

.page-link:hover, .page-text:hover {    
    color: var(--main);
}

/******************/
/* Productdetails */
/******************/

.estimated-delivery:hover .estimated-delivery-info {
    color: var(--main);
}

.nav-tabs .nav-link.active,
.nav-tabs .nav-item.show .nav-link {
    border-color: var(--main);
}

.tab-navigation .nav-link::after {
    border-color: var(--main);
}

/************/
/* Checkout */
/************/

.stepper .step-active .step-content::after {
    background: var(--main);
}

.checkout-steps .step-check {
    color: var(--main);
}

/***********/
/* Account */
/***********/

.account-head-data .account-head-data-credit {
    border-color: var(--main);
}

/* Farben Ende */


/******************/
/* Header Top Bar */
/******************/

#header-top-bar {
	background-color: #333333;
	color: #fff;
}

#header-top-bar a {
	color: #fff;
}

#header-top-bar .dropdown-menu a {
	color: #525252;
}

#header-top-bar .nav-span {
    display: block;
    padding: .5rem 1rem;
}

@media (max-width: 991px) {
	#header-top-bar .language-dropdown {
		display: none !important;
	}
}	

@media (max-width: 575px) {
	#header-top-bar .nav-link, #header-top-bar .nav-span {
		display: block;
		padding: .5rem .5rem;
	}
}

/*******************/
/* Header allgemein*/
/*******************/

@media (min-width: 992px) {
	header .top-wrapper {
		display: flex;
		justify-content: space-between;
		align-items: center;
	}

	.top-wrapper > nav {
		width: 300px;
	}
	
	.top-wrapper > nav #shop-nav-search {
		margin-left: auto;
	}
	
	.shop-nav-other-inner {		
		align-items: center;
	}
	
	.shop-nav-other-inner .left.usp-icon {
		padding-right: 10px;
		font-size: 28px;
	}
	
	.shop-nav-other-inner .right > span {
		display: block;
		font-size: 20px
	}
}

/************/
/* Shoplogo */
/************/

@media (min-width: 992px) {
	.toggler-logo-wrapper .logo-wrapper {
		padding-left: 0;
	}
	
	header .navbar-brand {
		margin-right: 0;
	}
	
	header .navbar-brand img {
		height: auto;
		max-height: 120px;
		width: auto;
	}
}

/************/
/* Shop-nav */
/************/

@media (min-width: 992px) {
	header #shop-nav.nav-right .nav-link {
		padding-top: .75rem;
		padding-bottom: .75rem;
	}
}

/*************/
/* Hauptmenu */
/*************/

@media (min-width: 992px) {
	header .menu-wrapper {
		background-color: #333;
	}
	
	header .navbar-collapse {
		height: auto;
	}
	
	header .navbar-nav > .nav-item > .nav-link {
		position: relative;
		padding: 1rem;
		color: #fff;
	}
	
	header .navbar-nav > .nav-item > .nav-link:hover, header .navbar-nav > .nav-item.active > .nav-link {
		color: #fff !important;
		background-color: #000;
	}	
	
	.nav-scrollbar-inner {    
		padding-bottom: 0;
		scrollbar-width: none;
	}
	
	.nav-scrollbar-inner::-webkit-scrollbar {
		display: none;
	}

	.is-checkout header, .is-checkout .navbar {
		height: auto;
	}	
}

/**********/
/* Slider */
/**********/

body[data-page="18"] .slider-wrapper {
	margin-bottom: 30px;
}

/*****************/
/* Artikelslider */
/*****************/

/*.hr-sect::before, .hr-sect::after {
    background: #333;
}

.hr-sect a {
	color: #333;
}*/

/**********************/
/* Artikeldetailseite */
/**********************/

.product-video iframe {
	width: 100%;	
	min-height: 300px;
}

.swatches-text.active {
    border-color: var(--main);
}

/**********/
/* Footer */
/**********/

#footer {
	padding: 2rem 0 0;
    background-color: #333;
    color: #fff;
}

#footer .h2, #footer .productlist-filter-headline {
	color: #fff;
}

#footer hr {
	border-color: #fff;
}

#footer.newsletter-active #footer-boxes {
    margin-top: 2rem;
}

#footer a {
	color: #fff;
}

#footer li {
    margin-bottom: 0;
}

#footer #copyright > div {
    padding-top: .5rem;
    padding-bottom: .5rem;
}

#footer .payment-con {
	margin-bottom: 10px;
}

#footer .payment-con img {
	max-height: 60px;
	padding: 0 5px 5px 0;
}

.smoothscroll-top.show {
    bottom: 100px;
}

/* Ausbesserungen Shop 5.5 */

#header-top-bar a:not(.dropdown-item):not(.btn) {
	color: #fff;
}

#header-top-bar .footer-social-media ul {
	display: flex;
	flex-wrap: wrap;
	padding-left: 0;
	margin-bottom: 0;
	list-style: none;
}

#header-top-bar .footer-social-media ul li {
	display: block;
	position: relative;
}

#header-top-bar .footer-social-media ul li .btn.btn-sm {
	padding: 0.5rem 1rem;
	border: none;
}

#header-top-bar .footer-social-media ul li .btn.btn-sm.btn-icon-secondary:hover {
	color: #AC1842;
    background-color: transparent;
}

#header-top-bar .footer-social-media ul li .btn.btn-sm.btn-icon-secondary:focus {
	box-shadow: none;
}

#header-top-bar .footer-social-media ul li:not(:last-child)::after {
	content: "";
	position: absolute;
	right: 0;
	top: 0.5rem;
	height: calc(100% - 1rem);
	border-right: 0.0625rem solid currentColor;
}

@media (min-width: 1300px) {
	.shop-nav-other-inner {	
		width: 513px;
	}
}
