/*
 * Luljetas Hexenschule 1.2 – phpBB 3.3 Kindstil von prosilver
 *
 * WICHTIG: Die nächste Zeile lädt das komplette prosilver-Layout. Ohne sie fehlt
 * dem Style das gesamte Grundgerüst und die Seite wird "kaputt" angezeigt.
 */
@import url("../../prosilver/theme/stylesheet.css");

:root{
	--lh-cream:#f3f0df;
	--lh-cream-2:#e8ecdd;
	--lh-sage:#d9e6df;
	--lh-sage-dark:#6e8a80;
	--lh-petrol:#365f59;
	--lh-petrol-dark:#274c47;
	--lh-petrol-light:#557b71;
	--lh-gold:#aa9761;
	--lh-text:#29443e;
	--lh-muted:#5c766f;
	--lh-link:#2d5f56;
	--lh-hover:#927a43;
	--lh-border:rgba(64,95,86,.30);
	--lh-line:#c5cdb8;
	--lh-user:#a4161f;
}

/* ---------- Seite ---------- */
html{background:#dbe7e1}
body{
	color:var(--lh-text);
	font-family:Georgia,"Palatino Linotype","Times New Roman",serif;
	background:#dbe7e1 url("./images/background.jpg") center top / cover fixed no-repeat;
}
body a{color:var(--lh-link)}
body a:hover{color:var(--lh-hover)}
body h1,body h2,body h3,body h4{color:#22493f;font-family:Georgia,"Palatino Linotype",serif;border-color:var(--lh-line)}

body .wrap{
	max-width:1280px;
	background:rgba(243,240,223,.93);
	border:1px solid rgba(69,99,90,.35);
	border-radius:12px;
	box-shadow:0 8px 28px rgba(40,67,60,.22);
}

/* ---------- Kopfbereich: Banner (4:1) ---------- */
body .headerbar{
	position:relative;
	padding:0;
	margin-bottom:6px;
	min-height:120px;
	aspect-ratio:4 / 1;
	background:#dce9e3 url("./images/header.jpg") center center / 100% 100% no-repeat;
	border:1px solid var(--lh-gold);
	border-radius:9px;
	box-shadow:0 2px 8px rgba(40,67,60,.25);
	color:var(--lh-text);
	overflow:hidden;
}
body .headerbar .inner{position:static}
/* Der Titel steckt bereits im Bild -> Text nur für Screenreader/Suchmaschinen behalten */
body .headerbar .site-description h1,
body .headerbar .site-description p{
	position:absolute;width:1px;height:1px;margin:0;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;
}
body .headerbar .site-description{float:none;position:static;width:auto;margin:0;padding:0}
/* Ganzes Banner ist ein Link zur Übersicht */
body .headerbar .logo,body .headerbar a#logo{display:block;position:absolute;top:0;left:0;right:0;bottom:0;z-index:1;padding:0;margin:0;float:none;background:none}
body .headerbar .logo .site_logo{display:none}
/* Suche oben rechts im Banner */
body .headerbar .search-box,body .search-header{
	position:absolute;top:10px;right:14px;z-index:2;margin:0;float:none;
	background:rgba(247,245,235,.94);border:1px solid rgba(75,107,98,.45);border-radius:5px;box-shadow:none;
}
body .search-header .inputbox{background:transparent;border:0;color:var(--lh-text);box-shadow:none}
body .search-header .button-search,body .search-header .button-search-end{background:transparent;border-color:transparent;color:var(--lh-petrol)}

/* ---------- Navigation ---------- */
body #page-header .navbar{
	background:linear-gradient(180deg,var(--lh-petrol-light),var(--lh-petrol) 55%,var(--lh-petrol-dark));
	border:1px solid rgba(170,151,97,.6);border-radius:8px;
	box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 2px 6px rgba(35,62,55,.3);
	color:#f8f3e4;
}

.dropdown .dropdown-contents {
color: #f3f0df;
  background: #305852;
  border-color: #B9B9B9;
  box-shadow: 1px 3px 5px rgba(0, 0, 0, 0.2);
}

body a.button, body a.button:hover, body .button .icon {
  color: #B9B9B9;
}

body a.button:hover, body .button .icon {
  color: #B9B9B9;
}

body .dropdown li a {
  color: #305852;
}

body .dropdown li, body .dropdown li a {
  color: #305852;
  border-color: var(--lh-line);
}

.dropdown .dropdown-contents a {
color: #f3f0df;
  background: #305852;
  border-color: #B9B9B9;
  box-shadow: 1px 3px 5px rgba(0, 0, 0, 0.2);
}


body #page-header .navbar a,body #page-header .navbar li,body #page-header .navbar .icon{color:#f8f3e4}
body #page-header .navbar a:hover{color:#fff}
body .navbar{
	background:linear-gradient(#eef3e8,#dde8df);
	border:1px solid var(--lh-border);border-radius:8px;color:var(--lh-text);
}
body .navbar a,body ul.linklist>li,body ul.linklist>li a{color:#254f47}
body .navbar a:hover{color:var(--lh-hover)}
body .breadcrumbs .crumb::before{color:#7d9c8b}
body .action-bar{color:var(--lh-text)}
body .dropdown{background:#f1f3e6;border-color:var(--lh-sage-dark);box-shadow:0 6px 16px rgba(40,70,55,.3)}
body .dropdown li,body .dropdown li a{color:var(--lh-text);border-color:var(--lh-line)}

/* ---------- Kategorie-Leisten (reine CSS-Optik, keine Bilddatei nötig) ---------- */
body .forabg,body .forumbg{background:none;border:0;box-shadow:none;padding:0;margin-bottom:14px}
body ul.topiclist li.header{
	min-height:42px;
	border:1px solid rgba(170,151,97,.7);border-bottom:0;border-radius:8px 8px 0 0;
	background:
		radial-gradient(ellipse at 50% 0%,rgba(255,255,255,.16),rgba(255,255,255,0) 70%),
		linear-gradient(180deg,#4a7469,#33594f 60%,#2a4d45);
	box-shadow:inset 0 1px 0 rgba(255,255,255,.22);
}
body ul.topiclist li.header dl.row-item,body ul.topiclist li.header dl{background:none;min-height:40px;display:flex;align-items:center}
body ul.topiclist li.header dt{padding-left:6px;text-transform:uppercase;letter-spacing:.08em;font-size:.85em;color:#f7f1df;text-shadow:0 1px 2px rgba(0,0,0,.45)}
body ul.topiclist li.header dt a,body ul.topiclist li.header dt .list-inner{color:#f7f1df}
body ul.topiclist li.header dd{color:#e6eddc;font-size:.72em;text-transform:uppercase;letter-spacing:.06em;border-left-color:transparent}
body ul.topiclist li.header dd a{color:#e6eddc}
body ul.forums,body ul.topics{
	background:var(--lh-cream);
	border:1px solid rgba(64,95,86,.45);border-top:0;border-radius:0 0 8px 8px;
	box-shadow:inset 0 0 0 1px rgba(255,255,255,.5),0 2px 6px rgba(40,67,60,.18);
}

/* ---------- Forum-/Themenzeilen ---------- */
body ul.topiclist li.row{background:transparent;border-top:1px solid var(--lh-line);border-bottom:0}
body ul.topiclist li.row:first-child{border-top:0}
body ul.topiclist li.row dl{background-color:transparent}
body li.row.bg1,body .bg1{background:rgba(243,240,223,.94)}
body li.row.bg2,body .bg2{background:rgba(232,237,226,.9)}
body li.row:hover,body li.row:hover dd{background-color:rgba(221,232,225,.7)}
body ul.topiclist dd{border-left:1px solid var(--lh-line);color:var(--lh-text)}
body a.forumtitle,body a.topictitle{color:#22493f;font-weight:bold;font-family:inherit}
body a.forumtitle:hover,body a.topictitle:hover{color:var(--lh-hover)}
body dl.row-item dt .list-inner,body .forum-desc,body .description{color:#40605a}
body dd.lastpost,body dd.lastpost span{color:#40605a}
body dd.lastpost a{color:#22493f;font-weight:bold}
body a.username-coloured{font-weight:bold}
/* Forum-Bilder aus dem ACP nie überdimensioniert */
body .forum-image img{max-width:56px;max-height:56px;width:auto;height:auto;object-fit:contain}

/* ---------- Beiträge ---------- */
body .post{background:var(--lh-cream);border:1px solid rgba(64,95,86,.4);border-radius:8px;box-shadow:0 1px 6px rgba(40,67,60,.15);color:var(--lh-text)}
body .post.bg2{background:var(--lh-cream-2)}
body .postbody,body .postbody .content,body .content{color:var(--lh-text)}
body .postbody h3,body .postbody h3 a{color:#22493f;font-family:inherit}
body .postbody .author,body .postbody .author a{color:var(--lh-muted)}
body .postbody .author a{color:var(--lh-link)}
body .postprofile{border-left:1px dashed var(--lh-sage-dark);color:var(--lh-muted)}
body .postprofile dd,body .postprofile dt{color:var(--lh-muted)}
body .postprofile strong{color:var(--lh-text)}
body .signature,body .postbody .signature{color:var(--lh-muted);border-top-color:var(--lh-line)}
body blockquote{background:rgba(218,230,223,.75);border:1px solid var(--lh-sage-dark);border-left:4px solid var(--lh-petrol);color:var(--lh-text);border-radius:0 6px 6px 0}
body blockquote cite,body blockquote cite>span{color:var(--lh-muted)}
body .codebox{background:#f7f6e8;border-color:var(--lh-line)}
body .codebox p{color:var(--lh-muted);border-bottom-color:var(--lh-line)}
body .codebox code{background:#f7f6e8;color:#22392e;border-top-color:var(--lh-line)}
body .content h2,body .panel h2,body .panel h3{color:#22493f;border-bottom-color:var(--lh-line)}

/* ---------- Panels, Formulare, Buttons ---------- */
body .panel{background:var(--lh-cream);color:var(--lh-text);border:1px solid rgba(64,95,86,.4);border-radius:8px}
body .panel p,body fieldset,body label,body dl dt label{color:var(--lh-text);border-color:var(--lh-line)}
body .inputbox,body input.inputbox,body textarea.inputbox,body select,body textarea,body input[type=text],body input[type=password]{
	background:#faf9ee;color:var(--lh-text);border:1px solid #a9b89c;border-radius:4px}
body .inputbox:focus,body select:focus,body textarea:focus{border-color:var(--lh-petrol);outline:none;box-shadow:0 0 6px rgba(54,95,89,.4)}
body .button,body a.button1,body input.button1,body input.button2,body a.button2{
	background:linear-gradient(#557b71,#365f58);color:#f7f1df;border:1px solid rgba(170,151,97,.7);border-radius:5px;
	box-shadow:0 1px 2px rgba(35,62,55,.25);text-shadow:0 1px 1px rgba(0,0,0,.35);font-family:inherit}
body .button:hover,body a.button1:hover,body input.button1:hover,body input.button2:hover{background:linear-gradient(#638b80,#426e66);color:#fff;border-color:var(--lh-gold)}
body a.button,body a.button:hover,body .button .icon{color:#f7f1df}
body .button-secondary,body a.button-secondary{background:transparent;color:var(--lh-link);text-shadow:none}
body .button-search,body .button-search-end{background:transparent}
body .pagination li a{background:var(--lh-cream);border-color:var(--lh-border);color:var(--lh-petrol)}
body .pagination li.active span{background:var(--lh-petrol);border-color:var(--lh-petrol);color:#fff}
body .pagination li a:hover{background:var(--lh-petrol);color:#fff;border-color:var(--lh-petrol)}
body .tabs .tab>a{background:#e6ebdb;color:var(--lh-link);border-color:var(--lh-line)}
body .tabs .activetab>a{background:var(--lh-petrol);color:#fff}
body .rules,body .error{background:#f1f0dd;border-color:var(--lh-petrol);color:var(--lh-text)}
body .rank-img,body .rank-title{color:#3c6f57}
body .stat-block,body .stat-block h3,body .stat-block p{color:var(--lh-text);border-color:var(--lh-line)}
body hr{border-color:rgba(73,104,94,.22)}

/* ---------- Fußzeile: Bild oben, Copyright darunter ---------- */
body #page-footer .navbar{margin-top:8px}
body #page-footer .copyright{
	color:var(--lh-muted);
	padding:96px 10px 10px;
	background:url("./images/footer.jpg") center top / 100% 84px no-repeat;
	border-radius:0 0 8px 8px;
}
body #page-footer .copyright a{color:var(--lh-link)}
body ::selection{background:var(--lh-petrol);color:#fff}

/* ---------- Mobil ---------- */
@media(max-width:700px){
	body .wrap{border-radius:0}
	body .headerbar{aspect-ratio:auto;height:150px;background-size:cover}
	body ul.topiclist li.header{min-height:36px}
	body #page-footer .copyright{background-size:cover;padding-top:96px}
}
@media(max-width:500px){
	body .headerbar{height:120px}
	body .search-header{display:none}
}
