/*
 * Precious Metals Plugin - Checkout & Account Dark Theme
 *
 * Uses --wp--preset--color--* CSS variables so style variations
 * (Dark Luxe, Classic Silver) auto-apply.
 *
 * Sections:
 *   A. WooCommerce Blocks Checkout overrides
 *   B. My Account overrides
 *   C. ACH payment component classes (used by pm-blocks-checkout.js)
 */

/* =============================================
   A. WooCommerce Blocks Checkout Overrides
   ============================================= */

/* Checkout page body background */
.woocommerce-checkout .wp-block-woocommerce-checkout {
    color: var(--wp--preset--color--contrast);
}

/* Checkout step sections (contact, shipping, billing) */
.wc-block-components-checkout-step {
    border-bottom: 1px solid var(--wp--preset--color--border) !important;
}

/* Main checkout form area */
.wp-block-woocommerce-checkout-fields-block,
.wc-block-checkout__form {
    background: transparent;
}

/* Text inputs, selects, and textareas */
.wc-block-components-text-input input,
.wc-block-components-text-input textarea,
.wc-block-components-select .wc-block-components-select__container select,
.wc-block-components-combobox .components-combobox-control input,
.wc-block-checkout input[type="text"],
.wc-block-checkout input[type="email"],
.wc-block-checkout input[type="tel"],
.wc-block-checkout input[type="number"],
.wc-block-checkout select,
.wc-block-checkout textarea {
    background-color: var(--wp--preset--color--surface-alt) !important;
    border: 1px solid var(--wp--preset--color--border) !important;
    color: var(--wp--preset--color--contrast) !important;
    border-radius: 4px;
}

.wc-block-components-text-input input:focus,
.wc-block-components-text-input textarea:focus,
.wc-block-components-select .wc-block-components-select__container select:focus,
.wc-block-components-combobox .components-combobox-control input:focus,
.wc-block-checkout input:focus,
.wc-block-checkout select:focus,
.wc-block-checkout textarea:focus {
    border-color: var(--wp--preset--color--accent) !important;
    box-shadow: 0 0 0 1px var(--wp--preset--color--accent) !important;
    outline: none !important;
}

/* Input labels */
.wc-block-components-text-input label,
.wc-block-components-combobox label {
    color: var(--wp--preset--color--muted) !important;
}

.wc-block-components-text-input.is-active label,
.wc-block-components-combobox.is-active label {
    color: var(--wp--preset--color--accent) !important;
}

/* Checkout step headings */
.wc-block-components-checkout-step__heading {
    color: var(--wp--preset--color--contrast) !important;
}

.wc-block-components-checkout-step__title {
    color: var(--wp--preset--color--contrast) !important;
}

.wc-block-components-checkout-step__description {
    color: var(--wp--preset--color--muted) !important;
}

/* Order summary sidebar */
.wp-block-woocommerce-checkout-order-summary-block,
.wc-block-components-order-summary {
    background: var(--wp--preset--color--surface) !important;
    border: 1px solid var(--wp--preset--color--border) !important;
    border-radius: 6px;
    padding: 16px;
}

/* Order summary items */
.wc-block-components-order-summary-item__description {
    color: var(--wp--preset--color--contrast) !important;
}

.wc-block-components-order-summary-item__individual-prices,
.wc-block-components-order-summary-item__total-price {
    color: var(--wp--preset--color--accent) !important;
}

/* Order summary product images */
.wc-block-components-order-summary-item__image {
    border: 1px solid var(--wp--preset--color--border);
    border-radius: 4px;
}

/* Totals and prices */
.wc-block-components-totals-wrapper {
    border-top: 1px solid var(--wp--preset--color--border) !important;
}

.wc-block-components-totals-item__label {
    color: var(--wp--preset--color--contrast) !important;
}

.wc-block-components-totals-item__value {
    color: var(--wp--preset--color--accent) !important;
}

.wc-block-components-totals-footer-item .wc-block-components-totals-item__label,
.wc-block-components-totals-footer-item .wc-block-components-totals-item__value {
    color: var(--wp--preset--color--accent) !important;
    font-weight: 700;
}

/* Place Order button */
.wc-block-components-checkout-place-order-button,
.wp-block-woocommerce-checkout-actions-block .wc-block-components-button {
    background-color: var(--wp--preset--color--accent) !important;
    color: var(--wp--preset--color--base) !important;
    border: none !important;
    text-transform: uppercase;
    font-weight: 700;
    letter-spacing: 0.5px;
    border-radius: 4px;
    transition: background-color 0.2s ease;
}

.wc-block-components-checkout-place-order-button:hover,
.wp-block-woocommerce-checkout-actions-block .wc-block-components-button:hover {
    background-color: var(--wp--preset--color--accent-dark) !important;
    color: var(--wp--preset--color--base) !important;
}

/* Radio buttons (shipping methods, payment methods) */
.wc-block-components-radio-control__option {
    color: var(--wp--preset--color--contrast) !important;
}

.wc-block-components-radio-control__label {
    color: var(--wp--preset--color--contrast) !important;
}

.wc-block-components-radio-control__description {
    color: var(--wp--preset--color--muted) !important;
}

.wc-block-components-radio-control__input {
    border-color: var(--wp--preset--color--border) !important;
}

.wc-block-components-radio-control__input:checked {
    border-color: var(--wp--preset--color--accent) !important;
    background-color: var(--wp--preset--color--accent) !important;
}

/* Notices */
.wc-block-components-notice-banner {
    background: var(--wp--preset--color--surface) !important;
    border-color: var(--wp--preset--color--border) !important;
    color: var(--wp--preset--color--contrast) !important;
}

.wc-block-components-notice-banner.is-error {
    border-left-color: var(--wp--preset--color--error) !important;
}

.wc-block-components-notice-banner.is-success {
    border-left-color: var(--wp--preset--color--success) !important;
}

/* Coupon area */
.wc-block-components-totals-coupon__form input {
    background-color: var(--wp--preset--color--surface-alt) !important;
    border: 1px solid var(--wp--preset--color--border) !important;
    color: var(--wp--preset--color--contrast) !important;
}

.wc-block-components-totals-coupon__form input:focus {
    border-color: var(--wp--preset--color--accent) !important;
}

.wc-block-components-totals-coupon__button {
    background-color: var(--wp--preset--color--surface-alt) !important;
    color: var(--wp--preset--color--accent) !important;
    border: 1px solid var(--wp--preset--color--accent) !important;
}

/* Validation errors */
.wc-block-components-validation-error {
    color: var(--wp--preset--color--error) !important;
}

/* Checkout form links */
.wc-block-checkout a,
.wc-block-components-checkout-step a {
    color: var(--wp--preset--color--accent) !important;
}

/* Payment method tabs */
.wc-block-components-payment-method-label {
    color: var(--wp--preset--color--contrast) !important;
}

/* Shipping options */
.wc-block-components-shipping-rates-control__package {
    border: 1px solid var(--wp--preset--color--border) !important;
    border-radius: 4px;
}

/* Checkbox styling */
.wc-block-components-checkbox .wc-block-components-checkbox__input[type="checkbox"] {
    border-color: var(--wp--preset--color--border) !important;
    background: var(--wp--preset--color--surface-alt) !important;
}

.wc-block-components-checkbox .wc-block-components-checkbox__input[type="checkbox"]:checked {
    background-color: var(--wp--preset--color--accent) !important;
    border-color: var(--wp--preset--color--accent) !important;
}

.wc-block-components-checkbox .wc-block-components-checkbox__label {
    color: var(--wp--preset--color--contrast) !important;
}


/* =============================================
   B. My Account Overrides
   ============================================= */

/* Navigation sidebar */
.woocommerce-MyAccount-navigation ul {
    background: var(--wp--preset--color--surface);
    border: 1px solid var(--wp--preset--color--border);
    border-radius: 6px;
    overflow: hidden;
    list-style: none;
    padding: 0;
    margin: 0;
}

.woocommerce-MyAccount-navigation ul li {
    border-bottom: 1px solid var(--wp--preset--color--border);
}

.woocommerce-MyAccount-navigation ul li:last-child {
    border-bottom: none;
}

.woocommerce-MyAccount-navigation ul li a {
    display: block;
    padding: 12px 16px;
    color: var(--wp--preset--color--contrast) !important;
    text-decoration: none;
    transition: background-color 0.15s ease, border-left 0.15s ease;
    border-left: 3px solid transparent;
}

.woocommerce-MyAccount-navigation ul li a:hover {
    background-color: var(--wp--preset--color--surface-alt);
    color: var(--wp--preset--color--accent) !important;
}

.woocommerce-MyAccount-navigation ul li.is-active a,
.woocommerce-MyAccount-navigation ul li.woocommerce-MyAccount-navigation-link--identity-verification.is-active a {
    background-color: var(--wp--preset--color--surface-alt);
    color: var(--wp--preset--color--accent) !important;
    border-left: 3px solid var(--wp--preset--color--accent);
    font-weight: 600;
}

/* My Account content area */
.woocommerce-MyAccount-content {
    color: var(--wp--preset--color--contrast);
}

.woocommerce-MyAccount-content h2,
.woocommerce-MyAccount-content h3 {
    color: var(--wp--preset--color--contrast) !important;
}

.woocommerce-MyAccount-content p {
    color: var(--wp--preset--color--contrast);
}

/* Orders table */
.woocommerce-orders-table,
.woocommerce-MyAccount-content table {
    border: 1px solid var(--wp--preset--color--border);
    border-collapse: collapse;
    width: 100%;
}

.woocommerce-orders-table thead,
.woocommerce-MyAccount-content table thead {
    background: var(--wp--preset--color--surface);
}

.woocommerce-orders-table thead th,
.woocommerce-MyAccount-content table thead th {
    color: var(--wp--preset--color--accent) !important;
    border-bottom: 2px solid var(--wp--preset--color--border);
    padding: 12px;
    text-align: left;
}

.woocommerce-orders-table tbody td,
.woocommerce-MyAccount-content table tbody td {
    border-bottom: 1px solid var(--wp--preset--color--border);
    padding: 12px;
    color: var(--wp--preset--color--contrast);
}

.woocommerce-orders-table tbody tr:hover,
.woocommerce-MyAccount-content table tbody tr:hover {
    background: var(--wp--preset--color--surface);
}

/* View order links */
.woocommerce-orders-table a,
.woocommerce-MyAccount-content table a {
    color: var(--wp--preset--color--accent) !important;
}

/* Edit account form and address forms */
.woocommerce-EditAccountForm input[type="text"],
.woocommerce-EditAccountForm input[type="email"],
.woocommerce-EditAccountForm input[type="password"],
.woocommerce-EditAccountForm select,
.woocommerce-address-fields input[type="text"],
.woocommerce-address-fields input[type="email"],
.woocommerce-address-fields input[type="tel"],
.woocommerce-address-fields select {
    background-color: var(--wp--preset--color--surface-alt) !important;
    border: 1px solid var(--wp--preset--color--border) !important;
    color: var(--wp--preset--color--contrast) !important;
    border-radius: 4px;
    padding: 8px 12px;
}

.woocommerce-EditAccountForm input:focus,
.woocommerce-address-fields input:focus,
.woocommerce-EditAccountForm select:focus,
.woocommerce-address-fields select:focus {
    border-color: var(--wp--preset--color--accent) !important;
    box-shadow: 0 0 0 1px var(--wp--preset--color--accent) !important;
    outline: none !important;
}

.woocommerce-EditAccountForm label,
.woocommerce-address-fields label {
    color: var(--wp--preset--color--muted) !important;
}

/* Address display cards */
.woocommerce-Addresses .woocommerce-Address,
.u-columns .woocommerce-Address {
    background: var(--wp--preset--color--surface);
    border: 1px solid var(--wp--preset--color--border);
    border-radius: 6px;
    padding: 16px;
}

.woocommerce-Address-title h3 {
    color: var(--wp--preset--color--accent) !important;
}

.woocommerce-Address address {
    color: var(--wp--preset--color--contrast) !important;
}

/* Buttons throughout My Account */
.woocommerce-MyAccount-content .button,
.woocommerce-MyAccount-content .woocommerce-button,
.woocommerce-MyAccount-content button[type="submit"] {
    background-color: var(--wp--preset--color--accent) !important;
    color: var(--wp--preset--color--base) !important;
    border: none !important;
    border-radius: 4px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    padding: 10px 20px;
    cursor: pointer;
    transition: background-color 0.2s ease;
}

.woocommerce-MyAccount-content .button:hover,
.woocommerce-MyAccount-content .woocommerce-button:hover,
.woocommerce-MyAccount-content button[type="submit"]:hover {
    background-color: var(--wp--preset--color--accent-dark) !important;
    color: var(--wp--preset--color--base) !important;
}

/* Dashboard greeting and links */
.woocommerce-MyAccount-content a {
    color: var(--wp--preset--color--accent);
}

/* WooCommerce notices in My Account */
.woocommerce-message,
.woocommerce-info {
    background: var(--wp--preset--color--surface) !important;
    border-top: 3px solid var(--wp--preset--color--accent) !important;
    color: var(--wp--preset--color--contrast) !important;
}

.woocommerce-error {
    background: var(--wp--preset--color--surface) !important;
    border-top: 3px solid var(--wp--preset--color--error) !important;
    color: var(--wp--preset--color--contrast) !important;
}

.woocommerce-message a,
.woocommerce-info a,
.woocommerce-error a {
    color: var(--wp--preset--color--accent) !important;
}

/* No orders message */
.woocommerce-MyAccount-content .woocommerce-info {
    background: var(--wp--preset--color--surface) !important;
    color: var(--wp--preset--color--muted) !important;
    border: 1px solid var(--wp--preset--color--border) !important;
    border-top: 3px solid var(--wp--preset--color--accent) !important;
    border-radius: 4px;
    padding: 16px;
}


/* =============================================
   C. ACH Payment Component Classes
   ============================================= */

/* Notice boxes */
.pm-ach-notice {
    padding: 10px 12px;
    border-radius: 4px;
    margin-bottom: 10px;
    font-size: 14px;
    line-height: 1.5;
}

.pm-ach-notice--warning {
    background: rgba(212, 175, 55, 0.15);
    border: 1px solid var(--wp--preset--color--accent);
    color: var(--wp--preset--color--accent);
}

.pm-ach-notice--error {
    background: rgba(220, 53, 69, 0.15);
    border: 1px solid var(--wp--preset--color--error);
    color: var(--wp--preset--color--error);
}

.pm-ach-notice--success {
    background: rgba(40, 167, 69, 0.15);
    border: 1px solid var(--wp--preset--color--success);
    color: var(--wp--preset--color--success);
    font-weight: bold;
}

/* Buttons */
.pm-ach-button {
    padding: 10px 20px;
    background-color: var(--wp--preset--color--accent);
    color: var(--wp--preset--color--base);
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-weight: 600;
    font-size: 14px;
    transition: background-color 0.2s ease;
}

.pm-ach-button:hover {
    background-color: var(--wp--preset--color--accent-dark);
}

.pm-ach-button--disabled {
    background-color: var(--wp--preset--color--surface-alt);
    color: var(--wp--preset--color--muted);
    cursor: not-allowed;
    border: 1px solid var(--wp--preset--color--border);
}

.pm-ach-button--disabled:hover {
    background-color: var(--wp--preset--color--surface-alt);
}

/* Account selection heading */
.pm-ach-heading {
    margin: 10px 0;
    color: var(--wp--preset--color--contrast);
    font-size: 16px;
}

/* Account cards */
.pm-ach-account-card {
    display: flex;
    align-items: center;
    padding: 10px;
    margin: 5px 0;
    border: 1px solid var(--wp--preset--color--border);
    border-radius: 4px;
    background: var(--wp--preset--color--surface);
    cursor: pointer;
    transition: border-color 0.15s ease, background-color 0.15s ease;
}

.pm-ach-account-card:hover {
    border-color: var(--wp--preset--color--accent);
}

.pm-ach-account-card--selected {
    border-color: var(--wp--preset--color--accent);
    background: var(--wp--preset--color--surface-alt);
}

.pm-ach-account-card--disabled {
    opacity: 0.6;
    cursor: not-allowed;
    background: var(--wp--preset--color--surface);
}

.pm-ach-account-card--disabled:hover {
    border-color: var(--wp--preset--color--border);
}

/* Account info inside cards */
.pm-ach-account-info {
    flex: 1;
}

.pm-ach-account-name {
    color: var(--wp--preset--color--contrast);
    display: block;
    font-weight: 600;
}

.pm-ach-account-details {
    color: var(--wp--preset--color--muted);
    font-size: 0.85em;
}

.pm-ach-balance {
    display: block;
    font-weight: bold;
    font-size: 0.85em;
}

.pm-ach-balance--ok {
    color: var(--wp--preset--color--success);
}

.pm-ach-balance--insufficient {
    color: var(--wp--preset--color--error);
}

/* Radio in account card */
.pm-ach-account-card input[type="radio"] {
    margin-right: 10px;
    accent-color: var(--wp--preset--color--accent);
}

/* Description text */
.pm-ach-description {
    color: var(--wp--preset--color--muted);
    margin: 0 0 10px;
}

/* Container padding */
.pm-ach-container {
    padding: 10px 0;
}


/* =============================================
   D. Embedded Addresses (Account Details page)
   ============================================= */

.pm-account-addresses {
    margin-top: 40px;
    padding-top: 30px;
    border-top: 2px solid var(--wp--preset--color--border);
}

.pm-account-addresses > h3 {
    color: var(--wp--preset--color--accent) !important;
    margin-bottom: 20px;
}

.pm-address-section {
    background: var(--wp--preset--color--surface);
    border: 1px solid var(--wp--preset--color--border);
    border-radius: 6px;
    padding: 20px;
    margin-bottom: 16px;
}

.pm-address-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 12px;
}

.pm-address-header h4 {
    color: var(--wp--preset--color--contrast) !important;
    margin: 0;
    font-size: 1.05em;
}

.pm-edit-address-toggle {
    background: transparent !important;
    color: var(--wp--preset--color--accent) !important;
    border: 1px solid var(--wp--preset--color--accent) !important;
    border-radius: 4px;
    padding: 6px 16px !important;
    cursor: pointer;
    font-size: 0.85em;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    transition: background-color 0.15s ease, color 0.15s ease;
}

.pm-edit-address-toggle:hover {
    background: var(--wp--preset--color--accent) !important;
    color: var(--wp--preset--color--base) !important;
}

.pm-address-display address {
    color: var(--wp--preset--color--contrast);
    font-style: normal;
    line-height: 1.6;
}

.pm-no-address {
    color: var(--wp--preset--color--muted);
    font-style: italic;
}

.pm-address-edit-form {
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px solid var(--wp--preset--color--border);
}

.pm-address-edit-form .form-row {
    margin-bottom: 12px;
}

.pm-address-edit-form label {
    color: var(--wp--preset--color--muted) !important;
    display: block;
    margin-bottom: 4px;
    font-size: 0.9em;
}

.pm-address-edit-form input[type="text"],
.pm-address-edit-form input[type="email"],
.pm-address-edit-form input[type="tel"],
.pm-address-edit-form select {
    width: 100%;
    background-color: var(--wp--preset--color--surface-alt) !important;
    border: 1px solid var(--wp--preset--color--border) !important;
    color: var(--wp--preset--color--contrast) !important;
    border-radius: 4px;
    padding: 8px 12px;
    box-sizing: border-box;
}

.pm-address-edit-form input:focus,
.pm-address-edit-form select:focus {
    border-color: var(--wp--preset--color--accent) !important;
    box-shadow: 0 0 0 1px var(--wp--preset--color--accent) !important;
    outline: none !important;
}

.pm-save-address-btn {
    background-color: var(--wp--preset--color--accent) !important;
    color: var(--wp--preset--color--base) !important;
    border: none !important;
    border-radius: 4px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    padding: 10px 24px;
    cursor: pointer;
    transition: background-color 0.2s ease;
    margin-top: 8px;
}

.pm-save-address-btn:hover {
    background-color: var(--wp--preset--color--accent-dark) !important;
}


/* =============================================
   E. Order Item Thumbnails (My Account orders)
   ============================================= */

.pm-order-item-with-thumb {
    display: flex;
    align-items: center;
    gap: 12px;
}

.pm-order-item-thumbnail {
    width: 60px;
    height: 60px;
    object-fit: contain;
    border: 1px solid var(--wp--preset--color--border);
    border-radius: 4px;
    flex-shrink: 0;
    background: var(--wp--preset--color--surface-alt);
}

.pm-order-item-name {
    flex: 1;
}