:root {
    --white: #fff;
    --card-border: rgba(0,0,0,0.08);
    --veraneos: #14716a;
    --lime-lighter: #ecfaf6;
    --lime-16: #d9f3eb;
    --lime: #12b886;
    --lime-dark: #038b62;
    --blue-lighter: #ebf6f7;
    --blue: #129cab;
    --orange-lighter: #fdf2ec;
    --orange: #ee641c;
    --red-lighter: #fceeed;
    --red: #db2c24;
    --red-dark: #b50700;
    --gold: #ffb200;
    --purple: #7b0051;
    --tan: #b6a467;
    --paper: #faf9f8;
    --paper-dark: #f5f3f1;
    --paper-darker: #eee9e5;
    --ink-16: #dedfe0;
    --ink-lighter: #adb5bd;
    --ink-light: #868e96;
    --ink: #343a40;
    --border-radius: 4px;
}

body {
	margin-top: 51px;
	background: var(--ink);
}

.navbar-inverse {
	background: var(--veraneos);
	border-color: var(--veraneos);
	color: var(--white);
}

.btn-group {
	background: #fff;
	border-radius: 4px;
}

.btn-group .btn, 
.navbar-inverse .btn-default {
	color: #aaacae;
	background-color: #f1f1f2;
	box-shadow: none;
	border-color: #f1f1f2;
	outline: none;
	font-weight: 600;
}

.btn-group .btn:focus,
.navbar-inverse .btn-default:focus {
	outline: none;
}

.btn-group .btn:hover,
.navbar-inverse .btn-default:hover {
	opacity: .8;
}

.btn-group .active {
	color: var(--white);
	background-color: var(--lime);
	box-shadow: none;
	border-color: var(--lime);
}

.btn-green {
	color: var(--white);
	background-color: var(--lime);
	box-shadow: none;
	border-color: var(--lime);
	outline: none;
	font-weight: 600;
}

.btn-green:hover {
	color: var(--white);
	opacity: .8;		
}



/** FOLDER **/
#modal-filters.right {
	text-align: left;
}

#modal-filters .form-control {
	margin-bottom: 10px;
}

#modal-filters hr {
	margin-left: -15px;
	margin-right: -15px;
}

#modal-filters .btn-danger {
	background-color: var(--white);
    border-color: var(--red);
    color: var(--red);
    margin-top: 10px;
} 

#modal-filters .btn-danger:hover {
	background-color: var(--white);
    border-color: var(--red-dark);
    color: var(--red-dark);
} 

#modal-filters .btn-danger:focus {
	outline: none;
}




/** PIPELINE **/

/* width */
#pipeline ::-webkit-scrollbar,
#list-request::-webkit-scrollbar {
  width: 8px;
}

/* Track */
#pipeline ::-webkit-scrollbar-track,
#list-request::-webkit-scrollbar-track {
  background: transparent; 
}
 
/* Handle */
#pipeline ::-webkit-scrollbar-thumb,
#list-request::-webkit-scrollbar-thumb {
  background: #888; 
  border-radius: 10px;
}

/* Handle on hover */
#pipeline ::-webkit-scrollbar-thumb:hover,
#list-request::-webkit-scrollbar-thumb:hover {
  background: #555; 
}




#pipeline {
	background: #343a40;
	display: flex;	
	height: 100%;
}

.pipeline-col {
	width: 20%;
	padding: 10px;
}

.pipeline-col h2 {
	color: #fff;
	font-size: 22px;
	margin: 0;
	margin-bottom: 10px;
	text-indent: 15px;
}

.pipeline-col .inside {
	height: calc(100vh - 100px);
    background: linear-gradient(0deg,#343a40,rgba(134,142,150,.5));
    /*background: red;*/
    border-radius: 10px;
    padding: 8px;
    overflow-y: auto;
}

.pipeline-item {
	height: 168px;
    border-radius: 10px;
    background-color: #fff;
    box-shadow: 0 2px 4px var(--card-border);
    margin-bottom: 8px;
    padding: 8px;
    display: flex;
    flex-direction: column;
    color: var(--ink);
    position: relative;
    overflow: hidden;
}

.pipeline-item p.folder-name {
	font-weight: 600;
}
.pipeline-item p.folder-name span {
	text-transform: uppercase;
}

.pipeline-item .first-row {
	display: flex;
	align-items: flex-start;
    justify-content: space-between;
    margin-bottom: 8px;
}

.pipeline-item .date {
	background-color: transparent;
	color: var(--blue);
	box-sizing: border-box;
	border-radius: var(--border-radius);
	line-height: 1.14;
	height: 24px;
	padding: 3px 6px;
	display: flex;
	align-items: center;
	max-width: 90px;
	font-weight: 600;
	white-space: nowrap;
	margin-left: 8px;
}

.pipeline-item .date.late {
	background-color: var(--red);
	color: var(--white);
}

.pipeline-item .action {
	box-sizing: border-box;
    border-radius: var(--border-radius);
    line-height: 1.34;
    height: 24px;
    padding: 3px 6px;
    display: inline-block;
    align-items: center;
    max-width: 190px;
    font-weight: 600;
	border: 1px solid var(--ink);
	font-size: 12px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.pipeline-item .content {
	color: var(--ink-light);
}

.pipeline-item .content .fa {
	margin-right: 5px;
	width: 14px;
	text-align: center;
}
	




/** CALENDAR **/
#viewCalendar {
	background: var(--ink);
	min-height: calc(100vh - 51px);
	display: flex;
}

#viewCalendar .cal-day {
	float: none;
	padding: 10px;
	border: none;
}

#viewCalendar .cal-day h5 {
	color: #fff;
	text-align: center;
	font-size: 16px;
	margin-top: 0;
}
#viewCalendar .cal-day.today h5 {
	font-weight: 600;
}

#viewCalendar .cal-day .inside {
    height: calc(100vh - 115px);
    background: linear-gradient(0deg,#343a40,rgba(134,142,150,.5));
    /*background: red; */
    border-radius: 10px;
    padding: 8px;
    overflow-y: auto;
}

#viewCalendar .cal-day .inside table {
	border-radius: 10px;
	overflow: hidden;
	margin-bottom: 10px;
	background: #fff;
}

#viewCalendar .cal-day .inside table th {
	border: none;
}

#viewCalendar .cal-day .inside .pull-right {
	margin-right: 5px;
}





/** LIST FOLDER **/
#viewList {
	background: var(--ink);
	min-height: calc(100vh - 51px);
	padding: 10px;
}

#viewList table {
	background: #fff;
	border-radius: 10px;
	overflow: hidden;
}

#viewList table td {
	vertical-align: middle;
}

#viewList table td:first-child {
	border-left: 10px solid transparent;
}

#viewList table td.isConfirmedBorder {
	border-left: 10px solid lightskyblue;
}

#viewList table td.isPreConfirmedBorder {
	border-left: 10px solid limegreen;
}


#viewList .date.late {
    background-color: var(--red);
    color: var(--white);
}

#viewList .date {
    background-color: transparent;
    color: var(--blue);
    box-sizing: border-box;
    border-radius: var(--border-radius);
    line-height: 1.14;
    height: 24px;
    padding: 3px 6px;
    display: flex;
    align-items: center;
    max-width: 90px;
    font-weight: 600;
    white-space: nowrap;
}

#viewList .action {
    box-sizing: border-box;
    border-radius: var(--border-radius);
    line-height: 1.34;
    height: 24px;
    padding: 3px 6px;
    display: inline-block;
    align-items: center;
    max-width: 190px;
    font-weight: 600;
    border: 1px solid var(--ink);
    font-size: 12px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}


#table-actions .action {
	box-sizing: border-box;
    border-radius: var(--border-radius);
    line-height: 1.34;
    height: 24px;
    padding: 3px 6px;
    display: inline-block;
    align-items: center;
    /*max-width: 190px;*/
    font-weight: 600;
    border: 1px solid var(--ink);
    font-size: 12px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}