/* Sign-in dropdown, code sign-in page and My Account layout (reference style) */
.sc-signin-wrap { position: relative; display: inline-block; }
.sc-signin-wrap::after { content: ""; position: absolute; left: 0; right: 0; top: 100%; height: 14px; }
.sc-signin-drop { display: none; position: absolute; right: 0; top: calc(100% + 12px); width: 320px; background: #fff; color: #222; box-shadow: 0 6px 24px rgba(0,0,0,.2); padding: 22px 36px 30px; z-index: 300; text-align: left; white-space: normal; }
.sc-signin-wrap:hover .sc-signin-drop, .sc-signin-wrap:focus-within .sc-signin-drop { display: block; }
.sc-signin-drop h4 { margin: 0 0 16px; padding-bottom: 12px; border-bottom: 1px solid #eee; font-size: 17px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; }
.sc-signin-drop label { display: block; font-size: 15px; margin: 14px 0 8px; color: #333; }
.sc-signin-drop label i { color: #e11d48; font-style: normal; }
.sc-signin-drop input { width: 100%; box-sizing: border-box; height: 56px; border: 1px solid #ddd; padding: 0 16px; font: 16px 'Spartan', Arial, sans-serif; }
.sc-signin-drop .sc-sd-login { display: block; width: 100%; height: 56px; margin-top: 18px; background: #222; color: #fff; border: 0; font: 500 17px 'Spartan', Arial, sans-serif; text-transform: uppercase; cursor: pointer; }
.sc-signin-drop .sc-sd-login:hover { background: var(--purple, #5f3b97); }
.sc-signin-drop .sc-sd-forgot { display: block; text-align: center; margin: 18px 0 24px; color: #444; font-size: 16px; }
.sc-signin-drop .sc-sd-create { display: block; text-align: center; background: #dd2a7b; color: #fff; height: 60px; line-height: 60px; font-size: 17px; text-transform: uppercase; }
.sc-signin-drop .sc-sd-create:hover { background: #c61f69; }
.sc-acc-links a { color: inherit; }
.sc-acc-links a:hover { text-decoration: underline; }
@media (max-width: 1100px) { .sc-signin-drop { display: none !important; } }

/* sign in / create account page */
body.sc-acct-out .sc-announce, body.sc-acct-out .sc-side, body.sc-acct-out header.sc-wrap, body.sc-acct-out .sc-nav, body.sc-acct-out #scNavSpacer, body.sc-acct-out .sc-footer, body.sc-acct-out .sc-top, body.sc-acct-out .sc-m-search { display: none !important; }
body.sc-acct-out .sc-main { padding: 0; }
body.sc-acct-out .sc-main > .sc-wrap { max-width: none; padding: 0; }
body.sc-acct-out h1.entry-title { display: none; }
.sc-auth { max-width: 568px; margin: 0 auto; padding: 60px 20px 80px; font-family: Arial, Helvetica, sans-serif; color: #111; }
.sc-auth-brand { text-align: center; font-size: 28px; font-weight: 600; margin: 0 0 70px; }
.sc-auth-brand a { color: #000; }
.sc-auth-brand { margin-bottom: 40px; }
.sc-auth-brand img { display: block; margin: 0 auto; height: 110px; width: auto; }
.sc-auth h2 { font-size: 32px; font-weight: 600; margin: 0 0 6px; }
.sc-auth-sub { color: #666; font-size: 20px; margin: 0 0 26px; }
.sc-auth-sub a { color: #0a58ca; margin-left: 14px; }
.sc-auth-field { position: relative; border: 1px solid #ddd; border-radius: 14px; padding: 10px 70px 10px 16px; }
.sc-auth-field label { display: block; font-size: 15px; color: #555; }
.sc-auth-field input { border: 0; outline: 0; width: 100%; font-size: 20px; padding: 2px 0; background: none; }
.sc-auth-field button { position: absolute; right: 10px; top: 10px; width: 52px; height: 52px; border: 0; border-radius: 12px; background: #0a58ca; color: #fff; font-size: 24px; cursor: pointer; }
.sc-auth-err { color: #c0272d; font-size: 15px; margin: 10px 2px 0; min-height: 1em; }
.sc-auth-note { color: #666; font-size: 15px; margin: 18px 2px 0; line-height: 1.5; }
.sc-auth-note a { color: #0a58ca; }
.sc-auth-code { display: flex; gap: 12px; margin-top: 26px; }
.sc-auth-code input { width: 86px; height: 108px; text-align: center; font-size: 34px; border: 1px solid #e0e0e0; border-radius: 16px; outline: 0; }
.sc-auth-code input:focus { border-color: #0a58ca; box-shadow: 0 0 0 1px #0a58ca; }
.sc-auth-pw { margin-top: 36px; font-size: 15px; color: #555; }
.sc-auth-pw summary { cursor: pointer; color: #0a58ca; }
.sc-auth-pw form { display: grid; gap: 10px; margin-top: 14px; }
.sc-auth-pw input { height: 48px; border: 1px solid #ddd; border-radius: 8px; padding: 0 14px; font-size: 16px; }
.sc-auth-pw button { height: 48px; border: 0; border-radius: 8px; background: #222; color: #fff; font-size: 16px; cursor: pointer; }
.sc-auth-foot { text-align: center; margin-top: 90px; } .sc-auth-foot a { color: #0a58ca; }
@media (max-width: 600px) { .sc-auth-code input { width: 13vw; height: 17vw; font-size: 26px; } .sc-auth-code { gap: 2vw; } }

/* loading states: spinner replaces the arrow; status line with spinner; code boxes dim */
@keyframes sc-auth-spin { to { transform: rotate(360deg); } }
.sc-auth-wait { color: #555; font-size: 15px; margin: 12px 2px 0; min-height: 1em; }
.is-loading > .sc-auth-wait::before, .is-loading .sc-auth-wait::before { content: ""; display: inline-block; width: 16px; height: 16px; margin-right: 8px; vertical-align: -3px; border: 2.5px solid #cfd8ea; border-top-color: #0a58ca; border-radius: 50%; animation: sc-auth-spin .7s linear infinite; }
.sc-auth-email.is-loading .sc-auth-field button { font-size: 0; cursor: wait; }
.sc-auth-email.is-loading .sc-auth-field button::after { content: ""; position: absolute; left: 50%; top: 50%; width: 22px; height: 22px; margin: -11px 0 0 -11px; border: 3px solid rgba(255,255,255,.4); border-top-color: #fff; border-radius: 50%; animation: sc-auth-spin .7s linear infinite; }
[data-step=code].is-loading .sc-auth-code { opacity: .55; }

/* My Account (logged in): left menu + welcome card */
body.sc-acct-in .woocommerce { display: grid; grid-template-columns: 300px minmax(0, 1fr); gap: 40px; max-width: 1500px; margin: 0 auto; padding: 40px 40px 60px; }
.sc-acct-nav ul { list-style: none; margin: 0; padding: 0; }
.sc-acct-nav a { display: block; padding: 10px 0; font-size: 26px; color: #777; }
.sc-acct-nav li.is-active a, .sc-acct-nav a:hover { color: #000; font-weight: 600; }
.sc-acct-welcome { display: flex; justify-content: space-between; align-items: center; gap: 20px; border: 1px solid #e5e5e5; border-radius: 28px; padding: 48px; min-height: 260px; box-shadow: 0 2px 10px rgba(0,0,0,.05); }
.sc-acct-welcome h2 { margin: 0; font-size: 30px; }
.sc-acct-welcome p { margin: 6px 0 0; font-size: 26px; color: #666; }
.sc-acct-shop { background: #0a58ca; color: #fff; padding: 16px 28px; border-radius: 14px; font-size: 20px; font-weight: 600; }
@media (max-width: 800px) { body.sc-acct-in .woocommerce { grid-template-columns: 1fr; padding: 20px 16px; } .sc-acct-nav a { font-size: 20px; } }

/* logged-in My Account uses the clean header (class sc-clean, styled in checkout.css, which loads only on checkout):
   repeat the few rules it needs here */
body.sc-acct-in .sc-clean-head { display: block; border-bottom: 1px solid #e5e5e5; background: #fff; }
body.sc-acct-in .sc-clean-head > div { max-width: 1500px; margin: 0 auto; padding: 22px 40px; display: flex; justify-content: space-between; align-items: center; font: 600 28px Arial, sans-serif; }
body.sc-acct-in .sc-clean-head a { color: #000; }
body.sc-acct-in .sc-clean-bag svg { width: 24px; height: 24px; stroke: #0a58ca; fill: none; stroke-width: 1.8; }
body.sc-acct-in .sc-announce, body.sc-acct-in .sc-side, body.sc-acct-in header.sc-wrap, body.sc-acct-in .sc-nav, body.sc-acct-in #scNavSpacer, body.sc-acct-in .sc-footer, body.sc-acct-in .sc-m-search { display: none !important; }
body.sc-acct-in .sc-main { padding: 0; }
body.sc-acct-in .sc-main > .sc-wrap { max-width: none; padding: 0; }
body.sc-acct-in h1.entry-title, body.sc-acct-in .woocommerce-products-header { display: none; }
body.sc-acct-in .woocommerce { font-family: Arial, Helvetica, sans-serif; }
body.sc-acct-in .woocommerce-MyAccount-navigation, body.sc-acct-in .woocommerce-MyAccount-content { float: none !important; width: auto !important; margin: 0; }
body.sc-acct-in .woocommerce::before, body.sc-acct-in .woocommerce::after { display: none; }
body.sc-acct-in .woocommerce-notices-wrapper { grid-column: 1 / -1; }
