/* Custom styles for Case Converter */

/* Dark mode icon toggle */
.dark .dark-icon {
    display: block;
}
.dark .light-icon {
    display: none;
}

/* Textarea custom scrollbar */
textarea::-webkit-scrollbar {
    width: 8px;
}
textarea::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-radius: 4px;
}
textarea::-webkit-scrollbar-thumb {
    background: #c1c1c1;
    border-radius: 4px;
}
textarea::-webkit-scrollbar-thumb:hover {
    background: #a1a1a1;
}
.dark textarea::-webkit-scrollbar-track {
    background: #374151;
}
.dark textarea::-webkit-scrollbar-thumb {
    background: #6b7280;
}

/* Radio button custom styling */
input[type="radio"]:checked + label {
    background: linear-gradient(135deg, #6366f1, #8b5cf6);
    color: white;
    border-color: transparent;
}

/* Button hover animation */
.btn-primary {
    transition: transform 0.2s, box-shadow 0.2s;
}
.btn-primary:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(99, 102, 241, 0.4);
}
.btn-primary:active {
    transform: translateY(0);
}

/* Toast notification */
.toast {
    animation: slideIn 0.3s ease, fadeOut 0.3s ease 2.7s;
}
@keyframes slideIn {
    from {
        transform: translateY(100%);
        opacity: 0;
    }
    to {
        transform: translateY(0);
        opacity: 1;
    }
}
@keyframes fadeOut {
    from {
        opacity: 1;
    }
    to {
        opacity: 0;
    }
}

/* Focus states for accessibility */
a:focus, button:focus, textarea:focus, input:focus {
    outline: 2px solid #6366f1;
    outline-offset: 2px;
}