/**
 * Tabler Overrides
 * Customizations to Tabler's default styles
 * Scoped under .rauda-theme for explicit opt-in
 */

/* ========================================
   GLOBAL
   ======================================== */

.rauda-theme {
  font-family: var(--rauda-font-sans);
  background-color: var(--rauda-background);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* ========================================
   TYPOGRAPHY
   ======================================== */

.rauda-theme h1,
.rauda-theme .h1,
.rauda-theme .page-title {
  font-size: var(--rauda-text-3xl) !important;
  font-weight: 500 !important;
  line-height: 1.25 !important;
}

.rauda-theme h2,
.rauda-theme .h2 {
  font-size: var(--rauda-text-2xl) !important;
  font-weight: 500 !important;
  line-height: 1.25 !important;
}

.rauda-theme h3,
.rauda-theme .h3 {
  font-size: var(--rauda-text-xl) !important;
  font-weight: 500 !important;
  line-height: 1.3 !important;
}

.rauda-theme h4,
.rauda-theme .h4 {
  font-size: var(--rauda-text-lg) !important;
  font-weight: 500 !important;
  line-height: 1.3 !important;
}

.rauda-theme h5,
.rauda-theme .h5 {
  font-size: var(--rauda-text-md) !important;
  font-weight: 500 !important;
  line-height: 1.4 !important;
}

.rauda-theme h6,
.rauda-theme .h6 {
  font-size: var(--rauda-text-base) !important;
  font-weight: 500 !important;
  line-height: 1.4 !important;
}

/* ========================================
   BUTTONS
   ======================================== */

.rauda-theme .btn-primary {
  --tblr-btn-bg: var(--rauda-accent);
  --tblr-btn-border-color: var(--rauda-accent);
  --tblr-btn-hover-bg: var(--rauda-accent-hover);
  --tblr-btn-hover-border-color: var(--rauda-accent-hover);
}

/* ========================================
   TEXT COLORS
   ======================================== */

.rauda-theme .text-primary {
  color: var(--rauda-accent) !important;
}

/* ========================================
   CARDS
   ======================================== */

.rauda-theme .card {
  border: 1px solid var(--rauda-grey-light);
  border-radius: var(--rauda-radius-xl);
  overflow: hidden;
  box-shadow: none;
  background-color: var(--rauda-white);
}

.rauda-theme .card-body {
  padding: var(--rauda-space-6);
}

.rauda-theme .card-title {
  font-size: var(--rauda-text-sm);
  font-weight: 500;
  color: var(--rauda-grey-text);
}

.rauda-theme .card .table {
  margin-bottom: 0;
}

.rauda-theme .card .table thead th:first-child,
.rauda-theme .card .table thead th:last-child {
  border-radius: 0 !important;
}

.rauda-theme .card .table-responsive:first-child .table thead th:first-child,
.rauda-theme .card .table-responsive:first-child .table thead th:last-child {
  border-radius: 0 !important;
}

/* ========================================
   TABLES
   ======================================== */

.rauda-theme .table thead th {
  background-color: var(--rauda-grey-light);
  border-radius: 0 !important;
  padding-top: var(--rauda-space-3);
  padding-bottom: var(--rauda-space-3);
}

.rauda-theme .table > tbody > tr {
  cursor: pointer;
  transition: background-color var(--rauda-transition-fast);
}

.rauda-theme .table > tbody > tr:hover {
  background-color: var(--rauda-grey-light);
}

/* ========================================
   NAVBAR / SIDEBAR
   ======================================== */

.rauda-theme .navbar-vertical {
  background-color: var(--rauda-blue-background) !important;
  border-right: none !important;
  /* Scroll the sidebar when its items exceed a short viewport height. */
  max-height: 100vh;
  overflow-y: auto;
}

/* Bare horizontal top bar shown outside a project (projects list, 404): just the
   brand on the Rauda blue, no nav. */
.rauda-theme .rauda-topbar {
  background-color: var(--rauda-blue-background) !important;
  border-bottom: none !important;
}

.rauda-theme .rauda-topbar .navbar-brand {
  margin-left: 0 !important;
  padding-top: var(--rauda-space-4) !important;
  padding-bottom: var(--rauda-space-4) !important;
}

/* Collapsed top navbar (< lg): keep the dropdown menu reachable by scrolling
   on short screens instead of letting it overflow past the viewport. */
@media (max-width: 991.98px) {
  .rauda-theme .navbar-vertical .navbar-collapse {
    max-height: 80vh;
    overflow-y: auto;
  }
}

.rauda-theme .navbar-vertical .nav-link {
  color: rgba(255, 255, 255, 0.7) !important;
}

.rauda-theme .navbar-vertical .nav-link:hover {
  color: #ffffff !important;
  background-color: rgba(255, 255, 255, 0.1) !important;
}

.rauda-theme .navbar-vertical .nav-item.active .nav-link,
.rauda-theme .navbar-vertical .nav-link.active {
  color: #ffffff !important;
  background-color: rgba(255, 255, 255, 0.15) !important;
}

.rauda-theme .navbar-vertical .nav-link-icon {
  color: inherit !important;
}

.rauda-theme .navbar-brand {
  padding-top: var(--rauda-space-8) !important;
  padding-bottom: var(--rauda-space-4) !important;
  margin-left: -16px !important;
}

.rauda-theme .navbar-brand img {
  height: 28px !important;
  width: auto !important;
}

/* ========================================
   PAGE LAYOUT
   ======================================== */

.rauda-theme .page-header {
  padding: var(--rauda-space-3) 0;
}

/* ========================================
   PAGINATION
   ======================================== */

.rauda-theme .page-link {
  font-size: inherit;
}

/* ========================================
   DROPDOWNS
   ======================================== */

.rauda-theme .dropdown-item.active,
.rauda-theme .dropdown-item:active {
  background-color: var(--rauda-grey-light);
  color: var(--rauda-black);
}