/****************************************************************/
/*                     Global settings                          */
/****************************************************************/
:root, [data-bs-theme="light"] {
	/* CI colors */
	--color-black: #000;
	--color-gray-900: #424242;
	--color-gray-800: #555;
	--color-gray-700: #686868;
	--color-gray-600: #808080;
	--color-gray-500: #9d9d9d;
	--color-gray-400: #c4c4c4;
	--color-gray-300: #d9d9d9;
	--color-gray-200: #e6e6e6;
	--color-gray-100: #f0eff0;
	--color-white: #fff;

	/* Customizable variables */
	--color-primary: var(--custom-color-primary, #1457a1);
	--color-primary-contrast: var(--custom-color-primary-contrast, #0e3f74);
	--color-secondary: var(--custom-color-secondary, #1b7db1);
	--color-secondary-contrast: var(--custom-color-secondary-contrast, #145d84);

	--background-source: var(--custom-background-source, url("/images/background.jpg"));

	--logo-source: var(--custom-logo-source, url("/images/cryptshare-logo-2023-blue.svg"));
	--logo-position-x: var(--custom-logo-position-x, 0%);
	--logo-width: var(--custom-logo-width, auto);
	--logo-height: var(--custom-logo-height, 100%);

	/* Bootstrap overrides */
	--bs-body-color: var(--color-gray-800);
	--bs-body-color-rgb: 85, 85, 85;

	--bs-border-radius: 0;
	--bs-border-radius-sm: 0;
	--bs-border-radius-md: 0;
	--bs-border-radius-lg: 0;
	--bs-border-radius-xl: 0;
	--bs-border-radius-xxl: 0;
	--bs-border-radius-2xl: 0;

}

/****************************************************************/
/*                      Base elements                           */
/****************************************************************/

html {
	background: var(--background-source) top center no-repeat;
	background-size: cover;
	min-height: 100%;
}

body {
	position: relative;
	padding-top: 50px;
	background: transparent;
}

.app-background {
	background-color: var(--color-white);
}

h1, h2 {
	font-size: 24px;
}

/****************************************************************/
/*      	               Layout		                        */
/****************************************************************/

.container {
	max-width: 650px;
}

.container.container--download {
	max-width: 1024px;
}

.container.container--notification-preview {
	max-width: 950px;
}

.header {
	height: 85px;
	padding: 1rem 1rem 0 1rem;
}

.header a {
	height: 100%;
	background: var(--logo-source) no-repeat;
	background-position-x: var(--logo-position-x);
	background-size: var(--logo-width) var(--logo-height);
}

#bcs-app {
	padding: 1rem;
}

.panel {
	background: var(--color-gray-100);
	padding: 1rem;
}

.panel p:last-child {
	margin-bottom: 0;
}

.bfcs_formElement {
	margin-bottom: 1rem;
}

.bfcs_formElement:last-child {
	margin-bottom: 0;
}

.nav-buttons {
	padding-top: 1rem;
	padding-bottom: 1rem;

	display: grid;
	grid-template-columns: max-content 1fr  max-content max-content;
	grid-template-areas:
    "back spacer misc next";
}

.nav-buttons .nav-buttons__back {
	grid-area: back;
}

.nav-buttons .nav-buttons__misc {
	grid-area: misc;
	text-align: right;
}

.nav-buttons .nav-buttons__next {
	text-align: right;
	grid-area: next;
}


footer {
	color: var(--color-black);
	padding: 4rem 0 1rem 0;
	background: var(--color-white) url("/images/cryptshare-logo-2023-black.svg") center 20px no-repeat;
	background-size: 100px;
}

footer p {
	font-size: 0.75em;
	margin-bottom: 0.5rem;
}

body.busy .navbar {
	background: var(--color-gray-900) url("/images/busy.gif") center 20px no-repeat;
	background-size: 60px;
}

a.skip-to-content {
	background: var(--color-white);
	border: 1px var(--color-gray-900) solid;
	padding: 4px 8px;
	position: fixed;
	top: -50vh;
	left: 50%;
	transform: translateX(-50%);
	z-index: 2;
}

a.skip-to-content:focus {
	top: 0;
}

/* Custom icon to be used just like font awesome icons */
.fa-custom-confidential-message {
	display: inline-block;
	background-size: 100%;
	background-repeat: no-repeat;
	background-image: url("/images/confidential_message_gray.svg");
	background-position: bottom;

	/* Emulate default font awesome icon size */
	height: 18px;
	width: 20px;
}

/* Custom icon to be used just like font awesome icons */
.fa-custom-step-forward {
	display: inline-block;
	background-size: 100%;
	filter: invert(1);
	background-repeat: no-repeat;
	background-image: url("/images/chevron-skip-right.svg");
	background-position: bottom;
	height: 16px;
	width: 13px;
	margin-left: 5px;
}

/****************************************************************/
/*                        Navigations                           */
/****************************************************************/

.navbar {
	background: var(--color-gray-900) url("/images/blank.gif") center 20px no-repeat;
	transition: all ease 0.2s;
	background-size: 60px;
	transition-delay: 0.7s;
}

.navbar .navbar-nav > li > .bfcs_navbarButton.languages::after {
	display: none;
}

.navbar .bfcs_navbarButton.navbar-toggler {
	border: none;
}

.navbar .bfcs_navbarButton.navbar-toggler.burger {
	display: inline-block;
}

.navbar .bfcs_navbarButton.dropdown-toggle.navbar-toggler.burger::after {
	display: none;
}

.navbar #navbar .navbar-nav > li > .dropdown-menu {
	margin-top: 0;
}

.form-control:focus {
	box-shadow: none;
}

.dropdown-toggle:focus, .navbar-toggler:focus, .form-control:focus {
	/* Re-apply default, as bootstrap removes the outline for these components */
	outline: revert !important;
}


/****************************************************************/
/*                           Alerts                             */
/****************************************************************/

.alert {
	--bs-alert-border: 0;
}

.alert-with-icon {
	align-items: center;
	justify-content: space-between;
}

.alert-with-icon h1 {
	font-size: 18px;
	background-color: inherit;
	padding-top: 0;
	text-align: center;
}

.alert-with-icon .fas {
	width: 100%;
	margin-top: 20px;
	text-align: center;
}

.alert ul li:only-child {
	list-style-type: none;
	margin-left: -2rem;
}

.alert img {
	max-width: 60px;
	margin-right: 15px;
}

.panel .alert p {
	margin: 0 0 10px;
}

.alert.summary .fas,
.alert.summary .far,
.alert.summary .fab {
	font-size: 70px;
	margin-right: 15px;
}


.alert .unformatted-hint {
	overflow-wrap: break-word;
	word-wrap: break-word;
	overflow-y: auto;
	max-height: 190px;
}

.alert .unformatted-hint ul li:only-child {
	list-style-type: initial;
	margin-left: 0;
}


/****************************************************************/
/*                         Home                           */
/****************************************************************/

.col-provide {
	padding-right: calc(var(--bs-gutter-x) * .25);
}

.col-retrieve {
	padding-left: calc(var(--bs-gutter-x) * .25);
}

/****************************************************************/
/*                  New Multiitems                   */
/****************************************************************/

.recipient-flex-row {
	justify-content: flex-end;
	position: relative;
	top: 18px;
	z-index: 10;
	gap: 5px;
}

.bfcs_new-multi-item-container {
	margin-bottom: 1rem;
	position: relative;
}

.bfcs_new-multi-item {
	padding: 4px;
	display: flex;
	flex-wrap: wrap;
	flex-direction: row;
	justify-content: start;
	background-color: var(--bs-body-bg);
	border: var(--bs-border-width) solid var(--bs-border-color);
	cursor: text;
	overflow-x: auto;
	max-height: 250px;
}

.bfcs_new-multi-item.focus {
	border-color: #b5e8ff;
}

.bfcs_new-multi-item .bfcs_new-multi-item-input {
	margin: 4px;
	position: relative;
	display: flex;
}

.bfcs_new-multi-item .bfcs_new-multi-item-input span {
	white-space: nowrap;
}

.bfcs_new-multi-item .bfcs_new-multi-item-input input {
	padding: 5px 5px 5px 5px;
	resize: none;
	margin: 0;
	border: 0;
	background: transparent;
	width: 100%;
	box-sizing: content-box;
	color: inherit;
}

.bfcs_new-multi-item .bfcs_new-multi-item-input input:disabled {
	/* Reset opacity changes in safari on mobile */
	opacity: 1;
}

.bfcs_new-multi-item .bfcs_new-multi-item-input button {
	background: transparent;
	padding: 0 5px 0 5px;
	border: 0;
	z-index: 2;
	margin-left: 2px;
}

.bfcs_new-multi-item .bfcs_new-multi-item-input button:disabled {
	display: none;
}

.bfcs_new-multi-item .bfcs_new-multi-item-input .ghost-input {
	visibility: hidden;
	position: absolute;
	left: -100vw;
	top: -100vh;
}

.bfcs_new-multi-item .bfcs_new-multi-item-input button:disabled ~ input {
	padding-left: 7px;
}

.bfcs_new-multi-item .bfcs_new-multi-item-input.focus {
	background-color: transparent;
}

.bfcs_new-multi-item .bfcs_new-multi-item-input.empty.readonly,
.bfcs_new-multi-item .bfcs_new-multi-item-input.readonly button,
.bfcs_new-multi-item .bfcs_new-multi-item-input.empty button {
	display: none !important;
}

.bfcs_new-multi-item .bfcs_new-multi-item-input:not(.empty),
.bfcs_new-multi-item .bfcs_new-multi-item-input:not(.empty) button {
	background-color: #f2dede;
	color: #a94442;
}

.bfcs_new-multi-item .bfcs_new-multi-item-input.valid,
.bfcs_new-multi-item .bfcs_new-multi-item-input.readonly,
.bfcs_new-multi-item .bfcs_new-multi-item-input.valid button,
.bfcs_new-multi-item .bfcs_new-multi-item-input.readonly button {
	background-color: var(--color-secondary);
	color: var(--color-white);
}

.bfcs_new-multi-item .bfcs_new-multi-item-input.valid.focus,
.bfcs_new-multi-item .bfcs_new-multi-item-input.valid.focus button {
	color: #3c763d;
	background-color: #dff0d8;
}

.bfcs_new-multi-item .bfcs_new-multi-item-input.focus:not(.valid),
.bfcs_new-multi-item .bfcs_new-multi-item-input.focus:not(.valid) button {
	color: var(--color-gray-800);
	background-color: var(--color-white);
}

.bfcs_proposal-list {
	position: absolute;
	cursor: pointer;
	width: 100%;
	background-color: var(--color-white);
	border: 1px solid var(--color-gray-600);
	border-top: 0;
	margin: 0;
	left: 0;
	top: 100%;
	z-index: 3;
	list-style: none;
	padding: 0;
	overflow-y: auto;
	max-height: 386px;
}

.bfcs_proposal-list-ul {
	margin-bottom: 0;
	padding-left: 0;
}

.bfcs_proposal-list .bfcs_proposal-list-item {
	display: flex;
	justify-content: space-between;
	border-top: 1px solid var(--color-gray-600);
	position: relative;
}

.bfcs_proposal-list .bfcs_proposal-list-item button {
	border: 0;
	background-color: transparent;
	padding: 7px;
	/* Force color inheritance in safari on mobile */
	color: inherit;
}

.bfcs_proposal-list .bfcs_proposal-list-item button:first-child {
	width: 100%;
	text-align: left;
}

.bfcs_proposal-list .bfcs_proposal-list-item.selected button:first-child,
.bfcs_proposal-list .bfcs_proposal-list-item.active button:first-child {
	border-left: 7px solid var(--color-gray-400);
	outline-style: auto;
}

.bfcs_proposal-list .bfcs_proposal-list-item.selected button:first-child {
	border-left-color: var(--color-primary);
}

.bfcs_proposal-list .bfcs_proposal-list-item.selected.active button:first-child {
	border-left-color: var(--color-secondary);
}

.bfcs_proposal-list .bfcs_proposal-list-item button.fa-times {
	position: absolute;
	top: 0;
	right: 0;
	padding: 10px;
}

.bfcs_proposal-list .bfcs_proposal-list-item span.fas,
.bfcs_proposal-list .bfcs_proposal-list-item span.far,
.bfcs_proposal-list .bfcs_proposal-list-item span.fab {
	margin-right: 0.5rem;
}

.bfcs_proposal-list-item button:focus,
.bfcs_proposal-list-item button:hover {
	color: var(--color-gray-700);
	background-color: var(--color-gray-200);
}

.bfcs_proposal-list-item button {
	transition: background-color ease 0.2s;
}

/****************************************************************/
/*                      Progress                          */
/****************************************************************/

.progress {
	min-height: 29px;

	--bs-progress-bg: var(--color-gray-900);
	--bs-progress-bar-bg: var(--color-secondary);
}

.progress .main {
	--bs-progress-bar-bg: var(--color-primary);
}

/* Special version of progress bar where label always covers the full width */
.progress--full-width-label__wrapper {
	position: relative;
	height: auto;
}

.progress--full-width-label__wrapper .progress-bar {
	position: absolute;
	top: 0;
	bottom: 0;
}

.progress--full-width-label {
	display: flex;
	flex-direction: column;
	justify-content: center;
	color: var(--bs-progress-bar-color);
	text-align: center;

	padding-left: 0.25rem;
	padding-right: 0.25rem;

	width: 100%;
	z-index: 10;
}

/****************************************************************/
/*                       Upload                           */
/****************************************************************/

.image-label-container {
	display: flex;
	justify-content: center;
	align-items: center;
}

.image-label-image {
	height: 80px;
}

.image-label-image-container {
	background: var(--color-white);
	padding: 25px;
	border-radius: 50%;
	display: block;
	border: solid 1px var(--color-gray-300);
}

.image-label-description-container {
	padding-left: 20px;
}

.custom-txt {
	padding: 0.75rem 1rem;
	background-color: var(--color-white);
}

.form-control.readOnlyEditor {
	height: auto;
}

.form-control.form-control--bold {
	font-weight: 700;
}

.form-control[readonly] {
	color: var(--color-gray-700);
}

.html5_input_section input.wicket-mfu-field {
	opacity: 0;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	cursor: pointer;
}

.html5_drop_zone {
	position: relative;
	border: 2px dashed var(--color-gray-400);
	margin-bottom: 0;
	padding: 15px;
	background: var(--color-white);
	margin-top: 5px;
}

.html5_drop_zone .alert-danger,
.html5_drop_zone .alert-warning {
	margin-top: 20px;
	text-align: left;
}

.html5_drop_zone img {
	max-width: 410px;
	margin: auto;
}

.html5_drop_zone:hover, .html5_drop_zone:focus-within {
	border: 2px dashed var(--color-gray-700);
}

.html5_drop_zone:focus-within .btn-primary {
	background-color: var(--color-primary-contrast);
}

.wicket-mfu-container {
	margin-top: 15px;
}

.wicket-mfu-container:empty {
	display: none;
}

.wicket-mfu-container,
.bsUploadFiles {
	max-height: 200px;
	overflow-y: auto;
}

.wysiwyg-editor{
	background: var(--color-white);
}

.bsUploadFiles .progress {
	margin-bottom: 0.5rem;
}

.btn-addfiles {
	margin-top: 5px;
}

.hint-addfiles {
	margin-top: 10px;
}

.hint-icon {
	text-align: center;
	font-size: 1.25em;
	padding-left: 15px;
	line-height: 1;
}

.hint a {
	color: inherit;
	text-decoration: underline;
}

.hint-further-information {
	margin-top: 10px;
}

.hint-content {
	width: 100%;
}

.hint-content ol,
.hint-content ul {
	padding-left: 20px;
}

.hint-content h1 {
	color: inherit;
	font-size: 1.3em;
	text-transform: none;
}

.btn-icon.btn-revoke {
	flex-direction: row-reverse;
}

.recipient-id-provider-details-input {
	border: 1px solid var(--color-gray-400);
	border-top: 0;
}

.recipient-id-provider-details-input .securityHint {
	justify-content: flex-end;
	padding: 10px;
	margin: 0;
}

.recipient-id-provider-details-input .securityHint .image-label-image-container {
	border: solid 1.5px var(--color-gray-300);
	padding: 8px;
	margin-left: 10px;
}

.recipient-id-provider-details-input .securityHint .identifiedByIdProviderHintIcon {
	height: 25px;
	margin-right: 0;
}

.recipient-id-provider-details-input .recipient-input-list-container {
	padding: 0 10px 10px 10px;
}

.btn-download-confidential-message {
	float: right !important;
}

.transfer-content-panel {
	background: var(--color-gray-100);
	color: var(--color-gray-900);
}

.transfer-content-panel .fa-custom-confidential-message {
	height: 25px;
	width: 27px;
	background-position: inherit;
	margin-left: 3px;
}

ul.bfcs_fileList {
	padding-left: 0;
	margin-bottom: 0;
}

ul.bfcs_fileList .bfcs_fileListEntry {
	margin-bottom: 0.5rem;
	background-color: white;
}

ul.bfcs_fileList .bfcs_fileListEntry:last-child {
	margin-bottom: 0;
}

ul.bfcs_fileList .bfcs_fileListEntry .bfcs_removeFileListEntryButton {
	flex-grow: 0;
}

/****************************************************************/
/*                       Password                         */
/****************************************************************/

.bfcs_passwordPanel .progress-bar {
	width: 100%;
}

/* Bootstrap 3's defaults do not have proper contrast */

.bfcs_passwordPanel .progress-bar-very-good {
	background-color: #198754;
}

.bfcs_passwordPanel .progress-bar-good {
	background-color: #94c11f;
	color: var(--color-black);
}

.bfcs_passwordPanel .progress-bar-sufficient {
	background-color: #ffc107;
	color: var(--color-black);
}

.bfcs_passwordPanel .progress-bar-warning {
	background-color: #fd7e14;
	color: var(--color-black);
}

.bfcs_passwordPanel .progress-bar-danger {
	background-color: #dc3545;
}

.bfcs_passwordPanel .bfcs_Feedback {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	gap: 3px;
	padding-top: 5px;
}

.bfcs_passwordPanel .img {
	min-width: 24%;
	background: var(--color-white);
	height: 32px;
	overflow: hidden;
	border: 1px solid var(--color-gray-300);
}

.bfcs_passwordPanel .too_short,
.bfcs_passwordPanel .too_long,
.bfcs_passwordPanel .illegalchars {
	padding: 6px 10px;
	text-align: center;
	font-size: 13px;
	font-weight: 700;
}

.bfcs_passwordPanel .img.specialchar {
	background: var(--color-white) url("/images/password_specialchar.svg") center center/45px no-repeat;
}

.bfcs_passwordPanel .img.numericchar {
	background: var(--color-white) url("/images/password_numericchar.svg") center center/45px no-repeat;
}

.bfcs_passwordPanel .img.whitespacechar {
	background: var(--color-white) url("/images/password_whitespacechar.svg") center center/45px no-repeat;
}

.bfcs_passwordPanel .img.uppercase {
	background: var(--color-white) url("/images/password_uppercase.svg") center center/45px no-repeat;
}

.bfcs_passwordPanel .img.lowercase {
	background: var(--color-white) url("/images/password_lowercase.svg") center center/45px no-repeat;
}

.bfcs_passwordPanel .img.too_long {
	background: var(--color-white) url("/images/password_blankchar.svg") center center/45px no-repeat;
}

.bfcs_passwordPanel .img.sequence {
	background: var(--color-white) url("/images/password_sequence.svg") center center/45px no-repeat;
}

.bfcs_passwordPanel .img.dictionary {
	background: var(--color-white) url("/images/password_dictionary.svg") center center/45px no-repeat;
}

.bfcs_passwordPanel .img.notequal {
	background: var(--color-white) url("/images/password_notequal.svg") center center/45px no-repeat;
}

.bfcs_passwordPanel .progress {
	margin-bottom: 0;
}

.quickTextIcon {
	background: transparent url("/images/QUICK-text_bright.svg") center center/contain no-repeat;
}

.quickTextBanner {
	height: 18px;
	background-position-x: 0;
	margin-bottom: 8px;
}

.securityHint {
	display: flex;
	justify-content: center;
	align-items: center;
	margin: 15px 0;
}

.securedByQuickHintIcon {
	height: 15px;
	margin-left: 6px;
}

.identifiedByIdProviderHintIcon {
	height: 30px;
	margin-right: 8px;
}

.security-mode .quickTextIcon {
	background-position-x: 0;
	height: 15px;
	margin: 4px 0;
}

.bfcs_generatedPasswordInput > input {
	text-overflow: ellipsis;
}

.generate-password-icon-btn {
	display: flex;
	justify-content: center;
	align-items: center;
	height: 34px;
	width: 44px;
}

.generate-password-icon-btn > .fa-check {
	color: #8cc50d;
}

/****************************************************************/
/*                    Content-Viewer                      */
/****************************************************************/

html.content-viewer {
	background: var(--color-black);
}

html.content-viewer .app-background {
	background: transparent;
}

html.content-viewer .footer, html.content-viewer .header, html.content-viewer .navbar, html.content-viewer .feedback-panel {
	display: none;
}

html.content-viewer .content-viewer > .bfcs_navigationSection {
	position: fixed;
	z-index: 1;
	background: rgba(0, 0, 0, 0.5);
	top: 0;
	width: 100%;
	padding: 1rem;
	height: 57px;
	color: var(--color-white);
}

html.content-viewer body.busy .bfcs_navigationSection {
	background: rgba(0, 0, 0, 0.5) url("/images/busy_contentviewer.gif") center 8px no-repeat;
	background-size: 30px;
}

html.content-viewer .bfcs_navigationSection .bfcs_navigationSection__btn {
	padding: 1rem;
	background: transparent;
	color: var(--color-gray-400);
	font-size: 1.5em;
	text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5);
	line-height: 1;
}

html.content-viewer .bfcs_navigationSection .bfcs_navigationSection__btn:hover {
	background: rgba(145, 145, 145, 0.5);
	color: var(--color-white);
}

html.content-viewer .bfcs_navigationSection .left {
	position: fixed;
	top: 48%;
	left: 0;
}

html.content-viewer .bfcs_navigationSection .right {
	top: 48%;
	text-align: right;
	position: fixed;
	right: 0;
}

html.content-viewer .bfcs_navigationSection span.secondLabel {
	display: none;
}

html.content-viewer .bfcs_modalHeader span.secondLabel {
	color: var(--color-gray-700);
	text-shadow: none;
	max-width: 90%;
	display: inline-block;
}

html.content-viewer .bfcs_modalHeader span.secondLabel:before {
	position: relative;
	margin-right: 10px;
	top: 1px;
	display: inline-block;
	font-family: "Font Awesome 5 Pro", sans-serif;
	content: "\f019";
	font-style: normal;
	font-weight: 900;
	line-height: 1;
}

html.content-viewer .bfcs_imageContainer img {
	margin: 0 auto;
	width: auto;
	max-width: 100%;
	display: inherit;
}

html.content-viewer .bfcs_textViewer img {
	max-width: 100%;
}

html.content-viewer .bfcs_emlViewer li.content input[disabled="disabled"] {
	display: none;
}

html.content-viewer,
html.content-viewer > body,
html.content-viewer .content-viewer,
html.content-viewer .content-viewer > div,
html.content-viewer .content-viewer > div > div:not(.bfcs_dualLabelButton),
html.content-viewer .content-viewer > div > div > div,
html.content-viewer .content-viewer div.bfcs_imageContainer {
	height: 100%;
}

html.content-viewer .content-viewer {
	top: 60px;
	left: 0;
	right: 0;
	height: calc(100vh - 60px);
}

html.content-viewer .bfcs_modalHeader {
	height: auto;
}

html.content-viewer .bfcs_textViewer,
html.content-viewer .bfcs_rtfViewer,
html.content-viewer .bfcs_emlViewer {
	margin: 10px auto 0;
	padding: 15px;
	height: auto !important;
	max-width: 980px;
	background: var(--color-white);
	word-break: break-all;
	overflow-y: scroll;
}

html.content-viewer .bfcs_imageContainer,
html.content-viewer .bfcs_audioContainer {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: row;
}

html.content-viewer .fas.viewError,
html.content-viewer .far.viewError,
html.content-viewer .fab.viewError {
	font-size: 270px;
}

html.content-viewer .bfcs_box .bfcs_textViewer {
	white-space: pre-wrap;
	overflow: hidden;
}

html.content-viewer .bfcs_imageContainer .spinner-container {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	text-align: center;
	color: var(--color-white);
}

/****************************************************************/
/*                       Mail Preview                         */
/****************************************************************/

.bfcs_mail h2 {
	background: none;
}

/****************************************************************/
/*                       Icon Accordion                         */
/****************************************************************/

.icon-accordion, .icon-accordion .panel {
	background-color: var(--color-gray-300);
}

.icon-accordion--alternate {
	background-color: var(--color-gray-300);
}

.icon-accordion__summary {
	display: flex;
	align-items: center;
	list-style: none;
	cursor: pointer;
	gap: 0.75rem;
	padding: 0.625rem 0.75rem;
}

.icon-accordion:not([disabled]) .icon-accordion__summary:hover {
	box-shadow: 0 0 3px 1px var(--color-gray-600);
}

.icon-accordion:not([disabled]) .icon-accordion__summary:focus {
	outline-style: auto;
}

.icon-accordion__summary__icon {
	background: var(--color-white);
	border-radius: 50%;
	border: solid 1px var(--color-gray-400);
	display: flex;
	justify-content: center;
	align-items: center;
	width: 52px;
	height: 52px;
	font-size: 25px;
	color: var(--color-gray-700);
}

.icon-accordion__summary__title {
	flex-grow: 2;
}

.icon-accordion__summary::after {
	font-family: "Font Awesome 5 Pro", sans-serif;
	font-weight: 900;
	content: "\f0d7";
	font-size: 28px;
	padding: 0 0.325rem;
}

.icon-accordion[open] .icon-accordion__summary::after {
	content: "\f0d8";
}

.icon-accordion[disabled] .icon-accordion__summary::after {
	/* No chevron icon */
	display: none;
}

.icon-accordion[disabled] .icon-accordion__summary {
	cursor: default;
}

.icon-accordion[disabled] .icon-accordion__content {
	display: none;
}

.icon-accordion__content .panel {
	padding: 0 15px 15px 15px;
}

.icon-accordion-list {
	list-style: none;
	margin: 0;
	padding: 0;
}

.icon-accordion-list .icon-accordion-list__sublist {
	padding-bottom: 1rem;
}

.icon-accordion-list .icon-accordion-list__sublist__item {
	padding: 0.625rem 0.75rem 0.625rem 75px;
}

.icon-accordion-list .icon-accordion-list__sublist__item:nth-child(2n+1) {
	background-color: var(--color-gray-100);
}

.icon-accordion-list .icon-accordion-list__sublist__item:nth-child(2n+2) {
	background-color: var(--color-gray-300);
}

.icon-accordion-list__item:nth-child(2n+2) .icon-accordion, .icon-accordion-list__item:nth-child(2n+2) .icon-accordion .panel {
	background-color: var(--color-gray-100);
}

.icon-accordion-list__item:nth-child(2n+2) .icon-accordion-list__sublist__item:nth-child(2n+1) {
	background-color: var(--color-gray-300);
}

.icon-accordion-list__item:nth-child(2n+2) .icon-accordion-list__sublist__item:nth-child(2n+2) {
	background-color: var(--color-gray-100);
}

/* Light version with smaller icon and transparent background */

.alert-warning .icon-accordion--light {
	border-bottom: 1px solid #f7e1b5;
}

.icon-accordion--light:last-child {
	border-bottom: none;
}

.icon-accordion--light .icon-accordion__summary__icon {
	/* No circle around the icon */
	background-color: transparent;
	border: none;
	height: auto;
	width: 30px;
	color: inherit;
}

.icon-accordion--light .icon-accordion {
	/* No grey background */
	background-color: transparent;
}

.icon-accordion--light .icon-accordion__summary {
	line-height: 1;
}

.icon-accordion--light .icon-accordion__summary__icon .fas {
	/* Reset font size and margin */
	font-size: 20px;
	margin: 0;
	width: 20px;
}

.icon-accordion--light .icon-accordion__content {
	padding: 0 0.75rem 0.625rem 45px;
}

/****************************************************************/
/*                       Download                         */
/****************************************************************/
.row.transfer-info {
	padding: 10px 0 10px 50px;
	overflow-wrap: break-word;
	word-wrap: break-word;
}

.row.transfer-info:nth-child(even) {
	background-color: var(--color-gray-400);
}

.row.transfer-info span.fas,
.row.transfer-info span.far,
.row.transfer-info span.fab {
	font-size: 1.5em;
}

.row.transfer-info span.fa-custom-confidential-message {
	width: 26px;
	height: 21px;
}

.bfcs_preProcessingErrorDetails {
	word-wrap: break-word;
}

.row.quick {
	margin-top: 10px;
}

.row.quick img {
	width: 18px;
	vertical-align: text-bottom;
}

.btn-addnotification span,
.btn-addfiles span {
	font-size: 23px;
}

.btn-group-reply .btn-border {
	display: flex;
	flex-direction: column;
	align-items: center;
	min-width: 140px;
}

.btn-group-reply .btn-border:not(:last-child) {
	margin-right: 0.5rem;
}

.btn-group-reply .btn-border .fas {
	margin: 0.2rem 0;
}

.download-header-row {
	display: flex;
	justify-content: space-between;
	padding-bottom: 0.5rem;
}

.download-header-col-primary {
	flex-grow: 1;
}

.download-header-col-secondary {
	padding-left: 0.5rem;
	flex-shrink: 0;
}

.fa-user-check.download-section-header__icon {
	line-height: inherit;
}

.download-header-col-secondary.download-header-col-secondary-sm .download-header {
	flex-direction: column;
}

.download-header {
	padding: 5px 10px;
}

.download-header .row {
	margin-right: -10px;
}

.download-header .subject {
	font-size: 1.15em;
	display: inline-block;
	word-break: break-all;
}

.personal-identity-box {
	background-color: var(--color-white);
	padding: 1rem;
	color: var(--color-gray-700);
}

.personal-identity-box.personal-identity-box-eid {
	padding: 6px;
}

.personal-identity-box .personal-identity-box__primary-data {
	font-size: 1.15em;
	font-weight: bold;
}

.personal-identity-box .personal-identity-box__secondary-data {
	font-size: 0.8em;
}

.personal-identity-box:not(:last-child) {
	margin-bottom: 0.75rem;
}

.personal-identity-box__grid_container {
	display: grid;
	grid-template-columns: 1.5fr 1fr;
	grid-template-rows: 1fr .75fr;
	grid-template-areas:
    "A B"
    "C B";
}

.personal-identity-box__grid_container .personal-identity-box__primary-data {
	grid-area: A;
}

.personal-identity-box__grid_container .securityHint {
	grid-area: B;
	margin: 0;
	display: flex;
	justify-content: space-between;
}

.personal-identity-box__grid_container .securityHint .identifiedByIdProviderHintIcon {
	height: 20px;
	margin: 0;
}

.personal-identity-box__grid_container .securityHint > div {
	display: flex;
}

.personal-identity-box__grid_container .securityHint > div > span {
	padding: 7px 5px;
}

.personal-identity-box__grid_container .personal-identity-box__secondary-data {
	grid-area: C;
}

.personal-identity-box__grid_container .image-label-image-container {
	padding: 5px;
	border-radius: 50%;
	color: var(--color-gray-700);
	background-color: var(--color-white);
	border: 1px solid var(--color-gray-400);
	font-weight: bold;
	max-height: 35px;
}

.download-section-header__icon.fa-custom-confidential-message {
	margin-bottom: 10px;
}

.download-icon {
	width: 27px;
}

.btn-download--primary,
.btn-download--secondary {
	--bs-btn-padding-x: 1rem;
	--bs-btn-padding-y: 0.25rem;

	display: flex;
	align-items: center;
	/* Force same height for single and double line buttons */
	min-height: 55px;
}

.btn-download--secondary .fas,
.btn-download--primary .fas {
	font-size: 1.65em;
}

.btn-download--primary .fas {
	margin-right: 1.5rem;
}

.btn-download--primary .fa-custom-confidential-message {
	background-position: top;
	width: 38px;
	height: 32px;
}

.btn-download--secondary .fas {
	padding-left: 1.25rem;
}

.download-element {
	display: flex;
	align-items: stretch;
	justify-content: space-between;
}

.download-element + .download-element {
	margin-top: 0;
}

.download-element .btn-download--primary,
.download-element .btn-download--secondary {
	margin-bottom: 1px;
	flex-basis: content;
	flex-shrink: 1;
	flex-grow: 1;
	text-align: start;
}

.download-element .btn-download--primary {
	overflow-x: hidden;
}

.download-element .btn-download--secondary {
	flex-grow: 0;
}

.download-element--main .btn-download--secondary,
.download-element--main .btn-download--primary {
	min-height: 75px;
}

.download-element__meta {
	display: flex;
	flex-direction: column;
	text-align: left;
}

.download-element--main .download-element__meta {
	font-size: 1.1em;
}

.download-element--main .btn-download--primary .fas {
	font-size: 2.25em;
}

.download-element__meta .fa {
	margin-right: 0;
	mix-blend-mode: difference;
}

.download-element__meta .warning {
	filter: sepia(1) contrast(1);
	mix-blend-mode: difference;
	text-shadow: 0 0 1px #f29100;
}

.download-element--main__dropdown-link .fas {
	padding-left: 0;
	position: relative;
	top: 1px;
	font-size: 3.25em;
	transition: transform 0.2s;
	transform: rotate(180deg);
}

.download-element--main__dropdown-link.collapsed .fas {
	transform: rotate(0deg);
}

.download-element--main__dropdown-link-secondary-button.btn-download--primary {
	min-height: 25px;
	font-size: 0.75em;
	justify-content: center;
}

.download-element__options-button:not(.collapsed) {
	display: none;
}

.confidential-message-body {
	border: 1px solid var(--color-gray-400);
	background: var(--color-white);
	min-height: 200px;
	max-height: 600px;
	overflow: auto;
	padding: 10px 15px;
	margin-bottom: 15px;
}

.expand-button {
	border: none;
	background: none;
	margin-top: 0.5rem;
	display: flex;
	flex-direction: column;
	align-items: center;
}

.expand-button:hover, .expand-button:focus {
	text-decoration: none;
}

.expand-button .fas {
	transition: transform 0.2s;
	transform: rotate(0deg);
}

.expand-button:not(.collapsed) .fas {
	transform: rotate(180deg);
}

.download-details-button.expand-button:not(.collapsed) .download-details-button-text {
	display: none;
}

.download-details-element {
	margin-bottom: 0.5rem;
}

.download-details-element-secondary-text .security-mode .quickTextIcon {
	background-position-x: 100%;
}

/* We adjust the auto sizing of the collapse elements as we dont want them to completely disappear when "collapsed"*/
.download-recipients.download-recipients-collapsed .collapse,
.download-recipients.download-recipients-collapsed .collapsing {
	display: block;
	height: 3.2em; /* ~(line-height * 2) */
	overflow-y: hidden;
}

.download-recipients.download-recipients-collapsed .collapse.show {
	height: auto;
}

/* When only a few recipients are present, disable the collapse function and show the full content */
.download-recipients:not(.download-recipients-collapsed) .collapse {
	display: block;
}

.download-recipients:not(.download-recipients-collapsed) .expand-button {
	display: none;
}

.download-section-header {
	font-size: 1.15em;
	margin-bottom: 3px;
	display: flex;
	word-break: break-all;
	flex-wrap: wrap-reverse;
}

.download-section-header-sender {
	gap: 10px;
}

.download-section-header-col-secondary, .download-section-header-col-primary {
	padding-bottom: 5px;
}

.download-section-header-col-primary {
	margin-right: 5px;
	min-width: 120px;
}

.download-section-header__icon {
	margin-right: 3px;
}

.download-section-header__title {
	font-weight: bold;

}

/****************************************************************/
/*                       Summary                          */
/****************************************************************/

.list-group-item-info.list-group-item-heading,
.list-group-item-footer {
	border-left: none;
	border-right: none;
}

.list-group-item-info.list-group-item-heading,
.list-group-item-footer a {
	font-size: 0.8em;
	font-weight: bold;
}

.list-group-item-info.list-group-item-heading {
	padding: 0 12px;
	color: var(--color-gray-700);
	background-color: var(--color-gray-200);
}

.list-group-item:first-child {
	border-top-right-radius: 0;
	border-top-left-radius: 0;
}

.list-group-item:last-child {
	border-bottom-right-radius: 0;
	border-bottom-left-radius: 0;
}

.long-strings {
	word-wrap: break-word;
}

/****************************************************************/
/*                       Buttons                          */
/****************************************************************/

.btn {
	--bs-btn-box-shadow: none;
	--bs-btn-focus-box-shadow: none;
	--bs-btn-border-width: 0;
}

.btn:hover, .btn:focus {
	/* use outline instead of BS shadow*/
	outline: revert !important;
}

.btn-icon {
	display: flex inline;
	flex-direction: row;
	align-items: center;
	gap: 0.5rem;
}

.btn-provide,
.btn-retrieve {
	width: 100%;
	position: relative;
	padding-top: 140px;
	padding-bottom: 40px;
	background-repeat: no-repeat;

	transition-property: all !important;
}

.btn-provide:after,
.btn-retrieve:after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	background-repeat: no-repeat;
}

.btn-provide {
	background-position: center 40px;
	background-image: url("/images/provide_arrow.svg");
}

.btn-provide:hover,
.btn-provide:focus,
.btn-provide:active {
	background-position: center 35px;
}

.btn-provide:after {
	background-position: center 40px;
	background-image: url("/images/provide_ring.svg");
}

.btn-retrieve {
	background-position: center 45px;
	background-image: url("/images/retrieve_arrow.svg");
}

.btn-retrieve:hover,
.btn-retrieve:focus,
.btn-retrieve:active {
	background-position: center 50px;
}

.btn-retrieve:after {
	background-position: center 20px;
	background-image: url("/images/retrieve_ring.svg");
}

.btn-sender,
.btn-uploadfile {
	text-align: left;
}

/**
 * not actually a button (used as a panel), so we remove styling suggesting interactivity.
 */
.btn-uploadfile[disabled],
.btn-uploadfile[disabled]:focus,
.btn-uploadfile[disabled]:hover,
.btn-uploadfile[disabled]:active {
	opacity: 1;
	cursor: initial;
	background-color: var(--color-white);
	color: var(--color-gray-900);
}

.bfcs_removeFileListEntryButton {
	background-color: var(--color-white);
}

.btn-sm .fa-chevron-up,
.btn-lg .fa-chevron-up {
	display: none;
}

.btn-lg.collapsed .fa-chevron-up {
	display: none;
}

.btn-default {
	color: var(--color-gray-700);
	transition: background-color ease 0.2s;
}

.btn-default:hover,
.btn-default:active,
.btn-default:focus {
	color: var(--color-gray-900);
	background-color: var(--color-gray-100);
}

.btn-default.active.focus,
.btn-default.active:focus,
.btn-default.active:hover,
.btn-default:active.focus,
.btn-default:active:focus,
.btn-default:active:hover {
	color: var(--color-gray-700);
}


.btn .fa-custom-confidential-message {
	background-image: url("/images/confidential_message_white.svg");
}


.btn-primary {
	--bs-btn-bg: var(--color-primary);
	--bs-btn-border-color: var(--color-primary);
	--bs-btn-hover-bg: var(--color-primary-contrast);
	--bs-btn-hover-border-color: var(--color-primary-contrast);
	--bs-btn-active-bg: var(--color-primary-contrast);
	--bs-btn-active-border-color: var(--color-primary-contrast);
	--bs-btn-disabled-bg: var(--color-primary);
	--bs-btn-disabled-border-color: var(--color-primary);

	transition: background-color ease 0.2s;
}

.btn-secondary {
	--bs-btn-bg: var(--color-secondary);
	--bs-btn-border-color: var(--color-secondary);
	--bs-btn-hover-bg: var(--color-secondary-contrast);
	--bs-btn-hover-border-color: var(--color-secondary-contrast);
	--bs-btn-active-bg: var(--color-secondary-contrast);
	--bs-btn-active-border-color: var(--color-secondary-contrast);
	--bs-btn-disabled-bg: var(--color-secondary);
	--bs-btn-disabled-border-color: var(--color-secondary);

	transition: background-color ease 0.2s;
}


/****************************************************************/
/*                      ToggleButton                     */
/****************************************************************/

.btn.btn-border, .btn.btn-toggle {
	color: var(--color-gray-700);
	background-color: var(--color-white);
	border: 1px solid var(--color-gray-400);
	font-weight: bold;
	transition: background-color ease 0.2s;
}

.btn-toggle.enabled {
	color: var(--color-white);
	background-color: var(--color-secondary);
}

.btn-toggle:not(:disabled):hover, .btn-toggle:focus,
.btn-border:hover, .btn-border:focus {
	color: var(--color-gray-700);
	background-color: var(--color-gray-300);
}

.btn-toggle.enabled:not(:disabled):hover, .btn-toggle.enabled:focus {
	color: var(--color-white);
	background-color: var(--color-secondary-contrast);
}

/****************************************************************/
/*                  Icon Radio Buttons                    */
/****************************************************************/

.button-radio-group .btn-icon {
	width: 100%;
	display: flex;
	padding: 0.35rem 0.25rem;
	flex-direction: row;
	align-items: center;
}

.button-radio-group .togglebutton {
	margin: 0;
}

.button-radio-group .btn-icon.btn-toggle.enabled {
	background-color: var(--color-primary);
	border-color: var(--color-primary);
}

.button-radio-group .btn-icon.btn-toggle.enabled:not(:disabled):hover,
.button-radio-group .btn-icon.btn-toggle.enabled:focus {
	background-color: var(--color-primary-contrast);
	border-color: var(--color-primary-contrast);
}

.button-radio-group .btn-toggle.enabled.btn-icon .btn-icon__icon {
	filter: invert(100%);
}

.button-radio-group .btn-icon__icon {
	margin-right: 0.25rem;
	margin-left: 0.25rem;
	max-width: 24px;
	filter: contrast(12.5%);
}

.button-radio-group .btn-icon__text {
	padding: 0 0.35rem;
	display: flex;
	flex-direction: column;
	text-align: left;
	white-space: nowrap;
	overflow: hidden;
}

.button-radio-group .btn-icon__title {
	font-size: 0.925em;
	font-weight: 700;
}

.button-radio-group .btn-icon__description {
	font-size: 0.85em;
	font-weight: normal;

	overflow: hidden;
}

.button-radio-group {
	display: grid;
	gap: 0.675rem;
	grid-template-columns: repeat(auto-fill, minmax(calc(50% - 0.675rem), 1fr));
}


/****************************************************************/
/*                   Input DropDown                       */
/****************************************************************/

.input-dropdown {
	padding: 0;
	display: flex;
}


button .fa-caret-down {
	font-size: 18px;
}

.input-dropdown .dropdown-selected, .input-dropdown li {
	overflow-x: hidden;
}

.input-dropdown .dropdown-menu {
	margin-top: 0;
	padding-left: 0;
	width: calc(100% - 42px); /* width - caret width */
}

.input-dropdown .dropdown-toggle::after {
	display: none;
}

.input-dropdown .dropdown-header {
	background: var(--color-gray-100);
	padding: 0.125rem 0.75rem;
	margin-bottom: 0.5rem;
}

.input-dropdown .dropdown-item.active, .input-dropdown .dropdown-item:active {
	background: transparent;
}

/****************************************************************/
/*                        Table                           */
/****************************************************************/

.table {
	background-color: var(--color-white);
}

/****************************************************************/
/*                     DetailList                         */
/****************************************************************/

.detail-list-responsive {
	max-height: 214px;
	margin-bottom: 1.5rem;
	overflow-y: auto;
}

.detail-list, .detail-list-legend, .detail-list-content {
	list-style: none;
	padding-left: 0;
	margin-bottom: 0;
}

.detail-list {
	background-color: var(--color-white);
	padding: 7px;
}

.detail-list-item {
	border: 2px solid var(--color-gray-100);
}

.detail-list-item:not(:last-child) {
	margin-bottom: 7px;
}

.detail-list-item-content {
	display: flex;
}

.detail-list-item-content.row {
	margin-left: 0;
	margin-right: 0;
	padding: 0;
}

.detail-list-item-header {
	padding: 0.75rem 7px;
	border-bottom: 2px solid var(--color-gray-100);
}

.detail-list-legend, .detail-list-content {
	padding: 7px;
}

.detail-list-legend li, .detail-list-content li {
	margin-bottom: 1px;
}

.detail-list-legend {
	padding-right: 10px;
}

/****************************************************************/
/*                   CS Feedback Panel                    */
/****************************************************************/

.feedback-panel > ul {
	max-height: 20vh;
	overflow-y: auto;
	margin-bottom: 0;
}

/****************************************************************/
/*                    Feedback Icon                       */
/****************************************************************/
.feedback-icon-container {
	width: 32px;
	margin-left: 8px;
	text-align: center;
}

.feedback-icon {
	font-size: 24px;
}

.feedback-icon.alert-danger, .feedback-icon.alert-warning, .feedback-icon.alert-info, .feedback-icon.alert-success {
	background-color: transparent;
}

.feedback-icon-lg-wrapper .feedback-icon-container {
	width: 40px;
}

.feedback-icon-lg-wrapper .feedback-icon {
	font-size: 36px;
}

/****************************************************************/
/*                Form Feedback Group                     */
/****************************************************************/
.form-feedback-group > div {
	margin-bottom: 1rem;
}

.form-feedback-group .alert p {
	margin-bottom: 0;
}

/****************************************************************/
/*                Form Input Large                     */
/****************************************************************/
.form-control-lg {
	text-align: center;
	font-size: 2em;
	height: 2em;
	font-weight: 500;
}

/****************************************************************/
/*                   Button List                       */
/****************************************************************/
.button-list {
	padding: 0.75rem 0;
	border: solid 1px var(--color-gray-300);
	background-color: var(--color-white);

	max-height: 350px;
	overflow-y: auto;
}

.button-list__item {
	position: relative;
}

/* Checkbox Hack */

.button-list__input {
	position: absolute;
	left: 0;
	opacity: 0.01;
	z-index: -1;
}

.button-list__label {
	padding: 0.75rem 0.5rem;
	background-color: var(--color-white);
	border: 0;
	width: 100%;
	text-align: left;
	color: var(--color-gray-700);
	display: flex;
	justify-content: space-between;
	cursor: pointer;
	margin-bottom: 0;
	font-weight: 400;
}

.button-list__item:nth-child(2n+1) .button-list__label {
	background-color: var(--color-gray-100);
}

.button-list__input:checked + .button-list__label {
	background-color: var(--color-primary);
	color: var(--color-white);
}

.button-list__input:focus + .button-list__label {
	outline-style: auto;
}

.button-list__label__title {
	padding-left: 0.5rem;
	overflow-x: hidden;
	text-overflow: ellipsis;
}

.button-list__label__icon {
	border: solid 1px var(--color-gray-300);
	background-color: var(--color-white);
	border-radius: 100%;
	display: flex;
	height: 22px;
	width: 22px;
	justify-content: center;
	align-items: center;
}

.button-list__label__icon > img {
	max-width: 100%;
	max-height: 100%;
	padding: 3px;
}

/****************************************************************/
/*  	             		    Utils               	        */
/****************************************************************/

.flex-gap-sm {
	gap: 0.25rem;
}

.hidden-fields {
	display: none;
}

.embeddedIframe {
	width: 100%;
	border: 0;
	height: 450px;
}

/*######################################################################################################################################*/

/*#                                                           MOBILE CSS (Bootstrap xs, sm)                                                            #*/

/*######################################################################################################################################*/

@media all and (max-width: 767px) {
	/****************************************************************/
	/*                     Global settings                          */
	/****************************************************************/
	body {
		padding: 0;
	}


	.container {
		padding-right: 0;
		padding-left: 0;
		max-width: 100%;
	}

	#bcs-app {
		padding-left: 0.5rem;
		padding-right: 0.5rem;
	}

	/****************************************************************/
	/*                        Navigations                           */
	/****************************************************************/
	.navbar .navbar-nav > li > .bfcs_navbarButton.languages {
		padding-left: 20px;
		padding-top: 2px;
		width: 100%;
		text-align: left;
	}

	.navbar #navbar > ul > li > ul.dropdown-menu > li {
		border-bottom: 1px solid var(--color-gray-800);
	}

	.navbar .bfcs_navbarButton.dropdown-toggle.navbar-toggler.burger {
		display: none;
	}

	.navbar .navbar-nav .dropdown-menu {
		position: static;
		float: none;
		width: auto;
		margin-top: 0;
		background-color: transparent;
		border: 0;
	}

	.navbar .dropdown-menu.startMenu {
		display: block;
	}

	.navbar .navbar-nav .dropdown-menu > li > a {
		color: var(--color-gray-300);
		line-height: 20px;
	}

	.navbar .navbar-nav .dropdown-menu > li > a:active,
	.navbar .navbar-nav .dropdown-menu > li > a:hover,
	.navbar .navbar-nav .dropdown-menu > li > a:focus {
		color: var(--color-white);
		background: var(--color-gray-700);
	}

	.navbar .bfcs_navbarButton.dropdown-toggle.languages span.caret {
		display: none;
	}

	.navbar .navbar-nav .dropdown-menu > li > a,
	.navbar .navbar-nav .dropdown-menu .dropdown-header {
		padding: 5px 15px 5px 25px;
	}

	.navbar #navbar .languages + .dropdown-menu > :first-child {
		border-bottom: 0;
	}

	/****************************************************************/
	/*                     Nav Buttons                        */
	/****************************************************************/
	/****************************************************************/
	/*                         Home                           */
	/****************************************************************/
	/* reset changes to padding from desktop view */
	.col-provide {
		padding-right: calc(var(--bs-gutter-x) * .5);
	}

	.col-retrieve {
		padding-left: calc(var(--bs-gutter-x) * .5);
	}

	.transfer-info__headline {
		font-weight: bold;
	}

	/****************************************************************/
	/*                        Forms                           */
	/****************************************************************/
	.bfcs_new-multi-item {
		max-height: none;
	}

	/****************************************************************/
	/*                        Upload                      */
	/****************************************************************/
	.wicket-mfu-container,
	.bsUploadFiles {
		max-height: inherit;
		overflow-y: inherit;
	}

	.btn-download-confidential-message {
		margin-top: 5px;
		float: none !important;
	}

	.btn-icon.btn-revoke {
		flex-direction: row;
	}

	/****************************************************************/
	/*                        Content-Viewer                      */
	/****************************************************************/
	html.content-viewer .bfcs_navigationSection .left,
	html.content-viewer .bfcs_navigationSection .right {
		top: 46%;
	}

	html.content-viewer .bfcs_textViewer,
	html.content-viewer .bfcs_rtfViewer,
	html.content-viewer .bfcs_emlViewer {
		overflow-y: scroll;
		margin-top: 10px;
		height: 100% !important;
		padding: 0 15px 15px 15px;
		border-top: 15px solid var(--color-white);
		width: auto;
		box-sizing: border-box;
	}

	html.content-viewer .bfcs_imageViewer {
		width: 100%;
		height: 100%;
	}

	html.content-viewer .content-viewer .bfcs_emlViewer {
		min-height: 100%;
		height: auto !important;
	}

	/****************************************************************/
	/*                       Download                         */
	/****************************************************************/
	.download-header {
		padding: 5px 0;
	}

	.download-header-row {
		flex-wrap: wrap;
		justify-content: flex-end;
	}

	.download-header-col-primary {
		padding-bottom: 5px;
	}

	.download-header-col-secondary, .download-header-col-primary {
		width: 100%;
		padding-left: 0;
	}

	.download-section-header-col-primary {
		min-width: 100%;
	}

	.download-section-header-col-secondary {
		padding-bottom: 10px;
	}

	.download-details-element-secondary-text .security-mode .quickTextIcon {
		background-position-x: 0;
	}

	.personal-identity-box__grid_container {
		display: grid;
		grid-template-columns: 1.5fr;
		grid-template-rows: 0.5fr 1fr 0.5fr;
		grid-template-areas:
    "A"
	"B"
    "C";
	}

	.btn-group-reply .btn-border {
		justify-content: space-between;
		padding-top: 10px;
		padding-bottom: 10px;
		width: 100%;
	}

	.btn-group-reply .btn-border > span {
		flex-basis: 50%;
	}

	/****************************************************************/
	/*                       Summary                          */
	/****************************************************************/
	.list-group-item {
		border: 1px solid var(--color-gray-100);
	}

	.list-group-item:first-child {
		border-left-color: var(--color-gray-100);
		border-right-color: var(--color-gray-100);
	}

	/****************************************************************/
	/*                       Buttons                          */
	/****************************************************************/
	.btn-retrieve {
		background-image: none;
		padding-top: 20px;
		padding-bottom: 20px;
		margin-top: 15px;
	}

	.btn-retrieve:after {
		background-image: none;
	}

	.nav-buttons {
		/* Switch to a simple flex layout on mobile rather than using the grid */
		display: flex;
		flex-direction: row-reverse;
	}

	.nav-buttons .nav-buttons__next {
		flex-grow: 1;
		justify-content: flex-end;
	}

	.nav-buttons .nav-buttons__back {
		position: absolute;
		top: 3px;
		left: 0;
		background: none;
	}

	.nav-buttons__back:hover, .nav-buttons__back:focus {
		background: none !important;
	}

	.btn-preview {
		display: none;
	}

	.button-radio-group {
		grid-template-columns: 1fr;
	}
}