/* FW-Design fuer MantisBT 2.x (ACE-Theme, skin-3) - Feuerwehr Oberursel
   Farben aus FwObuDesign/tokens/colors.css. Nur Darstellung, keine Funktion. */
:root {
	--fw-rot: #AB0014;
	--fw-rot-dunkel: #8A0010;
	--fw-rot-hell: #FCF2F4;
	--fw-navy: #0B1638;
	--fw-navy-700: #1E2A55;
	--fw-navy-300: #7A8199;
	--fw-text: #333333;
	--fw-text-leise: #6E727A;
	--fw-linie: #E1E3E8;
	--fw-flaeche: #F5F6F8;
	--fw-kopf: #F0F1F4;
	--fw-weiss: #FFFFFF;
	--fw-link: #2B73B7;
	--fw-schatten: 0 1px 2px rgba(26, 28, 32, .06), 0 1px 3px rgba(26, 28, 32, .08);
	--fw-radius: 6px;
	--fw-schrift: "Segoe UI", -apple-system, BlinkMacSystemFont, Roboto, "Helvetica Neue", Arial, sans-serif;
}

/* --- Schrift: ersetzt die Google-Schrift aus der Benutzereinstellung --------------------- */
body, * { font-family: var(--fw-schrift); }
.fa, .ace-icon.fa, [class^="fa-"], [class*=" fa-"] { font-family: FontAwesome !important; }
.glyphicon { font-family: "Glyphicons Halflings" !important; }
body { font-size: 14px; color: var(--fw-text); }
body:not(.login-layout) { background: var(--fw-flaeche); }
body:not(.login-layout) .main-container, body:not(.login-layout) .main-content, body:not(.login-layout) .page-content { background: var(--fw-flaeche); }
a { color: var(--fw-link); }
a:hover, a:focus { color: var(--fw-navy); }

/* --- Kopfleiste: hell, Wappen links, rote Linie ------------------------------------------- */
body.skin-3 #navbar.navbar {
	background: var(--fw-weiss);
	border-bottom: 3px solid var(--fw-rot);
	box-shadow: 0 1px 4px rgba(11, 22, 56, .08);
	min-height: 52px;
}
body.skin-3 #navbar .navbar-brand {
	color: var(--fw-navy);
	font-weight: 600;
	letter-spacing: .01em;
	padding: 8px 14px 8px 146px;
	line-height: 36px;
	height: 52px;
	background: url("plugin_file.php?file=FwDesign/silhouette.png") no-repeat 14px 58% / auto 30px;
}
body.skin-3 #navbar .navbar-brand:hover { color: var(--fw-rot); }
body.skin-3 #navbar .navbar-brand .smaller-75 { font-size: 17px; }
body.skin-3 .ace-nav > li { border-left: 1px solid var(--fw-linie); height: 52px; line-height: 52px; }
body.skin-3 .ace-nav > li > a,
body.skin-3 .ace-nav > li.grey > a,
body.skin-3 .ace-nav > li.light-blue > a {
	background: var(--fw-weiss) !important;
	color: var(--fw-navy) !important;
	height: 52px;
	line-height: 52px;
}
body.skin-3 .ace-nav > li > a:hover,
body.skin-3 .ace-nav > li.open > a { background: var(--fw-kopf) !important; }
body.skin-3 .ace-nav > li > .btn-group { line-height: normal; }
body.skin-3 .menu-toggler, body.skin-3 .navbar-toggle { background-color: var(--fw-navy); }
/* Platz fuer die hoehere Kopfleiste */
body.skin-3 .main-container { padding-top: 7px; }
@media (min-width: 992px) {
	body.skin-3 .sidebar.sidebar-fixed { top: 55px; }
}

/* --- Seitenleiste -------------------------------------------------------------------------- */
body.skin-3 .sidebar,
body.skin-3 .sidebar .nav-list > li > a,
body.skin-3 .sidebar .sidebar-toggle { background: var(--fw-weiss); }
body.skin-3 .sidebar { border-right: 1px solid var(--fw-linie); box-shadow: none; }
body.skin-3 .sidebar:before { background: var(--fw-weiss); border-right: 1px solid var(--fw-linie); }
body.skin-3 .sidebar .nav-list > li { border-color: var(--fw-linie); }
body.skin-3 .sidebar .nav-list > li > a { color: var(--fw-text); }
body.skin-3 .sidebar .nav-list > li > a > .menu-icon { color: var(--fw-navy-300); }
body.skin-3 .sidebar .nav-list > li > a:hover { background: var(--fw-flaeche); color: var(--fw-navy); }
body.skin-3 .sidebar .nav-list > li > a:hover > .menu-icon { color: var(--fw-navy); }
body.skin-3 .sidebar .nav-list > li.active > a,
body.skin-3 .sidebar .nav-list > li.active > a:hover,
body.skin-3 .sidebar .nav-list > li.active.highlight > a { background-color: var(--fw-rot-hell) !important; color: var(--fw-rot) !important; font-weight: 600; }
body.skin-3 .sidebar .nav-list > li.active > a > .menu-icon { color: var(--fw-rot) !important; }
body.skin-3 .sidebar .nav-list > li.active:before { background-color: var(--fw-rot) !important; }
body.skin-3 .sidebar .nav-list > li.active,
body.skin-3 .sidebar .nav-list > li.active + li { border-color: var(--fw-linie) !important; }
body.skin-3 .sidebar .nav-list > li.active > a:after,
body.skin-3 .sidebar .nav-list > li.active > a:before,
body.skin-3 .sidebar .nav-list > li.active:after { display: none !important; }
body.skin-3 .sidebar-toggle > .ace-icon { background: var(--fw-weiss); border-color: var(--fw-linie); color: var(--fw-navy-300); }

/* --- Leiste unter dem Kopf (Benutzer, Schnellsuche) --------------------------------------- */
body.skin-3 .breadcrumbs {
	background: var(--fw-weiss);
	border-bottom: 1px solid var(--fw-linie);
	box-shadow: none;
}
body.skin-3 .breadcrumbs { margin: 0; border-radius: 0; }
body.skin-3 .breadcrumbs .label { background: var(--fw-navy-700) !important; border-radius: 3px; }
body.skin-3 .breadcrumbs .label.arrowed { margin-left: 4px; }
body.skin-3 .breadcrumbs .label.arrowed:before { display: none; }

/* --- Karten (widget-box) -------------------------------------------------------------------- */
.widget-box {
	border: 1px solid var(--fw-linie) !important;
	border-radius: var(--fw-radius);
	box-shadow: var(--fw-schatten);
	background: var(--fw-weiss);
	overflow: hidden;
}
.widget-box > .widget-header,
.widget-box.widget-color-blue2 > .widget-header,
.widget-box.widget-color-blue > .widget-header,
.widget-box.widget-color-grey > .widget-header {
	background: var(--fw-weiss) !important;
	border-bottom: 1px solid var(--fw-linie) !important;
	color: var(--fw-navy) !important;
	min-height: 44px;
}
.widget-box > .widget-header > .widget-title {
	color: var(--fw-navy) !important;
	font-weight: 600;
	font-size: 16px;
	line-height: 42px;
}
.widget-box > .widget-header > .widget-title > .ace-icon { color: var(--fw-rot); }
.widget-box > .widget-header > .widget-title, .widget-box > .widget-header > .widget-title.lighter { font-weight: 600 !important; }
.widget-box > .widget-header .widget-toolbar > a,
.widget-box > .widget-header .widget-toolbar > a > .ace-icon,
.widget-box > .widget-header .widget-toolbar .ace-icon { color: var(--fw-navy-300) !important; }
.widget-box > .widget-header .widget-toolbar > a:hover > .ace-icon { color: var(--fw-navy) !important; }
.widget-box > .widget-header .widget-toolbar:before { border-color: var(--fw-linie) !important; }
.widget-box > .widget-header .badge { background: var(--fw-kopf); color: var(--fw-navy); font-weight: 600; }
.widget-body { background: var(--fw-weiss); }
.widget-toolbox { background: var(--fw-weiss) !important; border-color: var(--fw-linie) !important; }
.widget-main.no-padding .table { border: 0; }

/* --- Tabellen ------------------------------------------------------------------------------ */
.table > thead > tr > th,
.table > thead > tr > td {
	background: var(--fw-kopf) !important;
	background-image: none !important;
	color: var(--fw-navy);
	font-weight: 600;
	border-color: var(--fw-linie) !important;
}
.table > thead > tr > th a { color: var(--fw-navy); }
.table > tbody > tr > td, .table > tbody > tr > th,
.table-bordered, .table-bordered > tbody > tr > td, .table-bordered > tbody > tr > th { border-color: var(--fw-linie) !important; }
.table > tbody > tr > td { vertical-align: middle; }
.table-striped > tbody > tr:nth-of-type(odd) { background: #FAFAFB; }
.table-hover > tbody > tr:hover, #buglist tbody tr:hover { background: #F1F4FA; }
.table td.category, .table th.category, td.category, th.category {
	background: var(--fw-flaeche) !important;
	color: var(--fw-navy);
	font-weight: 600;
}
/* Filterkasten: Feldnamen ruhiger */
#filter .table td.small-caption a, .filter-box .small-caption a { color: var(--fw-navy-700); }

/* --- Knoepfe -------------------------------------------------------------------------------- */
.btn { border-radius: 4px !important; text-shadow: none !important; transition: background-color .12s, border-color .12s, color .12s; }
.btn-round { border-radius: 4px !important; }
.btn.btn-primary:not(.btn-white),
.btn.btn-success:not(.btn-white) {
	background: var(--fw-rot) !important;
	border-color: var(--fw-rot) !important;
	color: var(--fw-weiss) !important;
}
.btn.btn-primary:not(.btn-white):hover, .btn.btn-primary:not(.btn-white):focus,
.btn.btn-success:not(.btn-white):hover, .btn.btn-success:not(.btn-white):focus {
	background: var(--fw-rot-dunkel) !important;
	border-color: var(--fw-rot-dunkel) !important;
}
.btn.btn-white,
.btn.btn-white.btn-primary,
.btn.btn-white.btn-default {
	background: var(--fw-weiss) !important;
	border: 1px solid #C9CCD5 !important;
	color: var(--fw-navy) !important;
}
.btn.btn-white:hover, .btn.btn-white.btn-primary:hover, .btn.btn-white.btn-default:hover {
	background: var(--fw-kopf) !important;
	border-color: var(--fw-navy-300) !important;
	color: var(--fw-navy) !important;
}
.btn.btn-white.btn-danger { color: var(--fw-rot) !important; }
.btn.btn-white.btn-danger:hover { background: var(--fw-rot-hell) !important; border-color: var(--fw-rot) !important; }
.btn-group > .btn + .btn { margin-left: -1px; }
/* Knoepfe in der Kopfleiste */
body.skin-3 #navbar .btn-group .btn { line-height: 1.4; }
/* Knoepfe in der Kopfleiste einzeln statt als zusammengeklebte Gruppe */
body.skin-3 #navbar .btn-group { display: inline-flex; gap: 8px; }
body.skin-3 #navbar .btn-group > .btn { margin-left: 0 !important; float: none; }

/* --- Reiter, Seitenzahlen, Felder ----------------------------------------------------------- */
.nav-tabs { border-color: var(--fw-linie); }
.nav-tabs > li > a { color: var(--fw-text-leise); border-radius: 0 !important; }
.nav-tabs > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus {
	color: var(--fw-navy);
	border-top: 2px solid var(--fw-rot) !important;
	font-weight: 600;
}
.pagination > .active > a, .pagination > .active > a:hover, .pagination > .active > span {
	background: var(--fw-navy) !important;
	border-color: var(--fw-navy) !important;
}
.pagination > li > a { color: var(--fw-navy); }
input[type=text], input[type=password], input[type=email], input[type=number], input[type=search], input[type=date],
select, textarea, .form-control {
	border-radius: 4px !important;
	border-color: #C9CCD5 !important;
}
input:focus, select:focus, textarea:focus, .form-control:focus {
	border-color: var(--fw-link) !important;
	box-shadow: 0 0 0 3px rgba(43, 115, 183, .15) !important;
	outline: none;
}
.label, .badge { border-radius: 3px; text-shadow: none; }

/* --- Anmeldung: Karte ueber dem vorhandenen Hintergrundbild -------------------------------- */
.login-layout .login-container .widget-box,
.login-layout .widget-box.visible {
	border-radius: 10px;
	box-shadow: 0 10px 30px rgba(11, 22, 56, .18);
	border: 0 !important;
}
.login-layout .widget-main { border-radius: 10px; }
.login-layout .btn-success.btn-inverse,
.login-layout .btn.btn-success {
	background: var(--fw-navy) !important;
	border-color: var(--fw-navy) !important;
}
.login-layout .btn-success.btn-inverse:hover,
.login-layout .btn.btn-success:hover { background: var(--fw-rot) !important; border-color: var(--fw-rot) !important; }

/* --- Fusszeile ------------------------------------------------------------------------------- */
.footer .footer-inner .footer-content { border-top-color: var(--fw-linie); background: transparent; }

/* --- Weisse Schrift/Symbole auf jetzt hellen Flaechen ---------------------------------------- */
body.skin-3 .ace-nav .ace-icon, body.skin-3 .ace-nav .white { color: var(--fw-navy-300) !important; }
body.skin-3 .ace-nav > li > a:hover .ace-icon { color: var(--fw-navy) !important; }
body.skin-3 .ace-nav .user-info { top: 0; line-height: normal; vertical-align: middle; max-width: 160px; color: var(--fw-navy); }
body.skin-3 .ace-nav > li > a > .ace-icon.fa-2x { font-size: 20px; vertical-align: middle; margin-right: 4px; }
.widget-box > .widget-header .white,
.widget-box > .widget-header a.white,
.widget-box > .widget-header .widget-title a { color: var(--fw-navy) !important; }
.widget-box > .widget-header .widget-title a:hover { color: var(--fw-rot) !important; }

/* --- Zeitleiste (Symbole sind .thumbicon mit btn-Farbklassen, ohne .btn) -------------------- */
.thumbicon, .thumbicon[class*="btn-"] {
	background: #E8EBF2 !important;
	border: 0 !important;
	color: var(--fw-navy-700) !important;
	width: 34px; height: 34px; line-height: 34px; font-size: 16px;
}
.thumbicon.btn-success { background: #DDEEDE !important; color: #2E7D32 !important; }
.thumbicon.btn-danger { background: var(--fw-rot-hell) !important; color: var(--fw-rot) !important; }
.profile-activity { border-color: var(--fw-linie) !important; }
.profile-activity:hover { background: #F7F8FB; }

/* --- Leere Kaesten auf der Uebersicht: statt grauer Leerzeile ein Hinweis ------------------- */
:is(#assigned, #unassigned, #reported, #resolved, #recent_mod, #monitored, #feedback, #verify, #my_comments)
	.table > tbody > tr:only-child > td:only-child {
	background: var(--fw-weiss) !important;
	border: 0 !important;
	color: var(--fw-text-leise);
	font-size: 13px;
	padding: 10px 12px;
}
:is(#assigned, #unassigned, #reported, #resolved, #recent_mod, #monitored, #feedback, #verify, #my_comments)
	.table > tbody > tr:only-child > td:only-child::after { content: "Keine Einträge"; }

/* --- Notizen: hell statt grauem Block, private Notizen bleiben gelblich ----------------------- */
tr.bugnote .bugnote-note {
	background-color: #F7F8FB;
	color: var(--fw-text);
	border-left: 3px solid #C9CCD5 !important;
	line-height: 1.5;
}
tr.bugnote .bugnote-note.bugnote-private { border-left-color: #E0B400 !important; }
tr.bugnote .label.arrowed-in-right:after, tr.bugnote .label.arrowed:before { display: none; }

/* --- Schmale Bildschirme (Handy) ------------------------------------------------------------ */
body.skin-3 .navbar .navbar-toggle,
body.skin-3 .navbar .menu-toggler { background-color: var(--fw-navy) !important; border-color: var(--fw-navy) !important; }
body.skin-3 .navbar .navbar-toggle:hover,
body.skin-3 .navbar .menu-toggler:hover { background-color: var(--fw-navy-700) !important; }
@media (max-width: 767px) {
	body.skin-3 #navbar .navbar-brand {
		padding-left: 92px;
		background-size: auto 20px;
		background-position: 8px 60%;
		max-width: calc(100vw - 120px);
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
	}
	body.skin-3 #navbar .navbar-brand .smaller-75 { font-size: 15px; }
}