/* public/assets/inbox-v272-customer-status-dropdown.css
   Scoped to /app/inbox -> Facebook -> customer lifecycle status only. */

.inbox-v267[data-channel="facebook"] .inbox-ops-profile-card{
  isolation:isolate;
}

.inbox-v267[data-channel="facebook"] .inbox-ops-profile-card.status-menu-open{
  position:relative;
  z-index:80;
  overflow:visible!important;
}

.inbox-v267[data-channel="facebook"] .inbox-customer-status{
  position:relative;
  width:100%;
  margin-top:7px;
  z-index:1;
}

.inbox-v267[data-channel="facebook"] .inbox-customer-status-native{
  position:absolute!important;
  width:1px!important;
  min-width:1px!important;
  max-width:1px!important;
  height:1px!important;
  min-height:1px!important;
  max-height:1px!important;
  padding:0!important;
  margin:0!important;
  border:0!important;
  opacity:0!important;
  pointer-events:none!important;
  clip:rect(0 0 0 0)!important;
  clip-path:inset(50%)!important;
  overflow:hidden!important;
  white-space:nowrap!important;
}

.inbox-v267[data-channel="facebook"] .inbox-customer-status-trigger{
  --status-accent:#57b8ff;
  width:100%;
  min-width:0;
  height:36px;
  padding:0 11px;
  border:1px solid rgba(68,163,225,.54);
  border-radius:10px;
  background:
    linear-gradient(180deg,rgba(10,42,72,.98) 0%,rgba(6,27,49,.99) 100%);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.045),
    inset 0 0 0 1px rgba(68,180,255,.025),
    0 6px 18px rgba(0,8,20,.18);
  color:#eef8ff;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  appearance:none;
  cursor:pointer;
  font:inherit;
  text-align:left;
  transition:
    border-color .16s ease,
    box-shadow .16s ease,
    background .16s ease;
}

.inbox-v267[data-channel="facebook"] .inbox-customer-status-trigger:hover{
  border-color:rgba(84,194,255,.78);
  background:
    linear-gradient(180deg,rgba(12,48,82,.99) 0%,rgba(6,30,54,.99) 100%);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.06),
    0 0 0 1px rgba(49,182,255,.06),
    0 7px 20px rgba(0,11,28,.24);
}

.inbox-v267[data-channel="facebook"] .inbox-customer-status-trigger:focus-visible,
.inbox-v267[data-channel="facebook"] .inbox-customer-status[data-open="1"] .inbox-customer-status-trigger{
  outline:none;
  border-color:#4bdcff;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.07),
    0 0 0 2px rgba(48,211,255,.16),
    0 0 20px rgba(0,177,255,.16);
}

.inbox-v267[data-channel="facebook"] .inbox-customer-status-leading,
.inbox-v267[data-channel="facebook"] .inbox-customer-status-option-main{
  min-width:0;
  display:flex;
  align-items:center;
  gap:8px;
}

.inbox-v267[data-channel="facebook"] .inbox-customer-status-leading>span,
.inbox-v267[data-channel="facebook"] .inbox-customer-status-option-main>span{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.inbox-v267[data-channel="facebook"] .inbox-customer-status-leading>span{
  color:#f3f9ff;
  font-size:10px;
  font-weight:850;
  line-height:1;
}

.inbox-v267[data-channel="facebook"] .inbox-customer-status-dot{
  width:7px;
  height:7px;
  flex:0 0 7px;
  border-radius:50%;
  background:var(--status-accent);
  box-shadow:
    0 0 0 3px color-mix(in srgb,var(--status-accent) 12%,transparent),
    0 0 10px color-mix(in srgb,var(--status-accent) 66%,transparent);
}

.inbox-v267[data-channel="facebook"] .inbox-customer-status-trigger.tone-new,
.inbox-v267[data-channel="facebook"] .inbox-customer-status-option.tone-new{--status-accent:#59b9ff}

.inbox-v267[data-channel="facebook"] .inbox-customer-status-trigger.tone-potential,
.inbox-v267[data-channel="facebook"] .inbox-customer-status-option.tone-potential{--status-accent:#51ddff}

.inbox-v267[data-channel="facebook"] .inbox-customer-status-trigger.tone-processing,
.inbox-v267[data-channel="facebook"] .inbox-customer-status-option.tone-processing{--status-accent:#ffbe52}

.inbox-v267[data-channel="facebook"] .inbox-customer-status-trigger.tone-closed,
.inbox-v267[data-channel="facebook"] .inbox-customer-status-option.tone-closed{--status-accent:#9d82ff}

.inbox-v267[data-channel="facebook"] .inbox-customer-status-trigger.tone-done,
.inbox-v267[data-channel="facebook"] .inbox-customer-status-option.tone-done{--status-accent:#38dda5}

.inbox-v267[data-channel="facebook"] .inbox-customer-status-chevron{
  width:15px;
  height:15px;
  flex:0 0 15px;
  fill:none;
  stroke:#ccecff;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
  transition:transform .16s ease,color .16s ease;
}

.inbox-v267[data-channel="facebook"] .inbox-customer-status[data-open="1"] .inbox-customer-status-chevron{
  transform:rotate(180deg);
  color:#62e4ff;
}

.inbox-v267[data-channel="facebook"] .inbox-customer-status-menu{
  position:absolute;
  top:calc(100% + 6px);
  left:0;
  right:0;
  z-index:120;
  display:grid;
  gap:3px;
  padding:6px;
  border:1px solid rgba(66,159,221,.52);
  border-radius:11px;
  background:
    radial-gradient(180px 80px at 14% 0%,rgba(26,135,220,.12),transparent 72%),
    linear-gradient(180deg,#08243f 0%,#061a2f 52%,#05172a 100%);
  box-shadow:
    0 18px 34px rgba(0,7,18,.46),
    0 0 0 1px rgba(89,191,255,.035),
    inset 0 1px 0 rgba(255,255,255,.04);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  transform-origin:top center;
  animation:inboxV272StatusMenuIn .14s cubic-bezier(.2,.7,.2,1);
}

.inbox-v267[data-channel="facebook"] .inbox-customer-status-menu[hidden]{
  display:none!important;
}

.inbox-v267[data-channel="facebook"] .inbox-customer-status-option{
  --status-accent:#59b9ff;
  width:100%;
  min-width:0;
  height:32px;
  padding:0 9px;
  border:1px solid transparent;
  border-radius:8px;
  background:transparent;
  color:#c9dced;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:9px;
  appearance:none;
  cursor:pointer;
  font:inherit;
  text-align:left;
  transition:
    color .14s ease,
    border-color .14s ease,
    background .14s ease,
    box-shadow .14s ease;
}

.inbox-v267[data-channel="facebook"] .inbox-customer-status-option-main>span{
  font-size:9.5px;
  font-weight:760;
  line-height:1;
}

.inbox-v267[data-channel="facebook"] .inbox-customer-status-option:hover,
.inbox-v267[data-channel="facebook"] .inbox-customer-status-option:focus-visible{
  outline:none;
  color:#fff;
  border-color:rgba(78,177,239,.22);
  background:
    linear-gradient(90deg,rgba(41,132,219,.20),rgba(23,83,146,.12));
}

.inbox-v267[data-channel="facebook"] .inbox-customer-status-option.is-selected{
  color:#fff;
  border-color:rgba(90,184,255,.42);
  background:
    linear-gradient(90deg,rgba(39,131,230,.42),rgba(21,82,151,.26));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.045),
    0 0 14px rgba(12,128,224,.09);
}

.inbox-v267[data-channel="facebook"] .inbox-customer-status-check{
  width:14px;
  height:14px;
  flex:0 0 14px;
  fill:none;
  stroke:#80eaff;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
  opacity:0;
  transform:scale(.82);
  transition:opacity .14s ease,transform .14s ease;
}

.inbox-v267[data-channel="facebook"] .inbox-customer-status-option.is-selected .inbox-customer-status-check{
  opacity:1;
  transform:scale(1);
}

@keyframes inboxV272StatusMenuIn{
  from{opacity:0;transform:translateY(-4px) scale(.985)}
  to{opacity:1;transform:translateY(0) scale(1)}
}

@media (max-width:1180px){
  .inbox-v267[data-channel="facebook"] .inbox-customer-status-trigger{
    height:38px;
  }
  .inbox-v267[data-channel="facebook"] .inbox-customer-status-menu{
    max-height:min(230px,42vh);
    overflow:auto;
  }
}

@media (prefers-reduced-motion:reduce){
  .inbox-v267[data-channel="facebook"] .inbox-customer-status-menu{
    animation:none;
  }
  .inbox-v267[data-channel="facebook"] .inbox-customer-status-trigger,
  .inbox-v267[data-channel="facebook"] .inbox-customer-status-option,
  .inbox-v267[data-channel="facebook"] .inbox-customer-status-chevron,
  .inbox-v267[data-channel="facebook"] .inbox-customer-status-check{
    transition:none;
  }
}
