/* Configurações Globais */
:root {
    scroll-behavior: smooth;
    /* Suporte para Firefox (Mozilla) */
    scrollbar-width: thin;
    scrollbar-color: #cbd5e1 #f1f5f9;
}

body {
    font-family: 'Inter', sans-serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* Customização da Barra de Rolagem (Chrome, Edge, Opera) */
::-webkit-scrollbar {
    width: 10px;
}

::-webkit-scrollbar-track {
    background: #f1f5f9; /* slate-100 */
}

::-webkit-scrollbar-thumb {
    background: #cbd5e1; /* slate-300 */
    border-radius: 5px;
    border: 2px solid #f1f5f9;
}

::-webkit-scrollbar-thumb:hover {
    background: #94a3b8; /* slate-400 */
}

/* Estilo de Seleção de Texto */
::selection {
    background-color: #dbeafe; /* blue-100 */
    color: #1e40af; /* blue-800 */
}

/* Footer & Créditos */
.footer-link {
    color: #ffffff;
    text-decoration: none;
    transition: all 0.3s ease;
    font-weight: 500;
}

.footer-link:hover {
    color: #2563eb; /* blue-600 */
}

/* Estilização do Formulário */
.form-control {
    transition: all 0.3s ease;
    border: 2px solid transparent;
}

.form-control:focus {
    border-color: #93c5fd; /* blue-300 */
    background-color: #ffffff;
    transform: translateY(-2px);
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
}

textarea.form-control {
    resize: vertical;
}

/* Validação Visual */
.form-control:invalid:not(:placeholder-shown) {
    border-color: #f87171; /* red-400 */
    outline: none;
}

/* Animação WhatsApp */
@keyframes whatsapp-pulse {
    0% { box-shadow: 0 0 0 0 rgba(34, 197, 94, 0.4); }
    70% { box-shadow: 0 0 0 15px rgba(34, 197, 94, 0); }
    100% { box-shadow: 0 0 0 0 rgba(34, 197, 94, 0); }
}

.whatsapp-btn {
    animation: whatsapp-pulse 2s infinite;
}

/* Dark Mode Styles */
html.dark {
    /* General background and text */
    --tw-bg-opacity: 1;
    background-color: #1a202c !important; /* slate-900 */
    color: #e2e8f0 !important; /* slate-200 */
}

html.dark body {
    background-color: #1a202c !important; /* slate-900 */
    color: #e2e8f0 !important; /* slate-200 */
}

html.dark header {
    background-color: rgba(26, 32, 44, 0.8); /* slate-900/80 */
    border-color: #2d3748; /* slate-800 */
}

html.dark #mobile-menu {
    background-color: #1a202c; /* slate-900 */
    border-color: #2d3748; /* slate-800 */
}

/* Text colors */
html.dark .text-slate-600 {
    color: #a0aec0; /* slate-400 */
}

html.dark .text-slate-900 {
    color: #e2e8f0; /* slate-200 */
}

html.dark .text-slate-500 {
    color: #cbd5e1; /* slate-300 */
}

html.dark .text-slate-400 {
    color: #e2e8f0; /* slate-200 */
}

/* Background colors */
html.dark .bg-white {
    background-color: #2d3748; /* slate-800 */
}

html.dark .bg-blue-100 {
    background-color: #1e3a8a; /* blue-900 */
}

html.dark .bg-emerald-100 { /* For AI icon background */
    background-color: #064e3b; /* emerald-900 */
}

html.dark .bg-amber-100 {
    background-color: #78350f; /* amber-900 */
}

/* Border colors */
html.dark .border-slate-100 {
    border-color: #2d3748; /* slate-800 */
}

html.dark .border-slate-200 {
    border-color: #4a5568; /* slate-700 */
}

/* Shadows */
html.dark .shadow-sm {
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2);
}

html.dark .shadow-xl {
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.4), 0 10px 10px -5px rgba(0, 0, 0, 0.2);
}

html.dark .shadow-2xl {
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.5);
}

html.dark .hover\:shadow-xl:hover {
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.4), 0 10px 10px -5px rgba(0, 0, 0, 0.2);
}

/* Form controls */
html.dark .form-control {
    background-color: #4a5568; /* slate-700 */
    color: #e2e8f0; /* slate-200 */
    border-color: #4a5568;
}

html.dark .form-control:focus {
    border-color: #60a5fa; /* blue-400 */
    background-color: #4a5568;
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.3);
}

html.dark .form-control:invalid:not(:placeholder-shown) {
    border-color: #f87171; /* red-400 */
}

/* Footer */
html.dark footer {
    background-color: #1a202c; /* slate-900 */
    border-color: #2d3748; /* slate-800 */
}

html.dark .footer-link {
    color: #ffffff;
}

html.dark .footer-link:hover {
    color: #60a5fa; /* blue-400 */
}

/* Selection in dark mode */
html.dark ::selection {
    background-color: #1e3a8a; /* blue-900 */
    color: #93c5fd; /* blue-300 */
}

/* Scrollbar in dark mode */
html.dark ::-webkit-scrollbar-track {
    background: #2d3748; /* slate-800 */
}

html.dark ::-webkit-scrollbar-thumb {
    background: #4a5568; /* slate-700 */
    border-color: #2d3748;
}

html.dark ::-webkit-scrollbar-thumb:hover {
    background: #64748b; /* slate-600 */
}

html.dark {
    scrollbar-color: #4a5568 #2d3748; /* thumb track */
}

/* Specific text colors that are part of gradients or already dark */
html.dark .text-blue-600 { /* For "tecnologia de elite" */
    color: #60a5fa; /* blue-400 */
}

html.dark .text-blue-400 { /* For advantages icons */
    color: #93c5fd; /* blue-300 */
}

html.dark .text-blue-100 { /* For contact section text */
    color: #bfdbfe; /* blue-200 */
}

html.dark .text-emerald-600 { /* For AI icon */
    color: #6ee7b7; /* emerald-300 */
}

html.dark .text-amber-600 {
    color: #fcd34d; /* amber-300 */
}

html.dark .bg-amber-500 {
    background-color: #d97706; /* amber-600 */
}

html.dark .text-indigo-600 { /* For Mobile icon */
    color: #a78bfa; /* indigo-400 */
}

html.dark .text-purple-600 { /* For E-commerce icon */
    color: #c084fc; /* purple-400 */
}

html.dark .bg-blue-600 { /* For buttons and contact section */
    background-color: #2563eb; /* blue-600 - keep it vibrant */
}

html.dark .hover\:bg-blue-700:hover {
    background-color: #1d4ed8; /* blue-700 */
}

html.dark .shadow-blue-200 {
    box-shadow: 0 4px 6px -1px rgba(59, 130, 246, 0.2), 0 2px 4px -2px rgba(59, 130, 246, 0.2); /* blue-500 shadow */
}

html.dark .bg-emerald-500 { /* For "Em breve" ribbon */
    background-color: #059669; /* emerald-600 */
}

html.dark .whatsapp-btn {
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.5); /* Darker shadow for whatsapp button */
    animation: whatsapp-pulse-dark 2s infinite;
}

@keyframes whatsapp-pulse-dark {
    0% { box-shadow: 0 0 0 0 rgba(16, 185, 129, 0.4); } /* Darker green for pulse */
    70% { box-shadow: 0 0 0 15px rgba(16, 185, 129, 0); }
    100% { box-shadow: 0 0 0 0 rgba(16, 185, 129, 0); }
}