/* λιφφα.εεε/styles.css */

:root {
    --amber-800: #FF8C00;
    --amber-600: #FFA500;
    --amber-50: #FFF8f0;
    --amber-100: #fff3e0;
    --blue-100: #e0f7fa;
    --blue-50: #e3f2fd;
    --purple-100: #f3e5f5;
    --purple-50: #f3e5f5;
    --green-100: #e8f5e9;
    --pink-100: #fce4ec;
    --pink-200: #f8bbd0;
    --gray-50to100: linear-gradient(to bottom, #f9fafb, #f3f4f6);
    --blue-50to100: linear-gradient(to bottom right, #e0f7fa, #bbdefb);
}

body {
    font-family: 'Inter', sans-serif;
    line-height: 1.7;
    color: #1a202c;
}

/* Fixed header enhancements */
header.is-sticky {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 999;
    transition: all 0.3s ease-in-out;
}

/* Custom hover effects */
.button-hover {
    transition: all 0.3s ease;
}

.button-hover:hover {
    transform: translate3d(0, -2px, 0);
    box-shadow: 0 5px 15px rgba(0,0,0,0.1);
}

/* Card shadows */
.card-effect {
    transition: all 0.3s ease;
    transform-origin: center;
}

.card-effect:hover {
    transform: translateY(-2px) scale(1.01);
    box-shadow: 0 10px 25px rgba(0,0,0,0.08);
}

/* Input focus styles */
input:focus,
select:focus,
textarea:focus,
button:focus {
    outline: none;
    box-shadow: 0 0 0 3px rgba(79,70,229,0.2);
    border-color: #4f46e5;
}

/* Gradient buttons */
.btn-gradient {
    background: linear-gradient(to right, #f59e0b, #facc15);
    border: none;
}

.btn-gradient:hover {
    background: linear-gradient(to right, #facc15, #f59e0b);
}

/* Custom scrollbars */
::-webkit-scrollbar {
    width: 10px;
}

::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-radius: 5px;
}

::-webkit-scrollbar-thumb {
    background: #888;
    border-radius: 5px;
}

/* Form field validation states */
.input-error {
    border-color: #ef4444;
    background-color: #fee2e2;
}

.input-success {
    border-color: #10b981;
    background-color: #d1fae5;
}

/* Custom form animation */
@keyframes fadeInUp {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: translateY(0); }
}

.animate-form {
    animation: fadeInUp 0.4s ease forwards;
}

/* Custom transitions for modals */
.modal-enter {
    opacity: 0;
    transform: scale(0.95);
}

.modal-enter.modal-enter-active {
    opacity: 1;
    transform: scale(1);
}

.modal-leave {
    opacity: 1;
    transform: scale(1);
}

.modal-leave-active {
    opacity: 0;
    transform: scale(0.95);
}

/* Dark mode styles */
@media (prefers-color-scheme: dark) {
    body {
        background: #1a202c;
        color: #f7fafc;
    }

    .card-effect {
        background: #2d3748;
        border: 1px solid #4a5568;
    }

    .btn-gradient {
        background: linear-gradient(to right, #2563eb, #14b8a6);
    }
}

/* Responsive breakpoints */
@media (max-width: 640px) {
    .mobile-only {
        display: block !important;
    }
}

@media (min-width: 640px) {
    .desktop-only {
        display: block !important;
    }
}