:root {
    --primary-color: #4e54c8;
    --secondary-color: #8f94fb;
    --accent-color: #ff6b6b;
}

body {
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}

.hero-section {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--secondary-color) 100%);
}

.navbar-brand {
    font-weight: 700;
}

.card {
    border-radius: 12px;
    overflow: hidden;
    transition: all 0.3s ease;
}

.card:hover {
    transform: translateY(-5px);
    box-shadow: 0 12px 20px rgba(0,0,0,0.15);
}

.btn {
    border-radius: 8px;
    font-weight: 500;
}

.badge {
    border-radius: 6px;
    font-weight: 500;
}

.list-group-item {
    border-radius: 8px !important;
    margin-bottom: 8px;
    border: 1px solid rgba(0,0,0,0.1);
    transition: all 0.2s ease;
}

.list-group-item:hover {
    background-color: #f8f9fa;
}

footer {
    margin-top: auto;
}

/* stat-card colors — keep these in sync with template classes */
.cc-books { --stat-gradient: linear-gradient(135deg, #4e54c8 0%, #8f94fb 100%); }
.cc-articles { --stat-gradient: linear-gradient(135deg,#1fa2ff,#12d8fa); }
.cc-papers { --stat-gradient: linear-gradient(135deg,#00b09b,#96c93d); }
.cc-magazines { --stat-gradient: linear-gradient(135deg,#ff7e5f,#feb47b); }
.cc-photos { --stat-gradient: linear-gradient(135deg,#ff6b6b,#f06595); }
.cc-audios { --stat-gradient: linear-gradient(135deg,#6e45e2,#88d3ce); }
.cc-videos { --stat-gradient: linear-gradient(135deg,#ff6a00,#ee0979); }
.cc-total { --stat-gradient: linear-gradient(135deg,#232526,#414345); }

/* Use gradient variable to style background (fallback) */
.stat-card.cc-books { background: var(--stat-gradient); color: #fff; }
.stat-card.cc-articles { background: var(--stat-gradient); color:#fff; }
.stat-card.cc-papers { background: var(--stat-gradient); color:#fff; }
.stat-card.cc-magazines { background: var(--stat-gradient); color:#fff; }
.stat-card.cc-photos { background: var(--stat-gradient); color:#fff; }
.stat-card.cc-audios { background: var(--stat-gradient); color:#fff; }
.stat-card.cc-videos { background: var(--stat-gradient); color:#fff; }
.stat-card.cc-total { background: var(--stat-gradient); color:#fff; }

/* small badge style override */
.small-badge { opacity: .98; }

/* Keep cards readable */
.stat-card .stat-label, .stat-card small { opacity: .95; color: rgba(255,255,255,0.92); }


/* stat cards */
.stat-grid { gap: 1rem; }
.stat-card {
  border-radius: 12px;
  transition: transform .18s ease, box-shadow .18s ease;
  padding: 1rem;
  min-height: 120px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
}
.stat-card:hover { transform: translateY(-6px); box-shadow: 0 16px 30px rgba(20,20,40,0.08); }
.stat-top { display:flex; align-items:center; justify-content:space-between; }
.stat-left { display:flex; align-items:center; gap:.75rem; }
.stat-icon {
  width:56px; height:56px; display:flex; align-items:center; justify-content:center;
  border-radius:10px;
  background: rgba(255,255,255,0.12);
  font-size:1.45rem;
}
.stat-value { font-size:1.6rem; font-weight:700; }
.stat-label { color: #6c757d; font-size:.9rem; }
.small-badge { font-size: .65rem; padding: .25rem .5rem; border-radius: 999px; }

/* colors (overrideable via custom.css) */
.cc-books { background: linear-gradient(135deg, #4e54c8 0%, #8f94fb 100%); color: #fff; }
.cc-articles { background: linear-gradient(135deg,#1fa2ff,#12d8fa); color:#fff; }
.cc-papers { background: linear-gradient(135deg,#00b09b,#96c93d); color:#fff; }
.cc-magazines { background: linear-gradient(135deg,#ff7e5f,#feb47b); color:#fff; }
.cc-photos { background: linear-gradient(135deg,#ff6b6b,#f06595); color:#fff; }
.cc-audios { background: linear-gradient(135deg,#6e45e2,#88d3ce); color:#fff; }
.cc-videos { background: linear-gradient(135deg,#ff6a00,#ee0979); color:#fff; }
.cc-reports { background: linear-gradient(135deg, #ff9a8b 0%, #ff6a00 100%); color: #fff; }
.cc-total { background: linear-gradient(135deg,#232526,#414345); color:#fff; }

/* responsive tweaks */
@media (max-width:575px) {
  .stat-icon { width:48px; height:48px; font-size:1.2rem; }
  .stat-value { font-size:1.4rem; }
}