/**
 * BFE Event Manager - eigenständige Kopie der BFE-relevanten Styles aus dem
 * Theme (pro-child/style.css), damit die Formulare und Listen-Shortcodes
 * dieses Plugins auch unabhängig vom Theme-Stylesheet korrekt aussehen.
 * Ausgangspunkt: Original-Regeln 1:1 übernommen (Selektoren nutzen dieselben
 * Klassennamen, die auch die portierten Templates in /php erzeugen), nur der
 * ACF-Formular-Block wurde zusätzlich für data-name="bfem" (statt "bfe")
 * dupliziert, da unsere Gruppe technisch einen eigenen Feldnamen hat.
 */

/* ---------- ACF-Formular: BFE-Termine-Gruppe (Backend + eigene Frontend-Seite) ---------- */

.acf-field[data-name="bfem"] {
	min-height: 520px;
	padding: 20px 30px !important;
}
.acf-field[data-name="bfem"] .acf-field-group .acf-fields.-border {
	padding: 0px !important;
}
.acf-field[data-name="bfem"] .acf-field-group .acf-input label {
	font-weight: normal !important;
}
/* Icon Akkordeon "Angebot bearbeiten" (Gegenstück zum Original-Icon "Icon BFE Termin") */
.acf-accordion[data-key="field_6a73643220797"] .acf-accordion-title label:before {
	content: '\f073';
}
.acf-field[data-name="anmeldungen_sus"] .acf-input,
.acf-field[data-name="teilnehmeranzahl"] .acf-input {
	display: none;
}
.toggle.neu {
	display: none !important;
}
/* "Neu!"-Kennzeichen an Angeboten, die in den letzten 8 Tagen eingefuegt wurden (Klasse newly_inserted, siehe php/write_show_list.php). */
.newly_inserted .bfe-company::before {
	content: 'Neu!';
	width: 80px;
	height: 40px;
	background: var(--daw-color-success, #1f9d45);
	position: relative;
	display: block;
	line-height: 40px;
	text-align: center;
	color: var(--daw-color-white, #fff);
	border-radius: 0 0 var(--daw-radius-lg, 12px) 0;
	font-weight: bold;
	z-index: 1;
	margin: -20px 0px 10px -20px;
}
.bfe-teaser label {
	display: none !important;
}

/* Schalter-im-Zeilen-Handle (Gegenstück zu js/bfem_edit_termine.js) */
.acf-row-handle.order {
	display: flex;
	align-items: center;
	align-items: flex-start;
}
.acf-row.is-hidden-row:before {
	content: "";
	border-left: 4px solid #D94E61 !important;
	height: 100%;
	position: absolute;
}
.acf-row.is-hidden-row, .select2-container--disabled {
	opacity: 0.5;
}
.acf-row-handle .bfe-handle-switch {
	margin-left: 20px;
	display: flex;
	flex-direction: row-reverse;
	gap: 10px;
}
.acf-row-handle .bfe-handle-switch label {
	color: #012545;
}
.bfe-handle-switch .acf-switch {
	background: #139940 !important;
}
.bfe-handle-switch .acf-switch.-on {
	background: #D94E61 !important;
}
.bfe-handle-switch .acf-switch .acf-switch-slider::before {
	content: '\f06e' !important;
	color: #012545 !important;
	font-size: 15px;
}
.bfe-handle-switch .acf-switch.-on .acf-switch-slider::before {
	content: '\f070' !important;
	color: #012545 !important;
}

/* ---------- Eigene Unterseite [bfem_edit_termine] ---------- */

.bfem-edit-termine-wrap {
	border-radius: 8px;
	max-width: 100%;
	margin: 0 auto;
}
.bfem-edit-termine-wrap h2 {
	color: #012545;
	font-weight: normal;
}

/* ---------- Angebotsliste [bfem_show_list] / [bfem_show_list_company] ---------- */

.bfe-filter-container {
	background: #fff;
	box-shadow: 0em 0.15em 2em 0em rgba(0,0,0,0.15);
	padding: 20px;
	border-radius: 5px;
	margin-bottom: 1em;
}
.filter-bfe-event-list {
	display: grid;
	grid-template-columns: 25% 25% 25% 25%;
}
.filter-bfe-event-list input {
	border-radius: 5px;
	margin-right: 5px;
	line-height: 1;
	font-size: .8em;
}
.filter-bfe-event-list label {
	display: inline-block;
	color: #012545;
}
.table-bfe-event-list {
	border-collapse: collapse;
	width: 100%;
	text-align: left;
	margin-bottom: 0px;
	display: inline-table;
	border-radius: 5px;
	overflow: hidden;
}
.table-bfe-event-list th, .table-bfe-event-list td {
	padding: 15px;
	vertical-align: top;
	font-size: 15px !important;
}
.table-bfe-event-list th {
	font-weight: 300;
	background: #0097c0;
	color: #fff;
	padding: 5px 15px;
}
.table-bfe-event-list tr {
	border-top: 2px solid #0096BF;
}
.bfe.angebot {
	border-top: 2px solid #0096BF;
	display: flex;
	align-items: stretch;
	background: #fff;
	padding: 20px;
}
.bfe.angebot .infos-wrap {
	background: #FBC100;
	border-radius: 5px;
	flex-grow: 1;
	position: relative;
	padding: 15px;
}
.bfe h3 {
	font-size: 1.8em;
	font-weight: normal;
	margin: 0px 0px 10px 0px;
}
.bfe-company {
	margin-right: 20px;
	max-width: 170px;
	display: inline-block;
	float: left;
	width: 300px;
}
.company_logo {
	padding: 10px;
	box-shadow: 0px 0px 20px #ccc;
	border-radius: 10px;
	height: auto;
	background: #fff;
	width: 300px;
}
.berufsfeld {
	padding: 5px 10px;
	background: #fff;
	display: inline-block;
	margin-bottom: 20px;
	border-radius: 5px;
	color: #012545;
	max-width: 90%;
	line-height: 1.7;
}
.berufsfeld b {
	color: #012545;
}
.bfe .infos {
	margin-bottom: 10px;
}
.infos a {
	color: #012545;
}
.infos span {
	display: block;
	padding-left: 35px;
	position: relative;
}
.infos span i {
	height: 100%;
	color: #fff;
	width: 30px;
	position: absolute;
	left: 0;
}
.bfe i {
	color: #0096BF;
	margin-right: 5px !important;
	font-size: 1.5em !important;
}
.freie-plaetze {
	background: #139940;
	padding: 10px 10px;
	display: inline-block;
	border-radius: 5px;
	font-weight: bold;
	margin-bottom: 5px;
	color: #fff;
	width: 100%;
}
.voll .freie-plaetze {
	background: #D94E61;
}
.nicht_verfuegbar {
	opacity: .5;
}
.nach-batch {
	background: #0096BF;
	padding: 10px 20px 10px 10px;
	color: #fff;
	align-self: flex-start;
	font-size: 14px;
	line-height: 20px;
	margin-right: 3px;
	border-radius: 0px 5px 0px 5px;
	margin-top: -15px;
}
.down .btn {
	background: #0096BF;
	color: #fff;
	padding: 5px 20px !important;
	width: 100%;
}
.down .btn:hover {
	background: #FBC100 !important;
}
.infos-bottom {
	padding: 20px 0px;
	background: #fff;
}

/* ---------- Detail-Popup (write_popup.php) ---------- */

.cel-infopopup {
	display: none;
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	overflow-y: auto;
	z-index: 999999999;
	padding: 15px;
	margin-bottom: 0px;
}
.cel-infopopup h3 {
	font-size: 2em;
}
.cel-infopopup__wrap {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 100%;
	padding: 10px 30px 30px;
	margin: 20px 0;
	background: #fff;
	max-width: 600px;
	border-radius: 8px;
	overflow: hidden;
	box-shadow: 0 0 25px rgba(0,0,0,0.35);
}
.bfe .cel-infopopup__wrap {
	max-width: 800px !important;
	background: #FBC100 !important;
	padding: 0px !important;
}
.cel-inside-wrap {
	padding: 0px 15px;
}
.popup-close.bg {
	width: 100%;
	background: rgba(0, 0, 0, 0.65);
	height: 100%;
	position: fixed;
	left: 0;
	top: 0px;
}
.cel-infopopup__close {
	font: inherit;
	cursor: pointer;
	color: #fff;
	font-size: 28px;
	font-weight: 700;
	display: block;
	width: 40px;
	height: 40px;
	line-height: 0px;
	border: 0;
	position: absolute;
	right: 10px;
	top: 10px;
	background: #0096BF;
	text-align: center;
	border-radius: 50px;
	transition: .5s ease;
}
.cel-infopopup__close:hover {
	background: #FBC100;
}
.cel-infopopup__book-appointment, .open-appointment-bfe-info {
	font: inherit;
	cursor: pointer;
	color: #fff;
	background: #012545;
	font-weight: 600;
	display: inline-block;
	padding: 10px 20px;
	border: 0;
	transition: .3s;
	width: 100%;
	border-radius: 50px;
}
.cel-infopopup__book-appointment:hover, .open-appointment-bfe-info:hover {
	color: #fff;
	background: #FBC100;
}
.open-appointment-bfe-info.bfem-locked,
.open-appointment-bfe-info.bfem-locked:hover {
	background: #c3c4c7;
	color: #6b7075;
	cursor: not-allowed;
	opacity: .8;
}
.bfem-locked-info {
	margin: 8px 0;
	font-size: 14px;
	color: #6b7075;
}
.bfe-title-img {
	position: relative;
	width: 100%;
	height: 300px;
	background-size: cover !important;
	background-position: center !important;
}
.bfe-title-img-small {
	width: 250px;
	background-size: cover !important;
	background-position: center !important;
}
.cel-infopopup__wrap .bfe-desc {
	background: #fff;
	padding: 20px 20px 0px 20px;
	border-radius: 10px;
	line-height: 1.6;
	max-height: 200px;
	overflow-y: auto;
	position: relative;
	margin: 10px 0px;
}

/* ---------- Unternehmens-Backend: Anmeldungen verwalten (write_sus_in_company_list.php) ---------- */

.bfe-verwalten h2 {
	font-family: "londrina", sans-serif;
	color: #012545;
	font-size: 2em;
	line-height: 1.2;
	font-weight: normal;
}
.bfe-box {
	padding: 20px !important;
	margin: 0px !important;
}
.bfe-box.bfe-verwalten {
	box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.2);
	border-radius: 5px;
	position: relative;
}
.bfe-verwalten .infos span i {
	color: #FBC100;
	font-size: 20px !important;
	line-height: 20px;
}
.list_sus_angemeldet {
	border-radius: 5px;
	border-spacing: 0px;
	position: relative;
	margin-top: 20px;
}
.list_sus_angemeldet table th, .list_sus_angemeldet table td {
	padding: 5px 10px;
	width: 25%;
	vertical-align: top;
}
.list_sus_angemeldet button {
	background: #0096BF;
	padding: 5px 20px;
	border-radius: 50px;
	margin-top: 10px;
	color: #fff;
}
.row_sus_anmeldung {
	margin: 10px 0px;
	background: #FBC100;
	border-radius: 5px;
	width: 100%;
}
.row_sus_anmeldung a {
	color: #012545;
	font-weight: normal;
	border-bottom-color: #012545;
}
.sus_anmeldung {
	padding: 10px;
}
.sus_anmeldung.sus_anmeldung_teilnahme {
	padding: 10px 8px !important;
}
.sus_anmeldung.sus_anmeldung_teilnahme.sus_teilgenommen.ja {
	background: #139940;
}
.sus_anmeldung.sus_anmeldung_teilnahme.sus_teilgenommen.nein {
	background: #D94E61;
}
.sus_anmeldung.sus_anmeldung_teilnahme.sus_teilgenommen .info {
	border: none !important;
}
.sus_anmeldung.sus_anmeldung_teilnahme.sus_teilgenommen.ja .info:before {
	content: "\f058";
	color: #139940;
}
.sus_anmeldung.sus_anmeldung_teilnahme.sus_teilgenommen.nein .info:before {
	content: "\f057";
	color: #D94E61;
}
.check label, .gchoice label {
	font-weight: normal !important;
	padding-left: 25px !important;
	cursor: pointer;
	line-height: 1.7;
	margin: 0px !important;
}
.check {
	cursor: pointer !important;
	background: #fff;
	padding: 5px 10px;
	border-radius: 50px;
}
.preview .check {
	opacity: .5;
	cursor: crosshair;
}
.alle_sus_waehlen {
	display: inline-block;
	text-align: center;
	margin-top: 20px;
	border: none !important;
	background: #139940;
	padding: 8px 10px;
	color: #fff;
	width: 50%;
	float: right;
	margin-bottom: 10px;
	border-radius: 50px;
	position: relative;
	cursor: pointer;
}
.alle_sus_waehlen:hover {
	background: #0096BF;
}
.send_teilnahmebestaetigung {
	background: #012545;
	font-weight: bold;
	font-size: 1.5em;
	padding: 8px 20px;
}
.send_teilnahmebestaetigung:hover {
	background: #0096BF;
	color: #fff;
}
.eventVorbei-box {
	text-align: right;
}
.bfe-kommentar-wrap {
	border: 4px solid #FBC100;
	padding: 10px !important;
	color: #012545;
	width: 100%;
	background: #fff;
	border-radius: 8px;
}
.bfe-kommentar-gesendet {
	color: #fff;
	padding-top: 10px;
	border-top: 1px solid #fff;
}
.comment_bfe_teilnahme, input.comment_bfe_teilnahme:focus {
	min-height: 200px;
}
.hidden-by-default {
	display: none !important;
	margin-top: 10px;
}
label[for="toggle-css"] {
	padding-left: 30px !important;
}
#toggle-css:checked ~ #css-content {
	display: block !important;
}

/* ---------- SuS-/Lehrer-Backend (write_sus_on_sus_page.php, write_sus_on_teacher_page.php) ---------- */

.bfe-user-backend-item h3 {
	margin: 0px !important;
	padding-bottom: 10px;
	font-size: 2em;
	font-weight: normal;
}
.bfe-user-backend-item {
	background: #FBC100;
	border-radius: 5px;
	overflow: hidden;
	max-width: 100%;
	margin: 0 auto 10px auto !important;
}
.bfe-user-backend-item .berufsfeld {
	margin-top: 10px;
}
.bfe-user-backend-item .btn {
	background: #0096BF;
	color: #fff;
	margin-top: 10px;
}
.sus_logo {
	width: 100%;
	padding: 10px;
	border-radius: 5px;
	background: #fff;
	margin-bottom: 10px;
}
.padding-top-bottom {
	padding: 20px 0px;
	margin: 0 !important;
}
.bfe-status {
	max-height: 100%;
	vertical-align: top;
	background: #CCEAF2 !important;
	min-height: 100px;
	color: #0096BF;
	align-content: space-between;
	margin: 0px !important;
}
.bfe-status.erfolgreich {
	background: #139940 !important;
	color: #fff;
}
.bfe-status.erfolgreich .btn {
	background: #fff !important;
	color: #012545;
	font-weight: bold;
}
.bfe-status.nicht-erfolgreich {
	background: #D94E61 !important;
	color: #fff;
}
.bfe-status.nicht-erfolgreich h4, .bfe-status.erfolgreich h4 {
	color: #fff !important;
}
.bfe-status h4 {
	font-family: "Open Sans";
	font-weight: bold;
	padding-top: 5px;
	line-height: 1.5;
	color: #0096BF;
	margin-top: 0px;
	padding-left: 35px;
}
.bfe-status h4::before {
	content: '';
	width: 30px;
	height: 30px;
	background: #fff;
	border-radius: 50px;
	margin-left: -40px;
	text-align: center;
	line-height: 30px;
	float: left;
	margin-top: -2px;
	color: #012545;
}
.angemeldet h4:before, .zb h4:before, .unklar h4:before {
	color: #0096BF !important;
}
.erfolgreich h4:before, .angemeldet h4:before {
	content: '\f00c';
}
.nicht-erfolgreich h4:before {
	content: '\f00d';
}
.unklar h4:before {
	content: '\f251';
}

/* ---------- Schul-Konto: Klassenübersicht (write_sus_on_teacher_page.php) ---------- */

.klassenDiv {
	background: #fff;
	border-radius: 10px;
	clear: both;
	margin-bottom: 30px;
}
.klassenDiv h2 {
	margin-top: 0px;
	font-weight: normal;
	color: #012545;
	font-size: 2em !important;
}
.klassenDiv .name {
	color: #fff;
	font-weight: bold;
	padding: 10px 0px;
}
.schueler-anmeldungen {
	padding: 0px 10px 5px 10px;
	background: #012545;
	border-radius: 5px;
	margin-bottom: 10px;
}
.klassenfilter {
	background: #0096BF;
	color: #fff;
	border-radius: 10px;
	margin: 30px 0px;
	padding: 15px;
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.btn.print {
	border: 1px solid #0096BF;
	font-size: .8em;
	color: #0096BF;
	background: #fff;
}
.btn.print:hover {
	background: #FBC100;
	color: #012545;
}
.btn.pdf-export {
	border: 1px solid #0096BF;
	font-size: .8em;
	color: #0096BF;
	background: #fff;
}
.btn.pdf-export:after {
	content: '\f1c1'; /* FontAwesome "file-pdf-o" - gleiches Icon-Setup wie .btn.print (Theme style.css, \f02f) */
	color: #0096BF;
}
.btn.pdf-export:hover {
	background: #FBC100;
	color: #012545;
}

/* ---------- BFE-Tage-Anzeige (bfem_tage_schule_shortcode) ---------- */

.bfe-tage h3 {
	color: #012545;
}
.bfe-tage span {
	background: #0096BF;
	padding: 5px 10px;
	margin: 10px !important;
	display: inline-block;
	border-radius: 5px;
	color: #fff;
}

@media (max-width: 992px) {
	.bfe h3 {
		margin: 0px 20px 20px 0px;
	}
	.berufsfeld {
		margin-right: 60px;
	}
	.filter-bfe-event-list {
		grid-template-columns: 50% 50%;
		column-gap: 10px;
	}
	.table-bfe-event-list {
		border: 0;
	}
}
@media (max-width: 920px) {
	.bfe.angebot {
		display: block;
	}
	.bfe-company {
		max-width: 100%;
		width: 100%;
	}
	.company_logo {
		display: none !important;
	}
	.bfe .infos {
		display: block;
	}
}
@media (max-width: 460px) {
	.cel-infopopup__wrap {
		width: 320px;
		padding: 15px;
		font-size: 12px;
		position: relative;
		top: 0;
		left: 0;
		transform: translate(0, 0);
		margin: auto;
	}
	.filter-bfe-event-list {
		grid-template-columns: 100%;
		column-gap: 10px;
	}
}
