/* =====================================================
   BRRRR Deal Evaluator v2 — Style
   Sora (headings) + Inter (body)
===================================================== */
@import url('https://fonts.googleapis.com/css2?family=Sora:wght@300;400;600;700&family=Inter:wght@300;400;500;600&display=swap');

/* ── DARK ────────────────────────────────────────── */
#brrrr-app[data-theme="dark"] {
  --bg:           #0e1117;
  --surface:      #161b25;
  --surface-2:    #1c2334;
  --surface-3:    #222a3d;
  --border:       #2a3347;
  --border-lt:    #333d55;
  --accent:       #c9a84c;
  --accent-dim:   rgba(201,168,76,0.12);
  --accent-glow:  rgba(201,168,76,0.28);
  --green:        #27ae60;
  --green-bg:     rgba(39,174,96,0.11);
  --green-bdr:    rgba(39,174,96,0.28);
  --red:          #e74c3c;
  --red-bg:       rgba(231,76,60,0.10);
  --text:         #e6eaf4;
  --text-muted:   #8492aa;
  --text-dim:     #4e5c75;
  --input-bg:     #1a2030;
  --input-bdr:    #2e3a50;
  --input-color:  #e6eaf4;
  --label-color:  #8492aa;
  --def-bg:       rgba(39,174,96,0.06);
  --def-bdr:      rgba(39,174,96,0.20);
  --tab-bg:       #161b25;
  --tab-active:   #1c2334;
  --card-bg:      #161b25;
}

/* ── LIGHT ───────────────────────────────────────── */
#brrrr-app[data-theme="light"] {
  --bg:           #f4f6fb;
  --surface:      #ffffff;
  --surface-2:    #f0f2f8;
  --surface-3:    #e6eaf4;
  --border:       #d6dce8;
  --border-lt:    #c4ccd8;
  --accent:       #9a6f1a;
  --accent-dim:   rgba(154,111,26,0.10);
  --accent-glow:  rgba(154,111,26,0.22);
  --green:        #1a7a44;
  --green-bg:     rgba(26,122,68,0.08);
  --green-bdr:    rgba(26,122,68,0.22);
  --red:          #c0392b;
  --red-bg:       rgba(192,57,43,0.07);
  --text:         #1a1f2e;
  --text-muted:   #4a5568;
  --text-dim:     #9aa3b5;
  --input-bg:     #ffffff;
  --input-bdr:    #c4ccd8;
  --input-color:  #1a1f2e;
  --label-color:  #4a5568;
  --def-bg:       rgba(26,122,68,0.05);
  --def-bdr:      rgba(26,122,68,0.18);
  --tab-bg:       #ffffff;
  --tab-active:   #f0f2f8;
  --card-bg:      #ffffff;
}

/* ── BASE ────────────────────────────────────────── */
#brrrr-app {
  font-family: 'Inter', sans-serif;
  background: var(--bg);
  color: var(--text);
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 0 80px;
  -webkit-font-smoothing: antialiased;
  transition: background 0.25s, color 0.25s;
}

/* ── TOPBAR ──────────────────────────────────────── */
.brrrr-topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 24px;
  border-bottom: 1px solid var(--border);
}
.brrrr-topbar-brand {
  font-family: 'Sora', sans-serif;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--accent);
}
.brrrr-theme-btn {
  display: flex;
  align-items: center;
  gap: 8px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 100px;
  padding: 5px 12px 5px 10px;
  cursor: pointer;
  font-family: 'Inter', sans-serif;
  font-size: 12px;
  font-weight: 500;
  color: var(--text-muted);
  transition: all 0.2s;
}
.brrrr-theme-btn:hover { border-color: var(--accent); color: var(--text); }
#brrrr-app[data-theme="dark"]  .theme-label-light { display: none; }
#brrrr-app[data-theme="dark"]  .theme-label-dark  { display: inline; }
#brrrr-app[data-theme="light"] .theme-label-dark  { display: none; }
#brrrr-app[data-theme="light"] .theme-label-light { display: inline; }
.theme-track {
  width: 30px; height: 17px;
  background: var(--border);
  border-radius: 100px;
  position: relative;
  display: block;
  transition: background 0.2s;
}
#brrrr-app[data-theme="light"] .theme-track { background: var(--accent); }
.theme-thumb {
  position: absolute;
  top: 2px; left: 2px;
  width: 13px; height: 13px;
  background: #fff;
  border-radius: 50%;
  transition: transform 0.2s;
  box-shadow: 0 1px 3px rgba(0,0,0,0.25);
}
#brrrr-app[data-theme="light"] .theme-thumb { transform: translateX(13px); }

/* ── HERO ────────────────────────────────────────── */
.brrrr-hero { text-align: center; padding: 48px 32px 36px; }
.brrrr-hero-title {
  font-family: 'Sora', sans-serif;
  font-size: clamp(34px, 5vw, 52px);
  font-weight: 700;
  color: var(--text);
  margin: 0 0 10px;
  line-height: 1.1;
}
.brrrr-hero-sub {
  font-size: 13px;
  letter-spacing: 0.18em;
  color: var(--text-muted);
  text-transform: uppercase;
  margin: 0;
}

/* ── FORM SECTIONS ───────────────────────────────── */
.brrrr-section {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 22px 22px 18px;
  margin: 0 16px 14px;
  transition: background 0.25s, border-color 0.25s;
}
.brrrr-section-defaults { background: var(--def-bg); border-color: var(--def-bdr); }
.brrrr-section-header {
  font-family: 'Sora', sans-serif;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--text-muted);
  margin-bottom: 16px;
  display: flex;
  align-items: center;
  gap: 10px;
}
.brrrr-editable-tag {
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.12em;
  background: var(--green-bg);
  color: var(--green);
  border: 1px solid var(--green-bdr);
  border-radius: 100px;
  padding: 2px 9px;
}
.brrrr-defaults-note { font-size: 12px; color: var(--text-muted); font-style: italic; margin: -8px 0 14px; }

/* ── GRID ────────────────────────────────────────── */
.brrrr-grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.brrrr-grid-3 { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 14px; }
@media (max-width: 680px) { .brrrr-grid-2, .brrrr-grid-3 { grid-template-columns: 1fr; } }

/* ── INPUTS ──────────────────────────────────────── */
.brrrr-field { display: flex; flex-direction: column; gap: 5px; }
.brrrr-field label {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--label-color);
}
#brrrr-app input[type="text"],
#brrrr-app input[type="number"] {
  display: block;
  width: 100%;
  box-sizing: border-box;
  background: var(--input-bg) !important;
  color: var(--input-color) !important;
  border: 1px solid var(--input-bdr) !important;
  border-radius: 8px !important;
  font-family: 'Inter', sans-serif !important;
  font-size: 15px !important;
  font-weight: 400 !important;
  padding: 10px 13px !important;
  outline: none !important;
  box-shadow: none !important;
  transition: border-color 0.2s, box-shadow 0.2s, background 0.25s, color 0.25s !important;
  -moz-appearance: textfield !important;
  appearance: textfield !important;
}
#brrrr-app input[type="text"]::-webkit-inner-spin-button,
#brrrr-app input[type="number"]::-webkit-inner-spin-button,
#brrrr-app input[type="number"]::-webkit-outer-spin-button { -webkit-appearance: none !important; }
#brrrr-app input::placeholder { color: var(--text-dim) !important; opacity: 1 !important; }
#brrrr-app input:focus {
  border-color: var(--accent) !important;
  box-shadow: 0 0 0 3px var(--accent-dim) !important;
}
.brrrr-default-field input[type="number"] {
  color: var(--green) !important;
  border-color: var(--green-bdr) !important;
}
.brrrr-default-field input[type="number"]:focus {
  border-color: var(--green) !important;
  box-shadow: 0 0 0 3px var(--green-bg) !important;
}

/* ── SUBMIT ──────────────────────────────────────── */
.brrrr-submit-wrap { text-align: center; padding: 26px 16px 8px; }
#brrrr-submit-btn {
  background: linear-gradient(135deg, var(--accent), #e2c278);
  color: #0e1117;
  border: none;
  border-radius: 10px;
  font-family: 'Sora', sans-serif;
  font-size: 16px;
  font-weight: 700;
  padding: 14px 44px;
  cursor: pointer;
  transition: transform 0.18s, box-shadow 0.18s, opacity 0.2s;
  box-shadow: 0 4px 18px var(--accent-glow);
  display: inline-flex;
  align-items: center;
  gap: 10px;
}
#brrrr-submit-btn:hover { transform: translateY(-2px); box-shadow: 0 8px 28px var(--accent-glow); }
#brrrr-submit-btn:active { transform: translateY(0); }
#brrrr-submit-btn.loading { opacity: 0.65; pointer-events: none; }
.btn-arrow { font-size: 18px; transition: transform 0.18s; }
#brrrr-submit-btn:hover .btn-arrow { transform: translateX(4px); }
.brrrr-submit-note { font-size: 12px; color: var(--text-dim); margin-top: 10px; }

/* ── RESULTS HEADER ──────────────────────────────── */
.brrrr-results-header {
  display: flex;
  align-items: center;
  padding: 20px 20px 14px;
  gap: 12px;
  flex-wrap: wrap;
  border-bottom: 1px solid var(--border);
}
.brrrr-back {
  background: var(--surface);
  border: 1px solid var(--border-lt);
  color: var(--text-muted);
  font-family: 'Inter', sans-serif;
  font-size: 12px;
  font-weight: 500;
  padding: 7px 14px;
  border-radius: 7px;
  cursor: pointer;
  transition: all 0.2s;
  white-space: nowrap;
}
.brrrr-back:hover { border-color: var(--accent); color: var(--accent); }
.brrrr-prop-title {
  flex: 1;
  font-family: 'Sora', sans-serif;
  font-size: clamp(15px, 2.2vw, 20px);
  font-weight: 600;
  color: var(--text);
  text-align: center;
}

/* ── EXPORT BUTTONS ──────────────────────────────── */
.brrrr-export-wrap { display: flex; align-items: center; gap: 8px; }
.brrrr-export-label { font-size: 11px; color: var(--text-dim); font-weight: 600; text-transform: uppercase; letter-spacing: 0.08em; }
.brrrr-export-btn {
  background: var(--surface-2);
  border: 1px solid var(--border-lt);
  color: var(--text-muted);
  font-family: 'Sora', sans-serif;
  font-size: 12px;
  font-weight: 700;
  padding: 6px 14px;
  border-radius: 7px;
  cursor: pointer;
  transition: all 0.2s;
  letter-spacing: 0.04em;
}
.brrrr-export-btn:hover { background: var(--accent); border-color: var(--accent); color: #0e1117; }
.brrrr-export-btn.loading { opacity: 0.5; pointer-events: none; }

/* ── EXPORT STAMP (visible only during export) ───── */
.brrrr-export-stamp { display: none !important; }
.brrrr-exporting .brrrr-export-stamp {
  display: block !important;
  text-align: center;
  padding: 20px;
  border-bottom: 1px solid var(--border);
  margin-bottom: 10px;
}
.brrrr-export-stamp-title {
  font-family: 'Sora', sans-serif;
  font-size: 20px;
  font-weight: 700;
  color: var(--accent);
  margin-bottom: 4px;
}
.brrrr-export-stamp-addr { font-size: 14px; color: var(--text-muted); }

/* ── SUMMARY CARDS ───────────────────────────────── */
.brrrr-cards-row {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
  margin: 16px 16px 0;
}
@media (max-width: 680px) { .brrrr-cards-row { grid-template-columns: 1fr 1fr; } }
.brrrr-card {
  background: var(--card-bg);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 16px 14px;
  text-align: center;
  transition: all 0.2s;
}
.brrrr-card-label { font-size: 10px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: var(--text-dim); margin-bottom: 6px; }
.brrrr-card-value { font-family: 'Sora', sans-serif; font-size: 18px; font-weight: 700; color: var(--text); font-variant-numeric: tabular-nums; }

/* ── TABS ────────────────────────────────────────── */
.brrrr-tabs {
  display: flex;
  gap: 0;
  margin: 20px 16px 0;
  background: var(--surface-2);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 4px;
}
.brrrr-tab {
  flex: 1;
  background: transparent;
  border: none;
  border-radius: 7px;
  font-family: 'Sora', sans-serif;
  font-size: 14px;
  font-weight: 600;
  color: var(--text-muted);
  padding: 10px 20px;
  cursor: pointer;
  transition: all 0.2s;
}
.brrrr-tab:hover { color: var(--text); }
.brrrr-tab.active {
  background: var(--surface);
  color: var(--text);
  box-shadow: 0 1px 6px rgba(0,0,0,0.15);
}
.brrrr-tab-panel { display: none; visibility: visible; }
.brrrr-tab-panel.active { display: block; }

/* ── METRIC BANNER ───────────────────────────────── */
.brrrr-metric-banner {
  margin: 16px 16px 0;
  border-radius: 14px;
  padding: 30px;
  text-align: center;
  border: 1px solid var(--border);
  background: var(--surface);
  transition: all 0.3s;
}
.brrrr-metric-banner.is-green { background: var(--green-bg); border-color: var(--green-bdr); }
.brrrr-metric-banner.is-red   { background: var(--red-bg);   border-color: rgba(231,76,60,0.28); }
.brrrr-metric-label { font-size: 10px; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; color: var(--text-muted); margin-bottom: 8px; }
.brrrr-metric-value { font-family: 'Sora', sans-serif; font-size: clamp(44px, 8vw, 64px); font-weight: 700; line-height: 1; margin-bottom: 8px; }
.brrrr-metric-banner.is-green .brrrr-metric-value { color: var(--green); }
.brrrr-metric-banner.is-red   .brrrr-metric-value { color: var(--red); }
.brrrr-metric-sub { font-size: 13px; color: var(--text-muted); }

/* ── RESULTS GRID ────────────────────────────────── */
.brrrr-results-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  margin: 16px 16px 0;
  align-items: start;
}
@media (max-width: 860px) { .brrrr-results-grid { grid-template-columns: 1fr; } }
.brrrr-results-col { display: flex; flex-direction: column; gap: 16px; }

/* ── RESULT BLOCKS ───────────────────────────────── */
.brrrr-results-section {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 12px;
  overflow: hidden;
  transition: background 0.25s, border-color 0.25s;
}
.brrrr-rs-header {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 18px;
  border-bottom: 1px solid var(--border);
  background: var(--surface-2);
}
.brrrr-rs-num {
  font-family: 'Sora', sans-serif;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.06em;
  color: var(--accent);
  background: var(--accent-dim);
  border: 1px solid rgba(201,168,76,0.20);
  border-radius: 5px;
  padding: 3px 8px;
}
.exit-1-num { color: #818cf8; background: rgba(99,102,241,0.12); border-color: rgba(99,102,241,0.22); }
.exit-2-num { color: #f59e0b; background: rgba(245,158,11,0.10); border-color: rgba(245,158,11,0.22); }
.brrrr-rs-title { font-size: 13px; font-weight: 600; color: var(--text); }
.brrrr-exit-1 { border-color: rgba(99,102,241,0.20); }
.brrrr-exit-2 { border-color: rgba(245,158,11,0.20); }

/* ── TABLES ──────────────────────────────────────── */
.brrrr-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.tbl-sep { border-top: 1px solid var(--border); }
.brrrr-table th {
  font-size: 10px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase;
  color: var(--text-dim); padding: 9px 16px; text-align: right;
  border-bottom: 1px solid var(--border); background: var(--surface-2);
}
.brrrr-table th:first-child { text-align: left; }
.brrrr-table td { padding: 9px 16px; border-bottom: 1px solid var(--border); color: var(--text-muted); }
.brrrr-table td:last-child { text-align: right; font-variant-numeric: tabular-nums; font-weight: 500; color: var(--text); white-space: nowrap; }
.brrrr-table tr:last-child td { border-bottom: none; }
.brrrr-table tr:hover td { background: rgba(128,128,128,0.04); }
.row-sub td { padding-left: 28px; color: var(--text-dim) !important; font-size: 12px; }
.row-sub td:last-child { color: var(--text-muted) !important; }
.row-hl td { background: var(--surface-2) !important; font-weight: 600 !important; color: var(--text) !important; }
.row-total td { background: var(--surface-3) !important; font-weight: 700 !important; color: var(--accent) !important; }
.c-green { color: var(--green) !important; }
.c-red   { color: var(--red)   !important; }

/* ── PCT BLOCK ───────────────────────────────────── */
.brrrr-pct-block { padding: 20px 18px; text-align: center; border-top: 1px solid var(--border); }
.brrrr-pct-block.is-green { background: var(--green-bg); }
.brrrr-pct-block.is-red   { background: var(--red-bg); }
.brrrr-pct-label { font-size: 10px; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; color: var(--text-dim); margin-bottom: 2px; }
.brrrr-pct-formula { font-size: 11px; color: var(--text-dim); font-style: italic; margin-bottom: 10px; }
.brrrr-pct-val { font-family: 'Sora', sans-serif; font-size: 40px; font-weight: 700; line-height: 1; margin-bottom: 8px; }
.brrrr-pct-block.is-green .brrrr-pct-val { color: var(--green); }
.brrrr-pct-block.is-red   .brrrr-pct-val { color: var(--red); }
.brrrr-pct-verdict {
  display: inline-block;
  font-size: 12px; font-weight: 600;
  border-radius: 100px; padding: 4px 14px;
}
.brrrr-pct-block.is-green .brrrr-pct-verdict { background: var(--green-bg); color: var(--green); border: 1px solid var(--green-bdr); }
.brrrr-pct-block.is-red   .brrrr-pct-verdict { background: var(--red-bg);   color: var(--red);   border: 1px solid rgba(231,76,60,0.28); }

/* ── FOOTER ──────────────────────────────────────── */
.brrrr-results-footer { text-align: center; padding: 24px 24px 0; }
.brrrr-disclaimer { font-size: 11px; color: var(--text-dim); margin-top: 12px; font-style: italic; max-width: 520px; margin-left: auto; margin-right: auto; line-height: 1.6; }

/* ── ANIMATIONS ──────────────────────────────────── */
@keyframes brrrr-up { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }
#brrrr-results { animation: brrrr-up 0.35s ease both; }
.brrrr-metric-banner { animation: brrrr-up 0.35s ease both; }
.brrrr-results-section { animation: brrrr-up 0.4s ease both; }

/* ── SPINNER ─────────────────────────────────────── */
.brrrr-spinner { display: inline-block; width: 15px; height: 15px; border: 2px solid rgba(14,17,23,0.2); border-top-color: #0e1117; border-radius: 50%; animation: brrrr-spin 0.65s linear infinite; }
@keyframes brrrr-spin { to { transform: rotate(360deg); } }

/* ── EXPORT PRINT OVERRIDES ──────────────────────── */
@media print {
  .brrrr-topbar, .brrrr-results-header, .brrrr-tabs, .brrrr-results-footer { display: none !important; }
  .brrrr-tab-panel { display: block !important; }
  #brrrr-app { max-width: 100%; background: white; color: black; }
}

/* ═══════════════════════════════════════════════════
   CTA BARS
═══════════════════════════════════════════════════ */
.brrrr-cta-bar {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 16px;
  margin: 12px 16px 0;
  padding: 22px 28px;
  border-radius: 12px;
  border: 1px solid;
  text-align: center;
  animation: brrrr-up 0.35s ease both;
}
.brrrr-cta-green {
  background: var(--green-bg);
  border-color: var(--green-bdr);
}
.brrrr-cta-red {
  background: var(--red-bg);
  border-color: rgba(231,76,60,0.28);
}
.brrrr-cta-text {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  font-size: 16px;
  font-weight: 600;
  color: var(--text);
}
.brrrr-cta-icon {
  font-size: 18px;
  flex-shrink: 0;
}
.brrrr-cta-green .brrrr-cta-icon { color: var(--green); }
.brrrr-cta-red   .brrrr-cta-icon { color: var(--red); }

.brrrr-cta-btn {
  display: inline-flex;
  align-items: center;
  white-space: nowrap;
  font-family: 'Sora', sans-serif;
  font-size: 13px;
  font-weight: 700;
  padding: 10px 20px;
  border-radius: 8px;
  border: none;
  cursor: pointer;
  text-decoration: none;
  transition: transform 0.18s, box-shadow 0.18s;
}
.brrrr-cta-btn:hover { transform: translateY(-1px); }
.brrrr-cta-btn-green {
  background: var(--green);
  color: #fff;
  box-shadow: 0 3px 12px rgba(39,174,96,0.35);
}
.brrrr-cta-btn-green:hover { box-shadow: 0 6px 20px rgba(39,174,96,0.45); color: #fff; }
.brrrr-cta-btn-red {
  background: var(--red);
  color: #fff;
  box-shadow: 0 3px 12px rgba(231,76,60,0.35);
}
.brrrr-cta-btn-red:hover { box-shadow: 0 6px 20px rgba(231,76,60,0.45); }

/* ═══════════════════════════════════════════════════
   PROPERTY REQUEST MODAL
═══════════════════════════════════════════════════ */
.brrrr-modal-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.65);
  backdrop-filter: blur(4px);
  z-index: 99999;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px;
  animation: brrrr-modal-fade 0.25s ease both;
}
@keyframes brrrr-modal-fade {
  from { opacity: 0; }
  to   { opacity: 1; }
}
.brrrr-modal {
  background: var(--surface);
  border: 1px solid var(--border-lt);
  border-radius: 16px;
  width: 100%;
  max-width: 520px;
  max-height: 92vh;
  overflow-y: auto;
  position: relative;
  box-shadow: 0 24px 80px rgba(0,0,0,0.5);
  animation: brrrr-modal-up 0.28s ease both;
}
@keyframes brrrr-modal-up {
  from { opacity: 0; transform: translateY(24px) scale(0.97); }
  to   { opacity: 1; transform: translateY(0) scale(1); }
}
.brrrr-modal-close {
  position: absolute;
  top: 14px; right: 16px;
  background: var(--surface-2);
  border: 1px solid var(--border);
  color: var(--text-muted);
  font-size: 20px;
  line-height: 1;
  width: 32px; height: 32px;
  border-radius: 50%;
  cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  transition: all 0.18s;
  padding: 0;
}
.brrrr-modal-close:hover { background: var(--red-bg); border-color: var(--red); color: var(--red); }

.brrrr-modal-header {
  padding: 32px 32px 0;
}
.brrrr-modal-badge {
  display: inline-block;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--red);
  background: var(--red-bg);
  border: 1px solid rgba(231,76,60,0.28);
  border-radius: 100px;
  padding: 3px 12px;
  margin-bottom: 12px;
}
.brrrr-modal-title {
  font-family: 'Sora', sans-serif;
  font-size: 22px;
  font-weight: 700;
  color: var(--text);
  margin: 0 0 8px;
}
.brrrr-modal-sub {
  font-size: 13px;
  color: var(--text-muted);
  margin: 0 0 24px;
  line-height: 1.6;
}

.brrrr-modal-form {
  padding: 0 32px 32px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

/* Custom select — matches plugin UI */
.brrrr-select-wrap {
  position: relative;
}
.brrrr-select-wrap select {
  display: block;
  width: 100%;
  box-sizing: border-box;
  background: var(--input-bg) !important;
  color: var(--input-color) !important;
  border: 1px solid var(--input-bdr) !important;
  border-radius: 8px !important;
  font-family: 'Inter', sans-serif !important;
  font-size: 15px !important;
  font-weight: 400 !important;
  padding: 10px 40px 10px 13px !important;
  outline: none !important;
  box-shadow: none !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  cursor: pointer;
  transition: border-color 0.2s, box-shadow 0.2s !important;
}
.brrrr-select-wrap select:focus {
  border-color: var(--accent) !important;
  box-shadow: 0 0 0 3px var(--accent-dim) !important;
}
.brrrr-select-wrap select option {
  background: var(--surface-2);
  color: var(--text);
}
.brrrr-select-arrow {
  position: absolute;
  right: 13px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 18px;
  color: var(--text-dim);
  pointer-events: none;
  line-height: 1;
}

.brrrr-prop-submit-btn {
  background: linear-gradient(135deg, var(--red), #f87171);
  color: #fff;
  border: none;
  border-radius: 10px;
  font-family: 'Sora', sans-serif;
  font-size: 15px;
  font-weight: 700;
  padding: 13px 28px;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  transition: transform 0.18s, box-shadow 0.18s, opacity 0.2s;
  box-shadow: 0 4px 16px rgba(231,76,60,0.35);
  margin-top: 4px;
}
.brrrr-prop-submit-btn:hover { transform: translateY(-2px); box-shadow: 0 8px 24px rgba(231,76,60,0.45); }
.brrrr-prop-submit-btn.loading { opacity: 0.65; pointer-events: none; }

.brrrr-prop-error {
  background: var(--red-bg);
  border: 1px solid rgba(231,76,60,0.3);
  border-radius: 8px;
  color: var(--red);
  font-size: 13px;
  font-weight: 500;
  padding: 10px 14px;
}
.brrrr-prop-success {
  padding: 32px;
  text-align: center;
}
.brrrr-prop-success-icon {
  width: 56px; height: 56px;
  background: var(--green-bg);
  border: 2px solid var(--green-bdr);
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-size: 26px;
  color: var(--green);
  margin: 0 auto 16px;
}
.brrrr-prop-success h3 {
  font-family: 'Sora', sans-serif;
  font-size: 20px;
  font-weight: 700;
  color: var(--text);
  margin: 0 0 8px;
}
.brrrr-prop-success p {
  font-size: 14px;
  color: var(--text-muted);
  margin: 0;
  line-height: 1.6;
}
