@charset "UTF-8";

@import "../font/Proximanova/proximanova.css";
@import "../font/Pluto/pluto.css";

:root
{
	--font-family-sans-serif: 'proxima-nova',sans-serif;
	--font-family-monospace: SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;

	--text-primary: #707070;
	--text-secondary: #A4ABB0;

	--color-primary: #AB182D;
	--color-primary-hover: #650716;
	--color-secondary:#231F20;

	--link-primary: var(--text-primary);
	--link-secondary: var(--text-secondary);
	--link-primary-hover: var(--color-primary);
	--link-secondary-hover: var(--color-primary);

	--bg-primary: #AB182D;
	--bg-primary-alpha: #AB182D44;
	--bg-primary-alt: #545459;
	--bg-primary-alt-alpha: #54545944;
	--bg-secondary: #EFF0F1;
	--bg-secondary-alpha: #EFF0F144;
	--bg-secondary-alt: #909194;
	--bg-secondary-alt-alpha: #90919444;


	--btn-primary: #AB182D;
	--btn-primary-hover: #650716;
	--btn-primary-focus: #65071644;
	--btn-secondary: #A4ABB0;
	--btn-secondary-hover: #707070;
	--btn-secondary-focus: #70707044;


	--foreground: #2c3238;
	--foreground-alt: #2c3238;
	--foreground-high: #f8f9fa;

	--background: #f8f9fa;
	--background-alt: #f7f7f7;
	--background-high: #2c3238;
	--background-primary: var(--bg-primary);
	--background-secondary: var(--bg-secondary);
	--background-secondary-alt: var(--bg-secondary-alt);

	--button-primary-text: #f8f9fa;
	--button-secondary-text: #f8f9fa;

	--button-primary: var(--btn-primary);
	--button-primary-hover:var(--btn-primary-hover);
	--button-secondary: var(--btn-secondary);
	--button-secondary-hover: var(--btn-secondary-hover);

	--input-color: #535353;
	--input-background: #EFF0F1;
	--input-focus: #535353;

	--input-autofill-color: var(--text-primary);
	--input-autofill-background: var(--input-background);

	--swiper-theme-color: var(--btn-primary);

	--bs-primary: var(--background-primary);
	--bs-secondary: var(--background-secondary);
	--bs-success: #198754;
	--bs-info: #0dcaf0;
	--bs-warning: #ffc107;
	--bs-danger: #dc3545;
	--bs-light: #f8f9fa;
	--bs-dark: #212529;
	--bs-font-sans-serif: var(--font-family-sans-serif);
	--bs-font-monospace: var(--font-family-monospace);
	--bs-gradient: linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0));
	--bs-grayed: #70707033;
	--bs-red: #E30613;
	--bs-green: #2CCE10;

	--bs-primary-rgb: 171,24,45;
	--bs-secondary-rgb: 239,240,241;
	--bs-success-rgb: 25,135,84;
	--bs-info-rgb: 13,202,240;
	--bs-warning-rgb: 255,193,7;
	--bs-danger-rgb: 220,53,69;
	--bs-light-rgb: 248,249,250;
	--bs-dark-rgb: 33,37,41;
	--bs-white-rgb: 255,255,255;
	--bs-black-rgb: 0,0,0;
	--bs-body-color-rgb: 33,37,41;
	--bs-body-bg-rgb: 255,255,255;

	--border-radius: 0.55rem;
	--card-radius: var(--border-radius);

	--gradiend-primary: linear-gradient(90deg, rgba(105,40,50,1) 0%, rgba(145,40,50,1) 15%, rgba(200,16,46,1) 65%, rgba(200,30,50,1) 100%);
}

html, body
{
    font-family: var(--font-family-sans-serif) !important;
	color: var(--text-primary);
}

.home-logo
{
	height: 42px;
}

a
{
	text-decoration: underline;
	color: var(--link-primary);
	transition: .25s;
}

a:hover
{
	color: var(--link-primary-hover);
	text-decoration: none;
}

::placeholder
{
	color: var(--text-primary) !important;
	text-align: left;
}

.text-center::placeholder
{
	text-align: center !important;
}

.my-rounded
{
	border-radius: var(--border-radius);
}

.box-dotted-star
{
	position: relative;
	display: inline-block;
	width: 100%;
	padding-top: 100%;
	background-image: url("../images/dotten.svg");
	background-repeat: no-repeat;
	background-position: center center;
	background-size: contain;
}

.backdrop
{
	position: fixed;
	display: flex;
	justify-content: center;
	align-items: center;
	top: 0;
	left: 0;
	width: 100vw;
	height: 100vh;
	background-color: rgba(0, 0, 0, 0.5);
	z-index: 1000;
}

.link
{
	cursor: pointer;
}

.no-link
{
	text-decoration: none;
}
.status-list
{
	border: 0px solid var(--bg-secondary);
	border-bottom-width: 2px;
}
.li-dot
{
	display: inline-block;
	margin-right: .75rem;
	width: 12px;
	height: 12px;
	line-height: 1.5;
	border-radius: 50%;
}
.li-dot.sent, tr.sent .btn 				{ background-color: #10CE3F; }
.li-dot.edit, tr.edit .btn 				{ background-color: #E8BB24; }
.li-dot.incomplete, tr.incomplete .btn 	{ background-color: #6E64BC; }
.li-dot.problem, tr.problem	.btn		{ background-color: #E30613; }

.li-status
{
	font-weight: bold;
	display: inline-block;
	margin-right: .75rem;
	width: 150px;
	line-height: 1.5;
}

.btn-xs, .btn-group-xs > .btn {
	padding: 0.05rem 0.05rem;
	font-size: 0.75rem;
	border-radius: 0.2rem;
}

.sticky-md-top { top: 1em; }

.table-custom.dataTable-table > thead > tr {
	border-color: white;
}
.table-custom.dataTable-table > thead > tr > th {
	vertical-align: middle;
	border-color: white;
}
.table-custom.dataTable-table > tbody > tr {
	border-width: 0px;
}
.table-custom.dataTable-table > tbody > tr > td {
	vertical-align: middle;
	border-bottom-color: white;
	border-bottom-width: 4px;
}
.table-custom.dataTable-table > tbody > tr.edit
{
	background-color: #FBF3D7;
}
.table-custom.dataTable-table > tbody > tr.incomplete
{
	background-color: #E2E0F2;
}
.table-custom.dataTable-table > tbody > tr.sent
{
	background-color: #EFF0F1;
}

.table-custom.table-hover > tbody > tr, .table-custom.dataTable-table > tbody > tr
{
	transition: .1s ease-in;
}

.table-custom.table-hover > tbody > tr:hover, .table-custom.dataTable-table > tbody > tr:hover
{
	background-color: var(--btn-secondary) !important;
	color:white;
	transition: .1s ease-in;
}

.table-custom.table-hover > tbody > tr .fas, .table-custom.dataTable-table > tbody > tr .fas
{
	opacity: .25;
	transition: .1s opacity ease-in;
}
.table-custom.table-hover > tbody > tr:hover .fas, .table-custom.dataTable-table > tbody > tr:hover .fas
{
	opacity: 1;
}

.bg-primary-alt
{
	background-color: var(--bg-secondary-alt);
}

.bg-secondary-alt
{
	background-color: var(--bg-secondary-alt);
}

.card { border-radius: var(--card-radius); }
.card-header:first-child { border-radius: calc(var(--card-radius) - 1px) calc(var(--card-radius) - 1px) 0 0; }

.form-control
{
	padding: 0.375rem 0.75rem;
	border-radius: var(--card-radius);
	background-color: var(--bg-secondary);
	color: var(--color-secondary);
	border: 0px;
	line-height: 2;
}

.nav-pills .nav-link {
	color: #fff;
	background-color: var(--btn-primary);
	border-radius: var(--border-radius) !important;
}

.nav-pills .nav-link:not(.active):hover
{
	background-color: var(--btn-primary-hover);
	box-shadow: 0 0 0 0.25rem rgba(13, 13, 13, 0.25) !important;
}

.nav-pills .nav-link.active, .nav-pills .show > .nav-link {
	background-color: var(--btn-primary-hover);
}

.select2
{
	width: 100% !important;
}

select2-container--bootstrap-5.select2-container--open .select2-dropdown
{
}

.was-validated .form-control:invalid, .was-validated .dataTable-input:invalid, .form-control.is-invalid, .is-invalid.dataTable-input
{
	border-color: var(--bs-danger);
	padding-right: calc(1.5em + 0.75rem);
	background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23dc3545'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23dc3545' stroke='none'/%3e%3c/svg%3e");
	background-repeat: no-repeat;
	background-position: right calc(0.375em + 0.1875rem) center;
	background-size: calc(2em + 0.375rem) calc(2em + 0.375rem);
}

.select2-container--bootstrap-5 .select2-selection
{
	min-height: calc(2em + .75rem);
	padding: .375rem .75rem;
	line-height: 2.1;
	color: #212529;
	border: 0px;
	border-radius: var(--card-radius);
	background-color: var(--bg-secondary);
	transition: border-color 0.15s ease-in-out,box-shadow 0.15s ease-in-out;
}

.select2-container--bootstrap-5.select2-container--focus .select2-selection, .select2-container--bootstrap-5.select2-container--open .select2-selection {
	box-shadow: 0 0 0 0 rgba(255,255,255,0);
}

.select2-container--bootstrap-5 .select2-selection--single .select2-selection__rendered {
	font-weight: 400;
	line-height: 2;
	color: var(--color-secondary);
}

.select2-container--bootstrap-5 .select2-dropdown {
	background-color: var(--bg-secondary);
	border-color: var(--bg-secondary);
	border-radius: var(--card-radius);
}

.select2-container--bootstrap-5 .select2-dropdown .select2-results__options .select2-results__option.select2-results__option--selected,
.select2-container--bootstrap-5 .select2-dropdown .select2-results__options .select2-results__option[aria-selected="true"]
{
	color: #fff;
	background-color: var(--bg-secondary-alt);
}

.select2-container--bootstrap-5 .select2-dropdown .select2-search .select2-search__field:focus {
	border-color: var(--btn-secondary);
	box-shadow: 0 0 0 0.25rem var(--btn-secondary-focus);
}

.input-group-text
{
	text-align: right;
	background-color: var(--bg-secondary);
	border-radius: var(--card-radius);
	border: 0px;
}

.custom-form-control.form-select, .custom-form-control.form-control, .btn-form-collapsable
{
	background-color: var(--input-background);
	color: var(--input-color);
	font-weight: normal;
	border: 0px;
}

.custom-form-control.form-select:focus, .custom-form-control.form-control:focus
{
	box-shadow: 0 0 0 0.25rem var(--btn-secondary-focus);
}

.input-light
{
	background-color: var(--bs-white);
}

.form-check-label
{
	line-height: 1.7;
}

.input-light:checked
{
	background-color: var(--bs-dark);
	border-color: var(--bs-dark);
}

.form-check-input[type=radio] { border-radius: 0.25em; }
.form-check-input:checked[type=radio] { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10l3 3l6-6'/%3e%3c/svg%3e"); }
.form-check-input:focus { border-color: var(--input-focus); outline: 0; box-shadow: 0 0 0 0.25rem rgba(13, 13, 13, 0.25); }

.form-switch.switch-big .form-check-input
{
	width: 80px;
	margin-left: -40px;
	font-size: 1.2rem;
}

label input
{
	line-height: 1.5;
	border: 0;
	background-color: transparent;
}

.card-header {
	font-weight: bold;
}
.card-header.collapsed {
	font-weight: normal;
}
.card-header .fa {
	line-height: 1.5;
	transition: .3s transform ease-in-out;
}
.card-header.collapsed .fa {
	transform: rotate(180deg);
}

.data-error
{
	color: var(--bs-dark);
	background-color: var(--bs-white);
	border-color: var(--bs-danger);
	outline: 0;
	box-shadow: 0 0 0 0.25rem var(--bs-danger);
}

.form-control:focus, .dataTable-input:focus {
	color: #212529;
	background-color: #fff;
	border-color: var(--btn-secondary-focus);
	outline: 0;
	box-shadow: 0 0 0 0.25rem var(--btn-secondary-focus);
}

.btn-outline-primary
{
	color: var(--button-primary);
	border-color: var(--button-primary-hover);
}

.btn-outline-primary:hover {
	color: #fff;
	background-color: var(--button-primary);
	border-color: var(--button-primary-hover);
}

.btn-check:checked + .btn-outline-primary, .btn-check:active + .btn-outline-primary, .btn-outline-primary:active, .btn-outline-primary.active, .btn-outline-primary.dropdown-toggle.show
{
	color: var(--button-primary-text);
	background-color: var(--btn-primary-hover);
	border-color: var(--btn-primary-hover);
}

.btn-check:focus + .btn-outline-primary, .btn-outline-primary:focus, .btn-check:checked + .btn-outline-primary:focus, .btn-check:active + .btn-outline-primary:focus, .btn-outline-primary:active:focus, .btn-outline-primary.active:focus, .btn-outline-primary.dropdown-toggle.show:focus {
	box-shadow: 0 0 0 0.25rem var(--btn-primary-focus);
}

.btn-outline-secondary
{
	color: var(--text-primary);
	border-color: var(--button-secondary);
}

.btn-outline-secondary:hover {
	color: #fff;
	background-color: var(--button-secondary-hover);
	border-color: var(--button-secondary);
}

.btn-check:checked + .btn-outline-secondary, .btn-check:active + .btn-outline-secondary, .btn-outline-secondary:active, .btn-outline-secondary.active, .btn-outline-secondary.dropdown-toggle.show
{
	color: #fff;
	background-color: var(--button-secondary);
	border-color: var(--button-secondary);
}

.btn-check:focus + .btn-outline-secondary, .btn-outline-secondary:focus, .btn-check:checked + .btn-outline-secondary:focus, .btn-check:active + .btn-outline-secondary:focus, .btn-outline-secondary:active:focus, .btn-outline-secondary.active:focus, .btn-outline-secondary.dropdown-toggle.show:focus {
	box-shadow: 0 0 0 0.25rem var(--btn-secondary-focus);
}

.btn.btn-outline-secondary .smooth .form-control, .btn.btn-outline-secondary .smooth .input-group-text
{
	color: var(--button-secondary-text);
	background-color: transparent;
	border: 0;
}

.btn.btn-outline-secondary .smooth .form-control::-webkit-calendar-picker-indicator {
	filter: invert(1);
}

.btn.btn-outline-secondary .smooth .form-control:focus
{
	box-shadow: 0 0 0 0.25rem var(--btn-secondary-focus);
}

.btn-100, .btn-group-100 > .btn
{
	width: 100%;
}

.btn-xl, .btn-group-xl > .btn
{
	padding: 1.25rem;
	font-size: 1.25rem;
	border-radius: 0.75rem;
	width: 100%;
}

.btn-primary
{
	color: #fff;
	background-color: var(--button-primary);
	border-color: var(--button-primary);
}
.btn-primary:hover {
	background-color: var(--button-primary-hover);
	border-color: var(--button-primary-hover);
}
.btn-check:focus + .btn-primary, .btn-primary:focus {
	background-color: var(--button-primary-hover);
	border-color: var(--button-primary-hover);
	box-shadow: 0 0 0 0.25rem var(--button-primary-hover);
}

.btn-check:checked + .btn-primary, .btn-check:active + .btn-primary, .btn-primary:active, .btn-primary.active, .show > .btn-primary.dropdown-toggle {
	color: var(--button-primary-text);
	background-color: var(--btn-primary-hover);
	border-color: var(--btn-primary-hover);
	--bs-btn-active-color: var(--button-primary-text);
	--bs-btn-active-bg: var(--btn-primary-hover);
	--bs-btn-active-border-color: var(--btn-primary-hover);
}

.hr
{
	width: 100%;
	height: 1px;
	background-color: var(--bs-white);
}

.bg-gradient-primary
{
	background: var(--gradiend-primary) !important;
}

.bg-greyed
{
	background-color: var(--bs-grayed) !important;
}

.btn-green
{
	border-color: var(--bs-green);
	background-color: var(--bs-green);
}

.bg-green
{
	background-color: var(--bs-green) !important;
}

.btn-red
{
	border-color: var(--bs-red);
	background-color: var(--bs-red);
}

.bg-primary
{
	background-color: var(--bg-primary);
}

.bg-red
{
	background-color: var(--bs-red);
}

.text-red
{
	color: var(--bs-red);
}

.line-height-1
{
	line-height: 1.5rem;
}

.lead-title
{
	/*
	border: 0px solid var(--bs-red);
	border-left-width: 5px;
	padding-left: .5rem;
	*/
	display: flex;
	justify-content: flex-start;
	align-items: flex-start;
	margin: 4px 0;
}

.lead-title .btn
{
	width: 24px;
	height: 24px;
	line-height: 27px;
}

.lead-title .d-inline-block
{
	line-height: 1.2rem;
}

.lead-title .contact
{
	text-transform: uppercase;
	font-weight: bold;
	font-size: 1.25rem;
}

.rounded-top-0
{
	border-top-left-radius: 0rem !important;
	border-top-right-radius: 0rem !important;
}

.rounded-bottom-0
{
	border-bottom-left-radius: 0rem !important;
	border-bottom-right-radius: 0rem !important;
}

.font-size-xs 	{ font-size: .75rem; }
.font-size-1 	{ font-size: 1rem; }
.font-size-2 	{ font-size: 1.25rem; }
.font-size-3 	{ font-size: 1.5rem; }
.font-size-4 	{ font-size: 2rem; }
.font-size-5 	{ font-size: 2.5rem; }

@media (max-height: 690px)
{
}