/*
  StrategyFive – WooCommerce Overrides (Palette aligned)

  Brand palette (solid colours):
  - Teal (main accent): var(--s5-accent)
  - Fuchsia (secondary accent): #cc0083
  - Off-black: #222222
  - Black: #050505
  - Off-white: #f5f5f5
  - White: #FFFFFF
  - Grey: #cccccc
*/

:root {
  --s5-teal: var(--s5-accent);
  --s5-pink: #cc0083;
  --s5-off-black: #222222;
  --s5-black: #050505;
  --s5-white: #FFFFFF;
  --s5-off-white: #f5f5f5;
  --s5-grey: #cccccc;

  /* Derived (same palette, transparency only) */
  --s5-teal-20: rgba(var(--s5-accent-rgb), 0.2);
  --s5-grey-25: rgba(204, 204, 204, 0.25);
  --s5-black-10: rgba(5, 5, 5, 0.1);
}

/* -------------------------------------------------------------------------- */
/* Base / Typography                                                          */
/* -------------------------------------------------------------------------- */

.woocommerce,
.woocommerce-page {
  color: #FFFFFF;
}

.woocommerce h1,
.woocommerce h2,
.woocommerce h3,
.woocommerce h4,
.woocommerce h5,
.woocommerce h6 {
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  font-weight: 600;
  line-height: 1.2;
  margin-bottom: 1rem;
  color: inherit;
}

.woocommerce p,
.woocommerce li,
.woocommerce label {
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  font-size: 1rem;
  line-height: 1.5;
}

.woocommerce a {
  color: var(--s5-teal);
}

.woocommerce a:hover,
.woocommerce a:focus {
  color: var(--s5-pink);
}

/* Theme list bullets can leak onto WooCommerce lists */
.woocommerce-page ul li:before,
.woocommerce-notices-wrapper ul li:before,
.woocommerce-order ul li:before {
  display: none !important;
}

/* -------------------------------------------------------------------------- */
/* Buttons                                                                    */
/* -------------------------------------------------------------------------- */

.woocommerce #respond input#submit,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce input#submit {
  background: var(--s5-teal) !important;
  border: 1px solid var(--s5-teal) !important;
  color: var(--s5-black) !important;
  font-weight: 700;
  padding: 0.8rem 1.4rem;
  border-radius: 15px;
  text-transform: uppercase;
  transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

.woocommerce #respond input#submit:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce input#submit:hover {
  background: var(--s5-black) !important;
  border-color: var(--s5-black) !important;
  color: var(--s5-teal) !important;
}

.woocommerce #respond input#submit:focus-visible,
.woocommerce a.button:focus-visible,
.woocommerce button.button:focus-visible,
.woocommerce input.button:focus-visible,
.woocommerce input#submit:focus-visible {
  outline: none;
  box-shadow: 0 0 0 3px var(--s5-teal-20);
}

/* -------------------------------------------------------------------------- */
/* Notices                                                                    */
/* -------------------------------------------------------------------------- */

.woocommerce-message,
.woocommerce-error,
.woocommerce-info {
  background: var(--s5-off-white);
  color: var(--s5-off-black);
  padding: 1em;
  margin-bottom: 2em;
  border-radius: 12px;
  border-left: 4px solid var(--s5-teal);
}

.woocommerce-error {
  border-left-color: var(--s5-pink);
}

.woocommerce-message::before,
.woocommerce-error::before,
.woocommerce-info::before {
  display: none;
}

/* -------------------------------------------------------------------------- */
/* Forms / Inputs                                                             */
/* -------------------------------------------------------------------------- */

.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select {
  width: 100%;
  padding: 0.75rem;
  border: 1px solid var(--s5-grey);
  border-radius: 15px;
  font-size: 1rem;
  background: var(--s5-white);
  color: var(--s5-off-black);
}

.woocommerce form .form-row input.input-text:focus,
.woocommerce form .form-row textarea:focus,
.woocommerce form .form-row select:focus {
  outline: none;
  border-color: var(--s5-teal);
  box-shadow: 0 0 0 3px var(--s5-teal-20);
}

.woocommerce form.checkout_coupon,
.woocommerce form.login,
.woocommerce form.register {
  background: var(--s5-white);
  color: var(--s5-off-black);
  border: 1px solid var(--s5-grey);
  border-radius: 12px;
}

.woocommerce form.checkout_coupon *,
.woocommerce form.login *,
.woocommerce form.register * {
  color: inherit;
}

/* -------------------------------------------------------------------------- */
/* Product grid / cards                                                       */
/* -------------------------------------------------------------------------- */

.woocommerce ul.products li.product {
  background: var(--s5-white);
  color: var(--s5-off-black);
  border: 1px solid var(--s5-grey);
  padding: 1rem;
  border-radius: 12px;
  text-align: center;
  transition: box-shadow 0.2s ease;
}

.woocommerce ul.products li.product:hover {
  box-shadow: 0 0 12px var(--s5-black-10);
}

.woocommerce ul.products li.product h2,
.woocommerce ul.products li.product .woocommerce-loop-product__title {
  font-size: 1.2rem;
  margin: 1rem 0 0.5rem;
  color: inherit;
}

.woocommerce ul.products li.product .price,
.woocommerce div.product p.price,
.woocommerce div.product span.price {
  color: inherit;
  font-size: 1.1rem;
  font-weight: 700;
}

/* -------------------------------------------------------------------------- */
/* My Account navigation                                                      */
/* -------------------------------------------------------------------------- */

.woocommerce-MyAccount-navigation ul {
  list-style: none;
  padding: 0;
  margin: 0 0 2rem;
}

.woocommerce-MyAccount-navigation ul li {
  padding-left: 0;
}

.woocommerce-MyAccount-navigation ul li a {
  display: block;
  padding: 0.75rem 1rem;
  border: 1px solid var(--s5-grey);
  margin-bottom: 0.5rem;
  background: var(--s5-white);
  text-decoration: none;
  color: var(--s5-off-black);
  border-radius: 15px;
}

.woocommerce-MyAccount-navigation ul li.is-active a,
.woocommerce-MyAccount-navigation ul li a:hover {
  background: var(--s5-black);
  border-color: var(--s5-black);
  color: var(--s5-white);
}

.woocommerce-MyAccount-content {
  color: inherit;
}

/* -------------------------------------------------------------------------- */
/* Tables                                                                     */
/* -------------------------------------------------------------------------- */

.woocommerce table.shop_table {
  border-collapse: collapse;
  width: 100%;
  margin-bottom: 2rem;
  background: var(--s5-white);
  color: var(--s5-off-black);
  border: 1px solid var(--s5-grey);
  border-radius: 12px;
  overflow: hidden;
}

.woocommerce table.shop_table th,
.woocommerce table.shop_table td {
  padding: 0.75rem;
  border: 1px solid var(--s5-grey);
  text-align: left;
  color: inherit;
}

.woocommerce-cart-form__contents td.product-name a {
  font-weight: 700;
}

.woocommerce-orders-table__cell.woocommerce-orders-table__cell-order-actions a {
  margin-right: 5px;
}

.woocommerce-orders-table__cell.woocommerce-orders-table__cell-order-actions a:last-child {
  margin-right: 0;
}

/* -------------------------------------------------------------------------- */
/* Checkout / Payment                                                         */
/* -------------------------------------------------------------------------- */

#add_payment_method #payment,
.woocommerce-cart #payment,
.woocommerce-checkout #payment {
  background: var(--s5-off-white);
  border-radius: 15px;
  color: var(--s5-off-black);
}

#add_payment_method #payment div.payment_box,
.woocommerce-cart #payment div.payment_box,
.woocommerce-checkout #payment div.payment_box {
  background: var(--s5-white);
  border-radius: 15px;
  border: 1px solid var(--s5-grey);
  color: var(--s5-off-black);
}

#add_payment_method #payment div.payment_box::before,
.woocommerce-cart #payment div.payment_box::before,
.woocommerce-checkout #payment div.payment_box::before {
  border: 1em solid var(--s5-white);
  border-right-color: transparent;
  border-left-color: transparent;
  border-top-color: transparent;
}

/* -------------------------------------------------------------------------- */
/* Plugin-specific tidy-ups (kept from existing theme)                        */
/* -------------------------------------------------------------------------- */

.PickerItem,
.PickerItem:hover,
.AccordionItem {
  background-color: #FFFFFF !important;
}

.wp-block-woocommerce-checkout-actions-block .wc-block-checkout__actions_row .wc-block-components-checkout-place-order-button--full-width,
.wc-block-components-button:not(.is-link) {
  border: none;
  border-radius: 15px;
  background: var(--s5-teal);
  color: var(--s5-black);
  transition: all 0.2s ease;
}

.wp-block-woocommerce-checkout-actions-block .wc-block-checkout__actions_row .wc-block-components-checkout-place-order-button--full-width:hover,
.wc-block-components-button:not(.is-link):hover {
  background: var(--s5-black);
  color: var(--s5-teal);
}

#update_all_subscriptions_billing_contact_field label input,
.woocommerce .woocommerce-form-login .woocommerce-form-login__rememberme input {
  width: auto;
}

/* Keep existing wrapper tweak */
.woocommerce-page .s-blog__post-wrapper {
  background: #FFFFFF;
}