
/* Crafty Corner 0.4.114 — unified public-brand system.
   Applied after legacy styles, with application routing, WooCommerce state,
   private artist controls, data, links, and form behavior left intact. */
:root {
 --cc114-midnight:#0b1119; --cc114-navy:#10131d;
 --cc114-plum:#302238; --cc114-panel:#171b27;
 --cc114-gold:#d6b27c; --cc114-gold-light:#e9c48d;
 --cc114-ivory:#f5ebd9; --cc114-muted:#c5bfbb;
 --cc114-line:rgba(214,178,124,.34);
 --background:218 32% 7%; --foreground:38 38% 92%;
 --card:221 23% 12%; --card-foreground:38 38% 92%;
 --popover:221 23% 12%; --popover-foreground:38 38% 92%;
 --primary:34 48% 66%; --primary-foreground:222 33% 8%;
 --secondary:278 18% 21%; --secondary-foreground:38 38% 92%;
 --muted:218 19% 18%; --muted-foreground:30 9% 75%;
 --accent:34 27% 23%; --accent-foreground:38 38% 92%;
 --border:34 23% 34%; --input:34 23% 34%; --ring:34 48% 66%;
 --font-sans:"DM Sans",Arial,sans-serif;
 --font-heading:"Cormorant Garamond",Georgia,serif;
}
body:not(.wp-admin) {
 background:var(--cc114-midnight);
 color:var(--cc114-ivory);
 font-family:var(--font-sans);
}
body:not(.wp-admin) #app {
 --background:218 32% 7%; --foreground:38 38% 92%;
 --card:221 23% 12%; --card-foreground:38 38% 92%;
 --popover:221 23% 12%; --popover-foreground:38 38% 92%;
 --primary:34 48% 66%; --primary-foreground:222 33% 8%;
 --secondary:278 18% 21%; --secondary-foreground:38 38% 92%;
 --muted:218 19% 18%; --muted-foreground:30 9% 75%;
 --accent:34 27% 23%; --accent-foreground:38 38% 92%;
 --border:34 23% 34%; --input:34 23% 34%; --ring:34 48% 66%;
 background-color:var(--cc114-midnight);
 color:var(--cc114-ivory);
}
body:not(.wp-admin) #app main {
 background-color:var(--cc114-midnight);
 color:var(--cc114-ivory);
}
body:not(.wp-admin) #app main :is(h1,h2,h3,h4,h5,h6) {
 font-family:var(--font-heading);
 color:var(--cc114-ivory);
 letter-spacing:-.025em;
}
body:not(.wp-admin) #app main h1 {
 font-weight:500;
 line-height:1.01;
}
body:not(.wp-admin) #app main :is(p,li) { line-height:1.65; }
body:not(.wp-admin) #app main :is(.text-primary,.text-accent-foreground) {
 color:var(--cc114-gold)!important;
}
body:not(.wp-admin) #app main .text-primary-foreground {
 color:var(--cc114-midnight)!important;
}
body:not(.wp-admin) #app main :is(.text-muted-foreground,.text-secondary-foreground) {
 color:var(--cc114-muted);
}
/* Existing Tailwind component classes are used throughout the React site.
   Recolor at the common token/class layer instead of patching each route. */
body:not(.wp-admin) #app main :is(.bg-primary,button.bg-primary,a.bg-primary) {
 background-color:var(--cc114-gold)!important;
 color:var(--cc114-midnight)!important;
 border-color:var(--cc114-gold)!important;
}
body:not(.wp-admin) #app main :is(.bg-primary,button.bg-primary,a.bg-primary):hover {
 background-color:var(--cc114-gold-light)!important;
}
body:not(.wp-admin) #app main :is(.bg-card,.bg-muted,.bg-secondary) {
 background-color:var(--cc114-panel)!important;
}
body:not(.wp-admin) #app main :is(.border-border,.border-primary,.border-secondary) {
 border-color:var(--cc114-line)!important;
}
body:not(.wp-admin) #app main :is(.bg-background) {
 background-color:var(--cc114-midnight)!important;
}
body:not(.wp-admin) #app main :is(.bg-accent) {
 background-color:#352a35!important;
}
body:not(.wp-admin) #app main :is(.hover\:bg-primary\/90:hover,.hover\:bg-accent:hover) {
 background-color:#483744!important;
}
/* Keep actual photographs, artwork, video, and promotional imagery unchanged. */
body:not(.wp-admin) #app main :is(img,video,picture,canvas,svg) {
 max-width:100%;
}
/* Public editorial sections: avoid legacy teal surface panels.
   background-color only: preserve carefully curated background images. */
body:not(.wp-admin) #app main > section,
body:not(.wp-admin) #app main > div > section {
 border-color:var(--cc114-line);
}
body:not(.wp-admin) #app main :is(.bg-gradient-to-b,.bg-gradient-to-r,.bg-gradient-to-br) {
 --tw-gradient-from:#10131d var(--tw-gradient-from-position)!important;
 --tw-gradient-via:#302238 var(--tw-gradient-via-position)!important;
 --tw-gradient-to:#0b1119 var(--tw-gradient-to-position)!important;
}
/* Public contact/join/press pages use an additional old form stylesheet.
   The presentation below intentionally supersedes those teal hard-coded rules. */
body:is(.cc-form-route-apply,.cc-form-route-contact,.cc-form-route-press) {
 --cc-form-panel:#171b27; --cc-form-input:#10131d;
 --cc-form-line:#8a704e; --cc-form-bright:#f5ebd9;
 --cc-form-muted:#c5bfbb; --cc-form-highlight:#e9c48d;
}
body:is(.cc-form-route-apply,.cc-form-route-contact,.cc-form-route-press) #app main {
 background-color:var(--cc114-midnight)!important;
}
body:is(.cc-form-route-apply,.cc-form-route-contact,.cc-form-route-press) #app main > section,
body:is(.cc-form-route-apply,.cc-form-route-contact,.cc-form-route-press) #app main > div > section {
 background:linear-gradient(120deg,#10131d 0%,#211d2b 63%,#171b27 100%)!important;
 border-color:var(--cc114-line)!important;
}
body:is(.cc-form-route-apply,.cc-form-route-contact,.cc-form-route-press) #app main form {
 background:linear-gradient(145deg,#171b27,#221d29 65%,#141923)!important;
 border:1px solid var(--cc114-line)!important;
 border-top:3px solid var(--cc114-gold)!important;
 box-shadow:0 22px 60px #03050966!important;
}
body:is(.cc-form-route-apply,.cc-form-route-contact,.cc-form-route-press) #app main form label,
body:is(.cc-form-route-apply,.cc-form-route-contact,.cc-form-route-press) #app main form legend {
 color:var(--cc114-ivory)!important;
}
body:is(.cc-form-route-apply,.cc-form-route-contact,.cc-form-route-press) #app main form :is(input:not([type="checkbox"]):not([type="radio"]),textarea,select) {
 background:#10131d!important;
 color:#f5ebd9!important;
 border:1px solid #7b6959!important;
 border-radius:5px!important;
 box-shadow:none!important;
}
body:is(.cc-form-route-apply,.cc-form-route-contact,.cc-form-route-press) #app main form :is(input,textarea,select)::placeholder {
 color:#a79f9a!important;
}
body:is(.cc-form-route-apply,.cc-form-route-contact,.cc-form-route-press) #app main form :is(input,textarea,select):focus-visible {
 outline:2px solid var(--cc114-gold-light)!important;
 outline-offset:2px;
 border-color:var(--cc114-gold)!important;
}
body:is(.cc-form-route-apply,.cc-form-route-contact,.cc-form-route-press) #app main form label.cc-form-required::after {
 background:#352c31!important;
 color:var(--cc114-gold-light)!important;
 border-color:var(--cc114-line)!important;
}
body:is(.cc-form-route-apply,.cc-form-route-contact,.cc-form-route-press) #app main form :is(button[type="submit"],input[type="submit"]) {
 color:#0b1119!important;
 background:var(--cc114-gold)!important;
 border:1px solid var(--cc114-gold)!important;
 border-radius:4px!important;
}
body:is(.cc-form-route-apply,.cc-form-route-contact,.cc-form-route-press) #app main form :is(button[type="submit"],input[type="submit"]):hover {
 background:var(--cc114-gold-light)!important;
}
body:is(.cc-form-route-apply,.cc-form-route-contact,.cc-form-route-press) #app main :is(.text-cyan-300,.text-teal-300,.text-teal-400) {
 color:var(--cc114-gold-light)!important;
}
/* Artist directory, join and featured cards inherit the same look from tokens. */
body:not(.wp-admin) #app main :is(.rounded-xl,.rounded-2xl,.rounded-3xl).border {
 border-color:var(--cc114-line);
}
body:not(.wp-admin) #app main :is(a,button):focus-visible {
 outline:2px solid var(--cc114-gold-light)!important;
 outline-offset:3px;
}
body:not(.wp-admin) #app main a:not([class]):hover {
 color:var(--cc114-gold-light);
}
/* Public header and footer — one shared branded treatment without
   adding/removing any navigation items or adjusting account controls. */
body:not(.wp-admin) :is(#cc-chrome-header,#app) > header,
body:not(.wp-admin) :is(#cc-chrome-header,#app) header.fixed {
 background:linear-gradient(105deg,#10131d 0%,#191824 65%,#111c25 100%)!important;
 border-bottom:1px solid var(--cc114-line)!important;
}
body:not(.wp-admin) :is(#cc-chrome-footer,#app) footer {
 background:linear-gradient(105deg,#10131d 0%,#211b2c 65%,#111c25 100%)!important;
 border-top:1px solid var(--cc114-line)!important;
 color:var(--cc114-ivory);
}
body:not(.wp-admin) :is(#cc-chrome-footer,#app) footer a:hover {
 color:var(--cc114-gold-light)!important;
}
/* Native WordPress public templates and product listings. */
body:not(.wp-admin) :is(.cc-native-content,.cc-shop-curated,.cc-ed-news-wrap,.cc-ed-event-wrap) {
 color:var(--cc114-ivory);
}
body:not(.wp-admin) :is(.cc-native-content,.cc-shop-curated) :is(h1,h2,h3) {
 font-family:var(--font-heading);
}
body:not(.wp-admin) .cc-native-content :is(a.button,button.button,input[type="submit"]):not(:disabled) {
 background:var(--cc114-gold);
 color:var(--cc114-midnight);
 border-color:var(--cc114-gold);
}
body:not(.wp-admin) :is(.cc-shop-category-card,.cc-shop-product-card,.cc-ed-event-card,.cc-ed-news-card) {
 border-color:var(--cc114-line)!important;
}
/* Respect private account, checkout, and plugin admin layouts. */
body.woocommerce-checkout #app main form,
body.woocommerce-account #app main form,
body.woocommerce-cart #app main form {
 background:unset!important;
}
@media (max-width:767px) {
 body:not(.wp-admin) #app main h1 {font-size:clamp(2.5rem,11vw,4.2rem)}
 body:not(.wp-admin) #app main :is(input,select,textarea) {max-width:100%}
 body:not(.wp-admin) #app main form {min-width:0}
}
@media (prefers-reduced-motion:reduce) {
 body:not(.wp-admin) #app main :is(a,button) {transition:none!important}
}
