/* =====================================================================
   SeaTracePro BlueSentinel — tactical console THEME for the EXISTING page widgets.
   PRESENTATION ONLY: colours, borders, shadows, fonts. No sizes/positions/display rules/ids/JS are
   changed, so every widget behaves exactly as before. Load AFTER bs-intel.css.
   To switch a part off, delete its block. To un-tint the map: set --bs-map-tint to "none".
   ===================================================================== */
:root {
  --bs-map-tint: sepia(.45) hue-rotate(78deg) saturate(.9);
  --t-bg: #07120c; --t-bg2: #0a1510; --t-line: #1b3a2b; --t-line2: #26543d;
  --t-green: #2ee59d; --t-dim: #6f9b84; --t-text: #d6f5e3; --t-amber: #e0b030;
  --t-mono: ui-monospace, "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace;
}

/* ---- map: green-tinted dark basemap + faint tactical grid ---------------- */
#map.leaflet-container.osm-dark .leaflet-tile { filter: invert(1) hue-rotate(180deg) brightness(.72) contrast(.95) var(--bs-map-tint); }
#map { background: #050b08; }
#map::after {                 /* grid overlay: never intercepts the mouse */
  content: ""; position: absolute; inset: 0; z-index: 450; pointer-events: none;
  background-image:
    linear-gradient(rgba(46,229,157,.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(46,229,157,.045) 1px, transparent 1px);
  background-size: 64px 64px;
  box-shadow: inset 0 0 120px rgba(0,0,0,.55);
}

/* ---- Leaflet controls ------------------------------------------------------ */
.leaflet-bar { border: 1px solid var(--t-line2) !important; box-shadow: 0 2px 10px rgba(0,0,0,.5) !important; border-radius: 2px !important; }
.leaflet-bar a, .leaflet-bar a:hover { background: var(--t-bg) !important; color: var(--t-green) !important; border-bottom-color: var(--t-line) !important; font-family: var(--t-mono); }
.leaflet-bar a:hover { background: #0e2217 !important; }
.leaflet-control-attribution { background: rgba(7,18,12,.85) !important; color: var(--t-dim) !important; font-family: var(--t-mono); }
.leaflet-control-attribution a { color: var(--t-green) !important; }

/* ---- Leaflet popups (vessel + attack popups) -------------------------------- */
.leaflet-popup-content-wrapper { background: var(--t-bg2) !important; color: var(--t-text) !important; border: 1px solid var(--t-line2); border-radius: 2px !important; box-shadow: 0 6px 22px rgba(0,0,0,.65) !important; }
.leaflet-popup-tip { background: var(--t-bg2) !important; border: 1px solid var(--t-line2); }
.leaflet-popup-content { font-family: var(--t-mono); font-size: 12px; line-height: 1.5; }
.leaflet-popup-content strong[style] { color: var(--t-dim) !important; }      /* labels that had hard-coded dark grey */
.leaflet-popup-content a { color: var(--t-green); }
.leaflet-container a.leaflet-popup-close-button { color: var(--t-dim) !important; }
.leaflet-container a.leaflet-popup-close-button:hover { color: var(--t-green) !important; }

/* ---- top sea selector --------------------------------------------------------- */
#seaDropdownButton { background: var(--t-bg) !important; color: var(--t-green) !important; border: 1px solid var(--t-line2) !important; border-radius: 2px !important; font-family: var(--t-mono); font-weight: 700; letter-spacing: 1.5px; text-transform: uppercase; font-size: 12px; box-shadow: 0 4px 14px rgba(0,0,0,.5); }
#seaDropdownButton:hover, #seaDropdownButton:focus, #seaDropdownButton.show { border-color: var(--t-green) !important; box-shadow: 0 0 10px rgba(46,229,157,.25) !important; }
#seaDropdownMenu, .user-widget .dropdown-menu { background: var(--t-bg2) !important; border: 1px solid var(--t-line2) !important; border-radius: 2px !important; font-family: var(--t-mono); font-size: 12px; box-shadow: 0 8px 24px rgba(0,0,0,.65); }
#seaDropdownMenu .dropdown-item, .user-widget .dropdown-item { color: var(--t-text) !important; }
#seaDropdownMenu .dropdown-item:hover, #seaDropdownMenu .dropdown-item:focus,
.user-widget .dropdown-item:hover { background: rgba(46,229,157,.12) !important; color: var(--t-green) !important; }
.user-widget li:hover { background: transparent !important; }

/* ---- round floating buttons (chart, user, prompts, sea zones) ------------------- */
.graph-report-widget, .user-widget, .prompt-widget, .sea-zones-widget {
  background: var(--t-bg) !important; border: 1px solid var(--t-line2);
  box-shadow: 0 0 0 1px rgba(46,229,157,.06), 0 4px 14px rgba(0,0,0,.55) !important;
}
.graph-report-widget:hover, .user-widget:hover, .prompt-widget:hover, .sea-zones-widget:hover {
  background: #0e2217 !important; border-color: var(--t-green); box-shadow: 0 0 12px rgba(46,229,157,.35) !important;
}
.graph-report-widget a, .graph-report-widget i, .user-widget a, .user-widget i,
.prompt-widget i, .sea-zones-widget i, .sea-zones-widget .btn { color: var(--t-green) !important; }
.prompt-tooltip { background: var(--t-bg) !important; color: var(--t-green) !important; border: 1px solid var(--t-line2); border-radius: 2px !important; font-family: var(--t-mono); font-size: 12px !important; letter-spacing: 1px; }

/* ---- radar ------------------------------------------------------------------- */
#radar-canvas { border: 1px solid var(--t-green) !important; box-shadow: 0 0 14px rgba(46,229,157,.4), inset 0 0 22px rgba(46,229,157,.12) !important; filter: hue-rotate(20deg) saturate(.8); }

/* ---- corner plates ------------------------------------------------------------ */
#top-widget { background: rgba(7,18,12,.94) !important; border: 1px solid var(--t-line2); border-left: 3px solid var(--t-green); border-radius: 2px !important; font-family: var(--t-mono); font-size: .8rem !important; letter-spacing: 1px; color: var(--t-text) !important; box-shadow: 0 4px 14px rgba(0,0,0,.55) !important; }
#brand-widget { background: rgba(7,18,12,.94); border: 1px solid var(--t-line2); border-radius: 3px !important; box-shadow: 0 4px 14px rgba(0,0,0,.55) !important; }
#brand-widget img { border-radius: 2px !important; }
#powered-widget { background: rgba(7,18,12,.94) !important; color: var(--t-dim) !important; border: 1px solid var(--t-line2); border-radius: 2px !important; font-family: var(--t-mono) !important; font-size: 12px !important; box-shadow: 0 4px 14px rgba(0,0,0,.55) !important; }
#powered-widget a { color: var(--t-green) !important; }

/* ---- Pirate Attack Stats card ------------------------------------------------------ */
#pirateStatsWidget { background: rgba(7,18,12,.96) !important; color: var(--t-text) !important; border: 1px solid var(--t-line2) !important; border-top: 2px solid var(--t-green) !important; border-radius: 2px !important; box-shadow: 0 8px 28px rgba(0,0,0,.65) !important; font-family: var(--t-mono); font-size: 12.5px; }
#pirateStatsWidget h4 { color: var(--t-green); text-transform: uppercase; letter-spacing: 2.5px; font-size: 13px !important; font-weight: 700; padding-bottom: 8px; border-bottom: 1px solid var(--t-line); }
#pirateStatsWidget p { margin-bottom: .55rem; }
#pirateStatsWidget strong { color: var(--t-dim); font-weight: 600; letter-spacing: .5px; }
#pirateStatsWidget .btn { border-radius: 2px !important; font-family: var(--t-mono); font-weight: 700; letter-spacing: 1px; text-transform: uppercase; font-size: 11px; background: transparent !important; }
#pirateStatsWidget .btn-primary { color: var(--t-green) !important; border: 1px solid var(--t-green) !important; }
#pirateStatsWidget .btn-primary:hover { background: rgba(46,229,157,.14) !important; box-shadow: 0 0 10px rgba(46,229,157,.25); }
#pirateStatsWidget .btn-warning { color: var(--t-amber) !important; border: 1px solid var(--t-amber) !important; }
#pirateStatsWidget .btn-warning:hover { background: rgba(224,176,48,.14) !important; box-shadow: 0 0 10px rgba(224,176,48,.25); }
#liveShipLoadStatus { color: var(--t-dim); font-size: 11.5px; }

/* ---- Bootstrap modals on this page (sea zones, vessels list, prompts) ----------------- */
.modal-content { background: var(--t-bg2) !important; color: var(--t-text) !important; border: 1px solid var(--t-line2) !important; border-radius: 2px !important; font-family: var(--t-mono); box-shadow: 0 0 40px rgba(0,0,0,.75); }
.modal-header, .modal-footer { border-color: var(--t-line) !important; }
.modal-title { color: var(--t-green) !important; text-transform: uppercase; letter-spacing: 2px; font-size: 14px; }
.modal-content .btn-close { filter: invert(1) grayscale(1) brightness(1.6); opacity: .7; }
.modal-content .list-group-item { background: transparent !important; color: var(--t-text) !important; border-color: var(--t-line) !important; }
.modal-content .list-group-item:hover { background: rgba(46,229,157,.08) !important; }
.modal-content .form-control { background: #03100a !important; color: var(--t-text) !important; border: 1px solid var(--t-line2) !important; border-radius: 2px; font-family: var(--t-mono); }
.modal-content .form-control:focus { border-color: var(--t-green) !important; box-shadow: 0 0 0 1px var(--t-green) !important; }
.modal-content .form-control::placeholder { color: var(--t-dim); }
.modal-content .prompt-text { color: var(--t-text); }

/* ---- Clear chat control (kept: same position, same behaviour) ----------------------------- */
.delete-chat-widget.bg-warning { background: var(--t-bg) !important; border: 1px solid var(--t-line2); border-radius: 2px !important; }
.delete-chat-widget .btn-danger { background: transparent !important; color: #e0453a !important; border: 1px solid #5a2723 !important; border-radius: 2px !important; font-family: var(--t-mono); }