/* Shared SaaS theme: defaults overridden by published Parse values. */
:root{
/* Storefront theme tokens — slate / blue commerce default. */
--website-primary:#1D4ED8;--website-secondary:#1E3A8A;--website-accent:#0EA5E9;--website-accent-light:#7DD3FC;
--website-background:#F8FAFC;--website-surface:#FFFFFF;--website-text:#0F172A;--website-muted-text:#64748B;--website-border:#E2E8F0;
--website-nav-background:#0F172A;--website-nav-text:#FFFFFF;--website-nav-hover-background:#1E293B;--website-nav-hover-text:#7DD3FC;--website-nav-border:#1E293B;
--website-nav-dropdown-background:#0F172A;--website-nav-dropdown-text:#FFFFFF;--website-nav-dropdown-hover-background:#1E293B;--website-nav-dropdown-hover-text:#7DD3FC;
--website-button-background:#1D4ED8;--website-button-text:#FFFFFF;--website-button-hover-background:#1E3A8A;--website-button-hover-text:#FFFFFF;--website-button-border:#1D4ED8;--website-button-radius:6px;
--website-card-background:#FFFFFF;--website-card-border:#E2E8F0;--website-card-text:#0F172A;--website-card-radius:10px;--website-card-shadow:0 10px 26px rgba(15,23,42,0.08);
--website-input-background:#FFFFFF;--website-input-text:#0F172A;--website-input-placeholder:#64748B;--website-input-border:#E2E8F0;--website-input-focus-border:#1D4ED8;--website-input-radius:6px;
--website-footer-background:#0F172A;--website-footer-text:#FFFFFF;--website-footer-heading:#FFFFFF;--website-footer-link:#7DD3FC;--website-footer-link-hover:#FFFFFF;--website-footer-border:#1E293B;
--website-heading-font:'Instrument Serif', Georgia, serif;--website-body-font:'DM Sans', 'Helvetica Neue', Arial, sans-serif;
--website-heading-weight:400;--website-body-weight:400;--website-button-weight:600;--website-nav-weight:600;
--website-font-heading:var(--website-heading-font);--website-font-body:var(--website-body-font);
--website-product-card-background:#FFFFFF;--website-product-card-border:#E2E8F0;--website-product-card-title:#0F172A;--website-product-card-price:#1D4ED8;--website-product-card-sale:#0EA5E9;--website-product-card-radius:10px;
--website-success:#15803D;--website-warning:#CA8A04;--website-danger:#B91C1C;--website-info:#0369A1;
/* Compatibility aliases for legacy nav CSS class names. */
--stl-brand:var(--website-primary);--stl-brand-dark:var(--website-secondary);--stl-accent:var(--website-accent);--stl-accent-light:var(--website-accent-light);--stl-ink:var(--website-text);--stl-muted:var(--website-muted-text);--stl-surface:var(--website-background);--stl-footer:var(--website-nav-background);--stl-footer-mid:var(--website-nav-dropdown-background);--stl-navy:var(--website-nav-background);--stl-emerald:var(--website-accent);--stl-white:var(--website-nav-text)
}
.website-themed{background:var(--website-background);color:var(--website-text);font-family:var(--website-body-font);font-weight:var(--website-body-weight)}
.website-themed h1,.website-themed h2,.website-themed h3,.website-themed h4,.website-themed h5,.website-themed h6{font-family:var(--website-heading-font);font-weight:var(--website-heading-weight)}
.website-card{background:var(--website-card-background);border:1px solid var(--website-card-border);color:var(--website-card-text);border-radius:var(--website-card-radius);box-shadow:var(--website-card-shadow)}
.website-btn-primary{background:var(--website-button-background);color:var(--website-button-text);border:1px solid var(--website-button-border);border-radius:var(--website-button-radius);font-weight:var(--website-button-weight);text-decoration:none}
.website-btn-primary:hover{background:var(--website-button-hover-background);color:var(--website-button-hover-text)}
.website-btn-outline{border:1px solid var(--website-primary);color:var(--website-primary);background:transparent;border-radius:var(--website-button-radius)}
.website-link{color:var(--website-primary)}
.website-muted{color:var(--website-muted-text)}
.website-nav{background:var(--website-nav-background);color:var(--website-nav-text);font-weight:var(--website-nav-weight)}
.website-nav a:hover{background:var(--website-nav-hover-background);color:var(--website-nav-hover-text)}
.website-footer{background:var(--website-footer-background,var(--website-nav-background,#0F172A));color:var(--website-footer-text,var(--website-nav-text,#f5f5f5))}
.website-footer a{color:var(--website-footer-link,var(--website-accent,#7DD3FC))}
.website-footer a:hover{color:var(--website-footer-link-hover,#fff)}
/* Footer social icons: Appearance tokens (button / footer link), not hardcoded brand colours */
.stl-social-links a,.kmj-ft-social a{color:var(--website-footer-link,var(--website-accent,#7DD3FC));border-color:var(--website-footer-border,var(--website-border,#1E293B));background:transparent}
.stl-social-links a:hover,.kmj-ft-social a:hover{background:var(--website-button-background,var(--website-accent,#0EA5E9));border-color:var(--website-button-border,var(--website-button-background,var(--website-accent,#0EA5E9)));color:var(--website-button-text,var(--website-footer-link-hover,#fff))}
.stl-social-links a i,.kmj-ft-social a i,.stl-social-links a svg,.kmj-ft-social a svg{color:inherit;fill:currentColor}
.website-input{border:1px solid var(--website-input-border);background:var(--website-input-background);color:var(--website-input-text);border-radius:var(--website-input-radius)}
.website-input::placeholder{color:var(--website-input-placeholder)}
.website-input:focus{border-color:var(--website-input-focus-border);outline:none}
.website-product-card{background:var(--website-product-card-background);border:1px solid var(--website-product-card-border);border-radius:var(--website-product-card-radius)}
.website-product-card-title{color:var(--website-product-card-title)}
.website-product-card-price{color:var(--website-product-card-price)}
.website-product-card-sale{color:var(--website-product-card-sale)}
.website-success{color:var(--website-success)}.website-warning{color:var(--website-warning)}.website-danger{color:var(--website-danger)}.website-info{color:var(--website-info)}
/* Opt-in Bootstrap mappings: add .website-bootstrap to a page wrapper. */
.website-bootstrap .btn-primary,.website-bootstrap .btn-success{background:var(--website-button-background);border-color:var(--website-button-border);color:var(--website-button-text);border-radius:var(--website-button-radius);font-weight:var(--website-button-weight)}
.website-bootstrap .btn-primary:hover,.website-bootstrap .btn-success:hover{background:var(--website-button-hover-background);border-color:var(--website-button-hover-background);color:var(--website-button-hover-text)}
.website-bootstrap .btn-outline-primary,.website-bootstrap .btn-outline-success{color:var(--website-primary);border-color:var(--website-primary);border-radius:var(--website-button-radius)}
.website-bootstrap .btn-outline-primary:hover,.website-bootstrap .btn-outline-success:hover{background:var(--website-button-background);border-color:var(--website-button-border);color:var(--website-button-text)}
.website-bootstrap .btn-danger{background:var(--website-danger);border-color:var(--website-danger);border-radius:var(--website-button-radius)}
.website-bootstrap .panel-primary{border-color:var(--website-primary)}
.website-bootstrap .panel-primary>.panel-heading{background:var(--website-primary);border-color:var(--website-primary);color:var(--website-button-text)}
/*
 * Content links only. Exclude filled primary CTA anchors — otherwise
 * --website-primary paints over --website-button-text (invisible label when
 * button fill matches primary, e.g. empty-cart Continue Shopping).
 *
 * Specificity is high because of stacked :not() args. Footer chrome must
 * re-assert Appearance footer tokens below (otherwise dark footers get
 * near-black --website-primary links/icons).
 */
.website-bootstrap a:not(.btn):not(.website-btn-primary):not(.confirm-btn):not(.checkout-btn):not(.place-order-btn){color:var(--website-primary)}
/*
 * Footer regions: beat the content-link rule so text/links/socials follow
 * Appearance footer tokens (readable on --website-footer-background).
 * Dark shells use footer-link-hover; light zones (plaza cards / harbor legal)
 * must not fall back to white-on-white.
 */
.website-bootstrap .website-footer a,
.website-bootstrap .kmj-ft-ledger a,
.website-bootstrap .kmj-ft-atlas a,
.website-bootstrap .kmj-ft-ribbon a,
.website-bootstrap .kmj-ft-harbor-band a{
color:var(--website-footer-link,var(--website-accent,#7DD3FC))!important
}
.website-bootstrap .website-footer a:hover,
.website-bootstrap .kmj-ft-ledger a:hover,
.website-bootstrap .kmj-ft-atlas a:hover,
.website-bootstrap .kmj-ft-ribbon a:hover,
.website-bootstrap .kmj-ft-harbor-band a:hover{
color:var(--website-footer-link-hover,#fff)!important
}
/* Brand / title anchors must stay on heading token, not link pink */
.website-bootstrap .kmj-ft-ribbon a.kmj-ft-ribbon-brand,
.website-bootstrap .kmj-ft-ribbon a.kmj-ft-ribbon-brand:hover,
.website-bootstrap .kmj-ft-ribbon a.kmj-ft-ribbon-brand span{
color:var(--website-footer-heading,var(--website-footer-text,#fff))!important
}
/*
 * Contact rows: address is often a <span>, phone/email are <a>.
 * Both must use the same Appearance token (do not force footer-text on :not(a)).
 */
.website-bootstrap .kmj-ft-ledger .kmj-ft-contact-line,
.website-bootstrap .kmj-ft-ledger .kmj-ft-contact-line:not(a),
.website-bootstrap .kmj-ft-atlas .kmj-ft-meta{
color:var(--website-footer-link,var(--website-accent,#7DD3FC))!important
}
.website-bootstrap .kmj-ft-ledger .kmj-ft-contact-line i{
color:inherit!important
}
/* Light-surface zones: use accent/primary (readable on white), not pale footer-link */
.website-bootstrap .stl-footer-card a,
.website-bootstrap .stl-footer-card .stl-contact-row,
.website-bootstrap .stl-footer-card .stl-contact-row:not(a),
.website-bootstrap .kmj-ft-harbor-legal a{
color:var(--website-accent,var(--website-primary,#C41E3A))!important
}
.website-bootstrap .stl-footer-card .stl-contact-icon{
color:inherit!important
}
.website-bootstrap .stl-footer-card a:hover,
.website-bootstrap .kmj-ft-harbor-legal a:hover{
color:var(--website-primary,var(--website-accent,#141414))!important
}
/* Plaza legal bar sits on footer-background — keep footer link tokens */
.website-bootstrap .stl-footer-bottom a,
.website-bootstrap .stl-footer-bottom a:hover{
color:var(--website-footer-link,var(--website-accent,#E57386))!important
}
.website-bootstrap .stl-footer-bottom a:hover{
color:var(--website-footer-link-hover,#fff)!important
}
.website-bootstrap .kmj-ft-social a,
.website-bootstrap .stl-social-links a,
.website-bootstrap footer[data-footer-style] .kmj-ft-social a{
color:var(--website-footer-link,var(--website-accent,#7DD3FC))!important;
background:rgba(255,255,255,0.08)!important;
border-color:var(--website-footer-link,var(--website-accent,#7DD3FC))!important
}
.website-bootstrap .kmj-ft-social a:hover,
.website-bootstrap .stl-social-links a:hover,
.website-bootstrap footer[data-footer-style] .kmj-ft-social a:hover{
background:var(--website-button-background,var(--website-accent,#0EA5E9))!important;
border-color:var(--website-button-border,var(--website-button-background,var(--website-accent,#0EA5E9)))!important;
color:var(--website-button-text,#fff)!important
}
.website-bootstrap .kmj-ft-social a i,
.website-bootstrap .stl-social-links a i,
.website-bootstrap .kmj-ft-social a svg,
.website-bootstrap .stl-social-links a svg{color:inherit!important;fill:currentColor!important}
.website-bootstrap .stl-footer-card .kmj-ft-social a,
.website-bootstrap footer[data-footer-style="plaza-panels"] .stl-footer-card .kmj-ft-social a{
color:var(--website-accent,var(--website-primary,#C41E3A))!important;
background:var(--website-background,#F5F5F5)!important;
border-color:var(--website-border,var(--website-card-border,#DCDCDC))!important
}
.website-bootstrap .stl-footer-card .kmj-ft-social a:hover,
.website-bootstrap footer[data-footer-style="plaza-panels"] .stl-footer-card .kmj-ft-social a:hover{
background:var(--website-button-background,var(--website-accent,#C41E3A))!important;
border-color:var(--website-button-border,var(--website-button-background,#C41E3A))!important;
color:var(--website-button-text,#fff)!important
}
/*
 * Shared filled primary CTAs (cart / checkout / confirmation / empty states).
 * Specificity + !important beats the content-link colour rule when an <a>
 * is styled as a button. Colours follow Appearance → WebsiteThemes.
 */
.website-bootstrap a.website-btn-primary,
.website-bootstrap a.confirm-btn-primary,
.website-bootstrap a.checkout-btn,
.website-bootstrap a.place-order-btn,
.website-bootstrap .empty-cart>a,
.website-bootstrap .empty-cart a.website-btn-primary{
background:var(--website-button-background)!important;
color:var(--website-button-text)!important;
border:1px solid var(--website-button-border);
border-radius:var(--website-button-radius);
font-weight:var(--website-button-weight)
}
.website-bootstrap a.website-btn-primary:hover,
.website-bootstrap a.confirm-btn-primary:hover,
.website-bootstrap a.checkout-btn:hover,
.website-bootstrap a.place-order-btn:hover,
.website-bootstrap .empty-cart>a:hover,
.website-bootstrap .empty-cart a.website-btn-primary:hover{
background:var(--website-button-hover-background)!important;
color:var(--website-button-hover-text)!important;
border-color:var(--website-button-hover-background)
}
.website-bootstrap .text-primary{color:var(--website-primary)!important}
.website-bootstrap .text-success{color:var(--website-success)!important}
.website-bootstrap .text-danger{color:var(--website-danger)!important}
.website-bootstrap .text-muted{color:var(--website-muted-text)!important}
.website-bootstrap .form-control,.website-bootstrap .form-select{background:var(--website-input-background);color:var(--website-input-text);border-color:var(--website-input-border);border-radius:var(--website-input-radius)}
.website-bootstrap .form-control:focus,.website-bootstrap .form-select:focus{border-color:var(--website-input-focus-border)}
.website-bootstrap .card{background:var(--website-card-background);border-color:var(--website-card-border);color:var(--website-card-text);border-radius:var(--website-card-radius);box-shadow:var(--website-card-shadow)}
.website-bootstrap .bg-light{background:var(--website-background)!important}