/* Shared Deratek customer pages. Existing component layouts and form contracts remain intact. */
body.dera-shop {
  --accent: #ce1a21; --accent-dark: #ac1118;
  --home-brand: #ce1a21; --home-brand-dark: #ac1118; --home-bg: #fff;
  --home-ink: #202020; --home-muted: #77777e; --home-line: #eeeeef;
  --home-navy: #202020; --home-shadow: 0 5px 20px #00000006;
  --text: #202020; --muted: #77777e; --line: #eeeeef;
  --panel: #fff; --panel-soft: #fafafa; --dark: #202020;
  --shadow: 0 7px 24px #00000008; --soft-shadow: 0 3px 14px #00000005;
  background: #fff; color: #202020; font-family: "Segoe UI",Arial,sans-serif;
}
.dera-shop h1,.dera-shop h2,.dera-shop h3,.dera-shop h4,.dera-shop h5 { font-family: inherit; }
.dera-shop input,.dera-shop select,.dera-shop textarea,.dera-shop button { font-family: inherit; }
.dera-shop .dera-header { position: relative; z-index: 35; }
.dera-shop .dera-brand { color: #fff; }
.dera-shop .dera-search { box-shadow: none; }
.dera-shop .dera-search input { color: #202020; }
.dera-shop .dera-search button { background: #111; color: #fff; width: 37px; }
.dera-shop .dera-campaign-link { color: #111; background: #ffd100; }
.dera-shop .dera-category-menu nav { text-align: left; }
.dera-shop .dera-announcement a { color: #fff; }
.dera-inner .market-benefit-bar { display: none; }
.dera-inner .content-page-shell,.dera-inner .account-shell,.dera-inner .checkout-shell,
.dera-inner .detail-shell,.dera-inner .cart-shell { max-width: 1440px; width: calc(100% - 40px); margin-inline: auto; padding: 28px 0 48px; }
.dera-inner .account-shell .account-shell { width: 100%; }
.dera-inner .cart-hero,.dera-inner .tracking-hero,.dera-inner .checkout-hero,
.dera-inner .content-hero-card,.dera-inner .page-intro-card {
  background: #fafafa; background-image: none; border: 1px solid #eeeeef;
  border-left: 4px solid #ce1a21; border-radius: 12px; padding: 28px 30px;
  box-shadow: none; color: #202020;
}
.dera-inner .cart-hero h1,.dera-inner .tracking-hero h1,.dera-inner .checkout-hero h1,
.dera-inner .content-hero-card h1,.dera-inner .page-intro-card h1 { color: #202020; font-size: clamp(25px,3vw,36px); letter-spacing: -1px; }
.dera-inner .cart-hero p,.dera-inner .tracking-hero p,.dera-inner .checkout-hero p,
.dera-inner .content-hero-card p,.dera-inner .page-intro-card p { color: #77777e; }
.dera-inner .tracking-hero-visual { background: #fff; border-color: #eeeeef; color: #ce1a21; box-shadow: none; }
.dera-inner .tracking-package-icon { background: #fff0f1; color: #ce1a21; box-shadow: none; }
.dera-inner .cart-flow .active b,.dera-inner .checkout-flow .active b { background: #ce1a21; color: #fff; }
.dera-inner .cart-summary-card,.dera-inner .checkout-card,.dera-inner .content-card,
.dera-inner .detail-panel,.dera-inner .detail-summary-card,.dera-inner .detail-seller-card,
.dera-inner .tracking-progress-card,.dera-inner .tracking-help-grid>article,
.dera-inner .order-list-card,.dera-inner .success-state-card,.dera-inner .cart-line-card {
  background: #fff; border-color: #eeeeef; border-radius: 12px; box-shadow: 0 4px 16px #00000004;
}
.dera-inner .checkout-card,.dera-inner .content-card { padding: 25px; }
.dera-inner .content-grid { gap: 20px; }
.dera-inner .content-card h2,.dera-inner .checkout-card h2 { color: #222; }
.dera-inner .content-card p { color: #77777e; line-height: 1.9; }
.dera-inner .content-card:before,.dera-inner .content-hero-card:before { background: none; }
.dera-inner .content-hero-card>span,.dera-inner .page-intro-card>span,
.dera-inner .tracking-kicker,.dera-inner .checkout-hero-kicker,
.dera-inner .contact-section-kicker { color: #ac1118; background: #fff0f1; }
.dera-inner .cart-checkout-button,.dera-inner .detail-add-button,
.dera-inner .auth-market-submit,.dera-inner .auth-submit,.dera-inner .account-save-button,
.dera-inner .cart-qty-form button,.dera-inner .contact-market-link,
.dera-inner .market-card-actions form>button,.dera-inner .market-empty>a,
.dera-inner .success-state-actions>.cart-checkout-button {
  color: #fff; background: #ce1a21; background-image: none; border-color: #ce1a21;
  border-radius: 7px; box-shadow: none;
}
.dera-inner .cart-checkout-button:hover,.dera-inner .detail-add-button:hover,
.dera-inner .auth-market-submit:hover,.dera-inner .auth-submit:hover,
.dera-inner .account-save-button:hover,.dera-inner .cart-qty-form button:hover,
.dera-inner .contact-market-link:hover { background: #ac1118; color: #fff; }
.dera-inner .detail-secondary-button,.dera-inner .account-secondary-button { background: #fafafa; color: #333; border: 1px solid #e5e5e7; border-radius: 7px; }
.dera-inner .detail-price-row>strong,.dera-inner .cart-line-pricing>strong,
.dera-inner .cart-summary-row.total strong,.dera-inner .market-price>strong { color: #ce1a21; }
.dera-inner .detail-breadcrumb { min-width: 0; max-width: 100%; flex-wrap: wrap; overflow-wrap: anywhere; }
.dera-inner .detail-breadcrumb>strong { min-width: 0; max-width: 100%; }
.dera-inner .checkout-field input,.dera-inner .checkout-field select,.dera-inner .checkout-field textarea,
.dera-inner .auth-market-form input,.dera-inner .auth-form input,
.dera-inner .detail-variation-box select,.dera-inner .cart-qty-form input {
  border: 1px solid #dedee2; border-radius: 7px; background: #fafafa;
  background-image: none; color: #222; box-shadow: none; min-height: 43px;
}
.dera-inner input:focus,.dera-inner select:focus,.dera-inner textarea:focus { border-color: #ce1a21; box-shadow: 0 0 0 3px #ce1a2110; }
.dera-inner input[type="checkbox"],.dera-inner input[type="radio"] { accent-color: #ce1a21; min-height: 0; }
.dera-inner .account-sidebar { top: 25px; }
.dera-inner .account-nav-card { border-color: #eeeeef; border-radius: 12px; box-shadow: none; }
.dera-inner .account-nav-card a { border-radius: 7px; color: #666; }
.dera-inner .account-nav-card a:hover { color: #ac1118; background: #fff5f5; }
.dera-inner .account-nav-card a.active { background: #ce1a21; background-image: none; color: #fff; box-shadow: none; }
.dera-inner .account-meta-grid>div,.dera-inner .profile-form-actions { background: #fafafa; border-color: #eeeeef; border-radius: 9px; }
.dera-inner .account-list-heading h2,.dera-inner .detail-section-heading h2 { color: #222; }
.dera-inner .order-list-head { border-color: #eeeeef; background: #fafafa; }
.dera-inner .market-card { border-color: #eeeeef; border-radius: 12px; box-shadow: none; }
.dera-inner .market-card-media { background: #fff; }
.dera-inner .market-card .tool-button { background: #fff; border-color: #eeeeef; }
.dera-inner .market-card .tool-button.active { color: #ce1a21; background: #fff0f1; }
.dera-inner .auth-market-shell { min-height: 560px; border: 1px solid #eeeeef; border-radius: 14px; box-shadow: 0 6px 25px #00000007; }
.dera-inner .auth-market-visual { background: #fafafa; background-image: none; color: #222; border-right: 1px solid #eeeeef; }
.dera-inner .auth-market-visual:before,.dera-inner .auth-market-visual:after { opacity: .25; }
.dera-inner .auth-market-visual-copy h1 { color: #222; font-size: clamp(30px,3vw,42px); line-height: 1.15; letter-spacing: -1.1px; }
.dera-inner .auth-market-visual-copy p,.dera-inner .auth-benefit-list p { color: #77777e; }
.dera-inner .auth-market-kicker { color: #ac1118; }
.dera-inner .auth-market-kicker i,.dera-inner .tracking-kicker i { background: #ce1a21; }
.dera-inner .auth-benefit-list>div { border-color: #eeeeef; background: #fff; color: #333; }
.dera-inner .auth-benefit-list>div>span,.dera-inner .tracking-help-grid>article>span { background: #fff0f1; color: #ce1a21; }
.dera-inner .market-stock.available { color: #277645; background: #eef8f1; }
.dera-inner .auth-market-card { background: #fff; }
.dera-inner .contact-channel-card,.dera-inner .contact-channel-accent,
.dera-inner .contact-channel-soft { background: #fff; color: #222; border-color: #eeeeef; }
.dera-inner .contact-channel-number { color: #ce1a21; background: #fff0f1; }
.dera-inner .contact-channel-card p { color: #77777e; }
.dera-inner .contact-channel-accent .contact-market-link { background: #ce1a21; color: #fff; }
.dera-inner .checkout-payment-option { background: #fff; border-color: #e5e5e7; }
.dera-inner .checkout-payment-option:has(input:checked) { border-color: #ce1a21; background: #fff8f8; }
.dera-inner .success-state-mark { background: #eef8f1; color: #277645; box-shadow: none; }
.dera-inner .error-state-card .error-mark { background: #fff0f1; color: #b31a25; }
.dera-inner .auth-page { min-height: 520px; display: grid; place-items: center; padding: 45px 20px; background: #fff; }
.dera-inner .auth-card { width: min(100%,480px); padding: 35px; background: #fff; border: 1px solid #eeeeef; border-top: 4px solid #ce1a21; border-radius: 12px; box-shadow: 0 7px 24px #00000006; }
.dera-inner .auth-card h1 { font-size: 28px; letter-spacing: -.8px; margin: 0 0 12px; }
.dera-inner .auth-card>p { color: #77777e; line-height: 1.8; font-size: 13px; }
.dera-inner .auth-form { display: flex; flex-direction: column; gap: 10px; margin-top: 24px; }
.dera-inner .auth-form label { font-size: 12px; font-weight: 600; color: #666; }
.dera-inner .auth-form input { padding: 12px; width: 100%; }
.dera-inner .auth-form button { padding: 13px; margin-top: 10px; font-weight: 700; }
.dera-inner .auth-switch { margin-top: 24px; font-size: 12px; }.dera-inner .auth-switch a { color: #ce1a21; }
.dera-inner .auth-alert,.dera-inner .auth-success { border-radius: 7px; padding: 12px; margin-top: 18px; font-size: 12px; }
.dera-inner .auth-alert { color: #a8202a; background: #fff0f1; }.dera-inner .auth-success { color: #277645; background: #eef8f1; }
.dera-inner .dera-payment-link { width: min(570px,calc(100% - 40px)); margin: 35px auto; padding: 30px; background: #fff; border: 1px solid #eeeeef; border-top: 4px solid #ce1a21; border-radius: 12px; box-shadow: 0 7px 24px #00000005; }
.dera-payment-link h1 { font-size: 27px; margin-bottom: 18px; letter-spacing: -.8px; }
.dera-payment-link p { color: #77777e; font-size: 13px; line-height: 1.8; overflow-wrap: anywhere; }
.dera-payment-link .amount { font-size: 32px; font-weight: 800; color: #ce1a21; margin: 15px 0; }
.dera-payment-link .grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; }
.dera-payment-link label { display: grid; gap: 7px; margin: 15px 0; font-size: 12px; font-weight: 600; min-width: 0; }
.dera-payment-link input,.dera-payment-link select,.dera-payment-link button { width: 100%; padding: 12px; min-width: 0; border: 1px solid #dedee2; border-radius: 7px; font: inherit; }
.dera-payment-link button { background: #ce1a21; color: #fff; border: 0; font-weight: 700; cursor: pointer; margin-top: 12px; }
.dera-payment-link .error { padding: 12px; border-radius: 7px; color: #a8202a; background: #fff0f1; }
.dera-payment-link .status { padding: 15px; border-radius: 9px; background: #fafafa; border: 1px solid #eee; }
.dera-payment-link small { color: #999; font-size: 11px; }
/* Legacy templates used stronger footer selectors; keep the shared footer identical. */
.dera-shop .footer { margin: 0; padding-top: 42px; background: #fafafa; border-top: 1px solid #eeeeef; color: #77777e; }
.dera-shop .footer .container { width: min(1440px,calc(100% - 40px)); max-width: 1440px; margin-inline: auto; padding: 0; }
.dera-shop .footer-grid { display: grid; grid-template-columns: 1.5fr 1fr 1.1fr 1.2fr; gap: 60px; }
.dera-shop .footer h4 { color: #ce1a21; font-size: 24px; font-weight: 800; margin: 0 0 15px; letter-spacing: -.8px; }
.dera-shop .footer h5 { color: #222; font-size: 14px; margin: 5px 0 18px; }
.dera-shop .footer p { font-size: 12px; color: #77777e; line-height: 1.9; }
.dera-shop .footer-grid>div>a { display: block; font-size: 12px; margin-bottom: 12px; color: #77777e; }
.dera-shop .footer a:hover { color: #ce1a21; }.dera-shop .footer-contact a { color: #444; }
.dera-shop .footer .copyright { width: 100%; max-width: none; margin: 35px 0 0; padding: 20px; font-size: 10px; border-top: 1px solid #eeeeef; text-align: center; color: #999; }
@media(max-width: 1150px) { .dera-shop .footer-grid { gap: 35px; } }
@media(max-width: 900px) {
  .dera-shop .dera-search button { width: 37px; }
  .dera-shop .footer .container { width: calc(100% - 32px); }
  .dera-shop .footer-grid { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 30px; }
  .dera-shop .footer-grid>div:first-child { grid-column: 1/-1; }
}
@media(max-width: 640px) {
  .dera-shop .dera-search button { width: 33px; }
  .dera-inner .content-page-shell,.dera-inner .account-shell,.dera-inner .checkout-shell,
  .dera-inner .detail-shell,.dera-inner .cart-shell { width: calc(100% - 24px); padding: 20px 0 30px; }
  .dera-inner .cart-hero,.dera-inner .tracking-hero,.dera-inner .checkout-hero,
  .dera-inner .content-hero-card,.dera-inner .page-intro-card { padding: 22px 20px; border-radius: 10px; }
  .dera-inner .checkout-card,.dera-inner .content-card { padding: 20px; }
  .dera-inner .auth-market-shell { width: calc(100% - 24px); margin: 20px auto 30px; }
  .dera-inner .auth-page { padding: 25px 12px; min-height: 440px; }
  .dera-inner .auth-card { padding: 25px 22px; }.dera-inner .auth-card h1 { font-size: 25px; }
  .dera-inner .dera-payment-link { width: calc(100% - 24px); padding: 25px 20px; margin: 25px auto; }
  .dera-inner .account-sidebar { position: static; }
  .dera-shop .footer { padding-top: 30px; }
  .dera-shop .footer .container { width: calc(100% - 24px); }
  .dera-shop .footer-grid { grid-template-columns: 1fr 1fr; gap: 25px 20px; }
  .dera-shop .footer h4 { font-size: 25px; margin-bottom: 10px; }
  .dera-shop .footer h5 { font-size: 12px; margin-bottom: 14px; }
  .dera-shop .footer p,.dera-shop .footer-grid>div>a { font-size: 11px; }
  .dera-shop .footer .copyright { font-size: 9px; padding: 17px 10px; margin-top: 28px; }
}
