/* =============================================================
   GLOBAL OVERRIDES — Poppins Font, Unified Buttons, Compact UI
   Loads LAST to override all existing stylesheets.
   ============================================================= */

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

:root {
    --primary-color: #2563eb;
    --primary-color-dark: #1d4ed8;
}

/* =========================
   1. GLOBAL FONT — Poppins
   ========================= */

body,
html {
    font-family: 'Poppins', sans-serif !important;
    line-height: 1.4 !important;
}

h1, h2, h3, h4, h5, h6,
.title, .sub-title,
.app-page-title,
.app-sidebar-brand {
    font-family: 'Poppins', sans-serif !important;
}

button, .btn,
input, select, textarea,
.form-control, .form-select,
label, .label, .l-label,
.dropdown-menu, .dropdown-item,
.nav-link, .page-link,
.badge, .alert,
table, th, td,
.stat-label, .stat-number {
    font-family: 'Poppins', sans-serif !important;
}

/* =========================
   2. UNIFIED BUTTON STYLES
   ========================= */

.btn {
    border-radius: 6px !important;
    font-weight: 500 !important;
    padding: 8px 14px !important;
    font-size: 13px !important;
    letter-spacing: 0.01em;
    transition: background-color 0.2s ease, box-shadow 0.2s ease !important;
}

.btn-primary,
.btn-primary:active,
.btn-primary:visited,
input[type="submit"].btn-primary,
button.btn-primary {
    background: var(--primary-color) !important;
    border-color: var(--primary-color) !important;
    color: #fff !important;
    box-shadow: 0 2px 6px rgba(37, 99, 235, 0.2) !important;
}

.btn-primary:hover,
.btn-primary:focus,
input[type="submit"].btn-primary:hover,
button.btn-primary:hover {
    background: var(--primary-color-dark) !important;
    border-color: var(--primary-color-dark) !important;
    box-shadow: 0 4px 10px rgba(37, 99, 235, 0.3) !important;
}

/* Sidebar logout button — same primary style */
.app-sidebar-footer .btn,
.app-sidebar-footer .btn-primary {
    background: var(--primary-color) !important;
    border-color: var(--primary-color) !important;
    color: #fff !important;
    border-radius: 6px !important;
    box-shadow: 0 2px 6px rgba(37, 99, 235, 0.2) !important;
}

.app-sidebar-footer .btn:hover,
.app-sidebar-footer .btn-primary:hover {
    background: var(--primary-color-dark) !important;
    border-color: var(--primary-color-dark) !important;
}

/* Dashboard context buttons */
body.has-app-sidebar .btn-primary {
    background: var(--primary-color) !important;
    border-color: var(--primary-color) !important;
}

body.has-app-sidebar .btn-primary:hover,
body.has-app-sidebar .btn-primary:focus {
    background: var(--primary-color-dark) !important;
    border-color: var(--primary-color-dark) !important;
}

/* Secondary / outline buttons */
.btn-secondary {
    background: #f1f5f9 !important;
    border: 1px solid #cbd5e1 !important;
    color: #334155 !important;
}

.btn-secondary:hover,
.btn-secondary:focus {
    background: #e2e8f0 !important;
    border-color: #94a3b8 !important;
}

.btn-outline-primary {
    color: var(--primary-color) !important;
    border-color: var(--primary-color) !important;
    background: transparent !important;
}

.btn-outline-primary:hover,
.btn-outline-primary:focus {
    background: var(--primary-color) !important;
    color: #fff !important;
}

/* Info button — match primary */
.btn-info {
    background: var(--primary-color) !important;
    border-color: var(--primary-color) !important;
    color: #fff !important;
}

.btn-info:hover,
.btn-info:focus {
    background: var(--primary-color-dark) !important;
    border-color: var(--primary-color-dark) !important;
}

/* Small buttons */
.btn-sm {
    padding: 5px 10px !important;
    font-size: 12px !important;
}

/* Pagination active */
.page-item.active .page-link {
    background-color: var(--primary-color) !important;
    border-color: var(--primary-color) !important;
}

.page-link {
    color: var(--primary-color) !important;
}

.page-link:hover {
    color: var(--primary-color-dark) !important;
}

/* =========================
   3. COMPACT LAYOUT
   ========================= */

/* Body */
body {
    font-size: 13px !important;
}

/* Headings */
h1 { font-size: 1.4rem !important; margin: 8px 0 !important; }
h2 { font-size: 1.2rem !important; margin: 8px 0 !important; }
h3 { font-size: 1.05rem !important; margin: 6px 0 !important; }
h4, h5, h6 { margin: 6px 0 !important; }

.title, .email-content.tbl > h2 {
    font-size: 17px !important;
    margin: 8px 0 !important;
}

.sub-title {
    font-size: 15px !important;
    margin: 8px 0 !important;
}

.app-page-title {
    font-size: 1rem !important;
}

/* Cards */
.card {
    margin-bottom: 12px !important;
}

.card-body {
    padding: 14px !important;
}

.card-header {
    padding: 10px 14px !important;
}

/* Forms */
form {
    padding: 14px !important;
}

.form-group,
.mb-3 {
    margin-bottom: 10px !important;
}

.form-control,
.form-select,
input,
select,
textarea {
    padding: 6px 10px !important;
    min-height: 34px !important;
    font-size: 13px !important;
}

textarea.form-control,
textarea {
    min-height: 80px !important;
}

label,
.label,
.l-label {
    font-size: 12.5px !important;
    margin-bottom: 3px !important;
}

.row {
    --bs-gutter-y: 0.5rem;
}

/* Tables */
th {
    padding: 6px 10px !important;
    font-size: 11.5px !important;
}

td {
    padding: 6px 10px !important;
    font-size: 13px !important;
}

/* Containers */
.container,
.container-fluid {
    padding-left: 16px !important;
    padding-right: 16px !important;
}

body.has-app-sidebar .container-fluid {
    padding-left: 18px !important;
    padding-right: 18px !important;
}

/* Topbar compact */
.app-topbar {
    min-height: 56px !important;
    padding: 8px 18px !important;
}

body.has-app-sidebar {
    padding-top: 68px !important;
}

/* Sidebar compact */
.app-sidebar {
    padding: 14px 12px !important;
}

.app-sidebar-link {
    padding: 8px 12px !important;
    min-height: 36px !important;
    font-size: 13px !important;
}

.app-sidebar-nav {
    gap: 3px !important;
}

/* Summary / stat cards */
.summary-card {
    padding: 14px !important;
}

.stat-number {
    font-size: 1.8rem !important;
}

.stat-label {
    font-size: 0.7rem !important;
    margin-top: 2px !important;
}

/* Dashboard card */
.dashboard-card {
    margin-bottom: 12px !important;
}

/* Webinar cards */
.webinar-card {
    margin-bottom: 10px !important;
}

/* Log entries */
.log-entry {
    padding: 10px !important;
}

/* Alerts */
.alert {
    padding: 10px 14px !important;
    margin-bottom: 12px !important;
    font-size: 13px !important;
}

/* Modal */
.modal-body {
    padding: 14px !important;
}

.modal-header,
.modal-footer {
    padding: 10px 14px !important;
}

/* Empty state */
.empty-state {
    padding: 2rem 1rem !important;
}

/* Spacing utilities override */
.mb-4 {
    margin-bottom: 12px !important;
}

.mb-6 {
    margin-bottom: 1.5rem !important;
}

.mt-4 {
    margin-top: 12px !important;
}

.py-3 {
    padding-top: 10px !important;
    padding-bottom: 10px !important;
}

.p-3 {
    padding: 12px !important;
}

.p-4 {
    padding: 14px !important;
}

/* Login card compact */
.l-card {
    padding: 28px !important;
}

/* Section dividers */
hr {
    margin: 10px 0 !important;
}

/* Footer */
footer {
    padding: 8px 0 !important;
    font-size: 12px !important;
}

/* Focus ring — match primary */
.form-control:focus,
.form-select:focus,
input:focus,
select:focus,
textarea:focus {
    border-color: var(--primary-color) !important;
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.15) !important;
}

/* Active sidebar link — match primary */
.app-sidebar-link.active {
    color: var(--primary-color-dark) !important;
    border-left-color: var(--primary-color) !important;
}

.app-sidebar-link:hover {
    color: var(--primary-color) !important;
}

body.has-app-sidebar .app-sidebar-link.active {
    background: #dbeafe !important;
    color: var(--primary-color-dark) !important;
}

body.has-app-sidebar .app-sidebar-link:hover {
    background: #eff6ff !important;
    color: var(--primary-color) !important;
}

/* Auth link */
.auth-link {
    color: var(--primary-color) !important;
}

/* Responsive — keep layout intact */
@media (max-width: 991.98px) {
    body.has-app-sidebar {
        padding-top: 60px !important;
    }

    .app-topbar {
        padding: 8px 12px 8px 48px !important;
    }

    .container, .container-fluid {
        padding-left: 12px !important;
        padding-right: 12px !important;
    }
}

@media (max-width: 768px) {
    .l-card {
        padding: 18px !important;
    }

    form {
        padding: 12px !important;
    }

    .card-body {
        padding: 12px !important;
    }

    h1 { font-size: 1.2rem !important; }
    h2 { font-size: 1.1rem !important; }
}