/*public\assets\css\base.css =>  Reset and base styles for the application */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

:root {
    --color-primary: #1565C0;
    --color-primary-hover: #0D47A1;
    --color-success: #2E7D32;
    --color-success-bg: #E8F5E9;
    --color-warning: #E65100;
    --color-warning-bg: #FFF3E0;
    --color-danger: #C62828;
    --color-danger-bg: #FFEBEE;
    --color-info: #0288D1;
    --color-info-bg: #E1F5FE;

    --bg-page: #FAFAFA;
    --bg-surface: #FFFFFF;
    --bg-sidebar: #1A237E;
    --bg-topbar: #FFFFFF;

    --text-primary: #1A1A1A;
    --text-secondary: #5F6368;
    --text-inverse: #FFFFFF;

    --border-color: #E0E0E0;
    --shadow-sm: 0 1px 3px rgba(0,0,0,0.08);
    --shadow-md: 0 4px 12px rgba(0,0,0,0.1);
    --shadow-lg: 0 8px 24px rgba(0,0,0,0.12);

    --radius: 12px;
    --radius-sm: 8px;

    --font: system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
    --font-size-xs: 12px;
    --font-size-sm: 14px;
    --font-size: 16px;
    --font-size-lg: 18px;
    --font-size-xl: 24px;
    --font-size-2xl: 32px;

    --ease: cubic-bezier(0.4, 0, 0.2, 1);
    --transition-fast: 0.15s var(--ease);
    --transition-base: 0.25s var(--ease);

    --space-xs: 4px;
    --space-sm: 8px;
    --space-md: 16px;
    --space-lg: 24px;
    --space-xl: 32px;

    --touch-min: 48px;
}

html { font-size: var(--font-size); }

body {
    font-family: var(--font);
    color: var(--text-primary);
    background: var(--bg-page);
    line-height: 1.5;
    -webkit-font-smoothing: antialiased;
    min-height: 100vh;
}

h1, h2, h3 { line-height: 1.3; font-weight: 600; }
h1 { font-size: var(--font-size-2xl); margin-bottom: var(--space-md); }
h2 { font-size: var(--font-size-xl); margin-bottom: var(--space-sm); }
h3 { font-size: var(--font-size-lg); }

a { color: var(--color-primary); text-decoration: none; }
a:hover { text-decoration: underline; }

strong { font-weight: 600; }

img, svg { max-width: 100%; height: auto; display: block; }

button, input, select, textarea { font-family: inherit; }

/* Foco visible accesible: solo aparece con navegación por teclado */
:focus-visible {
    outline: 3px solid var(--color-primary);
    outline-offset: 2px;
    border-radius: 4px;
}

a:focus-visible, .btn:focus-visible, button:focus-visible {
    outline-offset: 3px;
}

::selection { background: var(--color-primary); color: white; }

.sr-only {
    position: absolute; width: 1px; height: 1px;
    padding: 0; margin: -1px; overflow: hidden;
    clip: rect(0,0,0,0); white-space: nowrap; border: 0;
}
fieldset.form-section {
    padding: 15px 20px;
}