@charset "utf-8";

/* ---------------------------------------------------------------------------
 * GLOBAL session
 * This session contains rules apply for elements/sessions appear in all page
 * -------------------------------------------------------------------------- */

/* ----------------
 * FONTS session
 * ---------------- */

@import url("../../assets/fonts/fonts.css");

body {
    font-family: "QuickSand", "system";
	font-weight: 400;
    color: var(--dark);
}


/* ----------------
 * BOOTSTRAP FIX
 * ---------------- */
a {
    text-decoration: none !important;
}

/* ----------------
 * DISPLAY session
 * ---------------- */

/* Force to hide any element */
.hidden {
    display: none !important;
}

/* Set default display for extenal tag, eg: module is block */
module, switcher {
    display: block;
}


/* ----------------
 * LORD ICON session
 * ---------------- */

.lord-icon-white {color: #fff;}
.lord-icon-black {color: #000;}
.lord-icon-blue {color: var(--blue);}
.lord-icon-green {color: var(--green);}
.lord-icon-red {color: var(--red);}
.lord-icon-yellow {color: var(--yellow);}
.lord-icon-primary {color: var(--primary);}
.lord-icon-success {color: var(--success);}
.lord-icon-warning {color: var(--warning);}
.lord-icon-danger {color: var(--danger);}
.lord-icon-gray {color: var(--gray);}
.lord-icon-16 {
    width: 16px;
    height: 16px;
}
.lord-icon-32 {
    width: 32px;
    height: 32px;
}
.lord-icon-48 {
    width: 48px;
    height: 48px;
}
.lord-icon-64 {
    width: 64px;
    height: 64px;
}
.lord-icon-72 {
    width: 72px;
    height: 72px;
}
.lord-icon-96 {
    width: 96px;
    height: 96px;
}
/* ----------------
 * SIDERBAR session
 * ---------------- */

/* Change color of sider bar's icons */
.sidebar-wrapper #compactSidebar .menu-categories a.menu-toggle[data-active="true"] .base-icons svg.sidebar-item-icon {
    fill: #fff;
    color: #fff;
}

.sidebar-wrapper #compactSidebar .menu-categories a.menu-toggle .base-icons svg.sidebar-item-icon {
    fill: rgba(255,255,255,0.7);
}

.sidebar-wrapper #compact_submenuSidebar .submenu ul.submenu-list li a svg:not(.feather-chevron-right) {
    color: #060818;
    margin-right: 15px;
    vertical-align: middle;
    width: 36px;
    height: 36px;
    stroke-width: 0.8px;
    fill: rgba(6, 8, 24, 0.7);
}

lord-icon.sidebar-icon {
    width: 64px;
    height: 64px;
}

lord-icon.sidebar-icon-sub {
    width: 48px;
    height: 48px;
}

/* --------------------
 * RENDER BODY session
 * -------------------- */

/* Reset margin and padding for widget */
/*#render-body .widget {
    margin: 15px;
}*/

/*.widget.box .widget-header,
.widget.box .widget-content {
    padding: 20px;
}*/

.widget.box.widget-compact .widget-header {
    padding-bottom: 0;
}

.widget.box.widget-compact .widget-content {
    padding-top: 0;
}


/* ---------------------------------------------------------------------------
 * ELEMENT session
 * This session contains default rules for some elements
 * -------------------------------------------------------------------------- */

/* --------------------
 * FORM session
 * -------------------- */

/* Set form label is dark gray */
.form-group label, label {
    color: var(--gray-dark);
}

/* Format form validation error */
.validation-summary-errors ul {
    list-style: none;
    padding: 0;
}

.validation-summary-errors ul li {
   /* text-align: left;*/
    margin: 15px 0;
    padding: 15px;
    color: white;
    background-color: var(--danger);
    border-radius: 5px;
}


/* --------------------
 * SWITCHER session
 * -------------------- */

/* Display text beside switch in inline-switch */
.switch-group .inline-switch {
    margin-bottom: 15px;
}

.inline-switch .switch-text {
    padding-left: 8px;
    font-weight: 600;
}



/* --------------------
 * SWITCHER session
 * -------------------- */

/* Set up padding for action button in regular search module */
button.btn-search-action {
    padding-left: 5px;
    padding-right: 5px;
    border-radius: 0;
}


/* --------------------
 * TIMELINE session
 * -------------------- */

/* Override
 * Show last timeline dot
 */
.timeline-line .item-timeline:last-child .t-dot:after {
    display: block !important; 
}


/* --------------------
 * PROGRESS BAR session
 * -------------------- */


/*Lấy css của progress bên dash_1*/
.progress {
  height: 22px;
  padding: 4px;
  border-radius: 20px;
  box-shadow: 0 2px 2px rgba(224, 230, 237, 0.4588235294117647),;
}

.progress-bar {
  position: relative;
}

/*Thêm chấm tròn*/
.progress-bar::before {
    content: '';
    height: 7px;
    width: 7px;
    background: #fff;
    position: absolute;
    right: 3px;
    border-radius: 50%;
    top: 3.4px;
}

/*Progress text*/
.progress-text p {
  font-weight: 700;
}

/*PefectScrollBar default height*/
.hasPerfectScrollbar {
    height: 350px;
}


.row [class*="col-"] .widget .widget-header module {
    padding-left: 15px;
    padding-right: 15px;
}