/* Prosperitet — WooCommerce checkout / cart / account styles.
 * Koristi CSS tokene iz tokens.css. Ne dira layout ni funkcionalnost.
 */

/* ── Pozadina stranice ── */
body.woocommerce-checkout,
body.woocommerce-cart,
body.woocommerce-account { background: var(--c-cream); }

/* ── Naslovi — serif teal ── */
.woocommerce h1, .woocommerce h2, .woocommerce h3,
.woocommerce-checkout h1, .woocommerce-checkout h2, .woocommerce-checkout h3,
.woocommerce-cart h1, .woocommerce-cart h2,
.woocommerce-order-details__title,
.woocommerce-column__title,
.wc-block-components-checkout-step__title,
.wp-block-woocommerce-checkout-order-summary-block h2 {
  font-family: var(--font-serif);
  color: var(--c-teal-dark);
  font-weight: 500;
}
.woocommerce-checkout .entry-title,
.woocommerce-cart .entry-title { text-align: center; }

/* ── Paneli / kartice ── */
.woocommerce-checkout .woocommerce-billing-fields,
.woocommerce-checkout .woocommerce-shipping-fields,
.woocommerce-checkout .woocommerce-additional-fields,
.woocommerce-checkout .woocommerce-checkout-review-order,
.woocommerce-checkout #payment,
.woocommerce-checkout-payment,
.woocommerce-order-details,
.woocommerce-customer-details,
.wc-block-components-panel,
.woocommerce-order-summary,
.wp-block-woocommerce-checkout-order-summary-block,
.wc-block-checkout__sidebar {
  background: var(--c-surface, #fff);
  border: 1px solid var(--c-border-soft);
  border-radius: 16px;
  padding: 22px;
  box-shadow: 0 2px 10px rgba(26,42,46,0.04);
  margin-bottom: 18px;
}

/* ── Polja ── */
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.woocommerce-checkout input[type="text"],
.woocommerce-checkout input[type="email"],
.woocommerce-checkout input[type="tel"],
.woocommerce-checkout input[type="password"],
.woocommerce-checkout select,
.woocommerce-account input[type="text"],
.woocommerce-account input[type="email"],
.woocommerce-account input[type="password"],
.wc-block-components-text-input input,
.wc-block-components-select select {
  background: var(--c-cream);
  border: 1.5px solid var(--c-border-soft);
  border-radius: 10px;
  padding: 11px 14px;
  color: var(--c-text);
  font-family: inherit;
  font-size: 14px;
  width: 100%;
  transition: border-color .15s;
}
.woocommerce form .form-row input.input-text:focus,
.woocommerce-checkout input:focus,
.woocommerce-account input:focus,
.wc-block-components-text-input input:focus { border-color: var(--c-gold); outline: none; }

/* ── Labels ── */
.woocommerce form .form-row label,
.wc-block-components-form label,
.woocommerce-account .form-row label {
  color: var(--c-text-muted);
  font-size: 13px;
  font-weight: 600;
}

/* ── Place Order — gold gumb ── */
#place_order,
.woocommerce #payment #place_order,
.woocommerce-checkout button[type="submit"].button,
.wc-block-components-checkout-place-order-button {
  background: var(--g-gold-btn) !important;
  color: #fff !important;
  border: none !important;
  border-radius: 999px !important;
  padding: 14px 28px !important;
  font-weight: 700 !important;
  font-size: 15px !important;
  text-transform: none !important;
  box-shadow: 0 6px 20px rgba(200,147,42,0.34);
  transition: transform .15s, box-shadow .15s;
  width: 100%;
  cursor: pointer;
}
#place_order:hover,
.wc-block-components-checkout-place-order-button:hover,
.woocommerce-checkout button[type="submit"].button:hover {
  transform: translateY(-1px);
  box-shadow: 0 8px 24px rgba(200,147,42,0.40);
}

/* Sekundarni WC gumbi (Update cart, Apply coupon…) */
.woocommerce .button,
.woocommerce button.button.alt {
  background: var(--c-teal-dark);
  color: #fff;
  border-radius: 999px;
  padding: 10px 22px;
  font-weight: 600;
  border: none;
  cursor: pointer;
  transition: opacity .15s;
}
.woocommerce .button:hover { opacity: 0.88; }

/* ── Order total — serif teal ── */
.woocommerce-checkout .order-total .woocommerce-Price-amount,
.woocommerce-checkout .order-total td,
.wc-block-components-totals-footer-item .wc-block-components-totals-item__value,
.woocommerce-order-details tfoot tr:last-child td {
  color: var(--c-teal-dark);
  font-family: var(--font-serif);
  font-weight: 600;
  font-size: 20px;
}

/* ── Linkovi ── */
.woocommerce-checkout a,
.woocommerce-cart a,
.woocommerce a.showcoupon { color: var(--c-gold); }
.woocommerce-checkout a:hover,
.woocommerce-cart a:hover { color: var(--c-teal-dark); }

/* ── Payment methods ── */
.woocommerce-checkout #payment ul.payment_methods { padding: 0; margin: 0; list-style: none; }
.woocommerce-checkout #payment ul.payment_methods li {
  padding: 16px 18px !important;
  margin-bottom: 10px !important;
  border: 1px solid var(--c-border-soft);
  border-radius: 12px;
  list-style: none;
}
.woocommerce-checkout #payment ul.payment_methods li:has(input:checked) {
  border-color: var(--c-gold);
  background: rgba(200,147,42,0.04);
}
.woocommerce-checkout #payment ul.payment_methods li label {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  font-weight: 600;
  cursor: pointer;
}
.woocommerce-checkout #payment ul.payment_methods li label img { max-height: 24px; width: auto; }
.woocommerce-checkout #payment .payment_box {
  margin-top: 12px;
  padding: 14px;
  background: rgba(0,0,0,0.02);
  border-radius: 10px;
}

/* ── Order summary tablica ── */
.woocommerce-checkout table.shop_table,
.woocommerce-order-details table {
  border-collapse: collapse;
  width: 100%;
}
.woocommerce-checkout .shop_table th,
.woocommerce-checkout .shop_table td {
  padding: 14px 12px !important;
  line-height: 1.5;
  font-size: 14px;
}
.woocommerce-checkout .shop_table tr { border-bottom: 1px solid var(--c-border-soft); }
.woocommerce-checkout .shop_table .cart_item td { padding-top: 16px; padding-bottom: 16px; }
.woocommerce-checkout .order-total th,
.woocommerce-checkout .order-total td { padding-top: 16px !important; padding-bottom: 16px !important; }
.woocommerce-checkout .shop_table .product-name { line-height: 1.6; }
.woocommerce-checkout dl.variation,
.woocommerce-checkout .wc-item-meta { margin: 8px 0 0; line-height: 1.6; }

/* ── WC notices (errors, info) ── */
.woocommerce-error, .woocommerce-message, .woocommerce-info {
  border-radius: 12px;
  padding: 14px 18px;
  margin-bottom: 16px;
  font-size: 14px;
}
.woocommerce-error { background: #fff5f5; border-left: 4px solid #e53e3e; color: #742a2a; }
.woocommerce-message { background: rgba(45,109,114,0.07); border-left: 4px solid var(--c-teal); color: var(--c-teal-dark); }
.woocommerce-info { background: rgba(200,147,42,0.07); border-left: 4px solid var(--c-gold); color: var(--c-brown-gold); }

/* ── My Account tabovi (pr-account.php stilovi) ── */
.woocommerce-MyAccount-navigation ul { list-style: none; padding: 0; margin: 0 0 24px; display: flex; flex-wrap: wrap; gap: 8px; }
.woocommerce-MyAccount-navigation ul li a {
  display: inline-block; padding: 9px 18px; border-radius: 999px;
  border: 1px solid var(--c-border-soft); font-size: 14px; font-weight: 600;
  color: var(--c-text-muted); text-decoration: none; transition: background .15s, color .15s, border-color .15s;
}
.woocommerce-MyAccount-navigation ul li.is-active a,
.woocommerce-MyAccount-navigation ul li a:hover {
  background: rgba(200,147,42,0.08); border-color: var(--c-gold); color: var(--c-teal-dark);
}

/* ── Zrak između sekcija desne kolone ── */
.woocommerce-checkout #order_review > * { margin-bottom: 18px; }
.woocommerce-checkout .woocommerce-checkout-review-order-table { margin-bottom: 24px; }

/* ── Fix: word-break na dugim riječima u pregledu narudžbe ── */
.woocommerce-checkout table.shop_table .product-name,
.woocommerce-order-details .product-name {
  word-break: break-word;
  overflow-wrap: break-word;
}

/* ── Sakrij Express Checkout duplikat iznad forme ── */
.woocommerce-checkout .wc-stripe-express-checkout-element,
.woocommerce-checkout .wc-stripe-product-checkout-container,
.woocommerce-checkout #wc-stripe-express-checkout-element,
.woocommerce-checkout .wc-block-components-express-payment,
.woocommerce-checkout .wc-stripe-express-checkout__title-and-tagline,
.woocommerce-checkout #wc-stripe-express-checkout-element-errors,
.woocommerce-checkout .wcpay-express-checkout-wrapper,
.woocommerce-checkout .wp-ppcp-checkout-container { display: none !important; }

/* ── Sakrij prazne panele ── */
.woocommerce-checkout .woocommerce-shipping-fields:empty,
.woocommerce-checkout .col-2:empty { display: none; }

/* ── Klassičan checkout — 2 kolone (forma lijevo, narudžba desno) ── */
@media (min-width: 769px) {
  .woocommerce-checkout form.checkout { display: flow-root; }
  .woocommerce-checkout #customer_details { float: left; width: 55%; display: block; }
  /* .col-1 (billing) i .col-2 (additional) slažu se vertikalno unutar lijeve kolone */
  .woocommerce-checkout #customer_details .col-1,
  .woocommerce-checkout #customer_details .col-2 { float: none; width: 100%; max-width: 100%; margin: 0 0 18px; }
  .woocommerce-checkout #order_review_heading,
  .woocommerce-checkout #order_review { float: right; width: 42%; }
}

/* ── Responsive ── */
@media (max-width: 768px) {
  .woocommerce-checkout #customer_details,
  .woocommerce-checkout #order_review,
  .woocommerce-checkout #customer_details .col-1,
  .woocommerce-checkout #customer_details .col-2 { float: none; width: 100%; }
}
@media (max-width: 599px) {
  .woocommerce-checkout .woocommerce-billing-fields,
  .woocommerce-checkout .woocommerce-checkout-review-order,
  .woocommerce-checkout #payment { padding: 16px; }
  #place_order { padding: 13px 20px !important; font-size: 14px !important; }
}