/*
 * DO NOT EDIT THIS FILE.
 * See the following change record for more information,
 * https://www.drupal.org/node/3084859
 * @preserve
 */

/**
 * @file
 * Drop button specific styles.
 */

.dropbutton {
  border-top-left-radius: 2px; /* LTR */
  border-top-right-radius: 0; /* LTR */
  border-bottom-right-radius: 0; /* LTR */
  border-bottom-left-radius: 2px; /* LTR */
  background-color: #0d77b5;
}

[dir="rtl"] .dropbutton {
  border-top-left-radius: 0;
  border-top-right-radius: 2px;
  border-bottom-right-radius: 2px;
  border-bottom-left-radius: 0;
}

.js .dropbutton-widget .dropbutton {
  overflow: visible;
}

.dropbutton-action {
  font-size: 0.875rem;
  line-height: 1.125rem
}

[dir="ltr"] .dropbutton-action a {
    padding-left: 1.125rem;
}

[dir="rtl"] .dropbutton-action a {
    padding-right: 1.125rem;
}

[dir="ltr"] .dropbutton-action a {
    padding-right: 1.125rem;
}

[dir="rtl"] .dropbutton-action a {
    padding-left: 1.125rem;
}

.dropbutton-action a {
    padding-top: 0.28125rem;
    padding-bottom: 0.28125rem;
    text-decoration: none;
    color: #fff;
    border-top-left-radius: 2px; /* LTR */
    border-top-right-radius: 0; /* LTR */
    border-bottom-right-radius: 0; /* LTR */
    border-bottom-left-radius: 2px /* LTR */
  }

.dropbutton-action a:hover {
      background-color: #2494db;
    }

.dropbutton-action a:focus {
      outline: 2px solid  #53b0eb;
      outline-offset: 2px;
      background-color: #2494db;
      box-shadow: var(--shadow-focusable-with-outline);
    }

[dir="rtl"] .dropbutton-action a {
  border-top-left-radius: 0;
  border-top-right-radius: 2px;
  border-bottom-right-radius: 2px;
  border-bottom-left-radius: 0;
}

.js .dropbutton-action a:focus {
  outline: 2px solid  #53b0eb;
}

[dir="ltr"] .dropbutton-toggle {
  border-left: 1px solid #fff;
}

[dir="rtl"] .dropbutton-toggle {
  border-right: 1px solid #fff;
}

.dropbutton-toggle {
  border-top-left-radius: 0; /* LTR */
  border-top-right-radius: 2px; /* LTR */
  border-bottom-right-radius: 2px; /* LTR */
  border-bottom-left-radius: 0; /* LTR */
  background-color: #0d77b5
}

.dropbutton-toggle:hover {
    background-color: #2494db;
  }

.dropbutton-toggle button {
    border-top-left-radius: 0; /* LTR */
    border-top-right-radius: 2px; /* LTR */
    border-bottom-right-radius: 2px; /* LTR */
    border-bottom-left-radius: 0 /* LTR */
  }

.dropbutton-toggle button:focus {
      outline: 2px solid  #53b0eb;
      outline-offset: 2px;
      background-color: #2494db;
      box-shadow: var(--shadow-focusable-with-outline);
    }

[dir="rtl"] .dropbutton-toggle {
  border-top-left-radius: 2px;
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 2px
}

[dir="rtl"] .dropbutton-toggle button {
    border-top-left-radius: 2px;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 2px;
  }

.dropbutton-arrow {
  left: 0;
  right: 0;
  margin-left: auto;
  margin-right: auto;
  border-top-color: #fff;
}

.dropbutton-multiple.open .dropbutton-arrow {
  border-bottom-color: #fff;
}
