/* ============================================================================
   Tempurium — Dashboard Polish
   Tasteful refinements layered on top of dashboard.css (NiceAdmin theme).
   Applies to every page behind the login: dashboard, PVP results, profile.
   Safe to remove — purely additive visual tweaks.
   ============================================================================ */

:root {
    --tp-primary:   #4154f1;
    --tp-ink:       #012970;
    --tp-radius:    12px;
    --tp-shadow:    0 2px 14px rgba(1, 41, 112, 0.06);
    --tp-shadow-hi: 0 10px 28px rgba(1, 41, 112, 0.13);
    --tp-ease:      cubic-bezier(0.16, 1, 0.3, 1);
}

/* ── App background: subtle depth instead of flat fill ───────────────────────── */
body {
    background: linear-gradient(180deg, #f3f7ff 0%, #f6f9ff 280px) fixed;
}

/* ── Cards: softer shadow, rounder corners, smooth lift on hover ─────────────── */
.card {
    border-radius: var(--tp-radius);
    box-shadow: var(--tp-shadow);
    transition: transform 0.28s var(--tp-ease), box-shadow 0.28s var(--tp-ease);
}
.card:hover {
    transform: translateY(-3px);
    box-shadow: var(--tp-shadow-hi);
}

/* Slightly tighter, crisper card titles */
.card-title {
    padding: 18px 0 12px 0;
    letter-spacing: -0.01em;
}

/* ── Info-card icons: rounder, gentle pop on hover ───────────────────────────── */
.dashboard .card-icon {
    border-radius: 14px;
    transition: transform 0.28s var(--tp-ease);
}
.dashboard .info-card:hover .card-icon {
    transform: scale(1.06);
}

/* Big metric numbers a touch tighter */
.dashboard .info-card h6 {
    letter-spacing: -0.02em;
}

/* ── Page title: a bit more presence ─────────────────────────────────────────── */
.pagetitle h1 {
    letter-spacing: -0.02em;
}

/* ── Tables: comfortable rows, subtle hover, refined header ──────────────────── */
.table {
    --bs-table-hover-bg: rgba(65, 84, 241, 0.04);
}
.table > :not(caption) > * > * {
    padding-top: 0.6rem;
    padding-bottom: 0.6rem;
}
.table thead th {
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: #899bbd;
    font-weight: 700;
    border-bottom: 1px solid #eef1f7;
}
.table-hover tbody tr {
    transition: background-color 0.15s ease;
}

/* ── Badges & progress: rounder, softer ──────────────────────────────────────── */
.badge {
    border-radius: 6px;
    font-weight: 600;
    letter-spacing: 0.01em;
}
.progress {
    border-radius: 20px;
    background-color: #eef1f7;
}
.progress-bar {
    border-radius: 20px;
}

/* ── Buttons: smoother interaction ───────────────────────────────────────────── */
.btn {
    border-radius: 8px;
    font-weight: 500;
    transition: transform 0.12s var(--tp-ease), box-shadow 0.2s var(--tp-ease), background-color 0.2s, color 0.2s;
}
.btn:active { transform: translateY(1px); }
.btn-primary,
.btn-success {
    box-shadow: 0 2px 8px rgba(65, 84, 241, 0.18);
}
.btn-outline-primary:hover,
.btn-outline-success:hover {
    box-shadow: 0 2px 10px rgba(65, 84, 241, 0.18);
}

/* ── Alerts: rounder, no harsh borders ──────────────────────────────────────── */
.alert {
    border: none;
    border-radius: 10px;
}

/* ── Form controls (profile / settings): clearer focus, rounder fields ───────── */
.form-control,
.form-select {
    border-radius: 8px;
    border-color: #e3e8f2;
    transition: border-color 0.2s, box-shadow 0.2s;
}
.form-control:focus,
.form-select:focus {
    border-color: var(--tp-primary);
    box-shadow: 0 0 0 3px rgba(65, 84, 241, 0.12);
}
.form-label {
    font-weight: 600;
    color: #51678f;
    font-size: 0.9rem;
}

/* ── Range sliders (Solar Lab) accent ────────────────────────────────────────── */
.form-range::-webkit-slider-thumb { background: var(--tp-primary); }
.form-range::-moz-range-thumb      { background: var(--tp-primary); }

/* ── Chart containers breathe a little ───────────────────────────────────────── */
.chart-container { padding-top: 6px; }

/* ── Breadcrumb chip look ────────────────────────────────────────────────────── */
.breadcrumb {
    background: rgba(65, 84, 241, 0.05);
    padding: 5px 12px;
    border-radius: 20px;
    display: inline-flex;
}

/* ── Reduced-motion respect ──────────────────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
    .card, .card:hover, .dashboard .card-icon, .btn {
        transition: none;
        transform: none;
    }
}