/**
 * Atelier — T29 Guest Order Tracking.
 * Source: design/store-theme/01-atelier-fashion/pages/T29 Guest Order Tracking.dc.html
 */

/* Suppress Magento's default guest "Orders and Returns" chrome that bleeds in
 * above our themed "Track your order" card. The layout's
 * `<referenceBlock name="sales.guest.view" remove="true"/>` was an unverified
 * block-name guess and turned out to be a no-op (the real form block is
 * `.form.form-orders-search`), so the default form + core page-title rendered
 * alongside ours. Hide them via CSS (scoped to the page body class) rather
 * than chasing the exact core block name with another remove — CSS can't
 * orphan a module reference and 500 the page. The design artboard shows only
 * the themed card, no core form/title. */
body.atl-page-guest-tracking .page-title-wrapper,
body.atl-page-guest-tracking .form.form-orders-search,
body.atl-page-guest-tracking .breadcrumbs { display: none; }

.atl-gt { max-width: 560px; margin: 0 auto; padding: 56px 24px 0; display: flex; flex-direction: column; gap: 22px; }
.atl-gt-head { text-align: center; display: flex; flex-direction: column; gap: 10px; }
.atl-gt-title { font-family: 'Cormorant Garamond', serif; font-weight: 400; line-height: 1.12; margin: 0; font-size: 32px; text-wrap: balance; }
.atl-gt-body { font-size: 14px; color: var(--atl-text-muted); margin: 0; }

.atl-gt-form { background: var(--atl-surface); border: 1px solid var(--atl-border); padding: 28px; display: flex; flex-direction: column; gap: 14px; }

.atl-gt-result { background: var(--atl-surface); border: 1px solid var(--atl-accent); padding: 20px 24px; display: flex; align-items: center; gap: 16px; }
.atl-gt-result-id { font-family: monospace; font-size: 13px; }
.atl-gt-result-meta { font-size: 12.5px; color: var(--atl-text-muted); }
.atl-gt-result-track { font-size: 13px; color: var(--atl-accent); text-decoration: none; }

@media (max-width: 767px) {
  .atl-gt { padding: 40px 20px 0; }
  .atl-gt-title { font-size: 26px; }
  .atl-gt-result { flex-wrap: wrap; }
}