From d532a8cb347b63fe093daa0aa02730b9ae39afe1 Mon Sep 17 00:00:00 2001
From: marsalva <info@marsalva.es>
Date: Sat, 28 Feb 2026 22:32:09 +0000
Subject: [PATCH] Actualizar proveedores.html

---
 proveedores.html | 40 ++++++++++++++++++++--------------------
 1 file changed, 20 insertions(+), 20 deletions(-)

diff --git a/proveedores.html b/proveedores.html
index 4956754..2d8c77e 100644
--- a/proveedores.html
+++ b/proveedores.html
@@ -104,35 +104,35 @@
 
     <div id="importModal" class="fixed inset-0 bg-slate-900/75 hidden z-[100] flex items-center justify-center backdrop-blur-md p-2 text-left">
         <div class="bg-white rounded-[2.5rem] shadow-2xl w-full max-w-4xl flex flex-col max-h-[95vh] overflow-hidden border border-slate-200 fade-in text-left">
-            <div class="px-8 pt-6 pb-4 flex justify-between items-center border-b border-slate-50 text-left">
-                <div class="flex items-center gap-4 text-left">
-                    <div id="modalCompanyLogo" class="w-12 h-12 rounded-xl bg-slate-50 border border-slate-100 p-2 flex items-center justify-center shadow-sm overflow-hidden"></div>
-                    <div>
-                        <div class="flex items-center gap-2 text-left">
-                            <h3 class="text-xl font-black text-slate-800 tracking-tight">Validación de Expediente</h3>
+            <div class="px-6 py-6 md:px-8 flex flex-col lg:flex-row justify-between items-start lg:items-center gap-6 border-b border-slate-100 bg-slate-50/50">
+                <div class="flex items-center gap-4 min-w-0">
+                    <div id="modalCompanyLogo" class="w-14 h-14 rounded-2xl bg-white border border-slate-200 p-2 flex items-center justify-center shadow-sm shrink-0 overflow-hidden"></div>
+                    <div class="min-w-0">
+                        <div class="flex flex-wrap items-center gap-2.5 mb-1.5">
+                            <h3 class="text-xl md:text-2xl font-black text-slate-800 tracking-tight leading-none truncate">Validación de Expediente</h3>
                             <div id="modalStatusBadge"></div>
                         </div>
-                        <div class="flex items-center gap-2 mt-0.5 text-left">
-                            <span id="displayRef" class="text-[10px] bg-slate-100 text-slate-500 px-2 py-0.5 rounded-lg font-bold border border-slate-200 uppercase">REF: --</span>
-                            <span id="displayCompany" class="text-[10px] bg-blue-50 text-blue-600 px-2 py-0.5 rounded-lg font-bold border border-blue-100 uppercase truncate max-w-[250px]">--</span>
+                        <div class="flex flex-wrap items-center gap-2 mt-1">
+                            <span id="displayRef" class="text-[10px] bg-white text-slate-500 px-2.5 py-1 rounded-lg font-black border border-slate-200 uppercase tracking-widest shadow-sm shrink-0">REF: --</span>
+                            <span id="displayCompany" class="text-[10px] bg-blue-50 text-blue-700 px-2.5 py-1 rounded-lg font-black border border-blue-200 uppercase tracking-widest truncate max-w-[200px] shadow-sm">--</span>
                         </div>
                     </div>
                 </div>
-                <div class="flex items-center gap-4 text-left">
-                    <div class="flex flex-col items-end mr-2 text-left">
-                        <span class="text-[9px] font-black text-slate-400 uppercase mb-1">Estado Operativo</span>
-                        <select id="impStatus" class="bg-blue-50 text-blue-700 border border-blue-200 text-xs font-black px-3 py-1.5 rounded-xl outline-none focus:border-blue-400 cursor-pointer shadow-sm">
-                            <option value="">Seleccionar Estado...</option>
+                <div class="flex items-end gap-3 w-full lg:w-auto">
+                    <div class="flex-1 lg:flex-none flex flex-col">
+                        <label class="text-[9px] font-black text-slate-400 uppercase tracking-widest mb-1.5 ml-1">Estado Operativo</label>
+                        <select id="impStatus" class="bg-white text-blue-700 border-2 border-blue-100 text-xs font-black px-4 py-2.5 rounded-xl outline-none focus:border-blue-400 focus:ring-2 focus:ring-blue-100 cursor-pointer shadow-sm w-full lg:w-44 transition-all">
+                            <option value="">Seleccionar...</option>
                         </select>
                     </div>
-                    <div class="flex flex-col items-end mr-4 text-left">
-                        <span class="text-[9px] font-black text-slate-400 uppercase mb-1">Prioridad</span>
-                        <select id="impUrgent" class="bg-slate-50 border border-slate-200 text-xs font-black px-3 py-1.5 rounded-xl outline-none focus:border-red-400 cursor-pointer">
-                            <option value="false">BAJA (Normal)</option>
-                            <option value="true">🚨 MUY URGENTE</option>
+                    <div class="flex-1 lg:flex-none flex flex-col">
+                        <label class="text-[9px] font-black text-slate-400 uppercase tracking-widest mb-1.5 ml-1">Prioridad</label>
+                        <select id="impUrgent" class="bg-white border-2 border-slate-200 text-xs font-black px-4 py-2.5 rounded-xl outline-none focus:border-red-400 focus:ring-2 focus:ring-red-100 cursor-pointer shadow-sm w-full lg:w-36 transition-all">
+                            <option value="false">Normal</option>
+                            <option value="true">🚨 Urgente</option>
                         </select>
                     </div>
-                    <button type="button" onclick="closeModal()" class="bg-slate-50 p-2 rounded-full hover:bg-red-50 hover:text-red-500 transition-all text-left">
+                    <button type="button" onclick="closeModal()" class="bg-white border border-slate-200 p-2.5 rounded-xl text-slate-400 hover:bg-red-50 hover:text-red-500 hover:border-red-200 transition-all shadow-sm shrink-0 mb-[1px]">
                         <i data-lucide="x" class="w-5 h-5"></i>
                     </button>
                 </div>