/* CSS Document */
.radFormContainer {
    background-color: var(--overlay);
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0px;
    z-index: 9;/*/////////////////// not necessary? /////////////////////////*/
    display: flex;
    justify-content: center;
    align-items: center;
	--transparent: transparent;
    --error_red: crimson;
    --error_red_light: pink;
    --primary_border: lightgray;
    --primary_background: white;
    --primary_text: black;
    --secondary_background: #dddddd;
    --secondary_text: #aeaeae;
    --tertiary_background: #f7f7f7;
    --tertiary_text: #5f5f5f;
    --overlay: #adadad8f;
    --shadow: #403c4329;
    --invert: none;
    --ss_primary: #008cc1;
    --ss_secondary: white;
}
.radFormContainer.center {
    display: flex;
    justify-content: center;
    align-items: center;
}
.radForm {
    position: absolute;
    box-sizing: border-box;
    top: 0px;
    width: 475px;
    height: initial;
    padding: 8px 15px;
    background-color: var(--primary_background);
    box-shadow: 2px 2px 3px 2px var(--shadow);
    display: flex;
    flex-direction: column;
    border-radius: 0px 0px 4px 4px;
    min-width: 275px;
    min-height: min-content;
	max-height: 100%;
	max-width: 85%;
}
.radModal {
    position: relative;
    height: 475px;
    padding: 15px;
    border-radius: 4px;
    max-height: 445px;
}
.radFormHeader {
    flex: 0;
    display: flex;
    justify-content: space-between;
    flex-direction: column;
    align-items: flex-start;
}
.radFormHeaderCorner {
    display: flex;
    position: absolute;
    right: 6px;
    top: 5px;
    color: var(--secondary_text);
    background-color: var(--transparent);
}
.radFormHeaderCorner>* {
    color: var(--secondary_text);
}
.radModalHeader {
    flex: 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 0px;
}
.radModalHeader .radFormButtons {
    padding-top: 0;
}
.radFormTitle, .radFormTitle * {
    display: flex;
    font-family: SSRegular, system-ui;
    font-size: 1.5em;
}
.radFormCloseButton {
    width: 13px;
    height: 13px;
    vertical-align: middle;
    top: 6px;
    right: 6px;
    margin-left: 3px;
    margin-top: 1px;
    cursor: pointer;
}
*:not(.radFormHeaderCorner)>.radFormTimer {
    position: absolute;
    right: 6px;
    top: 6px;
    color: var(--secondary_text);
}
*:not(.radModal)>.radFormDescription {
    padding: 0px 0px 8px 0px;
    white-space: pre-wrap;
	overflow-wrap: break-word;
}
.radFormFields, .radModal .radFormDescription {
    background-color: var(--primary_background);
    width: 100%;
    height: 100%;
    border: var(--primary_border) 1px solid;
    border-radius: 5px;
    padding: 8px;
    box-sizing: border-box;
    overflow-y: visible;
    flex: 1;
}
.radModal .radFormDescription {
    overflow-y: auto;
}
.radFormInputLine:not(:first-of-type) {
    margin-top: 5px;
}
.radFormInputLine {
    display: flex;
	position: relative;
    align-items: center;
}
.radFormInputLabel {
    margin-right: 5px;
}
.radFormInput:not([type="checkbox"]), select.radFormInput {
    flex-grow: 1;
	border-radius: 3px;
    border-color: var(--primary_border);
    border-width: 2px;
}
.radFormInput:not([type="checkbox"]) {
    padding-left: 3px;
    padding-top: 3px;
}
*:not(.radModalHeader)>.radFormButtons {
    flex: 0;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    padding-top: 8px;
    column-gap: 7px;
}
.radRequiredError {
    border-color: var(--error_red) !important;
}
.radPasswordHider {
    display: flex;
    position: absolute;
    right: 6px;
    top: calc(50% + 1px);
    transform: translateY(-50%);
    background-color: var(--transparent);
}
.radFormsResizer {
	position: absolute;
	bottom: 0;
	right: 0;
	cursor: nwse-resize;
	height: 10px;
	width: 10px;
    opacity: 0%;
}