/* =============================================================================
   lp_dark — template.css
   Liquid Purple © 2026
   ============================================================================= */

/* ── CSS Custom Properties ────────────────────────────────────────────────── */
:root {
  --lp-bg:           #111318;
  --lp-bg-surface:   #1c1f26;
  --lp-bg-card:      #22262f;
  --lp-bg-nav:       #0d0f13;
  --lp-border:       #2e3340;
  --lp-text:         #d6d9e0;
  --lp-text-muted:   #858b9a;
  --lp-heading:      #eaedf2;
  --lp-accent:       #c9a227;
  --lp-accent-hover: #e2b836;
  --lp-link:         #c9a227;
  --lp-link-hover:   #e2b836;
  --lp-danger:       #e05252;
  --lp-success:      #52c07a;
  --lp-radius:       .375rem;
  --lp-font:         'Segoe UI', system-ui, -apple-system, sans-serif;
}

/* ── Base ─────────────────────────────────────────────────────────────────── */
*,
*::before,
*::after { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
  background-color: var(--lp-bg);
  color:            var(--lp-text);
  font-family:      var(--lp-font);
  font-size:        1rem;
  line-height:      1.65;
  margin:           0;
}

h1, h2, h3, h4, h5, h6 {
  color:       var(--lp-heading);
  font-weight: 600;
  line-height: 1.3;
}

a {
  color:           var(--lp-link);
  text-decoration: none;
}
a:hover, a:focus {
  color:           var(--lp-link-hover);
  text-decoration: underline;
}

img { max-width: 100%; height: auto; }

hr {
  border-color: var(--lp-border);
  opacity: 1;
}

/* ── Navbar ───────────────────────────────────────────────────────────────── */
#lp-navbar {
  background-color: var(--lp-bg-nav);
  border-bottom:    1px solid var(--lp-border);
  min-height:       3.5rem;
  position:         sticky;
  top:              0;
  z-index:          1030;
}

#lp-navbar .navbar-brand,
#lp-navbar .navbar-brand a {
  color:       var(--lp-heading);
  font-weight: 700;
  font-size:   1.25rem;
}
#lp-navbar .navbar-brand:hover,
#lp-navbar .navbar-brand a:hover {
  color: var(--lp-accent);
  text-decoration: none;
}

/* Joomla mod_menu renders a <ul>, wire it up as BS5 nav */
#lp-navbar .navbar-collapse > ul.nav,
#lp-navbar .navbar-collapse > ul {
  list-style:  none;
  margin:      0;
  padding:     0;
  display:     flex;
  flex-wrap:   wrap;
  gap:         .125rem;
}
#lp-navbar .navbar-collapse > ul.nav > li > a,
#lp-navbar .navbar-collapse > ul > li > a {
  color:       var(--lp-text);
  padding:     .5rem .85rem;
  display:     block;
  border-radius: var(--lp-radius);
  transition:  background-color .15s, color .15s;
}
#lp-navbar .navbar-collapse > ul.nav > li > a:hover,
#lp-navbar .navbar-collapse > ul > li > a:hover,
#lp-navbar .navbar-collapse > ul.nav > li.active > a,
#lp-navbar .navbar-collapse > ul > li.active > a,
#lp-navbar .navbar-collapse > ul.nav > li.current > a {
  background-color: rgba(201, 162, 39, .15);
  color:            var(--lp-accent);
  text-decoration:  none;
}

/* Dropdown menus */
#lp-navbar .dropdown-menu {
  background-color: var(--lp-bg-surface);
  border:           1px solid var(--lp-border);
  border-radius:    var(--lp-radius);
  min-width:        12rem;
}
#lp-navbar .dropdown-item {
  color: var(--lp-text);
}
#lp-navbar .dropdown-item:hover {
  background-color: var(--lp-bg-card);
  color:            var(--lp-accent);
}

/* Toggler */
#lp-navbar .navbar-toggler {
  border-color: var(--lp-border);
}
#lp-navbar .navbar-toggler-icon {
  filter: invert(1);
}

/* ── Banner ───────────────────────────────────────────────────────────────── */
#lp-banner {
  background-color: var(--lp-bg-surface);
  border-bottom:    1px solid var(--lp-border);
  padding:          .75rem 0;
}

/* ── Main layout ──────────────────────────────────────────────────────────── */
#lp-main {
  min-height: calc(100vh - 3.5rem - 200px);
  padding-top: 1rem;
}

/* ── Content area ─────────────────────────────────────────────────────────── */
#lp-content .article-info,
#lp-content .article-info-term {
  color:     var(--lp-text-muted);
  font-size: .85rem;
}

/* ── Sidebars ─────────────────────────────────────────────────────────────── */
#lp-sidebar-a,
#lp-sidebar-b {
  font-size: .9rem;
}

/* Module title in sidebars */
#lp-sidebar-a .module-title,
#lp-sidebar-b .module-title,
#lp-sidebar-a h3,
#lp-sidebar-b h3 {
  color:         var(--lp-heading);
  font-size:     1rem;
  font-weight:   600;
  padding-bottom: .4rem;
  margin-bottom:  .75rem;
  border-bottom:  2px solid var(--lp-accent);
}

/* Generic sidebar module wrapper (xhtml style) */
.moduletable {
  background-color: var(--lp-bg-card);
  border:           1px solid var(--lp-border);
  border-radius:    var(--lp-radius);
  padding:          1rem;
  margin-bottom:    1.25rem;
}

/* ── Joomla system messages ───────────────────────────────────────────────── */
#system-message-container,
.alert {
  margin-bottom: 1rem;
}
.alert-message {
  background-color: var(--lp-bg-surface);
  border:           1px solid var(--lp-border);
  border-radius:    var(--lp-radius);
  padding:          .75rem 1rem;
  color:            var(--lp-text);
}
.alert-error   { border-left: 4px solid var(--lp-danger); }
.alert-success { border-left: 4px solid var(--lp-success); }
.alert-notice  { border-left: 4px solid var(--lp-accent); }

/* ── Pagination ───────────────────────────────────────────────────────────── */
.pagination .page-link {
  background-color: var(--lp-bg-card);
  border-color:     var(--lp-border);
  color:            var(--lp-text);
}
.pagination .page-link:hover {
  background-color: var(--lp-bg-surface);
  color:            var(--lp-accent);
}
.pagination .page-item.active .page-link {
  background-color: var(--lp-accent);
  border-color:     var(--lp-accent);
  color:            #000;
}
.pagination .page-item.disabled .page-link {
  background-color: var(--lp-bg);
  border-color:     var(--lp-border);
  color:            var(--lp-text-muted);
}

/* ── Tables ───────────────────────────────────────────────────────────────── */
table {
  color:            var(--lp-text);
  border-color:     var(--lp-border);
}
.table {
  --bs-table-bg:            var(--lp-bg-card);
  --bs-table-color:         var(--lp-text);
  --bs-table-border-color:  var(--lp-border);
  --bs-table-striped-bg:    var(--lp-bg-surface);
  --bs-table-hover-bg:      rgba(201, 162, 39, .07);
}
th {
  color:       var(--lp-heading);
  font-weight: 600;
  border-color: var(--lp-border) !important;
}

/* ── Forms ────────────────────────────────────────────────────────────────── */
.form-control,
.form-select,
input[type="text"],
input[type="email"],
input[type="password"],
input[type="search"],
textarea,
select {
  background-color: var(--lp-bg-surface);
  border:           1px solid var(--lp-border);
  border-radius:    var(--lp-radius);
  color:            var(--lp-text);
}
.form-control:focus,
.form-select:focus,
input[type="text"]:focus,
input[type="email"]:focus,
input[type="search"]:focus,
textarea:focus {
  background-color: var(--lp-bg-card);
  border-color:     var(--lp-accent);
  box-shadow:       0 0 0 .2rem rgba(201, 162, 39, .25);
  color:            var(--lp-heading);
  outline:          none;
}

/* ── Buttons ──────────────────────────────────────────────────────────────── */
.btn-primary {
  background-color: var(--lp-accent);
  border-color:     var(--lp-accent);
  color:            #000;
}
.btn-primary:hover,
.btn-primary:focus {
  background-color: var(--lp-accent-hover);
  border-color:     var(--lp-accent-hover);
  color:            #000;
}
.btn-outline-primary {
  border-color: var(--lp-accent);
  color:        var(--lp-accent);
}
.btn-outline-primary:hover {
  background-color: var(--lp-accent);
  color:            #000;
}

/* ── jDownloads component overrides ──────────────────────────────────────── */
.jdownloads-container,
.jdownloads-files-list,
.jdownloads-category-view {
  color: var(--lp-text);
}

.jdownloads-file-item,
.jdownloads_file_wrap {
  background-color: var(--lp-bg-card);
  border:           1px solid var(--lp-border);
  border-radius:    var(--lp-radius);
  padding:          1rem;
  margin-bottom:    1rem;
  transition:       border-color .2s;
}
.jdownloads-file-item:hover,
.jdownloads_file_wrap:hover {
  border-color: var(--lp-accent);
}

.jdownloads-file-title a {
  color:       var(--lp-heading);
  font-weight: 600;
}
.jdownloads-file-title a:hover {
  color: var(--lp-accent);
}

/* Download button */
a.jd_download_button,
.jdownloads-download-button a {
  display:          inline-block;
  background-color: var(--lp-accent);
  color:            #000 !important;
  padding:          .4rem 1rem;
  border-radius:    var(--lp-radius);
  font-weight:      600;
  transition:       background-color .15s;
}
a.jd_download_button:hover,
.jdownloads-download-button a:hover {
  background-color: var(--lp-accent-hover);
  text-decoration:  none;
}

/* ── Footer ───────────────────────────────────────────────────────────────── */
#lp-footer {
  background-color: var(--lp-bg-nav);
  border-top:       1px solid var(--lp-border);
  color:            var(--lp-text-muted);
  font-size:        .875rem;
  margin-top:       2rem;
}

#lp-footer a {
  color: var(--lp-text-muted);
}
#lp-footer a:hover {
  color: var(--lp-accent);
}

#lp-footer-cols h3,
#lp-footer-cols h4,
#lp-footer-cols .module-title {
  color:         var(--lp-heading);
  font-size:     .95rem;
  font-weight:   600;
  margin-bottom: .75rem;
  text-transform: uppercase;
  letter-spacing: .05em;
}

#lp-copyright {
  border-top:  1px solid var(--lp-border);
  text-align:  center;
  font-size:   .8rem;
  color:       var(--lp-text-muted);
  padding:     .6rem 0;
}

/* ── BS5 overrides (dark context) ─────────────────────────────────────────── */
.card {
  background-color: var(--lp-bg-card);
  border-color:     var(--lp-border);
  color:            var(--lp-text);
}

.badge {
  font-size: .75em;
}
.badge.bg-secondary {
  background-color: var(--lp-bg-surface) !important;
  color:            var(--lp-text-muted);
}

/* ── Utility helpers ──────────────────────────────────────────────────────── */
.text-accent   { color: var(--lp-accent) !important; }
.bg-surface    { background-color: var(--lp-bg-surface) !important; }
.border-accent { border-color: var(--lp-accent) !important; }

/* ── Responsive tweaks ────────────────────────────────────────────────────── */
@media (max-width: 991.98px) {
  #lp-navbar .navbar-collapse > ul {
    flex-direction: column;
    padding: .5rem 0;
  }
  #lp-navbar .navbar-collapse > ul.nav > li > a,
  #lp-navbar .navbar-collapse > ul > li > a {
    padding: .6rem 1rem;
    border-radius: 0;
  }
}

/* ── Logo module (mod_flexi_customcode, rt-block logo-block) ──────────────── */
#lp-navbar .navbar-brand-wrap {
  display: flex;
  align-items: center;
  flex-shrink: 0;
}

#lp-navbar .logo-block {
  display:     flex;
  align-items: center;
  gap:         .5rem;
  margin:      0;
  padding:     0;
}

#lp-navbar a#rt-logo {
  width:               200px;
  height:              50px;
  background:          url(../images/logo.png) 0 0 no-repeat;
  background-size:     contain;
  display:             block;
  flex-shrink:         0;
  text-decoration:     none;
}

#lp-navbar h2#logo-text {
  margin:      0;
  font-size:   .8rem;
  line-height: 1.2;
  color:       var(--lp-heading);
  white-space: nowrap;
  overflow:    hidden;
  text-overflow: ellipsis;
  max-width:   140px;
}

/* ── Navbar nav-link / dropdown (BS5 override) ────────────────────────────── */

/* Nav items — height + centred text matching lp_bootstrap */
#lp-navbar .navbar-nav .nav-link {
  display:       block;
  height:        75px;
  padding:       4px 15px 0;
  text-align:    center;
  color:         #eee;
  vertical-align: middle;
  transition:    background-color .2s ease-out, color .2s ease-out;
  border-radius: 0;
  line-height:   1.2;
}

/* Active item — gold fill */
#lp-navbar .navbar-nav .nav-item.active > .nav-link,
#lp-navbar .navbar-nav .nav-link.active {
  background: rgba(201, 162, 39, .85);
  color:      #000 !important;
}

/* Hover / focus */
#lp-navbar .navbar-nav .nav-link:hover,
#lp-navbar .navbar-nav .nav-link:focus {
  background: var(--lp-accent);
  color:      #000 !important;
  text-decoration: none;
}

/* Dropdown menu — dark semi-transparent */
#lp-navbar .dropdown-menu {
  background:   rgba(0, 0, 0, .88);
  border:       1px solid rgba(255, 255, 255, .08);
  border-radius: 0 0 var(--lp-radius) var(--lp-radius);
  padding:      5px 5px 5px 15px;
  min-width:    12rem;
}

/* Dropdown items — gold text */
#lp-navbar .dropdown-item {
  color:      var(--lp-accent);
  padding:    .4rem .75rem;
  background: transparent;
}
#lp-navbar .dropdown-item:hover,
#lp-navbar .dropdown-item:focus {
  background: transparent;
  color:      #fff;
}
#lp-navbar .dropdown-item.active {
  background: transparent;
  color:      #fff;
  font-weight: 600;
}

/* Menu item title/subtitle split — JS adds .lp-nav-title / .lp-nav-sub */
#lp-navbar .nav-link .lp-nav-title {
  display:     block;
  font-size:   .85rem;
  font-weight: 600;
  line-height: 1.2;
  margin-top:  14px;
}
#lp-navbar .nav-link .lp-nav-sub {
  display:     block;
  font-size:   .65rem;
  font-weight: 400;
  opacity:     .8;
  line-height: 1.2;
}

/* ===== LP_DARK top section parity overrides (2026-06-14) ===== */
/* Keep major top strips unboxed (global .moduletable is too broad for these) */
#lp-cta .moduletable,
#lp-showcase .moduletable,
#lp-feature .moduletable,
#lp-showcase .moduletable > *,
#lp-feature .moduletable > * {
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  padding: 0;
}

/* CTA strip (gold bar + outlined registration button) */
#lp-cta {
  padding: 10px 0;
  background-color: #eba74a;
  border: 2px solid rgba(0,0,0,.05);
  box-shadow: 0 4px 10px rgba(0,0,0,.6);
}

#lp-cta h2 {
  color: rgba(0,0,0,.85);
  font-size: 2.3rem;
  line-height: 1.2;
  font-weight: 500;
  margin: 0;
  letter-spacing: normal;
}

#lp-cta .btn,
#lp-cta .btn:link,
#lp-cta .btn:visited {
  border: 2px solid rgba(0,0,0,.8);
  color: rgba(0,0,0,.85);
  background: transparent;
  min-width: 350px;
  font-size: 2rem;
  line-height: 1.15;
  padding: .55rem 1rem;
}
#lp-cta .btn:hover,
#lp-cta .btn:focus,
#lp-cta .btn:active {
  border-color: rgba(0,0,0,1);
  color: #eba74a;
  background-color: rgba(0,0,0,.72);
  text-decoration: none;
}
#lp-cta .btn i.fa { margin-right: .55rem; }

/* Showcase section visual framing */
#lp-showcase {
  background-image: url('/templates/lp_bootstrap/images/parallax-tile.jpg');
  background-position: 50% 0;
  background-color: #134a66;
  background-repeat: repeat;
  box-shadow: inset 0 4px 10px -2px rgba(0,0,0,.6);
}
#lp-showcase #HomeSlideshow { min-height: 330px; }
#lp-showcase .carousel-item { min-height: 280px; }
#lp-showcase .carousel-item.active { display: inline-block; }
#lp-showcase .slidebox {
  margin: 25px auto;
  width: 75%;
  max-width: 100%;
  padding: 10px 35px 15px;
  background-color: rgba(0,0,0,.42);
  border-radius: 15px;
}
#lp-showcase .slidebox h2 {
  margin: 0;
  text-align: left;
  color: #fff !important;
  text-shadow: 2px 2px #000;
  font-weight: 700;
  white-space: nowrap;
}
#lp-showcase .slidebox h3 {
  text-align: left;
  color: #ccc;
  margin: 10px 0 20px;
}
#lp-showcase .slidebox p { color: #fff; margin: 0; }
#lp-showcase .carousel-control-prev,
#lp-showcase .carousel-control-next { width: 8%; }
#lp-showcase .carousel-indicators { margin: 10px; bottom: 0; }

@media (max-width: 1200px) {
  #lp-cta h2 { font-size: 1.8rem; }
  #lp-cta .btn,
  #lp-cta .btn:link,
  #lp-cta .btn:visited { min-width: 0; width: 100%; font-size: 1.5rem; }
  #lp-showcase .slidebox { width: 90%; }
  #lp-showcase .slidebox h2 { white-space: normal; }
}

/* Top menu icons to mirror lp_bootstrap visual language */
#lp-navbar .item-1134 > .nav-link .lp-nav-title::before,
#lp-navbar .item-1135 > .nav-link .lp-nav-title::before,
#lp-navbar .item-1136 > .nav-link .lp-nav-title::before {
  display: block;
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  font-size: 1.35rem;
  line-height: 1;
  margin-bottom: .45rem;
}
#lp-navbar .item-1134 > .nav-link .lp-nav-title::before { content: "\\f091"; } /* trophy */
#lp-navbar .item-1135 > .nav-link .lp-nav-title::before { content: "\\f004"; } /* heart */
#lp-navbar .item-1136 > .nav-link .lp-nav-title::before { content: "\\f005"; } /* star */
