/* ============================================================
   GoatFarm Pro — Custom Styles (works with Tailwind)
   ============================================================ */

/* Base */
* { margin: 0; padding: 0; box-sizing: border-box; }
body { font-family: 'DM Sans', sans-serif; }
h1, h2, h3, h4, h5, h6 { font-family: 'Outfit', sans-serif; }

/* Scrollbar */
::-webkit-scrollbar { width: 5px; height: 5px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: #30363D; border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: #484F58; }

/* Animations */
@keyframes fadeIn { from { opacity:0; transform:translateY(12px) } to { opacity:1; transform:translateY(0) } }
@keyframes slideR { from { opacity:0; transform:translateX(-16px) } to { opacity:1; transform:translateX(0) } }
@keyframes float  { 0%,100% { transform:translateY(0) } 50% { transform:translateY(-8px) } }
@keyframes pulseG { 0%,100% { box-shadow:0 0 0 0 rgba(56,161,105,0.4) } 70% { box-shadow:0 0 0 8px rgba(56,161,105,0) } }

.animate-fade-in  { animation: fadeIn .4s ease-out; }
.animate-slide-in { animation: slideR .3s ease-out; }
.animate-float    { animation: float 3s ease-in-out infinite; }
.animate-pulse-g  { animation: pulseG 2s infinite; }

/* Gradient text */
.gradient-text {
    background: linear-gradient(135deg, #48BB78, #38A169, #F59E0B);
    -webkit-background-clip: text; -webkit-text-fill-color: transparent;
    background-clip: text;
}

/* Card hover */
.card-hover { transition: all .3s ease; }
.card-hover:hover { transform: translateY(-2px); }

/* Status badges */
.badge-pending   { background: rgba(245,158,11,.12); color: #F59E0B; border: 1px solid rgba(245,158,11,.3); }
.badge-approved,
.badge-completed { background: rgba(56,161,105,.12); color: #38A169; border: 1px solid rgba(56,161,105,.3); }
.badge-rejected  { background: rgba(248,81,73,.12);  color: #F85149; border: 1px solid rgba(248,81,73,.3); }

/* File upload zone */
.file-upload-zone {
    border: 2px dashed #D1D5DB;
    transition: all .3s ease;
}
.dark .file-upload-zone {
    border-color: #30363D;
}
.file-upload-zone:hover {
    border-color: #38A169;
    background: rgba(56,161,105,.03);
}

/* Progress bar animation */
.progress-animate { transition: width .8s ease-in-out; }

/* Table row hover */
.table-row-hover { transition: background .2s; }
.table-row-hover:hover { background: rgba(56,161,105,.04); }

/* Glass effect */
.glass {
    background: rgba(255,255,255,.85);
    backdrop-filter: blur(12px);
    border: 1px solid rgba(209,213,219,.5);
}
.dark .glass {
    background: rgba(22,27,34,.85);
    border-color: rgba(48,54,61,.5);
}

/* Login page background pattern */
.login-pattern {
    background-image:
        radial-gradient(circle at 20% 30%, rgba(56,161,105,.1), transparent 50%),
        radial-gradient(circle at 80% 70%, rgba(245,158,11,.08), transparent 50%);
}

/* Modal overlay */
.modal-overlay {
    position: fixed; inset: 0;
    background: rgba(0,0,0,.6);
    backdrop-filter: blur(4px);
    z-index: 1000;
    display: flex; align-items: center; justify-content: center;
}

/* Input focus ring (Tailwind overrides) */
input:focus, select:focus, textarea:focus {
    outline: none;
}
/* ============================================================
   GoatFarm Pro — Custom Styles
   ============================================================ */

* { margin: 0; padding: 0; box-sizing: border-box; }
body { font-family: 'DM Sans', sans-serif; }
h1, h2, h3, h4, h5, h6 { font-family: 'Outfit', sans-serif; }

/* Scrollbar */
::-webkit-scrollbar { width: 5px; height: 5px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: #30363D; border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: #484F58; }

/* Animations */
@keyframes fadeIn { from { opacity:0; transform:translateY(12px) } to { opacity:1; transform:translateY(0) } }
@keyframes slideR { from { opacity:0; transform:translateX(-16px) } to { opacity:1; transform:translateX(0) } }
@keyframes float  { 0%,100% { transform:translateY(0) } 50% { transform:translateY(-8px) } }
@keyframes pulseG { 0%,100% { box-shadow:0 0 0 0 rgba(56,161,105,0.4) } 70% { box-shadow:0 0 0 8px rgba(56,161,105,0) } }

.animate-fade-in  { animation: fadeIn .4s ease-out; }
.animate-slide-in { animation: slideR .3s ease-out; }
.animate-float    { animation: float 3s ease-in-out infinite; }
.animate-pulse-g  { animation: pulseG 2s infinite; }

/* Gradient text */
.gradient-text {
    background: linear-gradient(135deg, #48BB78, #38A169, #F59E0B);
    -webkit-background-clip: text; -webkit-text-fill-color: transparent;
    background-clip: text;
}

/* Card hover */
.card-hover { transition: all .3s ease; }
.card-hover:hover { transform: translateY(-2px); }

/* Status badges */
.badge-pending   { background: rgba(245,158,11,.12); color: #F59E0B; border: 1px solid rgba(245,158,11,.3); }
.badge-approved,
.badge-completed { background: rgba(56,161,105,.12); color: #38A169; border: 1px solid rgba(56,161,105,.3); }
.badge-rejected  { background: rgba(248,81,73,.12);  color: #F85149; border: 1px solid rgba(248,81,73,.3); }

/* File upload zone */
.file-upload-zone {
    border: 2px dashed #D1D5DB;
    transition: all .3s ease;
}
.dark .file-upload-zone { border-color: #30363D; }
.file-upload-zone:hover { border-color: #38A169; background: rgba(56,161,105,.03); }

/* Progress bar animation */
.progress-animate { transition: width .8s ease-in-out; }

/* Table row hover */
.table-row-hover { transition: background .2s; }
.table-row-hover:hover { background: rgba(56,161,105,.04); }

/* Glass effect */
.glass {
    background: rgba(152, 197, 193, 0.589);
    backdrop-filter: blur(12px);
    border-bottom: 1px solid rgba(209,213,219,.5);
}
.dark .glass {
    background: rgba(22,27,34,.85);
    border-bottom-color: rgba(48,54,61,.5);
}

/* Login page background */
.login-pattern {
    background-image:
        radial-gradient(circle at 20% 30%, rgba(56,161,105,.1), transparent 50%),
        radial-gradient(circle at 80% 70%, rgba(245,158,11,.08), transparent 50%);
}

/* Modal overlay */
.modal-overlay {
    position: fixed; inset: 0;
    background: rgba(0,0,0,.6);
    backdrop-filter: blur(4px);
    z-index: 1000;
    display: flex; align-items: center; justify-content: center;
}

/* ─── RESPONSIVE ─── */

/* Mobile: make tables scroll */
@media (max-width: 640px) {
    .glass { backdrop-filter: blur(8px); }

    /* Smaller stat card padding */
    /* Login hero hidden on mobile (already via hidden lg:flex) */
}

/* Touch-friendly tap targets on mobile */
@media (max-width: 1023px) {
    a, button, label[for] {
        min-height: 36px;
    }
}

/* Prevent body scroll when mobile sidebar open */
body.sidebar-open {
    overflow: hidden;
}