/*!
 * El Arabi Medical - portfolio overlay styles
 * Belt-and-braces CSS so commerce UI never flashes visible before
 * portfolio.js runs. Purely additive; safe to delete along with the
 * <link> tag that loads it.
 */

/* Note shown under a product title on /products/:id pages */
.ea-portfolio-note {
  margin: 8px 0 16px;
  padding: 10px 14px;
  font-size: 0.95rem;
  line-height: 1.5;
  color: #555;
  background: #f5f5f5;
  border-left: 3px solid #0a7d5c;
  border-radius: 4px;
  max-width: 640px;
}
.ea-portfolio-note a {
  color: #0a7d5c;
  font-weight: 600;
  text-decoration: underline;
}

[dir="rtl"] .ea-portfolio-note {
  border-left: none;
  border-right: 3px solid #0a7d5c;
}

/* Elements portfolio.js has hidden by JS */
[data-ea-removed="1"] {
  display: none !important;
}

/* Best-effort pre-JS hiding for the most common commerce buttons /
   icons, matched structurally since class names are build-hashed.
   These rules intentionally target only icon buttons with the MUI
   "colorError" heart styling (wishlist) used on product cards; text
   based elements are handled by portfolio.js once it runs, since CSS
   cannot match on text content. */
button.MuiIconButton-colorError {
  display: none !important;
}