/* Severity badges */
.sev{
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-size:12px;
  font-weight:800;
  padding:6px 12px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.06);
  color: rgba(255,255,255,.92);
  letter-spacing:.2px;
}

.sev::before{
  content:"";
  width:8px; height:8px;
  border-radius:999px;
  box-shadow: 0 0 0 3px rgba(255,255,255,.06);
}

/* RGB: красный/жёлтый/зелёный */
.sev--high{
  border-color: rgba(255, 64, 64, .40);
  background: rgba(255, 64, 64, .14);
}
.sev--high::before{ background: rgb(255, 64, 64); }

.sev--medium{
  border-color: rgba(255, 204, 0, .40);
  background: rgba(255, 204, 0, .14);
}
.sev--medium::before{ background: rgb(255, 204, 0); }

.sev--low{
  border-color: rgba(0, 210, 120, .40);
  background: rgba(0, 210, 120, .14);
}
.sev--low::before{ background: rgb(0, 210, 120); }

.sev--unknown{
  border-color: rgba(160,160,160,.35);
  background: rgba(160,160,160,.10);
}
.sev--unknown::before{ background: rgb(160,160,160); }

/* Image placeholder */
.issue-placeholder{
  height: 100%;
  width: 100%;
  display:flex;
  align-items:center;
  justify-content:center;
  background:
    radial-gradient(1200px 300px at 50% 0%, rgba(255,255,255,.12), transparent 55%),
    linear-gradient(135deg, rgba(255,255,255,.06), rgba(255,255,255,.02));
}

.issue-placeholder__inner{
  text-align:center;
  padding: 16px 18px;
  border-radius: 18px;
  background: rgba(0,0,0,.18);
  border: 1px solid rgba(255,255,255,.10);
  backdrop-filter: blur(6px);
}

.issue-placeholder__title{
  font-weight: 900;
  color: rgba(255,255,255,.75);
}

.issue-placeholder__sub{
  margin-top: 4px;
  font-size: 12px;
  color: rgba(255,255,255,.45);
}
/* Form controls */
.control {
  width: 100%;
  padding: 12px 16px;
  border-radius: 16px;
  background: rgba(255,255,255,.10);
  border: 1px solid rgba(255,255,255,.12);
  color: rgba(255,255,255,.92);
  outline: none;
  -webkit-appearance: none;
  appearance: none;
}

.control::placeholder { color: rgba(255,255,255,.55); }

.control:focus {
  border-color: rgba(56, 189, 248, .55);
  box-shadow: 0 0 0 4px rgba(56,189,248,.18);
}

/* Important: options in dropdown (browser draws them on white) */
.control option {
  color: #0b1220;           /* тёмный текст */
  background: #ffffff;      /* белый фон */
}

/* arrow */
.select-wrap{
  position: relative;
}

.select-wrap::after{
  content: "";
  position:absolute;
  right: 14px;
  top: 50%;
  width: 10px;
  height: 10px;
  border-right: 2px solid rgba(255,255,255,.75);
  border-bottom: 2px solid rgba(255,255,255,.75);
  transform: translateY(-60%) rotate(45deg);
  pointer-events:none;
  opacity:.9;
}

/* Делает текст в select белым + нормальные option */
select.control {
  color: rgba(255,255,255,.92);
}

select.control option {
  color: #0b1220;
  background: #ffffff;
}

/* input тоже */
input.control {
  color: rgba(255,255,255,.92);
}

input.control::placeholder{
  color: rgba(255,255,255,.55);
}
/* сам select (закрытое состояние) — белый текст на тёмном фоне */
select {
  color: rgba(255,255,255,.92);
  background-color: rgba(255,255,255,.10);
}

/* выпадающий список (открытое состояние) — чёрный текст на белом фоне */
select option {
  color: #111 !important;
  background: #fff !important;
}

/* иногда помогает ещё и это */
select optgroup {
  color: #111 !important;
  background: #fff !important;
}