
/* Sprint 5 · Editorial dashboard v2. Recreates the approved reference as live UI. */
.k-topline{display:flex;align-items:center;gap:1rem;margin:-.3rem 0 .8rem}.k-topline-search{display:flex;align-items:center;gap:.65rem;flex:1;min-height:45px;border:1px solid #d4d1c6;background:#fffefa;border-radius:14px;padding:.55rem 1rem;box-shadow:0 3px 9px #122b2012}.k-topline-search a{color:#4b554d;text-decoration:none;font-size:.92rem}.k-topline-search .k-icon{color:#45624c}.k-topline-user{width:43px;height:43px;display:grid;place-items:center;border-radius:50%;background:#0c4933;color:#fff;font-weight:800;border:2px solid #e2d9bf}
.k-hero-photo{min-height:260px;padding:clamp(1.3rem,3vw,2.4rem);background:linear-gradient(90deg,#10281ff7 0%,#10281feb 35%,#10281f99 60%,#10281f10 100%),url('https://images.unsplash.com/photo-1547592180-85f173990554?auto=format&fit=crop&w=1600&q=85') right 50%/cover no-repeat,#193c2c}
.k-hero-photo h1{font-size:clamp(2.3rem,3.5vw,3.65rem)}.k-hero-photo p:not(.k-kicker){max-width:520px}.k-hero-photo:after{display:none}
.k-stats-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.75rem}.k-stats-grid .k-stat{min-height:85px;padding:.9rem 1rem;box-shadow:0 3px 9px #48391e10;position:relative;overflow:hidden;background:linear-gradient(105deg,#fffdf7,#faf5e9)}.k-stat-leaves:after{content:"❧";position:absolute;right:.4rem;bottom:-1.15rem;font-size:5rem;color:#8aa65a44;transform:rotate(-25deg);pointer-events:none}.k-stats-grid .k-stat-icon{border-radius:13px;width:54px;height:54px;flex-basis:54px;color:#17582f;background:#e6f0d4}.k-stats-grid .k-stat-icon .k-icon{width:2rem;height:2rem}.k-stats-grid .k-stat-alert .k-stat-icon{color:#b82d19;background:#ffe0d3}.k-stats-grid .k-stat-alert strong{color:#b82d19}.k-stat-copy{position:relative;z-index:1}.k-stats-grid .k-stat-copy strong{font-size:2.15rem}.k-stats-grid .k-stat-copy>span{font-weight:650;color:#263329;font-size:.82rem}
.k-dashboard-grid{display:grid;grid-template-columns:minmax(0,1.85fr) minmax(280px,1fr);gap:.8rem}.k-bottom-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.k-dashboard-grid>.k-panel{min-width:0;padding:1rem 1.1rem;background:linear-gradient(155deg,#fffefa,#faf4e9);box-shadow:0 3px 12px #48391e12}.k-dashboard-grid .k-section-heading{margin-bottom:.75rem}.k-dashboard-grid .k-section-heading h2{font-size:clamp(1.35rem,1.8vw,1.85rem);margin:0}.k-dashboard-grid .k-section-heading h2:after{width:40px}.k-dashboard-grid .k-section-heading a{white-space:nowrap;font-size:.85rem}.k-heading-icon{color:var(--k-paprika);width:1.05em;height:1.05em;vertical-align:-.1em}.k-dinner-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.65rem}.k-food-card{display:flex;flex-direction:column;overflow:hidden;border:1px solid #e6dcca;border-radius:15px;background:#fffdf9;text-decoration:none;color:#1d2b22;box-shadow:0 2px 6px #493d2310;transition:transform .15s,box-shadow .15s}.k-food-card:hover{transform:translateY(-3px);box-shadow:0 7px 18px #493d2324}.k-food-card:focus-visible{outline:3px solid var(--k-paprika);outline-offset:3px}.k-food-image{height:clamp(105px,11vw,165px);position:relative;background:#d7c4a2 center/cover no-repeat}.k-food-image-1{background-image:url('https://images.unsplash.com/photo-1532550907401-a500c9a57435?auto=format&fit=crop&w=650&q=85')}.k-food-image-2{background-image:url('https://images.unsplash.com/photo-1544025162-d76694265947?auto=format&fit=crop&w=650&q=85')}.k-food-image-3{background-image:url('https://images.unsplash.com/photo-1476224203421-9ac39bcb3327?auto=format&fit=crop&w=650&q=85')}.k-food-image:after{content:"";position:absolute;inset:50% 0 0;background:linear-gradient(transparent,#0004)}.k-food-label{position:absolute;left:.55rem;bottom:.5rem;z-index:1;background:#f8f2e7ed;border-radius:999px;padding:.15rem .55rem;font-size:.65rem;font-weight:800;text-transform:uppercase;letter-spacing:.07em;color:#76401f}.k-favorite{position:absolute;right:.6rem;top:.5rem;z-index:1;background:#fffefaeb;color:var(--k-paprika);width:30px;height:30px;border-radius:50%;display:grid;place-items:center}.k-food-body{padding:.65rem .75rem;display:flex;flex:1;flex-direction:column;gap:.4rem}.k-food-body h3{font-size:clamp(1rem,1.2vw,1.2rem);line-height:1.1;margin:0;min-height:2.2em}.k-food-meta{display:flex;flex-wrap:wrap;gap:.5rem;color:#485349;font-size:.72rem}.k-food-meta .k-icon{width:1em;height:1em}.k-food-cta{display:inline-flex;align-self:flex-start;background:#e8f2d9;color:#1b5936;padding:.2rem .6rem;border-radius:999px;font-size:.73rem;font-weight:750;margin-top:auto}.k-empty{grid-column:1/-1;display:flex;align-items:center;gap:1rem;flex-wrap:wrap;padding:1.5rem}.k-empty>.k-icon{font-size:2rem;color:#32684a}.k-empty p{margin:0}
.k-week-list{border:1px solid #e7ddce;border-radius:10px;overflow:hidden}.k-week-row{display:grid;grid-template-columns:48px minmax(0,1fr) 18px;align-items:center;gap:.6rem;min-height:34px;border-bottom:1px solid #e7ddce;font-size:.83rem}.k-week-row:last-child{border:0}.k-week-day{align-self:stretch;display:grid;place-items:center;border-right:1px solid #e7ddce;font-weight:800;background:#f5f0e7}.k-week-meal{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:600}.k-week-empty{color:#8d9189;font-weight:400}.k-week-today{background:#ffe6c6}.k-week-today .k-week-day{color:#ac390e;background:#ffdfb5}.k-week-marker{color:var(--k-paprika)}
.k-pantry-body,.k-shopping-body{display:grid;grid-template-columns:34% minmax(0,1fr);gap:.85rem;align-items:stretch}.k-shopping-body{grid-template-columns:minmax(0,1fr) 29%}.k-pantry-visual,.k-shopping-visual{min-height:165px;border-radius:12px;background:#d8e1c3 center/cover no-repeat}.k-pantry-visual{background-image:url('https://images.unsplash.com/photo-1604908176997-4313b9e25e57?auto=format&fit=crop&w=500&q=80')}.k-shopping-visual{background-image:url('https://images.unsplash.com/photo-1542838132-92c53300491e?auto=format&fit=crop&w=500&q=80')}.k-preview-list{min-width:0}.k-preview-row{display:flex;align-items:center;gap:.55rem;padding:.48rem 0;border-bottom:1px solid #e5dfd4;font-size:.82rem}.k-preview-row:last-child{border-bottom:0}.k-dot{width:10px;height:10px;border-radius:50%;background:#268c36;flex-shrink:0}.k-dot-low{background:#eb7a22}.k-preview-name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.k-preview-qty{white-space:nowrap;font-size:.76rem}.k-chip-low{border-radius:999px;background:#ffe5ca;color:#a83a0c;padding:.15rem .5rem;font-weight:800}.k-shopping-square{height:17px;width:17px;border:1.5px solid #738079;border-radius:4px;flex-shrink:0}.k-count-pill{display:inline-block;vertical-align:middle;background:var(--k-paprika);color:white;font:700 .7rem system-ui,sans-serif;padding:.28rem .6rem;border-radius:999px;white-space:nowrap}.k-more-items{display:inline-block;padding-top:.5rem;font-size:.8rem}
@media(min-width:1200px){body:has(.k-mobile-nav) .brand-nav .navbar-nav .nav-link{display:flex;align-items:center;gap:.7rem}body:has(.k-mobile-nav) .brand-nav .navbar-nav .k-icon{width:1.35rem;height:1.35rem;color:#e2dca9}}
@media(max-width:1199.98px){.k-dashboard-grid{grid-template-columns:minmax(0,1.4fr) minmax(260px,1fr)}.k-dinner-grid{gap:.45rem}}
@media(max-width:991.98px){.k-dashboard-grid{grid-template-columns:1fr}.k-bottom-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.k-hero-photo{background-position:60% center}}
@media(max-width:767.98px){.k-topline{margin-top:0}.k-topline-search{min-width:0}.k-topline-search a{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.k-stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.k-stats-grid .k-stat{padding:.7rem;min-height:70px}.k-stats-grid .k-stat-icon{width:40px;height:40px;flex-basis:40px}.k-stats-grid .k-stat-icon .k-icon{width:1.5rem;height:1.5rem}.k-stats-grid .k-stat-copy strong{font-size:1.6rem}.k-stats-grid .k-stat-copy>span{font-size:.69rem}.k-dinner-grid{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:.6rem}.k-food-card{flex:0 0 min(70vw,235px);scroll-snap-align:start}.k-food-image{height:140px}.k-bottom-grid{grid-template-columns:1fr}.k-hero-photo{background:linear-gradient(90deg,#10281feF,#10281fb0),url('https://images.unsplash.com/photo-1547592180-85f173990554?auto=format&fit=crop&w=900&q=80') center/cover no-repeat,#193c2c}.k-hero-photo h1{font-size:2.35rem}.k-dashboard-grid .k-section-heading h2{font-size:1.35rem}.k-dashboard-grid>.k-panel{padding:.85rem}}
@media(max-width:400px){.k-pantry-body,.k-shopping-body{grid-template-columns:1fr}.k-pantry-visual,.k-shopping-visual{min-height:95px}.k-stats-grid .k-stat{gap:.4rem}}


/* Self-hosted original decorative artwork */
@media(min-width:1200px){body:has(.k-mobile-nav) .brand-nav:after{content:"";display:block;position:relative;flex:0 0 auto;width:calc(100% + 1.8rem);height:265px;margin:1.5rem -.9rem -1.5rem;background:url('../img/art/sidebar-botanicals.svg') bottom center/contain no-repeat;pointer-events:none;opacity:.98}}
.k-stat-leaves:after{content:"";position:absolute;right:-.15rem;bottom:-.25rem;width:78px;height:78px;background:url('../img/art/herb-sprig.svg') center/contain no-repeat;transform:none;opacity:.55}
.k-pantry-visual{background-image:url('../img/art/pantry-jars.svg');background-size:cover;background-position:center}
.k-shopping-visual{background-image:url('../img/art/grocery-bag.svg');background-color:#e7eddb;background-size:contain;background-position:center bottom}


/* Sprint 5 visual QA fixes: artwork must fit the available panel/sidebar. */
@media(min-width:1200px){
 body:has(.k-mobile-nav) .brand-nav{overflow-x:hidden}
 body:has(.k-mobile-nav) .brand-nav:after{width:100%;height:215px;margin:1rem 0 0;background-position:center bottom;background-size:contain;align-self:center;max-width:100%}
 body:has(.k-mobile-nav) .brand-nav>.container{gap:.8rem}
}
.k-pantry-visual{background-size:contain;background-repeat:no-repeat;background-position:center center;background-color:#69533c;min-width:0}
.k-pantry-body{grid-template-columns:minmax(0,34%) minmax(0,1fr)}
.k-shopping-body{grid-template-columns:minmax(0,1fr) minmax(0,29%)}

/* Recipe-specific imagery; no mismatched stock-photo fallback. */
.k-food-image-1,.k-food-image-2,.k-food-image-3{background-image:none}
.k-food-image{background-color:#e4d5ae;background-position:center;background-size:cover}
.k-recipe-art-photo{background-size:cover;background-position:center;font-size:0}
.k-detail-photo{width:100%;max-height:380px;object-fit:cover;border-radius:18px;margin-bottom:1.3rem}


/* Sprint 5 polish: keep action buttons compact and aligned. */
.k-recipe-head > .d-flex{align-items:flex-start;align-content:flex-start}
.k-recipe-head > .d-flex > .btn,
.k-recipe-head > .d-flex > form > .btn{display:inline-flex;align-items:center;justify-content:center;min-height:42px;height:42px;width:auto;padding:.55rem .9rem;line-height:1.2;white-space:nowrap;vertical-align:top}
.k-recipe-head > .d-flex > form{margin:0}

/* Sidebar illustration sits within the visible sidebar, not after its scrollable content. */
@media(min-width:1200px){
 body:has(.k-mobile-nav) .brand-nav{
  background: url('../img/art/sidebar-botanicals.svg') center bottom 12px / 148px 222px no-repeat,
              linear-gradient(170deg,#093c2c,#0b3025 80%) !important;
 }
 body:has(.k-mobile-nav) .brand-nav::after{display:none}
 body:has(.k-mobile-nav) .brand-nav > .container{padding-bottom:245px}
}

/* Equal inset around the centered pantry artwork. */
.k-pantry-visual{
 background-color:transparent;
 background-position:center center;
 background-size:calc(100% - 12px) auto;
 background-repeat:no-repeat;
}


/* Sprint 5 QA: stable sidebar header, no independent scroll-position trap. */
@media(min-width:1200px){
 body:has(.k-mobile-nav) .brand-nav{
  overflow:hidden;
  background:linear-gradient(170deg,#093c2c,#0b3025 80%) !important;
 }
 body:has(.k-mobile-nav) .brand-nav > .container{
  height:100%;
  min-height:0;
  overflow-y:auto;
  overflow-x:hidden;
  scrollbar-width:thin;
  scrollbar-color:#a3b49a44 transparent;
  gap:.5rem;
  padding:1rem .8rem .9rem;
  position:relative;
  display:flex;
  flex-direction:column;
 }
 body:has(.k-mobile-nav) .brand-nav .navbar-brand{
  flex-shrink:0;
  min-height:45px;
  margin-bottom:.3rem;
 }
 body:has(.k-mobile-nav) .brand-nav .navbar-collapse{
  flex:0 0 auto;
 }
 body:has(.k-mobile-nav) .brand-nav .navbar-nav{
  gap:0;
  margin-bottom:.6rem;
 }
 body:has(.k-mobile-nav) .brand-nav .nav-link{
  padding:.58rem .75rem !important;
  min-height:44px;
 }
 body:has(.k-mobile-nav) .brand-nav form{margin:.3rem 0 !important}
 body:has(.k-mobile-nav) .brand-nav > .container::after{
  content:"";
  display:block;
  flex:0 0 155px;
  width:100%;
  max-width:165px;
  margin:0 auto;
  background:url('../img/art/sidebar-botanicals.svg') center center / contain no-repeat;
  pointer-events:none;
 }
 body:has(.k-mobile-nav) .brand-nav::after{display:none}
}
@media(min-width:1200px) and (max-height:850px){
 body:has(.k-mobile-nav) .brand-nav > .container::after{flex-basis:115px;max-width:120px}
}
@media(min-width:1200px) and (max-height:720px){
 body:has(.k-mobile-nav) .brand-nav > .container::after{display:none}
}
/* Center the entire pantry image box, rather than offsetting its background. */
.k-pantry-body{grid-template-columns:minmax(0,40%) minmax(0,1fr)}
.k-pantry-visual{
 box-sizing:border-box;
 width:calc(100% - 16px);
 margin-inline:auto;
 background-image:url('../img/art/pantry-jars.svg');
 background-position:center;
 background-size:contain;
 background-repeat:no-repeat;
 background-color:transparent;
}
@media(max-width:400px){.k-pantry-body{grid-template-columns:1fr}}


/* Sidebar final layout: stack content from top and show botanical art after sign-out. */
@media(min-width:1200px){
 body:has(.k-mobile-nav) .brand-nav{
  overflow-x:hidden;
  overflow-y:auto;
 }
 body:has(.k-mobile-nav) .brand-nav > .container{
  display:flex;
  flex-direction:column;
  justify-content:flex-start !important;
  align-items:stretch;
  gap:.5rem;
  height:auto;
  min-height:100%;
  overflow:visible;
  padding:1.2rem .8rem 1rem;
 }
 body:has(.k-mobile-nav) .brand-nav .navbar-brand{
  align-self:center;
  margin:0 0 .75rem;
 }
 body:has(.k-mobile-nav) .brand-nav .navbar-collapse{
  flex:0 0 auto !important;
  width:100%;
  margin:0;
 }
 body:has(.k-mobile-nav) .brand-nav > .container::after{
  display:block;
  content:"";
  flex:none;
  width:min(100%,185px);
  height:205px;
  margin:.5rem auto 0;
  background:url('../img/art/sidebar-botanicals.svg') center center / contain no-repeat;
  opacity:1;
 }
}
/* Desktop sidebar: fixed navigation and a bottom-anchored illustration. */
@media (min-width:1200px) {
  body:has(.k-mobile-nav) .brand-nav {
    position:fixed;
    inset:0 auto 0 0;
    overflow:hidden !important;
    background:linear-gradient(170deg,#093c2c,#0b3025 80%) !important;
  }
  body:has(.k-mobile-nav) .brand-nav > .container {
    box-sizing:border-box;
    position:relative;
    width:100%;
    max-width:none;
    height:100%;
    min-height:0;
    margin:0;
    padding:16px 12px 12px;
    display:flex;
    flex-direction:column;
    align-items:stretch;
    justify-content:flex-start !important;
    gap:8px;
    overflow:hidden !important;
  }
  body:has(.k-mobile-nav) .brand-nav .navbar-brand {
    display:flex;
    align-items:center;
    justify-content:center;
    flex:0 0 auto;
    min-height:48px;
    margin:0 0 8px;
  }
  body:has(.k-mobile-nav) .brand-nav .navbar-collapse {
    display:flex !important;
    flex-direction:column;
    flex:0 0 auto !important;
    width:100%;
    min-height:0;
    margin:0;
    padding:0;
    position:relative;
    z-index:1;
  }
  body:has(.k-mobile-nav) .brand-nav .navbar-nav {
    display:flex;
    flex-direction:column;
    gap:2px;
    width:100%;
    margin:0 0 8px;
  }
  body:has(.k-mobile-nav) .brand-nav .nav-link {
    display:flex;
    align-items:center;
    gap:10px;
    flex:0 0 auto;
    min-height:42px;
    padding:8px 10px !important;
    line-height:1.25;
  }
  body:has(.k-mobile-nav) .brand-nav form {
    flex:0 0 auto;
    margin:8px 0 0 !important;
    width:100%;
  }
  body:has(.k-mobile-nav) .brand-nav::after {display:none !important}
  body:has(.k-mobile-nav) .brand-nav > .container::after {
    content:"";
    position:absolute;
    display:block !important;
    bottom:10px;
    left:50%;
    transform:translateX(-50%);
    width:180px;
    height:185px;
    max-width:calc(100% - 24px);
    margin:0;
    background:url('../img/art/sidebar-botanicals.svg') center bottom / contain no-repeat;
    pointer-events:none;
    z-index:0;
  }
}


/* Keep a compact botanical illustration visible below the navigation. */
@media (min-width:1200px) {
 body:has(.k-mobile-nav) .brand-nav > .container::after {
  display:block !important;
  width:132px;
  height:136px;
  bottom:5px;
  background-size:contain;
 }
}
@media (min-width:1200px) and (max-height:760px) {
 body:has(.k-mobile-nav) .brand-nav > .container::after {
  width:90px;
  height:95px;
  bottom:2px;
 }
}

/* Photographic sidebar still life: replace the vector illustration. */
@media (min-width:1200px) {
 body:has(.k-mobile-nav) .brand-nav > .container::after {
  width:174px;
  height:180px;
  bottom:4px;
  background-image:url('../img/art/sidebar-still-life.webp');
  background-position:center bottom;
  background-size:contain;
  background-repeat:no-repeat;
 }
}
@media (min-width:1200px) and (max-height:760px) {
 body:has(.k-mobile-nav) .brand-nav > .container::after {
  width:110px;
  height:118px;
 }
}
