@import "../../elastic/styles/styles.min.css";

/* ===================================================================
   BK16 Vereins-Webmail — Blue Knights Germany XVI
   Kind-Skin von Elastic (Templates/Assets per Symlink geteilt),
   nur aktiv ueber mail.bk16.de. Navy #003366 / Gold #FFD700,
   Schrift Cinzel Decorative wie bkgermany16.de.
   =================================================================== */

@font-face {
	font-family: 'Cinzel Decorative';
	font-style: normal; font-weight: 700; font-display: swap;
	src: url('cinzel-decorative-700-latin.woff2') format('woff2');
}
@font-face {
	font-family: 'Playfair Display';
	font-style: normal; font-weight: 500; font-display: swap;
	src: url('playfair-display-500-latin.woff2') format('woff2');
}

/* ------------------------------ Login-Seite ------------------------------ */
body.task-login #layout,
body.task-login {
	background: radial-gradient(ellipse at 50% 12%, #0a4b8c 0%, #003366 55%, #00203f 100%) !important;
}
body.task-login #layout-content,
body.task-login #layout-content.no-navbar {
	background: transparent !important;
}

/* Rundes Ring-Logo — natuerliches Seitenverhaeltnis (Elastic-max-height ausgehebelt) */
body.task-login #logo {
	display: block !important;
	width: auto !important;
	height: auto !important;
	max-width: 185px !important;
	max-height: none !important;
	margin: 1.6rem auto .2rem !important;
	filter: drop-shadow(0 6px 20px rgba(0, 0, 0, .45)) !important;
}

/* Login-Karte: weiss, goldene Kopfleiste; Platz oben fuer den Titel */
body.task-login #login-form {
	position: relative !important;
	margin-top: 7.4rem !important;
	background: #ffffff !important;
	border: 3px solid #FFD700 !important;
	border-radius: 10px !important;
	padding: 1.15rem 1.1rem !important;
	box-shadow: 0 12px 45px rgba(0, 0, 0, .45) !important;
	overflow: visible !important;
}

/* Goldener Titel ZWISCHEN Logo und Karte (zentriert, Vereinsschrift) */
body.task-login #login-form::before {
	content: "Herzlich willkommen zum\A Blue Knights Germany XVI\A Mailportal";
	position: absolute;
	left: 50%;
	bottom: calc(100% + 2.5rem);
	transform: translateX(-50%);
	white-space: pre;
	text-align: center;
	line-height: 1.35;
	font-family: 'Cinzel Decorative', 'Playfair Display', Georgia, serif;
	font-weight: 700;
	color: #ffce4d;
	font-size: 1.2rem;
	letter-spacing: .01em;
	text-shadow: 0 2px 6px rgba(0, 0, 0, .4);
}

/* redundanten Produktnamen unten ausblenden */
body.task-login #login-footer {
	display: none !important;
}

/* Anmelde-Button: schmal + zentriert (nicht ueber die ganze Kartenbreite) */
body.task-login #login-form .btn.btn-primary,
body.task-login #login-form button.btn-primary {
	display: block !important;
	width: -moz-fit-content !important;
	width: fit-content !important;
	min-width: 175px !important;
	margin: .5rem auto 0 !important;
	padding: .7rem 2.4rem !important;
}

/* ------------------------- Buttons / Formulare --------------------------- */
.btn.btn-primary,
button.btn-primary,
.formbuttons .btn.btn-primary {
	background-color: #003366 !important;
	border-color: #003366 !important;
	color: #ffffff !important;
}
.btn.btn-primary:hover,
.btn.btn-primary:focus,
button.btn-primary:hover {
	background-color: #FFD700 !important;
	border-color: #e8bf00 !important;
	color: #003366 !important;
}
.form-control:focus,
select.form-control:focus,
textarea.form-control:focus {
	border-color: #003366 !important;
	box-shadow: 0 0 0 .18rem rgba(0, 51, 102, .28) !important;
}

/* -------------------- In-App: Navy-Leiste + Gold-Akzent ------------------- */
#layout-menu,
#taskmenu,
.taskmenu {
	background-color: #003366 !important;
}
#taskmenu a.button.selected,
#taskmenu a.button.selected .inner,
#taskmenu a.button:hover,
#taskmenu a.button:hover .inner {
	color: #FFD700 !important;
}
a.active,
.listing li.selected > a,
#layout-content .header .header-title {
	color: #003366 !important;
}
a,
a:visited {
	color: #00396f;
}
a:hover {
	color: #003366;
}