/* ==========================================================================
   Olverin theme: order tracking page
   Styles the WooCommerce [woocommerce_order_tracking] form (form.track_order)
   as rendered on the demo page: a centred column with the intro text, small
   centred labels, full-width inputs and a full-width primary "Track" button.
   Enqueued site-wide (functions.php: order-tracking.css). Authored by
   Olverin Ventures.
   ========================================================================== */

/* Elementor shortcode widget wrapper used by the demo page (.klb-order-tracking)
   and the bare shortcode on any page */
.klb-order-tracking .woocommerce,
.woocommerce-form-track-order { max-width: 560px; margin: 0 auto; }

.woocommerce-form-track-order { text-align: center; }
.woocommerce-form-track-order > p:first-child { margin: 0 0 24px; font-size: 14px; line-height: 1.6; }

/* Rows: stacked, full width, label centred above the field */
.woocommerce-form-track-order .form-row { display: block; width: 100%; margin: 0 0 14px; padding: 0; float: none; }
.woocommerce-form-track-order .form-row label { display: block; margin: 0 0 6px; font-size: 12px; line-height: 1.5; text-align: center; }
.woocommerce-form-track-order .form-row .input-text { width: 100%; height: 46px; padding: 0 14px; text-align: center; }
.woocommerce-form-track-order .form-row .input-text::placeholder { text-align: center; }
.woocommerce-form-track-order .form-row:last-of-type { margin: 20px 0 0; }
.woocommerce-form-track-order .button { display: inline-flex; align-items: center; justify-content: center; width: 100%; height: var(--olv-btn-h); background-color: var(--olv-primary); color: var(--olv-white); }
.woocommerce-form-track-order .button:hover { background-color: var(--olv-text); color: var(--olv-white); }

/* Bare page (no Elementor column): frame the form as a centred card */
.site-content > .container > .woocommerce > .woocommerce-form-track-order,
.entry-content > .woocommerce > .woocommerce-form-track-order { margin: 40px auto; padding: 40px 30px; border: 1px solid var(--olv-border); }

/* Result view (order/tracking.php) shown under the form after a lookup */
.klb-order-tracking .woocommerce-order-details,
.klb-order-tracking .woocommerce-customer-details { margin-top: 30px; text-align: left; }

@media (min-width: 992px) {
  .woocommerce-form-track-order > p:first-child { margin-bottom: 30px; }
  .woocommerce-form-track-order .form-row { margin-bottom: 16px; }
}
