/* Additions to the designer's page kit (pages.css) for what WordPress and WooCommerce generate themselves:
   their form rows, notices, pagination, tables and a few helpers. Uses the same tokens as the kit.
   WooCommerce's own stylesheets are not loaded. */

.wrap--read { max-width: 820px; }
.prose h3 { font-size: 1.3rem; margin: 1.4em 0 .5em; }
.prose a:not(.btn) { color: var(--color-link); }
.prose ol { padding-inline-start: 1.3em; margin: 0 0 1.4em; display: grid; gap: 6px; font-size: 1.1rem; }
.hp { position: absolute; inset-inline-start: -9999px; }
.screen-reader-text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.quantity.hidden { display: none; }
.gs-native-select { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.reset_variations { display: none !important; }

/* filter chips and blog category chips are links here */
.chips a { min-height: 44px; border: 0; border-radius: 99px; background: var(--color-primary-100); color: var(--color-primary-800); font-weight: 700; padding: 0 14px 0 10px; display: inline-flex; gap: 8px; align-items: center; text-decoration: none; }
.chips a::after { content: "×"; font-size: 1.3rem; line-height: 1; }
.chips .clr a { background: transparent; text-decoration: underline; text-underline-offset: 6px; color: var(--color-text-muted); }
.chips .clr a::after { content: none; }
.bchips a { min-height: 48px; padding: 0 20px; border-radius: 99px; border: 2px solid var(--color-border); background: var(--color-surface); font-weight: 500; display: inline-flex; align-items: center; text-decoration: none; }
.bchips a[aria-current] { background: var(--color-primary-800); border-color: var(--color-primary-800); color: #fff; font-weight: 800; }
.factions .btn { text-decoration: none; }

/* pagination */
.navigation.pagination { margin-top: clamp(28px, 5vw, 44px); }
.nav-links { display: flex; flex-wrap: wrap; gap: 10px; }
.nav-links .page-numbers { display: inline-flex; align-items: center; justify-content: center; min-width: 48px; min-height: 48px; padding: 0 18px; border-radius: 99px; border: 2px solid var(--color-border); background: var(--color-surface); text-decoration: none; font-weight: 700; }
.nav-links .page-numbers.current { border-color: var(--color-brand); background: var(--color-primary-50); color: var(--color-primary-800); }
.nav-links .dots { border-color: transparent; background: none; }

/* WooCommerce form rows drawn like the kit's .field */
.fgrid .form-row { display: grid; gap: 6px; min-width: 0; margin: 0; padding: 0; }
.fgrid .form-row-wide { grid-column: 1 / -1; }
.fgrid .form-row > label { font-weight: 700; }
.fgrid .form-row .required { color: var(--color-accent-700); text-decoration: none; border: 0; }
.fgrid .form-row .optional { color: var(--color-text-muted); font-weight: 500; }
.fgrid .form-row .woocommerce-input-wrapper, .notes-row .woocommerce-input-wrapper { display: block; }
.fgrid .form-row input:not([type="hidden"], [type="checkbox"], [type="radio"]), .fgrid .form-row select, .fgrid .form-row textarea,
.notes-row input, .notes-row textarea, .woocommerce-ResetPassword input.input-text, .lost_reset_password input.input-text {
  font: inherit; width: 100%; min-height: 52px; padding: 10px 16px; border: 2px solid var(--color-neutral-300); border-radius: 14px; background: #fff; color: var(--color-text);
}
.fgrid .form-row select, .select2-container .select2-selection--single { appearance: none; padding-inline-end: 44px; background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23635e4d' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") no-repeat left 14px center / 20px; }
.fgrid .form-row textarea, .notes-row textarea { min-height: 110px; resize: vertical; }
.fgrid .form-row .select2-container { width: 100% !important; }
.select2-container--default .select2-selection--single { height: 52px; border: 2px solid var(--color-neutral-300); border-radius: 14px; display: flex; align-items: center; }
.select2-container--default .select2-selection--single .select2-selection__rendered { line-height: 1.6; padding-inline: 16px 44px; color: var(--color-text); }
.select2-container--default .select2-selection--single .select2-selection__arrow { display: none; }
.select2-dropdown { border: 2px solid var(--color-neutral-300); border-radius: 14px; overflow: hidden; }
.select2-search--dropdown .select2-search__field { min-height: 44px; border-radius: 10px; padding-inline: 12px; }
.select2-results__option { padding: 10px 16px; }
.fgrid .form-row input:focus, .fgrid .form-row select:focus, .fgrid .form-row textarea:focus, .field input:focus, .field select:focus, .field textarea:focus, .sbig input:focus, .sbar input:focus, .coupon input:focus {
  outline: 3px solid var(--color-primary-800); outline-offset: 2px; border-color: var(--color-brand);
}
.fgrid .form-row.woocommerce-invalid input, .fgrid .form-row.woocommerce-invalid select, .fgrid .form-row.woocommerce-invalid textarea, .field input[aria-invalid="true"] { border-color: var(--color-accent-600); }
.fgrid .form-row.woocommerce-invalid > label { color: var(--color-accent-700); }
input:disabled, select:disabled, textarea:disabled { background: var(--color-neutral-100); color: var(--color-neutral-500); cursor: not-allowed; }
.btn:disabled, .btn[disabled] { opacity: .5; cursor: not-allowed; }
.btn.alt, button.btn { cursor: pointer; }

/* shipping method / payment rows: the kit's .radio card */
.radio .rp .woocommerce-Price-amount { white-space: nowrap; }
.radios .payment_box { background: var(--color-neutral-100); border-radius: 14px; padding: 14px 18px; margin: 0; }
.gs-ship-methods[hidden] { display: none; }
#payment .notice { margin: 0; }

/* price from get_price_html() */
.pprice del { color: var(--color-text-muted); font-weight: 500; font-size: 1.2rem; margin-inline-end: 8px; text-decoration: line-through; }
.pprice ins { text-decoration: none; }
.pprice .woocommerce-Price-currencySymbol, .lp .woocommerce-Price-currencySymbol, .sum dd .woocommerce-Price-currencySymbol, .rp .woocommerce-Price-currencySymbol { font-size: .8em; font-weight: 500; color: var(--color-text-muted); }
.lp, .sum dd, .mini-items > li > span:last-child { font-variant-numeric: tabular-nums; }
.pc .gs-tag del { display: block; font-size: .85rem; line-height: 1.2; color: var(--color-text-muted); font-weight: 500; flex: 0 0 100%; }
.pc .gs-tag { flex-wrap: wrap; min-width: 0; }

/* product page: the buy form */
.pinfo form.cart { display: grid; gap: 20px; }
.pinfo .single_variation_wrap { display: grid; gap: 14px; }
.pinfo .woocommerce-variation-price, .pinfo .woocommerce-variation-description { display: none; }
.pinfo .woocommerce-variation-availability p, .pinfo .stock { margin: 0; font-weight: 700; color: var(--color-warning-700); }
.pinfo .woocommerce-variation-add-to-cart, .pinfo form.cart > .buyrow { display: grid; gap: 12px; }
.gs-qty input.qty { width: 100%; }
.single_add_to_cart_button.disabled, .single_add_to_cart_button:disabled { opacity: .5; cursor: not-allowed; }
.pdetails .fq p, .pdetails .fq ul { color: var(--color-text-muted); }

/* WordPress / WooCommerce notices drawn like the kit's .notice */
.woocommerce-notices-wrapper:empty { display: none; }
.woocommerce-notices-wrapper { display: grid; gap: 12px; margin-bottom: 22px; }
.woocommerce-message, .woocommerce-info, .woocommerce-error { list-style: none; margin: 0; padding: 14px 18px; background: var(--color-primary-50); border: 1px solid var(--color-primary-200); border-radius: 16px; color: var(--color-primary-900); display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; }
.woocommerce-error { background: var(--color-accent-50); border-color: var(--color-accent-200); color: var(--color-accent-800); display: grid; }
.woocommerce-message .button, .woocommerce-info .button { order: 2; margin-inline-start: auto; min-height: 44px; padding: 0 18px; border-radius: 99px; border: 2px solid var(--color-button); color: var(--color-brand); font-weight: 700; text-decoration: none; display: inline-flex; align-items: center; }
.woocommerce-message a:not(.button), .woocommerce-info a:not(.button), .woocommerce-error a { color: inherit; font-weight: 700; }
p.notice { margin: 0; }

/* cart / checkout details the kit does not cover */
.cart_totals .cart-discount dd a { margin-inline-start: 8px; font-size: .9rem; }
.checkout .woocommerce-privacy-policy-text, .checkout .woocommerce-terms-and-conditions-wrapper { color: var(--color-text-muted); font-size: .95rem; }
.checkout .woocommerce-privacy-policy-text p { margin: 0; }
.checkout .form-row.validate-required .woocommerce-terms-and-conditions-checkbox-text { margin-inline-start: 8px; }
.woocommerce-checkout .blockUI.blockOverlay { background: rgba(255, 255, 255, .6) !important; border-radius: var(--r-l); }
.woocommerce-cart-form .blockUI.blockOverlay { background: rgba(255, 255, 255, .6) !important; }

/* tables WooCommerce prints (order received, view order) in the kit's .tbl look */
table.shop_table { width: 100%; border-collapse: collapse; background: var(--color-surface); border-radius: var(--r-m); overflow: hidden; box-shadow: var(--shadow); margin: 0 0 24px; }
table.shop_table th, table.shop_table td { padding: 14px 18px; text-align: start; border-bottom: 1px solid var(--color-border); vertical-align: top; }
table.shop_table thead th { background: var(--color-primary-50); font-weight: 800; }
table.shop_table tr:last-child > * { border-bottom: 0; }
.woocommerce-order, .woocommerce-order-details, .woocommerce-customer-details { display: grid; gap: 20px; }
.woocommerce-order-overview { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (min-width: 900px) { .woocommerce-order-overview { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.woocommerce-order-overview li { background: var(--color-surface); border-radius: var(--r-m); padding: 16px 20px; box-shadow: var(--shadow); color: var(--color-text-muted); }
.woocommerce-order-overview li strong { display: block; color: var(--color-text); font-size: 1.1rem; }
.woocommerce-order h2, .woocommerce-order-details__title, .woocommerce-column__title { font-size: 1.5rem; }
.woocommerce-customer-details address { background: var(--color-surface); border-radius: var(--r-l); padding: 22px; box-shadow: var(--shadow); font-style: normal; line-height: 1.9; }
.woocommerce-MyAccount-content .woocommerce-message { margin-bottom: 20px; }
.lost_reset_password, .woocommerce-ResetPassword { background: var(--color-surface); border-radius: var(--r-l); padding: clamp(20px, 4vw, 36px); box-shadow: var(--shadow); display: grid; gap: 16px; max-width: 520px; }
.lost_reset_password .form-row { display: grid; gap: 6px; margin: 0; }
.lost_reset_password button, .woocommerce-ResetPassword button { min-height: 52px; border-radius: 99px; background: var(--color-button); color: var(--color-on-button); border: 2px solid var(--color-button); font: inherit; font-weight: 800; padding: 0 28px; cursor: pointer; }
.pblock h2 + .card, .pblock h2 + .orders { margin-top: 0; }
.radios .radio > input { display: inline-block !important; }

.sum > .cart_totals { display: grid; gap: 16px; }

/* 1. account: login and register cards keep their own height; the button follows the form */
#login .cols2.eq { align-items: start; }
#login .cols2.eq .card > .btn { margin-top: 0; }

/* 3. sale price: old price small under the new one; price and + button share the card's bottom edge */
.pc-foot { align-items: flex-end; }
.pc .gs-tag { align-items: baseline; }
.pc .gs-tag del { order: 3; flex: 0 0 auto; display: inline; font-size: .85rem; line-height: 1.4; color: var(--color-neutral-700); font-weight: 500; }
.pc .gs-tag small { order: 2; }

/* 4. notices: soft bar with a start accent, space below, no focus ring box */
.woocommerce-message, .woocommerce-info, .woocommerce-error { border: 1px solid var(--color-primary-200); border-inline-start: 4px solid var(--color-brand); margin: 0 0 24px; outline: none; }
.woocommerce-error { border-inline-start-color: var(--color-accent-600); }
.woocommerce-message:focus, .woocommerce-info:focus, .woocommerce-error:focus, .woocommerce-notices-wrapper:focus { outline: none; box-shadow: none; }
.woocommerce-notices-wrapper { margin-bottom: 0; gap: 0; }
.woocommerce-notices-wrapper + * { margin-top: 0; }

/* blog: category chips stay on one row when they fit */
.bchips { gap: 8px; }
.bchips a { min-height: 44px; padding: 0 16px; }

/* privacy / terms: comfortable line length */
.wrap--read .prose p, .wrap--read .prose li { max-width: 62ch; }

/* ---- round 2 ---- */
/* wide tables scroll sideways on phones instead of squeezing */
@media (max-width: 699px) {
  .tbl { min-width: 520px; }
  .tbl th, .tbl td { white-space: nowrap; }
  .tblwrap::after { content: "برای دیدن همهٔ ستون‌ها جدول را بکشید"; display: block; margin-top: 10px; font-size: .88rem; color: var(--color-text-muted); }
}
/* sale price: old price 14px in the muted colour, same line on desktop; on phones a fixed two-line price block so every card's price and + line up */
.pc .gs-tag del { font-size: .9rem; color: var(--color-text-muted); }
.pc .gs-tag { display: inline-flex; align-items: baseline; gap: 8px; flex-wrap: wrap; }
.pc .gs-price { display: inline-flex; align-items: baseline; gap: 5px; white-space: nowrap; }
@media (max-width: 559px) {
  .pc .gs-tag { flex-direction: column-reverse; align-items: flex-start; justify-content: flex-start; gap: 0; min-height: 2.9em; flex-wrap: nowrap; }
  .pc .gs-tag del { order: 0; line-height: 1.3; }
  .pc-foot { align-items: flex-end; }
}
/* notices: 32px before the content */
.woocommerce-notices-wrapper:not(:empty) { margin-bottom: 32px; }
.woocommerce-notices-wrapper .woocommerce-message, .woocommerce-notices-wrapper .woocommerce-info, .woocommerce-notices-wrapper .woocommerce-error { margin-bottom: 0; }
/* legal pages: a comfortable line length */
.wrap--read .prose p, .wrap--read .prose li { max-width: 50ch; }
/* checkout: the summary follows the form on desktop (it is short, so it never needs its own scroll) */
@media (min-width: 960px) { .woocommerce-checkout .cartgrid > .sum { position: sticky; top: calc(var(--hh) + 20px); align-self: start; } }