/* Advance KSA: WooCommerce pages (product, checkout, thank-you, account). Loaded only on store pages,
   after WooCommerce's own CSS (its RTL files load automatically). Classes prefixed advance- come from W-WOO.
   2.1.2: the checkout in the 2.1 language (stage navy, brass, Alexandria, round-2 pictures), drawn by inc/checkout.php
   around W-WOO's checkout; the Paymob box itself is only framed. */

.woocommerce, .woocommerce-page { color: var(--ink); }
.woocommerce .inside-article, .woocommerce-page .inside-article { padding: clamp(20px, 3vw, 40px); border: 1px solid var(--line); border-radius: var(--r-l); }
/* 2.2.30 (tester F29): while the page is full width (phones, tablets) the bordered card keeps the side gutter of the
   header instead of touching both screen edges. The checkout form has no card (.adv-co below). */
@media (max-width: 1231px) { body.woocommerce-page:not(.adv-co) .inside-article { margin-inline: var(--gutter); } }
.woocommerce-page .entry-title { font-size: var(--fs-xl); }

/* Buttons: one orange action per screen (it pays), the rest navy. */
.woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .woocommerce #respond input#submit,
.woocommerce a.button.alt, .woocommerce button.button.alt {
	min-height: 48px; padding: .6em 1.3em; border: 0; border-radius: var(--r-m);
	background: var(--navy); color: var(--white);
	font-family: var(--font-body); font-weight: 600; font-size: var(--fs-base); line-height: 1.3;
}
.woocommerce a.button:hover, .woocommerce button.button:hover { background: var(--navy-2); color: var(--white); }
.woocommerce button.single_add_to_cart_button.button, .woocommerce #place_order, .woocommerce a.checkout-button.button {
	min-height: 56px; background: var(--orange); color: var(--navy); font-size: var(--fs-md);
}
.woocommerce button.single_add_to_cart_button.button:hover, .woocommerce #place_order:hover { background: var(--orange-deep); color: var(--navy); }
.woocommerce button.button:disabled, .woocommerce button.button.disabled { opacity: .55; }

/* Prices: the amount in the heading font, «ريال» after it (W-WOO sets the symbol). */
.woocommerce .price, .woocommerce div.product p.price, .woocommerce div.product span.price { color: var(--ink); font-family: var(--font-head); font-weight: 700; }
.woocommerce div.product p.price { margin: var(--s-2) 0 var(--s-4); font-size: clamp(2rem, 1.6rem + 1.5vw, 2.75rem); }
.woocommerce .price ins { text-decoration: none; }
.woocommerce-Price-currencySymbol { margin-inline-start: .25em; font-size: .6em; font-weight: 600; color: var(--ink-2); }

/* Product page */
.woocommerce div.product .product_title { font-size: var(--fs-xl); margin-bottom: var(--s-2); }
.woocommerce div.product .woocommerce-product-details__short-description { color: var(--ink-2); font-size: var(--fs-md); }
.woocommerce div.product form.cart { margin: var(--s-5) 0 var(--s-3); }
.woocommerce div.product form.cart .button { width: 100%; }
.woocommerce div.product form.cart .quantity { display: none; }
.woocommerce div.product form.cart table.variations { margin-bottom: var(--s-3); }
.woocommerce div.product form.cart table.variations th, .woocommerce div.product form.cart table.variations td { display: block; padding: 0 0 var(--s-2); text-align: start; }
.woocommerce div.product .woocommerce-product-gallery img { border-radius: var(--r-l); }
.woocommerce div.product .woocommerce-tabs ul.tabs { padding: 0; }
.woocommerce div.product .woocommerce-tabs ul.tabs li { border-color: var(--line); background: var(--paper); border-radius: var(--r-s) var(--r-s) 0 0; }
.woocommerce div.product .woocommerce-tabs ul.tabs li.active { background: var(--white); }
.woocommerce div.product .woocommerce-tabs ul.tabs li::before, .woocommerce div.product .woocommerce-tabs ul.tabs li::after { display: none; }
.woocommerce div.product .woocommerce-tabs .panel { font-size: var(--fs-base); }
.adv-product-trust { display: grid; gap: var(--s-2); margin: var(--s-4) 0 0; padding: var(--s-4); border-radius: var(--r-m); background: var(--paper); list-style: none; font-size: var(--fs-sm); }
.adv-product-trust li { display: flex; align-items: center; gap: 10px; }
.adv-product-trust .icon { width: 22px; height: 22px; color: var(--bronze); }
@media (min-width: 900px) {
	.woocommerce div.product div.images { width: 44%; }
	.woocommerce div.product div.summary { width: 52%; }
}

/* Forms */
.woocommerce form .form-row { margin-bottom: var(--s-4); padding: 0; }
.woocommerce form .form-row label { margin-bottom: 6px; color: var(--navy); font-weight: 600; font-size: var(--fs-sm); line-height: 1.6; }
.woocommerce form .form-row .input-text, .woocommerce form .form-row select, .woocommerce .select2-container .select2-selection {
	min-height: 52px; padding: 12px 16px; border: 1.5px solid var(--line); border-radius: var(--r-m); background: var(--white);
	color: var(--ink); font: inherit; font-size: var(--fs-base);
}
.woocommerce .select2-container .select2-selection--single { height: 52px; }
.woocommerce .select2-container .select2-selection--single .select2-selection__rendered { line-height: 26px; padding: 0; }
.woocommerce .select2-container .select2-selection--single .select2-selection__arrow { top: 12px; }
.woocommerce form .form-row .input-text:focus, .woocommerce form .form-row select:focus { border-color: var(--navy); outline: 3px solid rgb(217 190 140 / .55); outline-offset: 1px; }
.woocommerce form .form-row.woocommerce-invalid .input-text { border-color: var(--fail); }
.woocommerce form .form-row .description { display: block; margin-top: 6px; color: var(--stone); font-size: var(--fs-xs); line-height: 1.6; }
.woocommerce form .form-row .required { color: var(--fail); text-decoration: none; }
.woocommerce form .form-row .optional { color: var(--stone); font-weight: 400; }
.woocommerce form .form-row input[type="checkbox"] { width: 20px; height: 20px; margin-inline-end: 8px; vertical-align: middle; accent-color: var(--navy); }
.woocommerce form .form-row input[dir="ltr"] { text-align: left; }
.woocommerce-checkout .col2-set .col-1, .woocommerce-checkout .col2-set .col-2 { float: none; width: 100%; }
.woocommerce-checkout h3 { font-size: var(--fs-lg); }
.woocommerce table.shop_table { border: 1px solid var(--line); border-radius: var(--r-m); border-collapse: separate; overflow: hidden; }
.woocommerce table.shop_table th, .woocommerce table.shop_table td { padding: 12px 16px; border-color: var(--line); text-align: start; }
.woocommerce table.shop_table tfoot .order-total th, .woocommerce table.shop_table tfoot .order-total td { color: var(--navy); font-family: var(--font-head); font-size: var(--fs-md); }
.woocommerce table.shop_table .advance-fee-note td { color: var(--ink-2); font-size: var(--fs-xs); line-height: 1.7; }

/* The checkout form (body.adv-co) is styled in checkout.css since 2.2.46 (the simplified checkout). */

/* Notices */
.woocommerce-message, .woocommerce-info, .woocommerce-error, .woocommerce-noreviews { border-top: 0; border-inline-start: 4px solid var(--brass); border-radius: var(--r-m); background: var(--paper); color: var(--ink); font-size: var(--fs-sm); }
.woocommerce-error { border-inline-start-color: var(--fail); }
.woocommerce-message::before, .woocommerce-info::before, .woocommerce-error::before { color: var(--bronze); }

/* Thank-you page and account */
.woocommerce-order .woocommerce-thankyou-order-received { font-family: var(--font-head); font-weight: 700; font-size: var(--fs-xl); line-height: 1.6; }
.woocommerce ul.order_details { display: flex; flex-wrap: wrap; gap: var(--s-3); margin: var(--s-4) 0; padding: 0; }
.woocommerce ul.order_details li { float: none; margin: 0; padding: var(--s-3) var(--s-4); border: 1px solid var(--line); border-radius: var(--r-m); font-size: var(--fs-xs); }
.woocommerce ul.order_details li strong { font-size: var(--fs-sm); }
.advance-after-purchase { display: grid; gap: var(--s-3); margin: var(--s-5) 0; }
.advance-after-purchase > * { margin: 0; padding: var(--s-4) var(--s-5); border-radius: var(--r-m); background: var(--paper); }
.advance-start-reading, .advance-book-call { border: 1px solid var(--navy); background: var(--white); }
.advance-booking-pending, .advance-upgrade-note, .advance-first96-state { color: var(--ink-2); font-size: var(--fs-sm); }
.woocommerce-account .woocommerce-MyAccount-navigation ul { margin: 0; padding: 0; list-style: none; }
.woocommerce-account .woocommerce-MyAccount-navigation a { display: block; padding: 10px 14px; border-radius: var(--r-s); color: var(--ink); font-weight: 600; text-decoration: none; }
.woocommerce-account .woocommerce-MyAccount-navigation .is-active a { background: var(--paper-2); color: var(--navy); }
.woocommerce-checkout #payment { border-radius: var(--r-m); }
/* 2.2.6: the login and coupon forms beside the floated summary keep their WooCommerce div.clear inside the form: their own
   formatting context (contain: layout, because WooCommerce reveals them with an inline display: block). */
.woocommerce-checkout form.woocommerce-form-login, .woocommerce-checkout form.checkout_coupon { display: flow-root; contain: layout; }

/* 2.2.23: the receipt part of the order page (inc/woocommerce.php advance_receipt_block): the seller and the cancellation
   and refund summary under WooCommerce's order table. */
.adv-receipt { margin: var(--s-5) 0; padding: var(--s-4) var(--s-5); border: 1px solid var(--line); border-radius: var(--r-l); background: var(--white); line-height: 1.85; }
.adv-receipt p { margin: 0 0 var(--s-3); }
.adv-receipt p:last-child { margin-bottom: 0; }