/* Component styles */
:root {
  --color-light-gold: #d4c4a4;
}


/* c-drillSelect */
@scope (.c-drillSelect) to ([data-scope-limit]) {
  :scope {
    --_border: var(--drill-select-border, none);
    --_border-radius: var(--drill-select-border-radius, 5px);
    --_font-size: var(--drill-select-font-size, 1.4rem);
    --_line-height: var(--drill-select-line-height, 1.2);
    --_padding: var(--drill-select-padding, 4px 14px);
    --_padding-lg: var(--drill-select-padding, 4px 14px);
    --_padding-has-arrow-lg: var(--drill-select-padding, 4px 38px 4px 14px);
    --_max-width: var(--drill-max-width, 100%);
    --_height: var(--drill-height, 44px);
    --_height-lg: var(--drill-height-lg, 42px);


    position: relative;
    font-size: var(--_font-size);
    line-height: var(--_line-height);
    width: 100%;
    max-width: var(--_max-width);
    /* outline: none; */
    color: var(--color-black);
  }
  .c-drillSelect__selected {
    border: var(--_border);
    border-radius: var(--_border-radius);
    padding: var(--_padding);
    width: 100%;
    height: var(--_height);
    color: var(--color-black);
    text-align: left;
    background-color: var(--color-white);
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20width%3D%2214%22%20height%3D%228%22%20viewBox%3D%220%200%2014%208%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M6.99996%207.99275C6.74905%207.99275%206.49818%207.89679%206.30688%207.7053L0.287198%201.67623C-0.0957326%201.29271%20-0.0957326%200.670894%200.287198%200.287526C0.669973%20-0.095842%201.29071%20-0.095842%201.67367%200.287526L6.99996%205.62237L12.3263%200.287712C12.7092%20-0.0956557%2013.3299%20-0.0956557%2013.7126%200.287712C14.0957%200.67108%2014.0957%201.2929%2013.7126%201.67642L7.69304%207.70548C7.50165%207.89701%207.25078%207.99275%206.99996%207.99275Z%22%20fill%3D%22%23A9894A%22%2F%3E%3C%2Fsvg%3E");
    background-position: right 14px center;
    /* text-overflow: ellipsis; */
    /* white-space: nowrap; */
    &._isExpanded_ {
      border-bottom-left-radius: 0;
      border-bottom-right-radius: 0;
    }
  }
  .c-drillSelect__selected + .c-drillSelect__options {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 1;
    width: 100%;
    background-color: var(--color-white);
    max-height: min(calc(42px * 20.5), 75svh);
    overflow-y: scroll;
    overscroll-behavior: auto;
    border-bottom-left-radius: var(--_border-radius);
    border-bottom-right-radius: var(--_border-radius);
    box-shadow: 0 2px 4px -2px rgba(0,0,0,0.4) inset, 0px 4px 4px -3px rgba(0,0,0,0.4);
  }
  .c-drillSelect__options {
    display: none;
    .c-drillSelect__options {
      padding-left: 1em;
      background-color: #e2e1df;
    }
  }
  .c-drillSelect__option {
    position: relative;
  }
  .c-drillSelect__radio {
    border: 0;
    clip: rect(1px, 1px, 1px, 1px);
    position: absolute;
    top: 0;
    left: 0;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip-path: inset(50%);
    word-wrap: normal !important;
  }
  .c-drillSelect__button {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 8px;
    min-height: var(--_height);
    padding: var(--_padding);
    border-top: 1px solid #e2e1df;
    cursor: pointer;
    background-color: #fcfaf8;
    &:hover {
      @media (hover: hover) {
        background-color: var(--color-light-gold);
      }
    }
  }
  .c-drillSelect__option:has( > .c-drillSelect__options) > .c-drillSelect__button {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20width%3D%2214%22%20height%3D%228%22%20viewBox%3D%220%200%2014%208%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M6.99996%207.99275C6.74905%207.99275%206.49818%207.89679%206.30688%207.7053L0.287198%201.67623C-0.0957326%201.29271%20-0.0957326%200.670894%200.287198%200.287526C0.669973%20-0.095842%201.29071%20-0.095842%201.67367%200.287526L6.99996%205.62237L12.3263%200.287712C12.7092%20-0.0956557%2013.3299%20-0.0956557%2013.7126%200.287712C14.0957%200.67108%2014.0957%201.2929%2013.7126%201.67642L7.69304%207.70548C7.50165%207.89701%207.25078%207.99275%206.99996%207.99275Z%22%20fill%3D%22%23A9894A%22%2F%3E%3C%2Fsvg%3E");
    background-position: right 14px center;
  }
  .c-drillSelect__radioIcon {
    flex-shrink: 0;
    flex-grow: 0;
    position: relative;
    display: block;
    height: 18px;
    aspect-ratio: 1 / 1;
    &::before, &::after {
      content: '';
      display: block;
      aspect-ratio: 1 / 1;
      border-radius: 50%;
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
    }
    &::before {
      width: 100%;
      height: 100%;
      background-color: var(--color-white);
      border: 1px solid var(--color-pale-gray);
    }
  }
  .c-drillSelect__radio:checked ~ .c-drillSelect__button .c-drillSelect__radioIcon:after {
    height: 10px;
    background-color: var(--color-gold);
  }
  @media (min-width: 768px) {
    .c-drillSelect__selected {
      padding: var(--_padding-has-arrow-lg);
      height: var(--_height-lg);
    }
    .c-drillSelect__button {
      padding: var(--_padding-lg);
      min-height: var(--_height-lg);
    }
    .c-drillSelect__option:has( > .c-drillSelect__options) > .c-drillSelect__button {
      padding: var(--_padding-has-arrow-lg);
    }
  }
}

.c-resultModal {
  --drill-select-border: 1px solid var(--color-pale-gray);
  --drill-max-width: 320px;
  --drill-select-border-radius: 0px;
}


.c-resultList .c-resultList__tableListItem a {
  position: relative;
  z-index: 2;
}

a.c-simpleLink {
  color: var(--color-gold);
  text-decoration: underline;
}