/* TCGR WooCommerce skin — cart, checkout, order received and My Account.
   Loaded only when WooCommerce is active, after the theme and after Woo's own CSS.
   Covers both the block checkout (.wc-block-*) and the classic shortcode templates. */

.woocommerce-page .tcgr-main,
.woocommerce .tcgr-main{
  padding-top:112px;
}

/* ---------- page shell ---------- */
.woocommerce-page .entry-content,
.woocommerce-cart .entry-content,
.woocommerce-checkout .entry-content,
.woocommerce-account .entry-content,
.woocommerce-order-received .entry-content,
.woocommerce-page main .wp-block-group,
.tcgr-page .wp-block-woocommerce-checkout,
.tcgr-page .wp-block-woocommerce-cart,
.tcgr-page .wc-block-checkout,
.tcgr-page .wc-block-cart,
.tcgr-page .woocommerce,
.woocommerce-page .woocommerce{
  width:min(1180px,calc(100% - 48px));
  margin-inline:auto;
  padding-block:56px;
  color:var(--tcgr-white,#f8f4ea);
}

.woocommerce-page h1,.woocommerce-page h2,.woocommerce-page h3,
.wc-block-components-title,.wc-block-components-checkout-step__title{
  font-family:"Playfair Display",Georgia,serif!important;
  color:#fff;
}
.woocommerce-page h1{font-size:clamp(30px,4vw,44px);font-weight:800;margin:0 0 26px}

/* ---------- panels / cards ---------- */
.wc-block-components-sidebar .wc-block-components-order-summary,
.wc-block-components-order-summary,
.wc-block-components-totals-wrapper,
.woocommerce .cart_totals,
.woocommerce-checkout-review-order,
.woocommerce-order,
.woocommerce-MyAccount-content,
.woocommerce-customer-details,
.woocommerce table.shop_table{
  border:1px solid rgba(255,255,255,.12)!important;
  border-radius:18px;
  background:rgba(255,255,255,.03);
  color:var(--tcgr-white,#f8f4ea);
}
.woocommerce table.shop_table{overflow:hidden;border-collapse:separate}
.woocommerce table.shop_table th,.woocommerce table.shop_table td{
  border-color:rgba(255,255,255,.1)!important;
  color:inherit;
}

/* ---------- form fields ---------- */
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.wc-block-components-text-input input,
.wc-block-components-textarea,
.wc-block-components-select__container select,
.wc-block-components-country-input select,
.wc-block-components-state-input select{
  width:100%;
  padding:13px 16px!important;
  border:1px solid rgba(255,255,255,.18)!important;
  border-radius:12px!important;
  background-color:rgba(0,0,0,.45)!important;
  color:#fff!important;
  box-shadow:none!important;
  font:inherit;
}
.wc-block-components-text-input input:focus,
.woocommerce form .form-row input.input-text:focus,
.woocommerce form .form-row textarea:focus,
.woocommerce form .form-row select:focus{
  outline:0;
  border-color:var(--tcgr-gold,#f2b234)!important;
}
.wc-block-components-text-input label,
.wc-block-components-checkout-step__description,
.woocommerce form .form-row label,
.wc-block-components-form label{
  color:rgba(255,255,255,.72)!important;
}
/* Woo floats the label inside the field; keep it readable on a dark input. */
.wc-block-components-text-input.is-active label,
.wc-block-components-text-input input:focus + label{
  color:var(--tcgr-gold,#f2b234)!important;
}
.wc-block-components-checkbox__label,
.woocommerce-terms-and-conditions-wrapper,
.wc-block-components-checkout-policies{color:rgba(255,255,255,.7)}

/* ---------- buttons ---------- */
.woocommerce a.button,.woocommerce button.button,.woocommerce input.button,
.woocommerce a.button.alt,.woocommerce button.button.alt,
.wc-block-components-button:not(.is-link),
.wc-block-cart__submit-button,
.wc-block-components-checkout-place-order-button{
  border:0!important;
  border-radius:999px!important;
  background:var(--tcgr-gold,#f2b234)!important;
  color:#080808!important;
  font:800 12px/1 "Inter",Arial,sans-serif!important;
  letter-spacing:.12em;
  text-transform:uppercase;
  padding:16px 30px!important;
  transition:.2s;
}
.woocommerce a.button:hover,.woocommerce button.button:hover,
.wc-block-components-button:not(.is-link):hover,
.wc-block-components-checkout-place-order-button:hover{filter:brightness(1.08)}
.wc-block-components-button:not(.is-link):disabled{opacity:.5}

/* ---------- order summary ---------- */
.wc-block-components-order-summary-item__image img,
.woocommerce table.shop_table .product-thumbnail img,
.wc-block-cart-item__image img{
  border-radius:10px;
  background:rgba(255,255,255,.05);
  object-fit:contain;
}
.wc-block-components-product-name{color:#fff!important;font-weight:700}
.wc-block-components-formatted-money-amount,.woocommerce-Price-amount{color:var(--tcgr-gold,#f2b234)}
.wc-block-components-totals-item__label{color:rgba(255,255,255,.75)}
.wc-block-components-totals-footer-item .wc-block-components-totals-item__value{
  color:#fff!important;font-family:"Playfair Display",Georgia,serif;font-size:26px;
}
.wc-block-components-product-details__donation-amount,
.wc-block-components-product-metadata{color:rgba(255,255,255,.6)}

/* ---------- notices ---------- */
.woocommerce-message,.woocommerce-info,.woocommerce-error,
.wc-block-components-notice-banner{
  border-radius:14px!important;
  border-width:1px!important;
  background:rgba(255,255,255,.05)!important;
  color:#fff!important;
}
.wc-block-components-notice-banner.is-error,.woocommerce-error{
  border-color:rgba(229,50,62,.55)!important;background:rgba(229,50,62,.14)!important;
}
.wc-block-components-notice-banner.is-success,.woocommerce-message{
  border-color:rgba(120,200,140,.5)!important;background:rgba(60,150,90,.16)!important;
}

/* ---------- my account ---------- */
.woocommerce-MyAccount-navigation ul{list-style:none;margin:0;padding:0}
.woocommerce-MyAccount-navigation li{border-bottom:1px solid rgba(255,255,255,.1)}
.woocommerce-MyAccount-navigation a{display:block;padding:13px 4px;color:rgba(255,255,255,.8)}
.woocommerce-MyAccount-navigation li.is-active a,
.woocommerce-MyAccount-navigation a:hover{color:var(--tcgr-gold,#f2b234)}

@media(max-width:782px){
  .woocommerce-page .entry-content,
  .woocommerce-page .woocommerce{width:min(100%,calc(100% - 32px));padding-block:36px}
  .woocommerce-page .tcgr-main,.woocommerce .tcgr-main{padding-top:65px}
}

/* Native select chrome ignores background colour on macOS/Windows — reset it and
   draw our own chevron so country/state match the other fields. */
.woocommerce select,
.wc-blocks-components-select__select,
.wc-block-components-select__container select,
.woocommerce form .form-row select{
  -webkit-appearance:none!important;
  -moz-appearance:none!important;
  appearance:none!important;
  background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath fill='none' stroke='%23f2b234' stroke-width='2' d='M1 1l5 5 5-5'/%3E%3C/svg%3E")!important;
  background-repeat:no-repeat!important;
  background-position:right 16px center!important;
  background-size:12px 8px!important;
  padding-right:42px!important;
}
.woocommerce select option,.wc-blocks-components-select__select option{background:#111113;color:#fff}
.wc-blocks-components-select__expand,.wc-block-components-combobox .wc-blocks-components-select__expand{display:none}

/* Woo's floating labels sit on top of the value on a dark field; nudge them. */
.wc-blocks-components-select__label,.wc-block-components-text-input label{background:transparent!important}

/* Alignwide inside our page template would break out of the shell. */
.tcgr-page .alignwide,.tcgr-page .alignfull{max-width:100%!important;margin-left:auto;margin-right:auto}

/* Woo wraps its block <select> in a white container; our field is semi-transparent,
   so that white showed through as grey. Neutralise the wrapper and let the select
   itself be the visible field. */
.wc-blocks-components-select,
.wc-blocks-components-select__container,
.wc-block-components-combobox .components-combobox-control,
.wc-block-components-combobox__wrapper{
  background:transparent!important;
  background-color:transparent!important;
  border:0!important;
  border-radius:12px!important;
  box-shadow:none!important;
}
.wc-blocks-components-select__select{background-color:#0d0d10!important}
.wc-blocks-components-select__label,
.wc-block-components-combobox .components-base-control__label{
  color:rgba(255,255,255,.6)!important;
  background:transparent!important;
}
/* The combobox (country/state search field) uses an <input>, not a <select>. */
.wc-block-components-combobox input,
.components-combobox-control__input,
.components-form-token-field__input{
  background-color:#0d0d10!important;
  color:#fff!important;
  border:1px solid rgba(255,255,255,.18)!important;
  border-radius:12px!important;
  padding:13px 16px!important;
}
.components-combobox-control__suggestions,
.components-form-token-field__suggestions-list{
  background:#111113!important;color:#fff!important;
  border:1px solid rgba(255,255,255,.15)!important;border-radius:12px!important;
}
.components-form-token-field__suggestion.is-selected{background:rgba(242,178,52,.2)!important}