
:root {
	--bs-dark-rgb: 0,0,0;
	
	--brand-color: #f4478c;
	--brand-color-rgb: 244, 71, 140;
	--brand-color-hsl: 336, 89%; /* hsl(336, 89%, 62%) */
	
	--brand-color-2: #49256d;
	--brand-color-rgb-2: 73, 37, 109;
	--brand-color-hsl-2: 270, 49%; /* hsl(270, 49%, 29%) */
	
	--brand-color-3: #7bf6d7;
	
	--brand-color-4: #3e55bf;
	
	--color-white-rgb: 255, 255, 255;
	
	--bs-warning: #ffd141;
	--bs-warning-rgb: 255, 209, 65;
	
	--bs-success: #55a93d;
	--bs-success-rgb: 85, 169, 61;
	
}

/* :: Backgrounds :: */ 

html, body, .nav-tab-content-wrapper,
.forms-wrapper {
	background-color: white;
}

.inside .hero-section, .accordion-button:not(.collapsed) {
	background-color: rgba(var(--brand-color-rgb),.1);
}

.qty-wrapper i, .qty-wrapper input {
	background-color: rgba(var(--brand-color-rgb),.2);
}

#header .meta a:before, .hero-section .btn-more:before,
.site-nav .main-nav .nav > li > a span:before,
#footer .list-styled li:before, 
.info-display.light-blue-bgr:before,
.forms-wrapper .h3:first-child span {
	background-color: var(--brand-color);
}

.tags .btn-info {
	background-color: hsl(var(--brand-color-hsl),80%);
}
.tags .btn-info:hover {
	background-color: hsl(var(--brand-color-hsl),90%);
}

#header, .hero-section .nav-tabs .nav-link:not(.active),
.section-how,
.btn-more:before, .btn-back:before,
#footer {
	background-color: var(--brand-color-2);
}

.index .hero-section {
	background: fixed linear-gradient(to bottom, var(--brand-color-2) 7em,rgba(var(--brand-color-rgb-2),.5) 25em);
}

/* .index .hero-section .container-fluid > .inner {
	background: linear-gradient(to bottom, transparent 0%,hsl(var(--brand-color-hsl-2),32%) 80%);
}*/

.site-nav .sub-menu-wrapper,
.btn-more, .btn-back {
	background-color: var(--brand-color-3);
}

.btn-primary {
	--bs-btn-bg: var(--brand-color); 
	--bs-btn-border-color: hsl(var(--brand-color-hsl),40%);
	--bs-btn-hover-bg: var(--brand-color-2);
  	--bs-btn-hover-border-color: var(--brand-color-2);
}

.btn-outline-primary {
	--bs-btn-color: var(--brand-color-2);
	--bs-btn-border-color: var(--brand-color);
	--bs-btn-hover-bg: var(--brand-color-2);
	--bs-btn-hover-border-color: var(--brand-color-2);
}

.section-why,
.main-items .img .btn-wrapper a, button.del-item,
.cart-content .total, .item-overview .ava-bar, .item-header .btn-wrapper a:hover, .btn-light,
.info-display , .item-list .img,
.forms-wrapper {
	background-color: #f7f7f7;
}

:root .btn-dark:hover {
	background-color: #444;
}

.item-description .btn-wrapper a:before, 
.btn-dark {
	background-color: black;
}

.item-list .meta .item-tag.bg-warning {
	background-color: #f3dc59 !important;
}

.item-list .meta .item-tag.bg-danger {
	background-color: #ff6a6a;
}

.list-styled li:before {
	background-color: rgba(0,0,0,.3);
}

/*.index .hero-section .col-info .lead-heading:before {
	background-color: var(--brand-color-4);	
}*/

.info-display.success-bgr {
	background-color: rgba(var(--bs-success-rgb),.1);
}

.info-display.success-bgr:before {
	background-color: var(--bs-success);
}

.nav-tab-content-wrapper .col-calc {
	background: linear-gradient(to right, white 40%, transparent 80%);
}

.item-link .info {
	background: linear-gradient(to right, white 60%, hsla(0,0%,100%,.7) 100%);
}

#footer .level-2 {
	background: linear-gradient(to right, black 0%, #222 50%);
}

/* :: Borders :: */

.nav-x .sub-menu li a {
	border-color: #eee;
}

.btn-dark {
	border-color: #555;
}

.calc-values .row:not(:first-child),  
:root .btn-info, .forms-wrapper, .accordion-body > section:not(:first-child),
.index .calc-values .row, .dropdown-toggle {
	border-color: rgba(0,0,0,.1);
}

.my-profile .col-01 .nav-item > .active {
	border-color: black;
}

.qty-wrapper i, .qty-wrapper i:hover:before,
.item-list .item-link:before, .item-list .item-link:after,
.calc-values > section {
	border-color: var(--brand-color);
}

:root .btn-more, :root .btn-back, .dropdown-toggle:hover {
	border-color: var(--brand-color-2);
}

/*.index .calc-values .row {
	border-color: hsl(var(--brand-color-hsl),40%);
}*/

#footer .social {
	border-color: rgba(var(--brand-color-rgb), .2);
}

/* :: Colors :: */

body, a {
	color: var(--bs-body-color);
}

.text-brand-color, .section-how .steps ol > li:before,
.index .hero-section .nav-link strong {
	color: var(--brand-color);
}

:where(.inside .hero-section, main) :is(h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6),
.index .hero-section .nav-link.active span {
	color: var(--brand-color-2);
}

#header .meta a, .section-how a, #footer .footer-contact a {
	color: var(--brand-color-3);
}

#header .meta a:hover,
.site-nav .nav > li > a,  
/*.index .hero-section .col-info, .index .hero-section .lead-heading, .index .hero-section .col-info a, .index .hero-section .col-calc,*/
.index .hero-section .nav-link span,
.section-how .h1, .section-how .h2,
.btn-more:hover, .btn-more:active:hover, .btn-back:hover, #footer a:hover {
	color: white;
}

#header .meta a:hover path, #header .meta a:hover circle[fill=none] {
	stroke: white;
}

#header .phone a:hover circle {
	fill: white;
}

.section-how, #footer, #footer a {
	color: hsla(0,0%,100%,.6);
}

/* :: Other :: */

.form-range::-webkit-slider-thumb {background-color: var(--brand-color);}
.form-range::-webkit-slider-runnable-track {background-color: rgba(0,0,0,.1);}

.form-range::-moz-range-thumb {background-color: var(--brand-color);}
.form-range::-moz-range-track {background-color: rgba(0,0,0,.1);}