/* CloseRate — Polsia Landing Page Theme */
/* Loaded via themeCSS — all styles live in partials via <style> blocks in EJS */
/* This file intentionally minimal — inline styles handle all design */

:root {
  --navy: #0B1D2E;
  --amber: #E8913A;
  --cream: #F7F4EE;
}

@media (prefers-reduced-motion: reduce) {
  * { animation-duration: 0.01ms !important; transition-duration: 0.01ms !important; }
}

::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: var(--cream); }
::-webkit-scrollbar-thumb { background: var(--amber); border-radius: 3px; }

/* ── Email config / DNS guide ─────────────────────────── */
.email-config-section h2 { font-size: 1.4rem; color: var(--navy); margin-bottom: 6px; font-family: 'Playfair Display', serif; font-weight: 700; }
.email-config-section .section-desc { font-size: 0.88rem; color: var(--text-light); margin-bottom: 28px; line-height: 1.5; }
.field-group { margin-bottom: 20px; }
.field-group label { display: block; font-size: 0.82rem; font-weight: 600; color: var(--text-mid); margin-bottom: 6px; text-transform: uppercase; letter-spacing: 0.05em; }
.field-group input { width: 100%; padding: 10px 14px; border: 1.5px solid var(--cream-mid); border-radius: 8px; font-size: 0.95rem; font-family: 'DM Sans', sans-serif; background: var(--white); color: var(--navy); outline: none; transition: border-color 0.15s; }
.field-group input:focus { border-color: var(--amber); }
.field-hint { font-size: 0.75rem; color: var(--text-light); margin-top: 5px; }
.dns-guide { background: var(--cream); border: 1.5px solid var(--cream-mid); border-radius: 12px; padding: 24px 28px; margin-top: 28px; }
.dns-guide h3 { font-size: 1rem; font-weight: 600; color: var(--navy); margin-bottom: 4px; font-family: 'DM Sans', sans-serif; }
.dns-guide > p { font-size: 0.8rem; color: var(--text-light); margin-bottom: 20px; }
.dns-record { margin-bottom: 20px; }
.dns-record:last-child { margin-bottom: 0; }
.dns-record-title { font-size: 0.82rem; font-weight: 700; color: var(--navy); margin-bottom: 6px; text-transform: uppercase; letter-spacing: 0.06em; }
.dns-record-table { width: 100%; border-collapse: collapse; }
.dns-record-table td { padding: 5px 0; font-size: 0.82rem; vertical-align: top; }
.dns-key { color: var(--text-light); width: 80px; font-weight: 500; }
.dns-val { color: var(--navy); font-family: 'Courier New', monospace; font-size: 0.8rem; word-break: break-all; }
.copy-btn { background: none; border: 1.5px solid var(--amber); color: var(--amber); padding: 3px 10px; border-radius: 5px; font-size: 0.72rem; font-weight: 600; cursor: pointer; font-family: 'DM Sans', sans-serif; margin-left: 6px; transition: background 0.15s, color 0.15s; }
.copy-btn:hover { background: var(--amber); color: var(--white); }
.copy-btn.copied { background: #2d9a5e; border-color: #2d9a5e; color: white; }
.verify-section { margin-top: 24px; display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.verify-btn { background: var(--navy); color: var(--white); border: none; padding: 10px 22px; border-radius: 8px; font-size: 0.88rem; font-weight: 600; cursor: pointer; font-family: 'DM Sans', sans-serif; transition: opacity 0.15s; }
.verify-btn:hover { opacity: 0.85; }
.verify-btn:disabled { opacity: 0.5; cursor: not-allowed; }
.status-badge { display: inline-flex; align-items: center; gap: 5px; padding: 4px 12px; border-radius: 20px; font-size: 0.75rem; font-weight: 600; }
.status-badge.pending { background: #fff3e0; color: #e67e22; }
.status-badge.verified { background: #e6f4ea; color: #2d9a5e; }
.status-badge.failed { background: #fde8e8; color: #e63946; }
.save-btn { background: var(--amber); color: var(--navy); border: none; padding: 10px 28px; border-radius: 8px; font-size: 0.9rem; font-weight: 700; cursor: pointer; font-family: 'DM Sans', sans-serif; transition: opacity 0.15s; }
.save-btn:hover { opacity: 0.85; }
.save-btn:disabled { opacity: 0.5; cursor: not-allowed; }
.api-error { color: #e63946; font-size: 0.82rem; margin-top: 8px; display: none; }
.settings-section { background: var(--white); border-radius: 12px; padding: 32px 36px; margin-bottom: 28px; box-shadow: 0 1px 3px rgba(0,0,0,0.06); }
.warning-banner { background: #e63946; color: white; padding: 14px clamp(24px, 5vw, 80px); font-size: 0.88rem; text-align: center; display: flex; align-items: center; justify-content: center; gap: 8px; }
.warning-banner a { color: #fff; text-decoration: underline; font-weight: 600; }