/* ---------------------------------------------------------
   SIMPLE, CLEAN, LEGIBLE THEME FOR RENTBOT
   --------------------------------------------------------- */

:root {
    --bg-dark: #1f1f1f;
    --bg-light: #f2f2f2;
    --bg-card: #ffffff;
    --text-dark: #111;
    --text-light: #f7f7f7;
    --accent: #0d6efd;
}

/* ---- Global ---- */
body {
    background: var(--bg-dark);
    color: var(--text-light);
    font-family: Arial, sans-serif;
}

/* ---- Sidebar ---- */
.rb-sidebar {
    background: #121212;
    color: var(--text-light);
}

.rb-sidebar .nav-link {
    color: #bbbbbb;
    padding: 10px 15px;
}

.rb-sidebar .nav-link.active,
.rb-sidebar .nav-link:hover {
    background: #0d6efd33;
    color: white !important;
}

/* ---- Top nav ---- */
.rb-topbar {
    background: #000000;
    color: var(--text-light);
    border-bottom: 1px solid #222;
}

.rb-brand {
    color: #5ce1ff;
    font-size: 22px;
    text-decoration: none;
}

/* ---- Main area ---- */
.rb-main {
    background: #1a1a1a;
    min-height: 100vh;
}

/* ---- Headings ---- */
h2, .rb-page-title {
    color: #e2e2e2;
    margin-bottom: 20px;
}

/* ---- Cards ---- */
.rb-card, .card {
    background: var(--bg-card);
    color: var(--text-dark);
    padding: 20px;
    border-radius: 8px;
    box-shadow: 0 4px 20px rgba(0,0,0,0.15);
    margin-bottom: 25px;
}

/* ---- Tables ---- */
.table {
    background: var(--bg-card);
    color: var(--text-dark) !important;
}

.table thead {
    background: #e9e9e9 !important;
    color: #111;
}

.table tbody tr:nth-child(even) {
    background: #f7f7f7;
}

.table tbody tr:hover {
    background: #e0f0ff;
}

/* ---- Buttons ---- */
.btn {
    font-weight: bold;
    border-radius: 6px;
}

.btn-primary {
    background: #0d6efd;
    border: none;
}

.btn-success {
    background: #28a745;
    border: none;
}

.btn-danger {
    background: #dc3545;
    border: none;
}

.btn-warning {
    background: #ffc107;
    border: none;
    color: #111;
}

.btn-outline-light {
    border-color: white;
    color: white;
}

/* ---- Inputs ---- */
input, select, textarea {
    background: #ffffff;
    color: #111;
    border: 1px solid #ccc;
}

/* ---- TABS ---- */
.nav-tabs .nav-link {
    color: #0d6efd;
}

.nav-tabs .nav-link.active {
    background: #e9e9e9;
    color: #111;
    font-weight: bold;
}

/* ---------- Make main content full-width (fills page) ---------- */
/* Place this at the end of static/style.css */

.rb-app { align-items: stretch; }

/* main column takes the remaining width beside the sidebar */
.rb-main {
  flex: 1 1 auto !important;
  width: calc(100% - 220px) !important; /* 220px = sidebar width */
  padding: 28px 40px !important;
  box-sizing: border-box;
}

/* ensure the container inside main is full width */
.rb-main .container-fluid,
.rb-main > .container-fluid {
  width: 100% !important;
  max-width: 100% !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* cards and tables should expand to full width of their container */
.rb-card, .card, .table-wrapper, .table-container {
  width: 100% !important;
  box-sizing: border-box;
}

/* make dashboard tiles distribute across the full row */
.tiles { display:flex; gap:18px; flex-wrap:wrap; width:100%; }
.tile { flex: 1 1 22%; min-width: 180px; max-width: 32%; }

/* responsive adjustments */
@media (max-width: 1200px) {
  .tile { flex: 1 1 45%; max-width: 48%; }
}
@media (max-width: 768px) {
  .rb-sidebar { display: none; }
  .rb-main { width: 100% !important; padding: 18px !important; }
  .tile { flex: 1 1 100%; max-width: 100%; }
  .rb-topbar { padding: 10px; }
}

/* ============================================================
   UNIVERSAL BLUE BUTTON THEME — applies to all buttons
   ============================================================ */

/* Base button */
.btn {
  background-color: #007bff !important;   /* Blue */
  border-color: #007bff !important;
  color: #ffffff !important;
  font-weight: 600;
  border-radius: 6px !important;
  transition: 0.15s ease-in-out;
}

/* Hover */
.btn:hover {
  background-color: #0069d9 !important;
  border-color: #0062cc !important;
  color: #ffffff !important;
  opacity: 1 !important;
}

/* Active / Focus */
.btn:active,
.btn:focus {
  background-color: #005cbf !important;
  border-color: #0056b3 !important;
  box-shadow: 0 0 0 0.25rem rgba(0,123,255,0.35) !important;
  color: #ffffff !important;
}

/* Even buttons that were red / outline / light */
.btn-outline-light,
.btn-outline-dark,
.btn-outline-primary,
.btn-danger,
.btn-warning,
.btn-success,
.btn-light {
  background-color: #007bff !important;
  border-color: #007bff !important;
  color: #fff !important;
}

/* Links styled as buttons */
a.btn,
button.btn {
  background-color: #007bff !important;
  border-color: #007bff !important;
  color: #fff !important;
}

/* Tab buttons (payments tab, analytics tab, etc.) */
.nav-tabs .nav-link {
  background-color: #1a1a1a !important; 
  color: #007bff !important;
  border: 1px solid #007bff !important;
}

.nav-tabs .nav-link.active {
  background-color: #007bff !important;
  color: #ffffff !important;
}

/* Add Tenant / Add Expense floating buttons */
.add-btn,
.receive-btn {
  background-color: #007bff !important;
  border-color: #007bff !important;
  color: #ffffff !important;
}