/* ============================================================ Seamless Hold - My Account presentation layer Scope: body.sh-acct only (WooCommerce My Account page 17). Presentation only. No business logic, no payment logic. Tokens, form language and button language are the approved Project B set already in use on Cart 15 and Checkout 16. ============================================================ */ body.sh-acct { --sh-primary:#A24522; --sh-primary-dark:#8C3A1B; --sh-secondary:#4E341B; --sh-text:#1C1106; --sh-accent:#846447; --sh-ivory:#FBF8F3; --sh-cream:#F3EDE5; --sh-border:#E5DCD2; --sh-error:#B4442A; --sh-display:"Cormorant Garamond",Georgia,"Times New Roman",serif; --sh-body:"Manrope",-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif; --sh-max:1280px; background-color:var(--sh-ivory); color:var(--sh-text); font-family:var(--sh-body); } /* ---- theme shell reset ---- */ body.sh-acct .site-main, body.sh-acct .page-content{max-width:100%;width:auto;padding:0;margin:0;} body.sh-acct .page-header{display:none;} /* ============================================================ HEADING ZONE ============================================================ */ body.sh-acct .sh-acct-hero{ background:linear-gradient(118deg,var(--sh-cream) 0%,var(--sh-ivory) 58%,#EFE5D8 100%); border-bottom:1px solid var(--sh-border);} body.sh-acct .sh-acct-hero__inner{max-width:var(--sh-max);margin:0 auto;padding:46px 24px 40px;} body.sh-acct .sh-acct-hero__eyebrow{display:block;margin:0 0 10px; font-family:var(--sh-body);font-size:11px;font-weight:700;letter-spacing:.2em; text-transform:uppercase;color:var(--sh-primary);} body.sh-acct .sh-acct-hero__title{margin:0;font-family:var(--sh-display);font-weight:600; font-size:clamp(32px,4.4vw,52px);line-height:1.06;letter-spacing:-.01em;color:var(--sh-text);} body.sh-acct .sh-acct-hero__helper{margin:12px 0 0;max-width:62ch; font-size:14.5px;line-height:1.6;color:var(--sh-accent);} /* ============================================================ PAGE SHELL / TWO-COLUMN ACCOUNT LAYOUT ============================================================ */ body.sh-acct .sh-acct__body{max-width:var(--sh-max);margin:0 auto;padding:44px 24px 78px;} body.sh-acct .sh-acct__body > .woocommerce{max-width:100%;margin:0;} body.sh-acct--auth .sh-acct__body > .woocommerce{ display:grid;grid-template-columns:250px minmax(0,1fr);gap:52px;align-items:start;} /* Clearfix pseudo-elements would otherwise become empty grid items. */ body.sh-acct--auth .sh-acct__body > .woocommerce::before, body.sh-acct--auth .sh-acct__body > .woocommerce::after{display:none;} body.sh-acct .woocommerce-MyAccount-navigation, body.sh-acct .woocommerce-MyAccount-content{float:none;width:auto;margin:0;min-width:0;} /* ============================================================ ACCOUNT NAVIGATION PANEL ============================================================ */ body.sh-acct .woocommerce-MyAccount-navigation ul{ list-style:none;margin:0;padding:0;background:#FFFFFF; border:1px solid var(--sh-border);border-radius:4px;overflow:hidden;} body.sh-acct .woocommerce-MyAccount-navigation li{margin:0;padding:0;list-style:none;} body.sh-acct .woocommerce-MyAccount-navigation li::marker{content:none;} body.sh-acct .woocommerce-MyAccount-navigation li + li{border-top:1px solid var(--sh-border);} body.sh-acct .woocommerce-MyAccount-navigation li a{ display:flex;align-items:center;min-height:48px;padding:13px 18px; font-family:var(--sh-body);font-size:11.5px;font-weight:700;letter-spacing:.12em; text-transform:uppercase;line-height:1.3;color:var(--sh-secondary);text-decoration:none; transition:background-color .18s ease,color .18s ease;} body.sh-acct .woocommerce-MyAccount-navigation li a:hover{background:var(--sh-cream);color:var(--sh-primary);} body.sh-acct .woocommerce-MyAccount-navigation li a:focus-visible{ outline:2px solid var(--sh-primary);outline-offset:-2px;} body.sh-acct .woocommerce-MyAccount-navigation li.is-active > a{ background:var(--sh-cream);color:var(--sh-primary); box-shadow:inset 3px 0 0 var(--sh-primary);} /* Log Out reads as a separate block at the foot of the panel. */ body.sh-acct .woocommerce-MyAccount-navigation-link--customer-logout{ background:var(--sh-cream);border-top:1px solid var(--sh-border);} body.sh-acct .woocommerce-MyAccount-navigation-link--customer-logout a{ color:var(--sh-accent);font-weight:600;} body.sh-acct .woocommerce-MyAccount-navigation-link--customer-logout a:hover{ background:#EDE3D6;color:var(--sh-primary);} /* ============================================================ SHARED CONTENT TYPOGRAPHY ============================================================ */ body.sh-acct .woocommerce-MyAccount-content > h2, body.sh-acct .woocommerce-MyAccount-content > h3{ margin:0 0 16px;font-family:var(--sh-display);font-size:22px;font-weight:600; letter-spacing:.05em;color:var(--sh-text);line-height:1.25;} body.sh-acct .woocommerce-MyAccount-content > p{ margin:0 0 20px;font-size:14.5px;line-height:1.65;color:var(--sh-accent);} body.sh-acct .woocommerce-MyAccount-content a{color:var(--sh-primary);} /* ============================================================ NOTICES - branded, never suppressed, meaning unchanged ============================================================ */ body.sh-acct .woocommerce-info, body.sh-acct .woocommerce-message, body.sh-acct .woocommerce-error{ display:flex;flex-wrap:wrap;align-items:center;gap:12px 18px; margin:0 0 24px;padding:16px 20px;list-style:none; background:var(--sh-cream);border:1px solid var(--sh-border); border-left:3px solid var(--sh-primary);border-radius:3px; font-family:var(--sh-body);font-size:14px;line-height:1.55;color:var(--sh-secondary);} body.sh-acct .woocommerce-info::before, body.sh-acct .woocommerce-message::before, body.sh-acct .woocommerce-error::before{display:none;content:none;} body.sh-acct .woocommerce-error{background:#FBF1EE;border-left-color:var(--sh-error);} body.sh-acct .woocommerce-error li, body.sh-acct .woocommerce-info li, body.sh-acct .woocommerce-message li{list-style:none;margin:0;padding:0;} body.sh-acct .woocommerce-info .button, body.sh-acct .woocommerce-message .button{order:2;float:none;margin:0;} /* ---- branded empty states ---- */ body.sh-acct .woocommerce-info:has(.sh-acct-empty){ display:block;text-align:center;padding:54px 32px; background:#FFFFFF;border:1px solid var(--sh-border);border-left:1px solid var(--sh-border);} body.sh-acct .sh-acct-empty{display:block;} body.sh-acct .sh-acct-empty__title{display:block;font-family:var(--sh-display); font-size:28px;font-weight:600;line-height:1.2;color:var(--sh-text);} body.sh-acct .sh-acct-empty__text{display:block;margin:10px auto 0;max-width:46ch; font-size:14.5px;line-height:1.6;color:var(--sh-accent);} body.sh-acct .sh-acct-empty__cta{margin-top:24px;} /* ============================================================ BUTTONS - approved Checkout button language ============================================================ */ body.sh-acct .sh-acct__body .button, body.sh-acct .sh-acct__body .woocommerce-Button, body.sh-acct .sh-acct__body button[type="submit"], body.sh-acct .sh-acct__body input[type="submit"], body.sh-acct .sh-acct-empty__cta{ display:inline-flex;align-items:center;justify-content:center;gap:8px; min-height:44px;padding:12px 26px;width:auto; background-color:var(--sh-primary);color:#FFFFFF; border:1px solid var(--sh-primary);border-radius:4px; font-family:var(--sh-body);font-size:12px;font-weight:700;letter-spacing:.14em; text-transform:uppercase;line-height:1.2;text-decoration:none;text-shadow:none; cursor:pointer;transition:background-color .18s ease,border-color .18s ease;} body.sh-acct .sh-acct__body .button:hover, body.sh-acct .sh-acct__body .woocommerce-Button:hover, body.sh-acct .sh-acct__body button[type="submit"]:hover, body.sh-acct .sh-acct__body input[type="submit"]:hover, body.sh-acct .sh-acct-empty__cta:hover, body.sh-acct .sh-acct__body .button:focus, body.sh-acct .sh-acct__body .woocommerce-Button:focus, body.sh-acct .sh-acct__body button[type="submit"]:focus, body.sh-acct .sh-acct-empty__cta:focus{ background-color:var(--sh-primary-dark);border-color:var(--sh-primary-dark);color:#FFFFFF;} body.sh-acct .sh-acct__body .button:focus-visible, body.sh-acct .sh-acct__body button[type="submit"]:focus-visible, body.sh-acct .sh-acct__body input[type="submit"]:focus-visible, body.sh-acct .sh-acct-empty__cta:focus-visible{ outline:2px solid var(--sh-primary);outline-offset:2px;} /* ---- outlined secondary ---- */ body.sh-acct .woocommerce-Address-title a.edit, body.sh-acct .woocommerce-info .button, body.sh-acct .woocommerce-pagination .button{ background-color:#FFFFFF;color:var(--sh-primary);border:1px solid var(--sh-border);} body.sh-acct .woocommerce-Address-title a.edit:hover, body.sh-acct .woocommerce-info .button:hover, body.sh-acct .woocommerce-pagination .button:hover{ background-color:var(--sh-cream);border-color:var(--sh-primary);color:var(--sh-primary);} /* ============================================================ FORM CONTROLS - approved Checkout field language ============================================================ */ body.sh-acct .sh-acct__body .form-row{display:block;float:none;width:auto;margin:0 0 16px;padding:0;} body.sh-acct .sh-acct__body .form-row > label{display:block;margin:0 0 7px; font-family:var(--sh-body);font-size:12.5px;font-weight:500;color:var(--sh-accent);} body.sh-acct .sh-acct__body .form-row > label .required{ color:var(--sh-primary);text-decoration:none;border:0;margin-left:2px;} body.sh-acct .sh-acct__body .form-row > label .optional{opacity:.72;} body.sh-acct .sh-acct__body input[type="text"], body.sh-acct .sh-acct__body input[type="email"], body.sh-acct .sh-acct__body input[type="password"], body.sh-acct .sh-acct__body input[type="tel"], body.sh-acct .sh-acct__body input[type="number"], body.sh-acct .sh-acct__body select, body.sh-acct .sh-acct__body textarea{ display:block;width:100%;min-height:46px;padding:11px 13px; background:#FFFFFF;border:1px solid var(--sh-border);border-radius:4px; font-family:var(--sh-body);font-size:14px;line-height:1.4;color:var(--sh-text); box-shadow:none;outline:none;-webkit-appearance:none;appearance:none;} body.sh-acct .sh-acct__body textarea{min-height:92px;resize:vertical;} body.sh-acct .sh-acct__body input::placeholder, body.sh-acct .sh-acct__body textarea::placeholder{color:#A8977F;} body.sh-acct .sh-acct__body input[type="text"]:focus, body.sh-acct .sh-acct__body input[type="email"]:focus, body.sh-acct .sh-acct__body input[type="password"]:focus, body.sh-acct .sh-acct__body input[type="tel"]:focus, body.sh-acct .sh-acct__body input[type="number"]:focus, body.sh-acct .sh-acct__body select:focus, body.sh-acct .sh-acct__body textarea:focus{ border-color:var(--sh-primary);box-shadow:0 0 0 3px rgba(162,69,34,.10);} body.sh-acct .woocommerce-invalid input[type="text"], body.sh-acct .woocommerce-invalid input[type="email"], body.sh-acct .woocommerce-invalid input[type="password"], body.sh-acct .woocommerce-invalid select{border-color:var(--sh-error);} /* password reveal control, aligned as on Checkout */ body.sh-acct .sh-acct__body .password-input{display:block;position:relative;} body.sh-acct .sh-acct__body .show-password-input{ position:absolute;top:0;right:0;width:44px;height:100%; background:none;border:0;cursor:pointer;} body.sh-acct .sh-acct__body .password-input input{padding-right:48px;} /* select2 (used by the address forms) */ body.sh-acct .sh-acct__body .select2-container .select2-selection--single{ height:46px;border:1px solid var(--sh-border);border-radius:4px;background:#FFFFFF;} body.sh-acct .sh-acct__body .select2-container .select2-selection--single .select2-selection__rendered{ line-height:44px;padding:0 34px 0 13px;font-size:14px;color:var(--sh-text);} body.sh-acct .sh-acct__body .select2-container .select2-selection--single .select2-selection__arrow{ height:44px;right:8px;} /* ============================================================ DASHBOARD ============================================================ */ body.sh-acct .sh-acct-welcome{ background:#FFFFFF;border:1px solid var(--sh-border);border-radius:4px;padding:26px 28px;} body.sh-acct .sh-acct-welcome p{margin:0 0 10px;font-size:14.5px;line-height:1.65;color:var(--sh-accent);} body.sh-acct .sh-acct-welcome p:last-child{margin-bottom:0;} body.sh-acct .sh-acct-welcome p:first-child{ font-family:var(--sh-display);font-size:23px;font-weight:600;line-height:1.3;color:var(--sh-text);} body.sh-acct .sh-acct-welcome p:first-child strong{font-weight:600;} body.sh-acct .sh-acct-welcome a{color:var(--sh-primary);text-decoration:none; border-bottom:1px solid rgba(162,69,34,.4);} body.sh-acct .sh-acct-welcome a:hover{color:var(--sh-secondary);} body.sh-acct .sh-acct-cards{ display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:20px;} body.sh-acct .sh-acct-card{ display:block;background:#FFFFFF;border:1px solid var(--sh-border);border-radius:4px; padding:20px 22px;text-decoration:none; transition:border-color .18s ease,background-color .18s ease;} body.sh-acct .sh-acct-card:hover{border-color:var(--sh-primary);background:var(--sh-cream);} body.sh-acct .sh-acct-card:focus-visible{outline:2px solid var(--sh-primary);outline-offset:2px;} body.sh-acct .sh-acct-card__title{display:block;font-family:var(--sh-body);font-size:11.5px; font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--sh-secondary);} body.sh-acct .sh-acct-card__text{display:block;margin-top:8px;font-size:13.5px; line-height:1.55;color:var(--sh-accent);} body.sh-acct .sh-acct-card__go{display:block;margin-top:12px;font-size:11px;font-weight:700; letter-spacing:.14em;text-transform:uppercase;color:var(--sh-primary);} /* ============================================================ ORDERS / PAYMENT METHODS TABLES ============================================================ */ body.sh-acct .woocommerce-MyAccount-content table.shop_table{ width:100%;margin:0;background:#FFFFFF;border:1px solid var(--sh-border); border-radius:4px;border-collapse:separate;border-spacing:0;overflow:hidden;} body.sh-acct .woocommerce-MyAccount-content table.shop_table thead th{ padding:14px 18px;text-align:left;background:var(--sh-cream); border:0;border-bottom:1px solid var(--sh-border); font-family:var(--sh-body);font-size:11px;font-weight:700;letter-spacing:.14em; text-transform:uppercase;color:var(--sh-accent);} body.sh-acct .woocommerce-MyAccount-content table.shop_table tbody th, body.sh-acct .woocommerce-MyAccount-content table.shop_table tbody td{ padding:16px 18px;border:0;border-bottom:1px solid var(--sh-border); font-size:14px;font-weight:400;color:var(--sh-secondary);vertical-align:middle;} body.sh-acct .woocommerce-MyAccount-content table.shop_table tbody tr:last-child th, body.sh-acct .woocommerce-MyAccount-content table.shop_table tbody tr:last-child td{border-bottom:0;} body.sh-acct .woocommerce-MyAccount-content table.shop_table a{ color:var(--sh-primary);text-decoration:none;} body.sh-acct .woocommerce-MyAccount-content table.shop_table a:hover{color:var(--sh-secondary);} body.sh-acct .woocommerce-MyAccount-content table.shop_table .button{ min-height:38px;padding:9px 16px;font-size:11px;letter-spacing:.12em;} body.sh-acct .woocommerce-pagination{margin-top:20px;display:flex;gap:10px;} /* Payment Methods: generic account-surface presentation only. */ body.sh-acct--payment-methods .woocommerce-MyAccount-content > .button{margin-top:20px;} /* ============================================================ ADDRESSES ============================================================ */ body.sh-acct .woocommerce-Addresses{ display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;} body.sh-acct .woocommerce-Addresses::before, body.sh-acct .woocommerce-Addresses::after{display:none;} body.sh-acct .woocommerce-Address{ float:none;width:auto;background:#FFFFFF;border:1px solid var(--sh-border); border-radius:4px;padding:24px 26px;} body.sh-acct .woocommerce-Address-title{ display:flex;align-items:center;justify-content:space-between;gap:14px; margin:0 0 16px;padding:0;border:0;} body.sh-acct .woocommerce-Address-title h2{ margin:0;font-family:var(--sh-display);font-size:21px;font-weight:600; letter-spacing:.03em;text-transform:capitalize;color:var(--sh-text);line-height:1.25;} body.sh-acct .woocommerce-Address-title a.edit{ flex:none;min-height:38px;padding:9px 16px;font-size:10.5px;letter-spacing:.12em;} body.sh-acct .woocommerce-Address address{ margin:0;font-style:normal;font-size:14.5px;line-height:1.75;color:var(--sh-accent);} /* add / edit address form */ body.sh-acct .woocommerce-address-fields{ background:#FFFFFF;border:1px solid var(--sh-border);border-radius:4px;padding:26px 28px 10px;} body.sh-acct .woocommerce-address-fields__field-wrapper{ display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:18px;} body.sh-acct .woocommerce-address-fields__field-wrapper > .form-row-wide{grid-column:1 / -1;} body.sh-acct .woocommerce-address-fields .clear{display:none;} body.sh-acct .woocommerce-address-fields p:last-child{margin-bottom:16px;} /* ============================================================ ACCOUNT DETAILS ============================================================ */ body.sh-acct .sh-acct-fs{ background:#FFFFFF;border:1px solid var(--sh-border);border-radius:4px; padding:26px 28px 10px; display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:18px;} body.sh-acct .sh-acct-fs__title{ grid-column:1 / -1;margin:0 0 18px;font-family:var(--sh-display);font-size:20px; font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--sh-text);line-height:1.25;} body.sh-acct .sh-acct-fs .form-row-wide{grid-column:1 / -1;} body.sh-acct .sh-acct-fs .form-row-first{grid-column:1;} body.sh-acct .sh-acct-fs .form-row-last{grid-column:2;} body.sh-acct .sh-acct-fs .clear{display:none;} body.sh-acct #account_display_name_description em{ display:block;margin-top:7px;font-style:normal;font-size:12.5px;line-height:1.5;color:var(--sh-accent);} body.sh-acct .woocommerce-EditAccountForm fieldset{ margin:20px 0 0;padding:26px 28px 10px;background:#FFFFFF; border:1px solid var(--sh-border);border-radius:4px;} body.sh-acct .woocommerce-EditAccountForm fieldset legend{ float:none;width:auto;margin:0 0 18px;padding:0; font-family:var(--sh-display);font-size:20px;font-weight:600;letter-spacing:.06em; text-transform:uppercase;color:var(--sh-text);line-height:1.25;} body.sh-acct .woocommerce-EditAccountForm > .clear{display:none;} body.sh-acct .woocommerce-EditAccountForm > p:last-of-type{margin:24px 0 0;} /* ============================================================ LOGIN / REGISTER (logged-out) ============================================================ */ body.sh-acct #customer_login{ display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;align-items:stretch;} body.sh-acct #customer_login::before, body.sh-acct #customer_login::after{display:none;} body.sh-acct #customer_login > div{ float:none;width:auto;display:flex;flex-direction:column; background:#FFFFFF;border:1px solid var(--sh-border);border-radius:4px;padding:30px 32px;} body.sh-acct #customer_login h2{ margin:0 0 22px;font-family:var(--sh-display);font-size:24px;font-weight:600; letter-spacing:.08em;text-transform:uppercase;color:var(--sh-text);line-height:1.2;} body.sh-acct #customer_login form{margin:0;padding:0;border:0;display:flex;flex-direction:column;flex:1 1 auto;} body.sh-acct form.woocommerce-form-login p.form-row:not(.woocommerce-form-row), body.sh-acct form.woocommerce-form-register p.form-row:not(.form-row-wide){ display:flex;flex-direction:column;align-items:flex-start;gap:14px;margin:4px 0 0;} body.sh-acct .woocommerce-form-login__rememberme{ display:inline-flex;align-items:center;gap:9px;width:-moz-fit-content;width:fit-content; margin:0;font-size:13px;font-weight:500;color:var(--sh-secondary);cursor:pointer;} body.sh-acct .woocommerce-form-login__rememberme input[type="checkbox"]{ flex:none;width:16px;height:16px;min-height:0;margin:0;accent-color:var(--sh-primary);} body.sh-acct .woocommerce-LostPassword{margin:16px 0 0;font-size:13px;} body.sh-acct .woocommerce-LostPassword a{ color:var(--sh-primary);text-decoration:none;border-bottom:1px solid rgba(162,69,34,.45);} body.sh-acct .woocommerce-LostPassword a:hover{color:var(--sh-secondary);} body.sh-acct .woocommerce-form-register > p{font-size:13.5px;line-height:1.6;color:var(--sh-accent);} body.sh-acct .woocommerce-privacy-policy-text{margin-top:6px;} body.sh-acct .woocommerce-privacy-policy-text p{ margin:0;font-size:12.5px;line-height:1.6;color:var(--sh-accent);} body.sh-acct .woocommerce-privacy-policy-text a{color:var(--sh-primary);} /* ============================================================ LOST PASSWORD ============================================================ */ body.sh-acct form.woocommerce-ResetPassword{ max-width:640px;margin:0 auto;background:#FFFFFF; border:1px solid var(--sh-border);border-radius:4px;padding:32px 34px 22px;} body.sh-acct form.woocommerce-ResetPassword > p:first-child{ margin:0 0 24px;font-size:14.5px;line-height:1.65;color:var(--sh-accent);} body.sh-acct form.woocommerce-ResetPassword .form-row-first{float:none;width:auto;} body.sh-acct form.woocommerce-ResetPassword .clear{display:none;} body.sh-acct form.woocommerce-ResetPassword p.form-row:last-of-type{margin:22px 0 0;} /* ============================================================ TABLET (<= 1024) ============================================================ */ @media (max-width:1024px){ body.sh-acct--auth .sh-acct__body > .woocommerce{display:block;} body.sh-acct .woocommerce-MyAccount-navigation{margin:0 0 28px;} body.sh-acct .woocommerce-MyAccount-navigation ul{ display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px; background:transparent;border:0;border-radius:0;overflow:visible;} body.sh-acct .woocommerce-MyAccount-navigation li, body.sh-acct .woocommerce-MyAccount-navigation li + li{ background:#FFFFFF;border:1px solid var(--sh-border);border-radius:3px;} body.sh-acct .woocommerce-MyAccount-navigation li a{ justify-content:center;text-align:center;min-height:48px;padding:12px 10px; font-size:10.5px;letter-spacing:.1em;} body.sh-acct .woocommerce-MyAccount-navigation li.is-active > a{ box-shadow:inset 0 -3px 0 var(--sh-primary);} body.sh-acct .woocommerce-MyAccount-navigation-link--customer-logout{ background:var(--sh-cream);} body.sh-acct #customer_login{grid-template-columns:minmax(0,1fr);} body.sh-acct .woocommerce-Addresses{grid-template-columns:minmax(0,1fr);} } /* ============================================================ MOBILE (<= 600) ============================================================ */ @media (max-width:600px){ body.sh-acct .sh-acct-hero__inner{padding:34px 18px 30px;} body.sh-acct .sh-acct__body{padding:30px 18px 58px;} body.sh-acct .woocommerce-MyAccount-navigation ul{grid-template-columns:repeat(2,minmax(0,1fr));} body.sh-acct .sh-acct-cards{grid-template-columns:minmax(0,1fr);} body.sh-acct .sh-acct-welcome{padding:22px 20px;} body.sh-acct .sh-acct-welcome p:first-child{font-size:21px;} body.sh-acct .sh-acct-fs, body.sh-acct .woocommerce-EditAccountForm fieldset, body.sh-acct .woocommerce-address-fields{grid-template-columns:minmax(0,1fr);padding:22px 20px 6px;} body.sh-acct .woocommerce-address-fields__field-wrapper{grid-template-columns:minmax(0,1fr);} body.sh-acct #customer_login > div{padding:24px 20px;} body.sh-acct form.woocommerce-ResetPassword{padding:24px 20px 14px;} body.sh-acct .woocommerce-Address{padding:20px;} body.sh-acct .woocommerce-Address-title{flex-direction:column;align-items:flex-start;gap:12px;} body.sh-acct .woocommerce-Address-title a.edit{width:100%;min-height:48px;} body.sh-acct .sh-acct__body .button, body.sh-acct .sh-acct__body .woocommerce-Button, body.sh-acct .sh-acct__body button[type="submit"], body.sh-acct .sh-acct__body input[type="submit"], body.sh-acct .sh-acct-empty__cta{width:100%;min-height:48px;} body.sh-acct .woocommerce-info, body.sh-acct .woocommerce-message, body.sh-acct .woocommerce-error{padding:16px;} body.sh-acct .woocommerce-info:has(.sh-acct-empty){padding:40px 20px;} body.sh-acct .sh-acct-empty__title{font-size:24px;} /* WooCommerce stacks its responsive account tables here; keep it readable. */ body.sh-acct .woocommerce-MyAccount-content table.shop_table tbody th, body.sh-acct .woocommerce-MyAccount-content table.shop_table tbody td{ padding:12px 16px;text-align:right;} body.sh-acct .woocommerce-MyAccount-content table.shop_table tbody td::before{ float:left;font-size:11px;font-weight:700;letter-spacing:.1em; text-transform:uppercase;color:var(--sh-accent);} body.sh-acct .woocommerce-MyAccount-content table.shop_table tbody tr{ display:block;border-bottom:1px solid var(--sh-border);} body.sh-acct .woocommerce-MyAccount-content table.shop_table tbody tr:last-child{border-bottom:0;} body.sh-acct .woocommerce-MyAccount-content table.shop_table .button{width:auto;min-height:38px;} } /* ========================================================== sh-acct-guest-targets: touch-target sizing for logged-out forms ========================================================= */ body.sh-acct .woocommerce-form-login__rememberme{ display:flex; align-items:center; gap:10px; min-height:44px; margin:0 0 4px; cursor:pointer; } body.sh-acct .woocommerce-form-login__rememberme input[type="checkbox"]{ width:20px; height:20px; margin:0; flex:0 0 20px; accent-color:#A24522; cursor:pointer; } body.sh-acct .woocommerce-form-login__rememberme span{ font-family:'Manrope',sans-serif; font-size:14px; line-height:1.4; color:#4E341B; } body.sh-acct .woocommerce-LostPassword{ margin:6px 0 0; } body.sh-acct .woocommerce-LostPassword a{ display:inline-flex; align-items:center; min-height:44px; padding:0 2px; font-family:'Manrope',sans-serif; font-size:14px; color:#A24522; text-decoration:underline; text-underline-offset:3px; } body.sh-acct .woocommerce-LostPassword a:hover{ color:#8C3A1B; } /* sh-acct-pwd-align: neutralise the inherited translateY on the reveal control */ body.sh-acct .sh-acct__body .password-input .show-password-input{ top:0; bottom:auto; transform:none; display:flex; align-items:center; justify-content:center; padding:0; } /* sh-acct-cta-contrast: the empty-state CTA sits inside a notice whose link colour rule would otherwise paint the label the same terracotta as the button fill, leaving it unreadable. */ body.sh-acct .sh-acct__body .woocommerce-info a.sh-acct-empty__cta, body.sh-acct .sh-acct__body .woocommerce-message a.sh-acct-empty__cta, body.sh-acct .sh-acct__body a.sh-acct-empty__cta{ color:#FFFFFF; } body.sh-acct .sh-acct__body .woocommerce-info a.sh-acct-empty__cta:hover, body.sh-acct .sh-acct__body a.sh-acct-empty__cta:hover, body.sh-acct .sh-acct__body a.sh-acct-empty__cta:focus{ color:#FFFFFF; background:#8C3A1B; } /* ============================================================ FINAL POLISH (sh-acct-polish) - presentation only ============================================================ */ /* ---- Addresses overview ----------------------------------- WooCommerce col2-set float rules outrank the base grid, so each card collapsed to 48% of its own track and the action escaped the card box. These selectors raise specificity above them. */ body.sh-acct .sh-acct__body .woocommerce-Addresses{ display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;} body.sh-acct .sh-acct__body .woocommerce-Addresses::before, body.sh-acct .sh-acct__body .woocommerce-Addresses::after{display:none;} body.sh-acct .sh-acct__body .woocommerce-Addresses .col-1, body.sh-acct .sh-acct__body .woocommerce-Addresses .col-2, body.sh-acct .sh-acct__body .woocommerce-Addresses .woocommerce-Address{ float:none;width:auto;max-width:none;margin:0;} body.sh-acct .sh-acct__body .woocommerce-Address{ display:flex;flex-direction:column;background:#FFFFFF; border:1px solid var(--sh-border);border-radius:4px;padding:26px 28px;} body.sh-acct .sh-acct__body .woocommerce-Address-title{ display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:space-between; gap:14px 16px;margin:0 0 16px;padding:0;border:0;} body.sh-acct .sh-acct__body .woocommerce-Address-title h2{ flex:1 1 auto;min-width:0;margin:0;line-height:1.25;} body.sh-acct .sh-acct__body .woocommerce-Address-title a.edit{ float:none;flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center; min-height:40px;padding:9px 16px;white-space:nowrap; font-family:var(--sh-body);font-size:10.5px;font-weight:600;letter-spacing:.12em; text-transform:uppercase;text-decoration:none;border-radius:4px;} body.sh-acct .sh-acct__body .woocommerce-Address address{margin:0;} /* ---- Billing / Shipping edit form -------------------------- */ body.sh-acct--edit-address .sh-acct__body .woocommerce-MyAccount-content > form > h2{ display:none;} body.sh-acct .sh-acct__body .woocommerce-address-fields{ background:#FFFFFF;border:1px solid var(--sh-border);border-radius:4px; padding:26px 28px 22px;} body.sh-acct .sh-acct__body .sh-acct-fs__title--address{margin:0 0 20px;} body.sh-acct .sh-acct__body .woocommerce-address-fields__field-wrapper{ display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:18px;} body.sh-acct .sh-acct__body .woocommerce-address-fields__field-wrapper > .form-row{ grid-column:1 / -1;} body.sh-acct .sh-acct__body .woocommerce-address-fields__field-wrapper > .form-row-first{ grid-column:1;} body.sh-acct .sh-acct__body .woocommerce-address-fields__field-wrapper > .form-row-last{ grid-column:2;} body.sh-acct .sh-acct__body .woocommerce-address-fields__field-wrapper > .clear{display:none;} body.sh-acct .sh-acct__body .woocommerce-address-fields .woocommerce-input-wrapper > strong{ display:flex;align-items:center;min-height:46px; font-family:var(--sh-body);font-size:14.5px;font-weight:500;color:var(--sh-text);} body.sh-acct .sh-acct__body .woocommerce-address-fields > p:last-child{ margin:22px 0 0;padding-top:22px;border-top:1px solid var(--sh-border);} /* ---- Login: remember-me row -------------------------------- */ body.sh-acct .sh-acct__body .woocommerce-form-login__rememberme{ display:flex;align-items:center;gap:10px;min-height:44px;margin:0 0 6px; line-height:1.2;cursor:pointer;} body.sh-acct .sh-acct__body .woocommerce-form-login__rememberme input[type=checkbox]{ width:20px;height:20px;flex:0 0 20px;margin:0;padding:0;position:static; align-self:center;vertical-align:middle;accent-color:var(--sh-primary);cursor:pointer;} body.sh-acct .sh-acct__body .woocommerce-form-login__rememberme span{ display:block;line-height:1.2;font-family:var(--sh-body);font-size:14px; color:var(--sh-accent);} /* ---- Account details: change-password heading -------------- A legend is painted into the fieldset border by default. Taking it out of flow removes that behaviour so it reads as a section heading inside the card, matching Personal Information. */ body.sh-acct .sh-acct__body .woocommerce-EditAccountForm fieldset{ position:relative;padding:69px 28px 10px;} body.sh-acct .sh-acct__body .woocommerce-EditAccountForm fieldset > legend{ position:absolute;top:26px;left:28px;right:28px; float:none;width:auto;margin:0;padding:0;} @media (max-width:1024px){ body.sh-acct .sh-acct__body .woocommerce-Addresses{ grid-template-columns:minmax(0,1fr);gap:20px;} } @media (max-width:600px){ body.sh-acct .sh-acct__body .woocommerce-Address{padding:22px 20px;} body.sh-acct .sh-acct__body .woocommerce-Address-title{ flex-direction:column;align-items:stretch;gap:14px;} body.sh-acct .sh-acct__body .woocommerce-Address-title a.edit{ width:100%;min-height:48px;} body.sh-acct .sh-acct__body .woocommerce-address-fields{padding:22px 20px 18px;} body.sh-acct .sh-acct__body .woocommerce-address-fields__field-wrapper{ grid-template-columns:minmax(0,1fr);} body.sh-acct .sh-acct__body .woocommerce-EditAccountForm fieldset{ padding:65px 20px 6px;} body.sh-acct .sh-acct__body .woocommerce-EditAccountForm fieldset > legend{ top:22px;left:20px;right:20px;} } /* ============================================================ sh-acct-polish-2 The remember-me label loses the cascade to a later third-party sheet, so the three layout properties that make the row align are forced here. Behaviour of the native checkbox is unchanged. ============================================================ */ body.sh-acct .sh-acct__body label.woocommerce-form-login__rememberme{ display:flex !important;align-items:center !important;gap:10px; min-height:44px;margin:0 0 6px;padding:0;line-height:1.2;cursor:pointer;} body.sh-acct .sh-acct__body label.woocommerce-form-login__rememberme > input[type=checkbox]{ width:20px !important;height:20px !important;flex:0 0 20px; margin:0 !important;padding:0;align-self:center; accent-color:var(--sh-primary);cursor:pointer;} body.sh-acct .sh-acct__body label.woocommerce-form-login__rememberme > span{ display:block;line-height:1.2;font-family:var(--sh-body);font-size:14px; color:var(--sh-accent);} /* A single-country store renders Country / Region as a static, non interactive control. Match it to the field language rather than leaving it as the 16px bold default. */ body.sh-acct .sh-acct__body .woocommerce-address-fields select.country_to_state--single{ font-family:var(--sh-body);font-size:14.5px;font-weight:500;line-height:1.4; height:auto;min-height:0;padding:0;color:var(--sh-text);} /* ============================================================ sh-acct-polish-3 The address card header ends with a whitespace text node that Chrome lays out as a trailing flex item, so space-between left the action one gap short of the card edge. Explicit margin puts it flush with the card padding instead. ============================================================ */ body.sh-acct .sh-acct__body .woocommerce-Address-title{ justify-content:flex-start;gap:0;} body.sh-acct .sh-acct__body .woocommerce-Address-title a.edit{ margin-left:16px;} @media (max-width:600px){ body.sh-acct .sh-acct__body .woocommerce-Address-title a.edit{ margin-left:0;margin-top:14px;} } /* ============================================================ sh-acct-polish-4 Below 600px the section grids collapse to one column, but the first/last column assignments survived and forced an implicit second track, squeezing the paired rows. Reset them to span. ============================================================ */ @media (max-width:600px){ body.sh-acct .sh-acct__body .woocommerce-address-fields__field-wrapper > .form-row-first, body.sh-acct .sh-acct__body .woocommerce-address-fields__field-wrapper > .form-row-last, body.sh-acct .sh-acct__body .sh-acct-fs .form-row-first, body.sh-acct .sh-acct__body .sh-acct-fs .form-row-last{ grid-column:1 / -1;} } /* ============================================================ sh-acct-ma17 - Phase-1 My Account completion Presentation only. Adds no layout system and overrides no native WooCommerce behaviour. ============================================================ */ /* ---- Lost Password: return link --------------------------- Rendered after the form, so it is matched to the same 640px card measure and centred under it. */ body.sh-acct .sh-acct__body .sh-acct-back{ max-width:640px;margin:16px auto 0;padding:0;text-align:center;} body.sh-acct .sh-acct__body .sh-acct-back__link{ display:inline-flex;align-items:center;justify-content:center;gap:9px; min-height:44px;padding:0 6px; font-family:var(--sh-body);font-size:14px;font-weight:500;line-height:1.2; color:var(--sh-primary);text-decoration:underline;text-underline-offset:3px;} body.sh-acct .sh-acct__body .sh-acct-back__link:hover{color:var(--sh-secondary);} body.sh-acct .sh-acct__body .sh-acct-back__link:focus-visible{ outline:2px solid var(--sh-primary);outline-offset:2px;border-radius:3px;} body.sh-acct .sh-acct__body svg.sh-acct-back__arrow{ flex:0 0 auto;display:block;width:15px;height:15px; color:currentColor;overflow:visible;} /* ---- Password reveal: focus ring --------------------------- WooCommerce builds this control as a real