/* Icons */
/* @import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.4/font/bootstrap-icons.css"); */

body{font-family: var(--font-primary), sans-serif; font-size: 14px; background-color: var(--background); color: var(--text);}

.transition{-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-ms-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all 0.5s ease;}

a{text-decoration: none; color: var(--text);}

h1{color: var(--primary); font-size: 30px; font-weight: bold;}
h2{margin-bottom: 20px; color: var(--primary);}

.submenu{position: absolute; min-width: 160px; top: 100%; margin-top: 2px; background: #fff;left: 0;z-index: 10000;max-height:0;overflow:hidden;-webkit-transform:perspective(400) rotate3d(1,0,0,-90deg);-webkit-transform-origin:50% 0;-webkit-transition:350ms;-moz-transition:350ms;-o-transition:350ms;transition:350ms;-webkit-box-shadow: 0px 10px 20px 0px rgba(0,0,0,0.05);-moz-box-shadow: 0px 10px 20px 0px rgba(0,0,0,0.05);box-shadow: 0px 10px 20px 0px rgba(0,0,0,0.05); border:solid 1px #ddd; opacity: 0;}
.submenu .dropdown-inner{display: flex;}
.submenu ul{min-width: 160px; margin-bottom: 0;}
.submenu ul > li{width: 100%;}
.submenu ul > li > a{width: 100%; float: left; padding:5px 15px;}
.submenu ul > li > a:hover{text-decoration: none; background-color: var(--primary); color: #fff;}
.submenu .grandchild{font-size: 12px; color: #777;}
.submenu .grandchild:hover{font-size: 12px; color: #fff;}

.submenu-mobile{display: none;}

.dropdown:hover .submenu{
	max-height:1000px; -webkit-transform:perspective(400) rotate3d(0,0,0,0); opacity: 1;
}

.form-group{margin-bottom: 10px;}

.breadcrumb{padding:15px 0}

.heading-title{font-size: 30px; font-weight: bold; color: var(--primary); margin:0}
.title-description{text-align: center; margin:30px 0}


/* ////////// BOX ///////////*/
.box{padding:20px; border:solid 1px #eee; margin-bottom: 30px; display: block; width: 100%; border-radius: 10px;}
.box h3{font-size: 16px; color: var(--primary); text-transform: uppercase; margin-top: 0; padding-bottom: 10px; border-bottom: solid 1px #eee; margin-bottom: 10px;}
.box-menu{list-style: none; padding: 0; margin:0}
.box-menu > li > a{font-size: 14px; color:var(--text); padding: 5px 0; display: table; }
.box-menu > ul > li > a{ color:var(--text); padding: 3px 0; display: table; opacity: 0.8;}
.box-menu > ul > ul{background: #f3f3f3; padding: 10px; margin:5px 0; border-radius: 10px;}
.box-menu > ul > ul > li > a{ color:var(--text); padding: 3px 0; display: table;}
.box-menu ul{list-style: none; margin-left: 0;}
.box-menu a:hover{text-decoration: none; color: var(--primary)}

.box-tabs{display: table; margin-bottom: 0; margin-left: 10px;}
.box-tabs a{font-size: 14px; font-weight: bold; color: var(--tertiary) !important; padding: 20px; display: table;}
.box-tabs .active a{color: var(--primary) !important; border-bottom:solid 4px var(--primary); }

@media(max-width:767px){
    .show-next + div{display: none}
    .box{padding:15px;}
}

#content{padding-bottom: 40px;}

.rating i{color: #ccc; font-size: 14px;}
.rating .bi-star-fill{color: gold;}

#offcanvasBody .offcanvas-body{min-height: auto !important;}

.panel-heading{padding: 10px 0; border-bottom:solid 1px #ddd;}
.panel-body{padding: 15px;}

/* .form-group .control-label{display: none} */
form legend{font-size: 16px; font-weight: 500;}
.radio-inline{margin-right: 20px;}


.btn-primary{background-color: var(--btn-primary, var(--primary)); border-color:var(--btn-primary, var(--primary));}
.btn-primary:hover{background-color: var(--btn-primary-hover, var(--secondary)); border-color: var(--btn-primary-hover, var(--secondary));}

.btn-cart{background-color: var(--btn-cart); border-color: var(--btn-cart); color: #fff; }
.btn-cart:hover{background-color: var(--btn-cart-hover); border-color: var(--btn-cart-hover); color: #fff;}

.container{max-width: var(--container-lg, 1320px);}

.active>.page-link, .page-link.active{background-color: var(--primary); border-color: var(--primary); }
.page-link{color: var(--primary); border:none; border-radius: 4px;}

::-webkit-scrollbar {width: 8px;}
::-webkit-scrollbar-thumb {background-color: #555;border-radius: 4px;}
::-webkit-scrollbar-track {background-color: #f1f1f1;}


.pull-right {margin-bottom: 10px;}


/* CSS MENU LATERAL  */
.menu-account li a {padding: 10px 22px; font-size: 16px; border-bottom: 1px solid #d9d9d9; width: 100%;}
.menu-account ul {border: 1px solid #d9d9d9;}
.menu-account ul li a.active {background: #333; color: #fff !important;}
.menu-account {margin-bottom: 20px;}
/* CSS MENU LATERAL  */

  /* CSS ORDER  */
.orders {margin-bottom: 15px;}
#account-order .header-orders {background: #333; color: #fff; border: none; font-weight: 600; font-size: 16px; padding: 12px 24px; text-align: center; width: 100%;}
#account-order .content-order {margin: 0; border-bottom: 1px solid #d9d9d9;}
#account-order .content-orders {background: #eee; text-align: center; vertical-align: middle; flex: 1; display: flex; justify-content: center; align-items: center; padding: 22.5px 0; font-weight: 500;}
#account-order .see-details {padding: 12px; width: 100%; margin: 0 15px; background: #d9d9d9; font-size: 14px;}
#account-order .see-details:hover {background: #c9c9c9;}
#account-order h1 {display: none;}

.content-order-mobile {flex-direction: column; background: #f7f7f7; border: 1px solid #d9d9d9;}
.content-order-mobile p {margin: 0;}
.content-order-mobile span {color: #858585;}
#account-order .content-orders-mobile {display: flex; justify-content: space-between; background: transparent; padding: 10px; border-bottom: 1px solid #d9d9d9;}
#account-order .content-orders-mobile:last-child {border: none;}

.order-panel{margin-bottom: 30px;}
.order-panel-body {border:solid 1px #efefef; padding: 20px; font-size: 14px;}

.order-product .image{min-width: 100px;}
.order-product h4{font-size: 14px; margin-bottom: 0;}
.order-product .text{max-width: 180px;}
.order-totals .total{display: flex; justify-content: space-between;}
.order-totals .total:last-child{padding: 10px; background-color: var(--secondary); color: #fff; justify-content: center; gap: 20px; margin-top: 20px;}
.order-totals .total:last-child > div:last-child{font-weight: bold;}

@media (max-width: 991px) {
#account-order .see-details {margin: 0; padding: inherit; background: #e9e9e9; width: auto; padding: 12px 26px;}
.orders {margin-top: 30px;}
}
/* CSS ORDER  */