/* Efes Employee Hub Platform - Stylesheet */

@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap');

:root {
    --efes-navy: #0f1e36;
    --efes-blue: #1e3a8a;
    --efes-blue-light: #3b82f6;
    --efes-gold: #f59e0b;
    --efes-gold-light: #fef3c7;
    --efes-bg: #f8fafc;
    --efes-card: #ffffff;
    --efes-border: #e2e8f0;
    --efes-text: #0f172a;
    --efes-muted: #64748b;
}

body {
    font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    background-color: var(--efes-bg);
    color: var(--efes-text);
    -webkit-font-smoothing: antialiased;
}

/* Custom Scrollbar */
::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}
::-webkit-scrollbar-track {
    background: #f1f5f9;
}
::-webkit-scrollbar-thumb {
    background: #cbd5e1;
    border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
    background: #94a3b8;
}

/* Micro-transitions */
.btn, .card, .interactive-item {
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

.btn:active {
    transform: scale(0.98);
}

/* Offline Banner */
.offline-banner {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    background-color: #ef4444;
    color: white;
    text-align: center;
    padding: 8px 16px;
    font-size: 14px;
    font-weight: 600;
    z-index: 9999;
}

/* Progress bar shimmer effect */
@keyframes shimmer {
    0% { transform: translateX(-100%); }
    100% { transform: translateX(100%); }
}

.shimmer {
    position: relative;
    overflow: hidden;
}

.shimmer::after {
    position: absolute;
    top: 0; right: 0; bottom: 0; left: 0;
    transform: translateX(-100%);
    background-image: linear-gradient(
        90deg,
        rgba(255, 255, 255, 0) 0,
        rgba(255, 255, 255, 0.2) 20%,
        rgba(255, 255, 255, 0.5) 60%,
        rgba(255, 255, 255, 0)
    );
    animation: shimmer 2s infinite;
    content: '';
}

[x-cloak] {
    display: none !important;
}