/* VeriBeat Theme (LIGHT v2) — css/theme.css only
   Changes vs v1:
   - calmer red for readability
   - fix topbar/menu alignment + spacing
*/

:root {
  --vb-accent: #e50914;
  /* tuned red: calmer + readable on white */
  --vb-accent-ink: #c10f17;
  --vb-accent-hover: #a30d13;

  --vb-bg: #f4f4f6;
  --vb-bg2: #ffffff;
  --vb-ink: #0a0a0d;
  --vb-ink-soft: rgba(10,10,13,0.62);
  --vb-card: rgba(255,255,255,0.92);
  --vb-border: rgba(10,10,13,0.18);
  --vb-border-strong: rgba(10,10,13,0.32);
  --vb-shadow: 0 10px 26px rgba(10,10,13,0.10);
}

html, body {
  background: radial-gradient(circle at 18% 12%, rgba(255,255,255,0.9), transparent 55%),
              radial-gradient(circle at 70% 30%, rgba(255,255,255,0.78), transparent 60%),
              linear-gradient(180deg, var(--vb-bg), var(--vb-bg2)) !important;
  color: var(--vb-ink) !important;
}

body::before {
  content:"";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  opacity: 0.40;
  background:
    linear-gradient(120deg, rgba(255,255,255,0.0) 0%,
                           rgba(255,255,255,0.55) 40%,
                           rgba(255,255,255,0.0) 70%),
    radial-gradient(circle at 20% 20%, rgba(255,255,255,0.55), transparent 55%),
    radial-gradient(circle at 85% 70%, rgba(255,255,255,0.45), transparent 55%);
  mix-blend-mode: screen;
  animation: vb-shimmer 10s linear infinite;
}
@keyframes vb-shimmer {
  0% { transform: translateX(-12%) translateY(-2%); }
  50% { transform: translateX(8%) translateY(2%); }
  100% { transform: translateX(-12%) translateY(-2%); }
}

#layout, .container, .container-fluid, .content, .page, .content-container {
  position: relative;
  z-index: 1;
}

/* --- Topbar/Menu fix --- */
#topbar, .topbar, .navbar, .navbar-default {
  background: rgba(255,255,255,0.90) !important;
  border-bottom: 1px solid var(--vb-border) !important;
  backdrop-filter: blur(10px);
  box-shadow: 0 6px 20px rgba(10,10,13,0.08);
}

/* Force proper height + center alignment */
#topbar .container, #topbar .container-fluid,
.navbar .container, .navbar .container-fluid {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  min-height: 64px !important;
}

/* Prevent the left menu from dropping into a huge vertical block */
#topbar .nav, .navbar .nav {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  flex-wrap: nowrap !important;
}

/* Fix hamburger/menu positioning */
#topbar .dropdown, #topbar .nav > li {
  position: relative !important;
}

/* Logo sizing / spacing */
#topbar .logo, #topbar .topbar-brand, .navbar-brand {
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 6px 10px !important;
  height: 64px !important;
}
#topbar img, .navbar-brand img {
  max-height: 36px !important;
  width: auto !important;
}

/* Right side user menu readable */
#topbar a, .navbar a {
  color: var(--vb-ink) !important;
}

/* Dropdowns stay clickable */
.dropdown-menu {
  border: 1px solid var(--vb-border-strong) !important;
  box-shadow: 0 18px 40px rgba(10,10,13,0.12) !important;
  z-index: 4000 !important;
}

/* --- Links --- */
a, a:visited {
  color: var(--vb-accent-ink) !important;
}
a:hover {
  color: var(--vb-accent-hover) !important;
  text-decoration: underline;
}

/* Cards/panels */
.panel, .card, .well, .modal-content, .dropdown-menu, .stream-entry, .wall-entry {
  background: var(--vb-card) !important;
  color: var(--vb-ink) !important;
  border: 1px solid var(--vb-border-strong) !important;
  border-radius: 12px !important;
  box-shadow: var(--vb-shadow) !important;
  position: relative;
  overflow: hidden;
}

/* subtle animated edge shimmer */
.panel::after, .card::after, .well::after, .stream-entry::after, .wall-entry::after {
  content:"";
  position:absolute;
  inset:-2px;
  pointer-events:none;
  background:
    linear-gradient(120deg,
      rgba(255,255,255,0.0) 0%,
      rgba(255,255,255,0.55) 35%,
      rgba(255,255,255,0.0) 70%);
  opacity: 0.24;
  transform: translateX(-40%);
  animation: vb-edge 7s linear infinite;
}
@keyframes vb-edge {
  0% { transform: translateX(-55%); }
  100% { transform: translateX(55%); }
}

/* Headings */
.panel-heading, .panel .panel-heading, .card-header {
  background: transparent !important;
  border-bottom: 1px solid var(--vb-border) !important;
  color: rgba(10,10,13,0.78) !important;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

/* Inputs */
input, textarea, select, .form-control {
  background: rgba(255,255,255,0.98) !important;
  border: 1px solid var(--vb-border-strong) !important;
  color: var(--vb-ink) !important;
  border-radius: 10px !important;
}
input:focus, textarea:focus, select:focus, .form-control:focus {
  border-color: var(--vb-accent-ink) !important;
  box-shadow: 0 0 0 2px rgba(193,15,23,0.16) !important;
  outline: none !important;
}

/* Buttons */
.btn, button, .btn-default, .btn-primary {
  border-radius: 10px !important;
  border: 1px solid var(--vb-border-strong) !important;
  background: #ffffff !important;
  color: var(--vb-ink) !important;
  box-shadow: 0 8px 18px rgba(10,10,13,0.10) !important;
}
.btn-primary {
  border-color: rgba(193,15,23,0.55) !important;
}
.btn:hover, button:hover {
  transform: translateY(-1px);
}

/* Muted text */
small, .help-block, .text-muted {
  color: var(--vb-ink-soft) !important;
}
