/* ===== ESTILO GENERAL ===== */

body{
font-family: Arial, Helvetica, sans-serif;
background:#f4f6f9;
margin:0;
padding:20px;
}

/* ===== TITULOS ===== */

h1{
text-align:center;
margin-bottom:30px;
color:#2c3e50;
}

h2{
margin-top:10px;
color:#34495e;
}

h3{
margin-top:20px;
color:#2c3e50;
}

/* ===== PANELES ===== */

#loginPanel,
#panelAdmin,
#panelVendedor,
#panelAprobador{
background:white;
padding:25px;
border-radius:8px;
box-shadow:0 3px 10px rgba(0,0,0,0.1);
margin-bottom:25px;
}

/* ===== INPUTS ===== */

input{
padding:10px;
margin:5px;
border:1px solid #ccc;
border-radius:5px;
font-size:14px;
}

select{
padding:10px;
border:1px solid #ccc;
border-radius:5px;
font-size:14px;
}

/* ===== BOTONES ===== */

button{
padding:10px 18px;
border:none;
background:#2c7be5;
color:white;
border-radius:5px;
cursor:pointer;
font-size:14px;
margin:5px;
}

button:hover{
background:#1a5dc9;
}

/* ===== TABLAS ===== */

table{
width:100%;
border-collapse:collapse;
margin-top:15px;
background:white;
}

th{
background:#2c7be5;
color:white;
padding:10px;
text-align:left;
font-size:14px;
}

td{
border:1px solid #ddd;
padding:8px;
font-size:13px;
}

tr:nth-child(even){
background:#f2f2f2;
}

/* ===== EFECTO HOVER TABLA ===== */

tr:hover{
background:#e9f2ff;
}

/* ===== TABLA BUSQUEDA ===== */

#tablaBusqueda{
max-height:300px;
overflow:auto;
display:block;
}

/* ===== TABLA COTIZACION ===== */

#tablaCotizacion{
margin-top:10px;
}

/* ===== TOTALES ===== */

#subtotal,
#iva,
#total{
font-weight:bold;
font-size:16px;
}

/* ===== BOTON PDF ===== */

button[onclick="generarPDF()"]{
background:#27ae60;
font-weight:bold;
}

button[onclick="generarPDF()"]:hover{
background:#1f8b4d;
}

/* ===== PANEL ADMINISTRADOR ===== */

#adminUsuarios,
#adminProductos,
#adminAprobaciones{
margin-top:20px;
padding:15px;
background:#fafafa;
border:1px solid #ddd;
border-radius:6px;
}

/* ===== BUSCADOR ===== */

#buscadorProducto{
width:300px;
}

/* ===== INPUT CANTIDAD ===== */

input[type="number"]{
width:70px;
}

/* ===== SCROLL TABLAS GRANDES ===== */

#tablaProductos,
#tablaUsuarios,
#tablaSolicitudes{
max-height:400px;
overflow:auto;
display:block;
}

/* ===== BOTONES ADMIN ===== */

#panelAdmin button{
margin-right:10px;
}

/* ===== RESPONSIVE ===== */

@media screen and (max-width:900px){

table{
font-size:12px;
}

button{
padding:8px 12px;
}

#buscadorProducto{
width:100%;
}

}

/* ===== LOGIN CENTRADO ===== */

#loginPanel{
max-width:400px;
margin:auto;
text-align:center;
}

#loginPanel input{
width:90%;
}

/* ===== TABLAS MAS COMODAS ===== */

th,td{
white-space:nowrap;
}

/* ===== ESPACIO ENTRE SECCIONES ===== */

hr{
margin:30px 0;
}

/* ===== MENSAJES ===== */

.alert{
padding:10px;
background:#f1c40f;
color:#333;
border-radius:5px;
margin-top:10px;
}