:root{
  --encanto-primary:#412420;
  --content-bg:#f5f5f5;
}

body{
  background:var(--content-bg);
}

.sidebar{
  background:var(--encanto-primary);
  min-height:100vh;
}

.sidebar .nav-link{
  color:rgba(255,255,255,.85);
  border-radius:.5rem;
}

.sidebar .nav-link:hover{
  background:rgba(255,255,255,.12);
  color:#fff;
}

.sidebar .nav-link.active{
  background:rgba(255,255,255,.18);
  color:#fff;
}

/* Mobile offcanvas menu links */
.offcanvas .nav-link{
  color:rgba(255,255,255,.90);
  border-radius:.6rem;
  padding:.55rem .75rem;
}

.offcanvas .nav-link:hover{
  background:rgba(255,255,255,.12);
  color:#fff;
}

.offcanvas .nav-link.active{
  background:rgba(255,255,255,.18);
  color:#fff;
}

@media (max-width: 767.98px){
  #mobileSidebar.offcanvas{
    width:82vw;
    max-width:340px;
  }
}

/* Mobile listing cards */
.list-card{
  border:1px solid rgba(0,0,0,.06);
  border-radius:1rem;
  box-shadow:0 8px 18px rgba(0,0,0,.06);
}

.list-card .list-kv{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.75rem;
  padding:.3rem 0;
  border-bottom:1px dashed rgba(0,0,0,.10);
}

.list-card .list-kv:last-child{
  border-bottom:0;
}

.list-card .list-k{
  color:#6c757d;
  font-size:.85rem;
}

.list-card .list-v{
  font-weight:600;
  text-align:right;
}

.content-wrap{
  background:var(--content-bg);
  min-height:100vh;
}

.content-inner{
  background:#fff;
  border-radius:1rem;
  box-shadow:0 8px 20px rgba(0,0,0,.06);
}

.table thead th{
  background:#f3f3f3;
}

.table tbody tr:hover{
  background:#fafafa;
}

.badge-status{
  font-weight:600;
}

.card-soft{
  background:#fff;
  border:1px solid rgba(0,0,0,.06);
  border-radius:1rem;
  box-shadow:0 8px 20px rgba(0,0,0,.06);
}

.btn-primary-encanto{
  background:var(--encanto-primary);
  border-color:var(--encanto-primary);
  color:#fff;
  font-weight:600;
  border-radius:.8rem;
  box-shadow:0 8px 18px rgba(0,0,0,.12);
}

.btn-primary-encanto:hover{
  background:#2f1916;
  border-color:#2f1916;
  color:#fff;
}

.btn-primary-encanto:focus{
  color:#fff;
  box-shadow:0 0 0 .2rem rgba(65,36,32,.25), 0 8px 18px rgba(0,0,0,.12);
}

/* Keep icon color consistent with button text */
.btn .bi,
.btn i{
  color:inherit;
}

.btn-action{
  width:36px;
  height:36px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0;
  border-radius:.6rem;
  box-shadow:0 6px 14px rgba(0,0,0,.09);
  border:1px solid rgba(0,0,0,.06);
}

.btn-action:hover{
  filter:brightness(.95);
}

.btn-action:focus{
  box-shadow:0 0 0 .2rem rgba(65,36,32,.25), 0 6px 14px rgba(0,0,0,.10);
}

/* Ensure good contrast for icon-only action buttons */
.btn-action.btn-warning,
.btn-action.btn-light{
  color:#1f1f1f;
}

.btn-action.btn-info,
.btn-action.btn-danger,
.btn-action.btn-success,
.btn-action.btn-primary,
.btn-action.btn-secondary,
.btn-action.btn-dark{
  color:#fff;
}

/* More colorful (solid) action buttons with high contrast */
.btn-action.btn-info{
  background:#0b7285;
  border-color:#0b7285;
}

.btn-action.btn-warning{
  background:#f59f00;
  border-color:#f59f00;
  color:#1f1f1f;
}

.btn-action.btn-danger{
  background:#e03131;
  border-color:#e03131;
}

.btn-action.btn-success{
  background:#2f9e44;
  border-color:#2f9e44;
}

.btn-action.btn-info:hover,
.btn-action.btn-warning:hover,
.btn-action.btn-danger:hover,
.btn-action.btn-success:hover{
  filter:brightness(.92);
}

.dash-card{
  height:100%;
  min-height:120px;
}

.dash-accent{
  border-top:4px solid transparent;
}

.dash-accent-blue{ border-top-color:#0d6efd; background:linear-gradient(180deg, rgba(13,110,253,.10), #fff 55%); }
.dash-accent-purple{ border-top-color:#6f42c1; background:linear-gradient(180deg, rgba(111,66,193,.10), #fff 55%); }
.dash-accent-amber{ border-top-color:#f39c12; background:linear-gradient(180deg, rgba(243,156,18,.12), #fff 55%); }
.dash-accent-green{ border-top-color:#198754; background:linear-gradient(180deg, rgba(25,135,84,.10), #fff 55%); }

/* KPI (top) cards: vibrant and high contrast */
.dash-kpi{
  color:#fff;
  border:1px solid rgba(0,0,0,.06);
  box-shadow:0 10px 22px rgba(0,0,0,.10);
  position:relative;
  overflow:hidden;
}

.dash-kpi-icon{
  position:absolute;
  right:12px;
  top:10px;
  font-size:44px;
  line-height:1;
  opacity:.22;
  transform:rotate(-10deg);
  pointer-events:none;
}

.dash-kpi-value{
  font-size:2.15rem;
  font-weight:700;
  letter-spacing:-.01em;
}

.dash-kpi .text-secondary{
  color:rgba(255,255,255,.92) !important;
}

.dash-kpi .text-primary,
.dash-kpi .text-danger,
.dash-kpi .text-warning,
.dash-kpi .text-success{
  color:#fff !important;
}

.dash-kpi.dash-accent-blue{ background:linear-gradient(135deg, #0d6efd 0%, #2b8aef 55%, #74c0fc 120%); }
.dash-kpi.dash-accent-purple{ background:linear-gradient(135deg, #6f42c1 0%, #845ef7 55%, #b197fc 120%); }
.dash-kpi.dash-accent-amber{ background:linear-gradient(135deg, #f08c00 0%, #fab005 55%, #ffd43b 120%); }
.dash-kpi.dash-accent-green{ background:linear-gradient(135deg, #2f9e44 0%, #37b24d 55%, #69db7c 120%); }

/* Channel summary cards (dynamic colors via CSS vars) */
.dash-channel{
  color:#fff;
  border:1px solid rgba(0,0,0,.06);
  box-shadow:0 10px 22px rgba(0,0,0,.10);
  position:relative;
  overflow:hidden;
  background:linear-gradient(135deg, var(--ch1) 0%, var(--ch2) 55%, var(--ch3) 120%);
}

.dash-channel .text-secondary{
  color:rgba(255,255,255,.92) !important;
}

.dash-channel .text-primary,
.dash-channel .text-danger,
.dash-channel .text-warning,
.dash-channel .text-success{
  color:#fff !important;
}

.dash-channel-icon{
  position:absolute;
  right:12px;
  top:10px;
  font-size:44px;
  line-height:1;
  opacity:.22;
  transform:rotate(-10deg);
  pointer-events:none;
}

.dash-channel-value{
  font-size:1.65rem;
  font-weight:700;
  letter-spacing:-.01em;
}