/* Global Styles & Animations */
@tailwind base;
@tailwind components;
@tailwind utilities;

/* Industrial Scrollbar */
::-webkit-scrollbar {
    width: 12px;
    background: #1e293b;
}
::-webkit-scrollbar-track {
    background: #0f172a;
    border-left: 1px solid #334155;
}
::-webkit-scrollbar-thumb {
    background: #475569;
    border: 2px solid #0f172a;
    border-radius: 0;
}
::-webkit-scrollbar-thumb:hover {
    background: #64748b;
}

/* Typography */
body {
    background-color: #f8fafc; /* Light grey background, clean */
    color: #0f172a;
    -webkit-font-smoothing: antialiased;
}

/* Industrial Component Classes */

/* 1. The Grid/Engineering Look */
.bg-grid-pattern {
    background-image: 
        linear-gradient(to right, #e2e8f0 1px, transparent 1px),
        linear-gradient(to bottom, #e2e8f0 1px, transparent 1px);
    background-size: 40px 40px;
}

.bg-blueprint {
    background-color: #1e293b;
    background-image: 
        linear-gradient(rgba(255,255,255,0.05) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,0.05) 1px, transparent 1px);
    background-size: 20px 20px;
}

/* 2. Cards: Solid, Bordered, No heavy shadows */
.industrial-card {
    background: #ffffff;
    border: 1px solid #cbd5e1;
    border-radius: 4px; /* Slight radius, almost square */
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1);
    transition: all 0.2s ease-in-out;
}

.industrial-card:hover {
    border-color: #2563eb; /* Industrial Blue */
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
    transform: translateY(-2px);
}

.industrial-card-dark {
    background: #1e293b; /* Slate 800 */
    border: 1px solid #334155;
    border-left: 4px solid #3b82f6; /* Accent border on left */
    color: #f8fafc;
}

/* 3. Buttons: Robust, Clickable */
.btn-industrial {
    @apply px-6 py-3 font-bold uppercase tracking-wider text-sm transition-all duration-200 border-2;
    border-radius: 4px;
}

.btn-primary {
    @apply bg-blue-700 text-white border-blue-800 hover:bg-blue-800 hover:border-blue-900 shadow-sm;
}

.btn-outline {
    @apply bg-transparent text-slate-700 border-slate-300 hover:bg-slate-100 hover:border-slate-400;
}

/* 4. Utilities */
.text-label {
    @apply text-xs font-bold uppercase tracking-widest text-slate-500 mb-1 block;
}

.section-divider {
    border-top: 1px dashed #cbd5e1;
    margin: 4rem 0;
    position: relative;
}

.section-divider::after {
    content: '';
    position: absolute;
    top: -6px;
    left: 50%;
    transform: translateX(-50%);
    width: 12px;
    height: 12px;
    background: #cbd5e1;
    transform: rotate(45deg);
}

/* 5. Navbar Override */
.nav-industrial {
    background: #0f172a; /* Slate 900 */
    border-bottom: 4px solid #2563eb; /* Industrial Blue Accent */
    color: white;
}

/* Removes animations that feel "floaty" */
.animate-float, .animate-float-delayed {
    animation: none !important;
}
