
.age-gate-toolbar {
  background: #fff;
  border-bottom: 1px solid #ccd0d4;
  align-items: center;
  position: relative;

  display: none;

  @media screen and (min-width: 850px) {
      display: flex;
  }
}

.age-gate-toolbar__title {
  font-size: 14px;
  line-height: 2.57143;
  display: inline-block;
  padding: 5px 0;
  margin: 0 10px 0 0;
  white-space: nowrap;
}

.age-gate-toolbar__icon {
  vertical-align: middle;
  color: #babbbc;
}

.age-gate-toolbar__tabs {
  display: flex;
  margin: 0;
}

.age-gate-toolbar__tab {
  font-size: 14px;
  line-height: 2.57143;
  margin: 0 5px;
  position: relative;
}

.age-gate-toolbar__tab--active>a {
  border-bottom: #1d8399 solid 3px;
  padding-bottom: 2px;
}

.age-gate-toolbar__tab:hover .age-gate-toolbar__subnav {
  left: auto;
}

.age-gate-toolbar__tab--hidden {
  display: none;
}

.age-gate-toolbar__link {
  display: inline-block;
  padding: 5px;
  color: inherit;
  text-decoration: none;
  white-space: nowrap;
}

.age-gate-toolbar__link:hover {
  color: #1d8399;
}

.age-gate-toolbar__link:focus {
  box-shadow: none;
}

.age-gate-toolbar__link .dashicons {
  vertical-align: middle;
}

.age-gate-toolbar__subnav {
    position: absolute;
    background: #fff;
    border-color: #ccd0d4;
    border-width: 0 1px 1px 1px;
    border-style: solid;
    margin-left: -10px;
    z-index: 99999;
    left: -999999px;
    min-width: 150%;
    margin: 0;
    padding: 0;

    &-wrapper {
        position: relative;
    }

    &-toggle {
        background: transparent;
        padding: 0;
        border: none;
        text-transform: capitalize;
        cursor: pointer;
        color: #1d8399;
        display: none;

        &.priority-nav-is-visible {
            display: inline-block;
            font-size: 14px;
            line-height: 2.57143;
            margin: 0 5px;
            position: relative;
            padding: 5px;
            color: inherit;
            white-space: nowrap;
        }
    }

    &.show {
        right: 0;
        left: auto;
    }
}

.age-gate-toolbar__subnav a {
  padding: 3px 10px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.age-gate-toolbar__subtab {
  margin: 0;
  border-bottom: 1px solid #ccd0d4;
}

.age-gate-toolbar__subtab:last-of-type {
  border-bottom: 0;
}

#wpcontent .age-gate-toolbar {
  margin-left: -20px;
  padding-left: 20px;
}


@media screen and (max-width: 601px) {
    .age-gate-toolbar {
        display: none;
    }
}

.age-gate-toolbar__button {
    margin-left: auto;
    opacity: 1;
    transition: opacity 0.3s ease;
    padding: 5px;
    min-width: 60px;
    border: 0;
    line-height: 2.57143;
    cursor: pointer;

    &::before {
        content: attr(data-count);
    }


    &--hidden {
        pointer-events: none;
        opacity: 0;
    }
}
.age-gate-toolbar__extra {
    position: absolute;
    top: 100%;
    right: 0;
    z-index: 100000;
    background: white;
    padding: 0;
    margin: 0;
    border: solid #ccd0d4;
    border-width: 0 1px 1px;

    &--hidden {
        display: none;
    }
}
