/* WooCommerce cart / checkout / account, brand alignment. Consumes tokens.css. */

/* ===== Logged-in account dashboard: 2-column layout (sidebar + content) ===== */
.logged-in.woocommerce-account .woocommerce{display:grid;grid-template-columns:minmax(0,250px) minmax(0,1fr);gap:clamp(1.25rem,3vw,2.25rem);align-items:start}
.logged-in.woocommerce-account .woocommerce>.woocommerce-notices-wrapper{grid-column:1/-1}
@media(max-width:782px){.logged-in.woocommerce-account .woocommerce{grid-template-columns:1fr}}
.logged-in.woocommerce-account .woocommerce-MyAccount-navigation ul,
.logged-in.woocommerce-account .woocommerce-MyAccount-content,
.bf-dash__grid a{box-sizing:border-box}

/* Sidebar navigation */
.woocommerce-MyAccount-navigation ul{list-style:none;margin:0;padding:.45rem;display:flex;flex-direction:column;gap:.15rem;background:var(--bf-white);border:1px solid var(--bf-hairline);border-radius:var(--bf-radius)}
.woocommerce-MyAccount-navigation li{margin:0}
.woocommerce-MyAccount-navigation li a{display:flex;align-items:center;gap:.7rem;padding:.7rem .85rem;border-radius:var(--bf-radius);color:var(--bf-graphite);text-decoration:none;font-weight:600;font-size:.95rem;transition:background var(--bf-transition),color var(--bf-transition)}
.woocommerce-MyAccount-navigation li a svg{width:18px;height:18px;flex:0 0 auto;color:var(--bf-green-deep)}
.woocommerce-MyAccount-navigation li a:hover{background:var(--bf-green-chip);color:var(--bf-green-ink)}
.woocommerce-MyAccount-navigation li.is-active a{background:var(--bf-green-chip);color:var(--bf-green-ink);font-weight:700}
.woocommerce-MyAccount-navigation li.is-active a svg{color:var(--bf-green-ink)}
.woocommerce-MyAccount-navigation-link--customer-logout{margin-top:.35rem;padding-top:.5rem;border-top:1px solid var(--bf-hairline)}
.woocommerce-MyAccount-navigation-link--customer-logout a{color:var(--bf-stone-deep)}
.woocommerce-MyAccount-navigation-link--customer-logout a svg{color:var(--bf-stone)}

/* Content column */
.woocommerce-MyAccount-content{min-width:0}
.woocommerce-MyAccount-content>p:first-of-type{margin-top:0}

/* Dashboard: welcome + quick-action cards */
.bf-dash__welcome h2{font-family:var(--bf-font-head);font-weight:var(--bf-fw-head);font-size:clamp(1.4rem,3vw,1.8rem);line-height:1.15;color:var(--bf-green-ink);margin:0 0 .35rem}
.bf-dash__welcome p{margin:0;color:var(--bf-stone-deep)}
.bf-dash__grid{list-style:none;margin:1.5rem 0 0;padding:0;display:grid;gap:1rem;grid-template-columns:repeat(auto-fill,minmax(220px,1fr))}
.bf-dash__grid li{margin:0}
.bf-dash__grid a{display:flex;gap:.85rem;align-items:flex-start;height:100%;padding:1.1rem;background:var(--bf-white);border:1px solid var(--bf-hairline);border-radius:var(--bf-radius);text-decoration:none;box-shadow:0 4px 12px -8px rgba(20,58,36,.18);transition:transform var(--bf-transition),box-shadow var(--bf-transition),border-color var(--bf-transition)}
.bf-dash__grid a:hover{transform:translateY(-2px);box-shadow:0 10px 24px -12px rgba(20,58,36,.24);border-color:var(--bf-green-line)}
.bf-dash__icon{flex:0 0 auto;width:2.4rem;height:2.4rem;display:grid;place-items:center;border-radius:50%;background:var(--bf-green-chip);color:var(--bf-green-deep)}
.bf-dash__icon svg{width:20px;height:20px}
.bf-dash__txt{display:flex;flex-direction:column;gap:.15rem;min-width:0}
.bf-dash__txt strong{font-family:var(--bf-font-head);font-weight:var(--bf-fw-head);font-size:1.05rem;color:var(--bf-green-ink)}
.bf-dash__txt small{color:var(--bf-stone-deep);font-size:.85rem;line-height:1.4}
.bf-dash__logout{margin:1.75rem 0 0;font-size:.9rem}
.bf-dash__logout a{color:var(--bf-stone-deep);text-decoration:underline}

/* ===== Account content sections (orders, addresses, account details) ===== */
/* Rein in the global heading sizes (h2 is up to 38px) for the account context. */
.woocommerce-MyAccount-content h2{font-size:1.5rem;color:var(--bf-green-ink);margin:0 0 1rem}
.woocommerce-MyAccount-content h3{font-size:1.15rem;color:var(--bf-green-ink);margin:1.75rem 0 .75rem}
.woocommerce-MyAccount-content>p{color:var(--bf-stone-deep)}

/* WooCommerce's button padding CSS is dequeued — give account buttons their size back. */
.woocommerce-MyAccount-content .button,
.woocommerce-MyAccount-content button.button{display:inline-flex;align-items:center;justify-content:center;padding:var(--bf-btn-pad-y) var(--bf-btn-pad-x);border-radius:var(--bf-radius);text-decoration:none}

/* Addresses → cards */
.woocommerce-Addresses{display:grid;gap:1rem;grid-template-columns:1fr;margin:0}
@media(min-width:640px){.woocommerce-Addresses.col2-set{grid-template-columns:1fr 1fr}}
.woocommerce-Address{float:none!important;width:auto!important;box-sizing:border-box;background:var(--bf-white);border:1px solid var(--bf-hairline);border-radius:var(--bf-radius);padding:1.25rem}
.woocommerce-Address-title{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:.6rem}
.woocommerce-Address-title h3{margin:0!important}
.woocommerce-Address-title .edit{font-size:.85rem;color:var(--bf-green-deep);text-decoration:underline;white-space:nowrap}
.woocommerce-Address address{font-style:normal;color:var(--bf-stone-deep);line-height:1.65}

/* Edit account / edit address forms */
.woocommerce-MyAccount-content fieldset{border:1px solid var(--bf-hairline);border-radius:var(--bf-radius);padding:1rem 1.25rem 1.25rem;margin:1.5rem 0 0}
.woocommerce-MyAccount-content legend{font-weight:700;padding:0 .4rem;color:var(--bf-green-ink)}
.woocommerce-EditAccountForm .woocommerce-form-row--first,
.woocommerce-EditAccountForm .woocommerce-form-row--last{width:100%}
.woocommerce-MyAccount-content fieldset span em{display:block;margin-top:.35rem;font-size:.82rem;color:var(--bf-stone);font-style:normal}

/* Orders table action buttons wrap tidily */
.woocommerce-orders-table__cell-order-actions{display:flex;flex-wrap:wrap;gap:.4rem}
.woocommerce-orders-table__cell-order-actions .button{font-size:.85rem;padding:.5em 1em}

/* Tables (cart, orders, addresses) */
.woocommerce table.shop_table{border:1px solid var(--bf-hairline);border-radius:var(--bf-radius);border-collapse:separate;border-spacing:0;overflow:hidden}
.woocommerce table.shop_table th,.woocommerce table.shop_table td{padding:.85rem 1rem;border-top:1px solid var(--bf-hairline)}

/* Totals / order review panels */
.woocommerce .cart-collaterals .cart_totals,.woocommerce-checkout #order_review{background:var(--bf-white);border:1px solid var(--bf-hairline);border-radius:var(--bf-radius);padding:var(--bf-space-3)}

/* Inputs */
.woocommerce form .form-row input.input-text,.woocommerce form .form-row textarea,.woocommerce-checkout input,.select2-container--default .select2-selection{border:1px solid var(--bf-hairline)!important;border-radius:var(--bf-radius)!important;padding:.7rem .9rem!important}

/* Buttons → brand primary */
/* Exclude the product-card CTA (.bf-card__cta) so card buttons keep their gradient
   bleed-bar style and match the homepage carousel. These !important rules otherwise
   beat .bf-card__cta on every .woocommerce page (shop/category) and forced a solid
   lime button. Other WooCommerce buttons (account/cart/checkout/forms) still styled. */
.woocommerce #respond input#submit,.woocommerce a.button:not(.bf-card__cta),.woocommerce button.button:not(.bf-card__cta),.woocommerce input.button,.woocommerce .button.alt:not(.bf-card__cta){background:var(--bf-green)!important;color:var(--bf-green-ink)!important;border-radius:var(--bf-radius)!important;font-weight:700}
.woocommerce a.button:not(.bf-card__cta):hover,.woocommerce button.button:not(.bf-card__cta):hover,.woocommerce input.button:hover,.woocommerce .button.alt:not(.bf-card__cta):hover{background:var(--bf-green-hover)!important;color:var(--bf-green-ink)!important}

/* Notices (legacy) */
.woocommerce .woocommerce-message,.woocommerce .woocommerce-info{border-top-color:var(--bf-green)}
.woocommerce .woocommerce-error{border-top-color:var(--bf-error)}

/* Notices (block-based: .wc-block-components-notice-banner) — account/cart/checkout */
.wc-block-components-notice-banner{display:flex;align-items:flex-start;gap:.7rem;margin:0 0 1.25rem;padding:.9rem 1.05rem;border:1px solid var(--bf-hairline);border-left-width:4px;border-radius:var(--bf-radius);background:var(--bf-white);font-size:.92rem;line-height:1.5;color:var(--bf-graphite)}
.wc-block-components-notice-banner>svg{flex:0 0 auto;width:22px;height:22px;margin-top:.05rem}
.wc-block-components-notice-banner__content{flex:1 1 auto;min-width:0;margin:0}
.wc-block-components-notice-banner__content a{color:var(--bf-green-deep);text-decoration:underline}
.wc-block-components-notice-banner.is-error{border-left-color:var(--bf-error);background:rgba(180,35,24,.06)}
.wc-block-components-notice-banner.is-error>svg{fill:var(--bf-error)}
.wc-block-components-notice-banner.is-success{border-left-color:var(--bf-forest);background:var(--bf-green-tint)}
.wc-block-components-notice-banner.is-success>svg{fill:var(--bf-forest)}
.wc-block-components-notice-banner.is-info,.wc-block-components-notice-banner.is-warning{border-left-color:var(--bf-green-deep);background:var(--bf-paper)}
.wc-block-components-notice-banner.is-info>svg,.wc-block-components-notice-banner.is-warning>svg{fill:var(--bf-green-deep)}

/* ===== Login / Register (My account, logged-out) =====
   WooCommerce's own CSS is dequeued (inc/woocommerce.php), so these forms are
   styled entirely here: two panels inside the page card, stacking on mobile. */

/* The account page is self-explanatory — drop the page title and its divider. */
.woocommerce-account .wp-block-post-title{display:none}

/* Account benefits, icon list — rendered inside the email-gate box, divided off from
   the form by a hairline (one merged box). */
.bf-acct-benefits{box-sizing:border-box;margin:1.5rem 0 0;padding:1.5rem 0 0;border-top:1px solid var(--bf-hairline)}
.bf-acct-benefits__title{font-family:var(--bf-font-head);font-weight:var(--bf-fw-head);font-size:1.2rem;line-height:1.15;color:var(--bf-green-ink);text-align:left;margin:0 0 1.1rem}
.bf-acct-benefits__grid{list-style:none;margin:0;padding:0;display:grid;gap:.85rem 1.25rem;grid-template-columns:1fr}
@media(min-width:560px){.bf-acct-benefits__grid{grid-template-columns:1fr 1fr}}
@media(min-width:860px){.bf-acct-benefits__grid{grid-template-columns:repeat(3,1fr)}}
.bf-acct-benefits__item{display:flex;align-items:center;gap:.7rem;font-size:.95rem;color:var(--bf-graphite)}
.bf-acct-benefits__icon{flex:0 0 auto;width:2.4rem;height:2.4rem;display:grid;place-items:center;border-radius:50%;background:var(--bf-green-chip);color:var(--bf-green-deep)}
.bf-acct-benefits__icon svg{width:18px;height:18px}

/* No page panel on the account page (keep the boxed card for legal/doc pages only). */
.woocommerce-account .bf-doc__card{background:none;border:0;border-radius:0;box-shadow:none;padding:0}

/* border-box everywhere in the account form so 100%-width fields stay inside the
   boxes (there is no global box-sizing reset). */
.woocommerce-account .woocommerce form,
.woocommerce-account .woocommerce form *,
.bf-auth,
.bf-auth *{box-sizing:border-box}

/* ===== Email-first auth flow (#bf-account-auth) ===== */
.bf-auth{max-width:var(--bf-container-narrow);margin-inline:auto}
.bf-auth.bf-auth--single{max-width:480px}
.bf-auth__alt{margin:1rem 0 0;text-align:center;font-size:.9rem}
.bf-auth__alt a{color:var(--bf-green-deep);text-decoration:underline}
.bf-auth__step{background:var(--bf-white);border:1px solid var(--bf-hairline);border-radius:var(--bf-radius);box-shadow:var(--bf-shadow-panel);padding:clamp(1.5rem,3vw,2rem)}
.bf-auth__step+.bf-auth__step{margin-top:1.25rem}   /* spacing only in the no-JS stacked fallback */
.bf-auth__step[hidden]{display:none}
.bf-auth__title{font-family:var(--bf-font-head);font-weight:var(--bf-fw-head);font-size:1.5rem;line-height:1.15;margin:0 0 .35rem;color:var(--bf-green-ink)}
.bf-auth__sub{margin:0 0 1.25rem;color:var(--bf-stone-deep);font-size:.95rem;line-height:1.5}
.bf-auth__error{margin:0 0 .75rem;color:var(--bf-error);font-size:.9rem;font-weight:600}
.bf-auth input.input-text{width:100%;border:1px solid var(--bf-hairline);border-radius:var(--bf-radius);padding:.7rem .9rem;font:inherit;color:var(--bf-graphite)}

/* "Signing in as …" line + locked email with inline Edit */
.bf-auth__as{margin:0 0 1rem;font-size:.9rem;color:var(--bf-stone-deep)}
.bf-auth__as strong{color:var(--bf-graphite)}
.bf-auth__edit{background:none;border:0;padding:0;margin-left:.4rem;color:var(--bf-green-deep);font:inherit;font-size:.85rem;font-weight:600;text-decoration:underline;cursor:pointer}
.bf-auth__locked{position:relative;display:block}
.bf-auth__edit--inline{position:absolute;top:50%;right:.85rem;transform:translateY(-50%);margin:0}
.bf-auth__locked input[readonly]{background:var(--bf-paper);color:var(--bf-stone-deep);padding-right:3.5rem!important}

/* Form rows + labels (no Woo base CSS, so set the essentials) */
.woocommerce-account .woocommerce form.login,
.woocommerce-account .woocommerce form.register{margin:0;border:0;padding:0}
.woocommerce-account .woocommerce form .form-row,
.bf-auth .form-row{display:block;margin:0 0 1rem;padding:0}
.woocommerce-account .woocommerce form .form-row>label,
.bf-auth .form-row>label{display:block;margin:0 0 .35rem;font-weight:600;font-size:.9rem;color:var(--bf-stone-deep)}
.woocommerce-account .woocommerce form .form-row input.input-text{display:block;width:100%}
.woocommerce-account .woocommerce form .required{color:var(--bf-error);text-decoration:none;border:0}

/* Checkboxes (remember-me, terms, newsletter) */
.woocommerce-account .woocommerce form .woocommerce-form__label-for-checkbox{display:flex;align-items:flex-start;gap:.55rem;font-weight:400;font-size:.9rem;color:var(--bf-stone-deep);line-height:1.45}
.woocommerce-account .woocommerce form .woocommerce-form__label-for-checkbox input{margin:.15rem 0 0;flex:0 0 auto}
.bf-auth__check a{color:var(--bf-green-deep);text-decoration:underline}

/* Buttons span the box (WooCommerce's button CSS is dequeued, so set padding too) */
.bf-auth button.button,.bf-auth .button{display:inline-flex;align-items:center;justify-content:center;width:100%;margin-top:.4rem;padding:var(--bf-btn-pad-y) var(--bf-btn-pad-x);border:0;border-radius:var(--bf-radius);font:inherit;font-weight:700;line-height:1.2;cursor:pointer}
.bf-auth .button.is-loading{position:relative;color:transparent!important;pointer-events:none}
.bf-auth .button.is-loading::after{content:"";position:absolute;top:50%;left:50%;width:1.15em;height:1.15em;margin:-.575em 0 0 -.575em;border:2px solid rgba(255,255,255,.45);border-top-color:#fff;border-radius:50%;animation:bf-spin .6s linear infinite}
@keyframes bf-spin{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.bf-auth .button.is-loading::after{animation-duration:1.6s}}
.bf-auth__notice{margin-top:0}

/* Password rules checklist */
.bf-pwrules{margin:0 0 1rem;font-size:.85rem}
.bf-pwrules__title{margin:0 0 .45rem;color:var(--bf-stone-deep)}
.bf-pwrules ul{list-style:none;margin:0;padding:0;display:grid;gap:.32rem}
.bf-pwrules li{position:relative;padding-left:1.6rem;color:var(--bf-stone)}
.bf-pwrules li::before{content:"";position:absolute;left:0;top:.02em;width:1.1rem;height:1.1rem;display:grid;place-items:center;border-radius:50%;border:1.5px solid var(--bf-hairline);font-size:.72rem;line-height:1}
.bf-pwrules li.is-met{color:var(--bf-green-deep)}
.bf-pwrules li.is-met::before{content:"\2713";border:0;background:var(--bf-forest);color:#fff}

/* Password show/hide (Woo's icon CSS is gone — provide our own) */
.woocommerce form .password-input{display:block;position:relative}
.woocommerce form .password-input input.input-text{padding-right:2.75rem!important}
.woocommerce form .show-password-input{position:absolute;top:50%;right:.55rem;transform:translateY(-50%);width:1.9rem;height:1.9rem;display:grid;place-items:center;padding:0;border:0;background:transparent;color:var(--bf-stone);cursor:pointer}
.woocommerce form .show-password-input::after{content:"\01F441";font-size:1rem;line-height:1}
.woocommerce form .show-password-input.display-password{color:var(--bf-green-deep)}

/* Lost-password + privacy notice */
.woocommerce-LostPassword{margin:.75rem 0 0}
.woocommerce-LostPassword a{color:var(--bf-green-deep);font-size:.9rem;text-decoration:underline}
.woocommerce-privacy-policy-text{margin:.75rem 0 0;font-size:.82rem;line-height:1.5;color:var(--bf-stone)}
.woocommerce-privacy-policy-text p{margin:0}