/* small helpers beyond Tailwind */
.input {
  padding: 0.75rem 4rem;
  border-radius: 8rem;
  border: 3px solid #000000;
  background-color: #ffffff;
}
.input:focus {
  outline: none;
  box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.4);
}
/* Dark mode support */
:root[data-theme="dark"] body { background-color: #0f172a; color: #fff; }
:root[data-theme="dark"] header, :root[data-theme="dark"] footer { background-color: #1e293b !important; }
:root[data-theme="dark"] .input { 
  background-color: #334155;
  color: #ebebeb;
  border-color: #334155;
}
:root[data-theme="dark"] .bg-white { background-color: #1e293b !important; }
:root[data-theme="dark"] .text-ink { color: #fff !important; }
:root[data-theme="dark"] .text-slate-500 { color: #94a3b8 !important; }
:root[data-theme="dark"] .shadow { box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1) !important; }
:root[data-theme="dark"] .hover\:bg-gray-100:hover { background-color: #334155 !important; }
:root[data-theme="dark"] .hover\:text-primary:hover { color: #3b82f6 !important; }
:root[data-theme="dark"] .border-gray-300 { border-color: #475569 !important; }
:root[data-theme="dark"] .placeholder-gray-400::placeholder { color: #94a3b8 !important; }
:root[data-theme="dark"] .bg-gray-100 { background-color: #334155 !important; }
:root[data-theme="dark"] .bg-gray-200 { background-color: #475569 !important; }
:root[data-theme="dark"] .bg-gray-300 { background-color:
  #64748b !important; }
:root[data-theme="dark"] .bg-gray-400 { background-color: #94a3b8 !important; }
:root[data-theme="dark"] .bg-gray-500 { background-color: #cbd5e1 !important; }
:root[data-theme="dark"] .bg-gray-600 { background-color: #e2e8f0 !important; }
:root[data-theme="dark"] .bg-gray-700 { background-color: #f1f5f9 !important; }
:root[data-theme="dark"] .bg-gray-800 { background-color: #f8fafc !important; }
:root[data-theme="dark"] .bg-gray-900 { background-color: #ffffff !important; }
:root[data-theme="dark"] .border-gray-500 { border-color: #94a3b8 !important; }
:root[data-theme="dark"] .border-gray-700 { border-color: #cbd5e1 !important; }
:root[data-theme="dark"] .border-gray-900 { border-color: #ffffff !important; }
:root[data-theme="dark"] .text-gray-700 { color: #cbd5e1 !important; }  
:root[data-theme="dark"] .text-gray-900 { color: #ffffff !important; }
:root[data-theme="dark"] .text-gray-500 { color: #94a3b8 !important; }
:root[data-theme="dark"] .text-gray-400 { color: #64748b !important; }
:root[data-theme="dark"] .text-gray-600 { color: #e2e8f0 !important; }
:root[data-theme="dark"] .text-gray-800 { color: #f1f5f9 !important; }
:root[data-theme="dark"] .text-white { color: #000 !important; }
:root[data-theme="dark"] .hover\:bg-white:hover { background-color: #000 !important; }
:root[data-theme="dark"] .hover\:text-ink:hover { color: #fff !important; }
.logo {
    height: 80px;
    width: 20px;
}
/* Styles for the login and signup pages */
:root {
    --primary-color: #3b82f6; /* أزرق ساطع */
    --text-color: #e0e0e0; /* لون نص فاتح */
    --card-bg: rgba(255, 255, 255, 0.1); /* خلفية شفافة */
    --border-color: rgba(255, 255, 255, 0.2); /* لون حدود شفاف */
    --glow-color: #3b82f6; /* لون التوهج */
}