:root{
	--md-sys-color-primary: rgb(144 74 67);
	--md-sys-color-surface-tint: rgb(144 74 67);
	--md-sys-color-on-primary: rgb(255 255 255);
	--md-sys-color-primary-container: rgb(255 218 214);
	--md-sys-color-on-primary-container: rgb(59 9 7);
	--md-sys-color-secondary: rgb(119 86 82);
	--md-sys-color-on-secondary: rgb(255 255 255);
	--md-sys-color-secondary-container: rgb(255 218 214);
	--md-sys-color-on-secondary-container: rgb(44 21 19);
	--md-sys-color-tertiary: rgb(113 91 46);
	--md-sys-color-on-tertiary: rgb(255 255 255);
	--md-sys-color-tertiary-container: rgb(253 223 166);
	--md-sys-color-on-tertiary-container: rgb(38 25 0);
	--md-sys-color-error: rgb(186 26 26);
	--md-sys-color-on-error: rgb(255 255 255);
	--md-sys-color-error-container: rgb(255 218 214);
	--md-sys-color-on-error-container: rgb(65 0 2);
	--md-sys-color-background: rgb(255 248 247);
	--md-sys-color-on-background: rgb(35 25 24);
	--md-sys-color-surface: rgb(255 248 247);
	--md-sys-color-on-surface: rgb(35 25 24);
	--md-sys-color-surface-variant: rgb(245 221 218);
	--md-sys-color-on-surface-variant: rgb(83 67 65);
	--md-sys-color-outline: rgb(133 115 113);
	--md-sys-color-outline-variant: rgb(216 194 191);
	--md-sys-color-shadow: rgb(0 0 0);
	--md-sys-color-scrim: rgb(0 0 0);
	--md-sys-color-inverse-surface: rgb(57 46 45);
	--md-sys-color-inverse-on-surface: rgb(255 237 234);
	--md-sys-color-inverse-primary: rgb(255 180 171);
	--md-sys-color-primary-fixed: rgb(255 218 214);
	--md-sys-color-on-primary-fixed: rgb(59 9 7);
	--md-sys-color-primary-fixed-dim: rgb(255 180 171);
	--md-sys-color-on-primary-fixed-variant: rgb(115 51 45);
	--md-sys-color-secondary-fixed: rgb(255 218 214);
	--md-sys-color-on-secondary-fixed: rgb(44 21 19);
	--md-sys-color-secondary-fixed-dim: rgb(231 189 184);
	--md-sys-color-on-secondary-fixed-variant: rgb(93 63 60);
	--md-sys-color-tertiary-fixed: rgb(253 223 166);
	--md-sys-color-on-tertiary-fixed: rgb(38 25 0);
	--md-sys-color-tertiary-fixed-dim: rgb(224 195 140);
	--md-sys-color-on-tertiary-fixed-variant: rgb(88 68 25);
	--md-sys-color-surface-dim: rgb(232 214 212);
	--md-sys-color-surface-bright: rgb(255 248 247);
	--md-sys-color-surface-container-lowest: rgb(255 255 255);
	--md-sys-color-surface-container-low: rgb(255 240 238);
	--md-sys-color-surface-container: rgb(252 234 231);
	--md-sys-color-surface-container-high: rgb(246 228 226);
	--md-sys-color-surface-container-highest: rgb(241 222 220);
}

html, body, div, span, ol, ul, li, table, tbody, tfoot, thead, tr, th, td {
	background: transparent;
	border: 0;
	margin: 0;
	padding: 0;
	vertical-align: baseline;
}
/* workaround for Chrome stupid forced styling on auto-fill */
input:-webkit-autofill {
	-webkit-box-shadow:0 0 0 50px #514F4B inset;
	-webkit-text-fill-color: white;
}

/*********** General Styles Used by all pages *************/

body { margin: 0; padding: 0; background: #FFF; font-family: Roboto, Arial, Helvetica, sans-serif; font-size: 12px; color: #666; width:100%; height: 100%;}
body.errorpage { background-color: #666; }

a { color: #069; text-decoration: none; outline: none; }
a:focus, a:hover { text-decoration: none; }
a[data-click],a[data-method] {cursor:pointer;}
button,input,select,textarea { font-size: 12px; font-family: Roboto, Arial, Helvetica, sans-serif; outline: none; margin: 0;}
small, .small { font-family: Roboto, Arial, Helvetica, sans-serif; font-size: 11px; }

h1 { font-size: 28px; }
h2 { font-size: 24px; }
h3 { font-size: 20px; }
h4 { font-size: 16px; }
h5 { font-size: 13px; }
h1,h2,h3 { font-family: Roboto, Arial, Helvetica, sans-serif; letter-spacing: 0.5px; font-weight: normal; color: #333; }
:focus-visible {outline: none;}
dialog::backdrop {
	background-color: rgba(0,0,0,.5);
	backdrop-filter: blur(2px);
}
dialog {
	border: none;
	border-radius: 1em;
}
dialog .dialog-header{
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-right: 10px;
    margin-left: 50px;
    font-size: 2.8em;
}
dialog .dialog-header::after {
	font-family: 'Material Symbols Outlined';
    font-weight: normal;
    font-style: normal;
    font-size: 35px;
    line-height: 1.4;
    letter-spacing: normal;
    text-transform: none;
    display: inline-block;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
    content: "cancel";
    color: var(--pp-container-secondary);
}
dialog.alert-dialog,
dialog.confirmation-dialog {
	font-size: 1.2em;
}
dialog.alert-dialog header,
dialog.confirmation-dialog header {
	border: 1px solid silver;
    padding: 3px 5px;
    margin: 0 0 5px 0;
    background-color: silver;
}
dialog.alert-dialog .dialog-message,
dialog.confirmation-dialog .dialog-message {
	margin: 15px;
}
dialog.alert-dialog footer,
dialog.confirmation-dialog footer {
	border-top: 1px solid silver;
	margin: 5px 0 0 0;
    padding: 5px;
    display: flex;
    justify-content: end;
    grid-gap: 5px;
}
dialog.alert-dialog footer .ok-button::before,
dialog.confirmation-dialog footer .ok-button::before {
	content: "OK";
}
dialog.confirmation-dialog footer .cancel-button::before {
	content: "CANCEL";
}
.percentage::after {
	content: "%";
}
.show-loading {
    opacity: .5;
}
.show-loading::after {
    content: " ";
    font-size: 25vh;
    font-weight: bold;
    position: absolute;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: center center url(loader.gif) no-repeat;
}

#fwViewSpace {
	position: relative;
	display: flex;
	min-height:0;
}
.fw-view {
	display: none;
	flex-grow: 1;
}
.fw-view.fw-view__drawers.fw-view__drawer-left {
	grid-template-columns: max-content auto;
}
.fw-view.fw-active-view {
	display: grid;
}
.fw-view__main-container {
	padding: 16px;
}
.fw-view__drawer-container-left {
	position: relative;
	overflow: hidden;
	transition: all .5s ease;
	padding: 16px 16px 16px 0;
	width: 280px;
	color: white;
}
.fw-view__drawer-container-left.fw-view__drawer-closed {
	width: 16px!important;
	padding-right: 0 !important;
}
.fw-view__drawer-container-left .fw-view__drawer-container-inner {
	position: absolute;
	right: 16px;
	min-width: min-content;
	height: calc(100% - 32px);
	box-sizing: border-box;
	padding: 16px;
}
.fw-view__drawer-container-left::after {
	position: absolute;
	height: 100%;
	right: 0;
	top: 0;
	padding-right: 2px;
	font-size: 24px;
	content: "||";
	cursor: grab;
	display: flex;
	align-items: center;
}

.fw-calendar-strip {
	display: grid;
    grid-template-columns: 24px auto 24px;
    grid-column-gap: 4px;
    align-items: center;
}
.fw-calendar-strip__week-control {
	width: 24px;
	display:inline-block;
}
.fw-calendar-strip__week-control::after {
	font-family: 'Material Symbols Outlined';
    font-weight: normal;
    font-style: normal;
    font-size: 24px;
    line-height: 1;
    letter-spacing: normal;
    text-transform: none;
    display: inline-block;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;	
}
.fw-calendar-strip__week-control.fw-calendar-strip__week-previous::after {
	content: "arrow_circle_left";
}
.fw-calendar-strip__week-control.fw-calendar-strip__week-next::after {
	content: "arrow_circle_right";
}
.fw-calendar-strip__strip {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(70px, 1fr));
	font-size: 1em;
	border: 1px solid silver;
	border-radius: 10px;
    overflow: hidden;
    position: relative;
}
.fw-calendar-strip__strip .fw-calendar-strip__tile {
	text-align:center;
	min-width: 70px;
	border-right: 1px solid silver;
}
.fw-calendar-strip__strip .fw-calendar-strip__tile:first-child {
    overflow: hidden;
    border-top-left-radius: 10px;
}
.fw-calendar-strip__strip .fw-calendar-strip__tile:last-child {
    overflow: hidden;
    border-top-right-radius: 10px;
    border-right: none;
}
.fw-calendar-strip__strip .fw-calendar-strip__tile .fw-calendar-strip__tile-header {
	min-height: 1em;
	line-height:1;
	background-color: silver;
	padding: 0 10px;
}
.fw-calendar-strip__strip .fw-calendar-strip__tile.fw-calendar-strip__today .fw-calendar-strip__tile-header::before{
	content: "TODAY";
	color: white;
    font-size: .8em;
}
.fw-calendar-strip__strip .fw-calendar-strip__tile .fw-calendar-strip__tile-body {
	min-height: .8em;
	padding: 2px 10px;
}
.fw-calendar-strip__strip .fw-calendar-strip__tile.fw-calendar-strip__selected .fw-calendar-strip__tile-body {
	font-weight: bold;
	border: 1px solid;
}

.fw-booking-sheet {
    display: grid;
    grid-template-columns: 100px auto 100px;
    position: relative;
}
.fw-booking-sheet .fw-booking-sheet__columns {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    border-top: 1px solid silver;	
    position: relative;
    z-index: 0;
}
.fw-booking-sheet .fw-booking-sheet__column {
	display: grid;
	grid-template-rows: 50px 100px repeat(auto-fit, minmax(15px, 1fr));
	border-right: 1px solid silver;
}
.fw-booking-sheet .fw-booking-sheet__column .fw-booking-sheet__column-header {
	display: flex;
	align-items: center;
	justify-content: center;
	border-bottom: 1px solid silver;
	font-size: 2em;
}
.fw-booking-sheet .fw-booking-sheet__column .fw-booking-sheet__column-all-day {
	border-bottom: 1px solid silver;
}
.fw-booking-sheet .fw-booking-sheet__column.fw-booking-sheet__left-times .fw-booking-sheet__column-time {
	text-align:right;
}
.fw-booking-sheet .fw-booking-sheet__column.fw-booking-sheet__right-times {
	border-right: none;
}
.fw-booking-sheet .fw-booking-sheet__column.fw-booking-sheet__left-times .fw-booking-sheet__column-header,
.fw-booking-sheet .fw-booking-sheet__column.fw-booking-sheet__right-times .fw-booking-sheet__column-header,
.fw-booking-sheet .fw-booking-sheet__column.fw-booking-sheet__left-times .fw-booking-sheet__column-all-day,
.fw-booking-sheet .fw-booking-sheet__column.fw-booking-sheet__right-times .fw-booking-sheet__column-all-day,
.fw-booking-sheet .fw-booking-sheet__column.fw-booking-sheet__left-times .fw-booking-sheet__column-time,
.fw-booking-sheet .fw-booking-sheet__column.fw-booking-sheet__right-times .fw-booking-sheet__column-time,
.fw-booking-sheet .fw-booking-sheet__column .fw-booking-sheet__column-time:last-child {
	border-bottom: none!important;
}
.fw-booking-sheet .fw-booking-sheet__column.fw-booking-sheet__left-times .fw-booking-sheet__column-time:nth-child(odd):after,
.fw-booking-sheet .fw-booking-sheet__column.fw-booking-sheet__right-times .fw-booking-sheet__column-time:nth-child(odd):after {
	padding: 0 5px;
	content: '' attr(data-formatted-time);
	position: relative;
	top: -0.5em;
}
.fw-booking-sheet .fw-booking-sheet__column .fw-booking-sheet__column-time {
	border-bottom: 1px solid silver;
}
.fw-booking-sheet .fw-booking-sheet__column .fw-booking-sheet__column-time:nth-child(odd){
	border-bottom: 1px dashed silver;
}
.fw-booking-sheet .fw-booking-sheet__column .fw-booking-sheet__column-time.selected {
	background-color: grey;
}
.fw-booking-sheet .fw-booking-sheet__columns .fw-booking-sheet__sheet {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	display: grid;
	z-index: 0;
	opacity: 1;
}
.fw-booking-sheet.booking .fw-booking-sheet__columns .fw-booking-sheet__sheet {
	z-index: -1;
	opacity: .4;
}
.fw-booking-sheet .fw-booking-sheet__columns .fw-booking-sheet__sheet .fw-booking-sheet__card {
	background: yellow;
	max-width: 100px;
	border: 1px solid silver;
	padding: .3em;
	border-radius: .5em;
	box-sizing: border-box;
}
.fw-booking-sheet .fw-booking-sheet__controls {
	position: absolute;
	display: none;
	padding: 8px;
    border: 1px solid silver;
    border-radius: 1em;
    background: white;
    text-align: center;
    line-height: 1.2;
    z-index: 1;
}
.fw-booking-sheet .fw-booking-sheet__controls.active {
	display: block;
}
.fw-booking-sheet .fw-booking-sheet__controls .fw-booking-sheet__controls-buttons button {
	display: inline-block;
    background: silver;
    padding: 2px 8px;
    border-radius: 1em;
    color: black;
    text-transform: uppercase;
    margin-left: 2px;
}
.fw-booking-sheet .fw-booking-sheet__controls .fw-booking-sheet__controls-buttons button:first-child{
	margin-left: 0;
}