/* css/theme.css */
:root {
    /* Branding Colors: Tech Vibe (Adaptado para Light Mode) */
    --brand-primary: #0ea5e9;   /* Azul cielo tech */
    --brand-secondary: #4f46e5; /* Índigo profundo */
    --brand-accent: #ef4444;    /* Rojo para alertas/eliminar */
    
    /* Backgrounds & Surfaces (Light Theme) */
    --bg-base: #f8fafc;         /* Fondo general: Gris azulado muy claro */
    --bg-surface: #ffffff;      /* Tarjetas: Blanco puro */
    --bg-surface-hover: #f1f5f9; /* Hover en tablas: Gris muy sutil */
    --bg-header: #ffffff;       /* Header: Blanco puro */
    
    /* Typography & Colors */
    --text-main: #0f172a;       /* Texto principal: Casi negro */
    --text-muted: #64748b;      /* Texto secundario: Gris medio */
    
    /* Borders & Radius */
    --border-color: #e2e8f0;    /* Bordes sutiles */
    --radius-sm: 6px;
    --radius-md: 10px;
    --radius-lg: 14px;

    /* Shadows (Más pronunciadas para separar el blanco del gris claro) */
    --shadow-card: 0 4px 6px -1px rgba(0, 0, 0, 0.05), 0 2px 4px -1px rgba(0, 0, 0, 0.03);
    --shadow-hover: 0 10px 15px -3px rgba(0, 0, 0, 0.08), 0 4px 6px -2px rgba(0, 0, 0, 0.04);
    
    /* Typography */
    --font-family: 'SF Pro Display', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    --font-mono: 'SF Mono', SFMono-Regular, ui-monospace, 'Menlo', monospace;

    
}

/* Ajuste para que los campos ocupen todo el ancho disponible */
.modal-content input[type="text"],
.modal-content input[type="email"],
.modal-content select {
    width: 100%;
    box-sizing: border-box; /* Para que el padding no desborde el ancho */
    /* Aquí mantienes el padding o border-radius que ya tenías */
}

.modal-content input,
.modal-content select {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    margin-bottom: 15px; /* Para que no queden pegados uno con otro */
}