/** This file is auto-generated by the Clean Theme configuration. Do not edit the file directly. */

:root {
    --hh-ct-container-max-width: 1600px;
    --default: #101418;
    --primary: #1a7db2;
    --info: #1A808E;
    --success: #518132;
    --warning: #AF640E;
    --danger: #EC0426;
    --link: #1a7db2;
    --hh-ct-text-color-heading: #ffffff;
    --text-color-main: #d6dbe7;
    --text-color-default: #aab4c7;
    --text-color-secondary: #8892a5;
    --text-color-highlight: #ffffff;
    --text-color-soft: #b0bacf;
    --text-color-soft2: #7d8799;
    --text-color-soft3: #5a6474;
    --text-color-contrast: #ffffff;
    --background-color-main: #0b0f14;
    --background-color-secondary: #121821;
    --background-color-page: #0d1117;
    --background-color-highlight: rgba(255,255,255,0.05);
    --background-color-highlight-soft: rgba(255,255,255,0.02);
    --hh-ct-font-family: "Inter, system-ui, sans-serif", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    --hh-ct-font-size: 14px;
    --hh-ct-font-weight: 400;
    --hh-ct-font-bold-weight: 700;
    --hh-ct-heading-font-family: "Inter, system-ui, sans-serif", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    --hh-ct-ph-font-size: 16px;
    --hh-ct-h1-font-size: 1.7em;
    --hh-ct-h1-stream-font-size: 1.45em;
    --hh-ct-h2-font-size: 1.5em;
    --hh-ct-h2-stream-font-size: 1.3em;
    --hh-ct-h3-font-size: 1.2em;
    --hh-ct-h4-font-size: 1.1em;
    --hh-ct-h5-font-size: 1.0em;
    --hh-ct-h6-font-size: 0.85em;
    --hh-ct-ph-font-weight: 700;
    --hh-ct-panel-border-width: 0px;
    --hh-ct-panel-border-style: none;
    --hh-ct-panel-border-color: rgba(255,255,255,0.08);
    --hh-ct-panel-border-radius: 14px;
    --hh-ct-panel-box-shadow: 0 4px 16px rgba(0,0,0,0.4), inset 0 1px 0 rgba(255,255,255,0.05);
    --hh-ct-menu-font-size: 13px;
    --hh-ct-menu-text-color: #d6dbe7;
    --hh-ct-menu-border-color: rgba(255,255,255,0.08);
    --hh-ct-top-bar-height: 50px;
    --hh-ct-top-bar-font-size: 12px;
    --hh-ct-top-menu-nav-justify-content: center;
    --hh-ct-top-menu-background-color: #0d1117;
    --hh-ct-top-menu-text-color: #d6dbe7;
    --hh-ct-top-menu-button-hover-background-color: rgba(255,255,255,0.06);
    --hh-ct-top-menu-button-hover-text-color: #ffffff;

    --background-color-main-darken-10: #000000;
    --background-color-page-darken-5: #040507;
    --background-color-page-lighten-10: #272b30;
    --background-color-page-lighten-20: #414449;
    --background-color-page-lighten-30: #5b5e62;
    --background-color-secondary-darken-2: #0e131a;
    --background-color-secondary-darken-5: #090c11;
    --danger-darken-10: #ba031e;
    --danger-darken-5: #d30422;
    --danger-lighten-20: #f36378;
    --danger-lighten-5: #ee1c3a;
    --default-darken-2: #0c0f12;
    --default-darken-5: #060709;
    --default-lighten-2: #15191d;
    --info-darken-10: #125963;
    --info-darken-27: #05171a;
    --info-darken-5: #166d78;
    --info-lighten-25: #6fafb8;
    --info-lighten-30: #80b9c1;
    --info-lighten-40: #a3ccd1;
    --info-lighten-5: #2b8996;
    --info-lighten-50: #c5dfe2;
    --info-lighten-8: #358f9b;
    --link-darken-2: #1977a9;
    --link-lighten-5: #2d88b8;
    --primary-darken-10: #145e86;
    --primary-darken-5: #176d9c;
    --primary-lighten-10: #4093bf;
    --primary-lighten-20: #66a8cc;
    --primary-lighten-25: #79b3d2;
    --primary-lighten-5: #2d88b8;
    --primary-lighten-8: #398ebc;
    --success-darken-10: #3a5c24;
    --success-darken-5: #456f2b;
    --success-lighten-20: #87a871;
    --success-lighten-5: #5e8b42;
    --text-color-highlight-fade-15: #ffffff26;
    --text-color-highlight-fade-30: #ffffff4d;
    --text-color-secondary-lighten-25: #d1d4dc;
    --warning-darken-10: #80490a;
    --warning-darken-2: #a65f0d;
    --warning-darken-5: #97570c;
    --warning-lighten-10: #bc7d34;
    --warning-lighten-20: #c8955b;
    --warning-lighten-40: #e2c7a7;
    --warning-lighten-5: #b57021;
    --hh-ct-top-bar-bottom-spacing: 30px;
    --hh-fixed-header-height: 80px;
    --hh-fixed-footer-height: 0px;
}

@media (max-width: 768px) {
    :root {
        --hh-ct-top-bar-height: 50px;
        --hh-ct-top-bar-bottom-spacing: 5px;
        --hh-fixed-header-height: 55px;
    }
}

@media (max-width: 570px) {
    :root {
        --hh-fixed-footer-height: 52px;
    }
}

@charset "UTF-8";
/* -----------------------------------------------------------
   Urban Discovery — add glow, accents & fix active menu state
   ----------------------------------------------------------- */
/* === Accent palette to match main site === */
:root {
  --brand: #7e5bff;
  /* purple/indigo */
  --aqua:  #19d3c5;
  /* teal/aqua    */
  --coral: #ff6b6b;
  /* coral        */
  --bg:#0f1117;
  /* base */
  --surface:#121826;
  --surface-2:#141b28;
  --border:rgba(255,255,255,.08);
  --text:#d9dee7;
  --text-strong:#e6eaf2;
}
/* === Ambient “blob” glows on page background === */
body.clean-theme {
  background: radial-gradient(40rem 28rem at 90% 12%, color-mix(in oklab, var(--aqua), transparent 85%) 0%, transparent 55%), radial-gradient(36rem 24rem at 12% 18%, color-mix(in oklab, var(--brand), transparent 85%) 0%, transparent 60%), radial-gradient(30rem 22rem at 80% 70%, color-mix(in oklab, var(--coral), transparent 88%) 0%, transparent 62%), var(--bg) !important;
}
/* subtle gradient on panel headers (like cards on About) */
.panel-heading {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.02)) !important;
  border-color: var(--border) !important;
  color: var(--text-strong) !important;
}
/* cards/panels: a touch more polish */
.panel, .panel-default, .panel-body {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.02)) !important;
  border: 1px solid var(--border) !important;
  box-shadow: 0 8px 22px rgba(0, 0, 0, 0.45), inset 0 1px 0 rgba(255, 255, 255, 0.06) !important;
  border-radius: 18px !important;
}
/* === TOP MENU — fix grey active & add glow === */
#top-menu-nav .top-menu-item > a {
  border-radius: 10px;
  transition: background 0.15s ease, box-shadow 0.15s ease, color 0.15s ease;
}
/* default (idle) buttons */
#top-menu-nav .top-menu-item > a:not(.active) {
  background: transparent;
  color: var(--text) !important;
}
/* hover */
#top-menu-nav .top-menu-item > a:hover {
  background: rgba(255, 255, 255, 0.05) !important;
  box-shadow: 0 0 0 1px var(--border) inset;
}
/* ACTIVE STATE — no more grey */
#top-menu-nav .top-menu-item.active > a, #top-menu-nav .top-menu-item > a.active {
  background: linear-gradient(135deg, color-mix(in oklab, var(--brand), #6cf 30%), var(--aqua)) !important;
  color: #0b0f16 !important;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.25);
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.35), 0 0 0 1px color-mix(in oklab, var(--aqua), rgba(0, 0, 0, 0) 70%) inset;
}
/* little pill highlight under active item (subtle) */
#top-menu-nav .top-menu-item.active > a::after {
  content: "";
  position: absolute;
  left: 12px;
  right: 12px;
  bottom: 6px;
  height: 3px;
  border-radius: 999px;
  background: color-mix(in oklab, var(--aqua), #fff 15%);
  opacity: 0.75;
}
/* icons inside active tab go dark for contrast */
#top-menu-nav .top-menu-item.active > a i {
  color: #0b0f16 !important;
}
/* === Right-side panel titles: colored “tick” === */
.panel-heading strong::after {
  content: "";
  display: inline-block;
  vertical-align: middle;
  margin-left: 0.5rem;
  width: 0.55rem;
  height: 0.55rem;
  border-radius: 999px;
  background: var(--aqua);
  box-shadow: 0 0 12px color-mix(in oklab, var(--aqua), transparent 70%);
}
/* === Info/notice boxes with accent rims (like chips) === */
.alert-info {
  border-color: color-mix(in oklab, var(--brand), rgba(255, 255, 255, 0.12) 60%) !important;
  background: rgba(255, 255, 255, 0.04) !important;
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.03) inset, 0 8px 20px rgba(0, 0, 0, 0.35);
}
/* === Buttons to match main site === */
.btn-primary {
  background: linear-gradient(135deg, var(--aqua), color-mix(in oklab, var(--brand), var(--aqua) 40%)) !important;
  border-color: transparent !important;
  color: #0b0f16 !important;
  box-shadow: 0 8px 18px rgba(0, 0, 0, 0.35), 0 0 0 1px rgba(255, 255, 255, 0.1) inset;
}
.btn-primary:hover {
  filter: brightness(1.05);
}
.btn-default {
  background: rgba(255, 255, 255, 0.06) !important;
  border: 1px solid var(--border) !important;
  color: var(--text) !important;
}
/* === Small chips/badges (used across widgets) === */
.label, .badge {
  background: rgba(255, 255, 255, 0.08) !important;
  border: 1px solid var(--border);
  border-radius: 999px !important;
  padding: 0.25rem 0.5rem;
}
/* Inputs */
.form-control {
  background: rgba(255, 255, 255, 0.04) !important;
  border: 1px solid var(--border) !important;
  color: var(--text) !important;
}
.form-control:focus {
  border-color: color-mix(in oklab, var(--aqua), #6aa0ff 40%) !important;
  box-shadow: 0 0 0 2px color-mix(in oklab, var(--aqua), transparent 75%) !important;
}
/* Collapsible headings (the +/– rows in Clean Theme config) */
.form-collapsible-fields .form-collapsible-fields-label {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.02)) !important;
  border: 1px solid var(--border) !important;
  border-radius: 12px !important;
}
/* Tiny polish on the left admin ‘speech bubble’ */
.left-navigation .panel:before {
  display: none !important;
}
/* hide white tail */
/* cards/panels: polish without breaking form boxes */
.panel, .panel-default {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.02)) !important;
  border: 1px solid var(--border) !important;
  box-shadow: 0 8px 22px rgba(0, 0, 0, 0.45), inset 0 1px 0 rgba(255, 255, 255, 0.06) !important;
  border-radius: 18px !important;
}
/* keep inner content plain so HumHub's form layout stays intact */
.panel > .panel-body {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  border-radius: 0 !important;
}
/* Collapsible headings + fieldset styling */
.form-collapsible-fields .form-collapsible-fields-label {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.02)) !important;
  border: 1px solid var(--border) !important;
  border-radius: 12px !important;
}
.form-collapsible-fields fieldset {
  background: rgba(255, 255, 255, 0.02);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 12px;
  margin-top: 10px;
}
#top-menu-nav .top-menu-item > a {
  position: relative;
}
/* so ::after positions correctly */
/* --- Limit fancy panel styling to non-admin cards --- */
/* 1) Apply polish only when the panel does NOT contain the admin
      config UI (the collapsible sections), or the big 'activities' etc. */
.panel:not(:has(.form-collapsible-fields)), .panel-default:not(:has(.form-collapsible-fields)) {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.02)) !important;
  border: 1px solid var(--border) !important;
  box-shadow: 0 8px 22px rgba(0, 0, 0, 0.45), inset 0 1px 0 rgba(255, 255, 255, 0.06) !important;
  border-radius: 18px !important;
}
/* 2) Admin config panels (contain the collapsible fields) — keep them clean */
.panel:has(.form-collapsible-fields), .panel-default:has(.form-collapsible-fields) {
  background: #0d1117 !important;
  border: 1px solid var(--border) !important;
  box-shadow: none !important;
  border-radius: 8px !important;
}
/* 3) Left admin navigation bubble should stay flat */
#admin-menu.panel {
  background: #0d1117 !important;
  border: 1px solid var(--border) !important;
  box-shadow: none !important;
  border-radius: 12px !important;
}
/* 4) Panel body in admin should not get card chrome */
.panel:has(.form-collapsible-fields) > .panel-body {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  border-radius: 0 !important;
}
/* 5) Collapsible labels & fieldsets — tidy, but subtle */
.form-collapsible-fields .form-collapsible-fields-label {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.02)) !important;
  border: 1px solid var(--border) !important;
  border-radius: 12px !important;
}
.form-collapsible-fields fieldset {
  background: rgba(255, 255, 255, 0.02);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 12px;
  margin-top: 10px;
}
/* 6) Safety for the active-top-menu pill underline positioning */
#top-menu-nav .top-menu-item > a {
  position: relative;
}
/* ===== Admin polish + kill white hovers ===== */
/* Scope minor tweaks to admin area boxes/menus */
#layout-content .panel.panel-default {
  /* keep the same card treatment as front-facing */
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.02)) !important;
  border: 1px solid var(--border) !important;
  box-shadow: 0 8px 22px rgba(0, 0, 0, 0.45), inset 0 1px 0 rgba(255, 255, 255, 0.06) !important;
  border-radius: 18px !important;
}
/* Left admin list-group (no white flash) */
#admin-menu .list-group-item {
  background: rgba(255, 255, 255, 0.04) !important;
  border-color: var(--border) !important;
  color: var(--text) !important;
}
#admin-menu .list-group-item:hover {
  background: rgba(255, 255, 255, 0.06) !important;
  color: var(--text-strong) !important;
}
#admin-menu .list-group-item.active, #admin-menu .list-group-item.active:hover {
  background: linear-gradient(135deg, var(--aqua), color-mix(in oklab, var(--brand), var(--aqua) 40%)) !important;
  color: #0b0f16 !important;
  border-color: transparent !important;
}
#admin-menu .list-group-item.active i {
  color: #0b0f16 !important;
}
/* Tabs in admin header (stop white background) */
#layout-content .nav-tabs > li > a {
  background: rgba(255, 255, 255, 0.04) !important;
  border: 1px solid var(--border) !important;
  color: var(--text) !important;
  border-bottom-color: var(--border) !important;
}
#layout-content .nav-tabs > li.active > a, #layout-content .nav-tabs > li.active > a:focus, #layout-content .nav-tabs > li.active > a:hover {
  background: linear-gradient(135deg, color-mix(in oklab, var(--brand), #6cf 30%), var(--aqua)) !important;
  color: #0b0f16 !important;
  border-color: transparent !important;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.25);
}
/* Tables (the main culprit for white hover) */
.table {
  color: var(--text);
}
.table > thead > tr > th {
  color: var(--text-strong);
  border-color: var(--border);
}
.table > tbody > tr > td {
  border-color: var(--border);
}
/* Kill Bootstrap’s white row hover */
.table-hover > tbody > tr:hover > td, .table-hover > tbody > tr:hover > th {
  background: rgba(255, 255, 255, 0.04) !important;
  color: var(--text-strong) !important;
}
/* Dropdowns (e.g. cog menu) */
.dropdown-menu {
  background: var(--surface) !important;
  border: 1px solid var(--border) !important;
}
.dropdown-menu > li > a {
  color: var(--text) !important;
  background: transparent !important;
}
.dropdown-menu > li > a:hover, .dropdown-menu > li > a:focus {
  background: rgba(255, 255, 255, 0.06) !important;
  color: var(--text-strong) !important;
}
/* Inputs/addons in admin filters */
.input-group .input-group-addon {
  background: rgba(255, 255, 255, 0.06) !important;
  border-color: var(--border) !important;
  color: var(--text) !important;
}
/* Buttons */
.btn-default:hover {
  background: rgba(255, 255, 255, 0.08) !important;
  border-color: var(--border) !important;
  color: var(--text-strong) !important;
}
/* GridView header links (don’t turn stark white) */
.grid-view th a, .grid-view th a:visited {
  color: var(--text-strong) !important;
}
.grid-view th a:hover {
  color: #fff !important;
}
/* ===== ADMIN CONFIG PAGES — DARK + NO WHITE HOVERS ===== */
/* Give panels the same polished shell */
body.clean-theme #layout-content .panel.panel-default {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.02)) !important;
  border: 1px solid var(--border) !important;
  border-radius: 18px !important;
  box-shadow: 0 8px 22px rgba(0, 0, 0, 0.45), inset 0 1px 0 rgba(255, 255, 255, 0.06) !important;
}
/* ----- Collapsible sections (the big config groups) ----- */
body.clean-theme #layout-content .form-collapsible-fields .form-collapsible-fields-label {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.02)) !important;
  border: 1px solid var(--border) !important;
  border-radius: 12px !important;
}
body.clean-theme #layout-content .form-collapsible-fields fieldset {
  background: rgba(255, 255, 255, 0.02) !important;
  /* stop the pure white */
  border: 1px solid var(--border) !important;
  border-radius: 12px !important;
  padding: 12px !important;
  margin-top: 10px !important;
}
/* Krajee/html5 input wrappers love to force white — neutralize */
body.clean-theme #layout-content .form-collapsible-fields fieldset .form-group, body.clean-theme #layout-content .form-collapsible-fields fieldset .input-group, body.clean-theme #layout-content .form-collapsible-fields fieldset .kv-type-text .input-group, body.clean-theme #layout-content .form-collapsible-fields fieldset .spectrum-group.input-group {
  background: transparent !important;
  box-shadow: none !important;
  border-color: var(--border) !important;
}
/* Inputs, addons, selects */
body.clean-theme #layout-content .form-control {
  background: rgba(255, 255, 255, 0.04) !important;
  border: 1px solid var(--border) !important;
  color: var(--text) !important;
}
body.clean-theme #layout-content .form-control:focus {
  border-color: color-mix(in oklab, var(--aqua), #6aa0ff 40%) !important;
  box-shadow: 0 0 0 2px color-mix(in oklab, var(--aqua), transparent 75%) !important;
}
body.clean-theme #layout-content .input-group .input-group-addon {
  background: rgba(255, 255, 255, 0.06) !important;
  border-color: var(--border) !important;
  color: var(--text) !important;
}
/* Tabs at top of admin pages */
body.clean-theme #layout-content .nav-tabs {
  border-bottom-color: var(--border) !important;
}
body.clean-theme #layout-content .nav-tabs > li > a {
  background: rgba(255, 255, 255, 0.04) !important;
  border: 1px solid var(--border) !important;
  color: var(--text) !important;
}
body.clean-theme #layout-content .nav-tabs > li.active > a, body.clean-theme #layout-content .nav-tabs > li.active > a:focus, body.clean-theme #layout-content .nav-tabs > li.active > a:hover {
  background: linear-gradient(135deg, color-mix(in oklab, var(--brand), #6cf 30%), var(--aqua)) !important;
  color: #0b0f16 !important;
  border-color: transparent !important;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.25);
}
/* Left admin menu */
body.clean-theme #admin-menu .list-group-item {
  background: rgba(255, 255, 255, 0.04) !important;
  border-color: var(--border) !important;
  color: var(--text) !important;
}
body.clean-theme #admin-menu .list-group-item:hover {
  background: rgba(255, 255, 255, 0.06) !important;
  color: var(--text-strong) !important;
}
body.clean-theme #admin-menu .list-group-item.active, body.clean-theme #admin-menu .list-group-item.active:hover {
  background: linear-gradient(135deg, var(--aqua), color-mix(in oklab, var(--brand), var(--aqua) 40%)) !important;
  color: #0b0f16 !important;
  border-color: transparent !important;
}
/* Tables */
body.clean-theme #layout-content .table {
  color: var(--text) !important;
}
body.clean-theme #layout-content .table > thead > tr > th {
  color: var(--text-strong) !important;
  border-color: var(--border) !important;
}
body.clean-theme #layout-content .table > tbody > tr > td {
  border-color: var(--border) !important;
}
body.clean-theme #layout-content .table-hover > tbody > tr:hover > td, body.clean-theme #layout-content .table-hover > tbody > tr:hover > th {
  background: rgba(255, 255, 255, 0.04) !important;
  /* kill white row hover */
  color: var(--text-strong) !important;
}
/* Dropdowns (gear menus etc.) */
body.clean-theme #layout-content .dropdown-menu {
  background: var(--surface) !important;
  border: 1px solid var(--border) !important;
}
body.clean-theme #layout-content .dropdown-menu > li > a {
  color: var(--text) !important;
  background: transparent !important;
}
body.clean-theme #layout-content .dropdown-menu > li > a:hover, body.clean-theme #layout-content .dropdown-menu > li > a:focus {
  background: rgba(255, 255, 255, 0.06) !important;
  color: var(--text-strong) !important;
}
/* Buttons (stop white on hover) */
body.clean-theme #layout-content .btn-default:hover {
  background: rgba(255, 255, 255, 0.08) !important;
  border-color: var(--border) !important;
  color: var(--text-strong) !important;
}
/* Spectrum color picker popup */
body.clean-theme .sp-container, body.clean-theme .sp-palette-container, body.clean-theme .sp-picker-container {
  background: #0d1117 !important;
  border: 1px solid var(--border) !important;
}
body.clean-theme .sp-input {
  background: rgba(255, 255, 255, 0.04) !important;
  border: 1px solid var(--border) !important;
  color: var(--text) !important;
}
/* CodeMirror (custom CSS editor) */
body.clean-theme .CodeMirror, body.clean-theme .CodeMirror-gutters {
  background: rgba(255, 255, 255, 0.04) !important;
  border-color: var(--border) !important;
  color: var(--text) !important;
}
/* === FINAL KILL FOR WHITE ADMIN BOXES === */
/* Wells / plain white divs used for info blocks */
body.clean-theme .well {
  background: rgba(255, 255, 255, 0.04) !important;
  border: 1px solid var(--border) !important;
  color: var(--text) !important;
  box-shadow: none !important;
}
/* Disabled + readonly inputs */
body.clean-theme .form-control[disabled], body.clean-theme .form-control[readonly], body.clean-theme fieldset[disabled] .form-control {
  background: rgba(255, 255, 255, 0.06) !important;
  color: var(--text) !important;
  border-color: var(--border) !important;
  opacity: 0.65;
}
/* GridView cell backgrounds (stop white table body) */
body.clean-theme .grid-view td, body.clean-theme .grid-view th {
  background: transparent !important;
}
/* Krajee panel wrappers (before/after/pager) */
body.clean-theme .kv-panel-before, body.clean-theme .kv-panel-after, body.clean-theme .kv-panel-pager {
  background: rgba(255, 255, 255, 0.02) !important;
  border-top: 1px solid var(--border) !important;
}
/* Panel heading override (sometimes forced white) */
body.clean-theme .panel-default > .panel-heading {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.02)) !important;
  border-color: var(--border) !important;
  color: var(--text-strong) !important;
}
/* Help text under inputs */
body.clean-theme .help-block {
  color: var(--text) !important;
  background: transparent !important;
}
/* ===== Select2 (filters, dropdowns) — make dark ===== */
body.clean-theme .select2-container--default .select2-selection--single, body.clean-theme .select2-container--default .select2-selection--multiple {
  background: rgba(255, 255, 255, 0.04) !important;
  border: 1px solid var(--border) !important;
  color: var(--text) !important;
  border-radius: 10px !important;
  box-shadow: none !important;
}
body.clean-theme .select2-container--default .select2-selection--single .select2-selection__rendered, body.clean-theme .select2-container--default .select2-selection--multiple .select2-selection__rendered {
  color: var(--text) !important;
}
body.clean-theme .select2-container--default .select2-selection--single .select2-selection__placeholder {
  color: var(--text) !important;
  opacity: 0.75;
}
body.clean-theme .select2-container--default .select2-selection--single .select2-selection__arrow b {
  border-color: var(--text) transparent transparent transparent !important;
}
/* Dropdown panel */
body.clean-theme .select2-container .select2-dropdown {
  background: var(--surface) !important;
  border: 1px solid var(--border) !important;
  color: var(--text) !important;
  border-radius: 10px !important;
}
/* Search field inside dropdown */
body.clean-theme .select2-search--dropdown .select2-search__field {
  background: rgba(255, 255, 255, 0.06) !important;
  border: 1px solid var(--border) !important;
  color: var(--text) !important;
}
/* Options */
body.clean-theme .select2-results__option {
  background: transparent !important;
  color: var(--text) !important;
}
body.clean-theme .select2-results__option--highlighted[aria-selected], body.clean-theme .select2-results__option[aria-selected="true"] {
  background: rgba(255, 255, 255, 0.08) !important;
  color: var(--text-strong) !important;
}
/* Focus ring */
body.clean-theme .select2-container--default.select2-container--focus .select2-selection--single, body.clean-theme .select2-container--default.select2-container--focus .select2-selection--multiple {
  border-color: color-mix(in oklab, var(--aqua), #6aa0ff 40%) !important;
  box-shadow: 0 0 0 2px color-mix(in oklab, var(--aqua), transparent 75%) !important;
}
/* ===== People cards (and other HumHub cards) ===== */
/* Card chrome */
body.clean-theme .card .card-panel {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.02)) !important;
  border: 1px solid var(--border) !important;
  border-radius: 18px !important;
  box-shadow: 0 8px 22px rgba(0, 0, 0, 0.45), inset 0 1px 0 rgba(255, 255, 255, 0.06) !important;
  overflow: hidden;
  /* clean rounded corners for the header strip */
}
/* Header strip (when no space/user cover image exists) */
body.clean-theme .card .card-bg-image {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.06), rgba(255, 255, 255, 0.02)) !important;
  /* or a solid: background: rgba(255,255,255,.06) !important; */
}
/* Keep card body neutral */
body.clean-theme .card .card-body {
  background: transparent !important;
  color: var(--text) !important;
}
/* Tags on cards (labels can look too light) */
body.clean-theme .card .label, body.clean-theme .card .label-default {
  background: rgba(255, 255, 255, 0.08) !important;
  border: 1px solid var(--border) !important;
  color: var(--text) !important;
}
/* Little search button in filter bar (magnifier) */
body.clean-theme .form-button-search {
  background: rgba(255, 255, 255, 0.06) !important;
  border: 1px solid var(--border) !important;
  color: var(--text) !important;
}
/* Invite button uses .btn-info — harmonize it */
body.clean-theme .btn-info {
  background: linear-gradient(135deg, var(--aqua), color-mix(in oklab, var(--brand), var(--aqua) 40%)) !important;
  border-color: transparent !important;
  color: #0b0f16 !important;
  box-shadow: 0 8px 18px rgba(0, 0, 0, 0.35), 0 0 0 1px rgba(255, 255, 255, 0.1) inset;
}
body.clean-theme .btn-info:hover {
  filter: brightness(1.05);
}
/* ===== Kill white hover on admin tables (e.g. Manage ▸ Spaces) ===== */
body.clean-theme #layout-content .grid-view table.table > tbody > tr:hover, body.clean-theme #layout-content .grid-view table.table > tbody > tr:hover > td, body.clean-theme #layout-content .grid-view table.table > tbody > tr:hover > th, body.clean-theme #layout-content .table.table-hover > tbody > tr:hover, body.clean-theme #layout-content .table > tbody > tr:hover {
  background: rgba(255, 255, 255, 0.04) !important;
  color: var(--text-strong) !important;
}
/* Keep cell borders/text consistent in the grid */
body.clean-theme #layout-content .grid-view table.table > tbody > tr > td {
  border-color: var(--border) !important;
  color: var(--text) !important;
}
/* Links inside hovered rows shouldn’t flip to low-contrast */
body.clean-theme #layout-content .grid-view table.table > tbody > tr:hover a {
  color: var(--text-strong) !important;
}
/* Action dropdown in the last column – stop white hover there too */
body.clean-theme #layout-content .dropdown-menu > li > a:hover, body.clean-theme #layout-content .dropdown-menu > li > a:focus {
  background: rgba(255, 255, 255, 0.06) !important;
  color: var(--text-strong) !important;
}
/* ===== Modals – dark, readable ===== */
body.clean-theme .modal-content {
  background: #0d1117 !important;
  color: var(--text) !important;
  border: 1px solid var(--border) !important;
  box-shadow: 0 18px 48px rgba(0, 0, 0, 0.6) !important;
  border-radius: 14px !important;
}
body.clean-theme .modal-header, body.clean-theme .modal-footer {
  background: rgba(255, 255, 255, 0.03) !important;
  border-color: var(--border) !important;
  color: var(--text-strong) !important;
}
body.clean-theme .modal-title {
  color: var(--text-strong) !important;
}
body.clean-theme .modal-body {
  color: var(--text) !important;
}
/* Backdrop tint */
body.clean-theme .modal-backdrop {
  background: #000 !important;
  opacity: 0.6 !important;
}
/* Inputs/selects INSIDE modals */
body.clean-theme .modal-content .form-control, body.clean-theme .modal-content .select2-selection--single, body.clean-theme .modal-content .select2-selection--multiple {
  background: rgba(255, 255, 255, 0.05) !important;
  border: 1px solid var(--border) !important;
  color: var(--text) !important;
}
body.clean-theme .modal-content .form-control:focus {
  border-color: color-mix(in oklab, var(--aqua), #6aa0ff 40%) !important;
  box-shadow: 0 0 0 2px color-mix(in oklab, var(--aqua), transparent 75%) !important;
}
body.clean-theme .modal-content .select2-dropdown {
  background: #0d1117 !important;
  border: 1px solid var(--border) !important;
  color: var(--text) !important;
}
body.clean-theme .modal-content .help-block, body.clean-theme .modal-content .form-search-field-info {
  color: color-mix(in oklab, var(--text), #000 15%) !important;
}
/* Buttons already themed; ensure no white hover in modals */
body.clean-theme .modal-content .btn-default:hover {
  background: rgba(255, 255, 255, 0.08) !important;
  color: var(--text-strong) !important;
}
/* ===== Card/row hover – stop white flash (e.g. Welcome Space row) ===== */
body.clean-theme .grid-view .table > tbody > tr:hover, body.clean-theme .table.table-hover > tbody > tr:hover {
  background: rgba(255, 255, 255, 0.04) !important;
  color: var(--text-strong) !important;
}
body.clean-theme .card-panel:hover, body.clean-theme .card:hover {
  background: rgba(255, 255, 255, 0.04) !important;
}
/* ===== POST COMPOSER (ProseMirror) ===== */
body.clean-theme #contentFormBody .ProsemirrorEditor {
  background: rgba(255, 255, 255, 0.05) !important;
  border: 1px solid var(--border) !important;
  border-radius: 12px !important;
  color: var(--text) !important;
}
body.clean-theme #contentFormBody .ProsemirrorEditor .ProseMirror {
  background: transparent !important;
  color: var(--text) !important;
  caret-color: var(--text) !important;
}
body.clean-theme #contentFormBody .ProsemirrorEditor .ProseMirror:focus {
  outline: none !important;
}
/* placeholder in empty editor */
body.clean-theme #contentFormBody .ProsemirrorEditor .ProseMirror p.is-editor-empty:first-child::before, body.clean-theme #contentFormBody .ProsemirrorEditor [data-placeholder]::before {
  color: rgba(217, 222, 231, 0.55) !important;
  /* var(--text) at ~55% */
}
/* toolbar strip above the editor */
body.clean-theme #contentFormBody .ProsemirrorEditor .humhub-ui-prosemirror-menu, body.clean-theme #contentFormBody .ProsemirrorEditor .editor-menu-bar {
  background: rgba(0, 0, 0, 0.14) !important;
  border-bottom: 1px solid var(--border) !important;
}
/* ===== TOPIC PICKER (Select2) ===== */
body.clean-theme .select2-container--default .select2-selection--single, body.clean-theme .select2-container--default .select2-selection--multiple, body.clean-theme .select2-container--humhub .select2-selection--single, body.clean-theme .select2-container--humhub .select2-selection--multiple {
  background: rgba(255, 255, 255, 0.05) !important;
  border: 1px solid var(--border) !important;
  color: var(--text) !important;
  border-radius: 10px !important;
}
body.clean-theme .select2-container--default .select2-selection__rendered, body.clean-theme .select2-container--humhub .select2-selection__rendered {
  color: var(--text) !important;
}
body.clean-theme .select2-container--default .select2-selection--multiple .select2-selection__choice {
  background: rgba(255, 255, 255, 0.08) !important;
  border: 1px solid var(--border) !important;
  color: var(--text) !important;
}
body.clean-theme .select2-dropdown {
  background: var(--surface) !important;
  border: 1px solid var(--border) !important;
  color: var(--text) !important;
}
body.clean-theme .select2-search--dropdown .select2-search__field {
  background: rgba(255, 255, 255, 0.05) !important;
  border: 1px solid var(--border) !important;
  color: var(--text) !important;
}
body.clean-theme .select2-results__option[aria-selected=true], body.clean-theme .select2-results__option--highlighted {
  background: rgba(255, 255, 255, 0.08) !important;
  color: var(--text-strong) !important;
}
/* ===== Kill the white buttons everywhere ===== */
/* Base button look (applies to anything with .btn) */
body.clean-theme .btn {
  background: rgba(255, 255, 255, 0.06) !important;
  border: 1px solid var(--border) !important;
  color: var(--text) !important;
  text-shadow: none !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.35), 0 0 0 1px rgba(255, 255, 255, 0.05) inset !important;
  transition: filter 0.15s ease, background 0.15s ease, box-shadow 0.15s ease;
}
body.clean-theme .btn:hover, body.clean-theme .btn:focus {
  background: rgba(255, 255, 255, 0.1) !important;
  color: var(--text-strong) !important;
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.45), 0 0 0 2px color-mix(in oklab, var(--aqua), transparent 80%) !important;
}
body.clean-theme .btn:active, body.clean-theme .btn.active, body.clean-theme .open > .dropdown-toggle.btn {
  filter: brightness(0.97);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.4) inset !important;
}
body.clean-theme .btn.disabled, body.clean-theme .btn[disabled], body.clean-theme fieldset[disabled] .btn {
  opacity: 0.55 !important;
  box-shadow: none !important;
}
/* Default/secondary buttons */
body.clean-theme .btn-default {
  background: rgba(255, 255, 255, 0.08) !important;
  border: 1px solid var(--border) !important;
  color: var(--text) !important;
}
/* Primary & info (match brand gradient) */
body.clean-theme .btn-primary, body.clean-theme .btn-info {
  background: linear-gradient(135deg, var(--aqua), color-mix(in oklab, var(--brand), var(--aqua) 40%)) !important;
  border-color: transparent !important;
  color: #0b0f16 !important;
  box-shadow: 0 8px 18px rgba(0, 0, 0, 0.35), 0 0 0 1px rgba(255, 255, 255, 0.08) inset !important;
}
body.clean-theme .btn-primary:hover, body.clean-theme .btn-info:hover {
  filter: brightness(1.05);
}
/* Success (used by Register etc.) */
body.clean-theme .btn-success {
  background: linear-gradient(135deg, #34d399, color-mix(in oklab, var(--aqua), #34d399 40%)) !important;
  border-color: transparent !important;
  color: #0b0f16 !important;
}
body.clean-theme .btn-success:hover {
  filter: brightness(1.05);
}
/* Warning/Danger */
body.clean-theme .btn-warning {
  background: linear-gradient(135deg, #fbbf24, #f59e0b) !important;
  border-color: transparent !important;
  color: #0b0f16 !important;
}
body.clean-theme .btn-danger {
  background: linear-gradient(135deg, var(--coral), color-mix(in oklab, var(--coral), #ff9ea3 35%)) !important;
  border-color: transparent !important;
  color: #0b0f16 !important;
}
body.clean-theme .btn-warning:hover, body.clean-theme .btn-danger:hover {
  filter: brightness(1.05);
}
/* Link-style buttons */
body.clean-theme .btn-link {
  color: color-mix(in oklab, var(--aqua), #fff 20%) !important;
  background: transparent !important;
  border-color: transparent !important;
  text-decoration: underline;
}
body.clean-theme .btn-link:hover {
  color: #fff !important;
}
/* Make sure modals can’t force white buttons */
body.clean-theme .modal .btn, body.clean-theme .modal .btn-default, body.clean-theme .modal .btn-primary, body.clean-theme .modal .btn-success, body.clean-theme .modal .btn-info, body.clean-theme .modal .btn-warning, body.clean-theme .modal .btn-danger {
  background-clip: padding-box !important;
  /* inherit the styles above – this bump in specificity blocks Bootstrap white */
}
/* Optional: darken modal chrome so the buttons fit in */
body.clean-theme .modal-content {
  background: var(--surface-2) !important;
  border: 1px solid var(--border) !important;
}
body.clean-theme .modal-header, body.clean-theme .modal-footer {
  border-color: var(--border) !important;
}
/* ==== Kill the white tabs in modals (Login / New user?) ==== */
body.clean-theme .modal .nav-tabs {
  border-bottom: 1px solid var(--border) !important;
}
body.clean-theme .modal .nav-tabs > li > a {
  background: rgba(255, 255, 255, 0.06) !important;
  color: var(--text) !important;
  border: 1px solid var(--border) !important;
  border-bottom-color: transparent !important;
  margin-right: 0.35rem !important;
  text-shadow: none !important;
}
body.clean-theme .modal .nav-tabs > li > a:hover, body.clean-theme .modal .nav-tabs > li > a:focus {
  background: rgba(255, 255, 255, 0.1) !important;
  color: var(--text-strong) !important;
  border-color: color-mix(in oklab, var(--aqua), transparent 70%) !important;
  border-bottom-color: transparent !important;
}
/* Active tab (the one that was white) */
body.clean-theme .modal .nav-tabs > li.active > a, body.clean-theme .modal .nav-tabs > li.active > a:focus, body.clean-theme .modal .nav-tabs > li.active > a:hover {
  background: linear-gradient(135deg, var(--surface-1), var(--surface-2)) !important;
  color: var(--text-strong) !important;
  border: 1px solid var(--aqua) !important;
  border-bottom-color: var(--surface-2) !important;
  /* seamless with content panel */
  box-shadow: 0 2px 0 var(--surface-2) inset !important;
}
/* The panel under the tabs */
body.clean-theme .modal .tab-content {
  background: var(--surface-2) !important;
  border: 1px solid var(--border) !important;
  border-top: none !important;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.03);
}
/* Safety net: if any other tab set (pills) appears white */
body.clean-theme .modal .nav-pills > li > a {
  background: rgba(255, 255, 255, 0.06) !important;
  color: var(--text) !important;
}
body.clean-theme .modal .nav-pills > li.active > a, body.clean-theme .modal .nav-pills > li.active > a:focus, body.clean-theme .modal .nav-pills > li.active > a:hover {
  background: color-mix(in oklab, var(--aqua), #000 85%) !important;
  color: #0b0f16 !important;
}
/* ===== UrbanSocial — dark neon login ===== */
body.login-container {
  background: radial-gradient(1200px 600px at 20% -10%, #0f1a27 0%, #0a1320 35%, #07101b 60%, #060a12 100%) fixed;
  color: #eaf4ff;
  font-family: "Inter", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
}
/* Title */
#app-title {
  color: #eaf4ff !important;
  text-shadow: 0 8px 30px rgba(0, 0, 0, 0.45), 0 0 18px rgba(0, 224, 255, 0.18);
  letter-spacing: 0.5px;
}
/* Panels -> glass */
.panel.panel-default {
  background: rgba(255, 255, 255, 0.06) !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  border-radius: 18px !important;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.45), inset 0 1px 0 rgba(255, 255, 255, 0.05);
  backdrop-filter: blur(6px);
}
.panel-heading {
  background: linear-gradient(90deg, rgba(0, 224, 255, 0.2), rgba(255, 89, 230, 0.2)) !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.12) !important;
  color: #eaf4ff !important;
  font-weight: 700;
}
/* Inputs */
.form-control {
  background: rgba(0, 0, 0, 0.25) !important;
  border: 1px solid rgba(255, 255, 255, 0.18) !important;
  color: #eaf4ff !important;
  border-radius: 999px !important;
  height: 40px !important;
  padding: 10px 14px !important;
  box-shadow: inset 0 2px 6px rgba(0, 0, 0, 0.25);
}
.form-control::placeholder {
  color: #9fb4d1 !important;
}
.help-block {
  color: #9fb4d1 !important;
}
/* Buttons */
.btn-primary {
  background: linear-gradient(135deg, #00e0ff, #ff59e6) !important;
  border: 0 !important;
  color: #061018 !important;
  font-weight: 700;
  border-radius: 12px !important;
  box-shadow: 0 8px 20px rgba(0, 224, 255, 0.25), 0 8px 20px rgba(255, 89, 230, 0.2);
}
.btn-primary:hover {
  filter: brightness(1.05);
  transform: translateY(-1px);
}
/* Links */
a, .panel-body a {
  color: #49ee7c !important;
  text-decoration: none;
}
a:hover {
  text-decoration: underline;
}
/* Divider line */
hr {
  border-color: rgba(255, 255, 255, 0.12) !important;
}
/* Language select */
.langSwitcher .select2-selection--single {
  background: rgba(0, 0, 0, 0.25) !important;
  border: 1px solid rgba(255, 255, 255, 0.18) !important;
  color: #eaf4ff !important;
  border-radius: 12px !important;
}
/* Footer */
.powered a {
  color: #9fb4d1 !important;
  opacity: 0.8;
}
.powered a:hover {
  color: #eaf4ff !important;
  opacity: 1;
}
/* === Fix activity feed colours on mobile === */
body, .content, .panel, .activity-entry {
  background: #0a0f16 !important;
  /* darker feed background */
  color: #eaf4ff !important;
  /* standard text */
}
/* Override activity link colours */
.activity-entry a, .activity-entry a:link, .activity-entry a:visited {
  color: #49ee7c !important;
  /* neon green but readable */
  font-weight: 500;
}
.activity-entry a:hover {
  color: #00e0ff !important;
  /* cyan hover for contrast */
}
/* Dim timestamps and secondary text */
.activity-entry small, .activity-entry .time, .activity-entry .help-block {
  color: #9fb4d1 !important;
}
/* Titles for widgets ("Latest activities", "New Members") */
.panel-heading, .headline, .sidebar-header {
  background: none !important;
  color: #eaf4ff !important;
  border: none !important;
  font-weight: 600;
}
/* Fix status update box auto-sizing */
textarea.form-control, .humhub-ui-richtext textarea {
  min-height: 50px !important;
  /* small starting size */
  height: auto !important;
  /* let it grow */
  resize: vertical !important;
  /* allow manual drag too */
  overflow-y: hidden !important;
  /* prevent scrollbars */
}
/* --- Fix composer stuck height --- */
/* Keep 40px only for single-line inputs */
input.form-control {
  height: 40px !important;
}
/* Let multi-line areas auto-grow */
textarea.form-control {
  height: auto !important;
  min-height: 120px !important;
  max-height: none !important;
  resize: vertical !important;
  overflow-y: hidden !important;
}
/* HumHub ProseMirror composer uses a contenteditable div, not a textarea */
.humhub-ui-richtext, .humhub-ui-richtext .form-control, .ProseMirror {
  height: auto !important;
  min-height: 120px !important;
  max-height: none !important;
  overflow-y: visible !important;
}
/* === FIX composer weird circle/height bug === */
/* Inputs (single-line fields only) */
input.form-control {
  height: 40px !important;
}
/* Textareas (multi-line forms, not the composer) */
textarea.form-control {
  min-height: 120px !important;
  height: auto !important;
  max-height: none !important;
  resize: vertical !important;
  overflow-y: hidden !important;
}
/* HumHub rich text composer (ProseMirror) */
.humhub-ui-richtext, .humhub-ui-richtext .ProseMirror {
  min-height: 120px !important;
  height: auto !important;
  max-height: none !important;
  border-radius: 12px !important;
  border: 1px solid rgba(255, 255, 255, 0.18) !important;
  background: rgba(0, 0, 0, 0.25) !important;
  color: #eaf4ff !important;
  box-shadow: inset 0 2px 6px rgba(0, 0, 0, 0.25);
}
/* Make sure links, mentions etc inside composer display normally */
.humhub-ui-richtext .ProseMirror a {
  color: #49ee7c !important;
}