/**
 * Show More - Inline & Inline-Block
 */

/* Hidden content */
.smi-hidden {
  display: none;
}

/* Inline open */
.show-more-inline.open .smi-hidden {
  display: inline;
  animation: smiFadeIn 0.3s ease forwards;
}

/* Block open */
.show-more-inline-block.open .smi-hidden {
  display: block;
  margin: 0;
  padding: 0;
  animation: smiSlideDown 0.3s ease forwards;
}

/* Closing animation */
.smi-hidden.smi-closing {
  animation: smiFadeOut 0.25s ease forwards;
}

.show-more-inline-block .smi-hidden.smi-closing {
  animation: smiSlideUp 0.25s ease forwards;
}

/* Toggle icons */
.smi-toggle {
  color: rgb(20, 184, 166);
  cursor: pointer;
}

.smi-toggle:hover {
  color: rgb(13, 148, 136);
}

/* Expand icon */
.show-more-inline.open .smi-expand,
.show-more-inline-block.open .smi-expand {
  display: none;
}

/* Collapse icon */
.smi-collapse {
  display: none;
}

.show-more-inline.open .smi-collapse,
.show-more-inline-block.open .smi-collapse {
  display: inline;
}

/* Animations */
@keyframes smiFadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes smiFadeOut {
  from { opacity: 1; }
  to { opacity: 0; }
}

@keyframes smiSlideDown {
  from { opacity: 0; transform: translateY(-8px); }
  to { opacity: 1; transform: translateY(0); }
}

@keyframes smiSlideUp {
  from { opacity: 1; transform: translateY(0); }
  to { opacity: 0; transform: translateY(-8px); }
}
