/* public/assets/css/app.css
   Estilos personalizados del Sistema de Repliegue ONPE */

/* ── Tipografía ──────────────────────────────────────── */
body {
    font-family: 'Segoe UI', system-ui, -apple-system, sans-serif;
    font-size: .95rem;
}

/* ── Cards ────────────────────────────────────────────── */
.card {
    border-radius: 12px;
    transition: box-shadow .2s ease;
}
.card:hover {
    box-shadow: 0 4px 20px rgba(0,0,0,.08) !important;
}

/* ── Navbar ───────────────────────────────────────────── */
.navbar-brand {
    font-size: 1.1rem;
    letter-spacing: .3px;
}

/* ── Badges de placa ──────────────────────────────────── */
.badge-placa {
    font-family: monospace;
    font-size: .9rem;
    letter-spacing: 1px;
}

/* ── Tabla responsive mejorada ────────────────────────── */
.table th {
    font-size: .8rem;
    text-transform: uppercase;
    letter-spacing: .5px;
    color: #6c757d;
    font-weight: 600;
}

/* ── Botones con icono ────────────────────────────────── */
.btn i {
    vertical-align: -.1em;
}

/* ── Input file personalizado ─────────────────────────── */
.form-control[type="file"]::file-selector-button {
    background-color: #0d6efd;
    color: white;
    border: none;
    padding: .375rem .75rem;
    border-radius: .25rem 0 0 .25rem;
    cursor: pointer;
}
.form-control[type="file"]::file-selector-button:hover {
    background-color: #0b5ed7;
}

/* ── Alert flash ──────────────────────────────────────── */
.alert {
    border-radius: 10px;
    border: none;
    box-shadow: 0 2px 8px rgba(0,0,0,.07);
}

/* ── Spinner en botones ───────────────────────────────── */
.btn .spinner-border {
    width: 1rem;
    height: 1rem;
    border-width: .15em;
}

/* ── Sidebar (admin) ──────────────────────────────────── */
.sidebar .nav-link {
    font-size: .9rem;
    transition: background .15s ease, color .15s ease;
}

/* ── Scroll suave ─────────────────────────────────────── */
html {
    scroll-behavior: smooth;
}

/* ── Responsive: tabla en móvil ───────────────────────── */
@media (max-width: 576px) {
    .table td, .table th {
        font-size: .8rem;
        padding: .4rem .5rem;
    }
}