/* nick.css — 5.4: окно «Ник на ферме» (nick.js) */

#nick-modal{
  position: fixed;
  inset: 0;
  z-index: var(--z-modal-overlay);
  display: grid;
  place-items: center;
  padding: 16px;
  padding-top: calc(16px + var(--pf-safe-top));
  padding-bottom: calc(16px + var(--pf-safe-bottom));
}

/* Backdrop */
#nick-modal .pf-modal__backdrop{
  position:absolute;
  inset:0;
  background: var(--modal-overlay-bg);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

/* Dialog */
#nick-modal .pf-modal__dialog{
  position: relative;
  z-index: var(--z-modal);
  width: min(92vw, 450px);
  border-radius: 20px;
  overflow: hidden;

  background: var(--profile-card-bg);
  border: 1px solid var(--profile-card-border);
  box-shadow: 0 20px 50px rgba(0,0,0,.6);
  outline: 1px solid rgba(255,255,255,.05);
}

/* Header */
#nick-modal .pfm-head{
  position: relative;
  display:flex;
  align-items:center;
  justify-content:center;
  padding: 16px 14px;
  border-bottom: 1px solid var(--profile-divider);
}

#nick-modal .pfm-title{
  margin: 0;
  font-size: 16px;
  font-weight: 900;
  letter-spacing: .2px;
  color: var(--text-primary);
  text-align:center;
}

/* Close */
#nick-modal .pf-modal__close{
  position:absolute;
  right: 12px;
  appearance:none;
  border: 1px solid var(--border-subtle);
  background: var(--surface-2);
  color: var(--text-primary);

  width: 32px;
  height: 32px;
  border-radius: 10px;

  display:grid;
  place-items:center;
  cursor:pointer;

  transition: transform .12s ease, filter .15s ease, background .15s ease;
}
#nick-modal .pf-modal__close:active{ transform: scale(.92); }

/* Body */
#nick-modal .pfm-body{
  padding: 18px 14px;
  display:grid;
  grid-template-columns: minmax(0, 1fr); /* иначе поле ввода распирает строку и «Активировать» вылезает за окно */
  gap: 12px;
}

/* Row: input + button */
#nick-modal .pfm-row{
  display:flex;
  align-items: stretch;
  gap: 10px;
}

/* Input */
#nick-modal .pfm-input{
  flex: 1 1 auto;
  min-width: 0;

  height: 44px;
  border-radius: 12px;
  padding: 0 14px;

  color: var(--text-primary);
  background: var(--surface-1);
  border: 1px solid var(--border-subtle);
  box-shadow: inset 0 1px 2px rgba(0,0,0,.18);

  outline:none;
  font-size: 14px;
  font-weight: 700;

  transition: border-color .18s ease, background .18s ease, box-shadow .18s ease;
}

#nick-modal .pfm-input:focus{
  border-color: var(--accent-blue);
  background: rgba(255,255,255,.08);
  box-shadow:
    inset 0 1px 2px rgba(0,0,0,.18),
    0 0 0 3px rgba(91,168,255,.18);
}

#nick-modal .pfm-input::placeholder{
  text-transform:none;
  font-weight: 600;
  color: rgba(255,255,255,.35);
}

/* Button */
#nick-modal .pfm-btn{
  flex: 0 0 auto;

  height: 44px;
  padding: 0 14px;
  border-radius: 12px;

  border: 1px solid rgba(255,255,255,.14);
  background: var(--button-active);
  color: var(--text-on-light);

  font-weight: 900;
  font-size: 13px;
  white-space: nowrap;

  /* главное: ограничиваем ширину кнопки */
  min-width: 118px;
  max-width: 150px;

  box-shadow: 0 8px 18px rgba(0,0,0,.22);
  cursor:pointer;

  transition: transform .12s ease, filter .15s ease, background .15s ease;
}

@media (hover: hover) and (pointer: fine){
  #nick-modal .pfm-btn:hover:not(:disabled){
    background: var(--button-hover);
    filter: brightness(1.02);
  }
}

#nick-modal .pfm-btn:active:not(:disabled){
  transform: translateY(1px) scale(.99);
}

#nick-modal .pfm-btn:disabled{
  background: var(--button-disabled);
  color: var(--text-secondary);
  opacity: .85;
  cursor:not-allowed;
  filter: none;
  box-shadow: none;
}

/* Hint */
#nick-modal .pfm-hint{
  font-size: 12px;
  text-align:center;
  color: var(--text-secondary);
  opacity: .9;
}


/* 5.4: окно «Ник на ферме» (nick.js) — как окно промокода, плюс счётчик, правила, цена */
#nick-modal[hidden]{ display: none; }
#nick-modal .nk-field{ position: relative; display: flex; }
#nick-modal .nk-field .pfm-input{ padding-right: 54px; font-size: 16px; } /* 16px — iPhone не приближает поле */
#nick-modal .nk-cnt{ position: absolute; right: 12px; top: 50%; transform: translateY(-50%); font-size: 12px; font-weight: 800; color: var(--text-secondary); }
#nick-modal .nk-cnt.is-bad{ color: #ff7a7a; }
#nick-modal .nk-rules{ margin: -4px 2px 0; font-size: 12px; line-height: 1.35; color: var(--text-secondary); }
#nick-modal .nk-review{ padding: 9px 11px; border-radius: 12px; font-size: 12.5px; font-weight: 700; color: #ffd28a; background: rgba(255,170,60,.12); border: 1px solid rgba(255,170,60,.35); }
#nick-modal .nk-price{ display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px 10px; padding: 10px 12px; border-radius: 12px; background: var(--surface-1); border: 1px solid var(--border-subtle); font-size: 13px; }
#nick-modal .nk-price b{ display: inline-flex; align-items: center; gap: 4px; }
#nick-modal .nk-price img{ width: 16px; height: 16px; vertical-align: -3px; }
#nick-modal .nk-rw{ display: inline-flex; align-items: center; gap: 6px; font-size: 12px; color: var(--text-secondary); }
#nick-modal .nk-have{ font-size: 12px; color: var(--text-secondary); }
#nick-modal .nk-have.is-low{ color: #ff7a7a; }
#nick-modal .nk-err{ margin: 0; font-size: 12.5px; font-weight: 700; color: #ff7a7a; text-align: center; }
#nick-modal .nk-go{ width: 100%; max-width: none; display: inline-flex; align-items: center; justify-content: center; gap: 5px; }
#nick-modal .nk-go img{ width: 16px; height: 16px; }
/* карандаш у имени в Настройках */
.st-nick-edit{ margin-left: 6px; width: 28px; height: 28px; border-radius: 9px; border: 1px solid var(--border-subtle); background: var(--surface-2); font-size: 13px; line-height: 1; display: inline-grid; place-items: center; cursor: pointer; flex: none; }
.st-me .st-me__txt{ flex-direction: row; align-items: center; gap: 0; } /* имя и ✏️ в одну строку (settings.css ставит столбиком) */
.st-me .st-me__txt #st-name{ min-width: 0; }