/*
 * ZeroBot Dashboard Theme
 * Clean, modern SaaS look — dark navy sidebar, rose accent, neutral content.
 * Sidebar: #1e1e2d  |  Accent: #b5264a  |  Content BG: #f1f1f6
 * Font: Poppins  |  Cards: white, minimal shadow
 */

@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap');

/* ── Root Variables ──────────────────────────────────────────── */
:root {
  --bs-font-sans-serif: 'Poppins', sans-serif;
  --bs-body-font-family: 'Poppins', sans-serif;

  --bs-primary: #b5264a;
  --bs-primary-rgb: 181, 38, 74;

  --bs-success: #b5264a;
  --bs-success-rgb: 181, 38, 74;
  --bs-danger: #e74c3c;
  --bs-danger-rgb: 231, 76, 60;
  --bs-warning: #f5a623;
  --bs-warning-rgb: 245, 166, 35;
  --bs-info: #5b9bd5;
  --bs-info-rgb: 91, 155, 213;

  --bs-link-color: #b5264a;
  --bs-link-hover-color: #8e1d3a;
}

/* ── Body ────────────────────────────────────────────────────── */
body {
  font-family: 'Poppins', sans-serif !important;
  background: #f1f1f6 !important;
  color: #333346 !important;
}

/* ── Sidebar ─────────────────────────────────────────────────── */
.vertical-menu {
  background: #1e1e2d !important;
  border-right: none !important;
}

.navbar-brand-box {
  background: #1e1e2d !important;
  border-bottom: 1px solid rgba(255,255,255,0.03) !important;
  border-right: none !important;
  border-color: rgba(255,255,255,0.03) !important;
  box-shadow: none !important;
}

.logo-txt {
  color: #ffffff !important;
  font-family: 'Poppins', sans-serif !important;
  font-weight: 600 !important;
}

/* Sidebar menu category labels */
.menu-title {
  color: #ffffff !important;
  font-size: 0.7rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
}

/* Sidebar links */
#sidebar-menu ul li a {
  color: #b0b0c0 !important;
  font-family: 'Poppins', sans-serif !important;
  font-size: 0.875rem !important;
  padding: 10px 20px !important;
  border-left: none !important;
  border-right: 3px solid transparent !important;
  transition: all 0.25s ease !important;
  position: relative !important;
}

#sidebar-menu ul li a i {
  color: #9090a4 !important;
  font-size: 1.1rem !important;
  min-width: 1.5rem !important;
  transition: color 0.25s ease !important;
}

#sidebar-menu ul li a:hover {
  color: #ffffff !important;
  background: linear-gradient(90deg, rgba(181,38,74,0.15) 0%, rgba(181,38,74,0.08) 60%, transparent 100%) !important;
  border-right: 3px solid #e84673 !important;
}

#sidebar-menu ul li a:hover i {
  color: #e84673 !important;
}

/* Active sidebar item — gradient bg + right accent bar */
#sidebar-menu ul li a.mm-active {
  color: #fff !important;
  background: linear-gradient(90deg, rgba(181,38,74,0.22) 0%, rgba(232,70,115,0.12) 60%, transparent 100%) !important;
  border-right: 3px solid #e84673 !important;
}

#sidebar-menu ul li a.mm-active i {
  color: #e84673 !important;
}

/* Sub-menu active */
#sidebar-menu ul li ul.sub-menu li a.active,
#sidebar-menu ul li ul.sub-menu li a.mm-active {
  color: #b5264a !important;
}

#sidebar-menu ul li ul.sub-menu li a {
  color: #9a9ab0 !important;
  font-size: 0.82rem !important;
}

#sidebar-menu ul li ul.sub-menu li a:hover {
  color: #ffffff !important;
}

/* ── Topbar ──────────────────────────────────────────────────── */
#page-topbar {
  background: #ffffff !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04) !important;
}

.header-item {
  color: #555 !important;
}

/* ── Buttons ─────────────────────────────────────────────────── */
.btn-primary {
  background-color: #b5264a !important;
  border-color: #b5264a !important;
  color: #fff !important;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-primary.active {
  background-color: #8e1d3a !important;
  border-color: #8e1d3a !important;
  color: #fff !important;
  box-shadow: 0 4px 12px rgba(181, 38, 74, 0.25) !important;
}

.btn-success {
  background-color: #b5264a !important;
  border-color: #b5264a !important;
  color: #fff !important;
}

.btn-success:hover,
.btn-success:focus,
.btn-success:active {
  background-color: #8e1d3a !important;
  border-color: #8e1d3a !important;
  color: #fff !important;
  box-shadow: 0 4px 12px rgba(181, 38, 74, 0.25) !important;
}

.btn-danger {
  background-color: #e74c3c !important;
  border-color: #e74c3c !important;
}

.btn-danger:hover,
.btn-danger:focus,
.btn-danger:active {
  background-color: #c0392b !important;
  border-color: #c0392b !important;
}

.btn-warning {
  background-color: #f5a623 !important;
  border-color: #f5a623 !important;
  color: #fff !important;
}

.btn-outline-primary {
  color: #b5264a !important;
  border-color: #b5264a !important;
}

.btn-outline-primary:hover,
.btn-outline-primary:active,
.btn-outline-primary.active {
  background-color: #b5264a !important;
  border-color: #b5264a !important;
  color: #fff !important;
}

/* ── Background Utilities ────────────────────────────────────── */
.bg-primary {
  background-color: #b5264a !important;
}

.bg-success {
  background-color: #b5264a !important;
}

.bg-danger {
  background-color: #e74c3c !important;
}

.bg-warning {
  background-color: #f5a623 !important;
}

.bg-info {
  background-color: #5b9bd5 !important;
}

/* ── Soft Backgrounds ────────────────────────────────────────── */
.bg-soft-primary {
  background: rgba(181, 38, 74, 0.08) !important;
  color: #b5264a !important;
}

.bg-soft-success {
  background: rgba(46, 204, 113, 0.08) !important;
  color: #27ae60 !important;
}

.bg-soft-danger {
  background: rgba(231, 76, 60, 0.08) !important;
  color: #e74c3c !important;
}

.bg-soft-warning {
  background: rgba(245, 166, 35, 0.08) !important;
  color: #e09400 !important;
}

.bg-soft-info {
  background: rgba(91, 155, 213, 0.08) !important;
  color: #5b9bd5 !important;
}

/* ── Text Utilities ──────────────────────────────────────────── */
.text-primary {
  color: #b5264a !important;
}

.text-success {
  color: #b5264a !important;
}

.text-danger {
  color: #e74c3c !important;
}

.text-warning {
  color: #e09400 !important;
}

.text-info {
  color: #5b9bd5 !important;
}

/* ── Badge Soft Variants ─────────────────────────────────────── */
.badge-soft-primary,
.badge.bg-primary.bg-opacity-10 {
  background-color: rgba(181, 38, 74, 0.08) !important;
  color: #b5264a !important;
}

.badge-soft-success {
  background-color: rgba(181, 38, 74, 0.08) !important;
  color: #b5264a !important;
}

.badge-soft-danger {
  background-color: rgba(231, 76, 60, 0.10) !important;
  color: #e74c3c !important;
}

.badge-soft-warning {
  background-color: rgba(245, 166, 35, 0.10) !important;
  color: #e09400 !important;
}

.badge-soft-info {
  background-color: rgba(91, 155, 213, 0.08) !important;
  color: #5b9bd5 !important;
}

/* ── Cards — white, minimal, clean ───────────────────────────── */
.card {
  border-radius: 12px !important;
  border: 1px solid #e8e8ef !important;
  background: #fff !important;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.04) !important;
  transition: box-shadow 0.2s ease;
}

.card:hover {
  box-shadow: 0 3px 12px rgba(0, 0, 0, 0.06) !important;
}

/* ── Tables — light neutral header ───────────────────────────── */
.table thead th {
  background: #f7f7fa !important;
  color: #6c6c80 !important;
  border: none !important;
  border-bottom: 1px solid #e8e8ef !important;
  font-weight: 600;
  font-size: 0.78rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.table-light th {
  background: #f7f7fa !important;
  color: #6c6c80 !important;
}

.table tbody td,
.table tbody th {
  background: #ffffff;
}

.table-hover tbody tr:hover td,
.table-hover tbody tr:hover th {
  background: #fafafe !important;
}

.table-responsive {
  background: #ffffff;
  border-radius: 8px;
  border: 1px solid #e8e8ef;
}

.table-striped > tbody > tr:nth-of-type(odd) > * {
  background: #fbfbfd !important;
}

/* ── Forms ───────────────────────────────────────────────────── */
.form-control:focus,
.form-select:focus {
  border-color: #d4899c !important;
  box-shadow: 0 0 0 3px rgba(181, 38, 74, 0.08) !important;
}

.form-check-input:checked {
  background-color: #b5264a !important;
  border-color: #b5264a !important;
}

/* Override cus.css hiding of native Bootstrap 5 form-switch inputs */
.form-check.form-switch .form-check-input {
  display: block !important;
  width: 2em !important;
  height: 1em !important;
  cursor: pointer !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='rgba%280, 0, 0, 0.25%29'/%3e%3c/svg%3e") !important;
  background-position: left center !important;
  background-size: contain !important;
  border-radius: 2em !important;
  transition: background-position .15s ease-in-out !important;
}

.form-check.form-switch .form-check-input:checked {
  background-position: right center !important;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23fff'/%3e%3c/svg%3e") !important;
}

/* ── Dashboard: Gradient Title ───────────────────────────────── */
.gradient-title {
  background: linear-gradient(90deg, #1e1e2d, #3a3a5c) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
}

/* ── Dashboard: News Items ───────────────────────────────────── */
.news-item {
  border-left: 4px solid #b5264a !important;
}

/* ── Dashboard: Stat Boxes ───────────────────────────────────── */
.stat-box {
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.04) !important;
  border: 1px solid #e8e8ef !important;
}

.stat-box:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.07) !important;
}

/* ── DataTables Pagination ───────────────────────────────────── */
.dataTables_wrapper .dataTables_paginate {
  margin-top: 20px !important;
  padding-bottom: 10px !important;
}

.dataTables_wrapper .dataTables_info {
  margin-top: 20px !important;
  padding-bottom: 10px !important;
}

/* Extra spacing when table is inside a card with tight padding */
.card-body .dataTables_wrapper .dataTables_paginate,
.card-body .dataTables_wrapper .dataTables_info {
  padding-left: 12px !important;
  padding-right: 12px !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.current,
.dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
  background: #b5264a !important;
  border-color: #b5264a !important;
  color: #fff !important;
  font-weight: 700 !important;
  border-radius: 6px !important;
  box-shadow: 0 2px 8px rgba(181, 38, 74, 0.3) !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button {
  border-radius: 6px !important;
  margin: 0 2px !important;
  font-weight: 500 !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button:hover {
  background: rgba(181, 38, 74, 0.1) !important;
  border-color: rgba(181, 38, 74, 0.15) !important;
  color: #b5264a !important;
}

/* ── Page Pagination ─────────────────────────────────────────── */
.page-item.active .page-link {
  background-color: #b5264a !important;
  border-color: #b5264a !important;
  color: #fff !important;
  font-weight: 700 !important;
  box-shadow: 0 2px 8px rgba(181, 38, 74, 0.3) !important;
  z-index: 3 !important;
}

.page-link {
  color: #b5264a !important;
  font-weight: 500 !important;
  border-radius: 6px !important;
  margin: 0 2px !important;
}

.page-link:hover {
  color: #8e1d3a !important;
  background-color: rgba(181, 38, 74, 0.08) !important;
}

/* ── Alertify ────────────────────────────────────────────────── */
.alertify .ajs-ok {
  background-color: #b5264a !important;
  color: #fff !important;
}

/* ── Pace Loader ─────────────────────────────────────────────── */
.pace .pace-progress {
  background: #b5264a !important;
}

/* ── Nav Tabs & Pills ────────────────────────────────────────── */
.nav-tabs .nav-link.active {
  color: #b5264a !important;
  border-bottom-color: #b5264a !important;
}

.nav-pills .nav-link.active {
  background-color: #b5264a !important;
}

/* ── Dropdown Active ─────────────────────────────────────────── */
.dropdown-item.active,
.dropdown-item:active {
  background-color: #fdf0f3 !important;
  color: #b5264a !important;
}

/* ── Border Primary ──────────────────────────────────────────── */
.border-primary {
  border-color: #b5264a !important;
}

/* ── Success → Primary Overrides ────────────────────────────── */
.border-success {
  border-color: #b5264a !important;
}

.alert-success {
  background-color: rgba(181, 38, 74, 0.08) !important;
  border-color: rgba(181, 38, 74, 0.2) !important;
  color: #b5264a !important;
}

.bg-success-subtle,
.bg-success.bg-opacity-10 {
  background-color: rgba(181, 38, 74, 0.1) !important;
}

.btn-outline-success {
  color: #b5264a !important;
  border-color: #b5264a !important;
}

.btn-outline-success:hover,
.btn-outline-success:active,
.btn-outline-success.active {
  background-color: #b5264a !important;
  border-color: #b5264a !important;
  color: #fff !important;
}

/* ── Collapsed Sidebar (sm) — flyout menus on hover ─────────── */
body[data-sidebar-size=sm] .vertical-menu #sidebar-menu > ul > li:hover > a {
  background: #1e1e2d !important;
  color: #e84673 !important;
  width: calc(190px + 70px) !important;
}

body[data-sidebar-size=sm] .vertical-menu #sidebar-menu > ul > li:hover > a i {
  color: #e84673 !important;
}

body[data-sidebar-size=sm] .vertical-menu #sidebar-menu > ul > li:hover > a span {
  display: inline !important;
  color: #fff !important;
}

body[data-sidebar-size=sm] .vertical-menu #sidebar-menu > ul > li:hover > ul {
  background-color: #1e1e2d !important;
}

body[data-sidebar-size=sm] .vertical-menu #sidebar-menu > ul > li:hover > ul a {
  color: #b0b0c0 !important;
  background: transparent !important;
}

body[data-sidebar-size=sm] .vertical-menu #sidebar-menu > ul > li:hover > ul a:hover {
  color: #fff !important;
  background: rgba(181,38,74,0.15) !important;
}

body[data-sidebar-size=sm] .vertical-menu #sidebar-menu > ul ul {
  background-color: #1e1e2d !important;
}

/* ── Mobile Sidebar — hidden by default, only show when toggled ── */
@media (max-width: 991.98px) {
  .vertical-menu {
    display: none !important;
  }
  body.sidebar-enable .vertical-menu {
    display: block !important;
  }
}

/* ── Footer ──────────────────────────────────────────────────── */
.footer {
  font-family: 'Poppins', sans-serif !important;
  background: #f1f1f6 !important;
}

/* ── Page Content Background ─────────────────────────────────── */
.main-content {
  background: #f1f1f6 !important;
}