/* ===========================
   Global Font: Manrope
   =========================== */
@font-face {
    font-family: 'Manrope';
    src: url('/assets/fonts/Manrope-Regular.ttf') format('truetype');
    font-weight: 200;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Manrope';
    src: url('/assets/fonts/Manrope-Regular.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Manrope';
    src: url('/assets/fonts/Manrope-Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Manrope';
    src: url('/assets/fonts/Manrope-SemiBold.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Manrope';
    src: url('/assets/fonts/Manrope-SemiBold.ttf') format('truetype');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Manrope';
    src: url('/assets/fonts/Manrope-Bold.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Manrope';
    src: url('/assets/fonts/Manrope-ExtraBold.ttf') format('truetype');
    font-weight: 800;
    font-style: normal;
    font-display: swap;
}

html,
body,
.app-default {
    font-family: 'Manrope', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
}

.bg-gradient-info {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    border-radius: 12px;
    color: white;
    padding: 1.5rem;
    margin-bottom: 1rem;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
    transition: transform 0.3s ease;
}

.bg-gradient-success {
    background: linear-gradient(135deg, #43e97b 0%, #38f9d7 100%);
    border-radius: 12px;
    color: white;
    padding: 1.5rem;
    margin-bottom: 1rem;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
    transition: transform 0.3s ease;
}

.bg-gradient-warning {
    background: linear-gradient(to right, #ff8008, #ffc837);
    border-radius: 12px;
    color: white;
    padding: 1.5rem;
    margin-bottom: 1rem;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
    transition: transform 0.3s ease;
}

.bg-gradient-danger {
    background: linear-gradient(135deg, #dc3545 0%, #d5cce0 100%);
    border-radius: 12px;
    color: white;
    padding: 1.5rem;
    margin-bottom: 1rem;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
    transition: transform 0.3s ease;
}

.bg-gradient-primary {
    background: linear-gradient(135deg, #4facfe 0%, #00f2fe 100%);
    border-radius: 12px;
    color: white;
    padding: 1.5rem;
    margin-bottom: 1rem;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
    transition: transform 0.3s ease;
}

.bg-gradient-pink {
    background: linear-gradient(135deg, #f093fb 0%, #f5576c 100%);
    border-radius: 12px;
    color: white;
    padding: 1.5rem;
    margin-bottom: 1rem;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
    transition: transform 0.3s ease;
}

.text-gradient {
    background: linear-gradient(90deg, rgb(255, 127, 74) 0%, rgb(255, 127, 74) 0%, rgb(254, 62, 161) 30.45%, rgb(136, 63, 255) 61.73%, rgb(78, 202, 254) 100%) text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

span.badge.badge-success,
span.badge.badge-primary,
span.badge.badge-warning,
span.badge.badge-danger,
span.badge.badge-info,
span.badge.bg-success,
span.badge.bg-primary,
span.badge.bg-warning,
span.badge.bg-danger,
span.badge.bg-info {
    color: #fff;
}

.text-white h4,
.text-white i {
    color: #fff;
}

.menu-module {
    white-space: nowrap;
    color: #fff !important;
    background: linear-gradient(90deg, #0ea5e9 0%, #38bdf8 100%);
    border-radius: 0.65rem;
    box-shadow: 0 2px 8px rgba(14, 165, 233, 0.15);
}

/* Avatar Color Classes */
/* .bg-primary {
    background-color: #3b82f6 !important;
}

.bg-success {
    background-color: #10b981 !important;
}

.bg-danger {
    background-color: #ef4444 !important;
}

.bg-warning {
    background-color: #f59e0b !important;
}

.bg-info {
    background-color: #06b6d4 !important;
}

.bg-secondary {
    background-color: #6b7280 !important;
}

.bg-dark {
    background-color: #374151 !important;
} */

.bg-purple {
    background-color: #8b5cf6 !important;
}

.bg-pink,
.bg-rose {
    background-color: #ec4899 !important;
}

.bg-indigo,
.bg-sky {
    background-color: #6366f1 !important;
}

.bg-teal {
    background-color: #14b8a6 !important;
}

.bg-cyan {
    background-color: #06b6d4 !important;
}

.bg-lime {
    background-color: #84cc16 !important;
}

.bg-amber,
.bg-orange {
    background-color: #f59e0b !important;
}

.bg-fuchsia {
    background-color: #00f2fe !important;
}

/* Light versions for backgrounds */
/* .bg-light-primary {
    background-color: #dbeafe !important;
}

.bg-light-success {
    background-color: #d1fae5 !important;
}

.bg-light-danger {
    background-color: #fee2e2 !important;
}

.bg-light-warning {
    background-color: #fef3c7 !important;
}

.bg-light-info {
    background-color: #cffafe !important;
}

.bg-light-secondary {
    background-color: #f3f4f6 !important;
}

.bg-light-dark {
    background-color: #e5e7eb !important;
} */

.bg-light-purple {
    background-color: #e9d5ff !important;
}

.bg-light-pink {
    background-color: #fce7f3 !important;
}

.bg-light-indigo {
    background-color: #e0e7ff !important;
}

.bg-light-teal {
    background-color: #ccfbf1 !important;
}

.bg-light-cyan {
    background-color: #cffafe !important;
}

/* Text color classes */
/* .text-primary {
    color: #3b82f6 !important;
} */
/*
.text-success {
    color: #10b981 !important;
}

.text-danger {
    color: #ef4444 !important;
}

.text-warning {
    color: #f59e0b !important;
}

.text-info {
    color: #06b6d4 !important;
}

.text-secondary {
    color: #6b7280 !important;
}

.text-dark {
    color: #374151 !important;
} */

.text-purple {
    color: #8b5cf6 !important;
}

.text-pink {
    color: #ec4899 !important;
}

.text-indigo {
    color: #6366f1 !important;
}

.text-teal {
    color: #14b8a6 !important;
}

.text-cyan {
    color: #06b6d4 !important;
}

.btn.btn-outline-secondary {
    color: var(--bs-secondary);
    border-color: var(--bs-secondary);
    background-color: transparent;
    border-style: solid !important;
    border-width: 1px !important;
}

.badge.bg-warning i {
    color: var(--bs-white) !important;
}

.app-content {
    margin-top: 12px;
}