/* Rules written after the migration, for markup Webflow's Designer never had.
 *
 * webflow.css is compiled output — stage_public.py copies it from the export
 * on every rebuild, so anything added there is lost. This file is hand-kept and
 * loads after it. Only add rules here for classes that do not exist upstream;
 * restyling a Webflow class belongs in the Designer, not here.
 *
 * Uses the variables webflow.css defines on :root.
 */

/* Placeholder for a plant card with no photo — 120 of the 229 plants. The live
 * site simply left the image column blank (Webflow hid the unbound <img>);
 * showing a flower on a tinted field was a deliberate choice to diverge.
 * Sized off the column rather than fixed, since .plant-item-image is 30% wide
 * on desktop, 20% on tablet and a full-width 150px band under 480px. */
.plant-item-image-empty {
  /* The palette's mid sage. --white-smoke, which the tuindier placeholder
   * uses, is #f7f7f7 against a #fff card — near invisible at this size. This
   * is a shade darker than the pills beside it, so the two stay distinct. */
  background-color: var(--pill);
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  min-height: 100%;
  font-size: 4rem;
  line-height: 1;
  /* inline-flex, not flex: this sits inside .plant-item-image-link, whose
   * underline propagates into block descendants and cannot be switched off
   * from here. An inline-level box is exempt from that propagation. */
  display: inline-flex;
  vertical-align: top;
}