/* theme-utility: minimalist storefront for canadianpoppers.is.
   Tailwind CDN handles 95% of the layout; this file carries the few rules
   that can't be expressed inline (side-cart slide animation, line clamp on
   browsers without the Tailwind plugin loaded, prose styling for blog body). */

/* Side-cart open state: theme-utility-cart.js toggles .is-open on #side-cart. */
#side-cart.is-open {
  visibility: visible;
  opacity: 1;
}
#side-cart.is-open [data-side-cart-panel] {
  transform: translateX(0);
}

/* line-clamp without the Tailwind line-clamp plugin (CDN build doesn't always
   include it). Two-line elide for product card titles + cart line names. */
.line-clamp-2 {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* Prose styles for blog article body. Tailwind CDN doesn't bundle @tailwindcss/typography. */
.prose-utility {
  color: var(--brand-fg, #1a1a1a);
  line-height: 1.7;
  font-size: 1.0625rem;
}
.prose-utility > * + * { margin-top: 1.1em; }
.prose-utility h2 { font-size: 1.5rem; font-weight: 600; line-height: 1.3; margin-top: 2em; }
.prose-utility h3 { font-size: 1.2rem; font-weight: 600; line-height: 1.35; margin-top: 1.6em; }
.prose-utility h2 + p, .prose-utility h3 + p { margin-top: 0.6em; }
.prose-utility p { margin: 0; }
.prose-utility a { color: var(--brand-primary, #1a1a1a); text-decoration: underline; text-underline-offset: 3px; }
.prose-utility a:hover { text-decoration: none; }
.prose-utility ul, .prose-utility ol { padding-left: 1.4em; }
.prose-utility ul { list-style: disc; }
.prose-utility ol { list-style: decimal; }
.prose-utility li + li { margin-top: 0.4em; }
.prose-utility blockquote {
  border-left: 3px solid var(--brand-primary, #1a1a1a);
  padding-left: 1em;
  color: var(--brand-muted, #666);
  font-style: italic;
}
.prose-utility hr { border: 0; border-top: 1px solid var(--brand-border, #e5e5e5); margin: 2em 0; }
.prose-utility section[data-faq] {
  background: var(--brand-surface, #f8f8f8);
  border: 1px solid var(--brand-border, #e5e5e5);
  border-radius: 8px;
  padding: 1.25em 1.5em;
}
.prose-utility img { max-width: 100%; height: auto; border-radius: 6px; }

/* Sticky-header offset for in-page anchor links. */
:target { scroll-margin-top: 5rem; }

/* Honeypot field on contact form: hide visually but keep available to bots. */
.honeypot-utility { position: absolute; left: -9999px; top: -9999px; height: 0; overflow: hidden; }

/* Owner-authored side-cart message block (sites.side_cart_message_html).
   Sanitised on write; rendered via <%- %> here. */
.side-cart-message { font-size: 0.78rem; color: var(--brand-muted, #666); }
.side-cart-message a { color: var(--brand-primary, #1a1a1a); text-decoration: underline; }
.side-cart-message a:hover { text-decoration: none; }
.side-cart-message p { margin: 0; }
.side-cart-message p + p { margin-top: 0.4rem; }
.side-cart-message ul, .side-cart-message ol { padding-left: 1.1em; margin: 0.2rem 0; }
.side-cart-message strong { color: var(--brand-fg, #1a1a1a); }