/* Pedidos: cada pedido es una tarjeta vertical */
.lista-pedidos { display: grid; grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); gap: 18px; align-items: start; }
.pedido { display: flex; flex-direction: column; gap: 10px; animation: entra .4s ease both; animation-delay: calc(var(--i) * 40ms); }
.ped-titulo { display: flex; align-items: baseline; gap: 14px; flex-wrap: wrap; padding-bottom: 10px; border-bottom: 1px solid #12335b; }
.ped-titulo h2 { margin: 0; font-size: 1.3rem; }
.fecha { color: var(--suave); font-size: .95rem; }
.ped-linea { margin: 0; }
.ped-linea b { color: var(--suave); font-weight: 500; }
.pedido h3 { margin: 8px 0 0; font-size: .85rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--azul); }

.est { display: inline-block; padding: 4px 14px; border-radius: 99px; font-size: .9rem; font-weight: 600; border: 1px solid; }
.est-pendiente { color: #ffc857; } .est-pagado { color: var(--azul); } .est-entregado { color: var(--verde); } .est-cancelado { color: var(--rojo); }

.datos { display: grid; gap: 4px; margin: 0; }
.datos div { display: flex; gap: 8px; }
.datos dt { color: var(--suave); min-width: 86px; }
.datos dd { margin: 0; overflow-wrap: anywhere; }

.productos-ped { list-style: none; padding: 0; margin: 0; display: grid; gap: 6px; }
.productos-ped li { display: grid; grid-template-columns: auto 1fr auto; gap: 10px; padding: 8px 0; border-bottom: 1px dashed #12335b; }
.cant-p { color: var(--azul); font-weight: 600; }
.nom-p { overflow-wrap: anywhere; }
.sub-p { color: var(--suave); white-space: nowrap; }
.ped-total { display: flex; justify-content: space-between; align-items: center; margin: 4px 0 0; font-size: 1.2rem; }
.ped-total b { color: var(--azul); }

.ped-acc { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 6px; } .ped-acc form { display: inline; }
.ped-acc .btn-sec { margin: 0; }
.peligro { border-color: var(--rojo); color: var(--rojo); }

@media (max-width: 480px) { .lista-pedidos { grid-template-columns: 1fr; } }

/* buscador de pedidos */
.buscar-pedidos { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; }
.buscar-pedidos input[type=search] { flex: 1; min-width: 220px; }
.buscar-pedidos select { min-width: 170px; }
.buscar-pedidos .btn-sec { margin: 0; }
.nota-busqueda { color: var(--suave); }
@media (max-width: 480px) { .buscar-pedidos > * { flex: 1 1 100%; } }