/* Maxima VPN: опция «Личный IP» (mx/static-ip.js). Цвета — из палитры кабинета (тёмная тема, акцент лаймовый). */

/* переключатель в калькуляторе тарифа — классы кабинета; здесь только курсор */
[data-mx-ip-row] { cursor: pointer; -webkit-tap-highlight-color: transparent; }
[data-mx-ip-row] [role="switch"]:focus-visible { outline: 2px solid rgb(var(--color-accent-400, 213, 255, 114)); outline-offset: 2px; }

/* панель на главной */
[data-mx-ip-home] { cursor: pointer; }
html[data-mx-ip-open] { overflow: hidden; }
[data-mx-ip-sheet] { position: fixed; inset: 0; z-index: 60; display: flex; align-items: center; justify-content: center; padding: 16px; }
[data-mx-ip-sheet] .mx-ip-backdrop { position: absolute; inset: 0; background: rgba(0, 0, 0, .6); }
[data-mx-ip-sheet] .mx-ip-panel {
  position: relative; width: 100%; max-width: 440px; max-height: calc(100dvh - 32px); overflow: auto; border-radius: 24px;
  padding: 28px 24px 24px; background: #15181d; border: 1px solid rgba(255, 255, 255, .08); color: #c9ced6; font-size: 15px; line-height: 1.5;
}
[data-mx-ip-sheet] h2 { margin: 0 32px 12px 0; color: #f1f3f5; font-size: 20px; font-weight: 600; }
[data-mx-ip-sheet] p { margin: 0 0 12px; }
[data-mx-ip-sheet] .mx-ip-note { color: #8a919c; font-size: 14px; }
[data-mx-ip-sheet] .mx-ip-warn { color: #f5c76b; }
[data-mx-ip-sheet] .mx-ip-msg { margin-top: 14px; color: #f1f3f5; }
[data-mx-ip-sheet] .mx-ip-ip { margin: 4px 0 10px; color: #ccff00; font-size: 26px; font-weight: 700; font-variant-numeric: tabular-nums; letter-spacing: .01em; }
[data-mx-ip-sheet] .mx-ip-btn { display: block; text-align: center; }
[data-mx-ip-sheet] .mx-ip-close {
  position: absolute; top: 14px; right: 14px; width: 36px; height: 36px; border-radius: 50%; font-size: 24px; line-height: 1;
  color: #8a919c; background: rgba(255, 255, 255, .04);
}
[data-mx-ip-sheet] .mx-ip-close:hover { color: #f1f3f5; }
[data-mx-ip-sheet] .mx-ip-form { margin-top: 18px; padding-top: 16px; border-top: 1px solid rgba(255, 255, 255, .07); }
[data-mx-ip-sheet] .mx-ip-form label { display: block; margin-bottom: 8px; color: #8a919c; font-size: 14px; }
[data-mx-ip-sheet] .mx-ip-inp { display: flex; gap: 8px; }
[data-mx-ip-sheet] .mx-ip-inp input {
  flex: 1; min-width: 0; height: 44px; padding: 0 14px; border-radius: 12px; color: #f1f3f5; font-size: 16px;
  background: rgba(255, 255, 255, .04); border: 1px solid rgba(255, 255, 255, .1);
}
[data-mx-ip-sheet] .mx-ip-inp input:focus { outline: none; border-color: #ccff00; }
[data-mx-ip-sheet] .mx-ip-inp button { flex: none; height: 44px; padding: 0 16px; border-radius: 12px; }
[data-mx-ip-sheet] button:disabled { opacity: .5; cursor: default; }
@media (max-width: 480px) {
  [data-mx-ip-sheet] { align-items: flex-end; padding: 0; }
  [data-mx-ip-sheet] .mx-ip-panel { max-width: none; border-radius: 24px 24px 0 0; padding-bottom: calc(24px + env(safe-area-inset-bottom)); }
}

/* админка: выбор свободного адреса в карточке пользователя */
[data-mx-ip-admin] [data-mx-ip-pick] {
  height: 34px; padding: 0 32px 0 12px; border-radius: 10px; color: #f1f3f5; font-size: 14px; font-variant-numeric: tabular-nums;
  background: rgba(255, 255, 255, .04) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%238a919c' stroke-width='2'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right 10px center;
  border: 1px solid rgba(255, 255, 255, .1); appearance: none; -webkit-appearance: none;
}
[data-mx-ip-admin] [data-mx-ip-pick]:focus { outline: none; border-color: rgb(var(--color-accent-400, 213, 255, 114)); }
