/* ============================================================================
@file        /site/templates/assets/css/teloporto.css
@module      TeloPorto DM – CSS base (liste/dettagli ordini)
@version     0.1.0
@author      DF
@date        2025-09-20
@change-id   CSS-BASE-0001
@changelog   [0.1.0][CSS-BASE-0001] Prima versione: tabella responsive + badge di stato.
============================================================================ */

/* ===== PRIMA [CSS-BASE-0001]
File inesistente.
===== MOTIVO =====
Introdurre uno stylesheet condiviso per lista/dettaglio ordini, con tabella responsive
e badge di stato coerenti nel front-end.
===== FINE PRIMA ===== */

/* ===== DOPO [CSS-BASE-0001] ===== */

/* Layout base */
.tp-container { padding: 1rem; }
.tp-table { width: 100%; border-collapse: collapse; }
.tp-table th, .tp-table td { border: 1px solid #e5e7eb; padding: .6rem .75rem; vertical-align: top; }
.tp-table thead th { background: #f8fafc; text-align: left; font-weight: 600; }

/* Responsività semplice: scroll orizzontale su schermi stretti */
@media (max-width: 640px) {
  .tp-table { display: block; overflow-x: auto; white-space: nowrap; }
}

/* Badge di stato */
.tp-badge {
  display: inline-block;
  padding: .2rem .6rem;
  border-radius: .6rem;
  font-size: .85rem;
  line-height: 1.2;
  font-weight: 600;
  border: 1px solid transparent;
}

/* Classi derivate dal nome stato (slug) */
.tp-badge--in-preparazione { background: #fff7ed; color: #8a4b00; border-color: #fed7aa; }   /* arancio chiaro */
.tp-badge--pronto          { background: #ecfdf5; color: #065f46; border-color: #a7f3d0; }   /* verde */
.tp-badge--consegnato      { background: #f1f5f9; color: #334155; border-color: #cbd5e1; }   /* grigio/blu */