/*
  Donate Shop + search results.
*/

/* ---------- Shop grid ---------- */
.m-shop-grid{
  display:grid;grid-template-columns:repeat(4, minmax(0,1fr));gap:var(--s-5);
}
.m-shop-item{
  display:flex;flex-direction:column;
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--card-radius);overflow:hidden;
  transition:border-color var(--dur-mid) var(--ease-out),
             box-shadow var(--dur-mid) var(--ease-out),
             transform var(--dur-mid) var(--ease-out);
}
.m-shop-item:hover{border-color:var(--accent-line);box-shadow:var(--shadow-sm);transform:translateY(-4px);}
.m-shop-item.is-soldout{opacity:.72;}

.m-shop-media{position:relative;display:block;}
.m-shop-media .m-media{border-radius:0;}
.m-shop-media .m-media.is-empty{background:var(--accent-tint);}
.m-shop-item:hover .m-media > img{transform:scale(1.04);}
.m-shop-flag{
  position:absolute;top:var(--s-4);left:var(--s-4);
  font-family:var(--font-mono);font-size:var(--t-mono);letter-spacing:.12em;
  text-transform:uppercase;background:var(--accent-dark);color:var(--panel-dark-text);
  padding:5px var(--s-3);border-radius:999px;
}

.m-shop-body{display:flex;flex-direction:column;gap:var(--s-3);padding:var(--s-5);flex:1;}
.m-shop-note{
  font-family:var(--font-mono);font-size:var(--t-mono);letter-spacing:.12em;
  text-transform:uppercase;color:var(--accent-2-deep);
}
.m-shop-body h2{margin:0;font-size:var(--t-h4);}
.m-shop-body h2 a{text-decoration:none;color:inherit;transition:color var(--dur-fast) var(--ease-out);}
.m-shop-body h2 a:hover{color:var(--accent);}
.m-shop-desc{margin:0;font-size:var(--t-sm);color:var(--ink-soft);line-height:1.55;}
.m-shop-foot{
  display:flex;align-items:center;justify-content:space-between;
  gap:var(--s-3);margin-top:auto;padding-top:var(--s-4);
  border-top:1px solid var(--line);
}
.m-shop-price{
  font-family:var(--font-display);font-size:var(--t-h4);font-weight:600;
  color:var(--accent);font-variant-numeric:tabular-nums;letter-spacing:-.02em;
}

@media (max-width:1100px){ .m-shop-grid{grid-template-columns:repeat(3, minmax(0,1fr));} }
@media (max-width:820px){  .m-shop-grid{grid-template-columns:repeat(2, minmax(0,1fr));} }
@media (max-width:520px){  .m-shop-grid{grid-template-columns:1fr;} }

/* ---------- Single item ---------- */
.m-shop-detail{
  display:grid;grid-template-columns:minmax(0,6fr) minmax(0,6fr);
  gap:clamp(var(--s-7), 5vw, var(--s-10));align-items:start;
}
.m-shop-detail-media .m-media{border-radius:var(--radius-lg);box-shadow:var(--shadow);}
.m-shop-detail-media .m-media.is-empty{background:var(--accent-tint);}
.m-shop-detail-body{display:flex;flex-direction:column;gap:var(--s-5);}
.m-shop-detail-price{
  margin:0;font-family:var(--font-display);font-weight:600;
  font-size:clamp(1.9rem, 1.3rem + 2vw, 2.8rem);line-height:1;
  letter-spacing:-.035em;color:var(--accent);font-variant-numeric:tabular-nums;
}
.m-shop-detail-body .entry-content{font-size:var(--t-body);}

.m-shop-buy{
  display:flex;flex-direction:column;gap:var(--s-4);align-items:flex-start;
  padding:var(--s-6);background:var(--surface-2);
  border-radius:var(--card-radius);border:1px solid var(--line);
}
.m-shop-qty{display:flex;align-items:center;gap:var(--s-4);}
.m-shop-qty label{
  font-family:var(--font-mono);font-size:var(--t-mono);letter-spacing:.12em;
  text-transform:uppercase;color:var(--ink-soft);
}
.m-shop-qty input{
  width:84px;padding:var(--s-3) var(--s-4);
  border:1px solid var(--line);border-radius:var(--radius-sm);
  background:var(--surface);font-family:var(--font-mono);
  font-size:var(--t-body);color:var(--ink);
}
.m-shop-buy .m-give-secure{margin:0;}
.m-shop-where{
  margin:0;font-size:var(--t-sm);color:var(--ink-soft);
  padding-top:var(--s-5);border-top:1px solid var(--line);
}
.m-shop-where a{color:var(--accent);font-weight:600;}

@media (max-width:900px){ .m-shop-detail{grid-template-columns:1fr;} }

/* ---------- Search ---------- */
.m-search-form{
  display:flex;gap:var(--s-3);margin-bottom:var(--s-8);
  max-width:640px;
}
.m-search-form input{
  flex:1;min-width:0;padding:var(--s-4) var(--s-5);
  border:1px solid var(--line);border-radius:var(--btn-radius);
  background:var(--surface);font-family:var(--font-body);
  font-size:var(--t-body);color:var(--ink);
}
.m-search-form input:focus{
  border-color:var(--accent);outline:none;box-shadow:0 0 0 3px var(--accent-wash);
}

.m-results{list-style:none;margin:0;padding:0;border-top:1px solid var(--line);}
.m-result{border-bottom:1px solid var(--line);}
.m-result a{
  display:grid;grid-template-columns:auto 1fr auto;
  gap:var(--s-3) var(--s-6);align-items:center;
  padding:var(--s-6) 0;text-decoration:none;color:inherit;
  transition:padding var(--dur-fast) var(--ease-out);
}
.m-result a:hover{padding-left:var(--s-4);}
.m-result-type{
  grid-row:1 / span 3;align-self:start;
  font-family:var(--font-mono);font-size:var(--t-mono);letter-spacing:.12em;
  text-transform:uppercase;color:var(--accent-2-deep);
  min-width:7ch;padding-top:.3em;
}
.m-result h2{margin:0;font-size:var(--t-h3);grid-column:2;}
.m-result a:hover h2{color:var(--accent);}
.m-result-role,
.m-result-excerpt{margin:0;grid-column:2;color:var(--ink-soft);font-size:var(--t-sm);line-height:1.55;}
.m-result .m-arrow{grid-column:3;grid-row:1 / span 3;--arrow-size:40px;}
.m-result a:hover .m-arrow{background:var(--accent);border-color:var(--accent);color:#fff;}

@media (max-width:700px){
  .m-result a{grid-template-columns:1fr;gap:var(--s-2);}
  .m-result-type{grid-row:auto;min-width:0;}
  .m-result h2,.m-result-role,.m-result-excerpt{grid-column:1;}
  .m-result .m-arrow{display:none;}
  .m-search-form{flex-direction:column;}
}

/* ---------- Empty state ---------- */
.m-noresults{
  padding:var(--s-9) 0;max-width:640px;
  display:flex;flex-direction:column;gap:var(--s-5);align-items:flex-start;
}
.m-noresults h2{margin:0;}
.m-noresults-links{display:flex;flex-wrap:wrap;gap:var(--s-3);}

/* ---------- 404 ---------- */
.m-404-grid{
  display:grid;grid-template-columns:repeat(3, minmax(0,1fr));gap:var(--s-5);
}
.m-404-card{
  position:relative;display:flex;flex-direction:column;gap:var(--s-3);
  padding:var(--s-6);padding-right:var(--s-9);
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--card-radius);text-decoration:none;color:inherit;
  transition:border-color var(--dur-mid) var(--ease-out),
             box-shadow var(--dur-mid) var(--ease-out),
             transform var(--dur-mid) var(--ease-out);
}
.m-404-card:hover{border-color:var(--accent-line);box-shadow:var(--shadow-sm);transform:translateY(-4px);}
.m-404-card h2{margin:0;font-size:var(--t-h4);}
.m-404-card p{margin:0;font-size:var(--t-sm);color:var(--ink-soft);line-height:1.55;}
.m-404-card .m-arrow{position:absolute;top:var(--s-5);right:var(--s-5);--arrow-size:36px;}
.m-404-card:hover .m-arrow{background:var(--accent);border-color:var(--accent);color:#fff;}
@media (max-width:900px){ .m-404-grid{grid-template-columns:repeat(2, minmax(0,1fr));} }
@media (max-width:560px){ .m-404-grid{grid-template-columns:1fr;} }

/* Stretched link: the card is clickable everywhere, but only the title is
   an actual anchor — so assistive tech announces one link per card, named
   by the product, instead of three links to the same place (one of them
   unnamed). */
.m-shop-item{position:relative;}
.m-shop-body h2 a::after{
  content:"";position:absolute;inset:0;z-index:1;
}
.m-shop-item .m-shop-flag{z-index:2;}
.m-shop-body h2 a:focus-visible::after{
  outline:2px solid var(--accent);outline-offset:-3px;border-radius:var(--card-radius);
}
