/* LaLegion modern refresh - 2026-08-23
   Child style for phpBB prosilver. Keep changes here, never in prosilver. */
:root { --ll-panel: #f7f4ed; --ll-panel-soft: #fffaf0; --ll-text: #222831; --ll-red: #8f1f1b; --ll-red-dark: #5e1310; --ll-gold: #d6a94f; --ll-link: #8f1f1b; --ll-link-hover: #c3892f; --ll-shadow: 0 14px 32px rgba(0,0,0,.18); }
html, body { background: radial-gradient(circle at top left, rgba(214,169,79,.18), transparent 28rem), linear-gradient(180deg, #111820 0%, #202a35 42%, #f0eadc 42%, #f0eadc 100%); }
body { color: var(--ll-text); font-size: 14px; }
.wrap { max-width: 1180px; border: 0; border-radius: 0 0 14px 14px; box-shadow: var(--ll-shadow); background: rgba(255,250,240,.96); }
.headerbar { min-height: 118px; height: auto; border-radius: 0 0 12px 12px; border: 1px solid rgba(214,169,79,.32); background: linear-gradient(90deg, rgba(15,19,24,.90), rgba(80,20,17,.74)), url("./images/bg_header.gif") center/cover repeat-x; box-shadow: inset 0 -1px 0 rgba(255,255,255,.08); }
.headerbar .inner { padding: 18px 22px; }
.site-description { display: flex; align-items: center; gap: 18px; min-height: 76px; }
.logo { padding: 0; }
.site_logo { background-image: url("./images/site_logo.jpg"); background-size: contain; background-repeat: no-repeat; background-position: left center; display: inline-block; width: 240px; height: 60px; filter: drop-shadow(0 4px 10px rgba(0,0,0,.35)); }
h1 { margin: 0; font-size: clamp(1.45rem, 2.3vw, 2.15rem); font-weight: 700; letter-spacing: .02em; text-shadow: 0 2px 8px rgba(0,0,0,.45); }
.site-description p { margin: .25rem 0 0; color: rgba(255,255,255,.82); }
.navbar { border-radius: 10px; border: 1px solid rgba(143,31,27,.18); background: linear-gradient(180deg, #fffaf0 0%, #efe3c7 100%); box-shadow: 0 4px 14px rgba(0,0,0,.08); }
.navbar a, .dropdown-contents a { color: var(--ll-red-dark); }
.navbar a:hover, .dropdown-contents a:hover { color: var(--ll-link-hover); text-decoration: none; }
.forabg, .forumbg { border-radius: 12px; background: linear-gradient(180deg, rgba(143,31,27,.96), rgba(94,19,16,.96)), url("./images/bg_list.gif") center/cover repeat; box-shadow: 0 8px 20px rgba(94,19,16,.18); }
.forabg .header a, .forumbg .header a, .forabg .header dt, .forumbg .header dt, .forabg .header dd, .forumbg .header dd { color: #fff8e6; }
ul.forums, ul.topiclist li.row { background-color: var(--ll-panel); }
ul.topiclist li.row { border-top-color: rgba(143,31,27,.14); transition: background-color .16s ease, box-shadow .16s ease; }
ul.topiclist li.row:hover { background-color: var(--ll-panel-soft); box-shadow: inset 4px 0 0 var(--ll-gold); }
li.row strong, li.row a.forumtitle, a.topictitle { color: var(--ll-link); }
li.row a.forumtitle:hover, a.topictitle:hover { color: var(--ll-link-hover); }
.panel, .post, .bg1, .bg2, .bg3 { border-radius: 10px; }
.post { border: 1px solid rgba(143,31,27,.10); box-shadow: 0 3px 12px rgba(0,0,0,.05); }
.button, .button1, .button2, input.button1, input.button2, a.button1, a.button2 { border-radius: 999px; border-color: #b88a3b; background: linear-gradient(180deg, #f8dfa6 0%, #d5a24b 100%); color: #3b2412; box-shadow: 0 2px 7px rgba(0,0,0,.10); }
.button:hover, .button1:hover, .button2:hover, input.button1:hover, input.button2:hover, a.button1:hover, a.button2:hover { border-color: var(--ll-red); background: linear-gradient(180deg, #ffe9b7 0%, #e1ad56 100%); color: var(--ll-red-dark); }
.search-box .inputbox, .inputbox { border-radius: 8px; border-color: rgba(143,31,27,.25); }
.search-header { box-shadow: 0 8px 18px rgba(0,0,0,.20); }
.breadcrumbs .crumb a { color: var(--ll-red-dark); }
.copyright { color: #6f6250; }
.icon-appfoto { background-image: url("./images/icon_appfoto.gif"); }
.icon-fb { background-image: url("./images/icon_fb.gif"); }
.icon-lalegionde { background-image: url("./images/icon_lalegionde.gif"); }
.icon-picture { background-image: url("./images/icon_picture.gif"); }
.icon-tv { background-image: url("./images/icon_tv.gif"); }
.icon-upload { background-image: url("./images/icon_upload.gif"); }
@media (max-width: 700px) { .wrap { border-radius: 0; } .headerbar .inner { padding: 14px; } .site-description { align-items: flex-start; gap: 10px; flex-direction: column; } .site_logo { width: 200px; height: 50px; } .headerbar { min-height: 140px; } }


/* LaLegion classic split forum headings - 2026-08-23
   Old-style forum bars: red title area at left, sharp diagonal split, green columns to the right. */
.forabg,
.forumbg {
  border-radius: 11px 11px 0 0;
  border: 4px solid #8f1b18;
  border-bottom-width: 0;
  background: transparent !important;
  box-shadow: none;
}
.forabg .inner,
.forumbg .inner {
  margin: 0;
  border-radius: 7px 7px 0 0;
  overflow: hidden;
}
.forabg .header,
.forumbg .header,
ul.topiclist li.header {
  min-height: 30px;
  padding-top: 0;
  padding-bottom: 0;
  border-radius: 7px 7px 0 0;
  background: linear-gradient(135deg,
    #b11418 0,
    #b11418 28%,
    #8f1b18 28.2%,
    #8f1b18 29.8%,
    #24723e 30%,
    #1f6338 100%) !important;
  border: 0;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.18);
}
.forabg .header dt,
.forumbg .header dt,
ul.topiclist li.header dt {
  padding: 7px 0 6px 7px;
  color: #fff7dc !important;
  font-size: 12px;
  line-height: 16px;
  font-weight: 700;
  text-transform: uppercase;
  text-shadow: 0 1px 1px #000;
}
.forabg .header dd,
.forumbg .header dd,
ul.topiclist li.header dd {
  padding-top: 7px;
  color: #fff7dc !important;
  font-size: 13px;
  line-height: 16px;
  font-weight: 700;
  text-transform: uppercase;
  text-align: center;
  text-shadow: 0 1px 1px #000;
}
.forabg .header a,
.forumbg .header a,
ul.topiclist li.header a {
  color: #fff7dc !important;
  text-shadow: 0 1px 1px #000;
}
ul.topiclist.forums {
  border-left: 4px solid #8f1b18;
  border-right: 4px solid #8f1b18;
}

/* LaLegion compact header repair - 2026-08-23
   Fix over-tall forum bars: one-line classic 30px header like old forum. */
.forabg,
.forumbg {
  border-width: 3px !important;
  border-bottom-width: 0 !important;
  border-radius: 10px 10px 0 0 !important;
  margin-bottom: 8px;
}
.forabg .inner,
.forumbg .inner {
  border-radius: 7px 7px 0 0 !important;
}
.forabg .header,
.forumbg .header,
ul.topiclist li.header {
  height: 30px !important;
  min-height: 30px !important;
  max-height: 30px !important;
  overflow: hidden !important;
  line-height: 30px !important;
  background: linear-gradient(135deg,
    #b11418 0,
    #b11418 27%,
    #8f1b18 27.2%,
    #8f1b18 29.1%,
    #24723e 29.3%,
    #1f6338 100%) !important;
}
ul.topiclist li.header dl,
ul.topiclist li.header dt,
ul.topiclist li.header dd {
  height: 30px !important;
  min-height: 30px !important;
  max-height: 30px !important;
  line-height: 30px !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis;
  box-sizing: border-box;
}
ul.topiclist li.header dt {
  padding-left: 8px !important;
  font-size: 11px !important;
}
ul.topiclist li.header dd {
  font-size: 12px !important;
  text-align: center !important;
}
ul.topiclist li.header dd.lastpost {
  text-align: left !important;
  padding-left: 10px !important;
}

/* LaLegion horizontal classic forum boxes - 2026-08-23
   Revert failed diagonal split: red top fade into green, blue closed forum box. */
.forabg,
.forumbg {
  border: 5px solid #0076a8 !important;
  border-radius: 7px !important;
  background: #d9e8f2 !important;
  box-shadow: none !important;
  overflow: hidden !important;
  margin: 12px 0 8px !important;
}
.forabg .inner,
.forumbg .inner {
  margin: 0 !important;
  border-radius: 0 !important;
  overflow: hidden !important;
}
.forabg .header,
.forumbg .header,
ul.topiclist li.header {
  height: 35px !important;
  min-height: 35px !important;
  max-height: 35px !important;
  line-height: 35px !important;
  overflow: hidden !important;
  border-radius: 0 !important;
  background: linear-gradient(180deg,
    #e10013 0%,
    #bd1118 36%,
    #7d241d 58%,
    #0b6f33 78%,
    #00622c 100%) !important;
  border: 0 !important;
  box-shadow: none !important;
}
ul.topiclist li.header dl,
ul.topiclist li.header dt,
ul.topiclist li.header dd {
  height: 35px !important;
  min-height: 35px !important;
  max-height: 35px !important;
  line-height: 35px !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  margin: 0 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis;
  box-sizing: border-box;
}
ul.topiclist li.header dt {
  padding-left: 7px !important;
  color: #fff8e6 !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  text-shadow: 0 1px 1px #000 !important;
}
ul.topiclist li.header dd {
  color: #fff8e6 !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  text-align: center !important;
  text-shadow: 0 1px 1px #000 !important;
}
ul.topiclist li.header dd.lastpost {
  text-align: left !important;
  padding-left: 10px !important;
}
.forabg ul.topiclist.forums,
.forumbg ul.topiclist.topics,
.forumbg ul.topiclist.forums,
ul.topiclist.forums {
  border: 0 !important;
  margin: 0 !important;
  background: #d9e8f2 !important;
}
.forabg ul.topiclist li.row:last-child,
.forumbg ul.topiclist li.row:last-child {
  border-bottom: 0 !important;
}

/* LaLegion brown forum border correction - 2026-08-23
   Keep horizontal red/green header, but use the original brown/red-brown frame. */
.forabg,
.forumbg {
  border-color: #8f1b18 !important;
}

/* LaLegion uniform page background - 2026-08-23
   Remove the dark-to-beige page split: keep the whole page beige while headers carry the color. */
html,
body {
  background: #f0eadc !important;
  background-image: none !important;
}

/* LaLegion navbar polish - 2026-08-23
   Turn the raw link line into a compact old-forum toolbar. */
.navbar {
  min-height: 38px;
  padding: 5px 8px !important;
  border: 1px solid rgba(143, 27, 24, .28) !important;
  border-radius: 7px !important;
  background: linear-gradient(180deg, #fff8e8 0%, #eadcc1 100%) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.75), 0 1px 3px rgba(80,35,20,.12) !important;
}
.navbar .inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-height: 28px;
}
.navbar ul.linklist {
  display: flex;
  align-items: center;
  gap: 3px;
  margin: 0 !important;
  padding: 0 !important;
  flex-wrap: wrap;
}
.navbar ul.linklist.rightside {
  justify-content: flex-end;
  margin-left: auto !important;
}
.navbar li {
  display: inline-flex !important;
  align-items: center;
  margin: 0 !important;
  padding: 0 !important;
  line-height: 24px !important;
}
.navbar a,
.navbar .dropdown-trigger {
  display: inline-flex !important;
  align-items: center;
  gap: 3px;
  min-height: 24px;
  padding: 2px 7px !important;
  border-radius: 999px;
  color: #6f100d !important;
  font-size: 13px;
  line-height: 20px !important;
  text-decoration: none !important;
  text-shadow: 0 1px 0 rgba(255,255,255,.7);
}
.navbar a:hover,
.navbar .dropdown-trigger:hover,
.navbar li:hover > a {
  background: rgba(143,27,24,.12) !important;
  color: #006b32 !important;
  box-shadow: inset 0 0 0 1px rgba(143,27,24,.12);
}
.navbar .icon,
.navbar .button,
.navbar i {
  color: #7e1613 !important;
}
.navbar a:hover .icon,
.navbar a:hover i {
  color: #006b32 !important;
}
.navbar .username,
.navbar .username-coloured {
  color: #008a2e !important;
  font-weight: 700 !important;
}
.navbar img.avatar,
.navbar .avatar img {
  width: 24px !important;
  height: 24px !important;
  border-radius: 3px !important;
  margin: 0 3px !important;
  vertical-align: middle;
  box-shadow: 0 0 0 1px rgba(143,27,24,.25);
}
.navbar + .navbar,
#nav-breadcrumbs {
  margin-top: 4px;
}
@media (max-width: 800px) {
  .navbar .inner { align-items: flex-start; flex-direction: column; gap: 4px; }
  .navbar ul.linklist.rightside { margin-left: 0 !important; justify-content: flex-start; }
  .navbar a, .navbar .dropdown-trigger { font-size: 12px; padding: 2px 6px !important; }
}

/* LaLegion navbar visibility/overlap fix - 2026-08-23
   Buttons visible without hover; legacy bitmap icons no longer overlap text. */
.navbar a,
.navbar .dropdown-trigger {
  position: relative;
  min-height: 24px !important;
  padding: 2px 8px !important;
  border: 1px solid rgba(143,27,24,.22) !important;
  background: rgba(255,250,235,.78) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.75) !important;
}
.navbar a:hover,
.navbar .dropdown-trigger:hover,
.navbar li:hover > a {
  border-color: rgba(0,107,50,.35) !important;
  background: rgba(226,241,221,.95) !important;
}
/* phpBB/LaLegion legacy small-icon classes put bitmap icons on the LI. Give text room. */
.navbar li.small-icon,
.navbar li[class^="icon-"],
.navbar li[class*=" icon-"] {
  background-position: 6px 50% !important;
  background-repeat: no-repeat !important;
}
.navbar li.small-icon > a,
.navbar li[class^="icon-"] > a,
.navbar li[class*=" icon-"] > a {
  padding-left: 25px !important;
}
/* FontAwesome icons are inline; keep a fixed gap from text. */
.navbar a > .icon,
.navbar a > i.icon,
.navbar a > i.fa,
.navbar .dropdown-trigger > .icon,
.navbar .dropdown-trigger > i.icon,
.navbar .dropdown-trigger > i.fa {
  display: inline-block !important;
  flex: 0 0 auto !important;
  width: 15px !important;
  min-width: 15px !important;
  margin-right: 4px !important;
  text-align: center !important;
}
/* User/avatar area: avatar must not sit on top of the username. */
.navbar .username,
.navbar .username-coloured {
  margin-left: 4px !important;
  display: inline-block !important;
  line-height: 22px !important;
}
.navbar img.avatar,
.navbar .avatar img {
  flex: 0 0 auto !important;
  margin-right: 5px !important;
}

/* LaLegion navbar alignment fix - 2026-08-23
   User tools right aligned, breadcrumbs/Foren-Übersicht on second line, hide search magnifier. */
.navbar .inner {
  display: block !important;
}
#nav-main {
  display: flex !important;
  align-items: center !important;
  width: 100% !important;
  gap: 3px !important;
  flex-wrap: wrap !important;
}
#nav-main > li.rightside,
#nav-main > li#username_logged_in {
  margin-left: 0 !important;
}
#nav-main > li.rightside:first-of-type,
#nav-main > li#username_logged_in:first-of-type {
  margin-left: auto !important;
}
/* Robust fallback: the first user/tool item pushes all following rightside items to the far right. */
#nav-main > li#username_logged_in {
  margin-left: auto !important;
}
#nav-main > li.rightside {
  align-self: center !important;
}
#nav-breadcrumbs {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  clear: both !important;
  width: 100% !important;
  margin-top: 5px !important;
  padding-top: 5px !important;
  border-top: 1px solid rgba(143,27,24,.18) !important;
}
#nav-breadcrumbs > li {
  margin-left: 0 !important;
}
#nav-breadcrumbs .responsive-search,
#nav-breadcrumbs li.responsive-search,
li.responsive-search,
a[title="Search advanced"],
a[title="Erweiterte Suche"],
a[title="Recherche avancée"] {
  display: none !important;
}
@media (max-width: 800px) {
  #nav-main > li#username_logged_in { margin-left: 0 !important; }
  #nav-main { justify-content: flex-start !important; }
}

/* LaLegion red/green visible menu buttons + hover descriptions - 2026-08-23
   Permanent button color, and visible hover labels for personal area + notifications. */
.navbar a,
.navbar .dropdown-trigger {
  border: 1px solid rgba(90,20,15,.45) !important;
  background: linear-gradient(180deg, #b31618 0%, #8f1b18 48%, #0f7035 52%, #075a28 100%) !important;
  color: #fff8e6 !important;
  text-shadow: 0 1px 1px rgba(0,0,0,.75) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.22), 0 1px 2px rgba(70,25,15,.18) !important;
}
.navbar a span,
.navbar .dropdown-trigger span,
.navbar a strong,
.navbar .dropdown-trigger strong,
.navbar .username,
.navbar .username-coloured {
  color: #fff8e6 !important;
  text-shadow: 0 1px 1px rgba(0,0,0,.75) !important;
}
.navbar a:hover,
.navbar .dropdown-trigger:hover,
.navbar li:hover > a {
  border-color: rgba(255,235,170,.75) !important;
  background: linear-gradient(180deg, #d21b20 0%, #a51d1b 45%, #158746 55%, #087033 100%) !important;
  color: #ffffff !important;
}
.navbar .icon,
.navbar i,
.navbar a:hover .icon,
.navbar a:hover i {
  color: #fff2cf !important;
  text-shadow: 0 1px 1px rgba(0,0,0,.75) !important;
}
.navbar .badge {
  background: #fff2cf !important;
  color: #7a1512 !important;
  text-shadow: none !important;
  border: 1px solid rgba(90,20,15,.35);
}
.header-profile,
#notification_list_button {
  position: relative !important;
}
.header-profile > .header-avatar::after,
#notification_list_button::after {
  position: absolute;
  z-index: 9999;
  top: calc(100% + 7px);
  right: 0;
  display: none;
  width: max-content;
  max-width: 220px;
  padding: 5px 8px;
  border: 1px solid #8f1b18;
  border-radius: 5px;
  background: #fff8e8;
  color: #6f100d;
  font-size: 12px;
  line-height: 15px;
  font-weight: 700;
  text-shadow: none;
  box-shadow: 0 3px 10px rgba(0,0,0,.18);
  pointer-events: none;
  white-space: nowrap;
}
.header-profile > .header-avatar::after {
  content: "Persönlicher Bereich";
}
#notification_list_button::after {
  content: "Benachrichtigungen";
}
.header-profile:hover > .header-avatar::after,
.header-profile > .header-avatar:hover::after,
#notification_list_button:hover::after,
#notification_list_button:focus::after {
  display: block;
}

/* LaLegion profile tooltip icon correction - 2026-08-23
   Tooltip for personal area belongs to the small icon, not the username text. */
.header-profile > .header-avatar::after {
  content: none !important;
  display: none !important;
}
.header-profile > .header-avatar {
  gap: 4px !important;
}
.ll-profile-icon {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 20px !important;
  min-width: 20px !important;
  height: 20px !important;
  margin-right: 3px !important;
  border-radius: 50% !important;
  background: rgba(255,248,230,.18) !important;
  color: #fff2cf !important;
}
.ll-profile-icon::after {
  content: "Persönlicher Bereich";
  position: absolute;
  z-index: 9999;
  top: calc(100% + 8px);
  right: 0;
  display: none;
  width: max-content;
  max-width: 220px;
  padding: 5px 8px;
  border: 1px solid #8f1b18;
  border-radius: 5px;
  background: #fff8e8;
  color: #6f100d;
  font-size: 12px;
  line-height: 15px;
  font-weight: 700;
  text-shadow: none;
  box-shadow: 0 3px 10px rgba(0,0,0,.18);
  pointer-events: none;
  white-space: nowrap;
}
.ll-profile-icon:hover::after,
.ll-profile-icon:focus::after {
  display: block;
}

/* LaLegion remove extra user toolbar controls - 2026-08-23
   Remove unused personal-area icon, PM/inbox button between user and notifications, and small dropdown arrow. */
.ll-profile-icon,
#username_logged_in .dropdown,
#username_logged_in .pointer,
#username_logged_in .dropdown-trigger::after,
#username_logged_in .dropdown-trigger::before,
#username_logged_in .header-avatar::after,
#username_logged_in .header-avatar::before {
  display: none !important;
  content: none !important;
}
/* Hide the private messages/inbox toolbar button between username and notifications. */
#nav-main > li.rightside:has(a[href*="ucp.php?i=pm"]),
#nav-main > li.rightside:has(a[href*="folder=inbox"]),
#nav-main > li.rightside:has(a .fa-inbox) {
  display: none !important;
}
#username_logged_in .header-profile,
#username_logged_in .header-avatar {
  overflow: visible !important;
}

/* LaLegion hard remove PM + username dropdown arrow - 2026-08-23 */
#username_logged_in .dropdown,
#username_logged_in .pointer,
#username_logged_in .header-profile::before,
#username_logged_in .header-profile::after,
#username_logged_in .header-avatar::before,
#username_logged_in .header-avatar::after {
  display: none !important;
  visibility: hidden !important;
  width: 0 !important;
  height: 0 !important;
  min-width: 0 !important;
  min-height: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  content: none !important;
}

/* LaLegion notification icon only - 2026-08-23
   Keep bell visible, hide text label visually; description remains via title/CSS tooltip. */
#notification_list_button span,
#notification_list_button .sr-only {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}
#notification_list_button {
  min-width: 34px !important;
  justify-content: center !important;
  padding-left: 8px !important;
  padding-right: 8px !important;
}
#notification_list_button .icon,
#notification_list_button i {
  margin-right: 0 !important;
}
#notification_list_button .badge:not(.hidden) {
  position: absolute !important;
  top: -5px !important;
  right: -5px !important;
}