/* =========================================================
   Tiply Layout Styles
   ========================================================= */

body { background:#0b1220; color:#e5e7eb; }

.card {
  background:#0f172a;
  border:1px solid rgba(255,255,255,.08);
}

.muted { color:#9ca3af; }

.nav-pill {
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.08);
}

.brand {
  letter-spacing:.5px;
  font-weight:800;
}

a { color:#93c5fd; }
a:hover { color:#bfdbfe; }

.badge-soft {
  background:rgba(59,130,246,.15);
  color:#bfdbfe;
  border:1px solid rgba(59,130,246,.3);
}

.tip-img {
  border-radius:12px;
  border:1px solid rgba(255,255,255,.08);
  max-width:520px;
}

.shadow-soft {
  box-shadow:0 10px 30px rgba(0,0,0,.25);
}

.form-control, .form-select {
  background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.12);
  color:#e5e7eb;
}

.form-control:focus, .form-select:focus {
  border-color:rgba(147,197,253,.6);
  box-shadow:0 0 0 .2rem rgba(147,197,253,.15);
}

.form-label { color:#cbd5e1; }


.dropdown-menu {
  background:#0f172a !important;
  border:1px solid rgba(255,255,255,.08) !important;
}
.dropdown-item {
  color:#e5e7eb !important;
}
.dropdown-item:hover, .dropdown-item:focus {
  background:rgba(255,255,255,.06) !important;
}
.dropdown-divider {
  border-top:1px solid rgba(255,255,255,.08) !important;
}


/* Make FAB content blend into Tiply dark theme */
.page-content, .container-fluid, .content {
  background: transparent !important;
}

/* FAB list/edit pages often use panels/cards */
.panel, .panel-default, .card, .well {
  background:#0f172a !important;
  border:1px solid rgba(255,255,255,.08) !important;
  color:#e5e7eb !important;
}

/* ---------- FAB-safe topbar ---------- */
.tiply-topbar {
  padding: 14px 22px;
  background: transparent;
}

.tiply-topbar-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  width: 100%;
}

.tiply-brand {
  display: flex;
  align-items: center;
  gap: 10px;
}

.tiply-nav {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: nowrap;
}

/* prevent FAB/Bootstrap3 styles from ruining our navbar layout */
.tiply-topbar .dropdown,
.tiply-topbar .btn {
  white-space: nowrap;
}

/* On very small screens allow wrapping */
@media (max-width: 700px) {
  .tiply-topbar-inner {
    flex-wrap: wrap;
    justify-content: flex-start;
  }
  .tiply-nav {
    flex-wrap: wrap;
  }
}