/* ==========================================================================
   RS COUNTER WIDGET (.counter-top-area)
   Ported 2026-09-10 from the Blunor theme's counter.css.

   See class-aidem-rs-counter-widget.php's header docblock for the full
   reasoning behind every departure from the original CSS:

   - Style 2 is a real alternate layout here (flex row + bordered box)
     instead of the original's `display: none !important;` (an
     abandoned/unfinished layout that the render() bug meant could never
     even be reached anyway).
   - Colour scheme classes (.primary_scheme / .secondary_scheme) are new -
     the original never defined them at all. Values read from the
     inactive Blunor theme's own rsaddons.css defaults
     (--primaryColor:#b3de4f, --secondaryColor:#96b44e), namespaced here
     as --rs-counter-* custom properties since this plugin doesn't load
     that theme's root variables. Elementor's own Number Color control
     still overrides these whenever a user sets one explicitly.
   - var(--titleColor)/var(--borderColor) replaced with the same
     --rs-counter-* fallback pattern, using the theme's real light-mode
     default values.

   Odometer.js (loaded from CDN - see the widget's get_script_depends())
   drives the rolling-digit count-up; its own theme CSS (odometer-css) is
   enqueued separately and not duplicated here.
   ========================================================================== */

.counter-top-area {
  --rs-counter-primary: #b3de4f;
  --rs-counter-secondary: #96b44e;
  --rs-counter-title: #000000;
  --rs-counter-border: #e6e6e6;

  position: relative;
  padding: 0;
  border-color: var(--rs-counter-border);
}

.counter-top-area .odometer {
  text-align: left;
}
.counter-top-area .odometer.odometer-auto-theme {
  font-family: inherit;
}
.counter-top-area .odometer .odometer-value {
  display: block !important;
}
.counter-top-area .odometer .odometer-inside * {
  text-align: inherit !important;
}

.counter-top-area .rs-counter-list .counter-icon {
  display: inline-block;
}
.counter-top-area .rs-counter-list .counter-icon i {
  font-size: 50px;
  color: #dcdcdc;
  line-height: 60px;
  transition: all 0.3s ease 0s;
}
.counter-top-area .rs-counter-list .counter-icon svg {
  width: 50px;
  height: 50px;
}

.counter-top-area .rs-counter-list .count-text .count-number {
  display: flex;
  align-items: center;
}
.counter-top-area .rs-counter-list .count-text .count-number .rs-counter {
  font-size: 60px;
  color: var(--rs-counter-title);
  line-height: 70px;
  font-weight: 700;
  display: inline-block;
  transition: all 0.3s ease 0s;
  direction: ltr;
  -webkit-text-stroke-color: var(--rs-counter-primary);
  stroke: var(--rs-counter-primary);
}
.counter-top-area .rs-counter-list .count-text .count-number .prefix,
.counter-top-area .rs-counter-list .count-text .count-number .suffix {
  font-size: 60px;
  line-height: 70px;
  font-weight: 700;
  color: var(--rs-counter-title);
  -webkit-text-stroke-color: var(--rs-counter-primary);
  stroke: var(--rs-counter-primary);
}
.counter-top-area .rs-counter-list .count-text .title {
  font-size: 18px;
  color: var(--rs-counter-title);
  line-height: 18px;
  transition: all 0.3s ease 0s;
  display: block;
  border-color: var(--rs-counter-border);
}

/* --------------------------------------------------------- Colour schemes */
.counter-top-area.primary_scheme .rs-counter-list .count-text .count-number .rs-counter,
.counter-top-area.primary_scheme .rs-counter-list .count-text .count-number .prefix,
.counter-top-area.primary_scheme .rs-counter-list .count-text .count-number .suffix {
  color: var(--rs-counter-primary);
}
.counter-top-area.primary_scheme .rs-counter-list .counter-icon i {
  color: var(--rs-counter-primary);
}
.counter-top-area.primary_scheme .rs-counter-list .counter-icon svg path {
  fill: var(--rs-counter-primary);
}

.counter-top-area.secondary_scheme .rs-counter-list .count-text .count-number .rs-counter,
.counter-top-area.secondary_scheme .rs-counter-list .count-text .count-number .prefix,
.counter-top-area.secondary_scheme .rs-counter-list .count-text .count-number .suffix {
  color: var(--rs-counter-secondary);
}
.counter-top-area.secondary_scheme .rs-counter-list .counter-icon i {
  color: var(--rs-counter-secondary);
}
.counter-top-area.secondary_scheme .rs-counter-list .counter-icon svg path {
  fill: var(--rs-counter-secondary);
}

/* ------------------------------------------------------------------ Style 2
   A real alternate layout: the counter row becomes a flex row (justified
   via the existing content__align_for_style_two control) and the number
   block gets a bordered box (via the existing content_wrapper_border
   control) - both controls already existed in the original widget,
   sitting unused because .style2 was set to display:none. */
.counter-top-area.style2 .rs-counter-list {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  justify-content: space-evenly;
}
.counter-top-area.style2 .count-text {
  padding: 20px 28px;
  display: inline-block;
}

@media screen and (max-width: 990px) {
  .counter {
    margin-bottom: 40px;
  }
}
