/* Slippy Witch site-wide UI audit layer */

:root{
  --sw-space-1:5px;
  --sw-space-2:10px;
  --sw-space-3:15px;
  --sw-space-4:20px;
  --sw-space-5:25px;
  --sw-space-6:30px;
  --sw-space-7:40px;
  --sw-space-8:50px;
  --sw-space-9:60px;
}

/* One visual rule for every header control. Hover gets one border; keyboard focus gets one clear ring. */
.refreshed-header .refresh-nav-control,
.refreshed-header .refresh-nav-language,
.refreshed-header .refresh-nav-admin,
.refreshed-header .refresh-nav-logout{
  border:1px solid transparent!important;
  background:transparent!important;
  box-shadow:none!important;
  outline:none!important;
}
.refreshed-header .refresh-nav-control:hover{
  border-color:rgba(64,38,75,.22)!important;
  background:#fff8ee!important;
  box-shadow:0 6px 16px rgba(64,38,75,.07)!important;
  outline:none!important;
}
.refreshed-header .refresh-nav-control:focus-visible{
  border-color:transparent!important;
  background:#fff8ee!important;
  box-shadow:none!important;
  outline:2px solid #40264b!important;
  outline-offset:2px!important;
}
.refreshed-header .refresh-nav-control{min-width:44px;min-height:44px}
.refreshed-header .refresh-nav>a:first-child{display:inline-flex!important}
.refresh-nav-language[aria-expanded="true"]::before,
.refresh-nav-language[aria-expanded="true"]::after{display:none!important}

/* Language menu: local language name on the left, flag on the right. */
.language-menu-item{min-height:48px;padding:var(--sw-space-2) 12px}
.language-name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.language-flag{display:block;width:38px;height:23px;object-fit:cover;flex:0 0 38px;border-radius:5px;box-shadow:0 2px 6px rgba(50,35,45,.12)}
.language-menu-item.is-disabled{opacity:.55}
.language-menu-item.is-disabled .language-flag{filter:saturate(.72)}

/* Search, filter and common safe actions use the same icon language everywhere. */
.search-bar button,
.catalogue-filters button,
.admin-filters button,
.contact-form button,
.admin-invite-form button,
.login-card .button,
.admin-actions a,
.category-add button,
.category-rename button,
.editor .form-actions button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
}
.search-bar button::before,
.catalogue-filters button::before,
.admin-filters button::before,
.contact-form button::before,
.admin-invite-form button::before,
.login-card .button::before,
.admin-actions a::before,
.category-add button::before,
.category-rename button::before,
.editor .form-actions button::before{
  content:"";
  display:block;
  width:21px;
  height:21px;
  flex:0 0 21px;
  background:center/contain no-repeat;
}
.search-bar button::before,
.catalogue-filters button::before,
.admin-filters button::before,
.contact-form button::before,
.admin-invite-form button::before,
.login-card .button::before,
.editor .form-actions button::before{filter:brightness(0) invert(1)}
.admin-filters button::before{background-image:url('/assets/icons/filter.svg')}
.admin-invite-form button::before{background-image:url('/assets/icons/users.svg')}
.login-card .button::before{background-image:url('/assets/icons/admin.svg')}
.admin-actions a[href="/admin/new"]::before{background-image:url('/assets/icons/add.svg')}
.admin-actions a[href="/admin/categories"]::before{background-image:url('/assets/icons/categories.svg')}
.admin-actions a[href="/admin"]::before{background-image:url('/assets/icons/recipe.svg')}
.category-add button::before{background-image:url('/assets/icons/add.svg');filter:none!important}
.category-rename button::before{background-image:url('/assets/icons/edit.svg');filter:brightness(0) invert(1)}
.editor .form-actions button::before{background-image:url('/assets/icons/save.svg')}
.admin-table a[href^="/admin/edit"]{display:inline-flex;align-items:center;gap:4px}
.admin-table a[href^="/admin/edit"]::before{content:"";width:15px;height:15px;display:block;background:url('/assets/icons/edit.svg') center/contain no-repeat}

/* Catalogue: reduce dead space and keep controls visually grouped. */
.catalogue-hero{
  padding-top:var(--sw-space-6)!important;
  padding-bottom:var(--sw-space-5)!important;
  gap:clamp(var(--sw-space-4),3vw,34px)!important;
}
.catalogue-hero h1{font-size:clamp(2.6rem,4.5vw,4.25rem)!important;max-width:11ch!important}
.catalogue-hero p{max-width:600px!important}
.catalogue-filters{
  margin-top:var(--sw-space-3)!important;
  margin-bottom:var(--sw-space-4)!important;
  padding:var(--sw-space-4)!important;
  gap:12px!important;
}
.taxonomy-filter-shortcuts{margin-top:var(--sw-space-3)!important;margin-bottom:var(--sw-space-2)!important}
.results-heading{padding-top:var(--sw-space-5)!important;padding-bottom:var(--sw-space-3)!important}
.results-heading h2{font-size:clamp(2.4rem,4vw,3.7rem)!important}
.catalogue-grid{padding-bottom:var(--sw-space-9)!important}

/* Shared headings/sections: consistent 5/10/15/20/25/30/40/50/60 rhythm. */
.section-head{padding-top:var(--sw-space-7)!important;padding-bottom:var(--sw-space-3)!important}
.section-head h2{font-size:clamp(2rem,4vw,3.4rem)!important}
.recipe-grid{padding-bottom:var(--sw-space-9)!important}
.home-page .category-card-grid{margin-bottom:var(--sw-space-4)!important;padding-bottom:0!important}
.home-page .category-card-grid + .section-head{padding-top:var(--sw-space-5)!important}
.home-page .home-recipe-grid{padding-bottom:var(--sw-space-7)!important}
.home-page .home-recipe-grid + .section-head{padding-top:var(--sw-space-5)!important}
.home-explore-grid{margin-top:var(--sw-space-5)!important;margin-bottom:var(--sw-space-5)!important}
.home-feature-strip{margin-top:var(--sw-space-5)!important;margin-bottom:var(--sw-space-6)!important}

/* Newsletter: compact two-row editorial composition rather than a tall empty card. */
.newsletter-signup{
  margin-top:var(--sw-space-6)!important;
  margin-bottom:var(--sw-space-6)!important;
  min-height:0!important;
  display:grid!important;
  grid-template-columns:160px minmax(0,1fr)!important;
  grid-template-rows:auto auto!important;
  column-gap:clamp(var(--sw-space-5),3vw,var(--sw-space-7))!important;
  row-gap:var(--sw-space-3)!important;
  align-items:center!important;
  padding:clamp(var(--sw-space-5),3vw,var(--sw-space-7))!important;
}
.newsletter-signup>.ui-section-icon{
  grid-column:1!important;
  grid-row:1 / 3!important;
  width:150px!important;
  height:150px!important;
  min-width:0!important;
  min-height:0!important;
  margin:0!important;
  align-self:center!important;
  justify-self:center!important;
}
.newsletter-signup>.ui-section-icon img{
  width:126px!important;
  height:126px!important;
  max-width:126px!important;
  max-height:126px!important;
  object-fit:contain!important;
}
.newsletter-copy{
  grid-column:2!important;
  grid-row:1!important;
  align-self:end!important;
  max-width:760px!important;
}
.newsletter-copy h2{font-size:clamp(2.1rem,4vw,3.8rem)!important;margin:.12em 0 .18em!important;max-width:12ch!important}
.newsletter-copy p{margin:0!important;max-width:720px!important}
.newsletter-form-wrap{
  grid-column:2!important;
  grid-row:2!important;
  align-self:start!important;
  width:100%!important;
  max-width:760px!important;
}
.newsletter-form{margin:0!important;max-width:760px!important}
.newsletter-form .formkit-fields{margin-top:0!important}
.newsletter-consent{margin-top:var(--sw-space-2)!important}

.home-cta{margin-top:var(--sw-space-6)!important;margin-bottom:var(--sw-space-7)!important}
.newsletter-confirmed{
  max-width:760px!important;
  margin:0 auto!important;
  padding:clamp(var(--sw-space-5),4vw,var(--sw-space-7))!important;
}
.newsletter-confirmed h1{font-size:clamp(2.4rem,5vw,4.2rem)!important}

/* Admin: denser working layout, especially on long recipe tables. */
.admin-head{
  margin-top:var(--sw-space-5)!important;
  margin-bottom:var(--sw-space-3)!important;
  align-items:center!important;
}
.admin-head h1{font-size:clamp(2.5rem,5vw,4rem)!important;margin-bottom:.08em!important}
.admin-table{margin-bottom:var(--sw-space-8)!important}
.admin-users-panel{margin-top:var(--sw-space-4)!important;margin-bottom:var(--sw-space-5)!important}
.admin-invite-result{margin-top:var(--sw-space-3)!important;margin-bottom:var(--sw-space-3)!important}
.editor{margin-top:var(--sw-space-5)!important;margin-bottom:var(--sw-space-8)!important}
.admin-access-list{gap:var(--sw-space-2)!important}
.admin-access-row{padding:var(--sw-space-3)!important}
.admin-filters{gap:var(--sw-space-2)!important;padding:var(--sw-space-3)!important;margin-top:0!important;margin-bottom:var(--sw-space-2)!important}
.admin-result-count{margin-top:var(--sw-space-2)!important;margin-bottom:var(--sw-space-2)!important}
.category-admin.editor{margin-top:var(--sw-space-4)!important}
.category-admin-row{gap:var(--sw-space-2)!important}

/* Login, invite, contact and legal pages: remove accidental empty canvas and center short states deliberately. */
body.login-page,
body.newsletter-confirmed-page{min-height:100vh!important;display:flex!important;flex-direction:column!important}
body.login-page main,
body.newsletter-confirmed-page main{min-height:0!important;flex:1 1 auto!important;width:100%!important;display:grid!important;place-items:center!important;padding:var(--sw-space-6) var(--sw-space-4)!important}
body.login-page .login-card,
body.newsletter-confirmed-page .newsletter-confirmed{margin:0 auto!important}
.login-card,
.empty{
  margin-top:clamp(var(--sw-space-7),6vw,72px)!important;
  margin-bottom:clamp(var(--sw-space-7),6vw,72px)!important;
}
.legal-shell{
  padding-top:clamp(var(--sw-space-6),5vw,var(--sw-space-9))!important;
  padding-bottom:var(--sw-space-9)!important;
}
.legal-shell h1{font-size:clamp(2.5rem,5vw,4.4rem)!important}
.legal-shell h2{margin-top:var(--sw-space-6)!important}
.legal-toc{margin-top:var(--sw-space-5)!important;margin-bottom:var(--sw-space-5)!important}
.contact-layout{margin-top:var(--sw-space-5)!important;gap:var(--sw-space-4)!important}
.contact-form{padding:var(--sw-space-5)!important;gap:var(--sw-space-3)!important}
.contact-form textarea{min-height:150px!important}
.admin-invite-choice{margin-top:var(--sw-space-4)!important;margin-bottom:var(--sw-space-4)!important}
.admin-invite-choice>div{padding:var(--sw-space-4)!important}

/* Small visual cues on utility pages. */
.contact-shell>h1::before,
.catalogue-hero h1::before{
  content:"";
  display:inline-block;
  width:.72em;
  height:.72em;
  margin-right:.22em;
  vertical-align:.02em;
  background:center/contain no-repeat;
}
.contact-shell>h1::before{background-image:url('/assets/icons/contact.svg')}
.catalogue-hero h1::before{background-image:url('/assets/icons/search.svg')}

/* Footer hierarchy and copyright. */
footer{gap:var(--sw-space-3)!important;align-items:center!important;flex-wrap:wrap!important;padding-top:var(--sw-space-5)!important;padding-bottom:var(--sw-space-5)!important}
.site-footer-copyright{font-weight:700;white-space:nowrap}
.site-footer-legal{width:auto!important;margin-left:auto!important;justify-content:flex-end!important}

/* Avoid cards stretching into empty vertical space. */
.contact-card,.home-explore-panel,.home-feature-card{align-self:start}

@media(max-width:900px){
  .catalogue-hero{padding-top:var(--sw-space-5)!important;padding-bottom:var(--sw-space-4)!important}
  .catalogue-filters{padding:var(--sw-space-3)!important}
  .admin-head{margin-top:var(--sw-space-4)!important}
  .newsletter-signup{grid-template-columns:120px minmax(0,1fr)!important;padding:var(--sw-space-5)!important}
  .newsletter-signup>.ui-section-icon{width:112px!important;height:112px!important}
  .newsletter-signup>.ui-section-icon img{width:96px!important;height:96px!important;max-width:96px!important;max-height:96px!important}
}
@media(max-width:620px){
  .refreshed-header .refresh-nav-control{min-width:40px;min-height:40px}
  .language-flag{width:34px;height:21px;flex-basis:34px}
  .section-head{padding-top:var(--sw-space-6)!important}
  .recipe-grid{padding-bottom:var(--sw-space-7)!important}
  .home-page .category-card-grid,
  .home-page .home-recipe-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px!important}
  .home-page .card-copy{padding:12px!important}
  .home-page .card-copy h3{font-size:1.05rem!important}
  .newsletter-signup{
    grid-template-columns:1fr!important;
    grid-template-rows:auto auto auto!important;
    row-gap:var(--sw-space-3)!important;
    text-align:left!important;
    padding:var(--sw-space-5)!important;
  }
  .newsletter-signup>.ui-section-icon{grid-column:1!important;grid-row:1!important;width:88px!important;height:88px!important;justify-self:start!important}
  .newsletter-signup>.ui-section-icon img{width:76px!important;height:76px!important;max-width:76px!important;max-height:76px!important}
  .newsletter-copy{grid-column:1!important;grid-row:2!important;align-self:auto!important}
  .newsletter-copy h2{font-size:2rem!important;max-width:15ch!important}
  .newsletter-form-wrap{grid-column:1!important;grid-row:3!important;max-width:none!important}
  .legal-shell{padding-top:var(--sw-space-6)!important;padding-bottom:var(--sw-space-7)!important}
  .contact-form{padding:var(--sw-space-4)!important}
  .newsletter-confirmed{padding:var(--sw-space-5)!important}
  footer{align-items:flex-start!important;padding-top:var(--sw-space-4)!important;padding-bottom:var(--sw-space-4)!important}
  .site-footer-legal{width:100%!important;margin-left:0!important;justify-content:flex-start!important}
  .grecaptcha-badge{left:auto!important;right:12px!important;width:256px!important}
}
@media(max-width:360px){
  .home-page .category-card-grid,
  .home-page .home-recipe-grid{grid-template-columns:1fr!important}
}
@media print{.language-menu{display:none!important}}
/* UI completion: frameless discovery artwork */
.region-icon-item,.season-icon-item,.holiday-icon-item{
  min-width:88px!important;
  min-height:88px!important;
  display:grid!important;
  place-items:center!important;
  padding:4px!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  overflow:visible!important;
}
.region-icon-item .region-artwork{
  width:clamp(104px,9vw,142px)!important;
  height:auto!important;
  max-width:none!important;
  object-fit:contain!important;
  filter:drop-shadow(0 9px 12px rgba(50,35,45,.16));
  transition:transform .16s ease,filter .16s ease;
}
.season-icon-item .season-artwork,.holiday-icon-item .holiday-artwork{
  width:clamp(72px,6.4vw,94px)!important;
  height:clamp(72px,6.4vw,94px)!important;
  max-width:none!important;
  object-fit:contain!important;
  filter:drop-shadow(0 8px 10px rgba(50,35,45,.14));
  transition:transform .16s ease,filter .16s ease;
}
.region-icon-item:hover,.region-icon-item:focus-visible,
.season-icon-item:hover,.season-icon-item:focus-visible,
.holiday-icon-item:hover,.holiday-icon-item:focus-visible{
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  transform:translateY(-3px)!important;
}
.region-icon-item:focus-visible,.season-icon-item:focus-visible,.holiday-icon-item:focus-visible{
  outline:2px solid var(--plum)!important;
  outline-offset:4px!important;
}
@media(max-width:700px){
  .region-icon-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:8px!important}
  .region-icon-item .region-artwork{width:clamp(96px,27vw,126px)!important}
  .season-icon-item .season-artwork,.holiday-icon-item .holiday-artwork{width:72px!important;height:72px!important}
}
@media(max-width:420px){
  .region-icon-item .region-artwork{width:94px!important}
  .season-icon-item .season-artwork,.holiday-icon-item .holiday-artwork{width:68px!important;height:68px!important}
}
/* UI completion: unified icon-only public actions */
.icon-action,.taxonomy-filter-shortcuts a{
  position:relative;
  width:48px!important;
  height:48px!important;
  min-width:48px!important;
  min-height:48px!important;
  padding:8px!important;
  border:0!important;
  border-radius:14px!important;
  background:transparent!important;
  color:var(--plum)!important;
  display:inline-grid!important;
  place-items:center!important;
  box-shadow:none!important;
  overflow:visible!important;
  transition:transform .15s ease;
}
.icon-action img,.taxonomy-filter-shortcuts a img{
  width:30px!important;
  height:30px!important;
  max-width:30px!important;
  max-height:30px!important;
  object-fit:contain!important;
  filter:drop-shadow(0 5px 7px rgba(50,35,45,.12));
}
.search-bar .icon-action::before,.catalogue-filters .icon-action::before,.contact-form .icon-action::before{
  content:none!important;
  display:none!important;
}
.icon-action:hover,.taxonomy-filter-shortcuts a:hover{
  background:transparent!important;
  box-shadow:none!important;
  transform:translateY(-2px)!important;
}
.icon-action:focus-visible,.taxonomy-filter-shortcuts a:focus-visible{
  outline:2px solid var(--plum)!important;
  outline-offset:3px!important;
}
.icon-action[data-tooltip]::after,.taxonomy-filter-shortcuts a[data-tooltip]::after{
  content:attr(data-tooltip);
  position:absolute;
  left:50%;
  bottom:calc(100% + 9px);
  transform:translate(-50%,4px);
  z-index:9999;
  padding:7px 10px;
  border-radius:9px;
  background:var(--plum);
  color:#fff;
  font-size:.74rem;
  font-weight:800;
  line-height:1;
  white-space:nowrap;
  box-shadow:0 10px 26px rgba(50,35,45,.22);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .12s ease,transform .12s ease,visibility .12s ease;
}
.icon-action:hover::after,.icon-action:focus-visible::after,.taxonomy-filter-shortcuts a:hover::after,.taxonomy-filter-shortcuts a:focus-visible::after{
  opacity:1;
  visibility:visible;
  transform:translate(-50%,0);
}
.search-bar .icon-action{flex:0 0 48px!important;padding:8px!important}
.catalogue-filters .icon-action,.contact-form .icon-action{justify-self:start!important}
@media(max-width:720px){
  .catalogue-filters .icon-action{width:48px!important}
}
/* UI completion: spacing consolidation */
.taxonomy-browse{
  margin-top:18px!important;
  margin-bottom:14px!important;
  padding-top:14px!important;
  padding-bottom:14px!important;
}
.taxonomy-browse-item{
  min-height:74px!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
}
.taxonomy-browse-artwork{
  width:56px!important;
  height:56px!important;
  object-fit:contain!important;
  filter:drop-shadow(0 7px 9px rgba(50,35,45,.13));
  transition:transform .15s ease,filter .15s ease;
}
.taxonomy-browse-item:hover,.taxonomy-browse-item:focus-visible{
  background:transparent!important;
  box-shadow:none!important;
}
.home-explore-grid{margin-top:18px!important;margin-bottom:22px!important;gap:16px!important}
.home-explore-panel{padding:18px!important}
.home-explore-panel header{margin-bottom:10px!important}
.region-icon-grid{gap:6px!important}
.season-icon-grid{gap:6px!important}
.holiday-divider{margin:12px 0 8px!important}
.holiday-icon-grid{gap:4px!important}
.home-feature-strip{margin-top:20px!important;margin-bottom:26px!important}
.newsletter-signup{margin-top:24px!important;margin-bottom:24px!important}
.catalogue-filters{margin-top:12px!important;margin-bottom:18px!important}
.taxonomy-filter-shortcuts{margin-top:12px!important;margin-bottom:4px!important;gap:5px!important}
.contact-layout{margin-top:20px!important}
.legal-shell{padding-top:clamp(24px,4vw,50px)!important}
@media(max-width:700px){
  .taxonomy-browse{margin-left:14px!important;margin-right:14px!important;padding:10px 8px!important;gap:4px!important}
  .taxonomy-browse-item{min-height:62px!important}
  .taxonomy-browse-artwork{width:44px!important;height:44px!important}
  .home-explore-grid{margin-top:16px!important;margin-bottom:18px!important}
  .home-explore-panel{padding:15px!important}
  .home-feature-strip{margin-top:18px!important;margin-bottom:22px!important}
  .newsletter-signup{margin-top:20px!important;margin-bottom:20px!important}
  .catalogue-filters{margin-top:10px!important;margin-bottom:14px!important}
  .contact-layout{margin-top:16px!important}
}

/* Final visual consistency: compact catalogue, stronger affordances, optical icon balance, and branded empty imagery. */
.icon-action{min-width:44px!important;min-height:44px!important;border:1px solid rgba(64,38,75,.16)!important;background:#fffaf2!important;box-shadow:0 5px 14px rgba(64,38,75,.06)!important}
.icon-action:hover{border-color:rgba(64,38,75,.28)!important;background:#fff4e8!important;box-shadow:0 7px 18px rgba(64,38,75,.09)!important}
.icon-action-search img,.icon-action-search::before{transform:scale(.94)}
.icon-action-filter img,.icon-action-filter::before{transform:scale(1.04)}
.icon-action-send img,.icon-action-send::before{transform:scale(.96)}
.icon-action-search::before{transform:scale(.94)}
.icon-action-filter::before{transform:scale(1.04)}
.icon-action-send::before{transform:scale(.96)}
.card-image:not(:has(img)){position:relative;background:linear-gradient(145deg,#f0e4d8,#e6d8cd)!important}
.card-image:not(:has(img))::before{content:"";width:74px;height:74px;background:url('/assets/branding/slippy-witch-mascot.webp') center/contain no-repeat;opacity:.28;position:absolute;left:50%;top:44%;transform:translate(-50%,-50%)}
.card-image:not(:has(img)){color:#6f606a!important;font-weight:700}
.site-footer-legal a{min-height:32px;display:inline-flex;align-items:center;padding:4px 2px;line-height:1.3}
@media(max-width:620px){
  .catalogue-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px!important}
  .catalogue-grid .recipe-card .card-copy{padding:12px!important}
  .catalogue-grid .recipe-card .card-copy h3{font-size:1.05rem!important;line-height:1.12!important}
  .catalogue-grid .recipe-card .meta-line{gap:6px!important;flex-wrap:wrap!important}
  .catalogue-grid .recipe-card .card-image{aspect-ratio:4/3!important}
}
@media(max-width:360px){
  .catalogue-grid{grid-template-columns:1fr!important}
}