@import url('./main-layout.css');

@import url('./views/login-view.css');

@import url('./views/autorizzazioni-view.css');

@import url('./views/rimborsi-view.css');

@import url('./views/richiesta-rimborso-view.css');

@import url('./views/gridwith-filters-view.css');

@import url('./views/chat-view.css');

@import url('./views/data-grid-view.css');

@import url('./views/comunicazioni-view.css');

@import url('./views/dati-anagrafici-view.css');

html {
	--lumo-shade-5pct: rgba(55, 55, 55, 0.05);
	--lumo-shade-10pct: rgba(55, 55, 55, 0.1);
	--lumo-shade-20pct: rgba(55, 55, 55, 0.2);
	--lumo-shade-30pct: rgba(55, 55, 55, 0.3);
	--lumo-shade-40pct: rgba(55, 55, 55, 0.4);
	--lumo-shade-50pct: rgba(55, 55, 55, 0.5);
	--lumo-shade-60pct: rgba(55, 55, 55, 0.6);
	--lumo-shade-70pct: rgba(55, 55, 55, 0.7);
	--lumo-shade-80pct: rgba(55, 55, 55, 0.8);
	--lumo-shade-90pct: rgba(55, 55, 55, 0.9);
	--lumo-primary-color-50pct: rgba(227, 6, 19, 0.5);
	--lumo-primary-color-10pct: rgba(227, 6, 19, 0.1);
	--lumo-shade: rgb(55, 55, 55);
	--lumo-primary-color: rgba(227, 6, 19, 0.83);
	--lumo-primary-text-color: rgb(227, 6, 19);
	--lumo-primary-text-color: rgba(227, 6, 19, 0.83);
	--lumo-base-color: rgb(255, 255, 255);
	--lumo-body-text-color: hsla(214, 21%, 26%, 0.94);
	--lumo-font-family: 'InterFace';
	--lumo-border-radius: 9px;
	--vaadin-app-layout-drawer-width: 20em;
}

@font-face {
	font-family: 'Aptos';
	src: url('./fonts/Aptos.ttf');
	font-weight: normal;
	font-display: swap;
	font-style: normal;
}

@font-face {
	font-family: 'Aptos';
	src: url('./fonts/Aptos-Bold.ttf');
	font-weight: bold;
	font-display: swap;
	font-style: normal;
}

@font-face {
	font-family: 'NeoSans';
	src: url('./fonts/NeoSans.otf');
	font-weight: normal;
	font-display: swap;
	font-style: normal;
}

@font-face {
	font-family: 'InterFace';
	src: url('./fonts/InterFace.ttf');
	font-weight: normal;
	font-display: swap;
	font-style: normal;
}

.mobile-listing-cell {
	border: 0px solid var(--lumo-shade-30pct);
	border-radius: 10px;
	background-color: #f5f8fd;
	font-size: 15px;
	box-shadow: rgba(14, 63, 126, 0.04) 0px 0px 0px 1px,
		rgba(42, 51, 69, 0.04) 0px 1px 1px -0.5px, rgba(42, 51, 70, 0.04) 0px
		3px 3px -1.5px, rgba(42, 51, 70, 0.04) 0px 6px 6px -3px,
		rgba(14, 63, 126, 0.04) 0px 12px 12px -6px, rgba(14, 63, 126, 0.04)
		0px 24px 24px -12px;
}

.bold {
	font-weight: bold;
}

.mobile-bold {
	font-weight: bold;
}

vaadin-text-field[readonly]::part(input-field) {
	background-color: rgb(242, 242, 242);
}

vaadin-text-area[readonly]::part(input-field) {
	background-color: rgb(242, 242, 242);
}

vaadin-date-picker[readonly]::part(input-field) {
	background-color: rgb(242, 242, 242);
}

vaadin-grid::part(font-weight-bold) {
	font-weight: bold;
}

vaadin-grid::part(long-text-wrap) {
	white-space: initial;
}

vaadin-tabsheet::part(content) {
	padding: 0px;
}

vaadin-dashboard-widget {
	--_widget-border-color: transparent;
}

vaadin-app-layout {
  --vaadin-app-layout-touch-optimized: false !important;
}

h1, h2, h3, h4, h5, h6 {
  font-family: "NeoSans";
}

.dialog .title {
	color: var(--lumo-primary-color);
	font-size: 20px;
	font-weight: bold;
}

.footer {
	font-family: var(--lumo-font-family);
	font-size: var(--lumo-font-size-m);
}

.header-title {
	font-size: 25px;
	font-family: var(--prakers-font-family);
	color: var(--lumo-secondary-text-color);
	font-weight: 500;
	width: 100%;
}

.sub-title {
	font-size: 18px;
	font-family: var(--prakers-font-family);
	font-weight: bold;
	color: var(--lumo-secondary-text-color);
	/*width: 100%;*/
}

.assisito-filter {
	padding-right: 30em;
}

.dataFattura-filter {
	padding-right: 18em;
}

.prestazione-dialog {
	padding-bottom: 4em;
}

.new-form {
	display: block;
	padding: 16px;
}

.info-wrapper {
	border-radius: 15px;
	/*background-color: #f5f8fd;*/
	box-shadow: var(--lumo-box-shadow-s);
}

.header-wrapper {
	background-color: var(--lumo-contrast-5pct);
	border-radius: var(--lumo-border-radius-m);
	color: var(--lumo-primary-color);
	font-size: 20px;
	font-weight: bold;
}

.flex-layout {
	display: flex;
	flex-wrap: wrap;
}

.text-grey-small {
	font-size: smaller;
	color: grey;
}

.mobile-button {
	font-size: 10px;
	font-weight: normal;
}

.mobile-label {
	font-size: medium;
}

.transparent-button {
	background: none;
}