/* Canadian Outlet - Halloween 2026 skin for the real cart / checkout / account /
   track-order pages. Colours are re-mapped by coh-skin.js; this file sets the
   page canvas, type, product-photo plates and the Halloween dressing. */
html.coh-skin-on,html.coh-skin-on body{background:#140B1F!important;color:#F4EEFA}
html.coh-skin-on body{font-family:Inter,system-ui,sans-serif}
html.coh-skin-on main h1,html.coh-skin-on #main-content h1,html.coh-skin-on .woocommerce h1,html.coh-skin-on .entry-title{font-family:Creepster,Anton,Impact,sans-serif!important;font-weight:400!important;letter-spacing:.02em!important;color:#FF7A1A!important;text-shadow:0 0 24px rgba(255,122,26,.45)}
html.coh-skin-on main h2:not(:has(a)),html.coh-skin-on #main-content h2:not(:has(a)),html.coh-skin-on .woocommerce h2:not(:has(a)){font-family:Anton,Impact,sans-serif!important;font-weight:400!important;text-transform:uppercase;letter-spacing:.01em!important}
html.coh-skin-on a:focus-visible,html.coh-skin-on button:focus-visible,html.coh-skin-on input:focus-visible,html.coh-skin-on select:focus-visible{outline:3px solid #FF7A1A!important;outline-offset:2px}
html.coh-skin-on input::placeholder,html.coh-skin-on textarea::placeholder{color:#8E80A2!important}
html.coh-skin-on input[type=checkbox],html.coh-skin-on input[type=radio]{accent-color:#FF7A1A}
html.coh-skin-on .coh-skin-plate{isolation:isolate;background:radial-gradient(ellipse 80% 75% at 50% 45%,#FFFBF3 0%,#F6EEDF 45%,#E4D8EC 100%)!important;border-radius:12px!important;overflow:hidden}
html.coh-skin-on .coh-skin-plate img{mix-blend-mode:multiply}
html.coh-skin-on .co-logo-link img,html.coh-skin-on .co-site-footer img[src*="logo"]{content:url("coh-logo-orange.png")}
/* dressing */
.coh-skin-strip{position:relative;z-index:10000;background:#FF7A1A;color:#1A0E00;font:700 13px/1.4 Inter,system-ui,sans-serif;letter-spacing:.02em;text-align:center;padding:9px 16px}
.coh-skin-strip a{color:#1A0E00!important;text-decoration:underline!important}
.coh-skin-web{position:fixed;top:0;right:0;width:180px;height:180px;color:rgba(244,238,250,.18);transform:scaleX(-1);pointer-events:none;z-index:1}
.coh-skin-flock{position:fixed;inset:0;pointer-events:none;overflow:hidden;z-index:9998}
.coh-skin-flock span{position:absolute;left:0;width:44px;opacity:0;animation:coh-skin-across 26s linear infinite}
.coh-skin-flock svg{width:100%;height:auto;animation:coh-skin-flap .32s ease-in-out infinite;filter:drop-shadow(0 0 5px rgba(255,122,26,.45))}
.coh-skin-flock span:nth-child(1){top:18vh;animation-delay:4s}
.coh-skin-flock span:nth-child(2){top:24vh;width:30px;animation-delay:4.8s}
.coh-skin-flock span:nth-child(3){top:62vh;width:36px;animation-delay:17s;animation-duration:32s}
@keyframes coh-skin-across{0%{transform:translate(-12vw,0);opacity:0}2%{opacity:1}12%{transform:translate(25vw,-6vh)}22%{transform:translate(60vw,4vh)}32%{transform:translate(95vw,-5vh);opacity:1}34%,100%{transform:translate(112vw,-3vh);opacity:0}}
@keyframes coh-skin-flap{0%,100%{transform:scaleY(1)}50%{transform:scaleY(.5)}}
.coh-skin-badge{position:fixed;left:12px;bottom:12px;z-index:10001;display:flex;align-items:center;gap:8px;padding:8px 12px;border-radius:999px;background:#1C1229;border:1px solid #4A3866;color:#F4EEFA;font:700 12px/1 Inter,system-ui,sans-serif;box-shadow:0 10px 30px -10px rgba(0,0,0,.7)}
.coh-skin-badge a{color:#FF7A1A!important;text-decoration:none!important}
@media (prefers-reduced-motion: reduce){.coh-skin-flock{display:none}}
@media (max-width:700px){.coh-skin-web{width:110px;height:110px}.coh-skin-badge{bottom:76px}}

/* Pair interactive menu backgrounds with the Halloween foreground palette. */
html.coh-skin-on .co-mobile-menu a:hover,
html.coh-skin-on .co-mobile-menu a:focus-visible,
html.coh-skin-on .co-drawer-links a:hover,
html.coh-skin-on .co-drawer-links a:focus-visible{background-color:#33244A!important;color:#F4EEFA!important}
