.card-item,
.card-item .refuel-card__content {
  display: flex;
  flex-direction: column;
}

a.card-item {
  text-decoration: none;
}

.refuel-card__image {
  flex: 1;
  overflow: hidden;
}

{% scope_css %}
  /* --- UNIVERSAL TEXT RESET --- */
  /* This ensures text stays dark regardless of the accent color */
  .card-item .content__heading,
  .card-item .refuel-card__content p,
  .card-item .refuel-card__content {
    color: #0d1222 !important; /* Your preferred dark text color */
  }

  /* --- RED ACCENT LOGIC --- */
  .accent--red svg, .accent--red i { fill: #ff5a4d !important; color: #ff5a4d !important; }
  .divider--red { background-color: #ff5a4d !important; height: 2px; width: 100%; border: none; }
  /* Filter for Red icons */
  .accent--red img { 
    filter: brightness(0) saturate(100%) invert(46%) sepia(61%) saturate(2855%) hue-rotate(338deg) brightness(101%) contrast(101%) !important; 
  }

  /* --- BLUE ACCENT LOGIC --- */
  .accent--blue svg, .accent--blue i { fill: #007bff !important; color: #007bff !important; }
  .divider--blue { background-color: #007bff !important; height: 2px; width: 100%; border: none; }
  /* Filter for Blue icons (Standard Corporate Blue) */
  .accent--blue img { 
    filter: invert(31%) sepia(94%) saturate(2135%) hue-rotate(198deg) brightness(98%) contrast(105%) !important; 
  }

  /* --- SPACING & RESET --- */
  .refuel-card__content  {
    margin: 0;
  }
{% end_scope_css %}