/* --------------------------------------------------------
   Read More Shortcode Styles
   Directory: /read-more/assets/
   Version: 1.3.6
--------------------------------------------------------- */

.rm {
  position: relative;
  /* Optional: set your background color for the fade overlay
     Override per instance: .rm { --rm-fade-color: #FFFBF5; } */
  --rm-fade-color: #fff;
}

/* Visible section gets a bottom fade when collapsed */
.rm__visible {
  position: relative;
}
.rm__visible::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;                 /* sits at the bottom edge */
  height: 2.8em;             /* how tall the fade is (overlaps a bit of text) */
  pointer-events: none;      /* don't block text selection/clicks */
  background: linear-gradient(
    to bottom,
    color-mix(in srgb, var(--rm-fade-color) 0%, transparent 100%) 0%,
    var(--rm-fade-color) 85%
  );
  opacity: 1;
  transition: opacity 300ms ease;
}

/* Hide the fade when expanded (uses :has for modern browsers) */
.rm:has(.rm__toggle[aria-expanded="true"]) .rm__visible::after {
  opacity: 0;
}

/* Collapsed section (animated height) */
.rm__hidden {
  overflow: hidden;
  height: 0;
  transition: height 600ms cubic-bezier(.4,0,.2,1);
}

/* Toggle as clean text link (no underline) */
.rm__toggle {
  appearance: none;
  background: none;
  border: 0;
  padding: 0;
  margin: .5rem 0 0;
  line-height: 1.4;
  cursor: pointer;
  color: inherit;
  text-decoration: none;
  font: inherit;
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  transition: color 150ms ease, font-weight 150ms ease;
}


/* Hover: slightly darker + semi-bold */
.rm__toggle:hover {
  
  color: #120C5D;
}

/* Icon at the END, rotates on expand */
.rm__toggle::before { content: none !important; }
.rm__toggle::after {
  content: "+";
  display: inline-block;
  font-weight: 700;
  transform-origin: center;
  transition: transform 600ms cubic-bezier(.4,0,.2,1), opacity 600ms ease;
}
.rm__toggle[aria-expanded="true"]::after {
  content: "–";
  transform: rotate(180deg);
}

/* Subtle fade for revealed content (sync with height timing) */
.rm__hidden.is-expanding > * {
  animation: rm-fade .6s ease both;
}

@keyframes rm-fade {
  from { opacity: 0; }
  to   { opacity: 1; }
}

/* Center the "Read more" / "Descoperă tot" text */
.rm__toggle {
  justify-content: center; /* centers text + icon horizontally */
  width: 100%;             /* make it span full width */
  text-align: center;      /* ensure text itself is centered */
}