:root{--g:#52ff7b;--p:#c35cff;--muted:#adb8b1}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at top left,#102617,transparent 50%),radial-gradient(ellipse at top right,#21102d,transparent 50%),#030506;color:#edf5ef;font:16px/1.55 system-ui,-apple-system,sans-serif}a{color:var(--g);text-underline-offset:4px}header{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:18px max(18px,calc((100vw - 1060px)/2));border-bottom:1px solid #293b30;background:#050906}header nav,.tabs{display:flex;align-items:center;gap:20px;flex-wrap:wrap}.brand{font-size:34px;font-weight:950;line-height:1;text-decoration:none;text-shadow:1px 1px var(--p)}.brand small{display:block;font-size:9px;color:#c9d3cc;font-weight:600;margin-top:7px;text-shadow:none}main{max-width:1060px;margin:auto;padding:30px 18px 70px}.eyebrow{font-size:11px;color:var(--g);letter-spacing:.17em;font-weight:800}h1{font-size:clamp(32px,5vw,54px);line-height:1.12;letter-spacing:-.04em;margin:12px 0}h2{font-size:25px;line-height:1.25;margin:0 0 20px}h3{font-size:19px}p{color:var(--muted)}.intro{margin:18px 0 30px}.panel{border:1px solid #33443b;border-radius:22px;padding:28px;margin:24px 0;background:linear-gradient(140deg,#0e1711,#100c16)}.grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}.tabs{padding:12px 0}.section-title,.total,.cart-row{display:flex;justify-content:space-between;gap:16px;align-items:center}.cart-row{border-bottom:1px solid #314036;padding:18px 0}.cart-row input{width:85px}.cart-row .quantity{display:flex;gap:8px;align-items:center}label{display:block;margin:14px 0}label span,legend span{color:#ff859a}input,select,textarea{width:100%;font:inherit;font-size:16px;border:1px solid #46564d;border-radius:12px;background:#080e0a;color:#fff;padding:14px;margin-top:8px;min-width:0}input[type=radio],input[type=checkbox]{width:22px;height:22px;margin:0;accent-color:var(--g);flex:none}fieldset{border:0;padding:0;margin:22px 0}legend{font-weight:750}.choice{border:1px solid #48544d;border-radius:14px;display:flex;align-items:center;gap:12px;padding:18px;flex-wrap:wrap}.choice:has(input:checked){border-color:var(--g);background:#14291c}.choice b{margin-left:auto}.total{border-top:1px solid #435047;padding-top:20px;font-size:24px;font-weight:850}.total strong{color:var(--g)}textarea{min-height:100px}.button,button{display:inline-flex;align-items:center;justify-content:center;font:inherit;font-weight:800;cursor:pointer;min-height:44px;border-radius:12px;border:1px solid #526259;padding:11px 18px;color:#e8f5ed;background:#15221a;text-decoration:none}.button{background:linear-gradient(110deg,#52ff7b,#98ffaa);color:#031307;border-color:#52ff7b}.secondary{background:#191122;border-color:#9052b4;color:#fff}button:disabled{opacity:.5;cursor:wait}#submit{width:100%;padding:18px;font-size:18px}.ack{display:flex;align-items:flex-start;gap:16px}.ack span{color:#e6d7dc}.warning{border-color:#7b3549}.warning>p{color:#ff859a;text-align:center}.upload{border:2px dashed #675172;border-radius:16px;padding:22px}.upload small{display:block;color:var(--muted);margin-top:8px}.order{border-top:1px solid #34473a;padding:18px 0}.order:first-child{border:0}.order .badge{display:inline-block;color:var(--g);background:#122a1a;border-radius:99px;padding:5px 12px;font-size:13px}.order ul{padding-left:20px}.error{color:#ff8ba0!important}.success{color:var(--g)!important}footer{margin-top:36px;color:var(--muted)}:focus-visible{outline:3px solid var(--p);outline-offset:4px}[hidden]{display:none!important}#signIn{display:flex;justify-content:center;overflow:hidden}.cl-rootBox{max-width:100%}.cl-cardBox{max-width:100%}@media(max-width:600px){header{padding:15px;align-items:center}header nav{gap:14px;font-size:14px}main{padding:20px 12px 55px}.panel{padding:20px 16px;border-radius:18px}.grid{grid-template-columns:1fr;gap:0}.cart-row{align-items:flex-start;flex-wrap:wrap}.cart-row .quantity{margin-left:auto}.choice{padding:16px 12px}.choice b{font-size:14px}.tabs{gap:12px;font-size:14px}h2{font-size:23px}.ack{font-size:14px}.cl-cardBox{width:100%}}

/* Keep Clerk's login labels readable on the P3 dark background. */
#signIn .cl-headerTitle,#signIn .cl-headerSubtitle,#signIn .cl-formFieldLabel,#signIn .cl-dividerText,#signIn .cl-socialButtonsBlockButtonText,#signIn .cl-footerActionText,#signIn p{color:#eaf5ed!important}#signIn .cl-socialButtonsBlockButton{color:#eaf5ed!important;border-color:#65726a!important;background:#19251e!important}#signIn .cl-formButtonPrimary{color:#06200e!important}#signIn .cl-formFieldInput{color:#fff!important;background:#0a130d!important;border-color:#67796d!important}#signIn .cl-footerActionLink{color:#52ff7b!important}#signIn .cl-card{background:#101813!important}#signIn .cl-cardBox{width:min(420px,100%)!important;margin:auto}#signIn .cl-rootBox{width:100%}

#signIn .cl-rootBox{width:min(420px,100%)!important}#signIn input::placeholder{color:#aebdb3!important;opacity:1}


.admin-order{border:1px solid #435348;border-radius:16px;padding:18px;margin:18px 0}.admin-order summary{cursor:pointer;display:flex;flex-direction:column;gap:6px;overflow-wrap:anywhere}.admin-order summary span{color:var(--muted)}.admin-item{display:grid;grid-template-columns:minmax(0,1fr) 110px auto;gap:12px;align-items:end;margin:16px 0}.admin-item label{margin:0}.admin-item button{margin-bottom:0}#manage{scroll-margin-top:20px}.order{overflow-wrap:anywhere}@media(max-width:600px){.admin-order{padding:14px}.admin-item{grid-template-columns:minmax(0,1fr) 90px}.admin-item button{grid-column:1/-1;justify-self:end}}

/* Clerk renders the account menu outside #signIn. Keep its text readable. */
.cl-userButtonPopoverCard,.cl-userButtonPopoverMain,.cl-userButtonPopoverFooter{background:#101813!important;color:#f1fff4!important}
.cl-userButtonPopoverCard .cl-userPreviewMainIdentifier,.cl-userButtonPopoverCard .cl-userPreviewSecondaryIdentifier,.cl-userButtonPopoverActionButton,.cl-userButtonPopoverActionButtonText,.cl-userButtonPopoverActionButtonIcon{color:#f1fff4!important}
.cl-userButtonPopoverActionButton:hover,.cl-userButtonPopoverActionButton:focus-visible{background:#22372a!important;color:#fff!important}
.cl-userButtonPopoverFooter p,.cl-userButtonPopoverFooter a,.cl-userButtonPopoverFooter span{color:#bbc6bf!important}
.cl-userButtonPopoverFooter svg{color:#bbc6bf!important;fill:currentColor}
.cl-userProfile-root .cl-card,.cl-userProfile-root .cl-navbar,.cl-userProfile-root .cl-pageScrollBox{background:#101813!important;color:#f1fff4!important}
.cl-userProfile-root .cl-headerTitle,.cl-userProfile-root .cl-headerSubtitle,.cl-userProfile-root .cl-profileSectionTitleText,.cl-userProfile-root .cl-profileSectionContent,.cl-userProfile-root .cl-navbarButton,.cl-userProfile-root .cl-userPreviewMainIdentifier,.cl-userProfile-root .cl-userPreviewSecondaryIdentifier,.cl-userProfile-root .cl-formFieldLabel{color:#f1fff4!important}

/* Cover email rows, badges, and modal controls in Clerk's mobile profile. */
.cl-userProfile-root .cl-profileSectionItem,.cl-userProfile-root .cl-profileSectionItem p,.cl-userProfile-root .cl-profileSectionItem span,.cl-userProfile-root .cl-profileSectionItem button,.cl-userProfile-root .cl-profileSectionItem svg,.cl-userProfile-root .cl-badge{color:#f1fff4!important}
.cl-userProfile-root .cl-profileSectionContent p,.cl-userProfile-root .cl-profileSectionContent span,.cl-userProfile-root .cl-menuButton{color:#f1fff4!important}
.cl-modalCloseButton,.cl-navbarMobileMenuButton,.cl-navbarMobileMenuButtonIcon{color:#f1fff4!important;opacity:1!important}
.cl-modalCloseButton:hover,.cl-navbarMobileMenuButton:hover{background:#22372a!important}

:root{--clerk-color-foreground:#f1fff4;--clerk-color-muted-foreground:#c8d4cb;--clerk-color-input-foreground:#fff;--clerk-color-input:#080e0a;--clerk-color-neutral:#edf5ef;--clerk-color-primary-foreground:#041409;--clerk-color-border:#617468;--clerk-color-background:#101512;color-scheme:dark}
.contact-card{border:1px solid #435348;border-radius:16px;padding:18px;margin:16px 0;overflow-wrap:anywhere}.contact-card h3{margin-top:0}#customers{border-top:1px solid #435348;padding-top:28px;margin-top:36px;scroll-margin-top:20px}#customerForm{border-top:1px solid #435348;padding-top:20px;margin-top:24px}#details{scroll-margin-top:20px}

header nav .p3-account-button{min-height:52px;padding:14px 20px;font-size:16px;gap:8px}header nav .p3-account-button [data-cart-count]{display:inline-grid;place-items:center;min-width:24px;height:24px;border-radius:99px;background:#ffffff17;padding:0 6px}@media(max-width:600px){header{flex-wrap:wrap}header nav{gap:10px}header nav .p3-account-button{min-height:48px;padding:12px 16px;font-size:16px}}

/* A compact header with a separate profile control and even mobile buttons. */
body>header{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:18px;align-items:center}
body>header nav{justify-content:flex-end;gap:10px;min-width:0}
body>header #userButton{justify-self:end;min-width:32px}
body>header nav .p3-account-button{min-height:44px;padding:10px 16px;font-size:14px;white-space:nowrap}
@media(max-width:600px){
 body>header{grid-template-columns:minmax(0,1fr) auto;gap:16px 12px;padding:18px 15px}
 body>header .brand{grid-column:1;grid-row:1}
 body>header #userButton{grid-column:2;grid-row:1}
 body>header nav{grid-column:1/-1;grid-row:2;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));width:100%;gap:8px}
 body>header nav .p3-account-button{width:100%;min-width:0;min-height:46px;padding:10px 6px;font-size:14px;gap:6px;border-radius:12px}
 body>header nav .p3-account-button [data-cart-count]{min-width:21px;height:21px;padding:0 4px;font-size:12px}
}
@media(max-width:360px){body>header nav .p3-account-button{font-size:12px}}

/* Compact account and cart buttons. */
body>header nav .p3-account-button{min-height:38px;padding:8px 12px;font-size:13px;border-radius:10px;line-height:1.3}
body>header nav .p3-account-button [data-cart-count]{min-width:18px;height:18px;font-size:11px}
@media(max-width:600px){body>header nav{display:flex;justify-content:flex-start;flex-wrap:wrap;gap:8px}body>header nav .p3-account-button{width:auto;flex:0 1 auto;min-height:38px;padding:8px 12px;font-size:13px}}

/* Keep account navigation aligned to the left. */
body>header nav{justify-content:flex-start;justify-self:start} 

#details:target{border-color:#52ff7b;box-shadow:0 0 0 2px #52ff7b25}#changeLoginEmail{margin-bottom:10px}.tabs .button{min-height:38px;padding:8px 12px;font-size:13px}

/* Match every account section link to the compact button style. */
.tabs{gap:10px;align-items:stretch;margin:18px 0 24px;padding:0}
.tabs .button,.tabs #signOut{display:inline-flex;align-items:center;justify-content:center;min-height:40px;padding:9px 14px;border-radius:11px;font-size:13px;line-height:1.35;font-weight:800;text-decoration:none}
.tabs #signOut{background:#15221a;border-color:#526259}
@media(max-width:600px){.tabs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.tabs .button,.tabs #signOut{width:100%;min-width:0;padding:10px 8px;font-size:13px}}