/**
 * Common Design: Dropdowns
 */
[data-cd-toggable] {
  --dropdown: true;
}

/**
 * Initial hidden state used to prevent flash of content. Once processed by
 * the cd-dropdown.js script, the visibility will be controlled by the
 * data-cd-hidden attribute.
 */
.js [data-cd-toggable]:not([data-cd-processed]) {
  display: none;
}

[data-cd-hidden="false"] {
  display: block;
}

[data-cd-hidden="true"] {
  display: none;
}

.cd-dropdown {
  display: none;
}

.cd-dropdown[data-cd-hidden="false"] {
  display: block;
}

.no-js .cd-dropdown {
  position: relative;
  display: block;
}