/**
 * WooCommerce form baseline — shared fallback layer.
 *
 * WHY THIS EXISTS
 * The theme styles form fields through `.form-control` / `.form-select`,
 * which inc/woocommerce.php attaches via the `woocommerce_form_field_args`
 * filter. That filter only reaches fields rendered by woocommerce_form_field()
 * — i.e. checkout, my-account and address forms.
 *
 * Templates that hardcode WooCommerce's own markup never pass through it. They
 * ship `class="input-text"`, a bare `<select>`, and `<button class="button">`.
 * With woocommerce-general.css dequeued (inc/woocommerce.php) nothing styled
 * those at all, so they fell back to browser defaults — which is what the
 * cart's shipping calculator looked like.
 *
 * Rather than restyle each such form as it surfaces, this file gives WC's own
 * class vocabulary the theme's look once. Anything a future setting switches
 * on — order tracking, address book, a coupon box on a new screen — inherits
 * it without new CSS.
 *
 * ---------------------------------------------------------------------------
 * HOW IT STAYS OUT OF THE WAY — read before adding a rule here
 *
 * This layer must never change a form that already looks right. Two mechanisms
 * enforce that, and both are needed:
 *
 * 1. `:where()` scoping. The page scope contributes ZERO specificity, so these
 *    rules sit at one or two classes at most. Every page sheet (cart.css,
 *    checkout.css, my-account.css) is enqueued AFTER this file, so at equal
 *    specificity they win on source order, and their `.woocommerce-checkout …`
 *    /`.myaccount-… ` selectors usually outrank these outright.
 *
 * 2. Stand-down guards. Fields the theme's own system has claimed carry
 *    `.form-control` / `.form-select` (added by the filter above) and are
 *    excluded with `:not()`. Those elements get Bootstrap's `.form-control`
 *    chrome at a LOWER specificity than a plain `.woocommerce .input-text`
 *    would be, so without the guard this layer would silently restyle every
 *    checkout and account field. Theme buttons carry `.btn` and are excluded
 *    the same way.
 *
 * Put another way: a rule here only ever paints an element that nothing else
 * in the theme paints. If you need to beat an existing rule, do it in that
 * page's own sheet, not here.
 * ---------------------------------------------------------------------------
 *
 * Deliberately NOT handled here: checkbox labels. They vary per context (the
 * uppercase field-label treatment is wrong for them) and the pages that have
 * them already solve it locally — see checkout.css. Left alone rather than
 * risk changing rows that currently look right.
 *
 * Loaded on WC pages only, from inc/enqueue.php.
 */

/* =========================================================================
   Rows + labels
   ========================================================================= */

/* (0,1,0) — under every existing `.form-row` rule, which are all two classes
   or more, but still above element-level margins from reset/bootstrap. */
:where(.woocommerce) .form-row {
	display: block;
	margin: 0 0 16px;
	/* Containers like the cart-totals cell right-align their contents; a form
	   dropped inside one must not inherit that. */
	text-align: left;
}

/* (0,0,1) — deliberately the weakest possible label rule. checkout.css,
   my-account.css and bootstrap's own `label` all outrank or outlast it, so it
   only dresses labels nothing else has touched. */
:where(.woocommerce .form-row) label {
	display: block;
	margin-bottom: 6px;
	font-size: 12px;
	font-weight: 500;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var(--text-secondary, #808080);
}

:where(.woocommerce .form-row) .required {
	color: var(--text-primary, #232323);
	text-decoration: none;
}

:where(.woocommerce .form-row) .optional {
	color: var(--text-muted-aaaaaa, #aaa);
	font-weight: 400;
	font-size: 11px;
	text-transform: none;
	letter-spacing: normal;
}

/* =========================================================================
   Fields — WC's own `.input-text`, plus bare select / textarea
   ========================================================================= */
/* The `:not()` guards are load-bearing. A field rendered through
   woocommerce_form_field() carries BOTH `input-text` and `form-control`; its
   chrome comes from bootstrap's `.form-control` at (0,1,0). Without the guard
   these rules would match those fields at higher specificity and override
   padding, border and font-size across checkout and my-account. With it, they
   match only the hardcoded-markup fields that have no styling at all. */

:where(.woocommerce) .input-text:not(.form-control),
:where(.woocommerce) .form-row select:not(.form-select):not(.form-control),
:where(.woocommerce) .form-row textarea:not(.form-control) {
	width: 100%;
	min-height: 44px;
	padding: 10px 12px;
	border: 1px solid var(--border-color-2, #e5e5e5);
	border-radius: 0;
	background: #fff;
	font-size: 14px;
	color: var(--text-primary, #232323);
	transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

:where(.woocommerce) .input-text:not(.form-control):focus,
:where(.woocommerce) .form-row select:not(.form-select):not(.form-control):focus,
:where(.woocommerce) .form-row textarea:not(.form-control):focus {
	border-color: var(--text-primary, #232323);
	outline: 0;
	box-shadow: 0 0 0 3px rgba(35, 35, 35, 0.06);
}

:where(.woocommerce) .form-row textarea:not(.form-control) {
	min-height: 100px;
	resize: vertical;
}

/* select2 — WC swaps country/state selects for these. Match the field height
   so an enhanced select doesn't sit a few pixels off its neighbours.
   checkout.css and my-account.css carry the same three rules scoped to their
   own pages and load later, so they keep control there. */
:where(.woocommerce) .select2-container .select2-selection--single {
	height: 44px;
	border: 1px solid var(--border-color-2, #e5e5e5);
	border-radius: 0;
}

:where(.woocommerce) .select2-container--default .select2-selection--single .select2-selection__rendered {
	line-height: 44px;
	padding-left: 12px;
	color: var(--text-primary, #232323);
}

:where(.woocommerce) .select2-container--default .select2-selection--single .select2-selection__arrow {
	height: 42px;
}

/* =========================================================================
   Buttons — WC's generic `.button`
   ========================================================================= */
/* woocommerce-general.css carried the skin for this class and is dequeued, so
   unstyled WC buttons render as browser default. Match .btn-black from
   form-control.css.
   `:not(.btn)` steps aside for every button the theme renders itself (the
   my-account and cart templates all use `.btn .btn-black` / `.btn-outline-white`),
   leaving only core-rendered submits. Of those, checkout's login submit and
   coupon button are already styled in checkout.css at equal or higher
   specificity and load later, so this reaches the genuinely unstyled ones —
   today, the shipping calculator's Update. */

:where(.woocommerce form) .button:not(.btn) {
	display: inline-block;
	min-height: 44px;
	padding: 0 26px;
	background: var(--text-primary, #232323);
	color: #fff;
	border: 2px solid var(--text-primary, #232323);
	border-radius: 0;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	text-decoration: none;
	cursor: pointer;
	transition: background-color 0.2s ease, color 0.2s ease;
}

:where(.woocommerce form) .button:not(.btn):hover,
:where(.woocommerce form) .button:not(.btn):focus {
	background: transparent;
	color: var(--text-primary, #232323);
	outline: 0;
}

/* =========================================================================
   Shipping calculator (cart totals)
   ========================================================================= */
/* The one form this layer was written against. It sits inside the totals
   cell, which is `text-align: right` (cart.css) — reset that for the whole
   block so the Update button's wrapper <p> follows too, not just the rows. */

.woocommerce-shipping-calculator {
	text-align: left;
	margin-top: 10px;
}

/* The toggle is a bare <a> in WC's markup, so with no skin it renders as a
   default blue browser link. Match the theme's quiet-link treatment — the same
   dark/underline/gold-hover pattern used for the checkout banner and lost
   password links. */
.woocommerce-shipping-calculator .shipping-calculator-button {
	display: inline-block;
	font-size: 13px;
	font-weight: 500;
	color: var(--text-primary, #232323);
	text-decoration: underline;
	text-underline-offset: 2px;
	transition: color 0.2s ease;
}

.woocommerce-shipping-calculator .shipping-calculator-button:hover,
.woocommerce-shipping-calculator .shipping-calculator-button:focus {
	color: var(--gold-color, #c7a267);
}

/* Gap between the toggle and the fields. Sits on the panel rather than the
   link so it only takes effect once the panel is open — the panel carries an
   inline `display:none` until WC's slideToggle reveals it. */
.woocommerce-shipping-calculator .shipping-calculator-form {
	margin-top: 14px;
}

.woocommerce-shipping-calculator p:last-child {
	margin-bottom: 0;
}
