:root {
  --project-green: #29E775;
  --project-green-dark: #1cb55e;
  --project-gold: #F3CC1A;
  --project-gold-dark: #d4b114;
  --project-red: #ef4444;
}

/* ── Sidebar green personalizado ── */
.sidebar-dark-green {
  background-color: #1a7a3a !important;
}

.sidebar-dark-green .brand-link {
  border-bottom-color: rgba(255,255,255,.1);
}

.sidebar-dark-green .nav-sidebar > .nav-item > .nav-link.active {
  background-color: var(--project-green);
  color: #1a1a2e;
}

.sidebar-dark-green .nav-sidebar > .nav-item > .nav-link:hover {
  background-color: rgba(41,231,117,.15);
}

.sidebar-dark-green .nav-header {
  color: rgba(255,255,255,.5);
  font-size: .7rem;
  text-transform: uppercase;
  letter-spacing: 1px;
  padding: 12px 16px 4px;
}

/* ── Navbar ── */
.main-header.navbar-white {
  border-bottom: 1px solid #e5e7eb;
}

/* ── Botones con paleta ── */
.btn-project-primary {
  background-color: #28a745;
  color: #fff;
  border-color: #28a745;
}

.btn-project-primary:hover {
  background-color: #218838;
  border-color: #1e7e34;
  color: #fff;
}

.btn-project-danger {
  background-color: var(--project-red);
  border-color: var(--project-red);
  color: #fff;
}

.btn-project-danger:hover {
  background-color: #dc2626;
  border-color: #dc2626;
  color: #fff;
}

/* ── Accent green override ── */
.accent-green .btn-primary,
.accent-green .btn-success {
  background-color: var(--project-green);
  border-color: var(--project-green);
  color: #1a1a2e;
}

.accent-green .btn-primary:hover,
.accent-green .btn-success:hover {
  background-color: var(--project-green-dark);
  border-color: var(--project-green-dark);
  color: #1a1a2e;
}

/* ── Brand icon en sidebar ── */
.brand-image {
  opacity: .9;
  font-size: 1.6rem;
  margin-left: .2rem;
  margin-right: .5rem;
  float: none;
}

/* ── DataTables ── */
.card-body { min-width: 0; }
table.dataTable { width: 100% !important; }
table.dataTable td { word-break: break-word; }
.dataTables_wrapper { overflow-x: auto; max-width: 100%; }
.dataTables_wrapper .dt-buttons { margin-bottom: 0.5rem; }
.dataTables_wrapper .dataTables_filter input { max-width: 180px; }

/* ── Form controls ── */
select, input, textarea {
  font-size: .875rem;
}

/* ── Spinner overlay ── */
#action-loader {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(255,255,255,0.75);
  z-index: 9999;
  display: none;
  justify-content: center;
  align-items: center;
}
#action-loader.show {
  display: flex;
}

/* ── Utilities ── */
.flex-between {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}

/* ── Responsive ── */
@media (max-width: 768px) {
  .card-body { padding: 0.75rem; }
  .table { font-size: 0.85rem; }
  .btn { font-size: 0.8rem; padding: 0.25rem 0.5rem; }
  .dropdown-menu { font-size: 0.85rem; }
  div.dataTables_wrapper div.dataTables_filter,
  div.dataTables_wrapper div.dataTables_length {
    float: none;
    text-align: left;
    margin-bottom: 0.5rem;
  }
}

@media (max-width: 576px) {
  .card-body { padding: 0.5rem; }
  .table { font-size: 0.75rem; }
  th, td { padding: 0.3rem !important; }
  .btn-sm i + span { display: none; }
  .content-header h1 { font-size: 1.25rem; }
  .dataTables_wrapper .dt-buttons {
    float: none;
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem;
    margin-bottom: 0.5rem;
  }
  div.dataTables_wrapper div.dataTables_filter,
  div.dataTables_wrapper div.dataTables_length,
  div.dataTables_wrapper div.dataTables_info,
  div.dataTables_wrapper div.dataTables_paginate {
    float: none;
    text-align: left;
    margin-bottom: 0.5rem;
  }
}