/*************************************************************/
/*****************[   Document - Container   ]****************/
/*************************************************************/
.document-container {
	position:						relative;
	display: 						flex;
	flex-direction: 				column;
	align-items: 					center;
	overflow: 						auto scroll;
	flex: 							1 1 auto;

	width: 							100vw;
	height: 						100dvh;

	background-color:				#f0f0f0;
}

.document-container > .document-papers {
	position:						relative;
	display: 						flex;
	flex-direction: 				column;
	margin: 						auto;
	
	transform-origin: 				top center;
	transition: 					transform 0.3s ease;
}

@media (min-width: 992px) {
	.document-container {
		padding: 					92px 32px 32px 32px;
	}

	.document-container > .document-papers {
		gap:						32px;
	}
}

@media (min-width: 576px) and (max-width: 991px) {
	.document-container {
		padding: 					84px 24px 24px 24px;
	}

	.document-container > .document-papers {
		gap:						24px;
	}
}

@media (max-width: 575px) {
	.document-container {
		padding: 					76px 16px 16px 16px;
	}

	.document-container > .document-papers {
		gap:						16px;
	}
}


/*************************************************************/
/*******************[   Document - Paper   ]******************/
/*************************************************************/
.document-paper {
	position:						relative;
	display: 						flex;
	justify-content: 				start;
	page-break-after: 				always;
	overflow: 						hidden;

	border-radius:					4px;
	flex-shrink: 					0;

	-webkit-box-shadow: 			0 1rem 3rem rgba(var(--color-black-rgb), 0.1);
	-moz-box-shadow: 				0 1rem 3rem rgba(var(--color-black-rgb), 0.1);
	box-shadow: 					0 1rem 3rem rgba(var(--color-black-rgb), 0.1);

	background-color:				rgba(var(--color-white-rgb), 1);
}

.document-paper.document-paper-a4-portrait {
	width: 							210mm;
	height: 						297mm;
}

.document-paper.document-paper-a4-landscape {
    width: 							297mm;
    height: 						210mm;
}

.document-paper-inside {
	flex: 							1;
	max-width:						100%;
}

.document-paper.document-paper-a4-portrait .document-paper-inside {
	padding: 						2.20cm;
}

.document-paper.document-paper-a4-landscape .document-paper-inside {
	padding: 						1.20cm 1.00cm;
}

.document-paper-inside span,
.document-paper-inside a,
.document-paper-inside p,
.document-paper-inside h1,
.document-paper-inside h2,
.document-paper-inside li,
.document-paper-inside h3,
.document-paper-inside h4,
.document-paper-inside h5,
.document-paper-inside h6,
.document-paper-inside button,
.document-paper-inside th,
.document-paper-inside label,
.document-paper-inside input,
.document-paper-inside select,
.document-paper-inside textarea,
.document-paper-inside optgroup,
.document-paper-inside small {
	font-family: 					Arial, sans-serif;
}


/*************************************************************/
/******************[   Document - Loading   ]*****************/
/*************************************************************/
.document-loading {
    position: 						fixed;
    top: 							0;
    left: 							0;
    width: 							100vw;
    height: 						100vh;
    z-index: 						9999;
	gap:							8px;

    display: 						none;
	flex-direction: 				column;
    justify-content: 				center;
    align-items: 					center;
    text-align: 					center;

    background-color: 				rgba(var(--color-black-rgb), 0.6);
}

.document-loading .title {
    font-size: 						24px;
    font-weight: 					600;
	letter-spacing:					0.2px;

	text-shadow: 					2px 2px 4px rgba(var(--color-black-rgb), 0.4);
    color: 							rgba(var(--color-white-rgb), 1);
}

.document-loading .description {
    font-size: 						14px;
    font-weight: 					400;
	letter-spacing:					0.2px;

	text-shadow: 					2px 2px 4px rgba(var(--color-black-rgb), 0.4);
    color: 							rgba(var(--color-white-rgb), 1);
}

.document-loading .spinner {
    width: 							30px;
    height: 						30px;
    border: 						4px solid rgba(var(--color-white-rgb), 0.3);
    border-top-color: 				rgba(var(--color-white-rgb), 1);
    border-radius: 					50%;
    animation: 						spin 1s linear infinite;
}

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


/*************************************************************/
/*******************[   Document - Print   ]******************/
/*************************************************************/
@media print {
	html, body {
		margin: 					0 !important;
		padding: 					0 !important;
		overflow: 					visible !important;
	}

	.document-container,
	.document-papers {
		display: 					block !important;
		padding: 					0 !important;
		margin: 					0 !important;
		overflow: 					visible !important;
	}

	.document-papers {
		zoom:						1 !important;
	}

	.document-paper {
		display: 					block !important;
		margin: 					0 auto !important;
		box-shadow: 				none !important;
		border-radius: 				0 !important;
		overflow: 					hidden !important;

		page-break-after: 			auto !important;
		page-break-inside: 			avoid !important;
		break-after: 				page !important;
	}

	.document-paper.document-paper-a4-portrait {
		width: 						210mm !important;
		height: 					297mm !important;
	}

	.document-paper.document-paper-a4-landscape {
		transform: 					rotate(0deg) !important;
		width: 						297mm !important;
		height: 					210mm !important;
	}

	.document-paper.document-paper-a4-landscape:last-child {
		page-break-after: 			avoid !important;
	}

	.document-paper-inside {
		box-sizing: 				border-box !important;
	}

	.document-options {
		display:					none !important;
	}

	.document-buttons {
		display:					none !important;
	}
	
	.document-loading {
		display:					none !important;
	}

	.document-link {
		text-decoration: 			unset !important;
		color:						#212529 !important;
	}
}


/*************************************************************/
/******************[   Document - Options   ]*****************/
/*************************************************************/
.document-options {
	position:						fixed;
	display:						flex;

	width:							100%;
	height:							60px;
	min-height:						60px;

	top:							0;
	left:							0;
	z-index: 						1;

	-webkit-box-shadow: 			0 1px 3px rgba(0, 0, 0, 0.08);
	-moz-box-shadow: 				0 1px 3px rgba(0, 0, 0, 0.08);
	box-shadow: 					0 1px 3px rgba(0, 0, 0, 0.08);

	border-bottom:					1px solid #DADADA;
	background-color: 				#F8F8F8;
}

.document-options > .document-actions {
	display:						flex;
	overflow: 						auto hidden;
	width: 							100%;
	scrollbar-width: 				thin;            
	scrollbar-color: 				#888 #f1f1f1;
}

.document-options > .document-actions::-webkit-scrollbar {
	width: 							8px;
	height:		 					8px; 
}

.document-options > .document-actions::-webkit-scrollbar-track {
	background: 					#f1f1f1;
	border-radius: 					4px;
}

.document-options > .document-actions::-webkit-scrollbar-thumb {
	background: 					#888;
	border-radius: 					4px;
}

.document-options > .document-actions:-webkit-scrollbar-thumb:hover {
	background: 					#555;
}

.document-options > .document-actions > .document-action {
	display:						flex;
	align-items:					center;
	justify-content:				center;
	border: 						unset;
	outline:						unset;
	background-color:				transparent;

	border-top-width:				3px;
	border-top-style:				solid;
	border-top-color:				transparent;

	border-bottom-width:			3px;
	border-bottom-style:			solid;
	border-bottom-color:			transparent;

	gap:							8px;

	background-color: 				#F8F8F8;
}

.document-options > .document-actions > .document-action.document-action-disabled {
	opacity:						.4;
	cursor:							not-allowed;
}

@media (min-width: 576px) {
	.document-options > .document-actions > .document-action.document-zoom-minus {
		margin-left:				auto;
	}
}

.document-options > .document-actions > .document-action.document-zoom-minus {
	border-left:					1px solid #DADADA;
}

.document-options > .document-actions > .document-action.document-zoom-reset {
	flex-direction:					column;
	gap:							0px;
	border-left:					1px solid #DADADA;
}

.document-options > .document-actions > .document-action.document-zoom-plus {
	border-left:					1px solid #DADADA;
}

.document-options > .document-actions > .document-action.document-check {
	border-left:					1px solid #DADADA;
}

.document-options > .document-actions > .document-action.document-download-empty {
	border-left:					1px solid #DADADA;
}

.document-options > .document-actions > .document-action.document-download {
	border-left:					1px solid #DADADA;
}

.document-options > .document-actions > .document-action.document-print {
	border-left:					1px solid #DADADA;
}

.document-options > .document-actions > .document-action > .icon {
	object-fit:						scale-down;
	flex-shrink:					0;
}

.document-options > .document-actions > .document-action > .title {
	font-size:						14px;
	line-height:					20px;
	white-space:					nowrap;
	color:							rgba(var(--color-primary-text-rgb), 1);
}

@media (min-width: 576px) {
	.document-options > .document-actions > .document-action {
		padding:					8px 16px;
	}

	.document-options > .document-actions > .document-action.document-back {
		border-right:				1px solid #DADADA;
	}
}

@media (max-width: 575px) {
	.document-options > .document-actions > .document-action.document-back > .title,
	.document-options > .document-actions > .document-action.document-check > .title,
	.document-options > .document-actions > .document-action.document-download-empty > .title,
	.document-options > .document-actions > .document-action.document-download > .title,
	.document-options > .document-actions > .document-action.document-print > .title {
		display:					none;
	}

	.document-options > .document-actions > .document-action:not(.document-zoom-reset) {
		width:						50px;
		flex-shrink:				0;
	}

	.document-options > .document-actions > .document-action {
		padding:					8px;
	}

	.document-options > .document-actions > .document-action.document-back {
		border-left:				1px solid #DADADA;
	}

	.document-options > .document-actions > .document-action.document-print {
		border-right:				1px solid #DADADA;
	}
	
	.document-options > .document-actions > .document-action:first-child {
		margin-left:				auto;
	}
	
	.document-options > .document-actions > .document-action:last-child {
		margin-right:				auto;
	}
}


.document-options > .document-actions > .document-action > .zoom {
	font-size:						13px;
	line-height:					20px;
	font-weight:					600;
	white-space:					nowrap;
	color:							rgba(var(--color-secondary-text-rgb), 1);
}

@media (hover: hover) {
	.document-options > .document-actions > .document-action:not(.document-action-disabled):hover {
		background-color: 			#ebebeb;
		border-bottom-color:		#c8c8c8;
	}
}

@media (hover: none) {
	.document-options > .document-actions > .document-action:not(.document-action-disabled):active {
		background-color: 			#ebebeb;
		border-bottom-color:		#c8c8c8;
	}
}


/*************************************************************/
/******************[   Document - Content   ]*****************/
/*************************************************************/
.document-title {
	font-size:						16pt;
	font-weight:					700;
	margin-bottom: 					16px;
	text-align:						center;
}

.document-number {
	position:						absolute;
	display: 						flex;
	justify-content: 				center;
	align-items: 					center;
	pointer-events:					none;
	top:							0.50cm;
	right:							0.50cm;
	width:							30px;
	height:							30px;
	border-radius:					50px;

	border: 						1px solid #212529;
}

.document-number > span {
	font-size:						16px;
	font-weight:					700;
	text-align:						center;
}

.document-items {
	margin-bottom:					0px;
	padding-left: 					12px;
}

.document-text-times-new-roman {
	font-family: 					"Times New Roman", Times, serif !important;
}

.document-text-normal {
	font-weight:					400;
}

.document-text-bold {
	font-weight:					700;
}

.document-text-left {
	text-align:						left;
}

.document-text-center {
	text-align:						center;
}

.document-text-justify {
	text-align:						justify;
}

.document-text-italic {
	font-style:						italic;
}

.document-text-underline {
	text-decoration: 				underline;
}

.document-text-indent {
	display:						block;
	text-indent:					16px;
}

.document-text-size-9pt {
	font-size:						9pt;
	line-height:					17px;
}

.document-text-size-10pt {
	font-size:						10pt;
	line-height:					18.2px;
	min-height:						18.2px;
}

.document-text-size-11pt {
	font-size:						11pt;
	line-height:					18.2px;
	min-height:						18.2px;
}

.document-text-size-12pt {
	font-size:						12pt;
	line-height:					18.2px;
	min-height:						18.2px;
}

.document-text-size-13pt {
	font-size:						13pt;
	line-height:					20.0px;
	min-height:						20.0px;
}

.document-text-size-14pt {
	font-size:						14pt;
	line-height:					24.0px;
	min-height:						24.0px;
}

.document-text-size-15pt {
	font-size:						15pt;
	line-height:					26.0px;
	min-height:						26.0px;
}

.document-text-bottom-0px {
	margin-bottom:					0px;
}

.document-text-bottom-4px {
	margin-bottom:					4px;
}

.document-text-bottom-8px {
	margin-bottom:					8px;
}

.document-text-bottom-12px {
	margin-bottom:					12px;
}

.document-text-bottom-16px {
	margin-bottom:					16px;
}

.document-text-bottom-20px {
	margin-bottom:					20px;
}

.document-text-bottom-24px {
	margin-bottom:					24px;
}

.document-text-bottom-28px {
	margin-bottom:					28px;
}

.document-text-bottom-32px {
	margin-bottom:					32px;
}

.document-text-label {
	white-space:					nowrap;
	min-width:						120px;
}

.document-text-nowrap {
	white-space:					nowrap; 
	overflow: 						hidden;
}

.document-input {
	outline:						none;
	border:							none;
	box-sizing: 					border-box;
	white-space: 					nowrap;
	vertical-align: 				baseline;

	line-height:					18.2px;
	min-width: 						30px;
	max-width:						100%;
	font-size:						10pt;
	padding: 						0px;
	margin:							0px;
	width:							300px;
	color:							#212529;
	background-color:				#FFF2CC;
}

.document-input:read-only {
	background-color:				transparent;
	user-select: 					text;
}

.document-input.document-input-margin-left {
	margin-left:					4px;
}

.document-input:not(:read-only):focus {
	box-shadow: 					unset !important;
	border: 						unset !important;
	outline: 						1px solid #e5d9b7 !important;
}

.document-input:read-only:focus {
	box-shadow: 					unset !important;
	border: 						unset !important;
	outline: 						unset !important;
	caret-color: 					transparent !important;
}

.document-image-center {
	display: 						block;
	margin-left: 					auto;
	margin-right: 					auto;
	object-fit: 					scale-down;
}

.document-table {
	display: 						flex;
	flex-direction: 				column;
	gap: 							4px;
	max-width: 						100%;
	margin-bottom:					16px;
}

.document-row {
	display: 						flex;
	align-items:					center;
}

.document-link {
	text-decoration: 				underline;
	text-underline-offset:			3px;
}

.document-link-fw {
	display:						block;
	width: 							fit-content;
	margin-left: 					auto;
	margin-right: 					auto;
}

@media (hover: hover) {
	.document-link:hover {
		background-color:			rgba(13, 110, 253, .08);
	}
}

@media (hover: none) {
	.document-link:active {
		background-color:			rgba(13, 110, 253, .08);
	}
}

.document-text-pink {
	text-shadow: 					0 0 1px rgba(0, 0, 0, 0.1);
	color:							#C14B72; 
}

.document-text-orange {
	text-shadow: 					0 0 1px rgba(0, 0, 0, 0.1);
	color:							#D35400; 
}

.document-text-blue {
	text-shadow: 					0 0 1px rgba(0, 0, 0, 0.1);
	color:							#3399CC; 
}

.document-text-red {
	text-shadow: 					0 0 1px rgba(0, 0, 0, 0.1);
	color:							#CC3333; 
}

.document-text-light-green {
	text-shadow: 					0 0 1px rgba(0, 0, 0, 0.1);
	color:							#66B366; 
}

.document-text-dark-green {
	text-shadow: 					0 0 1px rgba(0, 0, 0, 0.1);
	color:							#2E7D32; 
}

.document-text-space-6 {
	--bs-gutter-x: 					2.00cm; 
}


/*************************************************************/
/*****************[   Document - Directory   ]****************/
/*************************************************************/
.document-directory {
	position:						relative;
	display:						flex;
	flex-direction:					column;
	width:							100%;
	gap:							24px;
}

.document-directory .document-directory-title {
	font-size:						18px;
	font-weight:					700;
	margin-bottom:					8px;

	color:							rgba(var(--color-primary-text-rgb), 1);
}

.document-directory .document-directory-section {
	position:						relative;
	display:						flex;
	flex-direction:					column;
	width:							100%;
}

.document-list {
	display: 						grid;
	grid-template-columns: 			repeat(auto-fit, minmax(200px, 1fr));
}

@media (min-width: 992px) {
	.document-list {
		gap: 						16px;
	}
}

@media (max-width: 991px) {
	.document-list {
		gap: 						8px;
	}
}

.document-list > .document-card {
	display:						flex;
	flex-direction:					column;
	justify-content: 				center;
	align-items:					center;
	text-decoration:				unset;
	min-width: 						200px;
	padding:						16px;

	-webkit-transition: 			all .2s;
	-moz-transition: 				all .2s;
	-ms-transition: 				all .2s;
	-o-transition: 					all .2s;
	transition: 					all .2s;

	outline: 						1px solid #ddd;
	outline-offset:					-1px;

	border-top:						3px solid transparent;
	border-bottom:					3px solid transparent;
	background-color: 				rgba(var(--color-white-rgb), 1);
}

.document-list > .document-card.document-card-hidden {
	visibility: 					hidden;
	pointer-events: 				none;
	user-select: 					none;
	border: 						none;
	height: 						0;
	padding: 						0;
	margin: 						0;
}

.document-list > .document-card > .icon {
	display:						block;
	object-fit:						scale-down;
	width:							40px;
	height:							40px;
	margin-bottom:					8px;
}

.document-list > .document-card > .title {
	text-align:						center;
	font-weight:					600;
	font-size:						15px;
	margin-bottom:					4px;

	color:							rgba(var(--color-primary-text-rgb), 1);
}

.document-list > .document-card > .description {
	display: 						-webkit-box;
	font-size:						14px;
	line-height:					22px;
	max-height:						44px;
	text-align:						center;
	font-weight:					400;

	-webkit-box-orient: 			vertical;
	-webkit-line-clamp: 			2;
	word-wrap:						anywhere;
	overflow: 						hidden;
	text-overflow: 					ellipsis;
	word-break: 					break-word;
	white-space: 					normal;

	color:							rgba(var(--color-secondary-text-rgb), 1);
}

@media (hover: hover) {
	.document-list > .document-card:hover {
		background-color: 			rgba(var(--color-green-rgb), .16);
		border-bottom-color: 		rgba(var(--color-green-rgb), .8);
	}
}

@media (hover: none) {
	.document-list > .document-card:hover {
		background-color: 			rgba(var(--color-green-rgb), .16);
		border-bottom-color: 		rgba(var(--color-green-rgb), .8);
	}
}