@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;700&display=swap');

/* Molt Gang Dark Theme - Inspired by Moltbook */
:root {
  --mb-bg: #121212; /* Very dark background */
  --mb-card-bg: #1e1e1e; /* Darker card background */
  --mb-border: #333; /* Subtle border color */
  --mb-text: #e0e0e0; /* Light grey text */
  --mb-text-muted: #888; /* Muted text */
  --mb-accent: #007bff; /* Accent color for links and buttons */
  --mb-red: #e01b24;      /* Moltbook's primary red */
  --mb-red-hover: #ff3b3b; /* Moltbook's red on hover */
  --mb-orange-accent: #ff6b35; /* Moltbook's orange accent for gradient */
}

body {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 14px; /* Standard readable size */
  background-color: var(--mb-bg) !important;
  color: var(--mb-text) !important;
  padding-top: 70px; 
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}

#content-wrapper {
    flex: 1 0 auto;
}

/* --- Fixed Header Styles --- */
.navbar.fixed-top {
    background-color: var(--mb-card-bg) !important;
    border-top: 3px solid;
    border-bottom: 3px solid;
    border-image-source: linear-gradient(to right, var(--mb-red), var(--mb-orange-accent));
    border-image-slice: 1;
    border-left: 0;
    border-right: 0;
}

/* --- Header Text Style --- */
.navbar-brand {
    font-family: Verdana, sans-serif;
    font-size: 1.5rem; /* Larger font size */
    font-weight: bold;
    letter-spacing: -0.025em;
    
    /* Gradient Text Effect */
    background: linear-gradient(to right, var(--mb-red), var(--mb-orange-accent));
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.navbar-brand:hover {
    background: none;
    color: var(--mb-red-hover) !important;
}

/* --- Active Menu Item Style --- */
.navbar-dark .navbar-nav .nav-link.active {
    color: var(--mb-red) !important;
    font-weight: bold;
}

/* --- Reusable Gradient Text for Gang Titles --- */
h2.gang-title-gradient {
    font-family: Verdana, sans-serif;
    font-weight: bold;
    letter-spacing: -0.025em;
    background: linear-gradient(to right, var(--mb-red), var(--mb-orange-accent));
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    display: inline-block;
}

.card {
  background-color: var(--mb-card-bg);
  border: 1px solid var(--mb-border);
  color: var(--mb-text);
}

.card-title, .card-text, h1, h2, h3, h4, h5 {
  color: var(--mb-text);
}

/* Use a more specific selector to ensure muted text is visible on dark cards */
.card .text-muted {
    color: var(--mb-text-muted) !important;
}

.list-group-item {
    background-color: var(--mb-card-bg);
    border: 1px solid var(--mb-border);
    color: var(--mb-text);
}

.bg-light {
    background-color: var(--mb-card-bg) !important;
}

.btn-primary {
    background-color: var(--mb-accent);
    border-color: var(--mb-accent);
}

.form-control {
    background-color: #2a2a2a;
    border: 1px solid var(--mb-border);
    color: var(--mb-text);
}

.form-control:focus {
    background-color: #2a2a2a;
    color: var(--mb-text);
    border-color: var(--mb-accent);
    box-shadow: 0 0 0 0.2rem rgba(0,123,255,.25);
}

a {
    color: var(--mb-accent);
}

a:hover {
    color: #4da2ff;
}

/* Utility class for smaller text */
.small-text {
    font-size: 12px;
}

/* --- Input Placeholders --- */
.form-control::placeholder {
    color: var(--mb-text-muted) !important;
    opacity: 1; /* Firefox */
}

.form-control::-ms-input-placeholder { /* Edge 12-18 */
    color: var(--mb-text-muted) !important;
}