/* doc-project | public/assets/css/tracking.css | affiche recherche, résumé, articles et chronologie de suivi de commande */
.tracking-layout { display: grid; gap: 1.2rem; padding-bottom: 5rem; }
.tracking-search, .tracking-card { border: 1px solid var(--line); border-radius: var(--radius-lg); background: white; padding: clamp(1.1rem, 4vw, 2rem); box-shadow: var(--shadow-sm); }
.tracking-search { display: grid; gap: 1rem; }
.tracking-search h2 { margin: 0; font-family: var(--font-body); font-size: 1.1rem; font-weight: 900; }
.tracking-search form { display: grid; gap: .8rem; }
.tracking-card { display: grid; gap: 1.3rem; }
.tracking-status { display: grid; grid-template-columns: auto 1fr; gap: .9rem; align-items: center; }
.tracking-status__icon { display: grid; width: 3.7rem; height: 3.7rem; place-items: center; border-radius: 1.2rem; background: var(--blush); color: var(--wine); }
.tracking-status__icon .icon { width: 1.8rem; height: 1.8rem; }
.tracking-status h2 { margin: .2rem 0 0; }
.tracking-summary { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .7rem; }
.tracking-summary > div { border-radius: var(--radius); background: #faf7f5; padding: .8rem; }
.tracking-summary small, .tracking-summary strong { display: block; }
.tracking-summary small { color: var(--ink-soft); font-size: .7rem; }
.tracking-items { display: grid; gap: .65rem; }
.tracking-items > div { display: grid; grid-template-columns: 3.4rem minmax(0, 1fr) auto; gap: .7rem; align-items: center; border-top: 1px solid var(--line); padding-top: .7rem; }
.tracking-items img, .mini-placeholder { width: 3.4rem; height: 3.8rem; border-radius: .7rem; object-fit: cover; }
.mini-placeholder { display: grid; place-items: center; background: var(--blush); color: var(--wine); }
.tracking-items span { display: grid; }
.tracking-items small { color: var(--ink-soft); }
.timeline { display: grid; gap: 0; margin-top: .5rem; }
.timeline > div { position: relative; display: grid; grid-template-columns: 1rem 1fr; gap: .8rem; padding-bottom: 1.2rem; }
.timeline > div::before { position: absolute; top: .8rem; bottom: -.1rem; left: .45rem; width: 1px; background: var(--line-dark); content: ""; }
.timeline > div:last-child::before { display: none; }
.timeline > div::after { z-index: 1; width: .9rem; height: .9rem; margin-top: .25rem; border: 3px solid white; border-radius: 50%; background: var(--rose); box-shadow: 0 0 0 1px var(--rose); content: ""; }
.timeline > div > span { grid-column: 2; display: grid; margin-top: -1.35rem; }
.timeline small { color: var(--ink-soft); }
@media (min-width: 760px) { .tracking-layout { grid-template-columns: minmax(16rem, .6fr) minmax(0, 1.4fr); align-items: start; } .tracking-search { position: sticky; top: 8.5rem; } .tracking-summary { grid-template-columns: repeat(4, 1fr); } }