/* ============================================================
   GHS TACTICAL THEME — Greenhat Solutions Shoothouse
   Greenhat Solutions | greenhatsolutions.com
   Override layer — loads after all other stylesheets
   ============================================================ */

/* --- FONTS --- */
@import url('https://fonts.googleapis.com/css2?family=Share+Tech+Mono&family=Rajdhani:wght@400;600;700&display=swap');

/* --- ROOT VARIABLES --- */
:root {
  --ghs-black:       #0a0a0a;
  --ghs-dark:        #111314;
  --ghs-panel:       #161a1d;
  --ghs-border:      #2a3a2a;
  --ghs-green:       #39ff14;
  --ghs-green-dim:   #1a7a00;
  --ghs-green-glow:  rgba(57,255,20,0.15);
  --ghs-amber:       #ffb300;
  --ghs-red:         #ff3c3c;
  --ghs-text:        #c8d8c8;
  --ghs-text-dim:    #6a8a6a;
  --ghs-font-mono:   'Share Tech Mono', monospace;
  --ghs-font-ui:     'Rajdhani', sans-serif;
}

/* --- GLOBAL RESET OVERRIDES --- */
*, *::before, *::after {
  box-sizing: border-box;
}

html, body {
  background-color: var(--ghs-black) !important;
  color: var(--ghs-text) !important;
  font-family: var(--ghs-font-ui) !important;
  font-size: 15px;
  line-height: 1.6;
}

/* --- SCANLINE OVERLAY (subtle texture) --- */
body::before {
  content: '';
  position: fixed;
  top: 0; left: 0;
  width: 100%; height: 100%;
  pointer-events: none;
  z-index: 9999;
  background: repeating-linear-gradient(
    0deg,
    transparent,
    transparent 2px,
    rgba(0,0,0,0.03) 2px,
    rgba(0,0,0,0.03) 4px
  );
}

/* --- TYPOGRAPHY --- */
h1, h2, h3, h4, h5, h6 {
  font-family: var(--ghs-font-ui) !important;
  font-weight: 700 !important;
  color: var(--ghs-green) !important;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

a, a:visited {
  color: var(--ghs-green) !important;
  text-decoration: none !important;
  transition: color 0.2s, text-shadow 0.2s;
}
a:hover {
  color: #fff !important;
  text-shadow: 0 0 8px var(--ghs-green);
}

p, li, td, th, label, span, div {
  color: var(--ghs-text);
}

code, pre, .preformatted {
  font-family: var(--ghs-font-mono) !important;
  background-color: #000 !important;
  color: var(--ghs-green) !important;
  border: 1px solid var(--ghs-border) !important;
  border-radius: 3px;
}

/* --- NAVBAR --- */
.navbar, .navbar-inner {
  background: var(--ghs-dark) !important;
  background-image: none !important;
  border-bottom: 2px solid var(--ghs-green-dim) !important;
  box-shadow: 0 2px 12px rgba(57,255,20,0.10) !important;
  min-height: 50px !important;
}

.navbar .brand, .navbar .brand:hover {
  font-family: var(--ghs-font-ui) !important;
  font-weight: 700 !important;
  font-size: 1.3rem !important;
  color: var(--ghs-green) !important;
  text-transform: uppercase !important;
  letter-spacing: 0.12em !important;
  text-shadow: 0 0 10px var(--ghs-green) !important;
  padding: 12px 16px !important;
}

.navbar .nav > li > a {
  font-family: var(--ghs-font-ui) !important;
  font-weight: 600 !important;
  font-size: 0.95rem !important;
  color: var(--ghs-text) !important;
  text-transform: uppercase !important;
  letter-spacing: 0.06em !important;
  padding: 14px 12px !important;
  background: transparent !important;
  border: none !important;
  transition: color 0.2s, background 0.2s;
}

.navbar .nav > li > a:hover,
.navbar .nav > li.active > a {
  color: var(--ghs-green) !important;
  background: var(--ghs-green-glow) !important;
  text-shadow: 0 0 6px var(--ghs-green);
}

/* Hamburger button (mobile) */
.btncollapse {
  background: transparent !important;
  border: 1px solid var(--ghs-green-dim) !important;
  color: var(--ghs-green) !important;
  border-radius: 3px !important;
  padding: 7px 10px !important;
  margin: 8px 8px 8px 0 !important;
  display: none;
}

/* Dropdown menus */
.dropdown-menu {
  background-color: var(--ghs-panel) !important;
  border: 1px solid var(--ghs-border) !important;
  border-radius: 4px !important;
  box-shadow: 0 4px 20px rgba(0,0,0,0.7) !important;
  min-width: 180px;
}

.dropdown-menu li > a {
  color: var(--ghs-text) !important;
  font-family: var(--ghs-font-ui) !important;
  font-weight: 600 !important;
  font-size: 0.9rem !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
  padding: 8px 16px !important;
  transition: background 0.15s;
}

.dropdown-menu li > a:hover {
  background-color: var(--ghs-green-glow) !important;
  color: var(--ghs-green) !important;
}

.dropdown-menu .divider {
  background-color: var(--ghs-border) !important;
}

/* User button (pull-right) */
.btn-group.pull-right .btn {
  background: transparent !important;
  border: 1px solid var(--ghs-green-dim) !important;
  color: var(--ghs-green) !important;
  font-family: var(--ghs-font-ui) !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
  transition: all 0.2s;
}

.btn-group.pull-right .btn:hover {
  background: var(--ghs-green-glow) !important;
  border-color: var(--ghs-green) !important;
  box-shadow: 0 0 8px var(--ghs-green-dim) !important;
}

/* --- CONTAINERS & PANELS --- */
.container-fluid {
  padding-top: 12px !important;
}

.well {
  background-color: var(--ghs-panel) !important;
  border: 1px solid var(--ghs-border) !important;
  border-radius: 4px !important;
  box-shadow: none !important;
  color: var(--ghs-text) !important;
}

.panel, .hero-unit {
  background-color: var(--ghs-panel) !important;
  border: 1px solid var(--ghs-border) !important;
  border-radius: 4px !important;
  color: var(--ghs-text) !important;
}

/* --- TABLES --- */
table {
  width: 100%;
  border-collapse: collapse;
}

.table {
  color: var(--ghs-text) !important;
  font-family: var(--ghs-font-mono) !important;
  font-size: 0.88rem !important;
}

.table th {
  background-color: var(--ghs-panel) !important;
  color: var(--ghs-green) !important;
  font-family: var(--ghs-font-ui) !important;
  font-size: 0.85rem !important;
  text-transform: uppercase !important;
  letter-spacing: 0.1em !important;
  border-bottom: 2px solid var(--ghs-green-dim) !important;
  padding: 10px 12px !important;
}

.table td {
  border-top: 1px solid var(--ghs-border) !important;
  padding: 8px 12px !important;
  vertical-align: middle !important;
}

.table-striped tbody tr:nth-child(odd) td {
  background-color: rgba(255,255,255,0.02) !important;
}

.table-hover tbody tr:hover td {
  background-color: var(--ghs-green-glow) !important;
}

/* --- BUTTONS --- */
.btn {
  font-family: var(--ghs-font-ui) !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.06em !important;
  border-radius: 3px !important;
  transition: all 0.2s !important;
}

.btn-primary, .btn-success {
  background: transparent !important;
  background-image: none !important;
  border: 1px solid var(--ghs-green) !important;
  color: var(--ghs-green) !important;
  box-shadow: none !important;
  text-shadow: none !important;
}

.btn-primary:hover, .btn-success:hover {
  background: var(--ghs-green-glow) !important;
  box-shadow: 0 0 8px var(--ghs-green-dim) !important;
}

.btn-danger, .btn-warning {
  background: transparent !important;
  background-image: none !important;
  border: 1px solid var(--ghs-red) !important;
  color: var(--ghs-red) !important;
  box-shadow: none !important;
  text-shadow: none !important;
}

.btn-danger:hover, .btn-warning:hover {
  background: rgba(255,60,60,0.12) !important;
}

.btn-info {
  background: transparent !important;
  background-image: none !important;
  border: 1px solid var(--ghs-amber) !important;
  color: var(--ghs-amber) !important;
  box-shadow: none !important;
  text-shadow: none !important;
}

/* --- FORMS --- */
input[type="text"],
input[type="password"],
input[type="email"],
input[type="number"],
textarea,
select {
  background-color: var(--ghs-dark) !important;
  border: 1px solid var(--ghs-border) !important;
  border-radius: 3px !important;
  color: var(--ghs-text) !important;
  font-family: var(--ghs-font-mono) !important;
  padding: 6px 10px !important;
  transition: border-color 0.2s, box-shadow 0.2s;
  width: 100%;
}

input:focus, textarea:focus, select:focus {
  border-color: var(--ghs-green) !important;
  box-shadow: 0 0 6px var(--ghs-green-dim) !important;
  outline: none !important;
}

/* --- ALERTS / NOTIFICATIONS --- */
.alert {
  border-radius: 3px !important;
  font-family: var(--ghs-font-mono) !important;
  font-size: 0.9rem !important;
  border-left: 4px solid var(--ghs-amber) !important;
  background: rgba(255,179,0,0.08) !important;
  color: var(--ghs-text) !important;
}

.alert-success {
  border-left-color: var(--ghs-green) !important;
  background: var(--ghs-green-glow) !important;
}

.alert-error, .alert-danger {
  border-left-color: var(--ghs-red) !important;
  background: rgba(255,60,60,0.08) !important;
}

/* --- FOOTER --- */
footer {
  background: var(--ghs-dark) !important;
  border-top: 1px solid var(--ghs-border) !important;
}

.footernav {
  font-family: var(--ghs-font-mono) !important;
  font-size: 0.75rem !important;
  color: var(--ghs-text-dim) !important;
  padding: 6px 20px !important;
}

.footernav a {
  color: var(--ghs-text-dim) !important;
}

.footernav a:hover {
  color: var(--ghs-green) !important;
}

/* --- SCOREBOARD SPECIFIC --- */
.score-rank {
  font-family: var(--ghs-font-mono) !important;
  font-size: 1.1rem !important;
  color: var(--ghs-amber) !important;
  font-weight: bold;
}

.score-points {
  font-family: var(--ghs-font-mono) !important;
  color: var(--ghs-green) !important;
  font-weight: bold;
}

/* Top 3 row highlight */
tr.rank-1 td { border-left: 3px solid gold !important; }
tr.rank-2 td { border-left: 3px solid silver !important; }
tr.rank-3 td { border-left: 3px solid #cd7f32 !important; }

/* Progress bars */
.progress {
  background: var(--ghs-dark) !important;
  border: 1px solid var(--ghs-border) !important;
  border-radius: 2px !important;
  box-shadow: none !important;
  height: 14px !important;
}

.progress .bar, .progress-bar {
  background-color: var(--ghs-green-dim) !important;
  background-image: none !important;
  box-shadow: 0 0 6px var(--ghs-green) !important;
}

/* --- BADGES & LABELS --- */
.badge, .label {
  font-family: var(--ghs-font-mono) !important;
  font-size: 0.78rem !important;
  border-radius: 2px !important;
}

.label-success, .badge-success {
  background-color: var(--ghs-green-dim) !important;
  color: #fff !important;
}

.label-important, .badge-important {
  background-color: var(--ghs-red) !important;
}

/* ============================================================
   MOBILE RESPONSIVE OVERRIDES
   Bootstrap 2 doesn't handle this well — we fix it here
   ============================================================ */

@media (max-width: 767px) {

  body {
    padding-top: 54px !important;
    font-size: 14px !important;
  }

  /* Show hamburger, collapse nav */
  .btncollapse {
    display: block !important;
    float: left !important;
  }

  .navbar-inner {
    padding: 6px 10px !important;
  }

  .navbar .brand {
    font-size: 1rem !important;
    padding: 10px 8px !important;
  }

  /* Hide desktop nav, show on toggle */
  .nav-collapse {
    clear: both;
    overflow: hidden;
    max-height: 0;
    transition: max-height 0.3s ease;
  }

  .nav-collapse.in {
    max-height: 1200px !important;
  }

  .navbar .nav {
    float: none !important;
    display: block !important;
    margin: 0 !important;
  }

  .navbar .nav > li {
    display: block !important;
    float: none !important;
  }

  .navbar .nav > li > a {
    display: block !important;
    padding: 10px 14px !important;
    border-bottom: 1px solid var(--ghs-border) !important;
  }

  /* Dropdowns go full width on mobile */
  .dropdown-menu {
    position: static !important;
    float: none !important;
    width: 100% !important;
    background: var(--ghs-black) !important;
    border: none !important;
    border-left: 3px solid var(--ghs-green-dim) !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    display: none;
  }

  .open > .dropdown-menu {
    display: block !important;
  }

  /* Pull-right user button goes full width */
  .btn-group.pull-right {
    float: none !important;
    display: block !important;
    width: 100% !important;
    margin-top: 4px;
  }

  .btn-group.pull-right .btn {
    width: 100% !important;
    text-align: left !important;
  }

  /* Notifications collapse to full width */
  .nav-collapse.pull-right {
    float: none !important;
    width: 100% !important;
  }

  /* Tables scroll horizontally on small screens */
  .table-responsive-wrapper {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  table {
    min-width: 500px;
  }

  /* Container padding */
  .container-fluid {
    padding-left: 10px !important;
    padding-right: 10px !important;
  }

  /* Forms full width */
  input[type="text"],
  input[type="password"],
  input[type="email"],
  textarea,
  select {
    width: 100% !important;
  }

  /* Scoreboard stacking */
  .span1, .span2, .span3, .span4,
  .span5, .span6, .span7, .span8 {
    width: 100% !important;
    margin-left: 0 !important;
    float: none !important;
  }

  /* Footer */
  footer {
    position: relative !important;
    bottom: auto !important;
  }
}

@media (max-width: 480px) {
  .navbar .brand {
    max-width: 55vw;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  h1 { font-size: 1.4rem !important; }
  h2 { font-size: 1.2rem !important; }
  h3 { font-size: 1.1rem !important; }

  .table { font-size: 0.78rem !important; }
}

/* ============================================================
   GHS BRANDING ACCENT
   ============================================================ */

/* Green left-border accent on active page sections */
.page-header {
  border-bottom: 2px solid var(--ghs-green-dim) !important;
  margin-bottom: 16px !important;
}

.page-header h1, .page-header h2 {
  font-family: var(--ghs-font-ui) !important;
  color: var(--ghs-green) !important;
}

/* Glowing green dot for live/active status indicators */
.status-live::before {
  content: '● ';
  color: var(--ghs-green);
  animation: pulse-green 1.5s infinite;
}

@keyframes pulse-green {
  0%, 100% { opacity: 1; }
  50%       { opacity: 0.3; }
}

/* Terminal-style flag submission box */
.flag-input-wrap {
  background: #000;
  border: 1px solid var(--ghs-green-dim);
  border-radius: 4px;
  padding: 12px;
  font-family: var(--ghs-font-mono);
}

.flag-input-wrap::before {
  content: 'FLAG SUBMISSION > ';
  color: var(--ghs-green-dim);
  font-size: 0.8rem;
  display: block;
  margin-bottom: 6px;
  text-transform: uppercase;
  letter-spacing: 0.1em;
}

/* ============================================================
   BUTTON CONTRAST FIX
   ============================================================ */

/* Kill any light backgrounds bleeding through from Bootstrap */
.btn,
.btn:visited,
a.btn,
button.btn,
input[type="submit"],
input[type="button"] {
  background-color: #0d1a0d !important;
  background-image: none !important;
  border: 1px solid var(--ghs-green) !important;
  color: var(--ghs-green) !important;
  text-shadow: none !important;
  box-shadow: none !important;
  font-family: var(--ghs-font-ui) !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.08em !important;
}

.btn:hover,
.btn:focus,
a.btn:hover {
  background-color: var(--ghs-green) !important;
  color: #000 !important;
  box-shadow: 0 0 10px var(--ghs-green-dim) !important;
}

.btn-danger,
.btn-danger:visited {
  background-color: #1a0d0d !important;
  border-color: var(--ghs-red) !important;
  color: var(--ghs-red) !important;
}

.btn-danger:hover {
  background-color: var(--ghs-red) !important;
  color: #000 !important;
}

.btn-warning,
.btn-warning:visited {
  background-color: #1a1400 !important;
  border-color: var(--ghs-amber) !important;
  color: var(--ghs-amber) !important;
}

.btn-warning:hover {
  background-color: var(--ghs-amber) !important;
  color: #000 !important;
}

.btn-info,
.btn-info:visited {
  background-color: #001a1a !important;
  border-color: #00bcd4 !important;
  color: #00bcd4 !important;
}

.btn-info:hover {
  background-color: #00bcd4 !important;
  color: #000 !important;
}

/* ============================================================
   TEXT BRIGHTNESS FIX — scoreboard & general content
   ============================================================ */

/* Primary content text — brighter white */
body, p, li, span, div,
.table td,
.table tr,
.well, .hero-unit {
  color: #e8f0e8 !important;
}

/* Table cell text specifically */
.table td,
.table td a,
td, td a {
  color: #e8f0e8 !important;
}

/* Scoreboard player names */
.table td:first-child,
.table .player-name,
td b, td strong {
  color: #ffffff !important;
  font-weight: 600 !important;
}

/* Hints taken / secondary info text */
.table .muted,
.muted,
small {
  color: #a0b8a0 !important;
}

/* Score numbers — keep them punchy */
.table td .score,
td .score {
  color: var(--ghs-green) !important;
  font-weight: 700 !important;
}

/* General labels and secondary spans */
label, .help-block, .help-inline {
  color: #c0d4c0 !important;
}

/* Notification bell area */
.fa-bell {
  color: #e8f0e8 !important;
}

/* ============================================================
   MOBILE DROPDOWN OPEN STATE
   ============================================================ */
@media (max-width: 767px) {
  .navbar .dropdown.open > .dropdown-menu {
    display: block !important;
    position: static !important;
    float: none !important;
    width: 100% !important;
  }
}

/* ============================================================
   SCOREBOARD ENHANCEMENTS — Top 3 highlights + animations
   ============================================================ */

/* Rank number column */
#summary_table tbody tr td:first-child {
  font-family: var(--ghs-font-mono) !important;
  font-size: 1.4rem !important;
  font-weight: 700 !important;
  color: var(--ghs-text-dim) !important;
  text-align: center !important;
  padding: 0px 20px 0px 10px !important;
}

/* GOLD — Rank 1 */
#summary_tbody tr:nth-child(1) {
  background: linear-gradient(90deg, rgba(255,215,0,0.10) 0%, transparent 60%) !important;
  border-left: 4px solid gold !important;
}
#summary_tbody tr:nth-child(1) td:first-child {
  color: gold !important;
  text-shadow: 0 0 10px rgba(255,215,0,0.8) !important;
}
#summary_tbody tr:nth-child(1) td {
  border-top: 1px solid rgba(255,215,0,0.2) !important;
  border-bottom: 1px solid rgba(255,215,0,0.2) !important;
}

/* SILVER — Rank 2 */
#summary_tbody tr:nth-child(2) {
  background: linear-gradient(90deg, rgba(192,192,192,0.08) 0%, transparent 60%) !important;
  border-left: 4px solid silver !important;
}
#summary_tbody tr:nth-child(2) td:first-child {
  color: silver !important;
  text-shadow: 0 0 8px rgba(192,192,192,0.6) !important;
}
#summary_tbody tr:nth-child(2) td {
  border-top: 1px solid rgba(192,192,192,0.15) !important;
  border-bottom: 1px solid rgba(192,192,192,0.15) !important;
}

/* BRONZE — Rank 3 */
#summary_tbody tr:nth-child(3) {
  background: linear-gradient(90deg, rgba(205,127,50,0.08) 0%, transparent 60%) !important;
  border-left: 4px solid #cd7f32 !important;
}
#summary_tbody tr:nth-child(3) td:first-child {
  color: #cd7f32 !important;
  text-shadow: 0 0 8px rgba(205,127,50,0.6) !important;
}
#summary_tbody tr:nth-child(3) td {
  border-top: 1px solid rgba(205,127,50,0.15) !important;
  border-bottom: 1px solid rgba(205,127,50,0.15) !important;
}

/* Rank 1 player name glow pulse */
#summary_tbody tr:nth-child(1) .summarycolumn div[style*="font-size: large"] {
  animation: ghs-gold-pulse 2.5s ease-in-out infinite alternate !important;
}

@keyframes ghs-gold-pulse {
  from { text-shadow: 0 0 4px rgba(255,215,0,0.4); color: #fff; }
  to   { text-shadow: 0 0 12px rgba(255,215,0,0.9), 0 0 20px rgba(255,215,0,0.4); color: gold; }
}

/* Score column — bright and bold */
td.moneycol {
  font-family: var(--ghs-font-mono) !important;
  color: var(--ghs-green) !important;
  font-weight: 700 !important;
}

/* Flags column */
td.flagcol {
  font-family: var(--ghs-font-mono) !important;
  color: var(--ghs-amber) !important;
  font-weight: 700 !important;
}

/* Progress bars (minibar) — brighter with glow */
.bar.minibar {
  background-color: var(--ghs-green-dim) !important;
  background-image: none !important;
  box-shadow: 0 0 4px var(--ghs-green) !important;
  border-radius: 1px !important;
}

/* Progress bar track */
.progress[style*="background-color: #424242"] {
  background-color: #1a1a1a !important;
  border: 1px solid #2a2a2a !important;
}

/* Hints taken text */
.hintcol {
  color: var(--ghs-text-dim) !important;
  font-size: 0.78rem !important;
  font-family: var(--ghs-font-mono) !important;
}

/* Table header trophy icon row */
#summary_table thead tr th {
  font-size: 1rem !important;
  padding: 12px 8px !important;
}

/* Hover row highlight — all ranks below 3 */
#summary_tbody tr:nth-child(n+4):hover td {
  background-color: var(--ghs-green-glow) !important;
  transition: background 0.15s !important;
}

/* Scoreboard well container */
.well #summary_table {
  margin-bottom: 0 !important;
}

/* Timer countdown styling */
#timercount {
  font-family: var(--ghs-font-mono) !important;
  color: var(--ghs-red) !important;
  text-shadow: 0 0 10px var(--ghs-red) !important;
  animation: ghs-timer-pulse 1s ease-in-out infinite alternate !important;
}

@keyframes ghs-timer-pulse {
  from { opacity: 1; }
  to   { opacity: 0.6; }
}

/* Pagination */
.pagination ul li a {
  background: var(--ghs-panel) !important;
  border-color: var(--ghs-border) !important;
  color: var(--ghs-text) !important;
  font-family: var(--ghs-font-mono) !important;
  font-size: 0.85rem !important;
}

.pagination ul li.active a {
  background: var(--ghs-green-dim) !important;
  border-color: var(--ghs-green) !important;
  color: #000 !important;
}

.pagination ul li a:hover {
  background: var(--ghs-green-glow) !important;
  color: var(--ghs-green) !important;
}