/* Christmas tree order page (claygate_xmas_trees.php) */

/* Below xl the template moves the brand into the off-canvas menu, leaving an
   empty navbar strip. Hide that strip and show our own brand row instead. */
@media (max-width: 1199.98px) {
  .xt-page .layout-navbar { display: none !important; }
}
.xt-brand { display: flex; align-items: center; gap: .5rem; text-decoration: none; }
.xt-brand img { height: 30px; }
.xt-brand span { font-weight: 700; font-size: 1.1rem; color: var(--bs-heading-color, #384551); }

/* Step indicator */
.xt-steps { font-size: .875rem; }
.xt-step {
  display: inline-flex; align-items: center; gap: .4rem;
  padding: .2rem .7rem .2rem .25rem; border-radius: 2rem;
  background: var(--bs-gray-100, #f3f4f6); color: var(--bs-body-color);
}
.xt-step span {
  display: inline-flex; align-items: center; justify-content: center;
  width: 1.4rem; height: 1.4rem; border-radius: 50%;
  background: var(--bs-gray-300, #d9dee3); font-weight: 600; font-size: .75rem;
}
.xt-step.is-current { background: rgba(var(--bs-primary-rgb), .12); color: var(--bs-primary); font-weight: 600; }
.xt-step.is-current span { background: var(--bs-primary); color: #fff; }

/* Card step number */
.xt-num {
  display: inline-flex; align-items: center; justify-content: center;
  width: 1.75rem; height: 1.75rem; margin-right: .5rem; border-radius: 50%;
  background: var(--bs-primary); color: #fff; font-size: .9rem; font-weight: 600;
  vertical-align: middle;
}

/* Products */
.xt-product-title {
  font-size: 1.05rem; font-weight: 600; margin-bottom: .5rem;
  padding-bottom: .4rem; border-bottom: 1px solid var(--bs-border-color, #e4e6e8);
}
.xt-offer {
  background: rgba(var(--bs-success-rgb), .08); color: var(--bs-success);
  border-radius: .375rem; padding: .5rem .75rem;
}

.xt-size {
  display: grid;
  grid-template-columns: 1fr auto;
  grid-template-areas: "info stepper" "total total" "del del";
  align-items: center;
  gap: .25rem 1rem;
  padding: .75rem 0;
  border-bottom: 1px solid var(--bs-border-color, #f0f1f3);
}
.xt-size:last-child { border-bottom: 0; }
.xt-size-info { grid-area: info; display: flex; flex-wrap: wrap; align-items: baseline; gap: .15rem .6rem; }
.xt-size-name { font-weight: 600; color: var(--bs-heading-color, #384551); }
.xt-size-price { color: var(--bs-body-color); }
.xt-stepper { grid-area: stepper; display: flex; align-items: center; gap: .35rem; }
.xt-stepper .btn { width: 44px; height: 44px; padding: 0; font-size: 1.25rem; }
.xt-stepper .xt-qty, .xt-stepper .xt-cqty { width: 3.25rem; height: 44px; text-align: center; font-weight: 600; padding: .25rem; }
.xt-line-total { grid-area: total; text-align: right; font-weight: 600; font-size: .9rem; color: var(--bs-primary); }
.xt-line-total:empty { display: none; }
.xt-delmethod { grid-area: del; max-width: 22rem; }
.xt-size.is-selected .xt-size-name { color: var(--bs-primary); }
.xt-soldout .xt-size-name, .xt-soldout .xt-size-price { color: var(--bs-secondary-color, #a1acb8); text-decoration: line-through; }
.xt-soldout .badge { text-decoration: none; }

@media (min-width: 768px) {
  .xt-size { grid-template-columns: 1fr 8rem auto; grid-template-areas: "info total stepper" "del del del"; }
}

/* Delivery dates */
.xt-date { display: flex; flex-direction: column; align-items: center; justify-content: center; text-transform: none; padding: .75rem .5rem; line-height: 1.3; height: 100%; }
.btn-check:disabled + .xt-date { opacity: .55; }
.xt-dates.is-invalid .xt-date { border-color: var(--bs-danger); }

/* Donation chips */
.xt-don { display: inline-flex; flex-direction: column; align-items: center; text-transform: none; min-width: 4.75rem; padding: .5rem .75rem; line-height: 1.25; }
.xt-don-amt { opacity: .85; }

/* Summary */
.xt-summary-card { position: sticky; top: 1rem; }
.xt-sum-lines li { display: flex; justify-content: space-between; gap: 1rem; padding: .25rem 0; font-size: .925rem; }
.xt-sum-total {
  display: flex; justify-content: space-between; padding-top: .6rem;
  border-top: 1px solid var(--bs-border-color, #e4e6e8); font-weight: 700; font-size: 1.1rem;
}
.xt-summary-inline { background: var(--bs-gray-50, #f8f9fa); border-radius: .5rem; padding: .75rem 1rem; }

/* Phone bottom bar */
.xt-bottom-bar {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 1080;
  display: flex; align-items: center; justify-content: space-between; gap: 1rem;
  padding: .65rem 1rem calc(.65rem + env(safe-area-inset-bottom));
  background: var(--bs-paper-bg, #fff); box-shadow: 0 -2px 10px rgba(0, 0, 0, .12);
  transform: translateY(110%); transition: transform .2s ease;
}
.xt-bottom-bar.is-visible { transform: translateY(0); }
.xt-bottom-text { display: flex; flex-direction: column; line-height: 1.2; }
.xt-bb-count { font-size: .8rem; color: var(--bs-secondary-color, #6d788d); }
.xt-bb-total { font-size: 1.15rem; }
body.xt-has-bar .content-footer { padding-bottom: 4.5rem; }
@media (min-width: 992px) { body.xt-has-bar .content-footer { padding-bottom: 0; } }

/* Validation helpers */
.invalid-feedback:empty { display: none !important; }
#xtErrorSummary a { color: inherit; text-decoration: underline; }

/* ---------- Readability: colours checked against WCAG AA (4.5:1 for normal text) ---------- */
/* Low stock: dark amber text on pale amber (was 1.6:1, now about 5.8:1) */
.xt-page .xt-size .bg-label-warning {
  color: #8a5300 !important;
  background-color: #fff4df !important;
  border: 1px solid #f5c26b;
  font-weight: 600;
}
/* Sold out badge and struck-through text (were 2.3 to 3.7:1, now about 5:1) */
.xt-page .xt-size .bg-label-secondary { color: #4f5260 !important; background-color: #eceef1 !important; }
.xt-page .xt-soldout .xt-size-name,
.xt-page .xt-soldout .xt-size-price { color: #6d6f7d; }
/* Prices, hints and muted text (were 1.9 to 3.7:1) */
.xt-page .xt-size-price,
.xt-page .form-text,
.xt-page .text-muted,
.xt-page .xt-bb-count { color: #6d6f7d !important; }
.xt-page .xt-step { color: #595b6b; }
/* Small purple text (was 4.1:1, now about 5.8:1) */
.xt-page .xt-line-total,
.xt-page .xt-size.is-selected .xt-size-name { color: #4f53e0; }
.xt-page .btn-outline-primary .xt-don-amt { color: inherit; opacity: 1; }
/* Chosen donation / delivery date: solid purple with white text (was about 3.2:1, now about 5.8:1) */
.xt-page .btn-check:checked + .btn-outline-primary {
  background-color: #4f53e0 !important;
  border-color: #4f53e0 !important;
  color: #fff !important;
}
.xt-page .btn-outline-primary:not(:hover) { color: #4f53e0; border-color: #8f93f5; }

/* ---------- Order summary page (claygate_xmas_trees_summary.php) ---------- */
.xt-readable { color: #3a3d4a; }                 /* about 10:1 on white */
.xt-readable-label { color: #5b5e6c; }           /* about 6.5:1 on white */
.xt-order-table thead th { white-space: nowrap; }
.xt-order-table tbody td { color: #3a3d4a; }
.xt-order-table tfoot th,
.xt-order-table tfoot td { border-top: 2px solid #3a3d4a; font-size: 1.05rem; color: #232530; }
.xt-page dl dd,
.xt-page .form-check-label { color: #3a3d4a; }
.xt-order-table {
  --bs-table-color: #3a3d4a;
  --bs-table-striped-color: #3a3d4a;
  --bs-table-striped-bg: #f1f2f6;
}
.xt-order-table > tbody > tr > td { color: #3a3d4a !important; }

/* ---------- Order confirmed page (claygate_xmastrees_complete.php) ---------- */
.xt-step.is-done { background: #e6f4ea; color: #1f6b37; font-weight: 600; }
.xt-step.is-done span { background: #1f7a3d; color: #fff; }
.xt-dark { color: #232530; }
.xt-tick {
  width: 72px; height: 72px; margin: 0 auto 1rem; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  background: #e6f4ea; color: #1f7a3d; font-size: 2.4rem;
}
.xt-tick-wait { background: #fff4df; color: #8a5300; }
.xt-page .xt-hero-title { font-size: 1.6rem; font-weight: 700; color: #232530; margin-bottom: .5rem; }
.xt-ordno {
  display: inline-block; padding: .5rem 1rem; border-radius: .5rem;
  background: #ecedff; color: #3d41c4; font-weight: 700; font-size: 1.1rem; letter-spacing: .02em;
}
.xt-deliv { display: flex; gap: 1rem; align-items: center; background: #ecedff; border-radius: .5rem; padding: .9rem 1rem; }
.xt-cal { flex: none; width: 58px; text-align: center; background: #fff; border: 1px solid #c9cbf7; border-radius: .4rem; overflow: hidden; }
.xt-cal span { display: block; background: #4f53e0; color: #fff; font-size: .7rem; font-weight: 700; padding: 2px 0; letter-spacing: .05em; }
.xt-cal strong { display: block; font-size: 1.5rem; line-height: 1.6; color: #232530; }
.xt-next li { display: flex; gap: .75rem; padding: .7rem 0; border-bottom: 1px solid #e4e6ea; }
.xt-next li:last-child { border-bottom: 0; }
.xt-next-num {
  flex: none; width: 28px; height: 28px; border-radius: 50%; background: #4f53e0; color: #fff;
  display: inline-flex; align-items: center; justify-content: center; font-weight: 600; font-size: .85rem;
}
@media (max-width: 575.98px) {
  .xt-page .xt-hero-title { font-size: 1.3rem; }
  .xt-btn-full { flex: 1 1 100%; }
}

/* Print / save as PDF */
@media print {
  .xt-page .layout-navbar, .xt-page .layout-menu, .xt-page .content-footer,
  .xt-noprint, .xt-bottom-bar, .xt-steps { display: none !important; }
  .xt-page .card { box-shadow: none !important; border: 1px solid #ccc; break-inside: avoid; }
  .xt-page .container-p-y { padding-top: 0 !important; }
  .xt-page .xt-brand { display: flex !important; }
  .xt-page .col-lg-7, .xt-page .col-lg-5 { flex: 0 0 100%; max-width: 100%; }
  body.xt-page { background: #fff !important; }
}

/* Christmas tree collection section (xmas_trees.php) */
.xt-collection { border-bottom: 0; padding-top: 0; }

/* Tree collection: configurable message and what3words location */
.xt-page .xt-collection-text { color: #1f4f66; }
.xt-page .xt-w3w-prefix { color: #c41a20; font-weight: 700; letter-spacing: -.05em; }
.xt-page .xt-w3w { color: #c41a20; font-weight: 600; }
