/* ==========================================
   Modern Blue Theme v1.0
   ماتېرىيال توربېتى ئۈچۈن ئۇسلۇب
   ========================================== */

:root {
    --theme-primary: #0ea5e9;
    --theme-primary-dark: #0284c7;
    --theme-accent: #f97316;
    --theme-bg: #f0f9ff;
    --theme-surface: #ffffff;
    --theme-header-bg: #0c4a6e;
    --theme-gradient: linear-gradient(135deg, #0c4a6e 0%, #075985 50%, #0284c7 100%);
    --theme-radius: 14px;
}

/* Override header */
body {
    background: var(--theme-bg) !important;
}

.header {
    background: var(--theme-gradient) !important;
    position: relative;
    overflow: hidden;
}

.header::after {
    content: '';
    position: absolute;
    width: 400px; height: 400px;
    background: radial-gradient(circle, rgba(14,165,233,0.2) 0%, transparent 70%);
    top: -100px; right: -100px;
    border-radius: 50%;
    pointer-events: none;
}

/* Override navigation */
.nav a.active {
    color: var(--theme-primary) !important;
    border-bottom-color: var(--theme-primary) !important;
}

/* Override buttons */
.btn-primary, .pagination .current {
    background: linear-gradient(135deg, var(--theme-primary), var(--theme-primary-dark)) !important;
}

/* Stats cards with blue tint */
.stat-card:nth-child(1) .stat-icon { background: linear-gradient(135deg, #e0f2fe, #bae6fd) !important; }
.stat-card:nth-child(2) .stat-icon { background: linear-gradient(135deg, #e0f2fe, #bae6fd) !important; }
.stat-card:nth-child(3) .stat-icon { background: linear-gradient(135deg, #e0f2fe, #bae6fd) !important; }
.stat-card:nth-child(4) .stat-icon { background: linear-gradient(135deg, #e0f2fe, #bae6fd) !important; }

/* Material cards with blue hover */
.material-card:hover {
    box-shadow: 0 10px 30px rgba(14,165,233,0.15) !important;
}

/* Add subtle wave pattern to footer */
.footer {
    background: linear-gradient(180deg, #0c4a6e 0%, #082f49 100%) !important;
    position: relative;
}

.footer::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 3px;
    background: linear-gradient(90deg, var(--theme-primary), var(--theme-accent));
}

/* Upload button accent color */
.upload-btn, .header-user .upload-btn {
    background: linear-gradient(135deg, var(--theme-accent), #ea580c) !important;
}

/* Search box focus */
.search-box:focus-within {
    box-shadow: 0 0 0 4px rgba(14,165,233,0.2) !important;
}
