/* ============================
   TOPLINE LIGHT THEME
============================ */
/* --- Restore normal scrolling --- */
html, body {
  height: auto !important;
  min-height: 100% !important;
  overflow-x: hidden;
  overflow-y: auto !important;
}

/* If you used a wrapper that blocks scroll */
.tl-body {
  overflow: visible !important;
}

body.tl-body{
  background: #f8fafc;
  color: #0f172a;
}

/* Header */
.tl-header{
  background: #ffffff;
  border-bottom: 1px solid #e2e8f0;
  backdrop-filter: none;
}

/* Brand */
.tl-name,
.tl-link{
  color: #0f172a !important;
}

.btn.active {
    color: #FFFFFF !important;
}
.tl-link:hover{
  background: #f1f5f9;
  color: #0f172a !important;
}

a.btn-danger, 
a.btn-default,
a.btn-success {
	color: #FFFFFF !important;
}

a:hover.btn-danger,
a:hover.btn-default,
a:hover.btn-success {
background: #999999 !important;
border-color: #999999 !important;
color: #FFFFFF !important;
}

a:hover.btn-primary,
a:hover.btn-outline-primary {
	color: #FFFFFF !important;
}
/* Sections */
.tl-section,
.tl-section-alt{
  background: transparent;
}

/* Cards / Panels */
.tl-card,
.tl-panel,
.tl-tile{
  background: #ffffff;
  border: 1px solid #e2e8f0;
  box-shadow: 0 1px 2px rgba(0,0,0,.03);
}

/* Muted text */
.tl-muted{
  color: #475569;
}

/* Buttons */
.tl-btn-primary{
  background: #1e40af;
  color: #ffffff !important;
}

.tl-btn-primary:hover{
  background: #999999;
  color: #ffffff !important;
}

.btn-primary,
.btn-primary:visited,
.btn-primary,
.btn-primary:visted{
    background: #2b506c !important;
    color: #FFFFF !important;
}

.btn-danger,
.btn-secondary,
.btn-primary,
.btn-danger,
.btn-warning,
.btn-success{
	color: #ffffff !important;
}



.tl-btn-secondary{
  background: #ffffff;
  color: #1e40af;
  border: 1px solid #c7d2fe;
}

.tl-btn-secondary:hover{
  background: #eff6ff;
}

/* Tables */
.table{
  --bs-table-bg: transparent;
  --bs-table-color: #0f172a;
}

.table thead th{
  background: #f1f5f9;
  color: #334155;
  border-bottom: 1px solid #e2e8f0;
  font-weight: 700;
}

.table tbody td{
  border-bottom: 1px solid #e2e8f0;
}

.table tbody tr:hover{
  background: #f8fafc;
}

/* Tabs */
.nav-pills .nav-link{
  background: transparent;
  color: #475569;
}

.nav-pills .nav-link.active{
  background: transparent;
  color: #1e40af;
  border-bottom: 2px solid #1e40af;
  border-radius: 0;
}

/* Badges */
.tl-badge{
  border-radius: 999px;
  font-weight: 700;
}

.tl-badge-blue{
  color: #1e40af;
  border: 1px solid #1e40af;
  background: #eff6ff;
}

.tl-badge-gold{
  color: #92400e;
  border: 1px solid #facc15;
  background: #fef9c3;
}

.tl-badge-silver{
  color: #475569;
  border: 1px solid #cbd5e1;
  background: #f8fafc;
}

.tl-badge-slate{
  color: #475569;
  border: 1px solid #cbd5e1;
  background: #f8fafc;
}

/* Single-select only */
.form-select:not([multiple]){
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  padding-right: 2.5rem;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' stroke='%230f172a' stroke-width='2' viewBox='0 0 24 24'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 0.75rem center;
  background-size: 16px 16px;
}

/* ============================
   FIX SELECT OPTION COLORS
============================ */

/* Dropdown list items */
select option {
  color: #0f172a;
  background-color: #ffffff;
}

/* Selected option (when dropdown is open) */
select option:checked {
  background-color: #e5edff;
  color: #0f172a;
}

/* Hovered option (supported browsers only) */
select option:hover {
  background-color: #eff6ff;
  color: #0f172a;
}

/* Multi-select: no arrow */
.form-select[multiple]{
  background-image: none !important;
  padding-right: .75rem; /* reset spacing */
}

pre code {
	overflow: auto;
	max-height: 400px;
}


/* ============================
   LIGHT THEME HARD OVERRIDES
   (fix light text on light bg)
============================ */

/* Make sure ALL text defaults dark */
body,
.tl-body,
.tl-body * {
  color: inherit;
}

/* Force base text color */
body.tl-body {
  color: #0f172a !important;
  background: #f8fafc !important;
}

/* Headings + common text wrappers */
h1, h2, h3, h4, h5, h6,
.tl-hero-title,
.tl-card-title,
.tl-panel-title,
.tl-tile-title {
  color: #0f172a !important;
}

p, li, span, small, label, strong, em,
.tl-hero-sub,
.tl-kicker,
.tl-feed,
.tl-list {
  color: #0f172a !important;
}

/* Muted text should stay muted */
.tl-muted,
.tl-metric-label {
  color: #475569 !important;
}

/* Links (ensure they aren’t washed out) */
a, .tl-card-link, .tl-tile-link, .tl-panel-link, .tl-footlink {
  color: #1e40af !important;
}
a:hover, .tl-card-link:hover, .tl-tile-link:hover, .tl-panel-link:hover, .tl-footlink:hover {
  color: #1d4ed8 !important;
}

/* Navbar brand + any leftover "white" text */
.navbar-brand, .navbar-brand * {
  color: #0f172a !important;
}

/* Fix hero section if topline.css gave it dark-mode colors */
.tl-hero {
  background: transparent !important;
}

/* Custom Pills */
.custom-pills{
  display:flex;
  justify-content:center;
  flex-wrap:wrap;
  width:100%;
}


.custom-pills a {
	border-radius: 4px;
	border: 1px solid #999;
}

.custom-pills a:hover {
	background-color: #ccc;
	color: #333 !important;
	font-weight: bold;
}
/* --- Fix dropdown being cut off --- */
.tl-header,
.navbar,
.navbar .container,
.navbar-collapse {
  overflow: visible !important;
}

/* Ensure dropdown renders above everything */
.navbar .dropdown-menu {
  z-index: 1080; /* above navbar/collapse */
}


@media (max-width: 991.98px) {
  .navbar .dropdown-menu {
    position: static !important;   /* prevents off-screen cutoffs */
    float: none !important;
    width: 100%;
    margin-top: .25rem;
  }
}