diff --git a/client/src/index.css b/client/src/index.css index 22d22ea..7a2ca22 100644 --- a/client/src/index.css +++ b/client/src/index.css @@ -151,28 +151,28 @@ body { color: hsl(var(--identity-accent)); } -/* Inputs modernes */ +/* Inputs modernes avec bordures très visibles */ .modern-input { width: 100%; padding: 12px 16px; - border: 1.5px solid hsl(var(--border)); + border: 3px solid #374151 !important; /* Bordure grise foncée très visible */ border-radius: 8px; background: hsl(var(--background)); color: hsl(var(--foreground)); font-size: 14px; font-weight: 400; transition: all 0.2s ease; - box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05); + box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); } .modern-input:focus { outline: none; - border-color: hsl(var(--primary)); - box-shadow: 0 0 0 3px hsl(var(--primary) / 0.1); + border-color: #2563eb !important; /* Bleu vif pour le focus */ + box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.2); } .modern-input:hover:not(:focus) { - border-color: hsl(var(--border)); + border-color: #4b5563 !important; /* Bordure encore plus foncée au survol */ } .modern-input::placeholder { @@ -266,18 +266,19 @@ body { .search-input { width: 100%; padding: 12px 16px; - border: 1.5px solid hsl(var(--border)); + border: 3px solid #374151 !important; /* Bordure très visible */ border-radius: 8px; background: hsl(var(--background)); color: hsl(var(--foreground)); font-size: 14px; transition: all 0.2s ease; + box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); } .search-input:focus { outline: none; - border-color: hsl(var(--primary)); - box-shadow: 0 0 0 3px hsl(var(--primary) / 0.1); + border-color: #2563eb !important; /* Bleu vif pour le focus */ + box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.2); } /* Filtres élégants */ @@ -422,17 +423,17 @@ body { animation: slideIn 0.3s ease-out; } -/* Sections avec cadres visibles */ +/* Sections avec cadres très visibles */ .section-vendor, .section-product, .section-client, .section-identity { - border: 2px solid hsl(var(--border)); + border: 4px solid #374151 !important; /* Bordure très épaisse et foncée */ border-radius: 12px; padding: 20px; margin-bottom: 24px; background: white; - box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06); + box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15); } /* Responsive design */