/**================================
Administrator Panel CSS file - by LWEGATECH
==================================**/


html,
body{
	font-family: 'Montserrat', sans-serif;
	font-size: 14px;
	overflow-x: hidden;
	background: #f9f9fa;
}
a{color: #fb0000;text-decoration: none;}
a:hover{text-decoration: none; color:#F35050}
::-webkit-scrollbar {width: 8px; background:#3C486B;}
::-webkit-scrollbar-thumb {	background: #F35050; }

/**===========================
Layout Structure - Admin Panel
=============================**/
.wrapper-container{
	display: flex;
	min-height: 100vh;
	flex-direction: column;
	justify-content: flex-start;
	background: #fdfdfd;
  }
.main-wrapper{margin-left: 180px;margin-top: 60px;}
.header{background: #260202;color: #fff;}
.logo-inner{height: 60px;}
.header a{color: #fff; }
.header a:hover{color: #fb0000; }
.header .profile a{color: #4c3347}
.header .profile-initials{background-color:rgba(243, 198, 202, 0.29);border-radius: 50%;font-size: 14px;font-weight: 800; color:#19B7D4;padding:5px 6px;height:35px;width:35px}
.profile-initials-dashboard{background-color:rgba(21, 2, 2, 0.5);border-radius: 50%;font-size: 28px;font-weight: 700; color:#fff;padding:6px 6px;height:70px;width:70px;line-height: 50px;margin-top: -45px;}
.sidebar{transition: width 0.5s;width: 180px;font-size: 15px;background: #fff9f9;position: fixed;min-height: 100vh;max-height: 100px;left: 0;overflow-x: hidden;overflow-y:auto;scrollbar-width: thin;}
.sidebar::-webkit-scrollbar {width: 5px; }
.sidebar::-webkit-scrollbar-thumb {	background: #0256A2; }
.footer{margin-top: auto;}
.dashboard-card-title{color: #F35050 !important;}
.row-clickable { cursor: pointer;}/*class used on notifications **/
#pageOptions, #categoryOptions, #postOptions, #customOptions {	display: none;}
.bg-grey{background-color: #eeeeee86;}
.border-grey{border:1px solid #ddd !important;}
.bg-reddish{background-color: rgba(248, 185, 185, 0.12);}
.border-reddish{border:1px solid rgba(249, 111, 111, 0.43) !important;}
.side-stay{position: sticky;top: 100px;width: 250px;}
.lwega-logo{height:80px;}
.lwega_add{font-size: 10pt;color:#333333;}
.lwega_add ul{padding-left: 0px;width: 60%;}
.lwega_add ul li{list-style-type: none;margin-left: 0px;font-size:9pt;}
.invoice-title {font-size: 28pt;color: #000000;display: block;text-align: right;clear: both}
.invoice-number{font-size: 10pt;color:#333;display: block;text-align: right;clear: both}
.invoice-date{clear: both;font-size: 9pt;color:#333;display: block;text-align: right;}
.invoice-txt{clear: both;font-size: 10pt;color:#333;display: block;text-align: right !important;margin-top: 15pt !important;}
.invoice-amount{clear: both;font-size: 15pt;color:#333;font-weight: 600;text-align: right !important;display:block;}
.table.w-100 {width: 100% !important;}
.excerpt{display: -webkit-box;-webkit-line-clamp: 4;-webkit-box-orient: vertical;overflow: hidden;text-overflow: ellipsis;}
.container-pwd{max-width: 500px;margin:0 auto;}

/* =================
* Bootstrap change
*=================*/
.btn-primary {background-color: #1a4a90 !important; border-color: #0d6efd;
}

/* =================
* PDF
*=================*/

.pdf .row{max-width: 100%;width: 100%;display: table !important;table-layout: fixed;}
.pdf .col-8 {display: table-cell;vertical-align: top; padding-right: 15px;width: 70%;}
.pdf .col-4 {display: table-cell;vertical-align: top;padding-right: 15px;width: 30%;}
.pdf .col-7 {display: table-cell;vertical-align: top;padding-right: 15px;width: 58%;}
.pdf .col-5 {display: table-cell;vertical-align: top;padding-right: 15px;width: 42%;}
.pdf .table {page-break-inside: auto; border-collapse: collapse; border: 0px solid black; table-layout: fixed; width: 100%;}
.pdf .table tbody {page-break-inside: auto;}
.pdf .table thead {display: table-header-group;}
.pdf .lwega_add ul li {list-style-type: none;margin-left: 0px;font-size: 9pt;}
.pdf .table small{font-size:10px;}
.pdf .display-6{font-size:14pt !important;}
.pdf  .fs-6{font-size:12pt !important;}

/**===========================
NAVBAR - MENU
=============================**/
.top-menu{margin: 0 auto !important;}
.top-menu .dropdown-menu.show {background: #260202 !important;width: 200px;border-radius: 0px;}
.top-menu .dropdown-item{border-top: 1px #460704 solid;height: 40px;line-height: 35px;}
.top-menu .dropdown-item:hover {color: #fff !important;background-color: #f90000;}
.nav-link:focus, .nav-link:hover {color: #e1bc60 !important;}

  
/**===========================
Sidebar - MENU
=============================**/
.sidebar ul{
	list-style: none;
	padding-left: 0;
}
.sidebar li{line-height: 35px;border-bottom: 0px solid #ddd;}
.btnMenu {display: none;padding: 20px;display: block;background: #1abc9c;color: #fff;}
.btnMenu i.fa { float: right; }
.contenedor-menu {min-width: 180px;display: inline-block;line-height: 18px;}
.contenedor-menu .menu li a {color: #4c3347;display: block;padding: 10px 20px;text-decoration: none;}
.contenedor-menu .menu li a:hover { background: none; color: #fb0000; } 
.contenedor-menu .menu ul { display: none; }
.contenedor-menu .menu ul li a {background: #444C62;color: #fff;font-size: 85%;padding: 5px 20px;  border-bottom: 1px solid #4A5269;}
.contenedor-menu .menu li a .arrow {font-size: 12px;align-self: center;margin-left: auto;display: list-item;}
.contenedor-menu .menu .activado > a {background: #Fb0000;color: #fff;}
.dashboard-graph{width: 100%;max-width: 800px;}
.searchbox{height:50px;border-radius: 20px;padding:10px;width: 80%;}
/** =======================================================
SIDEBAR OPEN/CLOSE
=========================================================**/
#sidebar.open {transition: 0.5s;width: 47px;	color: inherit;background: #fff9f9;;	position: fixed;
	min-height: 100vh;max-height: 100px;left: 0;overflow-x: hidden;overflow-y:auto;scrollbar-width: thin;}
#main.open {margin-left: 48px;}
.searchbox.open {width: 100%;}
#sidebar .logo-mob{ display: none;}

.hidden {display: none;}
#toggleBtn-close.hidden {display: none;}
#toggleBtn-open.hidden {display: none;}

/**toggle/slider button of active/inactive*/
/* The switch - the box around the slider */
.switch {position: relative;display: inline-block;width: 60px;height: 34px; }
  
  /* Hide default HTML checkbox */
  .switch input {opacity: 0;width: 0;height: 0;}
  .slider {position: absolute;cursor: pointer;top: 0;left: 0;right: 0;bottom: 0;background-color: #ccc;
   -webkit-transition: .4s;transition: .4s;}
  .slider:before {position: absolute;content: "";height: 26px;width: 26px;left: 4px;bottom: 4px; background-color: white;
    -webkit-transition: .4s;transition: .4s;}
  input:checked + .slider {background-color: #18a94e;}
  input:focus + .slider {box-shadow: 0 0 1px #18a94e;}
  input:checked + .slider:before {-webkit-transform: translateX(26px);-ms-transform: translateX(26px);
    transform: translateX(26px);}
  
  /* Rounded sliders */
  .slider.round {
    border-radius: 34px;
  }
  
  .slider.round:before {
    border-radius: 50%;
  }
/** ===================================================
loading-indicator
======================================================**/
#loading-container {
  position: fixed;
  background-color: #771C1C;
}

#loading-indicator {display: none;position: absolute;z-index:1000;top: 50%;left: 50%;transform: translate(-50%, -50%);  width: 50px;height: 50px;border: 3px solid #ccc;border-radius: 50%;border-top-color: #B92C2C;animation: spin 1s linear infinite;
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

#preloader2 {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 9999;
}

#preloader2::before {
  content: "";
  border: 4px solid #f3f3f3;
  border-top: 4px solid #760F30;
  border-radius: 50%;
  width: 60px;
  height: 60px;
  animation: spin 2s linear infinite;
}

@keyframes linear {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}
.ui-datepicker-calendar {
  display: none;
  }

/**Boucing ball **/
#preloader {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.90);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 9999;
}

.bounce-container {
  display: flex;
  justify-content: center;
  align-items: center;
}

.bounce-ball {
  width: 15px;
  height: 15px;
  background-color: #FF5733;
  border-radius: 50%;
  margin: 0 5px;
  animation: bounce 1s infinite;
}

.bounce-ball:nth-child(1) {
  animation-delay: 0s;
}

.bounce-ball:nth-child(2) {
  animation-delay: 0.33s;
}

.bounce-ball:nth-child(3) {
  animation-delay: 0.66s;
}

@keyframes bounce {
  0% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-50px);
  }
  100% {
    transform: translateY(0);
  }
}
/** ===================================================
ORDERing
======================================================**/
.order .order-item img{height: 100%;object-fit: cover;}
.order .order-item .description{font-size: 13px;}
.optnz:hover { border: 2px solid rgb(138, 44, 44) !important; }
.optnz{transition:.5s;}
.optnz:hover input{background: rgb(138, 44, 44);}
/** ===================================================
Posts
======================================================**/
.postImg .thumb{height: 100px;}
.side_img {
    max-width: 100%;
    height: 300px;
    
	object-fit: cover;
  	object-position: bottom;
}

/* Hide default HTML checkbox */
.switch input {
	opacity: 0;
	width: 0;
	height: 0;
  }
  
  .slider {
	position: absolute;
	cursor: pointer;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: #ccc;
	-webkit-transition: .4s;
	transition: .4s;
  }
  
  .slider:before {
	position: absolute;
	content: "";
	height: 26px;
	width: 26px;
	left: 4px;
	bottom: 4px;
	background-color: white;
	-webkit-transition: .4s;
	transition: .4s;
  }
  
  input:checked + .slider {
	background-color: #18a94e;
  }
  
  input:focus + .slider {
	box-shadow: 0 0 1px #18a94e;
  }
  
  input:checked + .slider:before {
	-webkit-transform: translateX(26px);
	-ms-transform: translateX(26px);
	transform: translateX(26px);
  }
  
  /* Rounded sliders */
  .slider.round {
	border-radius: 34px;
  }
  
  .slider.round:before {
	border-radius: 50%;
  }
/**=======================================================================
TABS - Configs Areas
==========================================================================*/
.btabs{list-style: none;display: block !important;width:100%;}
.btabs .nav-link {color: #fff;text-align: justify;background-color: #aca8a8;width: 100% !important;
    margin-bottom: 10px;height: 40px;}
.btabs .nav-link:hover{background-color: #B92C2C}
.btabs .nav-link:active{background-color: #771C1C !important;}
.btabs .nav-link.active{background-color: #771C1C !important;}
.quick_menu{color: #fff;}
.quick_menu a{background: transparent; color:#fff; box-shadow: inset; border-radius: 5px; border: 1px solid #fb8282; margin-bottom: 10px;}
.quick_menu a:hover, .quick_menu a:active{background: #8A2C2C; border: 1px solid #8a2c2cec; }
#userpwdModal {display: block !important;}
.avatar{width: 40px; height: 40px;}

/**===========================
BLOCK POSTS
=============================**/
.block-element {display: none; }
.code-block pre { background-color: #1c1c1c;padding: 10px;border: 1px solid #ccc;	white-space: pre-wrap; }





/** =======================================================
MOBILE / RESPONSIVE
=========================================================**/
@media (min-width: 577px) and (max-width: 800px){
  #sidebar {transition: 0.5s;width: 47px;	color: inherit;background: #fff9f9;;	position: fixed;
    min-height: 100vh;max-height: 100px;left: 0;overflow-x: hidden;overflow-y:auto;scrollbar-width: thin;}
  #main {margin-left: 48px;}
  #sidebar.open {transition: width 0.5s;width: 200px;color: #fff;background: #fff9f9;position: absolute;
		min-height: 100vh;max-height: 100px;top: 60px;left: 0;z-index:99;overflow-x: hidden;overflow-y:auto;scrollbar-width: thin;
	}
  .contenedor-menu .menu li a { width: 200px; }
  .lwega-logo{height:60px;}
.lwega_add{font-size: 12pt;color:#333333;}
.lwega_add ul li{list-style-type: none;margin-left: 0px;font-size:8pt;}
.invoice-title {font-size: 20pt;color: #000000;display: flex;text-align:right; clear: both;}
.invoice-number{font-size: 10pt;color:#333;display: flex; text-align: right; clear: both}
.invoice-txt{clear: both;font-size: 9pt;color:#333;text-align: right !important;margin-top: 2.5em !important;clear: both}
.invoice-amount{font-size: 13pt;color:#333;font-weight: 600;text-align: right; clear: both}

}
@media screen and (max-width: 576px){
  .navbar button{margin-top: -18px !important;}
  .navbar-collapse {position: fixed;top: 0;right: 0;height: 100%;width: 80%;background: #2e0505;z-index: 99;
        padding-top: 1rem;transition: transform 0.3s ease-in-out;transform: translateX(100%);}
  .navbar-collapse.show {transform: translateX(0);}
  .top-menu {display: flex;flex-direction: column;list-style: none;padding-left: 0;}
  .top-menu .nav-item {border-bottom: 1px solid #444;position: relative;}
  .nav-link {line-height: 35px;}
  .dropdown-menu {padding: 1rem;margin-top: 0.5rem;border-radius: 4px;}
  .dropdown-item {color: #fff;padding: 0.5rem 1rem;line-height: unset !important;background: rgb(220, 20, 60);}
  .dropdown-item:hover {background: #333;}
  .dropdown-arrow {font-size: 0.8rem;right:0;margin-left: 1.5rem;color: #ccc;}
  .nav-item.show > .dropdown-menu {display: contents;}
  .dropdown-arrow {font-size: 0.8rem;margin-left: 0.5rem;}
  .navbar-toggler {position: absolute;top: 10px;right: 10px;}
  .text-show{display:none;}
	.sidebar{transition: width 0.5s;width: 0px;color: #fff;background: #fff;position: fixed;min-height: 100vh;
		max-height: 100px;top: 0;left: 0;overflow-x: hidden;overflow-y:auto;}
	#main {margin-left: 2px;}
	#sidebar .logo-mob{ display: block;}
	#sidebar .logo-desktop{ display: none;}
	#sidebar.close .logo-desktop{ display: block;}
	#sidebar.close .logo-mob{ display: none;}
	#sidebar.open {transition: width 0.5s;width: 250px;color: #fff;background: #fff9f9;position: absolute;
		min-height: 100vh;max-height: 100px;top: 60px;left: 0;z-index:99;overflow-x: hidden;overflow-y:auto;scrollbar-width: thin;
	}
  .contenedor-menu .menu li a { width: 250px; }
	.sidebar.open ::-webkit-scrollbar {width: 5px; }
	.sidebar.open ::-webkit-scrollbar-thumb {	background: #397eba; position: absolute;}
  #sidebar.close{transition: width 0.5s;width: 0px;color: #fff;background: #fff9f9;position: absolute;
		min-height: 100vh;max-height: 100px;top: 60px;left: 0;z-index:99;overflow-x: hidden;overflow-y:auto;scrollbar-width: thin;
	}
  #main.close {margin-left: 2px;}
  .btabs { width: 300px; }
  .logo-inner{height: 50px;}
.lwega-logo{height:50px;}
.lwega_add{font-size: 10pt;color:#333333;}
.lwega_add ul{padding-left: 0px;width: 80%;}
.lwega_add ul li{list-style-type: none;margin-left: 0px;font-size:8pt;}
.invoice-title {font-size: 18pt;color: #000000;display: flex;float: right;clear: both}
.invoice-number{font-size: 9pt;color:#333;display: flex;float: right;clear: both}
.invoice-date{font-size: 8pt;color:#333;display: block;float: right;clear: both}
.invoice-txt{clear: both;font-size: 9pt;color:#333;float: right !important;margin-top: 2.5em !important;}
.invoice-amount{font-size: 12pt;color:#333;font-weight: 600;float:inline-end;clear: both}

.order .order-item img {height: 150px;object-fit: cover;width: 100%;object-position: top;}
.order .order-item .description{font-size: 13px;}

}