/**
 * Home Affordability Calculator — admin UI.
 */
:root{
  --hslc-ink:#1a1c1e; --hslc-muted:#6b7177; --hslc-line:#e3e5e8; --hslc-line2:#eef0f2;
  --hslc-bg:#ffffff; --hslc-card:#ffffff;
  --hslc-primary:#5b5bd6; --hslc-primary-d:#4848c0; --hslc-blue:#3b82f6; --hslc-blue-d:#2563eb;
  --hslc-green:#16a34a; --hslc-red:#dc2626;
  --hslc-shadow:0 1px 0 rgba(0,0,0,.05), 0 1px 3px rgba(0,0,0,.06);
}

#wpcontent{ background:var(--hslc-bg); }
.happs-haff-wrap{
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Inter,Helvetica,Arial,sans-serif;
  color:var(--hslc-ink); max-width:1060px; margin:0 24px; padding:8px 0 60px;
}
.happs-haff-wrap *{ box-sizing:border-box; }
.happs-haff-wrap a{ color:var(--hslc-blue-d); }

.happs-haff-wrap button, .happs-haff-wrap input, .happs-haff-wrap select, .happs-haff-wrap textarea{
  font-family:inherit; letter-spacing:normal; text-shadow:none; text-transform:none;
  margin:0; min-height:0; max-height:none; float:none; box-shadow:none;
}
.happs-haff-wrap button{ -webkit-appearance:none; appearance:none; background-image:none; width:auto; height:auto; line-height:1.2; }
.happs-haff-wrap svg{ vertical-align:middle; }
.happs-haff-wrap a.happs-haff-btn, .happs-haff-wrap button.happs-haff-btn{ text-decoration:none; }
.happs-haff-wrap a.happs-haff-btn-primary, .happs-haff-wrap a.happs-haff-btn-primary:hover, .happs-haff-wrap a.happs-haff-btn-primary:focus{ color:#fff; background-image:none; }
.happs-haff-wrap a.happs-haff-btn-primary:hover{ background:var(--hslc-primary-d); }
.happs-haff-wrap a.happs-haff-btn-ghost, .happs-haff-wrap a.happs-haff-btn-ghost:hover, .happs-haff-wrap a.happs-haff-btn-ghost:focus{ color:var(--hslc-ink); background:#fff; }

/* Topbar */
.happs-haff-topbar{ display:flex; align-items:center; justify-content:space-between; padding:16px 0 14px; border-bottom:1px solid var(--hslc-line); margin-bottom:18px; }
.happs-haff-brand{ display:flex; align-items:center; gap:12px; }
.happs-haff-logo{ padding:4px;width:44px; height:44px; flex:none; border-radius:12px; overflow:hidden; display:flex; align-items:center; justify-content:center;
  background:linear-gradient(135deg,var(--hslc-primary),#8b5cf6); color:#fff; font-weight:800; font-size:20px; box-shadow:0 5px 14px rgba(91,91,214,.32); }
.happs-haff-logo img{ width:100%; height:100%; object-fit:cover; border-radius:inherit; display:block; }
.happs-haff-brand-name{ font-weight:700; font-size:15px; }
.happs-haff-brand-sub{ font-size:12px; color:var(--hslc-muted); }

.happs-haff-badge{ font-size:12px; font-weight:700; padding:5px 12px; border-radius:999px; }
.happs-haff-badge.is-pro{ background:#dcfce7; color:#166534; }
.happs-haff-badge.is-trial{ background:#fef3c7; color:#92400e; }
.happs-haff-badge.is-free{ background:#eef0f2; color:#475569; }

/* Banner */
.happs-haff-bar{ display:flex; align-items:center; gap:14px; justify-content:space-between; padding:13px 16px; border-radius:12px; margin-bottom:18px; font-size:13.5px; border:1px solid var(--hslc-line); }
.happs-haff-bar.is-trial{ background:#fffbeb; border-color:#fde68a; color:#78350f; }
.happs-haff-bar.is-free{ background:#eef2ff; border-color:#c7d2fe; color:#312e81; }
.happs-haff-bar-btn{ flex:none; background:var(--hslc-ink); color:#fff !important; text-decoration:none; padding:8px 16px; border-radius:9px; font-weight:600; font-size:13px; white-space:nowrap; }

.happs-haff-page-head{ margin-bottom:18px; }
.happs-haff-page-head h1{ font-size:24px; font-weight:800; margin:0 0 4px; padding:0; }
.happs-haff-page-head p{ color:var(--hslc-muted); margin:0; font-size:14px; }

/* Cards */
.happs-haff-card{ background:var(--hslc-card); border:1px solid var(--hslc-line); border-radius:14px; padding:20px 22px; margin-bottom:18px; box-shadow:var(--hslc-shadow); margin-top:8px; }
.happs-haff-card-head{ display:flex; align-items:center; gap:10px; margin-bottom:14px; }
.happs-haff-card-head h2{ font-size:16px; font-weight:700; margin:0; padding:0; }
.happs-haff-card-hint{ font-size:12px; color:var(--hslc-muted); margin-left:auto; }
.happs-haff-card-actions{ display:flex; gap:8px; align-items:center; margin-left:auto; }
.happs-haff-muted{ color:var(--hslc-muted); font-size:14px; }

/* Grid */
.happs-haff-grid{ display:grid; gap:18px; }
.happs-haff-grid-2{ grid-template-columns:1fr 1fr; }
.happs-haff-grid-3{ grid-template-columns:repeat(3,1fr); }
@media(max-width:900px){ .happs-haff-grid-2,.happs-haff-grid-3{ grid-template-columns:1fr; } }

/* Stats */
.happs-haff-stat{ background:var(--hslc-card); border:1px solid var(--hslc-line); border-radius:14px; padding:20px; box-shadow:var(--hslc-shadow); }
.happs-haff-stat-num{ font-size:30px; font-weight:800; line-height:1; }
.happs-haff-stat-label{ color:var(--hslc-muted); font-size:13px; margin-top:6px; }

/* Buttons */
.happs-haff-btn{ display:inline-flex; align-items:center; justify-content:center; gap:6px; font-size:13.5px; font-weight:600; padding:9px 16px; border-radius:9px; cursor:pointer; border:1px solid transparent; text-decoration:none; line-height:1.2; transition:.12s; }
.happs-haff-btn-primary{ background:var(--hslc-primary); color:#fff; }
.happs-haff-btn-primary:hover{ background:var(--hslc-primary-d); color:#fff; }
.happs-haff-btn-ghost{ background:#fff; color:var(--hslc-ink); border-color:var(--hslc-line); }
.happs-haff-btn-ghost:hover{ border-color:#c4c8cc; }
.happs-haff-btn-danger{ background:#fff; color:var(--hslc-red); border-color:#f3c5c5; }
.happs-haff-btn-danger:hover{ background:#fef2f2; }
.happs-haff-link{ background:none; border:none; color:var(--hslc-blue-d); cursor:pointer; font-size:13.5px; padding:0; }
.happs-haff-link-danger{ background:none; border:none; color:var(--hslc-red); cursor:pointer; font-size:13px; padding:0; }

/* Shortcode */
.happs-haff-shortcode{ display:flex; align-items:center; gap:10px; }
.happs-haff-shortcode code{ background:#0f172a; color:#fff; padding:11px 16px; border-radius:9px; font-size:15px; flex:1; font-family:ui-monospace,SFMono-Regular,Menlo,monospace; }

/* Lists */
.happs-haff-steps-list{ margin:0; padding-left:20px; line-height:1.9; font-size:14px; }
.happs-haff-tick{ list-style:none; margin:0; padding:0; display:grid; gap:9px; }
.happs-haff-tick li{ position:relative; padding-left:26px; font-size:14px; }
.happs-haff-tick li::before{ content:"✓"; position:absolute; left:0; top:0; width:18px; height:18px; font-size:11px; background:var(--hslc-green); color:#fff; border-radius:50%; display:flex; align-items:center; justify-content:center; }

/* Pro tag */
.happs-haff-pro-tag{ display:inline-block; font-size:10px; font-weight:800; letter-spacing:.4px; text-transform:uppercase; background:linear-gradient(135deg,#6366f1,#4338ca); color:#fff; padding:2px 7px; border-radius:5px; vertical-align:middle; margin-left:4px; }

/* Tabs */
.happs-haff-tabs{ display:flex; gap:4px; flex-wrap:wrap; margin-bottom:18px; background:#fff; border:1px solid var(--hslc-line); border-radius:12px; padding:5px; box-shadow:var(--hslc-shadow); }
.happs-haff-tab{ border:none; background:none; padding:9px 16px; border-radius:8px; cursor:pointer; font-size:13.5px; font-weight:600; color:var(--hslc-muted); }
.happs-haff-tab:hover{ color:var(--hslc-ink); }
.happs-haff-tab.is-active{ background:var(--hslc-ink); color:#fff; }
.happs-haff-panel{ display:none; }
.happs-haff-panel.is-active{ display:block; }

/* Fields */
.happs-haff-field{ margin-bottom:16px; }
.happs-haff-field > label{ display:block; font-size:13px; font-weight:600; margin-bottom:6px; }
.happs-haff-wrap .happs-haff-input{
  -webkit-appearance:none; -moz-appearance:none; appearance:none;
  display:block; box-sizing:border-box; width:100%; max-width:520px; min-height:40px; height:auto; margin:0; padding:9px 12px;
  font-size:14px; line-height:1.4; color:var(--hslc-ink); font-family:inherit;
  border:1px solid #c9cdd2; border-radius:9px; background-color:#fff; background-image:none; outline:none; box-shadow:none;
}
.happs-haff-wrap textarea.happs-haff-input{ max-width:640px; min-height:auto; line-height:1.55; resize:vertical; }
.happs-haff-wrap select.happs-haff-input{ max-width:340px; cursor:pointer; padding-right:38px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236b7177' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 12px center; background-size:16px 16px; }
.happs-haff-wrap .happs-haff-input-sm{ max-width:110px; }
.happs-haff-wrap .happs-haff-input:focus{ border-color:var(--hslc-blue); box-shadow:0 0 0 3px rgba(59,130,246,.18); }
.happs-haff-wrap .happs-haff-input:disabled{ background-color:#f6f7f8; color:var(--hslc-muted); cursor:not-allowed; }
.happs-haff-hint{ font-size:12px; color:var(--hslc-muted); margin:6px 0 0; }
.happs-haff-field.is-locked{ opacity:.6; }
.happs-haff-wrap input[type=range]{ width:260px; accent-color:var(--hslc-primary); }

/* Color fields */
.happs-haff-color-row{ display:flex; gap:8px; align-items:center; }
.happs-haff-wrap .happs-haff-color-row input[type=color]{ -webkit-appearance:none; appearance:none; width:44px; height:40px; min-height:40px; padding:0; margin:0; border:1px solid #c9cdd2; border-radius:9px; background:#fff; cursor:pointer; }
.happs-haff-wrap .happs-haff-color-row input[type=color]::-webkit-color-swatch-wrapper{ padding:3px; }
.happs-haff-wrap .happs-haff-color-row input[type=color]::-webkit-color-swatch{ border:none; border-radius:5px; }
.happs-haff-wrap .happs-haff-color-text{ max-width:140px; }

/* Media */
.happs-haff-media-row{ display:flex; gap:8px; max-width:520px; }
.happs-haff-logo-preview{ max-height:60px; margin-top:12px; display:block; border:1px solid var(--hslc-line); border-radius:8px; padding:6px; background:#fff; }

/* Toggles */
.happs-haff-toggle-row{ display:flex; align-items:center; gap:12px; padding:10px 0; border-bottom:1px solid var(--hslc-line2); }
.happs-haff-toggle-row:last-child{ border-bottom:none; }
.happs-haff-toggle-row.is-locked{ opacity:.65; }
.happs-haff-toggle-label{ font-size:14px; }
.happs-haff-switch{ position:relative; display:inline-block; width:42px; height:24px; flex:none; }
.happs-haff-switch input{ opacity:0; width:0; height:0; }
.happs-haff-slider-ui{ position:absolute; inset:0; background:#cbd5e1; border-radius:999px; transition:.2s; cursor:pointer; }
.happs-haff-slider-ui::before{ content:""; position:absolute; height:18px; width:18px; left:3px; top:3px; background:#fff; border-radius:50%; transition:.2s; box-shadow:0 1px 2px rgba(0,0,0,.2); }
.happs-haff-switch input:checked + .happs-haff-slider-ui{ background:var(--hslc-primary); }
.happs-haff-switch input:checked + .happs-haff-slider-ui::before{ transform:translateX(18px); }
.happs-haff-switch input:disabled + .happs-haff-slider-ui{ cursor:not-allowed; }

/* Save bar */
.happs-haff-save-bar{ position:sticky; bottom:0; background:rgba(255,255,255,.92); backdrop-filter:blur(6px); padding:14px 0; margin-top:8px; border-top:1px solid var(--hslc-line); }

/* Tables */
.happs-haff-table-wrap{ overflow-x:auto; }
.happs-haff-table{ width:100%; border-collapse:collapse; font-size:13.5px; }
.happs-haff-table th{ text-align:left; font-size:11px; text-transform:uppercase; letter-spacing:.4px; color:var(--hslc-muted); padding:10px 12px; border-bottom:1px solid var(--hslc-line); }
.happs-haff-table td{ padding:11px 12px; border-bottom:1px solid var(--hslc-line2); }
.happs-haff-table tr:last-child td{ border-bottom:none; }
.happs-haff-table tr.is-masked td{ color:var(--hslc-muted); }
.happs-haff-fields-table td{ vertical-align:middle; }
.happs-haff-empty{ color:var(--hslc-muted); padding:24px 0; text-align:center; }

/* License */
.happs-haff-plan-pill{ display:inline-block; padding:6px 14px; border-radius:999px; font-weight:700; font-size:13px; margin:0 0 12px; }
.happs-haff-plan-pill.is-pro{ background:#dcfce7; color:#166534; }
.happs-haff-plan-pill.is-trial{ background:#fef3c7; color:#92400e; }
.happs-haff-plan-pill.is-free{ background:#eef0f2; color:#475569; }
.happs-haff-meta-table{ width:100%; border-collapse:collapse; }
.happs-haff-meta-table th{ text-align:left; color:var(--hslc-muted); font-weight:600; padding:7px 0; width:140px; font-size:13px; }
.happs-haff-meta-table td{ padding:7px 0; font-size:13px; }
.happs-haff-reassure{ margin-top:18px; background:#f8fafc; border:1px solid var(--hslc-line); border-radius:12px; padding:16px 18px; }
.happs-haff-reassure h3{ margin:0 0 8px; font-size:14px; }
.happs-haff-keybox{ margin-top:16px; border-top:1px solid var(--hslc-line); padding-top:16px; }
.happs-haff-keybox h3{ font-size:14px; margin:0 0 6px; }
.happs-haff-key-row{ display:flex; gap:8px; max-width:520px; margin-top:8px; }
.happs-haff-key-msg{ font-size:13px; min-height:18px; margin:10px 0 0; }
.happs-haff-key-msg.is-ok{ color:var(--hslc-green); }
.happs-haff-key-msg.is-err{ color:var(--hslc-red); }
.happs-haff-plan-actions{ margin:12px 0; }

/* ---- License: Free vs Pro comparison table ---- */
.happs-haff-compare{ width:100%; border-collapse:collapse; }
.happs-haff-compare th,
.happs-haff-compare td{ padding:11px 14px; border-bottom:1px solid var(--hslc-line,#e5e7eb); font-size:13.5px; text-align:left; vertical-align:middle; }
.happs-haff-compare thead th{ font-weight:700; background:var(--hslc-soft,#f5f6fa); white-space:nowrap; }
.happs-haff-compare thead th:nth-child(2),
.happs-haff-compare thead th:nth-child(3){ text-align:center; width:90px; }
.happs-haff-compare tbody tr:last-child td{ border-bottom:0; }
.happs-haff-cmp-yes{ display:inline-block; font-weight:800; color:#16a34a; }
.happs-haff-cmp-no{ display:inline-block; color:#9aa1ad; }

/* ---- Service pages (CRM / customizations / bug report) ---- */
.happs-haff-service-meta{ display:flex; gap:14px; flex-wrap:wrap; margin:18px 0; }
.happs-haff-service-meta > div{ flex:1 1 160px; background:var(--hslc-soft,#f5f6fa); border:1px solid var(--hslc-line,#e5e7eb);
  border-radius:12px; padding:14px 16px; display:flex; flex-direction:column; gap:3px; }
.happs-haff-service-label{ font-size:12px; text-transform:uppercase; letter-spacing:.4px; color:var(--hslc-muted,#6b7280); font-weight:600; }
.happs-haff-service-meta strong{ font-size:18px; font-weight:800; }
.happs-haff-service-perk{ background:#eef6ff; border:1px solid #cfe4ff; border-radius:12px; padding:12px 16px; margin:14px 0; }

/* ---- Design: color reset ---- */
.happs-haff-color-reset{ margin-top:14px; }

/* ---- Fields table: fit all columns (incl. Locked) without horizontal scroll ---- */
.happs-haff-fields-table{ table-layout:fixed; width:100%; }
.happs-haff-fields-table th, .happs-haff-fields-table td{ padding:10px 8px; }
.happs-haff-fields-table th:nth-child(1){ width:19%; }                 /* Field */
.happs-haff-fields-table th:nth-child(2),
.happs-haff-fields-table th:nth-child(3),
.happs-haff-fields-table th:nth-child(4),
.happs-haff-fields-table th:nth-child(5){ width:16%; }                 /* Default / Min / Max / Step */
.happs-haff-fields-table th:nth-child(6),
.happs-haff-fields-table th:nth-child(7){ width:8.5%; text-align:center; } /* Visible / Locked */
.happs-haff-fields-table .happs-haff-input-sm{ max-width:100%; width:100%; }
.happs-haff-fields-table select.happs-haff-input{ max-width:100%; width:100%; padding-right:24px; background-position:right 7px center; margin-top:6px; }
.happs-haff-fields-table td:first-child{ white-space:normal; word-break:break-word; }