/* Account styles are loaded only by customer layout handles. */
body.hh-customer-page, .hh-customer-page .page-wrapper { background: var(--color-surface); color: var(--color-fg); }
.hh-customer-page #maincontent { color: var(--color-fg); max-width:1440px; padding:48px 24px 72px; margin:auto; font-family:var(--font-sans,Barlow,system-ui,sans-serif); }
.hh-customer-page #maincontent .page-title-wrapper { margin-bottom:32px; }
.hh-customer-page #maincontent h1 { color: var(--color-fg); font-family:var(--font-display,'Barlow Condensed',sans-serif); font-size:clamp(36px,4vw,56px); line-height:1.05; font-weight:700; text-transform:uppercase; letter-spacing:-.01em; }
.hh-customer-page #maincontent :is(h2,h3,legend) { color: var(--color-fg); }
.hh-customer-page #maincontent h2 { font-family:var(--font-display); font-size:28px; line-height:1.2; font-weight:600; text-transform:uppercase; }
.hh-customer-page #maincontent h3 { font-family:var(--font-display); font-size:24px; font-weight:600; }
.hh-customer-page #maincontent :is(p,address) { color: var(--color-fg-secondary); line-height:1.7; font-style:normal; overflow-wrap:anywhere; }
.hh-customer-page #maincontent .card { background: var(--color-surface); border: 1px solid var(--color-line); color: var(--color-fg); border-radius:18px; padding:28px; box-shadow:none; }
.hh-customer-page #maincontent :is(.bg-white,.bg-gray-50,.bg-gray-100) { background-color: var(--color-surface); }
.hh-customer-page #maincontent :is(.text-gray-900,.text-gray-800,.text-gray-700) { color: var(--color-fg); }
.hh-customer-page #maincontent :is(.text-gray-600,.text-gray-500) { color: var(--color-fg-secondary); }
.hh-customer-page #maincontent :is(.border-gray-200,.border-gray-300) { border-color: var(--color-line); }
.hh-customer-page #maincontent a { color: var(--color-accent-ink); text-underline-offset:4px; }
.hh-customer-page #maincontent a:hover { color: var(--color-accent-ink); }
.hh-customer-page #maincontent :is(.label,.field > label) { display:block; margin-bottom:8px; font-size:14px; font-weight:500; color: var(--color-fg-secondary); }
.hh-customer-page #maincontent .field { margin-bottom:24px; min-width:0; }
.hh-customer-page #maincontent :is(.form-input,.form-select,textarea) { width:100%; max-width:100%; min-width:0; min-height:52px; background-color: var(--color-surface); color: var(--color-fg); border: 1px solid var(--color-line); border-radius:10px; padding:12px 14px; font-size:16px; line-height:1.5; box-shadow:none; }
.hh-customer-page #maincontent :is(.form-input,.form-select,textarea)::placeholder { color: var(--color-fg-secondary); opacity:1; }
.hh-customer-page #maincontent :is(.form-input,.form-select,textarea):focus { border-color: var(--color-primary); outline:2px solid var(--color-primary); outline-offset:3px; box-shadow:none; }
.hh-customer-page #maincontent input:-webkit-autofill { -webkit-text-fill-color:var(--color-fg); box-shadow:0 0 0 1000px var(--color-surface) inset; }
.hh-customer-page #maincontent :is(input[type=checkbox],input[type=radio]) { accent-color:var(--color-primary); color: var(--color-accent-ink); border-color: var(--color-line); background-color: var(--color-surface); flex-shrink:0; }
.hh-customer-page #maincontent .field.choice { display:flex; align-items:flex-start; gap:10px; }
.hh-customer-page #maincontent .field.choice input { margin-top:5px; }
.hh-customer-page #maincontent .field.choice .label { margin:0; }
.hh-customer-page #maincontent :is(.btn-primary,.action.primary) { background: var(--color-primary); background-image: none !important; color: var(--color-on-primary); border: 1px solid var(--color-primary); min-height:52px; padding:12px 24px; border-radius:10px; box-shadow:none; font-family:var(--font-display); font-size:18px; font-weight:600; text-transform:uppercase; letter-spacing:.04em; justify-content:center; }
.hh-customer-page #maincontent :is(.btn-primary,.action.primary):hover { background: var(--color-primary-darker); color: var(--color-on-primary); transform:none; }
.hh-customer-page #maincontent .btn-secondary { background: transparent; border: 1px solid var(--color-line); color: var(--color-fg); min-height:48px; border-radius:10px; }
.hh-customer-page #maincontent .actions-toolbar { display:flex; flex-wrap:wrap; gap:20px; align-items:center; border-color: var(--color-line); }
.hh-customer-page #maincontent :is(button,a,input,select,textarea):focus-visible { outline:2px solid var(--color-primary); outline-offset:3px; }
.hh-customer-page #maincontent :is(.text-red,.text-red-500,.field-error,.mage-error) { color: var(--color-error-ink); }
.hh-customer-page #maincontent [aria-invalid=true] { border-color: #ff8585; }
.hh-customer-page #maincontent .password-strength-meter { color: var(--color-fg-secondary); font-size:13px; line-height:1.5; }
.hh-customer-page #maincontent .control.flex:has(input[type=password]),
.hh-customer-page #maincontent .control.flex:has(input[autocomplete=current-password]),
.hh-customer-page #maincontent .control.flex:has(input[autocomplete=new-password]) { width:100%; gap:8px; }
.hh-customer-page #maincontent .control.flex > .form-input { flex:1; width:0; }
.hh-customer-page #maincontent .control.flex > button[type=button] { flex-shrink:0; min-width:44px; min-height:52px; padding:12px; color: var(--color-fg-secondary); border-radius:10px; background: var(--color-surface); }
.hh-customer-page #maincontent .control.flex > button[type=button]:hover { color: var(--color-accent-ink); }
/* Authentication pages have their own width, leaving the account dashboard spacious. */
.hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent { max-width:1160px; }
.hh-customer-page #customer-login-container { display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr); gap:24px; align-items:start; }
.hh-customer-page #customer-login-container > .card { margin:0; padding:36px; }
.hh-customer-page #customer-login-container .block-new-customer { background: var(--color-surface); border-color: var(--color-line); }
.hh-customer-page #customer-login-container .block-new-customer .block-title::before { content:'NEW HERE?'; display:block; color: var(--color-accent-ink); font-size:12px; font-weight:600; letter-spacing:.14em; margin-bottom:16px; }
.hh-customer-page #customer-login-container .block-new-customer p { margin-top:16px; }
.hh-customer-page #customer-login-container .block-new-customer .actions-toolbar { margin-top:12px; }
.hh-customer-page #customer-login-form .actions-toolbar { align-items:flex-start; flex-direction:column; }
.hh-customer-page #customer-login-form .btn-primary { width:100%; }
.hh-customer-page #maincontent .form-create-account > .md\:grid { gap:24px; align-items:start; }
.hh-customer-page #maincontent .form-create-account fieldset.card { margin:0 0 24px; padding:32px; }
.hh-customer-page #maincontent .form-create-account legend { font-family:var(--font-display); font-size:26px; font-weight:600; text-transform:uppercase; }
.hh-customer-page #maincontent .form-create-account .field-name-firstname { margin-top:20px; }
.hh-customer-page #maincontent .form-create-account .fieldset > .field { margin-top:20px; }
.hh-customer-page #maincontent .form-create-account .actions-toolbar { padding-top:8px; }
/* Keep the existing Hyva account menu and its mobile disclosure behaviour. */
.hh-customer-page #maincontent .account-nav { padding:20px; }
.hh-customer-page #maincontent #account-nav-title { min-height:48px; color: var(--color-fg); font-family:var(--font-display); font-size:22px; font-weight:600; }
.hh-customer-page #maincontent #account-nav { border-color: var(--color-line); }
.hh-customer-page #maincontent .account-nav .nav.items li { margin:4px 0; }
.hh-customer-page #maincontent .account-nav .nav.items :is(a,strong) { display:block; border-radius:8px; padding:12px; font-size:15px; color: var(--color-fg-secondary); overflow-wrap:anywhere; }
.hh-customer-page #maincontent .account-nav .nav.items a:hover { background: var(--color-surface); color: var(--color-accent-ink); }
.hh-customer-page #maincontent .account-nav .nav.items .current strong { background: var(--color-hide-deep); color: var(--color-accent-ink); border-left: 3px solid var(--color-primary); }
.hh-customer-page #maincontent .sidebar { min-width:0; }
.hh-customer-page #maincontent .column.main { min-width:0; }
.hh-customer-page #maincontent table { color: var(--color-fg-secondary); width:100%; border-color: var(--color-line); }
.hh-customer-page #maincontent :is(th,td) { border-color: var(--color-line); padding:14px 12px; }
.hh-customer-page #maincontent thead { background: var(--color-surface); color: var(--color-fg); }
.hh-customer-page #maincontent tbody tr { background: var(--color-surface); }
.hh-customer-page #maincontent tbody tr:nth-child(even) { background: var(--color-surface); }
.hh-customer-page #maincontent .table-wrapper { max-width:100%; overflow-x:auto; border: 1px solid var(--color-line); border-radius:12px; }
.hh-customer-page #maincontent .block-title.card { gap:16px; flex-wrap:wrap; }
.hh-customer-page #maincontent .block-title.card a { font-family:var(--font-sans); font-size:14px; font-weight:500; text-transform:none; }
.hh-customer-page #maincontent .pager { color: var(--color-fg-secondary); }
@media (max-width:767px) {
    .hh-customer-page #maincontent { padding:32px 16px 48px; }
    .hh-customer-page #maincontent .page-title-wrapper { margin-bottom:24px; }
    .hh-customer-page #customer-login-container { grid-template-columns:minmax(0,1fr); gap:20px; }
    .hh-customer-page #customer-login-container > .card,
    .hh-customer-page #maincontent .card,
    .hh-customer-page #maincontent .form-create-account fieldset.card { padding:24px 20px; border-radius:16px; }
    .hh-customer-page #maincontent .actions-toolbar { align-items:stretch; flex-direction:column; gap:16px; }
    .hh-customer-page #maincontent .actions-toolbar .btn { width:100%; }
    .hh-customer-page #maincontent .form-create-account > .md\:grid { display:block; }
    .hh-customer-page #maincontent .account-nav { padding:12px 16px; }
    .hh-customer-page #maincontent :is(h2,h3) { overflow-wrap:anywhere; }
    .hh-customer-page #maincontent .block-title.card { align-items:flex-start; flex-direction:column; }
}.hh-customer-page #maincontent { background: var(--color-surface); }
.hh-customer-page #maincontent .page-title { margin:0; text-align:left; }
.hh-customer-page #maincontent .page-title::after { margin:20px 0 0; }
.hh-customer-page #maincontent .columns { padding-top:0; }
.hh-customer-page #maincontent legend > span { color: var(--color-fg); }
.hh-customer-page #maincontent .block-new-customer::before { display:none; }
.hh-customer-page #maincontent h1.page-title { margin-bottom:32px; }
.hh-customer-page #maincontent .field-error .messages { color: var(--color-fg-secondary); margin-top:8px; font-size:13px; line-height:1.6; }

/* Modern authentication: deliberately local tokens from the approved design brief. */
.hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent {
    /* Let the shared main-content width rule follow this full-width auth layout. */
    --hh-page-width: none;
    --hh-auth-panel: #141210;
    --hh-auth-accent: #9a5a16;
    --hh-auth-border: #ddd6ca;
    --hh-auth-cream: #f8f5ef;
    --hh-auth-muted: #70685d;
    --color-fg: var(--color-ink);
    --color-fg-secondary: var(--hh-auth-muted);
    --color-surface: var(--color-white);
    --color-primary: var(--hh-auth-accent);
    --color-primary-darker: var(--color-saddle-deep, #4a2c18);
    --color-on-primary: var(--color-white);
    --color-accent-ink: var(--hh-auth-accent);
    width:100%; max-width:none; padding:0; margin:0; background:var(--color-surface);
}
.hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .columns { width:100%; max-width:none; margin:0; padding:0; }
.hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .column.main { padding:0; }
.hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .hh-auth-shell {
    display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); gap:0; align-items:stretch; width:100%; max-width:none; margin:0;
}
.hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .hh-auth-brand {
    display:flex; flex-direction:column; justify-content:center; min-width:0; padding:80px clamp(32px,5.6vw,88px); background:var(--hh-auth-panel); color:var(--color-hide);
}
.hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .hh-auth-brand-inner { width:100%; max-width:420px; margin-inline:auto; }
.hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .hh-auth-eyebrow { margin:0 0 28px; color:var(--color-sand); font-size:11px; font-weight:600; letter-spacing:.16em; line-height:1.6; }
.hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .hh-auth-headline { margin:0; color:var(--color-white); font-family:var(--font-display); font-size:clamp(46px,4.5vw,68px); font-weight:700; line-height:1; letter-spacing:-.01em; text-transform:uppercase; }
.hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .hh-auth-headline span { color:#c68b4e; }
.hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .hh-auth-intro { max-width:340px; margin:24px 0 0; color:var(--color-sand); font-size:16px; line-height:1.7; }
.hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .hh-auth-benefits { display:grid; gap:24px; margin:40px 0 0; padding:0; list-style:none; }
.hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .hh-auth-benefits li { display:flex; align-items:flex-start; gap:14px; }
.hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .hh-auth-benefit-icon { display:flex; align-items:center; justify-content:center; flex-shrink:0; width:40px; height:40px; border:1px solid var(--color-saddle-deep, #4a2c18); border-radius:12px; color:#c68b4e; background:color-mix(in srgb,var(--hh-auth-accent) 10%,transparent); }
.hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .hh-auth-benefits strong { display:block; color:var(--color-hide); font-size:16px; font-weight:500; }
.hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .hh-auth-benefits p { margin:4px 0 0; max-width:300px; color:var(--color-sand); font-size:14px; line-height:1.6; }
.hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .hh-auth-signature { margin:56px 0 0; padding-top:24px; border-top:1px solid var(--color-line-dark); color:var(--color-hide); font-family:var(--font-display); font-size:20px; font-weight:600; letter-spacing:.08em; }
.hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .hh-auth-signature span { display:block; margin-top:4px; color:var(--color-sand); font-family:var(--font-sans); font-size:12px; font-weight:400; letter-spacing:0; }
.hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .hh-auth-form { display:flex; align-items:center; justify-content:center; min-width:0; padding:64px 48px; background:var(--color-surface); }
.hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .hh-auth-form-inner { width:100%; max-width:420px; }
.hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .hh-auth-form--create .hh-auth-form-inner { max-width:560px; }
.hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .hh-auth-switch { display:flex; gap:4px; padding:5px; margin-bottom:36px; background:var(--hh-auth-cream); border:1px solid var(--hh-auth-border); border-radius:999px; }
.hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .hh-auth-switch a { display:flex; flex:1; align-items:center; justify-content:center; min-height:40px; padding:8px 12px; border-radius:999px; color:var(--hh-auth-muted); font-size:14px; font-weight:500; text-decoration:none; }
.hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .hh-auth-switch a[aria-current=page] { background:var(--color-primary); color:var(--color-on-primary); box-shadow:none; }
.hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .hh-auth-switch a:not([aria-current=page]):hover { color:var(--hh-auth-accent); }
.hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent h1.hh-auth-title { margin:0 0 10px; color:var(--color-fg); font-family:var(--font-display); font-size:40px; font-weight:600; line-height:1.05; text-transform:uppercase; }
.hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .hh-auth-subtitle { margin:0 0 32px; font-size:15px; line-height:1.6; }
.hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .hh-auth-fields { display:block; }
.hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent :is(.hh-auth-personal,.hh-auth-credentials,.fieldset.login) { min-width:0; padding:0; margin:0; border:0; }
.hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .field { margin:0 0 20px; }
.hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .label { margin:0 0 8px; color:var(--color-fg); font-size:14px; font-weight:500; line-height:1.5; }
.hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent :is(.form-input,.form-select) { height:54px; min-height:54px; padding:12px 16px; border:1.5px solid var(--hh-auth-border); border-radius:12px; background:var(--color-surface); color:var(--color-fg); font-size:16px; box-shadow:none; }
.hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .form-input:focus { border-color:var(--hh-auth-accent); outline:2px solid color-mix(in srgb,var(--hh-auth-accent) 25%,transparent); outline-offset:2px; }
.hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .hh-auth-label-row { display:flex; align-items:baseline; justify-content:space-between; gap:12px; }
.hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .hh-auth-label-row a { flex-shrink:0; font-size:13px; text-decoration:none; }
.hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .hh-auth-label-row a:hover { text-decoration:underline; }
.hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .control.hh-auth-password { position:relative; display:flex; width:100%; gap:0; }
.hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .hh-auth-password .form-input { width:100%; padding-right:72px; }
.hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .control.hh-auth-password > button { position:absolute; inset:1.5px 1.5px 1.5px auto; min-width:64px; min-height:0; padding:0 14px; border-radius:0 10px 10px 0; background:transparent; color:var(--hh-auth-accent); font-size:13px; font-weight:600; }
.hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .hh-auth-names { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 16px; }
.hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .hh-auth-names .field { margin-top:0; }
.hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .hh-auth-names :is(.field-name-prefix,.field-name-middlename,.field-name-suffix) { grid-column:1 / -1; }
.hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .field.choice { gap:10px; align-items:flex-start; }
.hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .field.choice .label { margin:0; font-weight:400; }
.hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent input[type=checkbox] { width:18px; height:18px; margin-top:2px; border:1.5px solid var(--hh-auth-border); border-radius:5px; accent-color:var(--hh-auth-accent); }
.hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent input[type=checkbox]:checked { background-color:var(--hh-auth-accent); border-color:var(--hh-auth-accent); }
.hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .field.hh-auth-newsletter { padding:16px; border:1px solid var(--hh-auth-border); border-radius:12px; background:var(--hh-auth-cream); }
.hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .hh-auth-newsletter .label { font-weight:500; }
.hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .hh-auth-newsletter small { display:block; margin-top:4px; color:var(--hh-auth-muted); font-size:12px; font-weight:400; line-height:1.6; }
.hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .hh-auth-credentials .flex.flex-wrap { gap:8px; }
.hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .hh-auth-credentials .self-center { width:100%; }
.hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .hh-auth-strength-track { height:4px; margin-bottom:8px; overflow:hidden; border-radius:999px; background:var(--hh-auth-border); }
.hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .hh-auth-strength-track span { display:block; height:100%; width:0; background:var(--hh-auth-accent); transition:width .2s; }
.hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .password-weak .hh-auth-strength-track span { width:25%; background:var(--color-error-ink, #b91c1c); }
.hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .password-medium .hh-auth-strength-track span { width:50%; }
.hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .password-strong .hh-auth-strength-track span { width:75%; }
.hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .password-very-strong .hh-auth-strength-track span { width:100%; }
.hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .password-strength-meter { font-size:12px; }
.hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .actions-toolbar { display:block; padding:4px 0 0; margin:0; border:0; }
.hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .actions-toolbar .primary { width:100%; }
.hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .btn-primary { width:100%; min-width:0; min-height:54px; border-radius:12px; background:var(--hh-auth-accent); color:var(--color-white); font-family:var(--font-display); font-size:18px; font-weight:600; letter-spacing:.08em; }
.hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .btn-primary:hover { background:var(--color-saddle-deep, #4a2c18); color:var(--color-white); }
.hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .hh-auth-alternate { margin:24px 0 0; text-align:center; font-size:14px; }
.hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .hh-auth-alternate a { font-weight:600; text-decoration:none; }
.hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .hh-auth-alternate a:hover { text-decoration:underline; }
.hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .hh-auth-secure { display:flex; align-items:center; justify-content:center; gap:8px; margin:28px 0 0; padding-top:24px; border-top:1px solid var(--hh-auth-border); color:var(--hh-auth-muted); font-size:12px; text-align:center; }
.hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .hh-auth-secure svg { flex-shrink:0; }
.hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .hh-auth-terms { margin:16px 0 0; font-size:12px; line-height:1.7; text-align:center; }
.hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent [aria-invalid=true] { border-color:var(--color-error-ink, #b91c1c); }
@media (max-width:767px) {
    .hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .hh-auth-shell { grid-template-columns:minmax(0,1fr); }
    .hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .hh-auth-brand { padding:28px 24px 24px; border-radius:0 0 24px 24px; }
    .hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .hh-auth-eyebrow { margin-bottom:14px; font-size:9px; letter-spacing:.12em; }
    .hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .hh-auth-headline { font-size:36px; line-height:1.02; }
    .hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent :is(.hh-auth-intro,.hh-auth-signature,.hh-auth-benefits p,.hh-auth-benefit-icon) { display:none; }
    .hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .hh-auth-benefits { display:flex; flex-wrap:wrap; gap:6px; margin-top:20px; }
    .hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .hh-auth-benefits li { padding:6px 9px; border:1px solid color-mix(in srgb,var(--color-sand) 30%,transparent); border-radius:999px; }
    .hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .hh-auth-benefits strong { font-size:10px; font-weight:400; white-space:nowrap; }
    .hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .hh-auth-form { padding:28px 24px 40px; }
    .hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .hh-auth-switch { margin-bottom:28px; }
    .hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent h1.hh-auth-title { font-size:34px; }
    .hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .hh-auth-subtitle { margin-bottom:24px; font-size:14px; }
    .hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .hh-auth-names { gap:0 12px; }
}
@media (prefers-reduced-motion:reduce) {
    .hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .hh-auth-strength-track span { transition:none; }
}

/* Keep sign-in and registration in the storefront's selected colour mode. */
.hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent {
    --hh-page-width: inherit;
    --color-fg: inherit;
    --color-fg-secondary: inherit;
    --color-surface: inherit;
    --color-primary: inherit;
    --color-primary-darker: inherit;
    --color-on-primary: inherit;
    --color-accent-ink: inherit;
    --hh-auth-panel: var(--color-ink);
    --hh-auth-accent: var(--color-primary);
    --hh-auth-border: var(--color-line);
    --hh-auth-cream: var(--color-soft);
    --hh-auth-muted: var(--color-fg-secondary);
    max-width: var(--hh-page-width);
    margin-inline: auto;
    padding: calc(var(--spacing) * 8) calc(var(--spacing) * 6) calc(var(--spacing) * 16);
    background: var(--color-bg);
}
.hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .hh-auth-shell {
    overflow: hidden;
    border: 1px solid var(--color-line);
    border-radius: var(--radius-xl);
}
.hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .hh-auth-brand {
    padding-block: calc(var(--spacing) * 16);
}
.hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .hh-auth-headline span,
.hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .hh-auth-benefit-icon {
    color: var(--color-primary);
}
.hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .hh-auth-benefit-icon {
    border-color: var(--color-line-dark);
}
.hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .hh-auth-form {
    background: var(--color-surface);
}
.hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .hh-auth-switch a[aria-current=page] {
    box-shadow: none;
}
.hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .btn-primary {
    color: var(--color-on-primary);
}
.hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .btn-primary:hover {
    background: var(--color-primary-darker);
    color: var(--color-on-primary);
}
@media (max-width:767px) {
    .hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent {
        padding: 0 0 calc(var(--spacing) * 8);
    }
    .hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .hh-auth-shell {
        border: 0;
        border-radius: 0;
    }
    .hh-customer-page:is(.customer-account-login,.customer-account-create,.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .hh-auth-brand {
        border-radius: 0;
    }
}


/* Registration switches retain Hyva's track and thumb geometry. */
.hh-customer-page.customer-account-create #maincontent input[type=checkbox][role=switch] {
    --form-bg: var(--color-surface);
    --form-stroke: var(--color-fg-secondary);
    width: var(--switch-width);
    height: var(--switch-height);
    border-width: 2px;
    border-radius: var(--switch-width);
    margin-inline-end: 0;
}
.hh-customer-page.customer-account-create #maincontent input[type=checkbox][role=switch]:checked::after {
    background-color: var(--color-on-primary);
    border-color: var(--color-on-primary);
}
/* Keep this after the auth field reset, which otherwise clears the inset fill. */
.hh-customer-page.customer-account-create #maincontent .form-input:-webkit-autofill,
.hh-customer-page.customer-account-create #maincontent .form-input:-webkit-autofill:hover,
.hh-customer-page.customer-account-create #maincontent .form-input:-webkit-autofill:focus {
    -webkit-text-fill-color: var(--color-fg);
    caret-color: var(--color-fg);
    box-shadow: 0 0 0 1000px var(--color-surface) inset;
}
.hh-customer-page.customer-account-create #maincontent .form-input:autofill {
    color: var(--color-fg);
    caret-color: var(--color-fg);
    box-shadow: 0 0 0 1000px var(--color-surface) inset;
}
/* Validation messages must occupy space instead of overlapping the next label. */
.hh-customer-page.customer-account-create #maincontent .field.field-reserved .messages:last-of-type {
    margin-block-end: 0;
    color: var(--color-error-ink);
}
@media (max-width:767px) {
    .hh-customer-page.customer-account-create #maincontent .hh-auth-brand {
        padding-block: calc(var(--spacing) * 7);
    }
}

/* Account area refresh: cream page, white cards, one card language across sign-in and My Account. */
body.hh-customer-page, .hh-customer-page .page-wrapper, .hh-customer-page #maincontent { background: var(--color-bg); }
.hh-customer-page #maincontent .card { background: var(--color-surface); border-radius:18px; box-shadow:0 1px 2px rgb(12 12 12 / 4%), 0 18px 40px -28px rgb(12 12 12 / 22%); }
.hh-customer-page #maincontent .page-title::after { content:""; display:block; width:48px; height:3px; border-radius:2px; background: var(--color-primary); }
.hh-customer-page.account #maincontent .page-title::before { content:"Your account"; display:block; margin-bottom:12px; font-family:var(--font-sans); font-size:12px; font-weight:600; letter-spacing:.16em; color: var(--color-accent-ink); }
.hh-customer-page.account #maincontent .column.main > :is(h2,.block-title):first-child,
.hh-customer-page.account #maincontent #my-orders-title { margin:0 0 20px; font-size:26px; }

/* Sign-in pages */
.hh-customer-page #customer-login-container > .card { box-shadow:0 1px 2px rgb(12 12 12 / 4%), 0 24px 48px -32px rgb(12 12 12 / 28%); }
.hh-customer-page #customer-login-container .block-new-customer { border-top:4px solid var(--color-primary); }
.hh-customer-page .form-create-account fieldset.card { border-top:4px solid var(--color-primary); }
.hh-customer-page:is(.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .column.main .card { border-top:4px solid var(--color-primary); }
/* Magento's half-width account column and Hyvä's half-width card otherwise compound. */
.hh-customer-page:is(.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .column.main { float:none; width:100%; max-width:none; }
.hh-customer-page:is(.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .column.main > .mb-12 { width:100%; max-width:580px; margin:0 auto; }
.hh-customer-page:is(.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .column.main .card { width:100%; max-width:none; margin:0; padding:36px; }
.hh-customer-page.customer-account-forgotpassword #maincontent .column.main legend { font-size:21px; line-height:1.45; }
.hh-customer-page.customer-account-forgotpassword #maincontent .actions-toolbar { justify-content:space-between; }
@media (max-width:767px) {
    .hh-customer-page:is(.customer-account-forgotpassword,.customer-account-createpassword) #maincontent .column.main .card { padding:24px 20px; }
    .hh-customer-page.customer-account-forgotpassword #maincontent .column.main legend { font-size:18px; }
}

/* Account navigation */
.hh-customer-page #maincontent .sidebar-main .account-nav { padding:24px 20px; }
.hh-customer-page #maincontent #account-nav-title > span:first-child { font-family:var(--font-sans); font-size:12px; font-weight:600; letter-spacing:.16em; text-transform:uppercase; color: var(--color-accent-ink); }
.hh-customer-page #maincontent #account-nav { border-color: var(--color-line); margin-top:8px; }
.hh-customer-page #maincontent .account-nav .nav.items li { margin:2px 0; }
.hh-customer-page #maincontent .account-nav .nav.items :is(a,strong) { display:flex; align-items:center; justify-content:space-between; padding:11px 14px; border-radius:10px; font-size:15px; font-weight:500; text-decoration:none; color: var(--color-fg); transition:background .2s, color .2s; }
.hh-customer-page #maincontent .account-nav .nav.items a::after { content:""; width:7px; height:7px; border-right:1.5px solid currentColor; border-top:1.5px solid currentColor; transform:rotate(45deg); opacity:0; transition:opacity .2s; }
.hh-customer-page #maincontent .account-nav .nav.items a:hover { background: var(--color-soft); color: var(--color-accent-ink); }
.hh-customer-page #maincontent .account-nav .nav.items a:hover::after { opacity:1; }
.hh-customer-page #maincontent .account-nav .nav.items .current :is(strong,a) { background: var(--color-primary); color: var(--color-on-primary); border-left:0; font-weight:600; }
.hh-customer-page #maincontent .account-nav .nav.items .current a strong { padding:0; background:none; color:inherit; }
.hh-customer-page #maincontent .account-nav .delimiter { border-color: var(--color-line); margin:10px 0; }

/* Sidebar widgets (recently ordered, wish list) as cards */
.hh-customer-page #maincontent .sidebar-additional :is(.block-reorder,.wishlist-widget > div) { margin-top:0; margin-bottom:24px; padding:24px 20px; background: var(--color-surface); border: 1px solid var(--color-line); border-radius:18px; }
.hh-customer-page #maincontent .sidebar-additional h2 { border-top:0; padding-top:0; margin-bottom:16px; }
.hh-customer-page #maincontent .sidebar-additional h2 :is(strong,.title) { font-family:var(--font-display); font-size:20px; font-weight:600; text-transform:uppercase; letter-spacing:.02em; color: var(--color-fg); }
.hh-customer-page #maincontent .sidebar-additional img { border-radius:8px; }

/* Dashboard welcome */
.hh-customer-page #maincontent .hh-welcome { display:grid; grid-template-columns:minmax(0,1fr); gap:24px; margin-bottom:36px; padding:32px; border-radius:20px; background: var(--color-charcoal); color: var(--color-hide); }
.hh-customer-page #maincontent .hh-welcome__eyebrow { margin:0 0 6px; font-size:12px; font-weight:600; letter-spacing:.16em; text-transform:uppercase; color: var(--color-primary); }
.hh-customer-page #maincontent .hh-welcome__title { margin:0; font-family:var(--font-display); font-size:clamp(34px,4vw,48px); font-weight:700; line-height:1; text-transform:uppercase; color: var(--color-hide); overflow-wrap:anywhere; }
.hh-customer-page #maincontent .hh-welcome__text { margin:12px 0 0; color: var(--color-sand); line-height:1.6; }
.hh-customer-page #maincontent .hh-welcome__links { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin:0; padding:0; list-style:none; }
.hh-customer-page #maincontent .hh-welcome__link { display:flex; flex-direction:column; gap:4px; height:100%; padding:18px 16px; border: 1px solid var(--color-line-dark); border-radius:14px; background: rgb(255 255 255 / 4%); color: var(--color-hide); text-decoration:none; transition:border-color .2s, transform .2s, background .2s; }
.hh-customer-page #maincontent .hh-welcome__link:hover { border-color: var(--color-primary); background: rgb(255 255 255 / 7%); color: var(--color-hide); transform:translateY(-2px); }
.hh-customer-page #maincontent .hh-welcome__icon { display:inline-flex; align-items:center; justify-content:center; width:42px; height:42px; margin-bottom:10px; border-radius:50%; background: var(--color-primary); color: var(--color-on-primary); }
.hh-customer-page #maincontent .hh-welcome__label { font-family:var(--font-display); font-size:18px; font-weight:600; letter-spacing:.03em; text-transform:uppercase; }
.hh-customer-page #maincontent .hh-welcome__hint { font-size:13px; line-height:1.4; color: var(--color-sand); }

/* Dashboard info and address cards */
.hh-customer-page #maincontent .column.main .card .bg-gray-100 { width:52px; height:52px; background: var(--color-soft); color: var(--color-accent-ink); }
.hh-customer-page #maincontent .column.main :is(.card h3, .box .title-font) { margin-bottom:12px; font-family:var(--font-display); font-size:21px; font-weight:600; text-transform:uppercase; letter-spacing:.02em; color: var(--color-fg); }
.hh-customer-page #maincontent .column.main .card a.inline-flex { width:auto; gap:6px; margin-right:18px; font-size:14px; font-weight:600; text-decoration:none; }
.hh-customer-page #maincontent .column.main .card a.inline-flex:hover { text-decoration:underline; }
.hh-customer-page #maincontent .block-dashboard-addresses > .block-title.card { padding:0; margin:36px 0 4px; background:none; border:0; box-shadow:none; }
.hh-customer-page #maincontent :is(.block-dashboard-addresses > .block-title span.text-2xl, .block-dashboard-orders .block-title h2, .block-addresses-default > .block-title, .block-addresses-list > .block-title) { font-family:var(--font-display); font-size:26px; font-weight:600; text-transform:uppercase; color: var(--color-fg); }
.hh-customer-page #maincontent :is(.block-title a.action, a.action.view, a.action.edit) { font-size:14px; font-weight:600; text-decoration:none; }
.hh-customer-page #maincontent :is(.block-title a.action, a.action.view, a.action.edit):hover { text-decoration:underline; }
.hh-customer-page #maincontent .block-dashboard-orders.card { margin-top:32px; padding:28px; }
.hh-customer-page #maincontent .block-addresses-default .block-content { gap:24px; }
.hh-customer-page #maincontent .block-addresses-list .empty { padding:20px 24px; border: 1px dashed var(--color-sand); border-radius:14px; }

/* Order tables */
.hh-customer-page #maincontent #my-orders-table { border-collapse:separate; border-spacing:0; font-size:15px; }
.hh-customer-page #maincontent #my-orders-table thead th { padding:12px 14px; background: var(--color-soft); color: var(--color-fg-secondary); font-size:12px; font-weight:600; letter-spacing:.1em; text-transform:uppercase; border:0; }
.hh-customer-page #maincontent #my-orders-table thead th:first-child { border-radius:10px 0 0 10px; }
.hh-customer-page #maincontent #my-orders-table thead th:last-child { border-radius:0 10px 10px 0; }
.hh-customer-page #maincontent #my-orders-table tbody tr { background: transparent; }
.hh-customer-page #maincontent #my-orders-table tbody :is(th,td) { padding:18px 14px; vertical-align:middle; border-bottom: 1px solid var(--color-line); color: var(--color-fg); }
.hh-customer-page #maincontent #my-orders-table tbody tr:last-child :is(th,td) { border-bottom:0; }
.hh-customer-page #maincontent #my-orders-table tbody th { font-weight:600; }
.hh-customer-page #maincontent #my-orders-table tbody th p { margin:2px 0 0; font-weight:400; color: var(--color-fg-secondary); }
.hh-customer-page #maincontent #my-orders-table .price { font-weight:600; }
.hh-customer-page #maincontent #my-orders-table td :is(a,button) { display:inline-flex; align-items:center; justify-content:center; width:40px; height:40px; border: 1px solid var(--color-line); border-radius:50%; color: var(--color-fg); text-decoration:none; transition:border-color .2s, background .2s, color .2s; }
.hh-customer-page #maincontent #my-orders-table td :is(a,button):hover { border-color: var(--color-primary); background: var(--color-primary); color: var(--color-on-primary); }
.hh-customer-page #maincontent #my-orders-table td .flex { justify-content:center; gap:10px; }
.hh-customer-page #maincontent .column.main > .card:has(#my-orders-table) { padding:20px; }
.hh-customer-page #maincontent :is(.hh-status, .order-status) { display:inline-flex; align-items:center; gap:6px; padding:5px 12px; border: 0; border-radius:999px; background: color-mix(in srgb, var(--color-primary) 14%, var(--color-surface)); color: var(--color-accent-ink); font-size:13px; font-weight:600; line-height:1.3; white-space:nowrap; }
.hh-customer-page #maincontent :is(.hh-status, .order-status)::before { content:""; width:7px; height:7px; border-radius:50%; background: currentColor; }
.hh-customer-page #maincontent .hh-status--complete { background: color-mix(in srgb, #16a34a 14%, var(--color-surface)); color:#15803d; }
.hh-customer-page #maincontent :is(.hh-status--canceled, .hh-status--closed) { background: var(--color-soft); color: var(--color-fg-secondary); }

/* Pager */
.hh-customer-page #maincontent .toolbar .pager { margin-top:8px; color: var(--color-fg-secondary); }
.hh-customer-page #maincontent .toolbar .limiter .form-select { min-height:40px; width:auto; padding:6px 32px 6px 12px; }
.hh-customer-page #maincontent #ox-page-count { display:none; }

/* Order view */
.hh-customer-page.sales-order-view #maincontent .column.main > .md\:flex { margin-bottom:20px; }
.hh-customer-page.sales-order-view #maincontent .column.main > .md\:flex .text-2xl { font-family:var(--font-display); font-size:24px; font-weight:600; text-transform:uppercase; }
.hh-customer-page.sales-order-view #maincontent .order-date { color: var(--color-fg-secondary); font-size:14px; }
.hh-customer-page.sales-order-view #maincontent .order-status { padding:7px 14px; }
.hh-customer-page #maincontent .btn-secondary { gap:8px; padding:10px 18px; background: var(--color-surface); font-weight:600; transition:border-color .2s, color .2s; }
.hh-customer-page #maincontent .btn-secondary:hover { border-color: var(--color-primary); color: var(--color-accent-ink); }
.hh-customer-page.sales-order-view #maincontent .order-details-items > .card.mb-2 { display:inline-flex; margin-bottom:12px; padding:6px; border-radius:999px; box-shadow:none; }
.hh-customer-page.sales-order-view #maincontent .order-links { gap:4px; }
.hh-customer-page.sales-order-view #maincontent .order-links :is(a,strong) { display:block; padding:8px 18px; border-radius:999px; font-size:14px; font-weight:600; text-decoration:none; color: var(--color-fg-secondary); }
.hh-customer-page.sales-order-view #maincontent .order-links .current strong { background: var(--color-primary); color: var(--color-on-primary); }
.hh-customer-page.sales-order-view #maincontent .order-details-items > .card.p-4 { padding:28px; }
.hh-customer-page.sales-order-view #maincontent .order-details-items .grid { gap:14px; }
.hh-customer-page.sales-order-view #maincontent .order-details-items .grid > .w-full { padding:18px; border-radius:14px; background: var(--color-soft); }
.hh-customer-page.sales-order-view #maincontent .order-details-items .grid > .w-full > p.font-semibold { margin-bottom:10px; font-size:12px; letter-spacing:.12em; text-transform:uppercase; color: var(--color-accent-ink); }
.hh-customer-page.sales-order-view #maincontent .order-details-items .box-content { color: var(--color-fg); line-height:1.7; }
.hh-customer-page.sales-order-view #maincontent .order-details-items :is(.border-b,.border-t) { border-color: var(--color-line); }
.hh-customer-page.sales-order-view #maincontent .order-title p { margin:12px 0; font-family:var(--font-display); font-size:22px; font-weight:600; text-transform:uppercase; color: var(--color-fg); }
.hh-customer-page.sales-order-view #maincontent .order-items > .lg\:grid { border-radius:10px; background: var(--color-soft); color: var(--color-fg-secondary); font-size:12px; font-weight:600; letter-spacing:.1em; text-transform:uppercase; }
.hh-customer-page.sales-order-view #maincontent .order-items .parent-item { border-bottom: 1px solid var(--color-line); }
.hh-customer-page.sales-order-view #maincontent .order-items .parent-item .font-semibold { color: var(--color-fg); }
.hh-customer-page.sales-order-view #maincontent .order-items .item-options { color: var(--color-fg-secondary); }
.hh-customer-page.sales-order-view #maincontent .order-details-items .lg\:w-1\/3 .grid { padding:16px 8px 4px; color: var(--color-fg-secondary); }
.hh-customer-page.sales-order-view #maincontent .order-details-items .lg\:w-1\/3 .grid > div:nth-last-child(-n+2) { padding-top:12px; border-top: 1px solid var(--color-line); font-family:var(--font-display); font-size:22px; color: var(--color-fg); }
.hh-customer-page #maincontent .actions-toolbar .action.back { font-size:14px; font-weight:600; text-decoration:none; }
.hh-customer-page #maincontent .actions-toolbar .action.back::before { content:"\2190\00a0"; }

/* Wish list */
.hh-customer-page.wishlist-index-index #maincontent .product-item-info { padding:20px; transition:border-color .2s, transform .2s; }
.hh-customer-page.wishlist-index-index #maincontent .product-item-info:hover { border-color: var(--color-primary); transform:translateY(-2px); }
.hh-customer-page.wishlist-index-index #maincontent .product-item-photo { overflow:hidden; border-radius:12px; }
.hh-customer-page.wishlist-index-index #maincontent .product-item-name { display:block; font-family:var(--font-display); font-size:20px; font-weight:600; text-transform:uppercase; }
.hh-customer-page.wishlist-index-index #maincontent .product-item-name a { color: var(--color-fg); text-decoration:none; }
.hh-customer-page.wishlist-index-index #maincontent .price-box { text-align:center; font-size:18px; font-weight:700; color: var(--color-fg); }
.hh-customer-page.wishlist-index-index #maincontent .product-item-comment { min-height:72px; }
.hh-customer-page.wishlist-index-index #maincontent .box-tocart { border-color: var(--color-line); align-items:center; }
.hh-customer-page.wishlist-index-index #maincontent .box-tocart .qty { width:72px; min-height:48px; text-align:center; }
.hh-customer-page.wishlist-index-index #maincontent .box-tocart .product-item-actions { flex:1; }
.hh-customer-page.wishlist-index-index #maincontent .box-tocart .btn-primary { width:100%; min-height:48px; }
.hh-customer-page.wishlist-index-index #maincontent .product-item-inner > .product-item-actions { display:flex; justify-content:flex-end; gap:6px; }
.hh-customer-page.wishlist-index-index #maincontent .product-item-inner > .product-item-actions .btn { width:40px; height:40px; justify-content:center; border: 1px solid var(--color-line); border-radius:50%; color: var(--color-fg-secondary); }
.hh-customer-page.wishlist-index-index #maincontent .product-item-inner > .product-item-actions .btn:hover { border-color: var(--color-primary); color: var(--color-accent-ink); }
.hh-customer-page.wishlist-index-index #maincontent .form-wishlist-items > .actions-toolbar { justify-content:space-between; margin-top:28px; }

@media (max-width:767px) {
    .hh-customer-page #maincontent .sidebar-main .account-nav { padding:8px 16px; }
    .hh-customer-page #maincontent .hh-welcome { padding:24px 20px; margin-bottom:28px; }
    .hh-customer-page #maincontent .hh-welcome__links { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
    .hh-customer-page #maincontent .hh-welcome__link { padding:14px 12px; }
    .hh-customer-page #maincontent .hh-welcome__hint { display:none; }
    .hh-customer-page #maincontent .block-dashboard-orders.card { padding:20px 16px; }
    .hh-customer-page #maincontent #my-orders-table tbody :is(th,td) { padding:14px 8px; }
    .hh-customer-page #maincontent #my-orders-table thead th { padding:10px 8px; }
    .hh-customer-page.sales-order-view #maincontent .order-details-items > .card.p-4 { padding:20px 16px; }
    .hh-customer-page.sales-order-view #maincontent .order-details-items .lg\:w-1\/3 { width:100%; }
    .hh-customer-page.wishlist-index-index #maincontent .form-wishlist-items > .actions-toolbar .flex { flex-direction:column; }
}
@media (prefers-reduced-motion:reduce) {
    .hh-customer-page #maincontent :is(.hh-welcome__link,.product-item-info) { transition:none; transform:none; }
}