/* ============================================================
   MIY Stay Outside — WooCommerce light brand overrides
   STYLING ONLY. No structural / data / hook / layout changes
   (brief section 10). Colours, type, borders, radius and spacing
   only — nothing here removes elements or repositions the flow.
   Navy #15465d / coral #EE7558 / cream #F4EFE7, Inter throughout.
   ============================================================ */

.woocommerce, .woocommerce-page {
  font-family: 'Inter', system-ui, -apple-system, sans-serif;
  color: var(--ink, #15465d);
}

/* ---- Headings / links ---- */
.woocommerce h1, .woocommerce h2, .woocommerce h3,
.woocommerce-page h1, .woocommerce-page h2, .woocommerce-page h3 {
  color: var(--ink-deep, #0E3447);
  letter-spacing: -0.01em;
}
.woocommerce a:not(.button),
.woocommerce-page a:not(.button) { color: var(--coral-deep, #D85F42); }
.woocommerce a:not(.button):hover,
.woocommerce-page a:not(.button):hover { color: var(--coral, #EE7558); }

/* ---- Breadcrumb ---- */
.woocommerce-breadcrumb {
  font-size: 13px;
  color: var(--ink-faint, #7C8995);
}

/* ---- Buttons ---- */
.woocommerce #respond input#submit,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit.alt,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt {
  background: var(--coral, #EE7558);
  color: #fff;
  border: 0;
  border-radius: var(--r-sm, 3px);
  font-weight: 700;
  letter-spacing: 0.01em;
  padding: 0.7em 1.4em;
  transition: background 0.15s ease;
}
.woocommerce #respond input#submit:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.woocommerce input.button.alt:hover {
  background: var(--coral-deep, #D85F42);
  color: #fff;
}
.woocommerce a.button.disabled,
.woocommerce button.button:disabled,
.woocommerce input.button:disabled { opacity: 0.55; }

/* Secondary / outline-ish buttons (e.g. "Continue shopping") */
.woocommerce a.button.wc-backward {
  background: transparent;
  color: var(--ink-deep, #0E3447);
  box-shadow: inset 0 0 0 1px var(--border, #E5DDCD);
}
.woocommerce a.button.wc-backward:hover {
  background: var(--cream, #F4EFE7);
  color: var(--ink-deep, #0E3447);
}

/* ---- Prices ---- */
.woocommerce .price,
.woocommerce span.amount,
.woocommerce .woocommerce-Price-amount { color: var(--ink-deep, #0E3447); font-weight: 700; }
.woocommerce .price del { color: var(--ink-faint, #7C8995); font-weight: 400; }
.woocommerce .price ins { text-decoration: none; }

/* ---- Sale flash ---- */
.woocommerce span.onsale {
  background: var(--ink, #15465d);
  color: #fff;
  border-radius: 999px;
  font-weight: 700;
  font-size: 11px;
  letter-spacing: 0.04em;
  min-height: auto;
  min-width: auto;
  line-height: 1;
  padding: 7px 12px;
}

/* ---- Form fields (white, brand border) ---- */
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce-page form .form-row input.input-text,
.woocommerce-page form .form-row textarea,
.woocommerce .select2-container .select2-selection,
.woocommerce select,
.woocommerce input[type="text"],
.woocommerce input[type="email"],
.woocommerce input[type="tel"],
.woocommerce input[type="password"],
.woocommerce input[type="number"] {
  background: #fff;
  border: 1px solid var(--border, #E5DDCD);
  border-radius: var(--r-sm, 3px);
  color: var(--ink-deep, #0E3447);
  padding: 12px 13px;
  font-family: inherit;
  font-size: 16px;
}
.woocommerce form .form-row input.input-text:focus,
.woocommerce form .form-row textarea:focus,
.woocommerce input:focus,
.woocommerce select:focus {
  outline: none;
  border-color: var(--coral, #EE7558);
  box-shadow: 0 0 0 3px rgba(238, 117, 88, 0.15);
}
.woocommerce form .form-row label { color: var(--ink, #15465d); font-weight: 500; }
.woocommerce .required { color: var(--coral-deep, #D85F42); }

/* ---- Quantity ---- */
.woocommerce .quantity input.qty {
  border: 1px solid var(--border, #E5DDCD);
  border-radius: var(--r-sm, 3px);
  padding: 10px 8px;
  background: #fff;
  color: var(--ink-deep, #0E3447);
}

/* ---- Notices ---- */
.woocommerce-message,
.woocommerce-info,
.woocommerce-error,
.woocommerce-noreviews,
.woocommerce p.no-comments {
  border-top-color: var(--coral, #EE7558);
  background: var(--cream, #F4EFE7);
  border-radius: var(--r-sm, 3px);
  color: var(--ink-deep, #0E3447);
}
.woocommerce-error { border-top-color: var(--coral-deep, #D85F42); }
.woocommerce-message::before,
.woocommerce-info::before { color: var(--coral, #EE7558); }

/* ---- Cart + checkout tables ---- */
.woocommerce table.shop_table {
  border: 1px solid var(--border, #E5DDCD);
  border-radius: var(--r-lg, 6px);
  overflow: hidden;
}
.woocommerce table.shop_table th {
  background: var(--cream, #F4EFE7);
  color: var(--ink-deep, #0E3447);
  font-weight: 700;
}
.woocommerce table.shop_table td,
.woocommerce table.shop_table th { border-top-color: var(--rule, #E2DAC9); }

/* Cart totals + checkout order review boxes */
.woocommerce .cart_totals h2,
.woocommerce-checkout #order_review_heading { color: var(--ink-deep, #0E3447); }
.woocommerce-checkout #payment {
  background: var(--cream, #F4EFE7);
  border-radius: var(--r-lg, 6px);
}
.woocommerce-checkout #payment div.payment_box {
  background: #fff;
  border-radius: var(--r-sm, 3px);
  color: var(--ink, #15465d);
}
.woocommerce-checkout #payment div.payment_box::before { border-bottom-color: #fff; }

/* ---- Coupon ---- */
.woocommerce .cart .coupon .input-text { max-width: 220px; }

/* ---- Star ratings ---- */
.woocommerce .star-rating span::before,
.woocommerce p.stars a::before { color: var(--coral, #EE7558); }

/* ---- Product grid (shop) ---- */
.woocommerce ul.products li.product .woocommerce-loop-product__title {
  color: var(--ink-deep, #0E3447);
  font-weight: 700;
}
.woocommerce ul.products li.product .price { color: var(--ink-deep, #0E3447); }

/* ---- My account nav ---- */
.woocommerce-account .woocommerce-MyAccount-navigation ul {
  border: 1px solid var(--border, #E5DDCD);
  border-radius: var(--r-lg, 6px);
  overflow: hidden;
}
.woocommerce-account .woocommerce-MyAccount-navigation li {
  border-bottom: 1px solid var(--rule, #E2DAC9);
}
.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a {
  color: var(--coral-deep, #D85F42);
  font-weight: 700;
}

/* ---- Pagination ---- */
.woocommerce nav.woocommerce-pagination ul {
  border-color: var(--border, #E5DDCD);
  border-radius: var(--r-sm, 3px);
  overflow: hidden;
}
.woocommerce nav.woocommerce-pagination ul li span.current {
  background: var(--ink, #15465d);
  color: #fff;
}

/* ============================================================
   CHECKOUT  (classic shortcode flow)
   Cream order-review panel, navy headings, coral place-order CTA.
   ============================================================ */
.woocommerce-checkout {
  background: #fff;
}
.woocommerce-checkout .col2-set .col-1,
.woocommerce-checkout .col2-set .col-2 { float: none; width: 100%; }

/* Billing / shipping heading bar */
.woocommerce-checkout h3,
.woocommerce-checkout #order_review_heading {
  font-size: 19px;
  font-weight: 800;
  letter-spacing: -0.01em;
  color: var(--ink-deep, #0E3447);
  padding-bottom: 10px;
  border-bottom: 2px solid var(--coral, #EE7558);
  margin-bottom: 18px;
}

/* Order review table inside the cream payment column reads cleanly */
.woocommerce-checkout #order_review {
  border: 1px solid var(--border, #E5DDCD);
  border-radius: var(--r-lg, 6px);
  padding: 22px;
  background: var(--cream, #F4EFE7);
}
.woocommerce-checkout #order_review table.shop_table {
  border: 0;
  background: transparent;
  border-radius: 0;
  margin: 0 0 6px;
}
.woocommerce-checkout #order_review table.shop_table th,
.woocommerce-checkout #order_review table.shop_table td {
  background: transparent;
  border-top-color: var(--rule, #E2DAC9);
  padding-top: 12px;
  padding-bottom: 12px;
}
.woocommerce-checkout #order_review tr.order-total th,
.woocommerce-checkout #order_review tr.order-total td .amount {
  font-size: 18px;
  color: var(--ink-deep, #0E3447);
}

/* Payment box sits on white inside the cream column */
.woocommerce-checkout #payment {
  background: #fff;
  border: 1px solid var(--border, #E5DDCD);
  border-radius: var(--r-lg, 6px);
  margin-top: 16px;
}
.woocommerce-checkout #payment ul.payment_methods {
  border-bottom-color: var(--rule, #E2DAC9);
}
.woocommerce-checkout #payment ul.payment_methods li label {
  color: var(--ink, #15465d);
  font-weight: 600;
}

/* Big, confident place-order button */
.woocommerce-checkout #payment #place_order,
.woocommerce-checkout #place_order {
  width: 100%;
  display: block;
  font-size: 16px;
  font-weight: 800;
  letter-spacing: 0.01em;
  padding: 15px 20px;
  border-radius: var(--r-sm, 3px);
  background: var(--coral, #EE7558);
  box-shadow: 0 8px 20px -8px rgba(238, 117, 88, 0.55);
}
.woocommerce-checkout #payment #place_order:hover,
.woocommerce-checkout #place_order:hover { background: var(--coral-deep, #D85F42); }

/* "Returning customer? / Have a coupon?" toggles */
.woocommerce-checkout .woocommerce-form-login-toggle .woocommerce-info,
.woocommerce-checkout .woocommerce-form-coupon-toggle .woocommerce-info {
  background: var(--cream, #F4EFE7);
  border-top-color: var(--coral, #EE7558);
}

/* Trust line under the button */
.woocommerce-checkout #payment .place-order .woocommerce-terms-and-conditions-wrapper {
  color: var(--ink-faint, #7C8995);
  font-size: 13px;
}

/* ============================================================
   BLOCKS CHECKOUT  (Gutenberg / WooPayments default)
   ============================================================ */
.wp-block-woocommerce-checkout,
.wc-block-checkout {
  font-family: 'Inter', system-ui, -apple-system, sans-serif;
  color: var(--ink, #15465d);
}
.wc-block-components-title,
.wc-block-checkout__main h2,
.wc-block-components-checkout-step__title {
  color: var(--ink-deep, #0E3447) !important;
  letter-spacing: -0.01em;
}
.wc-block-components-checkout-step__heading-content { color: var(--ink-faint, #7C8995); }

/* Sidebar order summary → cream card */
.wc-block-components-sidebar,
.wc-block-checkout__sidebar > .wc-block-components-panel,
.wc-block-checkout__sidebar {
  background: var(--cream, #F4EFE7);
  border-radius: var(--r-lg, 6px);
}
.wc-block-components-totals-item__value,
.wc-block-components-totals-footer-item .wc-block-components-totals-item__value {
  color: var(--ink-deep, #0E3447);
}

/* Inputs */
.wc-block-components-text-input input,
.wc-block-components-text-input input[type="text"],
.wc-block-components-text-input input[type="email"],
.wc-block-components-text-input input[type="tel"],
.wc-block-components-select .wc-block-components-select__select {
  border: 1px solid var(--border, #E5DDCD) !important;
  border-radius: var(--r-sm, 3px) !important;
  color: var(--ink-deep, #0E3447);
  background: #fff;
}
.wc-block-components-text-input.is-active label,
.wc-block-components-text-input input:focus {
  color: var(--coral-deep, #D85F42);
  border-color: var(--coral, #EE7558) !important;
}

/* Place order button (blocks) */
.wc-block-components-checkout-place-order-button,
.wc-block-checkout__actions_row button.wc-block-components-button {
  background: var(--coral, #EE7558) !important;
  border-radius: var(--r-sm, 3px) !important;
  font-weight: 800 !important;
  box-shadow: 0 8px 20px -8px rgba(238, 117, 88, 0.55);
}
.wc-block-components-checkout-place-order-button:hover,
.wc-block-checkout__actions_row button.wc-block-components-button:hover {
  background: var(--coral-deep, #D85F42) !important;
}

/* ============================================================
   THANK YOU  (order-received)
   ============================================================ */
.woocommerce-order .woocommerce-thankyou-order-received,
.woocommerce-order p.woocommerce-thankyou-order-received {
  font-size: 26px;
  font-weight: 800;
  letter-spacing: -0.02em;
  color: var(--ink-deep, #0E3447);
  background: var(--cream, #F4EFE7);
  border: 1px solid var(--border, #E5DDCD);
  border-left: 4px solid var(--coral, #EE7558);
  border-radius: var(--r-lg, 6px);
  padding: 22px 24px;
  margin-bottom: 26px;
}

/* Order meta strip (number / date / email / total / method) */
.woocommerce-order ul.woocommerce-order-overview,
.woocommerce-order ul.order_details {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  margin: 0 0 30px;
  padding: 0;
  border: 0;
  list-style: none;
}
.woocommerce-order ul.woocommerce-order-overview li,
.woocommerce-order ul.order_details li {
  flex: 1 1 150px;
  border: 1px solid var(--border, #E5DDCD);
  border-radius: var(--r-sm, 3px);
  padding: 12px 14px;
  margin: 0;
  text-transform: none;
  font-size: 12px;
  letter-spacing: 0.03em;
  color: var(--ink-faint, #7C8995);
}
.woocommerce-order ul.woocommerce-order-overview li strong,
.woocommerce-order ul.order_details li strong {
  display: block;
  margin-top: 4px;
  font-size: 17px;
  font-weight: 800;
  letter-spacing: -0.01em;
  color: var(--ink-deep, #0E3447);
}

.woocommerce-order h2.woocommerce-order-details__title,
.woocommerce-order h2.woocommerce-column__title {
  font-size: 18px;
  font-weight: 800;
  color: var(--ink-deep, #0E3447);
  padding-bottom: 8px;
  border-bottom: 2px solid var(--coral, #EE7558);
}
