/*
Theme Name:   DiscountPantry Pantry
Theme URI:    https://discount-pantry.com
Description:  Storefront child theme for discount-pantry.com. The market-green cut of the DiscountPantry identity: white shelf cards on warm paper, deep market-green structure, red reserved for real deal prices, mono manifest data. Built for findability at ~10k SKUs. Parent stays untouched, so rollback is `wp theme activate storefront`.
Author:       Christopher Lucas
Template:     storefront
Version:      1.3.3
Text Domain:  dp-pantry
*/

/* Hallmark · redesign (scoped: tokens + price component) · genre: editorial
 * palette: market-green (owner's pick 2026-08-12, replaces pallet-wrap blue)
 * price grammar: struck list price + red deal price when we beat list;
 * plain ink price when we don't. No raised cents, ever. */

/* ===========================================================================
   DiscountPantry — "the market manifest"
   ---------------------------------------------------------------------------
   The identity keeps the paperwork bones — case labels, shelf bins, mono
   manifest data — recolored to a grocer's register on the owner's order
   (2026-08-12): white cards, warm paper ground, deep market-green structure,
   red spent ONLY on a real deal price. The earlier pallet-wrap-blue palette
   (carried from kip_storefront_theme.py) is superseded; do not resurrect it.
   Type: condensed signage face for the wordmark and section heads, humanist
   sans for reading AND for money (plain, tabular), monospace for DATA.

   Storefront's and WooCommerce's own stylesheets are dequeued in functions.php,
   so this file is the whole of the store's CSS. One request, no build step,
   no external font host.
   ========================================================================= */

:root{
  --wrap:#1E4633;      /* market green — structure and strong ink */
  --wrap-deep:#182C21; /* near-black green — body ink */
  --shelf:#F7F7F4;     /* warm paper — page ground */
  --label:#FFFFFF;     /* shelf cards */
  --stamp:#C8452B;     /* deal red — real deal prices and alerts only */
  --tally:#2F6D4F;     /* stock tick */
  --graphite:#4E544E;  /* secondary text */
  --rule:#DCDDD6;
  --amber:#F0A03C;     /* wordmark accent only */
  --mast-dim:#9DBCAA;  /* mono data on the green — ~4.9:1 on --wrap */
  --mast-text:#D2E0D6;

  --display:"Haettenschweiler","Arial Narrow Bold","Arial Narrow",Impact,sans-serif;
  --body:ui-sans-serif,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --mono:ui-monospace,"Cascadia Mono",Consolas,"SF Mono",Menlo,monospace;

  --gutter:20px;
  --maxw:1240px;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;
  background:var(--shelf);
  color:var(--wrap-deep);
  font-family:var(--body);
  font-size:16px;
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;height:auto;display:block}
a{color:var(--wrap);text-underline-offset:2px}
a:hover{color:var(--stamp)}
:focus-visible{outline:3px solid var(--stamp);outline-offset:2px}
button,input,select,textarea{font:inherit;color:inherit}
h1,h2,h3,h4{margin:0}
p{margin:0 0 1em}
ul,ol{margin:0}

.dp-wrap,.col-full{max-width:var(--maxw);margin:0 auto;padding:0 var(--gutter);width:100%}

/* Screen-reader / skip link ------------------------------------------------ */
.screen-reader-text{
  position:absolute!important;width:1px;height:1px;overflow:hidden;
  clip:rect(1px,1px,1px,1px);clip-path:inset(50%);white-space:nowrap;
}
.skip-link:focus{
  position:fixed!important;top:8px;left:8px;z-index:999;width:auto;height:auto;
  clip:auto;clip-path:none;background:var(--label);color:var(--wrap);
  padding:10px 16px;border:2px solid var(--wrap);font-family:var(--mono);
  font-size:12px;letter-spacing:.1em;text-transform:uppercase;
}

/* Shared micro-type -------------------------------------------------------- */
.dp-eyebrow,.dp-mono{
  font-family:var(--mono);font-size:11px;letter-spacing:.13em;
  text-transform:uppercase;color:var(--graphite);
}
.dp-num{font-variant-numeric:tabular-nums}

/* ===========================================================================
   1. MASTHEAD — a stencilled crate marking
   ========================================================================= */
.dp-mast{background:var(--wrap);color:var(--shelf)}
.dp-mast a{color:inherit;text-decoration:none}
.dp-mast a:hover{color:var(--amber)}

.dp-mast-top{
  display:flex;align-items:center;justify-content:space-between;
  gap:24px;flex-wrap:wrap;padding:18px 0 14px;
}
.dp-wordmark{
  font-family:var(--display);font-size:clamp(30px,5vw,46px);
  letter-spacing:.05em;line-height:.9;margin:0;text-transform:uppercase;
}
.dp-wordmark a{display:inline-block}
.dp-wordmark .dot{color:var(--amber)}
.dp-tagline{
  font-family:var(--mono);font-size:10.5px;letter-spacing:.11em;
  text-transform:uppercase;color:var(--mast-dim);margin:5px 0 0;
}

/* Search — the primary tool at 10k SKUs, so it sits in the masthead */
.dp-search{display:flex;flex:1 1 320px;max-width:460px;min-width:240px}
.dp-search label{position:absolute;left:-9999px}
.dp-search input[type="search"]{
  flex:1;min-width:0;background:var(--label);border:1px solid var(--wrap-deep);
  border-right:0;padding:11px 14px;font-family:var(--body);font-size:15px;
  color:var(--wrap-deep);border-radius:0;-webkit-appearance:none;
}
.dp-search input::placeholder{color:var(--graphite);opacity:1}
.dp-search button{
  background:var(--amber);color:var(--wrap-deep);border:1px solid var(--wrap-deep);
  padding:0 18px;font-family:var(--mono);font-size:11px;letter-spacing:.12em;
  text-transform:uppercase;cursor:pointer;font-weight:700;
}
.dp-search button:hover{background:var(--label)}

/* Department rail */
.dp-depts{border-top:1px solid rgba(255,255,255,.16)}
.dp-depts ul{
  list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;
  gap:0 26px;
}
.dp-depts li{margin:0}
.dp-depts a{
  display:block;padding:11px 0;font-family:var(--mono);font-size:11.5px;
  letter-spacing:.1em;text-transform:uppercase;color:var(--mast-text);
  border-bottom:2px solid transparent;
}
.dp-depts a:hover,.dp-depts a:focus-visible{color:var(--amber);border-bottom-color:var(--amber)}
.dp-depts .is-current > a{color:#fff;border-bottom-color:var(--amber)}

/* THE SIGNATURE: the manifest rail. Mono, wide-tracked, and it only ever
   carries real numbers pulled from the catalog — never decoration. */
.dp-manifest{
  border-top:1px solid rgba(255,255,255,.16);
  display:flex;flex-wrap:wrap;gap:8px 28px;padding:10px 0 12px;
  font-family:var(--mono);font-size:10.5px;letter-spacing:.11em;
  text-transform:uppercase;color:var(--mast-dim);
}
.dp-manifest b{color:var(--shelf);font-weight:600}

/* ===========================================================================
   2. PAGE FRAME
   ========================================================================= */
.site-content{display:block;padding:0 0 64px}
.dp-crumbs{
  padding:14px 0 0;font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;
  text-transform:uppercase;color:var(--graphite);
}
.dp-crumbs a{color:var(--graphite);text-decoration:none}
.dp-crumbs a:hover{color:var(--wrap)}
.dp-crumbs .sep{opacity:.55;padding:0 .5em}

.dp-head{padding:16px 0 18px;border-bottom:2px solid var(--wrap)}
.dp-title{
  font-family:var(--display);font-size:clamp(28px,4.6vw,50px);line-height:1;
  letter-spacing:.03em;text-transform:uppercase;color:var(--wrap-deep);margin:0;
}
.dp-sub{margin:10px 0 0;color:var(--graphite);max-width:64ch}

/* Result manifest — the query state, stated as data */
.dp-results{
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  flex-wrap:wrap;padding:10px 0;border-bottom:1px solid var(--rule);
  font-family:var(--mono);font-size:11px;letter-spacing:.1em;
  text-transform:uppercase;color:var(--graphite);
}
.dp-results b{color:var(--wrap-deep);font-weight:600}
.dp-results form{display:flex;align-items:center;gap:8px;margin:0}
.dp-results select{
  border:1px solid var(--rule);background:var(--label);padding:6px 8px;
  font-family:var(--mono);font-size:11px;letter-spacing:.08em;
  text-transform:uppercase;color:var(--wrap-deep);border-radius:0;
}

/* Applied-filter chips */
.dp-chips{display:flex;flex-wrap:wrap;gap:8px;padding:12px 0 0;list-style:none;margin:0}
.dp-chips li{margin:0}
.dp-chips a{
  display:inline-flex;align-items:center;gap:8px;background:var(--label);
  border:1px solid var(--wrap);color:var(--wrap);text-decoration:none;
  padding:5px 10px;font-family:var(--mono);font-size:10.5px;letter-spacing:.08em;
  text-transform:uppercase;
}
.dp-chips a:hover{background:var(--wrap);color:var(--shelf)}
.dp-chips .x{font-weight:700}
.dp-chips .clear a{border-style:dashed;border-color:var(--stamp);color:var(--stamp)}
.dp-chips .clear a:hover{background:var(--stamp);color:var(--label)}

/* Two-column: bin index on the left, grid on the right */
.dp-cols{display:grid;grid-template-columns:246px minmax(0,1fr);gap:34px;padding-top:22px;align-items:start}
.dp-cols > .dp-main{min-width:0}

/* ===========================================================================
   3. THE BIN INDEX — filters set as a printed inventory sheet
   ========================================================================= */
.dp-bins{position:sticky;top:12px}
.dp-bins > summary{display:none}
.dp-binset{margin:0 0 26px}
.dp-binset > h2{
  font-family:var(--mono);font-size:10.5px;letter-spacing:.15em;text-transform:uppercase;
  color:var(--wrap);margin:0 0 8px;padding-bottom:6px;border-bottom:2px solid var(--wrap);
}
.dp-binlist{list-style:none;margin:0;padding:0;font-family:var(--mono);font-size:12px}
.dp-binlist li{margin:0}
.dp-binlist a{
  display:flex;align-items:baseline;gap:.5ch;padding:5px 0;text-decoration:none;
  color:var(--wrap-deep);border-bottom:1px solid transparent;
}
.dp-binlist a:hover .lbl{color:var(--stamp)}
.dp-binlist .lbl{flex:0 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dp-binlist .dots{flex:1 1 auto;min-width:12px;border-bottom:1px dotted var(--rule);transform:translateY(-.28em)}
.dp-binlist .n{flex:none;color:var(--graphite);font-variant-numeric:tabular-nums;font-size:11px}
.dp-binlist .is-on .lbl{color:var(--stamp);font-weight:700}
.dp-binlist .is-on .n{color:var(--stamp)}
.dp-more{
  display:inline-block;margin-top:8px;font-family:var(--mono);font-size:10.5px;
  letter-spacing:.1em;text-transform:uppercase;color:var(--graphite);
}

/* ===========================================================================
   4. THE LOT TAG — the product card
   ========================================================================= */
ul.products,.dp-grid{
  list-style:none;margin:0;padding:0;display:grid;gap:14px;
  grid-template-columns:repeat(auto-fill,minmax(212px,1fr));
}
ul.products li.product,.dp-grid > li{margin:0;position:relative}

.dp-tag{
  background:var(--label);border:1px solid var(--rule);
  display:flex;flex-direction:column;height:100%;text-decoration:none;color:inherit;
  position:relative;transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease;
}
.dp-tag:hover,.dp-tag:focus-within{
  transform:translateY(-3px);box-shadow:0 10px 22px rgba(24,44,33,.14);
  border-color:var(--wrap);color:inherit;
}
.dp-tag:focus-within{outline:3px solid var(--stamp);outline-offset:2px}
.dp-tag a{text-decoration:none;color:inherit}
.dp-tag a:focus-visible{outline:none}

/* the punch hole — a lot tag hangs from something */
.dp-tag::before{
  content:"";position:absolute;top:10px;right:10px;width:11px;height:11px;
  border-radius:50%;background:var(--shelf);border:1px solid var(--rule);z-index:2;
}

.dp-shot{
  aspect-ratio:1/1;background:#fff;overflow:hidden;
  border-bottom:1px solid var(--rule);display:block;
}
.dp-shot img{width:100%;height:100%;object-fit:contain;padding:10px}
.dp-shot--none{
  display:flex;align-items:center;justify-content:center;background:#F2F2EE;
  font-family:var(--mono);font-size:10px;letter-spacing:.12em;
  text-transform:uppercase;color:#A8ADA6;
}
.dp-tagbody{padding:12px 13px 13px;display:flex;flex-direction:column;gap:7px;flex:1}
.dp-tag .dp-eyebrow{
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding-right:14px;
}
.dp-name{
  font-size:14px;font-weight:600;line-height:1.35;margin:0;color:var(--wrap-deep);
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;
  overflow:hidden;min-height:2.7em;
}
.dp-tagfoot{
  margin-top:auto;display:flex;align-items:flex-end;justify-content:space-between;
  gap:10px;padding-top:9px;border-top:1px solid var(--rule);
}
/* Price grammar (owner's order 2026-08-12): plain figures, no raised cents.
   Deal = struck list price then ours in deal red; otherwise ours alone in ink. */
.dp-price,.dp-pprice{
  display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;
  font-family:var(--body);font-variant-numeric:tabular-nums;
  font-weight:700;line-height:1.15;color:var(--wrap-deep);
}
.dp-price{font-size:18px}
.dp-price .dp-was,.dp-pprice .dp-was{
  font-size:.72em;font-weight:500;color:var(--graphite);
  text-decoration:line-through;text-decoration-thickness:1px;
}
.dp-price--deal .dp-now{color:var(--stamp)}
.dp-instock{
  font-family:var(--mono);font-size:10px;letter-spacing:.07em;text-transform:uppercase;
  color:var(--tally);white-space:nowrap;
}
.dp-oos{color:var(--stamp)}

/* ===========================================================================
   5. PAGER
   ========================================================================= */
.dp-pager{
  display:flex;flex-wrap:wrap;gap:8px;align-items:center;padding:26px 0 0;
  font-family:var(--mono);font-size:11.5px;letter-spacing:.09em;text-transform:uppercase;
}
.dp-pager a,.dp-pager span{
  padding:8px 13px;border:1px solid var(--rule);background:var(--label);
  text-decoration:none;color:var(--wrap);
}
.dp-pager a:hover{background:var(--wrap);color:var(--shelf);border-color:var(--wrap)}
.dp-pager .current{background:var(--wrap);color:var(--shelf);border-color:var(--wrap);font-weight:700}
.dp-pager .dots{border:0;background:none;padding:8px 2px;color:var(--graphite)}

/* ===========================================================================
   6. PRODUCT PAGE
   ========================================================================= */
.dp-product{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:44px;padding:22px 0 0;align-items:start}
.dp-gallery{border:1px solid var(--rule);background:#fff;aspect-ratio:1/1;overflow:hidden;position:sticky;top:12px}
.dp-gallery img{width:100%;height:100%;object-fit:contain;padding:18px}
.dp-gallery .woocommerce-product-gallery__image{height:100%}
.dp-gallery figure{margin:0;height:100%}

.dp-ptitle{font-size:clamp(21px,2.6vw,29px);font-weight:600;line-height:1.25;margin:6px 0 0;color:var(--wrap-deep)}
.dp-pprice{font-size:clamp(26px,3.6vw,34px);margin:14px 0 0;gap:12px}
.dp-pstock{margin:8px 0 0;font-family:var(--mono);font-size:11.5px;letter-spacing:.09em;text-transform:uppercase;color:var(--tally)}

/* WooCommerce single-product bits we keep */
.single-product .price,.single-product .woocommerce-product-details__short-description{display:none}
.woocommerce-product-gallery__wrapper{margin:0}
.woocommerce-product-gallery__trigger{display:none}

/* The catalog-mode note printed by dp-catalog-mode.php gets the stamp rail look
   here rather than in the mu-plugin, so payments can be switched on by deleting
   that one file with nothing to unpick in the theme. */
.dp-ordering-soon{
  margin:20px 0 0!important;padding:14px 16px!important;background:var(--label)!important;
  border:1px solid var(--rule)!important;border-left:4px solid var(--stamp)!important;
  font-size:14.5px!important;color:var(--wrap-deep);
}
.dp-ordering-soon strong{
  display:block;font-family:var(--mono);font-size:11px;letter-spacing:.12em;
  text-transform:uppercase;color:var(--stamp);margin-bottom:5px;
}

/* Notify-me capture */
.dp-notify{margin:18px 0 0;padding:16px;border:1px solid var(--rule);background:var(--label)}
.dp-notify h2{
  font-family:var(--mono);font-size:11px;letter-spacing:.13em;text-transform:uppercase;
  color:var(--wrap);margin:0 0 6px;
}
.dp-notify p{margin:0 0 10px;font-size:14px;color:var(--graphite)}
.dp-notify-row{display:flex;flex-wrap:wrap;gap:8px}
.dp-notify input[type="email"]{
  flex:1 1 220px;min-width:0;border:1px solid var(--rule);background:#fff;
  padding:11px 12px;font-size:15px;border-radius:0;
}
.dp-notify input[type="email"]:focus{border-color:var(--wrap);outline:2px solid var(--wrap);outline-offset:-2px}
.dp-notify button{
  background:var(--wrap);color:var(--shelf);border:1px solid var(--wrap);
  padding:11px 20px;font-family:var(--mono);font-size:11px;letter-spacing:.12em;
  text-transform:uppercase;font-weight:700;cursor:pointer;
}
.dp-notify button:hover{background:var(--wrap-deep)}
.dp-notify .hp{position:absolute;left:-9999px}
.dp-note{
  margin:0 0 10px;padding:10px 12px;font-family:var(--mono);font-size:11px;
  letter-spacing:.06em;text-transform:uppercase;
}
.dp-note--ok{background:#E8F0EA;border-left:3px solid var(--tally);color:#23543C}
.dp-note--err{background:#FBEDE9;border-left:3px solid var(--stamp);color:#8E2E1B}

/* Spec sheet */
.dp-spec{width:100%;border-collapse:collapse;font-family:var(--mono);font-size:12.5px;margin:22px 0 0}
.dp-spec th{
  text-align:left;font-weight:400;color:var(--graphite);text-transform:uppercase;
  letter-spacing:.1em;font-size:10.5px;padding:9px 12px 9px 0;
  border-top:1px solid var(--rule);width:38%;vertical-align:top;
}
.dp-spec td{padding:9px 0;border-top:1px solid var(--rule);color:var(--wrap-deep)}
.dp-spec a{color:var(--wrap)}

.dp-fulfil{margin:22px 0 0;padding-top:18px;border-top:2px solid var(--wrap)}
.dp-fulfil h2{
  font-family:var(--mono);font-size:11px;letter-spacing:.13em;text-transform:uppercase;
  color:var(--wrap);margin:0 0 8px;
}
.dp-fulfil p{font-size:14.5px;color:var(--graphite);margin:0 0 .7em;max-width:62ch}
.dp-fulfil p:last-child{margin-bottom:0}

/* ===========================================================================
   7. FRONT PAGE
   ========================================================================= */
.dp-front section{padding:34px 0 0}
.dp-sechead{
  display:flex;align-items:baseline;justify-content:space-between;gap:16px;
  flex-wrap:wrap;padding-bottom:12px;margin-bottom:18px;border-bottom:2px solid var(--wrap);
}
.dp-sechead h2{
  font-family:var(--display);font-size:clamp(24px,3.4vw,36px);line-height:1;
  letter-spacing:.03em;text-transform:uppercase;color:var(--wrap-deep);margin:0;
}
.dp-sechead .dp-mono a{color:var(--graphite);text-decoration:none}
.dp-sechead .dp-mono a:hover{color:var(--stamp)}

.dp-lede{
  background:var(--label);border:1px solid var(--rule);border-left:4px solid var(--wrap);
  padding:22px 24px;margin:26px 0 0;max-width:820px;
}
.dp-lede p{margin:0 0 .8em;color:var(--graphite);max-width:64ch}
.dp-lede p:last-child{margin-bottom:0}
.dp-lede strong{color:var(--wrap-deep)}

.dp-deptgrid{
  list-style:none;margin:0;padding:0;display:grid;gap:14px;
  grid-template-columns:repeat(auto-fill,minmax(238px,1fr));
}
.dp-deptcard{
  display:flex;flex-direction:column;gap:6px;height:100%;
  background:var(--label);border:1px solid var(--rule);border-top:3px solid var(--wrap);
  padding:16px 17px 15px;text-decoration:none;color:inherit;
  transition:transform .16s ease,box-shadow .16s ease;
}
.dp-deptcard:hover,.dp-deptcard:focus-visible{
  transform:translateY(-3px);box-shadow:0 10px 22px rgba(19,39,65,.14);color:inherit;
}
.dp-deptcard h3{font-size:17px;font-weight:600;margin:0;line-height:1.25;color:var(--wrap-deep)}
.dp-deptcard .cnt{
  font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--graphite);margin-top:auto;padding-top:10px;font-variant-numeric:tabular-nums;
}
.dp-deptcard .aisles{font-size:13px;color:var(--graphite);line-height:1.45;margin:0}

/* ===========================================================================
   8. STATIC PAGES / EDITOR CONTENT
   ========================================================================= */
/* Editor-managed pages (Privacy, Terms, Shipping & Returns, Contact) come
   through Storefront's page templates, so style those class names directly
   rather than fork another template. */
.dp-page,.hentry .entry-content{padding:0;max-width:760px}
.entry-header{padding:26px 0 0;max-width:760px}
.entry-title{
  font-family:var(--display);font-size:clamp(28px,4.6vw,46px);line-height:1;
  letter-spacing:.03em;text-transform:uppercase;color:var(--wrap-deep);
  margin:0 0 6px;padding-bottom:14px;border-bottom:2px solid var(--wrap);
}
.entry-content{margin:20px 0 0}
.dp-page h2,.entry-content h2{font-size:21px;font-weight:600;margin:1.7em 0 .5em;color:var(--wrap-deep)}
.dp-page h3,.entry-content h3{
  font-family:var(--mono);font-size:12px;letter-spacing:.12em;text-transform:uppercase;
  margin:1.5em 0 .4em;color:var(--wrap);
}
.dp-page ul,.dp-page ol,.entry-content ul,.entry-content ol{margin:0 0 1em;padding-left:1.3em}
.dp-page li,.entry-content li{margin:0 0 .45em}
.dp-page table,.entry-content table{border-collapse:collapse;width:100%;margin:0 0 1em}
.dp-page th,.dp-page td,.entry-content th,.entry-content td{border:1px solid var(--rule);padding:8px 10px;text-align:left}
.entry-content p{max-width:68ch}
.entry-content em{color:var(--graphite)}
.page .site-content,.search-no-results .site-content{padding-bottom:64px}

.dp-empty{
  background:var(--label);border:1px solid var(--rule);border-left:4px solid var(--stamp);
  padding:26px 28px;max-width:720px;margin:22px 0 0;
}
.dp-empty h2{
  font-family:var(--display);font-size:28px;letter-spacing:.04em;text-transform:uppercase;
  margin:0 0 10px;color:var(--wrap-deep);
}
.dp-empty p{color:var(--graphite);max-width:60ch}
.dp-empty ul{margin:14px 0 0;padding:0;list-style:none;font-family:var(--mono);font-size:12.5px}
.dp-empty li{padding:7px 0;border-top:1px solid var(--rule)}

/* ===========================================================================
   9. FOOTER + STORE NOTICE
   ========================================================================= */
.dp-foot,#colophon.site-footer{background:var(--wrap-deep);color:var(--mast-dim);padding:28px 0 22px}
.dp-foot a,#colophon.site-footer a{color:var(--mast-text)}
.dp-foot a:hover,#colophon.site-footer a:hover{color:var(--amber)}
.dp-footrail{
  display:flex;flex-wrap:wrap;gap:10px 30px;font-family:var(--mono);font-size:10.5px;
  letter-spacing:.11em;text-transform:uppercase;padding-bottom:14px;
  border-bottom:1px solid rgba(255,255,255,.14);
}
.dp-footrail b{color:var(--shelf);font-weight:600}
.dp-footdepts{
  list-style:none;margin:16px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:8px 24px;
  font-family:var(--mono);font-size:11px;letter-spacing:.09em;text-transform:uppercase;
}
.dp-footdepts a{text-decoration:none}
.dp-footer-links{color:var(--mast-dim)}
.dp-footer-links a{color:var(--mast-text);text-decoration:none;font-family:var(--mono);
  font-size:11px;letter-spacing:.09em;text-transform:uppercase}
.dp-footer-links a:hover{color:var(--amber)}
.dp-footer-links p{color:var(--mast-dim);font-family:var(--mono);font-size:10.5px;letter-spacing:.06em}

.woocommerce-store-notice,.demo_store{
  display:block;background:var(--stamp);color:#fff;margin:0;padding:9px var(--gutter);
  text-align:center;font-family:var(--mono);font-size:11px;letter-spacing:.09em;
  text-transform:uppercase;position:relative;z-index:5;
}
.woocommerce-store-notice a{color:#fff;text-decoration:underline}
.woocommerce-store-notice__dismiss-link{margin-left:14px;opacity:.85}

/* Woo notices (used by the notify-me redirect states) */
.woocommerce-message,.woocommerce-info,.woocommerce-error{
  list-style:none;margin:16px 0;padding:12px 16px;background:var(--label);
  border-left:4px solid var(--wrap);font-size:14.5px;
}
.woocommerce-error{border-left-color:var(--stamp)}
.woocommerce-message{
  background:var(--label);border:1px solid var(--rule);border-left:4px solid var(--tally);
  margin:14px 0;padding:12px 16px;font-size:14.5px;
}
.woocommerce-message .button{float:right;margin-left:12px}

/* ===========================================================================
   9b. COMMERCE — buy form, cart, checkout (checkout opened 2026-08-13, PayPal)
   ========================================================================= */
.dp-cartlink{
  display:inline-flex;align-items:center;gap:8px;font-family:var(--mono);
  font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;
  border:1px solid var(--mast-dim);padding:11px 15px;white-space:nowrap;
}
.dp-cartlink:hover{border-color:var(--amber)}
.dp-cartcount{
  background:var(--amber);color:var(--wrap-deep);font-weight:700;font-size:11px;
  padding:1px 7px;border-radius:999px;font-variant-numeric:tabular-nums;
}

/* The buy form (returns to the product page between price and spec) */
form.cart{display:flex;gap:10px;align-items:stretch;margin:18px 0 0;flex-wrap:wrap}
form.cart .qty{
  width:76px;text-align:center;background:var(--label);color:var(--wrap-deep);
  border:1px solid var(--graphite);border-radius:0;padding:12px 8px;font-size:16px;
}

/* One button voice for the whole purchase path */
.single_add_to_cart_button,
.wc-proceed-to-checkout .checkout-button,
#place_order,
.woocommerce-cart-form button[name="update_cart"],
.woocommerce-form-coupon button,
.woocommerce-form-login button,
.return-to-shop a.button{
  display:inline-block;background:var(--wrap);color:#fff;border:1px solid var(--wrap-deep);
  padding:12px 28px;font-family:var(--body);font-weight:700;font-size:15.5px;
  cursor:pointer;border-radius:0;text-decoration:none;text-align:center;
  transition:background .16s ease;
}
.single_add_to_cart_button:hover,.wc-proceed-to-checkout .checkout-button:hover,
#place_order:hover,.woocommerce-cart-form button[name="update_cart"]:hover{
  background:var(--wrap-deep);color:#fff;
}
.single_add_to_cart_button:disabled,button[name="update_cart"]:disabled{
  opacity:.45;cursor:default;
}
.wc-proceed-to-checkout .checkout-button{display:block;font-size:17px;padding:15px 28px}

/* Cart + order tables */
table.shop_table{
  width:100%;border-collapse:collapse;background:var(--label);
  border:1px solid var(--rule);font-size:14.5px;margin:14px 0;
}
table.shop_table th,table.shop_table td{
  padding:11px 13px;border-bottom:1px solid var(--rule);text-align:left;vertical-align:middle;
}
table.shop_table thead th{
  font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--graphite);border-bottom:2px solid var(--wrap);
}
table.shop_table td.product-thumbnail img{width:56px;height:56px;object-fit:contain;background:#fff}
table.shop_table .product-remove a{
  font-size:20px;line-height:1;text-decoration:none;color:var(--stamp);display:inline-block;padding:4px 8px;
}
table.shop_table td.actions{text-align:right}
.cart_totals,.woocommerce-checkout-review-order{max-width:520px}
.cart_totals h2{font-size:18px;margin:18px 0 6px}

/* Checkout form */
.woocommerce-checkout .col2-set,.woocommerce-checkout-review-order{margin-top:10px}
.woocommerce-checkout h3{font-size:17px;margin:20px 0 8px;padding-bottom:6px;border-bottom:2px solid var(--wrap)}
.form-row{margin:0 0 12px;display:block}
.form-row label{
  display:block;font-family:var(--mono);font-size:11px;letter-spacing:.1em;
  text-transform:uppercase;color:var(--graphite);margin-bottom:4px;
}
.form-row .input-text,.form-row select,.form-row textarea,.select2-selection{
  width:100%;background:var(--label);color:var(--wrap-deep);border:1px solid var(--graphite);
  border-radius:0;padding:11px 12px;font-size:15px;
}
.form-row .input-text:focus-visible,.form-row select:focus-visible{outline:3px solid var(--stamp);outline-offset:1px}

/* Payment box — PayPal renders its own buttons inside */
#payment{background:var(--label);border:1px solid var(--rule);border-top:3px solid var(--wrap);padding:16px;margin-top:16px}
#payment .wc_payment_method label{display:inline;font-family:var(--body);font-size:15px;text-transform:none;letter-spacing:0;color:var(--wrap-deep)}
#payment .payment_box{margin:8px 0 0;font-size:13.5px;color:var(--graphite)}
#payment .place-order{margin-top:14px}

/* ===========================================================================
   10. RESPONSIVE
   ========================================================================= */
@media (max-width:1080px){
  .dp-cols{grid-template-columns:212px minmax(0,1fr);gap:24px}
}
@media (max-width:860px){
  .dp-product{grid-template-columns:1fr;gap:24px}
  .dp-gallery{position:static;max-width:420px}
  .dp-cols{grid-template-columns:1fr;gap:0}
  .dp-bins{position:static;margin-bottom:22px}
  /* On small screens the bin index becomes a disclosure, no JS required. */
  .dp-bins > summary{
    display:flex;align-items:center;justify-content:space-between;gap:10px;
    cursor:pointer;list-style:none;background:var(--label);border:1px solid var(--wrap);
    padding:12px 14px;font-family:var(--mono);font-size:11.5px;letter-spacing:.12em;
    text-transform:uppercase;color:var(--wrap);font-weight:700;
  }
  .dp-bins > summary::-webkit-details-marker{display:none}
  .dp-bins > summary::after{content:"+";font-size:16px;line-height:1}
  .dp-bins[open] > summary::after{content:"\2212"}
  .dp-binsinner{border:1px solid var(--rule);border-top:0;padding:18px 14px 6px;background:var(--label)}
  .dp-binset:last-child{margin-bottom:18px}
}
@media (max-width:640px){
  :root{--gutter:14px}
  ul.products,.dp-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}
  .dp-price{font-size:16px}
  .dp-name{font-size:13px}
  .dp-mast-top{padding:14px 0 12px;gap:12px}
  .dp-search{max-width:none;flex-basis:100%}
  .dp-manifest{gap:6px 18px;font-size:10px}
  .dp-depts ul{gap:0 18px}
  .dp-results{font-size:10px;gap:10px}
  /* Tap targets */
  .dp-binlist a{padding:9px 0}
  .dp-depts a{padding:12px 0}
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{transition:none!important;animation:none!important;scroll-behavior:auto!important}
  .dp-tag:hover,.dp-deptcard:hover{transform:none}
}


/* ===========================================================================
   10. THE COUNTER — WooCommerce BLOCK cart / checkout / account
   ---------------------------------------------------------------------------
   Cart and checkout are Woo BLOCK pages, so `wp-block-library` + `wc-blocks-style`
   survive the dequeue in functions.php (see §Assets). Those sheets lay the blocks
   out correctly but skin them in WooCommerce's stock look — system font, slate
   buttons, a giant emoji empty state, blue underlined links. The result was a
   different store on the two pages a buyer must cross to pay (audited 2026-08-17).

   This section is the SKIN ONLY: type, colour, rules and the card grammar from
   §4 applied to the block components. No layout is reimplemented — Woo's own
   grid still does that, so a WooCommerce update cannot break the geometry here.
   dp-pantry.css is enqueued last, so plain-specificity overrides win.
   ========================================================================= */

.wp-block-woocommerce-cart,
.wp-block-woocommerce-checkout,
.woocommerce-account .woocommerce{
  font-family:var(--body);
  color:var(--wrap-deep);
}
.wp-block-woocommerce-cart a,
.wp-block-woocommerce-checkout a{color:var(--wrap)}
.wp-block-woocommerce-cart a:hover,
.wp-block-woocommerce-checkout a:hover{color:var(--stamp)}

/* Headings speak in the signage face, like every other section head --------- */
.wp-block-woocommerce-cart .wp-block-heading,
.wp-block-woocommerce-checkout .wp-block-heading,
.wc-block-components-title,
.wc-block-cart__empty-cart__title{
  font-family:var(--display);font-weight:400;
  letter-spacing:.01em;text-transform:uppercase;
  color:var(--wrap);
}

/* --- Empty cart ----------------------------------------------------------
   Woo draws a 4rem sad-face emoji via `.with-empty-cart-icon::before`. It is
   the loudest thing on the page and belongs to no identity we own. Replaced
   with a plain shelf statement. */
.wc-block-cart__empty-cart__title.with-empty-cart-icon::before{content:none}
.wp-block-woocommerce-empty-cart-block{
  max-width:var(--maxw);margin:0 auto;padding:8px 0 40px;
}
.wp-block-woocommerce-empty-cart-block .wp-block-heading.has-text-align-center,
.wc-block-cart__empty-cart__title{
  font-size:30px;text-align:left;margin:0 0 14px;
}
.wc-block-cart__empty-cart__title + .wp-block-separator{display:none}
.wp-block-woocommerce-empty-cart-block > .wp-block-separator.is-style-dots{display:none}
.wp-block-woocommerce-empty-cart-block .wp-block-heading:not(.wc-block-cart__empty-cart__title){
  display:none;  /* "New in store" — labelled the auto-grid this theme replaces */
}

/* --- Empty-cart panel ----------------------------------------------------
   Woo fills an empty cart with a "New in store" auto-grid. On this catalog that
   surfaced three identical $191.50 dog chews and a box of poop bags as the face
   of the store. The grid is removed and functions.php swaps in a real panel
   (see dp_pantry_empty_cart_panel) — restyling junk merchandising would only
   have made it look deliberate. */
.wp-block-woocommerce-empty-cart-block .wp-block-woocommerce-product-new,
.wp-block-woocommerce-empty-cart-block .wc-block-grid{display:none}

.dp-emptycart{
  background:var(--label);border:1px solid var(--rule);
  padding:26px 24px;max-width:640px;
}
.dp-emptycart p{color:var(--graphite);margin:0 0 18px;max-width:52ch}
.dp-emptycart .dp-emptycart-go{
  display:inline-block;background:var(--wrap);color:#fff;border:1px solid var(--wrap);
  font-family:var(--mono);font-size:12px;letter-spacing:.09em;text-transform:uppercase;
  font-weight:600;padding:12px 18px;text-decoration:none;
}
.dp-emptycart .dp-emptycart-go:hover{background:var(--wrap-deep);color:#fff}
.dp-emptycart-depts{
  list-style:none;margin:20px 0 0;padding:18px 0 0;border-top:1px solid var(--rule);
  display:flex;flex-wrap:wrap;gap:8px 20px;
}
.dp-emptycart-depts a{
  font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--wrap);text-decoration:none;
}
.dp-emptycart-depts a:hover{color:var(--stamp);text-decoration:underline}

/* --- Buttons: one green, square, mono-labelled button everywhere ----------- */
.wp-block-woocommerce-cart .wp-block-button__link,
.wp-block-woocommerce-checkout .wp-block-button__link,
.wc-block-grid__product-add-to-cart .wp-block-button__link,
.wc-block-components-button:not(.is-link),
.wc-block-cart__submit-button,
.wc-block-components-checkout-place-order-button{
  background:var(--wrap);color:#fff;border:1px solid var(--wrap);border-radius:0;
  font-family:var(--mono);font-size:12px;letter-spacing:.09em;text-transform:uppercase;
  font-weight:600;padding:12px 18px;line-height:1.2;
  transition:background .15s ease,border-color .15s ease;
}
.wp-block-woocommerce-cart .wp-block-button__link:hover,
.wp-block-woocommerce-checkout .wp-block-button__link:hover,
.wc-block-grid__product-add-to-cart .wp-block-button__link:hover,
.wc-block-components-button:not(.is-link):hover,
.wc-block-cart__submit-button:hover,
.wc-block-components-checkout-place-order-button:hover{
  background:var(--wrap-deep);border-color:var(--wrap-deep);color:#fff;
}
.wc-block-components-button.is-link{
  color:var(--wrap);text-decoration:underline;text-underline-offset:2px;
}

/* --- Line items, totals, summary ------------------------------------------ */
.wc-block-cart-items,
.wc-block-components-totals-wrapper{border-color:var(--rule)}
.wc-block-cart-items__header{
  font-family:var(--mono);font-size:11px;letter-spacing:.13em;text-transform:uppercase;
  color:var(--graphite);border-bottom:2px solid var(--wrap);
}
.wc-block-cart-item__wrap .wc-block-components-product-name{
  font-family:var(--body);font-size:15px;font-weight:600;color:var(--wrap-deep);
  text-decoration:none;
}
.wc-block-components-product-metadata,
.wc-block-components-totals-item__label{color:var(--graphite)}
.wc-block-components-formatted-money-amount,
.wc-block-components-totals-item__value{
  font-variant-numeric:tabular-nums;color:var(--wrap-deep);
}
.wc-block-components-totals-footer-item .wc-block-components-totals-item__value{
  font-size:22px;font-weight:700;
}
.wc-block-components-sidebar .wc-block-components-panel,
.wc-block-cart__sidebar .wc-block-components-panel{
  background:var(--label);border:1px solid var(--rule);
}

/* --- Inputs --------------------------------------------------------------- */
.wc-block-components-text-input input[type="text"],
.wc-block-components-text-input input[type="email"],
.wc-block-components-text-input input[type="tel"],
.wc-block-components-select__container select,
.wc-block-components-textarea{
  border:1px solid var(--rule);border-radius:0;background:#fff;color:var(--wrap-deep);
}
.wc-block-components-text-input input:focus,
.wc-block-components-select__container select:focus{
  outline:3px solid var(--stamp);outline-offset:1px;border-color:var(--wrap);
}
.wc-block-components-checkout-step__title{
  font-family:var(--display);font-weight:400;text-transform:uppercase;
  color:var(--wrap);letter-spacing:.01em;
}

/* --- Notices -------------------------------------------------------------- */
.wc-block-components-notice-banner{border-radius:0;border-left-width:4px}
.wc-block-components-notice-banner.is-error{border-color:var(--stamp)}
.wc-block-components-notice-banner.is-success{border-color:var(--tally)}

/* ===========================================================================
   11. EXPRESS PAYMENT — keeping a vendor's brand colours in their lane
   ---------------------------------------------------------------------------
   PayPal's smart buttons render three full-width vendor-branded bars (yellow
   PayPal, blue Venmo, yellow Pay Later) directly under the buy form. At full
   column width they out-shout every other element on the product page and drag
   two foreign brand palettes across a green identity (audited 2026-08-17).

   They are NOT hidden — they convert, and PayPal is the only gateway live. They
   are capped to the width of the buy form, pushed below our own Add to cart,
   and introduced by a mono label so they read as one option among ours rather
   than as the page's main event.
   ========================================================================= */
#ppc-button-ppcp-gateway,
.ppcp-messages{max-width:360px}
#ppc-button-ppcp-gateway{margin:14px 0 0}
#ppc-button-ppcp-gateway:not(:empty)::before{
  content:"or pay directly";display:block;
  font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;
  text-transform:uppercase;color:var(--graphite);
  padding-bottom:8px;margin-bottom:10px;border-top:1px solid var(--rule);padding-top:14px;
}
.ppcp-messages{margin:10px 0 0;font-size:12px}

/* Express block inside the block cart/checkout gets the same cap ------------ */
.wp-block-woocommerce-cart-express-payment-block,
.wc-block-components-express-payment{max-width:420px}

@media (max-width:600px){
  #ppc-button-ppcp-gateway,.ppcp-messages{max-width:none}
  .wc-block-cart__empty-cart__title{font-size:24px}
}

@media print{
  .dp-mast,.dp-bins,.dp-foot,.dp-pager,.woocommerce-store-notice{display:none}
  body{background:#fff}
}