/**
 * FirstCall — WooCommerce page styling
 *
 * The marketing pages are standalone documents with their own inline CSS, so
 * WooCommerce's pages (cart / checkout / my-account) previously rendered with
 * WooCommerce defaults only. These rules give them the brand's typography,
 * palette, and button treatment so the purchase flow matches the rest of the
 * site.
 *
 * Palette mirrors the marketing templates:
 *   navy #0b2240 · teal #0d9488 · greys #f8fafc / #e2e8f0 / #64748b
 */

:root {
  --fc-navy: #0b2240;
  --fc-navy-700: #143a63;
  --fc-teal: #0d9488;
  --fc-g50: #f8fafc;
  --fc-g100: #eef2f7;
  --fc-g200: #e2e8f0;
  --fc-g500: #64748b;
  --fc-radius: 8px;
}

/* ---------- Layout + type ---------- */

.woocommerce,
.woocommerce-page {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
  color: var(--fc-navy);
}

.woocommerce-page .entry-content,
.woocommerce .woocommerce-checkout,
.woocommerce .woocommerce-cart-form,
.woocommerce-account .woocommerce {
  max-width: 1180px;
  margin-left: auto;
  margin-right: auto;
  padding: 0 20px;
}

.woocommerce h1,
.woocommerce h2,
.woocommerce h3,
.woocommerce-page h1,
.woocommerce-page h2,
.woocommerce-page h3 {
  font-family: 'Plus Jakarta Sans', 'Inter', sans-serif;
  color: var(--fc-navy);
  font-weight: 700;
  line-height: 1.2;
}

.woocommerce h3#order_review_heading,
.woocommerce-billing-fields h3,
.woocommerce-shipping-fields h3,
.woocommerce-additional-fields h3 {
  font-size: 1.35rem;
  margin: 0 0 18px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--fc-g200);
}

/* ---------- Form fields ---------- */

.woocommerce form .form-row label {
  font-size: .88rem;
  font-weight: 600;
  color: var(--fc-navy);
  margin-bottom: 6px;
}

.woocommerce form .form-row .required { color: #dc2626; }

.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.woocommerce .select2-container .select2-selection--single {
  width: 100%;
  min-height: 46px;
  padding: 11px 14px;
  border: 1px solid var(--fc-g200);
  border-radius: 6px;
  font-size: .95rem;
  font-family: inherit;
  color: var(--fc-navy);
  background: #fff;
  box-shadow: none;
  transition: border-color .18s ease, box-shadow .18s ease;
}

.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(--fc-teal);
  box-shadow: 0 0 0 3px rgba(13, 148, 136, .14);
}

.woocommerce form .form-row textarea { min-height: 110px; resize: vertical; }

/* WooCommerce marks valid fields with a green border by default; soften it. */
.woocommerce form .form-row.woocommerce-validated input.input-text {
  border-color: var(--fc-g200);
}
.woocommerce form .form-row.woocommerce-invalid input.input-text {
  border-color: #dc2626;
}

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

.woocommerce #payment #place_order,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce a.button.alt,
.woocommerce button.button.alt {
  background: var(--fc-navy);
  color: #fff;
  font-family: inherit;
  font-weight: 600;
  font-size: 1rem;
  padding: 14px 30px;
  border: none;
  border-radius: var(--fc-radius);
  line-height: 1.3;
  transition: background .18s ease, opacity .18s ease;
  text-shadow: none;
}

.woocommerce #payment #place_order:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover {
  background: var(--fc-navy-700);
  color: #fff;
}

.woocommerce #payment #place_order[disabled],
.woocommerce button.button[disabled] {
  opacity: .45;
  cursor: not-allowed;
  background: var(--fc-g500);
}

/* ---------- Order review + cart tables ---------- */

.woocommerce table.shop_table {
  border: 1px solid var(--fc-g200);
  border-radius: var(--fc-radius);
  border-collapse: separate;
  border-spacing: 0;
  overflow: hidden;
}

.woocommerce table.shop_table th {
  background: var(--fc-g50);
  font-family: 'Plus Jakarta Sans', 'Inter', sans-serif;
  font-weight: 700;
  color: var(--fc-navy);
  padding: 14px 16px;
  font-size: .9rem;
}

.woocommerce table.shop_table td {
  padding: 14px 16px;
  border-top: 1px solid var(--fc-g100);
  font-size: .95rem;
}

.woocommerce table.shop_table tfoot th,
.woocommerce table.shop_table tfoot td { font-weight: 700; }

#order_review,
.woocommerce-checkout #payment {
  background: #fff;
  border: 1px solid var(--fc-g200);
  border-radius: var(--fc-radius);
}

.woocommerce-checkout #payment { padding: 6px 0 0; }
.woocommerce-checkout #payment ul.payment_methods { border-bottom: 1px solid var(--fc-g200); }
.woocommerce-checkout #payment div.form-row { padding: 18px; }
.woocommerce-checkout #payment div.payment_box { background: var(--fc-g50); border-radius: 6px; }
.woocommerce-checkout #payment div.payment_box::before { border-bottom-color: var(--fc-g50); }

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

.woocommerce-message,
.woocommerce-info,
.woocommerce-error {
  border-top: none;
  border-left: 4px solid var(--fc-teal);
  border-radius: 6px;
  background: var(--fc-g50);
  color: var(--fc-navy);
  font-size: .95rem;
  padding: 16px 18px 16px 20px;
}

.woocommerce-error { border-left-color: #dc2626; background: #fef2f2; color: #7f1d1d; }
.woocommerce-message::before,
.woocommerce-info::before,
.woocommerce-error::before { display: none; }

/* ---------- Coupon toggle ---------- */

.woocommerce-form-coupon-toggle .woocommerce-info { background: var(--fc-g50); }

/* ---------- My account ---------- */

.woocommerce-account .woocommerce-MyAccount-navigation ul {
  list-style: none;
  margin: 0;
  padding: 0;
  border: 1px solid var(--fc-g200);
  border-radius: var(--fc-radius);
  overflow: hidden;
}
.woocommerce-account .woocommerce-MyAccount-navigation li { border-bottom: 1px solid var(--fc-g100); }
.woocommerce-account .woocommerce-MyAccount-navigation li:last-child { border-bottom: none; }
.woocommerce-account .woocommerce-MyAccount-navigation li a {
  display: block;
  padding: 13px 18px;
  color: var(--fc-navy);
  text-decoration: none;
  font-weight: 600;
  font-size: .93rem;
}
.woocommerce-account .woocommerce-MyAccount-navigation li a:hover,
.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a {
  background: var(--fc-g50);
  color: var(--fc-teal);
}

/* ---------- Responsive ---------- */

@media (max-width: 768px) {
  .woocommerce .col2-set .col-1,
  .woocommerce .col2-set .col-2 { float: none; width: 100%; }
  .woocommerce table.shop_table th,
  .woocommerce table.shop_table td { padding: 11px 12px; }
  .woocommerce #payment #place_order { width: 100%; }
}
