.tailwind .LFhrQ {

    position: absolute;

    z-index: 10;

    margin-top: 0.25rem;

    display: flex;

    max-height: 100vh;

    flex-direction: column;

    align-items: stretch
}

.tailwind .LFhrQ > :not([hidden]) ~ :not([hidden]) {

    --tw-divide-y-reverse: 0;

    border-top-width: calc(1px * calc(1 - var(--tw-divide-y-reverse)));

    border-bottom-width: calc(1px * var(--tw-divide-y-reverse));

    --tw-divide-opacity: 1;

    border-color: rgb(243 244 246 / var(--tw-divide-opacity, 1))
}

.tailwind .LFhrQ {

    overflow: auto;

    border-radius: 0.375rem;

    --tw-bg-opacity: 1;

    background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));

    padding-top: 0.25rem;

    padding-bottom: 0.25rem;

    text-align: left;

    font-size: 1rem;

    line-height: 1.5rem;

    --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);

    --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);

    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);

    --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);

    --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);

    box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);

    --tw-ring-color: rgb(0 0 0 / var(--tw-ring-opacity, 1));

    --tw-ring-opacity: 0.05
}

.tailwind .LFhrQ:focus {

    outline: 2px solid transparent;

    outline-offset: 2px
}

@media (min-width: 640px) {

    .tailwind .LFhrQ {

        font-size: 0.875rem;

        line-height: 1.25rem
    }
}

.tailwind .Z0_LX {

    display: flex;

    flex-direction: column;

    align-items: stretch;

    padding-top: 0.25rem;

    padding-bottom: 0.25rem
}

.tailwind .ztBB9 {

    position: relative;

    cursor: default;

    -webkit-user-select: none;

       -moz-user-select: none;

        -ms-user-select: none;

            user-select: none;

    padding-top: 0.5rem;

    padding-bottom: 0.5rem;

    padding-left: 0.75rem;

    padding-right: 2.25rem
}

.tailwind .wkLdx {

    --tw-bg-opacity: 1;

    background-color: rgb(165 180 252 / var(--tw-bg-opacity, 1));

    --tw-text-opacity: 1;

    color: rgb(255 255 255 / var(--tw-text-opacity, 1))
}

.tailwind .xOMuF {

    --tw-text-opacity: 1;

    color: rgb(17 24 39 / var(--tw-text-opacity, 1))
}

.tailwind .uqXJI {

    pointer-events: none;

    --tw-text-opacity: 1;

    color: rgb(209 213 219 / var(--tw-text-opacity, 1))
}

.tailwind .QWRLW {

    position: absolute;

    top: 0px;

    bottom: 0px;

    right: 0px;

    display: flex;

    align-items: center;

    padding-right: 1rem
}

.tailwind .xkJgr {

    position: absolute;

    top: 0px;

    bottom: 0px;

    left: 0.75rem;

    display: flex;

    align-items: center;

    justify-content: center
}

.tailwind .A0j6V {

    height: 1rem;

    width: 1rem;

    border-radius: 0.25rem;

    --tw-border-opacity: 1;

    border-color: rgb(209 213 219 / var(--tw-border-opacity, 1));

    --tw-text-opacity: 1;

    color: rgb(79 70 229 / var(--tw-text-opacity, 1))
}

.tailwind .A0j6V:focus {

    --tw-ring-opacity: 1;

    --tw-ring-color: rgb(99 102 241 / var(--tw-ring-opacity, 1))
}

.tailwind .YHt0M {

    position: relative;

    width: 100%;

    cursor: default;

    border-radius: 0.375rem;

    border-width: 1px;

    --tw-border-opacity: 1;

    border-color: rgb(209 213 219 / var(--tw-border-opacity, 1));

    --tw-bg-opacity: 1;

    background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));

    padding-top: 0.5rem;

    padding-bottom: 0.5rem;

    padding-left: 0.75rem;

    padding-right: 2.5rem;

    text-align: left;

    --tw-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);

    --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);

    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)
}

.tailwind .YHt0M:focus {

    --tw-border-opacity: 1;

    border-color: rgb(165 180 252 / var(--tw-border-opacity, 1));

    outline: 2px solid transparent;

    outline-offset: 2px;

    --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);

    --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);

    box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);

    --tw-ring-opacity: 1;

    --tw-ring-color: rgb(165 180 252 / var(--tw-ring-opacity, 1))
}

@media (min-width: 640px) {

    .tailwind .YHt0M {

        font-size: 0.875rem;

        line-height: 1.25rem
    }
}

.tailwind .f1Ia5 {

    --tw-border-opacity: 1;

    border-color: rgb(239 68 68 / var(--tw-border-opacity, 1))
}

.tailwind .Wbi2t {

    pointer-events: none;

    position: absolute;

    top: 0px;

    bottom: 0px;

    right: 0px;

    display: flex;

    align-items: center;

    padding-right: 0.5rem
}

.tailwind ._Vcd7 {

    display: inline-flex;

    align-items: center;

    justify-content: center;

    outline: 2px solid transparent;

    outline-offset: 2px
}

.tailwind .Nk46_ {

    padding-left: 0.75rem;

    padding-right: 0.75rem;

    padding-top: 0.5rem;

    padding-bottom: 0.5rem;

    font-size: 0.875rem;

    line-height: 1.25rem
}

.tailwind .z2Z2A {

    display: inline-flex;

    align-items: center;

    justify-content: center;

    outline: 2px solid transparent;

    outline-offset: 2px;

    border-radius: 0.375rem;

    border-width: 1px;

    border-color: transparent;

    --tw-bg-opacity: 1;

    background-color: rgb(59 130 246 / var(--tw-bg-opacity, 1));

    font-weight: 500;

    line-height: 1rem;

    --tw-text-opacity: 1;

    color: rgb(255 255 255 / var(--tw-text-opacity, 1));

    --tw-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);

    --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);

    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)
}

.tailwind .z2Z2A:hover {

    --tw-bg-opacity: 1;

    background-color: rgb(29 78 216 / var(--tw-bg-opacity, 1))
}

.tailwind .z2Z2A:focus {

    outline: 2px solid transparent;

    outline-offset: 2px;

    --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);

    --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);

    box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);

    --tw-ring-opacity: 1;

    --tw-ring-color: rgb(59 130 246 / var(--tw-ring-opacity, 1));

    --tw-ring-offset-width: 2px
}

.tailwind .kLmt_ {

    padding-left: 0.75rem;

    padding-right: 0.75rem;

    padding-top: 0.5rem;

    padding-bottom: 0.5rem;

    font-size: 0.875rem;

    display: inline-flex;

    align-items: center;

    justify-content: center;

    outline: 2px solid transparent;

    outline-offset: 2px;

    border-radius: 0.375rem;

    border-width: 1px;

    border-color: transparent;

    --tw-bg-opacity: 1;

    background-color: rgb(59 130 246 / var(--tw-bg-opacity, 1));

    font-weight: 500;

    line-height: 1rem;

    --tw-text-opacity: 1;

    color: rgb(255 255 255 / var(--tw-text-opacity, 1));

    --tw-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);

    --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);

    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)
}

.tailwind .kLmt_:hover {

    --tw-bg-opacity: 1;

    background-color: rgb(29 78 216 / var(--tw-bg-opacity, 1))
}

.tailwind .kLmt_:focus {

    outline: 2px solid transparent;

    outline-offset: 2px;

    --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);

    --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);

    box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);

    --tw-ring-opacity: 1;

    --tw-ring-color: rgb(59 130 246 / var(--tw-ring-opacity, 1));

    --tw-ring-offset-width: 2px
}

.tailwind .GCnGA {

    --tw-border-opacity: 1;

    border-color: rgb(209 213 219 / var(--tw-border-opacity, 1));

    background-color: transparent;

    --tw-text-opacity: 1;

    color: rgb(156 163 175 / var(--tw-text-opacity, 1))
}

.tailwind .GCnGA:hover {

    background-color: transparent
}

.tailwind .tdMfW {

    display: inline-flex;

    align-items: center;

    justify-content: center;

    outline: 2px solid transparent;

    outline-offset: 2px;

    border-radius: 0.375rem;

    border-width: 1px;

    --tw-border-opacity: 1;

    border-color: rgb(209 213 219 / var(--tw-border-opacity, 1));

    --tw-bg-opacity: 1;

    background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));

    font-size: 0.875rem;

    font-weight: 500;

    line-height: 1rem;

    --tw-text-opacity: 1;

    color: rgb(55 65 81 / var(--tw-text-opacity, 1));

    --tw-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);

    --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);

    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)
}

.tailwind .tdMfW:hover {

    --tw-bg-opacity: 1;

    background-color: rgb(249 250 251 / var(--tw-bg-opacity, 1))
}

.tailwind .tdMfW:focus {

    outline: 2px solid transparent;

    outline-offset: 2px;

    --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);

    --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);

    box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);

    --tw-ring-opacity: 1;

    --tw-ring-color: rgb(59 130 246 / var(--tw-ring-opacity, 1));

    --tw-ring-offset-width: 2px
}

.tailwind .Bby3a {

    outline-style: solid;

    padding-left: 0.75rem;

    padding-right: 0.75rem;

    padding-top: 0.5rem;

    padding-bottom: 0.5rem;

    display: inline-flex;

    align-items: center;

    justify-content: center;

    outline: 2px solid transparent;

    outline-offset: 2px;

    border-radius: 0.375rem;

    border-width: 1px;

    --tw-border-opacity: 1;

    border-color: rgb(209 213 219 / var(--tw-border-opacity, 1));

    --tw-bg-opacity: 1;

    background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));

    font-size: 0.875rem;

    font-weight: 500;

    line-height: 1rem;

    --tw-text-opacity: 1;

    color: rgb(55 65 81 / var(--tw-text-opacity, 1));

    --tw-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);

    --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);

    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)
}

.tailwind .Bby3a:hover {

    --tw-bg-opacity: 1;

    background-color: rgb(249 250 251 / var(--tw-bg-opacity, 1))
}

.tailwind .Bby3a:focus {

    outline: 2px solid transparent;

    outline-offset: 2px;

    --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);

    --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);

    box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);

    --tw-ring-opacity: 1;

    --tw-ring-color: rgb(59 130 246 / var(--tw-ring-opacity, 1));

    --tw-ring-offset-width: 2px
}

.tailwind .TawGF {

    --tw-border-opacity: 1;

    border-color: rgb(243 244 246 / var(--tw-border-opacity, 1));

    --tw-text-opacity: 1;

    color: rgb(209 213 219 / var(--tw-text-opacity, 1))
}

.tailwind .TawGF:hover {

    background-color: transparent
}

.tailwind .PvqOo {

    display: inline-flex;

    align-items: center;

    justify-content: center;

    outline: 2px solid transparent;

    outline-offset: 2px;

    border-radius: 0.375rem;

    font-size: 0.875rem;

    font-weight: 500;

    line-height: 1rem;

    --tw-text-opacity: 1;

    color: rgb(29 78 216 / var(--tw-text-opacity, 1))
}

.tailwind .PvqOo:hover {

    -webkit-text-decoration-line: underline;

            text-decoration-line: underline
}

.tailwind .PvqOo:focus {

    --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);

    --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);

    box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);

    --tw-ring-opacity: 1;

    --tw-ring-color: rgb(59 130 246 / var(--tw-ring-opacity, 1));

    --tw-ring-offset-width: 2px
}

.tailwind .dmWS6 {

    padding-left: 0.75rem;

    padding-right: 0.75rem;

    padding-top: 0.5rem;

    padding-bottom: 0.5rem;

    display: inline-flex;

    align-items: center;

    justify-content: center;

    outline: 2px solid transparent;

    outline-offset: 2px;

    border-radius: 0.375rem;

    font-size: 0.875rem;

    font-weight: 500;

    line-height: 1rem;

    --tw-text-opacity: 1;

    color: rgb(29 78 216 / var(--tw-text-opacity, 1))
}

.tailwind .dmWS6:hover {

    -webkit-text-decoration-line: underline;

            text-decoration-line: underline
}

.tailwind .dmWS6:focus {

    --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);

    --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);

    box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);

    --tw-ring-opacity: 1;

    --tw-ring-color: rgb(59 130 246 / var(--tw-ring-opacity, 1));

    --tw-ring-offset-width: 2px
}

.tailwind .RQJIZ {

    --tw-text-opacity: 1;

    color: rgb(209 213 219 / var(--tw-text-opacity, 1))
}

.tailwind .aO3Hm {

    margin-bottom: 0.5rem;

    display: flex;

    align-items: center;

    justify-content: space-between
}

.tailwind .XnJKe {

    font-size: 1.125rem;

    line-height: 1.75rem;

    font-weight: 700;

    --tw-text-opacity: 1;

    color: rgb(31 41 55 / var(--tw-text-opacity, 1))
}

.tailwind .Do_UP {

    margin-left: 0.25rem;

    font-size: 1.125rem;

    line-height: 1.75rem;

    font-weight: 400;

    --tw-text-opacity: 1;

    color: rgb(75 85 99 / var(--tw-text-opacity, 1))
}

.tailwind .LQOrh {

    display: inline-flex;

    cursor: pointer;

    border-radius: 9999px;

    padding: 0.25rem;

    transition-property: color, background-color, border-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-text-decoration-color, -webkit-backdrop-filter;

    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;

    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-text-decoration-color, -webkit-backdrop-filter;

    transition-duration: 100ms;

    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);

    animation-duration: 100ms;

    animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1)
}

.tailwind .LQOrh:hover {

    --tw-bg-opacity: 1;

    background-color: rgb(229 231 235 / var(--tw-bg-opacity, 1))
}

.tailwind .mWrWC {

    display: inline-flex;

    cursor: pointer;

    border-radius: 9999px;

    padding: 0.25rem;

    transition-property: color, background-color, border-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-text-decoration-color, -webkit-backdrop-filter;

    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;

    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-text-decoration-color, -webkit-backdrop-filter;

    transition-duration: 100ms;

    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);

    animation-duration: 100ms;

    animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1)
}

.tailwind .mWrWC:hover {

    --tw-bg-opacity: 1;

    background-color: rgb(229 231 235 / var(--tw-bg-opacity, 1))
}

.tailwind .UqxT2 {

    margin-left: -0.25rem;

    margin-right: -0.25rem;

    margin-bottom: 0.75rem;

    display: flex;

    flex-wrap: wrap
}

.tailwind .FP89g {

    text-align: center;

    font-size: 0.75rem;

    line-height: 1rem;

    font-weight: 500;

    --tw-text-opacity: 1;

    color: rgb(31 41 55 / var(--tw-text-opacity, 1))
}

.tailwind .Ahlup {

    margin-left: -0.25rem;

    margin-right: -0.25rem;

    display: flex;

    flex-wrap: wrap
}

.tailwind .PsQFr {

    border-width: 1px;

    border-color: transparent;

    padding: 0.25rem;

    text-align: center;

    font-size: 0.875rem;

    line-height: 1.25rem
}

.tailwind .toA4_ {

    position: relative;

    margin-bottom: 0.25rem;

    padding-left: 0.25rem;

    padding-right: 0.25rem
}

.tailwind .N3S_O {

    position: absolute;

    top: 0px;

    bottom: 0px;

    left: 0px;

    width: 50%
}

.tailwind .bZ1z0 {

    position: absolute;

    top: 0px;

    bottom: 0px;

    right: 0px;

    width: 50%
}

.tailwind .ACDsa {

    position: relative;

    display: block;

    width: 100%;

    cursor: pointer;

    border-radius: 9999px;

    border-width: 1px;

    border-color: transparent;

    text-align: center;

    font-size: 0.875rem;

    line-height: 1.25rem;

    line-height: 2;

    transition-property: color, background-color, border-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-text-decoration-color, -webkit-backdrop-filter;

    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;

    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-text-decoration-color, -webkit-backdrop-filter;

    transition-duration: 100ms;

    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);

    animation-duration: 100ms;

    animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1)
}

.tailwind .YLuxG {
  border-radius: 0.25rem;
  border-width: 1px;
  --tw-border-opacity: 1;
  border-color: rgb(209 213 219 / var(--tw-border-opacity, 1));
  --tw-bg-opacity: 1;
  background-color: rgb(243 244 246 / var(--tw-bg-opacity, 1));
  padding-top: 0.25rem;
  padding-bottom: 0.25rem;
  padding-left: 0.5rem;
  padding-right: 0.5rem;
  --tw-text-opacity: 1;
  color: rgb(0 0 0 / var(--tw-text-opacity, 1));
}

.tailwind .YLuxG:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(209 213 219 / var(--tw-bg-opacity, 1));
}

.tailwind .OP9ai {
  border: 1px solid #eee;
  padding: 1rem;
  padding-top: 2rem;
  padding-left: 3rem;

  margin-top: 2rem;
  position: relative;
  max-width: 50rem;
}

.tailwind ._CiTd {
  position: absolute;
  top: -1rem;
  background: #fbfbfb;
}

.tailwind .vEvHK {
  background: radial-gradient(#ddd 15%, transparent 16%) 1px 1px;
  background-color: #eee;
  background-size: 16px 16px;

  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 1.5rem;
}

.tailwind .uQgai {
  /* @apply mt-1 relative rounded-md shadow-sm block pl-7 pr-12 sm:text-sm border-gray-300 mr-2 py-2; */
  margin-right: 0.75rem;
  margin-top: 0.25rem;
  border-radius: 0.375rem;
  --tw-border-opacity: 1;
  border-color: rgb(209 213 219 / var(--tw-border-opacity, 1));
  --tw-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);
  --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.tailwind .uQgai:focus {
  --tw-border-opacity: 1;
  border-color: rgb(165 180 252 / var(--tw-border-opacity, 1));
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
  --tw-ring-color: rgb(199 210 254 / var(--tw-ring-opacity, 1));
  --tw-ring-opacity: 0.5;
}

.tailwind .uQgai {
  flex-grow: 1;
}

.tailwind .FA25F {
  margin-bottom: 0;
}

.tailwind .FA25F input {
  border-radius: 0.25rem;
  --tw-border-opacity: 1;
  border-color: rgb(209 213 219 / var(--tw-border-opacity, 1));
  --tw-text-opacity: 1;
  color: rgb(79 70 229 / var(--tw-text-opacity, 1));
  --tw-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);
  --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.tailwind .FA25F input:focus {
  --tw-border-opacity: 1;
  border-color: rgb(165 180 252 / var(--tw-border-opacity, 1));
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
  --tw-ring-color: rgb(199 210 254 / var(--tw-ring-opacity, 1));
  --tw-ring-opacity: 0.5;
  --tw-ring-offset-width: 0px;
}

.tailwind .FA25F input {
  margin-right: 0.5rem;
}

.tailwind .mleeh {
  margin-top: 1rem;
  margin-bottom: 1rem;
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.tailwind ._lDHv {
  position: absolute;
  top: 0;
  right: 0;
  border: 0;
  color: hsl(6, 51%, 72%);
  background: transparent;
  text-transform: lowercase;
  text-decoration: underline;
}

.tailwind .MdAkA {
  margin-top: 2rem;
  margin-bottom: 1rem;
  border: 1px solid #eee;
  padding: 1rem;
  padding-top: 2rem;
  position: relative;
}

.tailwind ._45_r {
  position: absolute;
  top: -1rem;
  background: #fbfbfb;
}

.tailwind .k1_2w {
  border-radius: 0.25rem;
  border-width: 1px;
  --tw-border-opacity: 1;
  border-color: rgb(209 213 219 / var(--tw-border-opacity, 1));
  --tw-bg-opacity: 1;
  background-color: rgb(243 244 246 / var(--tw-bg-opacity, 1));
  padding-top: 0.25rem;
  padding-bottom: 0.25rem;
  padding-left: 0.5rem;
  padding-right: 0.5rem;
  --tw-text-opacity: 1;
  color: rgb(0 0 0 / var(--tw-text-opacity, 1));
}

.tailwind .k1_2w:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(209 213 219 / var(--tw-bg-opacity, 1));
}

.tailwind ._f3_6 {
  margin-bottom: 1rem;
  font-style: italic;
}

.tailwind .b00RB {
  font-style: normal;
  font-weight: bold;
  content: "X";
  border: 0;
  background: transparent;
}

.tailwind .tmEWG {
}

.tailwind .CRmZQ {
  border: 0;
  color: rgb(50, 118, 177);
  background: transparent;
  text-transform: lowercase;
}

.tailwind ._I6uG {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0.25rem;
}


.tailwind .nspFT {
    border-radius: 0.25rem;
    border-width: 1px;
    --tw-border-opacity: 1;
    border-color: rgb(209 213 219 / var(--tw-border-opacity, 1));
    --tw-bg-opacity: 1;
    background-color: rgb(243 244 246 / var(--tw-bg-opacity, 1));
    padding-top: 0.25rem;
    padding-bottom: 0.25rem;
    padding-left: 0.5rem;
    padding-right: 0.5rem;
    --tw-text-opacity: 1;
    color: rgb(0 0 0 / var(--tw-text-opacity, 1));
}

.tailwind .nspFT:hover {
    --tw-bg-opacity: 1;
    background-color: rgb(209 213 219 / var(--tw-bg-opacity, 1));
}

.tailwind .s6ZHM {
    border-radius: 0.25rem;
    border-width: 1px;
    --tw-border-opacity: 1;
    border-color: rgb(209 213 219 / var(--tw-border-opacity, 1));
    --tw-bg-opacity: 1;
    background-color: rgb(243 244 246 / var(--tw-bg-opacity, 1));
    padding-top: 0.25rem;
    padding-bottom: 0.25rem;
    padding-left: 0.5rem;
    padding-right: 0.5rem;
    --tw-text-opacity: 1;
    color: rgb(0 0 0 / var(--tw-text-opacity, 1));
}

.tailwind .s6ZHM:hover {
    --tw-bg-opacity: 1;
    background-color: rgb(209 213 219 / var(--tw-bg-opacity, 1));
}

.tailwind .s6ZHM {
    margin-top: 1rem;
}

/*
 * Staffing calendar overlay — popover + avatar styles.
 *
 * Ported verbatim from
 * specs/staffing-allocations/prototypes/_shared.css so class names line
 * up with the prototype reference; the JS controller in
 * staffing-popover.ts and the Django templates under
 * apps/buzzadmin/templates/buzzadmin/staffing/ use the same names.
 *
 * Imported as a side-effect from staffing-popover.ts so webpack picks
 * it up via the existing buzzadmin entry. Do not @import it from
 * other CSS modules.
 */

/* === Avatar palette (deterministic per staff). === */

.tailwind .av-a {
  background: #fbcfe8;
  color: #831843;
}

/* pink */

.tailwind .av-b {
  background: #bae6fd;
  color: #075985;
}

/* sky */

.tailwind .av-c {
  background: #bbf7d0;
  color: #14532d;
}

/* green */

.tailwind .av-d {
  background: #fde68a;
  color: #78350f;
}

/* amber */

.tailwind .av-e {
  background: #bae6fd;
  color: #0c4a6e;
}

/* sky */

.tailwind .av-f {
  background: #99f6e4;
  color: #134e4a;
}

/* teal */

.tailwind .av-g {
  background: #ddd6fe;
  color: #5b21b6;
}

/* violet */

.tailwind .av-h {
  background: #fecaca;
  color: #7f1d1d;
}

/* red */

/* === Avatar circle base. === */

.tailwind .avatar {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 9999px;
  background: #9ca3af;
  color: white;
  font-weight: 600;
  font-size: 0.7rem;
  line-height: 1;
  border: 2px solid white;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
  flex-shrink: 0;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}

.tailwind .avatar-empty {
  background: white;
  border: 2px dashed #9ca3af;
  color: #6b7280;
}

/* Warning ring on avatar */

.tailwind .avatar-warn {
  box-shadow:
    0 0 0 2px #f59e0b,
    0 1px 2px rgba(0, 0, 0, 0.15);
}

.tailwind .avatar-bad {
  box-shadow:
    0 0 0 2px #ef4444,
    0 1px 2px rgba(0, 0, 0, 0.15);
}

/* Avatar stack — overlapping chips at the bottom-right of a booking cell. */

.tailwind .avatar-stack > * + * {
  margin-left: -0.4rem;
}

/* === Staffing popover / mobile modal sheet === */

.tailwind .staffpop-overlay {
  position: fixed;
  inset: 0;
  z-index: 1100;
  pointer-events: none;
}

.tailwind .staffpop-overlay > * {
  pointer-events: auto;
}

/* Card chrome — applies regardless of desktop/mobile mode so the
   popover always renders as a visible card even before the mode class
   lands and as a safety net if descendant-selector matching gets
   blocked by some unexpected stacking context. Desktop/mobile rules
   below only contribute mode-specific overrides (anchoring, sheet
   positioning, mobile corner radii). */

.tailwind .staffpop-card {
  position: absolute;
  background: white;
  border: 1px solid #e5e7eb;
  border-radius: 0.5rem;
  box-shadow:
    0 10px 25px rgba(0, 0, 0, 0.15),
    0 4px 10px rgba(0, 0, 0, 0.05);
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

/* Desktop: anchored card, no backdrop */

.tailwind .staffpop-desktop .staffpop-backdrop {
  display: none;
}

.tailwind .staffpop-desktop .staffpop-card {
  width: 24rem;
  max-height: 36rem;
}

.tailwind .staffpop-desktop .staffpop-handle {
  display: none;
}

/* Mobile: bottom sheet */

.tailwind .staffpop-mobile .staffpop-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(17, 24, 39, 0.5);
  opacity: 0;
  transition: opacity 0.18s ease-out;
}

.tailwind .staffpop-mobile.staffpop-open .staffpop-backdrop {
  opacity: 1;
}

.tailwind .staffpop-mobile .staffpop-card {
  left: 0;
  right: 0;
  bottom: 0;
  border: none;
  border-radius: 1rem 1rem 0 0;
  box-shadow: 0 -8px 24px rgba(0, 0, 0, 0.18);
  max-height: 85vh;
  transform: translateY(100%);
  transition: transform 0.22s ease-out;
}

.tailwind .staffpop-mobile.staffpop-open .staffpop-card {
  transform: translateY(0);
}

.tailwind .staffpop-mobile .staffpop-handle {
  flex-shrink: 0;
  width: 2.5rem;
  height: 0.25rem;
  background: #d1d5db;
  border-radius: 9999px;
  margin: 0.5rem auto;
}

.tailwind .staffpop-header {
  flex-shrink: 0;
  padding: 0.625rem 0.875rem;
  border-bottom: 1px solid #e5e7eb;
  background: #f9fafb;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.5rem;
}

.tailwind .staffpop-roles {
  overflow-y: auto;
  padding: 0.5rem;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

/* Section — one per booking in the slot */

.tailwind .staffpop-section {
  display: flex;
  flex-direction: column;
  gap: 0.375rem;
}

.tailwind .staffpop-section + .staffpop-section {
  margin-top: 0.25rem;
  padding-top: 0.625rem;
  border-top: 1px dashed #e5e7eb;
}

.tailwind .staffpop-section-header {
  padding: 0 0.125rem;
}

.tailwind .staffpop-section-booker-name {
  font-size: 0.8125rem;
  font-weight: 600;
  color: #111827;
  line-height: 1.2;
}

.tailwind .staffpop-section-booker-meta {
  margin-top: 0.125rem;
  font-size: 0.6875rem;
  color: #6b7280;
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  align-items: center;
}

/* Role accordion row */

.tailwind .staffpop-role {
  border: 1px solid #e5e7eb;
  border-radius: 0.5rem;
  overflow: hidden;
  background: white;
}

.tailwind .staffpop-role-open {
  border-color: #93c5fd;
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.12);
}

.tailwind .staffpop-role-summary {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 0.625rem;
  padding: 0.5rem 0.625rem;
  text-align: left;
  background: white;
}

.tailwind .staffpop-role-summary:hover {
  background: #f9fafb;
}

.tailwind .staffpop-role-summary-text {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
}

.tailwind .staffpop-role-summary-name {
  font-size: 0.875rem;
  font-weight: 600;
  color: #111827;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tailwind .staffpop-role-summary-role {
  font-size: 0.6875rem;
  color: #6b7280;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.tailwind .staffpop-role-summary-chevron {
  width: 1rem;
  height: 1rem;
  transition: transform 0.15s;
  flex-shrink: 0;
}

.tailwind .staffpop-role-summary-chevron-open {
  transform: rotate(90deg);
}

.tailwind .staffpop-role-summary-badge {
  flex-shrink: 0;
  font-size: 0.65rem;
  padding: 0.15rem 0.4rem;
  border-radius: 0.25rem;
  font-weight: 600;
}

.tailwind .staffpop-role-body {
  padding: 0.625rem 0.625rem 0.75rem 0.625rem;
  border-top: 1px solid #f3f4f6;
  background: #fafafa;
}

/* Warning lines inside the expanded panel */

.tailwind .staffpop-warn {
  border-radius: 0.375rem;
  padding: 0.4rem 0.5rem;
  font-size: 0.75rem;
  margin-bottom: 0.5rem;
}

/* Candidate buttons */

.tailwind .staffpop-cand {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.4rem 0.5rem;
  border-bottom: 1px solid #f3f4f6;
  text-align: left;
  transition: background 0.1s;
}

.tailwind .staffpop-cand:last-child {
  border-bottom: none;
}

.tailwind .staffpop-cand:hover {
  background: #eff6ff;
}

.tailwind .staffpop-cand-current {
  background: #eff6ff;
}

.tailwind .staffpop-cand-info {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
}

.tailwind .staffpop-cand-name {
  font-size: 0.875rem;
  font-weight: 500;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tailwind .staffpop-cand-quals {
  font-size: 0.65rem;
  color: #6b7280;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tailwind .staffpop-cand-tags {
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 0.15rem;
}

/* Status / qualification tags */

.tailwind .tag {
  font-size: 0.6rem;
  padding: 0.1rem 0.3rem;
  border-radius: 0.2rem;
  font-weight: 600;
}

.tailwind .xs6IT {
  z-index: 1000;
  display: inline-block;
  border-radius: 0.25rem;
  --tw-bg-opacity: 1;
  background-color: rgb(17 24 39 / var(--tw-bg-opacity, 1));
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  padding-left: 1rem;
  padding-right: 1rem;
  font-size: 0.875rem;
  line-height: 1.25rem;
  font-weight: 700;
  --tw-text-opacity: 1;
  color: rgb(243 244 246 / var(--tw-text-opacity, 1));
}

.tailwind ._3weR,
.tailwind ._3weR::before {
  position: absolute;
  width: 8px;
  height: 8px;
  background: inherit;
}

.tailwind ._3weR {
  visibility: hidden;
}

.tailwind ._3weR::before {
  visibility: visible;
  content: "";
  transform: rotate(45deg);
}

.tailwind .xs6IT[data-popper-placement^="top"] > ._3weR {
  bottom: -4px;
}

.tailwind .xs6IT[data-popper-placement^="bottom"] > ._3weR {
  top: -4px;
}

.tailwind .xs6IT[data-popper-placement^="left"] > ._3weR {
  right: -4px;
}

.tailwind .xs6IT[data-popper-placement^="right"] > ._3weR {
  left: -4px;
}

.tailwind .SzFHF,
.tailwind ._FhVk {
  opacity: 0;
}

.tailwind .qgxcP,
.tailwind .ApkYq {
  opacity: 1;
  transition-property: color, background-color, border-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-text-decoration-color, -webkit-backdrop-filter;
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-text-decoration-color, -webkit-backdrop-filter;
  transition-property: opacity;
  transition-duration: 500ms;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  animation-duration: 500ms;
  animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
}

.tailwind .DAw8L {
  opacity: 1;
}

.tailwind .xAx60 {
  opacity: 0;
  transition-property: color, background-color, border-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-text-decoration-color, -webkit-backdrop-filter;
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-text-decoration-color, -webkit-backdrop-filter;
  transition-property: opacity;
  transition-duration: 500ms;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  animation-duration: 500ms;
  animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
}

