/* ==========================================================================
   tosa100 admin theme
   Colours pulled from tosa-web (css/style.css): brand green #0E5E00
   Only colours are overridden here – layout/spacing stays Hope UI default.
   ========================================================================== */

:root,
:root.theme-color-default {
  --tosa-green: #0E5E00;
  --tosa-green-deep: #0B4A00;
  --tosa-green-mid: #1A7A0F;
  --tosa-green-light: #C2FFCC;
  --tosa-green-soft: #E4FFE8;

  --bs-primary: #0E5E00;
  --bs-primary-rgb: 14, 94, 0;
  --bs-link-color: #0E5E00;
  --bs-link-hover-color: #0B4A00;

  --primary: #0E5E00;
  --primary-lighten: #E4FFE8;
}

/* Links */
a { color: var(--tosa-green); }
a:hover { color: var(--tosa-green-deep); }

/* Buttons */
.btn-primary,
.btn-primary:focus {
  background-color: var(--tosa-green) !important;
  border-color: var(--tosa-green) !important;
  color: #fff !important;
}
.btn-primary:hover,
.btn-primary:active,
.btn-primary.active,
.btn-check:checked + .btn-primary {
  background-color: var(--tosa-green-deep) !important;
  border-color: var(--tosa-green-deep) !important;
}
.btn-outline-primary {
  color: var(--tosa-green) !important;
  border-color: var(--tosa-green) !important;
}
.btn-outline-primary:hover {
  background-color: var(--tosa-green) !important;
  border-color: var(--tosa-green) !important;
  color: #fff !important;
}
.btn-soft-primary {
  color: var(--tosa-green) !important;
  background-color: var(--tosa-green-soft) !important;
}

/* Backgrounds / text / borders */
.bg-primary { background-color: var(--tosa-green) !important; }
.text-primary { color: var(--tosa-green) !important; }
.border-primary { border-color: var(--tosa-green) !important; }
.bg-soft-primary { background-color: var(--tosa-green-soft) !important; }
.badge.bg-primary { background-color: var(--tosa-green) !important; }

/* Forms */
.form-control:focus,
.form-select:focus {
  border-color: var(--tosa-green-mid);
  box-shadow: 0 0 0 0.15rem rgba(14, 94, 0, 0.20);
}
.form-check-input:checked {
  background-color: var(--tosa-green);
  border-color: var(--tosa-green);
}

/* Sidebar */
.sidebar .navbar-nav .nav-item .nav-link.active,
.sidebar .navbar-nav .nav-item .nav-link[aria-expanded="true"],
.sidebar .navbar-nav .nav-item .nav-link:hover {
  background-color: var(--tosa-green) !important;
  color: #fff !important;
}
.sidebar .navbar-nav .nav-item .nav-link.active .icon,
.sidebar .navbar-nav .nav-item .nav-link:hover .icon { color: #fff !important; }
.sidebar .logo-title,
.navbar-brand .logo-title { color: var(--tosa-green) !important; }
.sidebar .logo-main svg,
.navbar-brand .logo-main svg { color: var(--tosa-green) !important; }

/* Navbar header banner */
.iq-navbar-header .iq-navbar-header-color,
.iq-navbar .iq-navbar-header,
.iq-navbar-header { background-color: transparent; }
.iq-navbar-header::before,
.iq-navbar-header::after { background: var(--tosa-green) !important; }

/* Table accents */
.table > :not(caption) > * > * { --bs-table-accent-bg: transparent; }
.table-primary { --bs-table-bg: var(--tosa-green-soft); }

/* Progress / circle widgets */
.circle-progress-primary .progress-value,
.circle-progress-primary path.circle-progress-value { stroke: var(--tosa-green) !important; color: var(--tosa-green) !important; }

/* Pagination */
.page-item.active .page-link {
  background-color: var(--tosa-green);
  border-color: var(--tosa-green);
}
.page-link { color: var(--tosa-green); }

/* Alerts (success reused as brand confirmation) */
.alert-success {
  background-color: var(--tosa-green-soft);
  border-color: var(--tosa-green-light);
  color: var(--tosa-green-deep);
}

/* ==========================================================================
   Layout fix — this build has no hero banner (.iq-navbar-header), so Hope UI's
   "pull the content up under the navbar" rule hides the first row of cards.
   Cancel the negative margin and give the content normal breathing room.
   ========================================================================== */
.iq-banner:not(.hide) + .content-inner,
.iq-banner + .content-inner {
  margin-top: 0 !important;
  padding-top: 1.5rem !important;
  padding-bottom: 1.5rem !important;
}

@media (max-width: 991.98px) {
  .iq-banner:not(.hide) + .content-inner {
    margin-top: 0 !important;
    padding-top: 1rem !important;
  }
}

@media (max-width: 767.98px) {
  .iq-banner:not(.hide) + .content-inner {
    margin-top: 0 !important;
  }
}