/* Estilos para o tema claro e escuro */
        :root {
            --bg-primary: #eff6ff; /* blue-50 */
            --bg-secondary: #ffffff; /* white */
            --bg-tertiary: #f3f4f6; /* gray-100 */
            --bg-hover: #e5e7eb; /* gray-200 */
            --text-primary: #1f2937; /* gray-800 */
            --text-secondary: #6b7280; /* gray-500 */
            --border-color: #e5e7eb; /* gray-200 */
            --accent-color: #2563eb; /* blue-600 */
            --accent-hover: #1d4ed8; /* blue-700 */
        }

        .dark {
            --bg-primary: #030712; /* gray-950 */
            --bg-secondary: #1f2937; /* gray-800 */
            --bg-tertiary: #374151; /* gray-700 */
            --bg-hover: #4b5563; /* gray-600 */
            --text-primary: #f9fafb; /* gray-50 */
            --text-secondary: #9ca3af; /* gray-400 */
            --border-color: #4b5563; /* gray-600 */
            --accent-color: #60a5fa; /* blue-400 */
            --accent-hover: #3b82f6; /* blue-500 */
        }