/* Scoped styles for Reinvest Contact Form (.rei-cf) */
/* Based on the provided EE source, moved out of <style> and fully scoped. */
.rei-cf {
  --brand:#007C46;       /* roheline */
  --brand-900:#004B2B;   /* tumeroheline */
  --brand-50:#E3F0E7;    /* hele taust */
  --ink:#0f172a;         /* tekst */
  --muted:#6b7280;       /* sekundaarne tekst */
  --danger:#dc2626;      /* vead */
  --ok:#16a34a;          /* OK */
  --white:#ffffff;
  --radius:16px;
  --shadow-lg:0 16px 40px rgba(0,0,0,.10);
  --shadow-md:0 10px 24px rgba(0,0,0,.08);
  --ring:0 0 0 4px rgba(0,124,70,.14);
}

.rei-cf * { box-sizing: border-box; }

#TaotlenLaenu { scroll-margin-top: 6rem; } /* adjust */

.rei-cf .wrap { max-width:980px; margin:32px auto; padding:0; }

.rei-cf .card { background:var(--white); border:1px solid rgba(2,6,23,.06); border-radius:22px; box-shadow:var(--shadow-lg); overflow:hidden;}

/* Header with progress */
.rei-cf .header { padding:16px 18px; background:linear-gradient(180deg,#f2fbf6,var(--brand-50)); border-bottom:1px solid rgba(2,6,23,.06); position:relative;}
.rei-cf .tabs { display:flex; gap:10px; flex-wrap:wrap; }
.rei-cf .tab { appearance:none; border:none; background:#fff; color:var(--brand-900); padding:10px 16px; border-radius:999px; border:1px solid rgba(2,6,23,.08); font-weight:700; cursor:pointer; transition:.2s;}
.rei-cf .tab[aria-selected="true"] { background:var(--brand); color:#fff; border-color:transparent; box-shadow:0 8px 22px rgba(0,124,70,.25);}
.rei-cf .progress { height:6px; border-radius:999px; background:#e6f1eb; overflow:hidden; margin-top:12px; }
.rei-cf .progress > span { display:block; height:100%; width:0; background:linear-gradient(90deg,var(--brand-900),var(--brand)); transition:width .25s ease; }

.rei-cf .content { padding:22px; }
.rei-cf h1 { font-size:clamp(22px,3vw,34px); margin:0 0 6px; }
.rei-cf .kicker { color:var(--ink); font-weight:700; }
.rei-cf .lead { color:var(--muted); margin:0 0 16px; }

/* Form */
.rei-cf form { display:grid; gap:0.875rem; }
.rei-cf .row { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.rei-cf [hidden] { display: none !important; } /* Ensure elements marked hidden are actually hidden inside the form */
.rei-cf .control { display:flex; flex-direction:column; gap:6px; position:relative; }
.rei-cf label { font-size:14px; font-weight:600; color:#334155; }
.rei-cf .hint { font-size:12px; color:var(--muted); }

.rei-cf .field { position:relative; }
.rei-cf .field input,
.rei-cf .field textarea,
.rei-cf .field select { width:100%; padding:12px 14px 12px 40px; border:1px solid #d6e5db; border-radius:12px; background:#fff; outline:none; transition:border .15s, box-shadow .15s; }
/* desktop/tablet default can stay a bit taller */
.rei-cf .field input:focus,
.rei-cf .field textarea:focus,
.rei-cf .field select:focus { border-color:var(--brand); box-shadow:var(--ring); }
.rei-cf .field textarea { min-height: 3.6rem;  resize:vertical; }
.rei-cf .field svg { position:absolute; left:12px; top:50%; transform:translateY(-50%); width:18px; height:18px; color:#94a3b8; }
.rei-cf .field svg,
.rei-cf .field svg * { fill: none !important;}
/* draw a trailing € as decoration; prevent clicks on it */
.rei-cf .field[data-currency="eur"]::after {content: "€"; position: absolute; right: 12px; top: 50%; transform: translateY(-50%); color: #94a3b8; pointer-events: none; }
/* ensure there’s padding on the right so the text doesn't overlap the € */
.rei-cf .field[data-currency="eur"] input { padding-right: 28px;}

.rei-cf .error input,
.rei-cf .error textarea,
.rei-cf .error select { border-color:var(--danger)!important; box-shadow:0 0 0 4px rgba(220,38,38,.12)!important; }
.rei-cf .msg { font-size:12px; margin-top:-6px; }
.rei-cf .msg.error { color:var(--danger); }
.rei-cf .msg.ok { color:var(--ok); }

.rei-cf .consent { display:flex; align-items:flex-start; gap:10px; margin-top:4px; }
/* Consent error visuals */
.rei-cf .consent.error input { outline: none; box-shadow: 0 0 0 4px rgba(220,38,38,.12); /* same red ring you use */ border-color: var(--danger);}
.rei-cf .consent-msg { font-size:12px; color: var(--danger); margin-top:4px; }


.rei-cf .actions { display:flex; gap:12px; margin-top:6px; }
.rei-cf .btn { display:inline-flex; align-items:center; justify-content:center; gap:10px; padding:14px 22px; border-radius:12px; border:1px solid rgba(0,0,0,.06); font-weight:800; cursor:pointer; }
.rei-cf .btn-primary { background:var(--brand); color:#fff; box-shadow:0 12px 26px rgba(0,124,70,.25); }
.rei-cf .btn-primary[disabled] { opacity:.5; cursor:not-allowed; box-shadow:none; }
.rei-cf .btn-primary:hover:not([disabled]) { background:var(--brand-900); }
.rei-cf .btn-ghost { background:#fff; color:var(--brand-900); }

/* Success banner */
.rei-cf .success { display:none; background:#f0fdf4; color:#166534; border:1px solid #bbf7d0; padding:12px 14px; border-radius:12px; }

/* Sticky submit on mobile */
@media (max-width:760px) {
  
  #TaotlenLaenu { scroll-margin-top: 3rem; } /* adjust */

  .rei-cf .row { grid-template-columns:1fr; }
  .rei-cf .sticky { position:sticky; bottom:12px; background:transparent; padding-top:4px; }
  .rei-cf .field textarea { min-height: 3.6rem; } /* 52–60px also fine */

  .rei-cf .actions { flex-direction: column; }
  .rei-cf .btn-primary { width:100%; border-radius:5px; }
  .rei-cf .btn-ghost[type="reset"]{ display:none; }
}

.rei-cf .rei-cf-successwrap .rei-cf-successcard { display:flex; flex-direction:column; align-items:center; text-align:center; gap:14px; padding:28px; border:1px solid rgba(2,6,23,.06); border-radius:22px; background:#fff; box-shadow:var(--shadow-lg); outline:none;}
.rei-cf .rei-cf-successwrap .rei-cf-successcard__icon { color:#16a34a; }                /* green */
.rei-cf .rei-cf-successwrap .rei-cf-successcard__title { font-size:22px; margin:4px 0; }
.rei-cf .rei-cf-successwrap .rei-cf-successcard__sub   { color:#475569; margin:0; }
.rei-cf .rei-cf-successwrap .rei-cf-successcard__ctas  { display:flex; gap:10px; flex-wrap:wrap; justify-content:center; }
.rei-cf .rei-cf-successwrap .rei-cf-btn { display:inline-flex; align-items:center; justify-content:center; padding:12px 18px; border-radius:12px; font-weight:700; border:1px solid transparent; cursor:pointer;}
/* No underline on the success CTA link, all states */
.rei-cf .rei-cf-successwrap .rei-cf-btn,
.rei-cf .rei-cf-successwrap .rei-cf-btn:link,
.rei-cf .rei-cf-successwrap .rei-cf-btn:visited,
.rei-cf .rei-cf-successwrap .rei-cf-btn:hover,
.rei-cf .rei-cf-successwrap .rei-cf-btn:focus,
.rei-cf .rei-cf-successwrap .rei-cf-btn:active {
  text-decoration: none;
}

.rei-cf .rei-cf-successwrap .rei-cf-btn--primary { background:var(--brand); color:#fff; }
.rei-cf .rei-cf-successwrap .rei-cf-btn--primary:hover { background:var(--brand-900); }
.rei-cf .rei-cf-successwrap .rei-cf-btn--ghost   { background:#fff; color:var(--brand-900); border-color:#d6e5db; }

.rei-cf .rei-cf-successwrap .rei-cf-successcard__meta { color:#64748b; font-size:14px; margin:6px 0 0; }
/*close button success*/
.rei-cf .rei-cf-successwrap .rei-cf-successcard { position: relative; }
.rei-cf .rei-cf-successwrap .rei-cf-successcard__close{ position:absolute; top:10px; right:10px; width:34px; height:34px; padding: 0; border-radius:8px; border:1px solid #e2e8f0; background:#fff; color:#64748b; font-size:20px; line-height:1; cursor:pointer;}
.rei-cf .rei-cf-successwrap .rei-cf-successcard__close:hover{ background:#f8fafc; color:#334155; }