/* Chatlnked Dark Baseline (Feb 16 aesthetic)
   Goal: one theme for both app pages + Django admin, without redesign.
*/

/* App + Admin global background */
html, body {
  height: 100%;
}

body {
  background: #0b1220 !important;
}

/* =========================================================
   Navbar: brand/logo sizing (responsive) + no ghost text
   ========================================================= */

/* Keep the overall navbar height stable, but let the logo occupy it */
.navbar-brand {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  line-height: 1 !important;

  /* If any text ever sneaks back into the brand link, don't render it */
  font-size: 0 !important;
}

/* Logo scales up (was capped at 28px which is why it looked tiny) */
.brand-logo {
  height: clamp(34px, 3.2vw, 52px);
  width: auto;
  max-width: min(340px, 75vw);
  display: block;
  object-fit: contain;
}

/* Optional: ensure the brand link doesn’t add extra height from alignment */
.navbar-brand.d-flex {
  align-items: center;
}

/* IMPORTANT: do NOT globally change navbar padding (it can cause regressions)
   If you previously added a .navbar padding block, it is intentionally removed.
*/

/* =========================================================
   Shared card style (your Feb 16 “frosted” look)
   ========================================================= */

.card-dark {
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.10);
}

/* Login page: nested inner panel (responsive, subtle elevation) */
.login-inner-panel {
  background: rgba(255,255,255,0.075);
  border: 1px solid rgba(255,255,255,0.10);
  transition: transform 160ms ease, box-shadow 160ms ease, border-color 160ms ease, background 160ms ease;
}

.login-inner-panel:hover {
  transform: translateY(-3px);
  border-color: rgba(255,255,255,0.16);
  background: rgba(255,255,255,0.085);
  box-shadow:
    0 14px 30px rgba(0,0,0,0.35),
    0 0 0 1px rgba(255,255,255,0.06);
}

@media (prefers-reduced-motion: reduce) {
  .login-inner-panel {
    transition: none;
  }
  .login-inner-panel:hover {
    transform: none;
  }
}

.muted { color: rgba(255,255,255,0.68); }

a { text-decoration: none; }

.nav-link { color: rgba(255,255,255,0.78); }
.nav-link:hover { color: rgba(255,255,255,1); }

/* Tables (app dashboards) */
table { color: rgba(255,255,255,0.92); }
th {
  font-weight: 600;
  color: rgba(255,255,255,0.75);
}
td { border-color: rgba(255,255,255,0.08); }

/* -----------------------------
   Django admin dark skin
   ----------------------------- */

/* Make sure admin’s core containers stop forcing white backgrounds */
#container,
#content,
#content-main,
#content-related,
#nav-sidebar,
#main,
.dashboard #content,
.dashboard #content-main {
  background: transparent !important;
}

/* Ensure default admin text doesn’t stay dark-on-dark */
#container,
#container * {
  color: rgba(255,255,255,0.90);
}

/* Let links keep a slightly brighter tone */
#container a {
  color: rgba(255,255,255,0.92);
}
#container a:hover {
  color: rgba(255,255,255,1);
}

/* Top header + breadcrumbs match your navbar style */
#header,
.breadcrumbs {
  background: rgba(255,255,255,0.03) !important;
  border-bottom: 1px solid rgba(255,255,255,0.08) !important;
}

/* Frosted panels for admin modules + inlines */
.module,
.inline-group,
.dashboard #content-main .module,
fieldset.module {
  background: rgba(255,255,255,0.04) !important;
  border: 1px solid rgba(255,255,255,0.10) !important;
  border-radius: 8px !important;
  overflow: hidden;
}

/* Admin tables */
#result_list,
#changelist table,
.module table {
  background: transparent !important;
}

#changelist table thead th,
#result_list thead th {
  color: rgba(255,255,255,0.75) !important;
  border-bottom: 1px solid rgba(255,255,255,0.10) !important;
}

#changelist table tbody td,
#result_list tbody td {
  border-top: 1px solid rgba(255,255,255,0.06) !important;
}

/* Form rows + help text */
.form-row,
.aligned .form-row {
  border-bottom: 1px solid rgba(255,255,255,0.06) !important;
}

.help,
.helptext,
p.help,
.form-row .help {
  color: rgba(255,255,255,0.68) !important;
}

/* Inputs (admin + app forms)
   Note: inputs must read as "active" against the login-inner-panel background.
*/
input,
select,
textarea {
  background: rgba(255,255,255,0.10) !important;
  border: 1px solid rgba(255,255,255,0.16) !important;
  color: rgba(255,255,255,0.92) !important;
}

input::placeholder,
textarea::placeholder {
  color: rgba(255,255,255,0.55) !important;
}

/* Focus should be unmistakably interactive, but not neon */
input:focus,
select:focus,
textarea:focus {
  outline: none !important;
  border-color: rgba(255,255,255,0.28) !important;
  box-shadow: 0 0 0 3px rgba(255,255,255,0.06) !important;
}

/* Django admin action bars sometimes use light backgrounds */
#changelist .actions,
.submit-row,
.object-tools {
  background: transparent !important;
  border: 0 !important;
}

/* Messages */
.messagelist li,
ul.messagelist li {
  background: rgba(255,255,255,0.04) !important;
  border: 1px solid rgba(255,255,255,0.10) !important;
  color: rgba(255,255,255,0.92) !important;
}

/* =========================================================
   Django Admin Readability Fix (white-on-white issue)
   Problem: #container * forces white text, but some admin elements
   still render with light backgrounds. This section forces those
   light areas to use dark text so it remains readable.
   ========================================================= */

/* Common admin "light" surfaces that can appear on some pages */
#container .selector,
#container .selector select,
#container .selector-available,
#container .selector-chosen,
#container .calendarbox,
#container .clockbox,
#container .datetimeshortcuts,
#container .paginator,
#container #toolbar,
#container .results,
#container .changelist-form-container,
#container .filtered,
#container .submit-row,
#container .object-tools,
#container .inline-related,
#container .related-widget-wrapper {
  /* If these surfaces stay light in any browser/admin view,
     ensure their default text is dark (readable). */
  color: #111 !important;
}

/* Make sure descendants inherit the dark text in those surfaces */
#container .selector *,
#container .calendarbox *,
#container .clockbox *,
#container .datetimeshortcuts *,
#container .paginator *,
#container #toolbar *,
#container .results *,
#container .changelist-form-container *,
#container .filtered *,
#container .inline-related *,
#container .related-widget-wrapper * {
  color: inherit !important;
}

/* Ensure form labels + field text remain readable even when a light
   background slips through (labels can land on pale panels). */
#container label,
#container .form-row label,
#container .aligned label {
  color: rgba(255,255,255,0.85) !important;
}

/* But if labels are inside one of the "light surfaces" above, force dark */
#container .selector label,
#container .calendarbox label,
#container .clockbox label,
#container #toolbar label,
#container .results label {
  color: #111 !important;
}

/* Links inside those light surfaces should also go dark (otherwise white links vanish) */
#container .selector a,
#container .calendarbox a,
#container .clockbox a,
#container .datetimeshortcuts a,
#container .paginator a,
#container #toolbar a,
#container .results a,
#container .filtered a {
  color: #0b3a6a !important;
}
#container .selector a:hover,
#container .calendarbox a:hover,
#container .clockbox a:hover,
#container .datetimeshortcuts a:hover,
#container .paginator a:hover,
#container #toolbar a:hover,
#container .results a:hover,
#container .filtered a:hover {
  color: #062a4d !important;
}

/* Inputs inside light surfaces should have dark text (autofill and some widgets can look light) */
#container .selector input,
#container .selector select,
#container .calendarbox input,
#container .clockbox input,
#container #toolbar input {
  color: #111 !important;
}

/* Placeholder text for those same cases */
#container .selector input::placeholder,
#container .calendarbox input::placeholder,
#container .clockbox input::placeholder,
#container #toolbar input::placeholder {
  color: #6c757d !important;
  opacity: 1;
}