From 8eb7269f27c9a8634c4c73f3be1664755740527a Mon Sep 17 00:00:00 2001
From: hreyes <hreyes@aduanasoft.com.mx>
Date: Fri, 24 Apr 2026 08:55:37 -0600
Subject: [PATCH] feature/bitacora-filtros-alineacion

---
 .../dashboard/audit_logs/bitacora-tab.svelte  | 22 +++++++++----------
 1 file changed, 11 insertions(+), 11 deletions(-)

diff --git a/frontend/src/routes/dashboard/audit_logs/bitacora-tab.svelte b/frontend/src/routes/dashboard/audit_logs/bitacora-tab.svelte
index 4b02f35a..407b76db 100644
--- a/frontend/src/routes/dashboard/audit_logs/bitacora-tab.svelte
+++ b/frontend/src/routes/dashboard/audit_logs/bitacora-tab.svelte
@@ -170,13 +170,13 @@
 <div class="flex min-h-0 flex-1 flex-col gap-4">
 	<Card.Root class="flex min-h-0 flex-1 flex-col overflow-hidden">
 		<Card.Header class="flex-none py-3">
-			<div class="flex items-center justify-between">
-				<div>
+			<div class="flex min-w-0 flex-col gap-2 md:flex-row md:items-center md:justify-between">
+				<div class="shrink-0">
 					<Card.Title>{text('Bitácora de Auditoría', 'Audit Log')}</Card.Title>
 					<Card.Description class="text-xs">{text(`Mostrando ${logs.length} de ${total} registros`, `Showing ${logs.length} of ${total} records`)}</Card.Description>
 				</div>
-				<div class="flex flex-wrap items-center gap-2">
-					<div class="relative">
+				<div class="flex w-full max-w-full min-w-0 items-center gap-2 overflow-x-auto overflow-y-hidden whitespace-nowrap pb-1 [scrollbar-gutter:stable] [scrollbar-width:thin] md:w-auto">
+					<div class="relative shrink-0">
 						<Search class="absolute top-2.5 left-2 h-4 w-4 text-muted-foreground" />
 						<Input
 							id="search"
@@ -189,7 +189,7 @@
 					<Input
 						id="username"
 						placeholder={text('Usuario', 'User')}
-						class="h-9 w-32"
+						class="h-9 w-32 shrink-0"
 						bind:value={usernameFilter}
 						oninput={handleSearchInput}
 					/>
@@ -197,7 +197,7 @@
 						id="procedure"
 						bind:value={procedureFilter}
 						onchange={handleFilterChange}
-						class="flex h-9 w-[180px] rounded-md border border-input bg-background px-3 py-1 text-sm shadow-sm ring-offset-background focus-visible:ring-2 focus-visible:ring-ring focus-visible:outline-none"
+						class="flex h-9 w-[180px] shrink-0 rounded-md border border-input bg-background px-3 py-1 text-sm shadow-sm ring-offset-background focus-visible:ring-2 focus-visible:ring-ring focus-visible:outline-none"
 						title={text('Procedimiento', 'Procedure')}
 					>
 						<option value="">{text('Procedimiento: Todos', 'Procedure: All')}</option>
@@ -208,27 +208,27 @@
 					<Input
 						id="dateFrom"
 						type="date"
-						class="h-9 w-36"
+						class="h-9 w-32 shrink-0"
 						bind:value={dateFrom}
 						onchange={handleFilterChange}
 						title={text('Desde', 'From')}
 					/>
-					<span class="text-sm text-muted-foreground">-</span>
+					<span class="shrink-0 text-sm text-muted-foreground">-</span>
 					<Input
 						id="dateTo"
 						type="date"
-						class="h-9 w-36"
+						class="h-9 w-32 shrink-0"
 						bind:value={dateTo}
 						onchange={handleFilterChange}
 						title={text('Hasta', 'To')}
 					/>
-					<Button variant="outline" size="sm" class="h-9" onclick={clearFilters}>
+					<Button variant="outline" size="sm" class="h-9 shrink-0" onclick={clearFilters}>
 						{text('Limpiar', 'Clear')}
 					</Button>
 					<Button
 						variant="outline"
 						size="sm"
-						class="h-9"
+						class="h-9 shrink-0"
 						onclick={() => {
 							page = 1;
 							hasMore = true;