/* ============================================================
   Auth & Service Popups — premiumbox JsWindow (.standart_window)
   Covers login (.js_window_login) and register (.js_window_join)
   modals plus generic plugin windows (error/warning/update).
   ============================================================ */

/* ── Overlay ─────────────────────────────────────────────────── */
.standart_shadow {
  position: fixed;
  inset: 0;
  z-index: 10000;
  background: rgba(5, 8, 22, 0.55);
  backdrop-filter: blur(2px);
  -webkit-backdrop-filter: blur(2px);
  animation: it-pop-fade var(--transition, 0.18s ease);
}

/* ── Window shell ────────────────────────────────────────────── */
.standart_window {
  position: fixed;
  z-index: 10001;
  width: 420px;
  max-width: calc(100vw - 32px);
  /* top/left are set inline by JsWindow (centred); we only style the box */
  animation: it-pop-in 0.22s cubic-bezier(0.16, 1, 0.3, 1);
}

.standart_windowins {
  height: 100%;
}

.standart_window_ins {
  background: var(--color-bg-light, #fff);
  border: 1px solid var(--color-border-light, rgba(0, 0, 0, 0.08));
  border-radius: var(--radius-2xl, 28px);
  box-shadow: var(--shadow-modal, 0 8px 48px rgba(0, 0, 0, 0.45));
  overflow: hidden;
}

/* ── Title bar ───────────────────────────────────────────────── */
.standart_window_title {
  position: relative;
  display: flex;
  align-items: center;
  padding: 24px 28px 0;
}

.standart_window_title_ins {
  font-family: 'Inter Tight', 'Inter', sans-serif;
  font-size: var(--fs-h4, 28px);
  font-weight: var(--fw-semi, 600);
  line-height: var(--lh-h4, 1.357);
  letter-spacing: var(--ls-tight, -0.01em);
  color: var(--color-text-primary, #050816);
}

/* Close button (empty div → X via pseudo-element) */
.standart_window_close {
  position: absolute;
  top: 18px;
  right: 18px;
  width: 36px;
  height: 36px;
  border-radius: var(--radius-full, 9999px);
  background: var(--color-bg-section, #f6f7fb);
  cursor: pointer;
  transition: background var(--transition, 0.18s ease);
}

.standart_window_close::before,
.standart_window_close::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 15px;
  height: 2px;
  background: var(--color-text-primary, #050816);
  border-radius: 2px;
}

.standart_window_close::before { transform: translate(-50%, -50%) rotate(45deg); }
.standart_window_close::after  { transform: translate(-50%, -50%) rotate(-45deg); }
.standart_window_close:hover {
  background: var(--color-accent, #caff43);
}

/* Accent strip variants for non-auth plugin windows */
.standart_window.error_window   .standart_window_title_ins { color: #d23c3c; }
.standart_window.warning_window .standart_window_title_ins { color: #c98a00; }

/* ── Content ─────────────────────────────────────────────────── */
.standart_window_content {
  padding: 16px 28px 28px;
}

.standart_window_content_ins {
  font-size: var(--fs-base, 16px);
  line-height: var(--lh-normal, 1.5);
  color: var(--color-text-primary, #050816);
}

.standart_window_clear { clear: both; }

/* ── Form fields (shared login/register, rb_ prefix) ─────────── */
.standart_window .form_field_line {
  margin-bottom: 16px;
}

.standart_window .form_field_label {
  margin-bottom: 6px;
}

.standart_window .form_field_label_ins {
  font-size: var(--fs-sm, 14px);
  font-weight: var(--fw-medium, 500);
  color: var(--color-text-medium, #3d4d5c);
}

.standart_window .req { color: #d23c3c; }

.standart_window .form_field_ins input[type="text"],
.standart_window .form_field_ins input[type="password"],
.standart_window .form_field_ins input[type="email"],
.standart_window .form_field_ins textarea,
.standart_window .form_field_ins select {
  width: 100%;
  box-sizing: border-box;
  padding: 12px 16px;
  font-family: inherit;
  font-size: var(--fs-base, 16px);
  line-height: 1.4;
  color: var(--color-text-primary, #050816);
  background: var(--color-bg-section, #f6f7fb);
  border: 1px solid transparent;
  border-radius: var(--radius-md, 8px);
  outline: none;
  transition: border-color var(--transition, 0.18s ease),
              background var(--transition, 0.18s ease);
}

.standart_window .form_field_ins input:focus,
.standart_window .form_field_ins textarea:focus,
.standart_window .form_field_ins select:focus {
  background: #fff;
  border-color: var(--color-accent, #caff43);
}

.standart_window .form_field_ins input::placeholder {
  color: var(--color-text-muted, #8899a6);
}

/* Inline field errors */
.standart_window .form_field_errors {
  font-size: var(--fs-xs, 12px);
  color: #d23c3c;
}
.standart_window .form_field_errors:empty,
.standart_window .form_field_errors_ins:empty { display: none; }
.standart_window .form_field_errors_ins:not(:empty) { margin-top: 6px; }

/* ── Submit button ───────────────────────────────────────────── */
.standart_window .rb_submit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  padding: 13px 24px;
  font-family: inherit;
  font-size: var(--fs-base, 16px);
  font-weight: var(--fw-semi, 600);
  line-height: 1.5;
  color: var(--color-accent-text, #0f0f0f);
  background: var(--color-accent, #caff43);
  border: none;
  border-radius: var(--radius-md, 8px);
  cursor: pointer;
  transition: background var(--transition, 0.18s ease),
              box-shadow var(--transition, 0.18s ease);
}

.standart_window .rb_submit:hover {
  background: var(--color-accent-hover, #b5f020);
  box-shadow: var(--shadow-btn, 0 2px 14px rgba(202, 255, 67, 0.3));
}

/* ── Secondary rows (links + submit wrapper) ─────────────────── */
.standart_window .rb_line { margin-top: 16px; }

/* The field wrappers also carry .rb_line — keep their own spacing */
.standart_window .form_field_line.rb_line { margin-top: 0; }

.standart_window .rb_line a {
  color: var(--color-text-medium, #3d4d5c);
  text-decoration: none;
  font-size: var(--fs-sm, 14px);
  font-weight: var(--fw-medium, 500);
  transition: color var(--transition, 0.18s ease);
}

.standart_window .rb_line a:hover { color: var(--color-text-primary, #050816); }

/* ── Register: agreement checkbox row ────────────────────────── */
.standart_window .reg_line {
  margin-top: 14px;
  font-size: var(--fs-sm, 14px);
  line-height: 1.45;
  color: var(--color-text-medium, #3d4d5c);
}

.standart_window .reg_line label {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  cursor: pointer;
}

.standart_window .reg_line input[type="checkbox"] {
  width: 18px;
  height: 18px;
  margin: 1px 0 0;
  accent-color: var(--color-accent, #caff43);
  flex-shrink: 0;
}

.standart_window .reg_line a {
  color: var(--color-text-primary, #050816);
  text-decoration: underline;
}

/* ── Result / status messages ────────────────────────────────── */
.standart_window .resultgo:empty { display: none; }

.standart_window .resultfalse,
.standart_window .resulttrue {
  margin-top: 14px;
  padding: 12px 16px;
  font-size: var(--fs-sm, 14px);
  line-height: 1.45;
  border-radius: var(--radius-md, 8px);
}

.standart_window .resultfalse {
  color: #b22020;
  background: rgba(210, 60, 60, 0.10);
}

.standart_window .resulttrue {
  color: #1f7a3d;
  background: rgba(31, 122, 61, 0.10);
}

/* ── Animations ──────────────────────────────────────────────── */
@keyframes it-pop-fade {
  from { opacity: 0; }
  to   { opacity: 1; }
}

@keyframes it-pop-in {
  from { opacity: 0; transform: translateY(12px) scale(0.98); }
  to   { opacity: 1; transform: translateY(0) scale(1); }
}

/* ── Mobile ──────────────────────────────────────────────────── */
@media (max-width: 480px) {
  .standart_window {
    width: calc(100vw - 24px);
  }
  .standart_window_title {
    padding: 20px 20px 0;
  }
  .standart_window_title_ins {
    font-size: var(--fs-2xl, 24px);
  }
  .standart_window_content {
    padding: 14px 20px 22px;
  }
  .standart_window_close {
    top: 14px;
    right: 14px;
  }
}

/* ============================================================
   Captcha (.captcha_body) — math captcha used inside forms
   img [sign] img = [input] [reload]
   ============================================================ */
.captcha_div {
  margin: 4px 0 16px;
}

.captcha_title {
  margin-bottom: 6px;
  font-size: var(--fs-sm, 14px);
  font-weight: var(--fw-medium, 500);
  color: var(--color-text-medium, #3d4d5c);
}

.captcha_body {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  padding: 10px 12px;
  background: var(--color-bg-section, #f6f7fb);
  border: 1px solid var(--color-border-light, rgba(0, 0, 0, 0.08));
  border-radius: var(--radius-md, 8px);
}

.captcha_divimg {
  display: flex;
  align-items: center;
}

.captcha_divimg img {
  display: block;
  height: 38px;
  width: auto;
  border-radius: var(--radius-sm, 6px);
  background: #fff;
}

.captcha_divznak,
.captcha_sym {
  font-size: var(--fs-lg, 20px);
  font-weight: var(--fw-semi, 600);
  line-height: 1;
  color: var(--color-text-primary, #050816);
}

.captcha_body .captcha_divpole,
.captcha_body input.captcha_value {
  width: 72px;
  box-sizing: border-box;
  padding: 9px 12px;
  font-family: inherit;
  font-size: var(--fs-base, 16px);
  text-align: center;
  color: var(--color-text-primary, #050816);
  background: #fff;
  border: 1px solid var(--color-border-medium, rgba(0, 0, 0, 0.12));
  border-radius: var(--radius-sm, 6px);
  outline: none;
  transition: border-color var(--transition, 0.18s ease);
}

.captcha_body input.captcha_value:focus {
  border-color: var(--color-accent, #caff43);
}

/* Reload button (empty <a> → refresh icon) */
.captcha_reload {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  margin-left: auto;
  border-radius: var(--radius-sm, 6px);
  background: #fff no-repeat center / 20px 20px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23050816' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 12a9 9 0 1 1-2.64-6.36'/%3E%3Cpolyline points='21 3 21 8 16 8'/%3E%3C/svg%3E");
  border: 1px solid var(--color-border-medium, rgba(0, 0, 0, 0.12));
  cursor: pointer;
  transition: background-color var(--transition, 0.18s ease),
              border-color var(--transition, 0.18s ease);
}

.captcha_reload:hover {
  background-color: var(--color-accent, #caff43);
  border-color: var(--color-accent, #caff43);
}

.captcha_body .clear { display: none; }

/* ============================================================
   Account form pages — rendered standalone via page.php inside
   .entry-content:
     [lostpass_page] → .lp_div_wrap
     [register_page] → .reg_div_wrap
   ============================================================ */
.lp_div_wrap,
.reg_div_wrap {
  max-width: 460px;
  margin: 8px auto;
  background: var(--color-bg-light, #fff);
  border: 1px solid var(--color-border-light, rgba(0, 0, 0, 0.08));
  border-radius: var(--radius-2xl, 28px);
  box-shadow: var(--shadow-card, 0 4px 32px rgba(0, 0, 0, 0.18));
  overflow: hidden;
}

.lp_div_title,
.reg_div_title {
  padding: 28px 32px 0;
}

.lp_div_title_ins,
.reg_div_title_ins {
  font-family: 'Inter Tight', 'Inter', sans-serif;
  font-size: var(--fs-h4, 28px);
  font-weight: var(--fw-semi, 600);
  line-height: var(--lh-h4, 1.357);
  letter-spacing: var(--ls-tight, -0.01em);
  color: var(--color-text-primary, #050816);
}

.lp_div_ins,
.reg_div_ins {
  padding: 20px 32px 32px;
  font-size: var(--fs-base, 16px);
  line-height: var(--lh-normal, 1.5);
  color: var(--color-text-primary, #050816);
}

/* Form fields (lp_ / reg_ prefixes) — mirror the popup styling */
.lp_div_wrap .form_field_line,
.reg_div_wrap .form_field_line { margin-bottom: 16px; }

.lp_div_wrap .form_field_label,
.reg_div_wrap .form_field_label { margin-bottom: 6px; }

.lp_div_wrap .form_field_label_ins,
.reg_div_wrap .form_field_label_ins {
  font-size: var(--fs-sm, 14px);
  font-weight: var(--fw-medium, 500);
  color: var(--color-text-medium, #3d4d5c);
}

.lp_div_wrap .req,
.reg_div_wrap .req { color: #d23c3c; }

.lp_div_wrap .form_field_ins input[type="text"],
.lp_div_wrap .form_field_ins input[type="password"],
.lp_div_wrap .form_field_ins input[type="email"],
.reg_div_wrap .form_field_ins input[type="text"],
.reg_div_wrap .form_field_ins input[type="password"],
.reg_div_wrap .form_field_ins input[type="email"] {
  width: 100%;
  box-sizing: border-box;
  padding: 12px 16px;
  font-family: inherit;
  font-size: var(--fs-base, 16px);
  line-height: 1.4;
  color: var(--color-text-primary, #050816);
  background: var(--color-bg-section, #f6f7fb);
  border: 1px solid transparent;
  border-radius: var(--radius-md, 8px);
  outline: none;
  transition: border-color var(--transition, 0.18s ease),
              background var(--transition, 0.18s ease);
}

.lp_div_wrap .form_field_ins input:focus,
.reg_div_wrap .form_field_ins input:focus {
  background: #fff;
  border-color: var(--color-accent, #caff43);
}

.lp_div_wrap .form_field_errors,
.reg_div_wrap .form_field_errors {
  font-size: var(--fs-xs, 12px);
  color: #d23c3c;
}
.lp_div_wrap .form_field_errors:empty,
.lp_div_wrap .form_field_errors_ins:empty,
.reg_div_wrap .form_field_errors:empty,
.reg_div_wrap .form_field_errors_ins:empty { display: none; }
.lp_div_wrap .form_field_errors_ins:not(:empty),
.reg_div_wrap .form_field_errors_ins:not(:empty) { margin-top: 6px; }

/* Submit button */
.lp_div_wrap .lp_line.has_submit { margin-top: 20px; }

.lp_div_wrap input[type="submit"],
.reg_div_wrap input[type="submit"] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  padding: 13px 24px;
  font-family: inherit;
  font-size: var(--fs-base, 16px);
  font-weight: var(--fw-semi, 600);
  line-height: 1.5;
  color: var(--color-accent-text, #0f0f0f);
  background: var(--color-accent, #caff43);
  border: none;
  border-radius: var(--radius-md, 8px);
  cursor: pointer;
  transition: background var(--transition, 0.18s ease),
              box-shadow var(--transition, 0.18s ease);
}

.lp_div_wrap input[type="submit"]:hover,
.reg_div_wrap input[type="submit"]:hover {
  background: var(--color-accent-hover, #b5f020);
  box-shadow: var(--shadow-btn, 0 2px 14px rgba(202, 255, 67, 0.3));
}

/* ── Register-specific: agreement checkbox + submit row ──────── */
/* Service rows (agreement / submit) carry only .reg_line, fields
   carry .form_field_line.reg_line — separate them for spacing */
.reg_div_wrap .reg_line:not(.form_field_line) { margin-top: 16px; }

.reg_div_wrap label:has(> input[type="checkbox"]) {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  font-size: var(--fs-sm, 14px);
  line-height: 1.45;
  color: var(--color-text-medium, #3d4d5c);
  cursor: pointer;
}

.reg_div_wrap input[type="checkbox"] {
  width: 18px;
  height: 18px;
  margin: 1px 0 0;
  accent-color: var(--color-accent, #caff43);
  flex-shrink: 0;
}

.reg_div_wrap .reg_line_subm_right {
  margin-top: 14px;
  text-align: center;
}

.reg_div_wrap .clear { display: none; }

.lp_div_wrap a,
.reg_div_wrap a {
  color: var(--color-text-medium, #3d4d5c);
  text-decoration: none;
  font-weight: var(--fw-medium, 500);
  transition: color var(--transition, 0.18s ease);
}

.lp_div_wrap a:hover,
.reg_div_wrap a:hover { color: var(--color-text-primary, #050816); }

/* tos link inside the agreement label stays underlined */
.reg_div_wrap label:has(> input[type="checkbox"]) a {
  color: var(--color-text-primary, #050816);
  text-decoration: underline;
}

/* Status messages on the page */
.lp_div_wrap .resultgo:empty,
.reg_div_wrap .resultgo:empty { display: none; }

.lp_div_wrap .resultfalse,
.lp_div_wrap .resulttrue,
.reg_div_wrap .resultfalse,
.reg_div_wrap .resulttrue {
  margin-top: 16px;
  padding: 12px 16px;
  font-size: var(--fs-sm, 14px);
  line-height: 1.45;
  border-radius: var(--radius-md, 8px);
}

.lp_div_wrap .resultfalse,
.reg_div_wrap .resultfalse {
  color: #b22020;
  background: rgba(210, 60, 60, 0.10);
}

.lp_div_wrap .resulttrue,
.reg_div_wrap .resulttrue {
  color: #1f7a3d;
  background: rgba(31, 122, 61, 0.10);
}

@media (max-width: 480px) {
  .lp_div_title,
  .reg_div_title { padding: 22px 22px 0; }
  .lp_div_title_ins,
  .reg_div_title_ins { font-size: var(--fs-2xl, 24px); }
  .lp_div_ins,
  .reg_div_ins { padding: 16px 22px 24px; }
}
