.reward-premium-form{
  position:relative;
}

.reward-premium-picker{
  position:relative;
  width:100%;
}

.reward-picker-trigger{
  width:100%;
  min-height:56px;
  display:flex;
  align-items:center;
  gap:13px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:16px;
  padding:10px 14px;
  text-align:left;
  color:#fff;
  background:
    radial-gradient(circle at 20% 0%, rgba(189,92,255,.16), transparent 35%),
    linear-gradient(180deg, rgba(23,27,49,.96), rgba(13,16,33,.96));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.06),
    0 12px 30px rgba(0,0,0,.18);
  cursor:pointer;
  transition:.18s ease;
}

.reward-picker-trigger:hover,
.reward-premium-picker.open .reward-picker-trigger{
  border-color:rgba(189,92,255,.55);
  box-shadow:
    0 0 0 4px rgba(189,92,255,.10),
    0 18px 38px rgba(0,0,0,.28);
}

.reward-trigger-icon{
  width:38px;
  height:38px;
  display:grid;
  place-items:center;
  border-radius:13px;
  background:
    radial-gradient(circle at 35% 25%, rgba(255,255,255,.18), transparent 38%),
    linear-gradient(135deg, rgba(155,78,255,.9), rgba(50,90,255,.5));
  font-size:20px;
  flex:0 0 auto;
}

.reward-trigger-text{
  min-width:0;
  flex:1;
}

.reward-trigger-text b{
  display:block;
  font-size:14px;
  letter-spacing:.01em;
}

.reward-trigger-text small{
  display:block;
  margin-top:3px;
  color:rgba(255,255,255,.58);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.reward-trigger-chevron{
  color:rgba(255,255,255,.55);
  font-size:18px;
  transition:.18s ease;
}

.reward-premium-picker.open .reward-trigger-chevron{
  transform:rotate(180deg);
}

.reward-picker-popover{
  position:fixed;
  z-index:999999;
  padding:14px;
  border:1px solid rgba(189,92,255,.35);
  border-radius:20px;
  background:
    radial-gradient(circle at 18% 0%, rgba(189,92,255,.28), transparent 34%),
    radial-gradient(circle at 85% 15%, rgba(63,121,255,.13), transparent 33%),
    linear-gradient(180deg, rgba(15,18,39,.98), rgba(8,10,24,.98));
  box-shadow:
    0 28px 70px rgba(0,0,0,.55),
    0 0 0 1px rgba(255,255,255,.04) inset;
  animation:rewardPopoverIn .14s ease-out;
}

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

.reward-picker-search{
  height:48px;
  display:flex;
  align-items:center;
  gap:10px;
  border:1px solid rgba(255,255,255,.10);
  border-radius:15px;
  padding:0 13px;
  background:rgba(0,0,0,.24);
}

.reward-picker-search input{
  width:100%;
  height:100%;
  border:0;
  outline:0;
  background:transparent;
  color:#fff;
  font:inherit;
}

.reward-picker-tabs{
  display:flex;
  gap:8px;
  overflow:auto;
  padding:12px 1px 10px;
  scrollbar-width:none;
}

.reward-picker-tabs::-webkit-scrollbar{
  display:none;
}

.reward-picker-tabs button{
  flex:0 0 auto;
  border:1px solid rgba(255,255,255,.09);
  border-radius:999px;
  padding:7px 11px;
  background:rgba(255,255,255,.055);
  color:rgba(255,255,255,.82);
  font-weight:800;
  cursor:pointer;
  transition:.16s ease;
}

.reward-picker-tabs button:hover,
.reward-picker-tabs button.active{
  border-color:rgba(189,92,255,.72);
  background:rgba(189,92,255,.20);
  color:#fff;
}

.reward-picker-list{
  max-height:340px;
  overflow:auto;
  padding-right:4px;
  scrollbar-width:thin;
  scrollbar-color:rgba(189,92,255,.75) rgba(255,255,255,.06);
}

.reward-picker-list::-webkit-scrollbar{
  width:8px;
}

.reward-picker-list::-webkit-scrollbar-track{
  background:rgba(255,255,255,.05);
  border-radius:999px;
}

.reward-picker-list::-webkit-scrollbar-thumb{
  background:linear-gradient(180deg, rgba(189,92,255,.95), rgba(110,75,255,.8));
  border-radius:999px;
}

.reward-picker-group{
  display:grid;
  gap:7px;
  margin-top:6px;
}

.reward-picker-group + .reward-picker-group{
  margin-top:14px;
  padding-top:12px;
  border-top:1px solid rgba(255,255,255,.08);
}

.reward-picker-group h4{
  margin:0 0 2px;
  color:rgba(209,150,255,.95);
  font-size:11px;
  letter-spacing:.11em;
  text-transform:uppercase;
}

.reward-picker-option{
  width:100%;
  display:flex;
  align-items:center;
  gap:12px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:15px;
  padding:10px;
  color:#fff;
  background:rgba(255,255,255,.045);
  cursor:pointer;
  text-align:left;
  transition:.14s ease;
}

.reward-picker-option:hover,
.reward-picker-option.active{
  border-color:rgba(189,92,255,.52);
  background:rgba(189,92,255,.13);
  transform:translateY(-1px);
}

.reward-picker-option.selected{
  border-color:rgba(64,255,170,.55);
  background:linear-gradient(90deg, rgba(64,255,170,.12), rgba(189,92,255,.13));
}

.reward-option-icon{
  width:36px;
  height:36px;
  display:grid;
  place-items:center;
  border-radius:12px;
  background:
    radial-gradient(circle at 35% 25%, rgba(255,255,255,.2), transparent 34%),
    rgba(189,92,255,.18);
  flex:0 0 auto;
  font-size:19px;
}

.reward-option-main{
  min-width:0;
  flex:1;
}

.reward-option-main b{
  display:block;
  font-size:13px;
  line-height:1.2;
}

.reward-option-main small{
  display:block;
  margin-top:3px;
  color:rgba(255,255,255,.58);
  font-size:11px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.reward-option-check{
  width:22px;
  color:#43ffae;
  font-weight:900;
  text-align:center;
}

.reward-picker-empty{
  padding:18px;
  border:1px dashed rgba(255,255,255,.14);
  border-radius:15px;
  color:rgba(255,255,255,.62);
  text-align:center;
}

.reward-amount-stepper{
  display:grid;
  grid-template-columns:44px 1fr 44px;
  align-items:center;
  gap:8px;
}

.reward-amount-stepper input{
  text-align:center;
}

.reward-step-btn{
  height:44px;
  border:1px solid rgba(255,255,255,.10);
  border-radius:14px;
  background:
    linear-gradient(180deg, rgba(189,92,255,.24), rgba(110,75,255,.14));
  color:#fff;
  font-size:22px;
  font-weight:900;
  cursor:pointer;
}

.reward-step-btn:hover{
  border-color:rgba(189,92,255,.66);
  background:rgba(189,92,255,.28);
}

@media (max-width: 900px){
  .reward-picker-popover{
    position:fixed;
    left:16px;
    right:16px;
    top:96px;
  }
}


/* Phase 18.3: Popover wird an body gehängt, damit keine Card/Section es abschneidet */
.reward-picker-popover{
  overflow:hidden;
}

.reward-picker-popover .reward-picker-list{
  max-height:calc(var(--reward-picker-max-height, 420px) - 126px);
}

body:has(.reward-picker-popover:not([hidden])) .admin-card,
body:has(.reward-picker-popover:not([hidden])) .glass,
body:has(.reward-picker-popover:not([hidden])) .section{
  overflow:visible;
}

@media (max-width: 900px){
  .reward-picker-popover{
    left:16px !important;
    right:auto !important;
    width:calc(100vw - 32px) !important;
    top:96px !important;
  }
}


/* Phase 18.4: komplettes Belohnungsformular harmonisieren */
.reward-premium-form{
  display:grid !important;
  grid-template-columns:minmax(240px, 1.1fr) minmax(320px, 1fr) minmax(170px, .45fr) auto !important;
  gap:14px !important;
  align-items:end !important;
}

.reward-premium-form label,
.reward-premium-form .form-group,
.reward-premium-form .field,
.reward-premium-form > div{
  min-width:0;
}

.reward-premium-form select,
.reward-premium-form input,
.reward-premium-form button{
  box-sizing:border-box;
}

/* Spieler-Dropdown optisch an Item-Picker angleichen */
.reward-premium-form select{
  width:100%;
  min-height:56px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:16px;
  padding:0 44px 0 16px;
  color:#fff;
  background:
    radial-gradient(circle at 20% 0%, rgba(189,92,255,.12), transparent 35%),
    linear-gradient(180deg, rgba(23,27,49,.96), rgba(13,16,33,.96));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.06),
    0 12px 30px rgba(0,0,0,.14);
  outline:none;
  appearance:auto;
}

.reward-premium-form select:focus{
  border-color:rgba(189,92,255,.62);
  box-shadow:
    0 0 0 4px rgba(189,92,255,.10),
    0 18px 38px rgba(0,0,0,.22);
}

/* Mengenfeld darf nie in den Senden-Button laufen */
.reward-amount-stepper{
  width:100%;
  min-width:170px;
  grid-template-columns:44px minmax(64px, 1fr) 44px;
}

.reward-amount-stepper input{
  min-width:0;
  width:100%;
  height:56px;
  border-radius:16px;
}

.reward-step-btn{
  height:56px;
  min-width:44px;
  flex:0 0 auto;
}

.reward-premium-form button[type="submit"],
.reward-premium-form .btn-primary,
.reward-premium-form .reward-submit{
  min-height:56px;
  white-space:nowrap;
  align-self:end;
}

/* Hinweisbox immer über volle Breite */
.reward-premium-form .hint,
.reward-premium-form .notice,
.reward-premium-form .help,
.reward-premium-form [class*="hint"],
.reward-premium-form [class*="notice"]{
  grid-column:1 / -1;
}

/* Falls das Formular keine Wrapper-Klassen hat: häufige Reihenfolge erzwingen */
.reward-premium-form > *:has(select){
  grid-column:auto;
}

.reward-premium-form > *:has(.reward-premium-picker){
  grid-column:auto;
}

.reward-premium-form > *:has(.reward-amount-stepper){
  grid-column:auto;
}

@media (max-width: 1180px){
  .reward-premium-form{
    grid-template-columns:1fr 1fr !important;
  }

  .reward-premium-form button[type="submit"],
  .reward-premium-form .btn-primary,
  .reward-premium-form .reward-submit{
    width:100%;
  }
}

@media (max-width: 760px){
  .reward-premium-form{
    grid-template-columns:1fr !important;
  }

  .reward-amount-stepper{
    min-width:0;
  }
}


/* Phase 19: Premium Spieler-Picker statt nativem Windows-select */
.reward-native-hidden-select{
  position:absolute !important;
  opacity:0 !important;
  pointer-events:none !important;
  width:1px !important;
  height:1px !important;
}

.reward-premium-player-picker{
  position:relative;
  width:100%;
}

.reward-player-trigger{
  width:100%;
  min-height:56px;
  display:flex;
  align-items:center;
  gap:13px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:16px;
  padding:10px 14px;
  text-align:left;
  color:#fff;
  background:
    radial-gradient(circle at 20% 0%, rgba(189,92,255,.15), transparent 35%),
    linear-gradient(180deg, rgba(23,27,49,.96), rgba(13,16,33,.96));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.06),
    0 12px 30px rgba(0,0,0,.18);
  cursor:pointer;
  transition:.18s ease;
}

.reward-player-trigger:hover,
.reward-premium-player-picker.open .reward-player-trigger{
  border-color:rgba(189,92,255,.58);
  box-shadow:
    0 0 0 4px rgba(189,92,255,.10),
    0 18px 38px rgba(0,0,0,.28);
}

.reward-player-avatar{
  width:38px;
  height:38px;
  display:grid;
  place-items:center;
  border-radius:13px;
  background:
    radial-gradient(circle at 35% 25%, rgba(255,255,255,.18), transparent 38%),
    linear-gradient(135deg, rgba(155,78,255,.9), rgba(50,90,255,.5));
  font-size:18px;
  flex:0 0 auto;
}

.reward-player-text{
  min-width:0;
  flex:1;
}

.reward-player-text b{
  display:block;
  font-size:14px;
}

.reward-player-text small{
  display:block;
  margin-top:3px;
  color:rgba(255,255,255,.58);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.reward-player-popover{
  position:fixed;
  z-index:999999;
  padding:14px;
  border:1px solid rgba(189,92,255,.35);
  border-radius:20px;
  background:
    radial-gradient(circle at 18% 0%, rgba(189,92,255,.28), transparent 34%),
    radial-gradient(circle at 85% 15%, rgba(63,121,255,.13), transparent 33%),
    linear-gradient(180deg, rgba(15,18,39,.98), rgba(8,10,24,.98));
  box-shadow:
    0 28px 70px rgba(0,0,0,.55),
    0 0 0 1px rgba(255,255,255,.04) inset;
  animation:rewardPopoverIn .14s ease-out;
}

.reward-player-list{
  display:grid;
  gap:7px;
  max-height:300px;
  overflow:auto;
  margin-top:12px;
  padding-right:4px;
  scrollbar-width:thin;
  scrollbar-color:rgba(189,92,255,.75) rgba(255,255,255,.06);
}

.reward-player-list::-webkit-scrollbar{
  width:8px;
}

.reward-player-list::-webkit-scrollbar-track{
  background:rgba(255,255,255,.05);
  border-radius:999px;
}

.reward-player-list::-webkit-scrollbar-thumb{
  background:linear-gradient(180deg, rgba(189,92,255,.95), rgba(110,75,255,.8));
  border-radius:999px;
}

.reward-player-option{
  width:100%;
  display:flex;
  align-items:center;
  gap:12px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:15px;
  padding:11px;
  color:#fff;
  background:rgba(255,255,255,.045);
  cursor:pointer;
  text-align:left;
  transition:.14s ease;
}

.reward-player-option:hover,
.reward-player-option.active{
  border-color:rgba(189,92,255,.52);
  background:rgba(189,92,255,.13);
  transform:translateY(-1px);
}

.reward-player-option.selected{
  border-color:rgba(64,255,170,.55);
  background:linear-gradient(90deg, rgba(64,255,170,.12), rgba(189,92,255,.13));
}

.reward-player-status{
  width:34px;
  height:34px;
  display:grid;
  place-items:center;
  border-radius:12px;
  background:rgba(255,255,255,.07);
  flex:0 0 auto;
}

.reward-player-main{
  min-width:0;
  flex:1;
}

.reward-player-main b{
  display:block;
  font-size:13px;
}

.reward-player-main small{
  display:block;
  margin-top:3px;
  color:rgba(255,255,255,.58);
  font-size:11px;
}


/* Picker Kategorie-Fix: Tabs nicht mehr rechts abschneiden */
.reward-picker-popover{
  box-sizing:border-box;
  overflow:hidden;
}

.reward-picker-tabs{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  overflow:visible !important;
  max-width:100%;
  padding:12px 0 10px;
}

.reward-picker-tabs button{
  flex:0 0 auto;
  max-width:100%;
  white-space:nowrap;
}

/* Bei schmalem Popover bleiben Kategorien sauber innerhalb der Box */
@media (max-width: 720px){
  .reward-picker-tabs{
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }

  .reward-picker-tabs button{
    width:100%;
    min-width:0;
    overflow:hidden;
    text-overflow:ellipsis;
  }
}

/* Liste bekommt sauberen Abstand zur Scrollbar */
.reward-picker-list{
  padding-right:10px;
  box-sizing:border-box;
}