@charset "UTF-8";
/* ===========================================================================
   infohub.register.css  —  registracija občine (Account/Register)
   ---------------------------------------------------------------------------
   Naloži se ZA infohub.landing.css (spremenljivke, pisava, telefonski okvir).
   Velikosti so v pikslih (Bootstrap 3 ima html{font-size:10px}).

   !important je ponekod nujen: OurStyles2.css vsem input/select/textarea
   nastavi width:100%, max-width:600px !important in border-radius:3px !important.
   =========================================================================== */

.ih-rg{
  --rg-ink:#1d2d3f;
  --rg-line:#dde5d8;
  --rg-green:#3f8f2e;
  --rg-green-2:#5c9a2e;
  --rg-red:#d93025;
  --rg-tint:#f3f8ef;
}

.ih-rg-sec{ padding:clamp(40px,4vw,64px) 0 clamp(48px,5vw,80px); }

.ih-rg-grid{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:clamp(40px,4vw,56px) clamp(28px,3vw,44px);
  align-items:start;
}
@media (min-width:1400px){
  .ih-rg-grid{ grid-template-columns:minmax(0,1.6fr) minmax(0,.72fr); }
}
/* pod 1400px je stranska kartica pod obrazcem: besedilo levo, telefon desno */
@media (min-width:768px) and (max-width:1399px){
  .ih-rg-aside{
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    align-items:center;
    gap:32px;
  }
  .ih-rg-device{ width:220px; margin:0 24px 0 0; }
}

/* ---------------------------------------------------------------------------
   KARTICI (obrazec in stranska)
   ------------------------------------------------------------------------ */

.ih-rg-card,
.ih-rg-info{
  position:relative;
  background:#fff;
  border:1px solid var(--ih-line);
  border-radius:28px;
  box-shadow:0 2px 6px rgba(18,48,28,.04), 0 18px 44px rgba(18,48,28,.09);
}
.ih-rg-card{ padding:clamp(24px,2.6vw,40px); }

/* zelen krog z ikono, ki gleda čez zgornji levi vogal */
.ih-rg-badge{
  position:absolute;
  z-index:2;
  top:-26px;
  left:clamp(12px,1.6vw,24px);
  width:clamp(84px,8vw,124px);
  aspect-ratio:1;
  border-radius:50%;
  display:grid;
  place-items:center;
  color:#fff;
  background:radial-gradient(circle at 35% 30%, #74b33f 0%, #4a8a26 55%, #3a7420 100%);
  box-shadow:
    0 0 0 clamp(6px,.7vw,10px) #eaf4df,
    0 0 0 clamp(8px,.9vw,13px) rgba(163,204,114,.45),
    0 14px 30px rgba(47,106,44,.28);
}
.ih-rg-badge svg{ width:44%; height:44%; }

/* ---------------------------------------------------------------------------
   GLAVA OBRAZCA
   ------------------------------------------------------------------------ */

.ih-rg-head{
  padding-left:calc(clamp(84px,8vw,124px) + clamp(12px,1.6vw,24px));
  min-height:calc(clamp(84px,8vw,124px) - 26px);
}
.ih-lp .ih-rg-head h1{
  font-size:clamp(30px,3.4vw,52px);
  font-weight:400;
  line-height:1.05;
  letter-spacing:-.025em;
  color:var(--ih-green-600);
}
.ih-rg-head h1 b{ display:block; font-weight:800; color:var(--ih-green-950); }
.ih-lp .ih-rg-head p{
  margin-top:10px;
  font-size:clamp(15.5px,1.3vw,19px);
  line-height:1.4;
  color:#33445a;
}

/* ---------------------------------------------------------------------------
   OBRAZEC — dva stolpca: polja | paketi, captcha, gumb
   ------------------------------------------------------------------------ */

.ih-rg-form{ margin-top:clamp(22px,2.4vw,34px); }

.ih-rg-cols{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:28px clamp(24px,2.6vw,40px);
  align-items:start;
}
@media (min-width:992px){
  .ih-rg-cols{ grid-template-columns:minmax(0,1.38fr) minmax(0,.82fr); }
}

/* vrstica: številka · oznaka · polje */
.ih-rg-row{
  display:grid;
  grid-template-columns:30px minmax(120px,158px) minmax(0,1fr);
  align-items:center;
  gap:12px;
  margin-bottom:12px;
}
.ih-rg-row--sub{
  display:block;
  padding-left:calc(30px + 160px + 24px);
  margin-top:-4px;
}

.ih-rg-n{
  flex:none;
  width:30px;
  height:30px;
  border-radius:50%;
  display:inline-grid;
  place-items:center;
  background:linear-gradient(180deg,#5c9a2e,#3f7a24);
  color:#fff;
  font-size:13.5px;
  font-weight:800;
  line-height:1;
}

.ih-rg-lbl{
  font-size:13.5px;
  font-weight:700;
  line-height:1.2;
  letter-spacing:.02em;
  text-transform:uppercase;
  color:var(--rg-ink);
}
.ih-rg-lbl label{ margin:0; font-weight:700 !important; cursor:pointer; }
.ih-rg i{ font-style:normal; color:var(--rg-red); margin-left:3px; }

/* polje z ikono */
.ih-rg-in{ position:relative; }
.ih-rg-in > svg{
  position:absolute;
  left:14px;
  top:50%;
  width:18px;
  height:18px;
  transform:translateY(-50%);
  color:var(--rg-green);
  pointer-events:none;
  z-index:1;
}
.ih-rg .form-control{
  width:100%;
  max-width:none !important;
  height:46px;
  padding:10px 14px 10px 44px;
  border:1.5px solid var(--rg-line) !important;
  border-radius:10px !important;
  background:#fff;
  box-shadow:none;
  font-family:inherit;
  font-size:15px;
  color:var(--rg-ink);
  transition:border-color .15s ease, box-shadow .15s ease;
}
.ih-rg .form-control::placeholder{ color:#98a39d; }
.ih-rg .form-control:focus{
  border-color:var(--rg-green) !important;
  box-shadow:0 0 0 4px rgba(63,143,46,.14);
  outline:0;
}
.ih-rg .form-control.input-validation-error{ border-color:var(--rg-red) !important; }

/* potrditvena polja */
.ih-rg input[type="checkbox"]{
  flex:none;
  width:20px !important;
  height:20px;
  max-width:none !important;
  margin:0;
  border-radius:4px !important;
  accent-color:var(--rg-green);
  cursor:pointer;
}
.ih-rg-check{
  display:flex !important;
  align-items:center;
  gap:10px;
  margin:0;
  font-size:15px;
  font-weight:500 !important;
  color:var(--rg-ink);
  cursor:pointer;
}

/* namig in predogled logotipa */
.ih-rg-hint{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:6px 16px;
  font-size:13px;
  color:#6a7670;
}
.ih-rg-preview{ display:inline-flex; align-items:center; gap:8px; }
.ih-rg-preview small{ font-size:12px; color:#8a948e; }
.ih-rg .previewImage{ max-height:40px; max-width:140px; border-radius:6px; }

/* ---------------------------------------------------------------------------
   PAKETI
   ------------------------------------------------------------------------ */

.ih-rg-packs{
  margin:0;
  padding:18px 20px 12px;
  border:0;
  border-radius:18px;
  background:var(--rg-tint);
  min-width:0;
}
.ih-rg-packs legend{
  display:flex;
  align-items:center;
  gap:10px;
  float:left;
  width:100%;
  margin:0 0 8px;
  padding:0;
  border:0;
  font-size:14px;
  font-weight:800;
  letter-spacing:.03em;
  text-transform:uppercase;
  color:var(--rg-ink);
}
.ih-rg-packs legend + *{ clear:both; }

.ih-rg-pack{
  display:grid !important;
  grid-template-columns:20px 48px minmax(0,1fr);
  align-items:center;
  gap:14px;
  margin:0;
  padding:7px 0;
  font-size:16.5px;
  font-weight:700 !important;
  color:var(--rg-ink);
  cursor:pointer;
}
.ih-rg-pico{
  width:48px;
  height:48px;
  border-radius:13px;
  display:grid;
  place-items:center;
  color:#fff;
  background:linear-gradient(160deg,#5c9a2e 0%,#3f7a24 100%);
  box-shadow:0 6px 14px rgba(63,122,36,.22);
}
.ih-rg-pico svg{ width:26px; height:26px; }

.ih-rg .field-validation-error{
  display:block;
  margin:2px 0 6px 34px;
  font-size:13px;
  color:var(--rg-red);
}

/* ---------------------------------------------------------------------------
   CAPTCHA, POGOJI, GUMB
   ------------------------------------------------------------------------ */

.ih-rg-captcha{ margin-top:22px; }
.ih-lp .ih-rg-captcha p{
  margin-bottom:10px;
  font-size:15px;
  font-weight:600;
  color:var(--rg-ink);
}
/* oblika delnega pogleda _CaptchaViewPartial (slika, polje, "osveži") */
.ih-rg-captcha img{ max-width:100%; border-radius:8px; border:1px solid var(--rg-line); }
.ih-rg-captcha input[type="text"]{
  width:100%;
  max-width:none !important;
  height:44px;
  margin:8px 0;
  padding:8px 14px;
  border:1.5px solid var(--rg-line) !important;
  border-radius:10px !important;
  font-size:15px;
}
.ih-rg-captcha a{ color:var(--rg-green) !important; font-weight:700; }
.ih-rg-captcha br{ display:none; }

.ih-rg-terms{ margin-top:18px; }
.ih-rg-terms a,
.ih-rg-terms a:visited{
  color:var(--rg-green) !important;
  font-weight:700;
  text-decoration:underline;
  text-underline-offset:3px;
}

.ih-rg-submit{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:14px;
  width:100%;
  margin-top:22px;
  padding:18px 24px;
  border:0;
  border-radius:999px;
  background:linear-gradient(180deg,#5c9a2e 0%,#3f7a24 100%);
  color:#fff;
  font-family:inherit;
  font-size:clamp(18px,1.5vw,22px);
  font-weight:800;
  line-height:1.2;
  cursor:pointer;
  box-shadow:0 12px 26px rgba(63,122,36,.30);
  transition:transform .2s var(--ih-ease), box-shadow .2s var(--ih-ease), filter .2s var(--ih-ease);
}
.ih-rg-submit svg{ width:24px; height:24px; }
.ih-rg-submit:hover{ transform:translateY(-2px); filter:brightness(1.07); box-shadow:0 16px 32px rgba(63,122,36,.34); }
.ih-rg-submit:focus-visible{ outline:0; box-shadow:0 0 0 3px #fff, 0 0 0 6px var(--ih-green-300); }

/* povzetek napak nad obrazcem */
.ih-rg .validation-summary-errors{
  margin-bottom:18px;
  padding:14px 18px;
  border-radius:12px;
  background:#fdecea;
  color:#9c231b;
  font-size:14.5px;
}
.ih-rg .validation-summary-errors ul{ margin:0; padding-left:18px; }

/* ---------------------------------------------------------------------------
   STRANSKA KARTICA IN TELEFON
   ------------------------------------------------------------------------ */

.ih-rg-aside{ position:relative; }
.ih-rg-info{ padding:clamp(28px,3vw,44px) clamp(24px,2.4vw,36px) clamp(28px,3vw,40px); }
.ih-rg-badge--info{ width:clamp(70px,6vw,92px); top:-24px; left:-10px; }
.ih-rg-badge--info svg{ width:46%; height:46%; }

.ih-lp .ih-rg-info h2{
  padding-left:clamp(56px,5vw,78px);
  font-size:clamp(26px,2.3vw,36px);
  font-weight:400;
  line-height:1.1;
  letter-spacing:-.02em;
  color:var(--ih-green-600);
}
.ih-rg-info h2 b{ display:block; font-weight:800; color:var(--ih-green-950); }
.ih-lp .ih-rg-info p{
  margin-top:16px;
  font-size:16px;
  line-height:1.55;
  color:#3a4a5c;
}
.ih-rg-info p b{ font-weight:800; color:var(--rg-ink); }

.ih-rg-help{
  display:inline-flex;
  align-items:center;
  gap:12px;
  margin-top:22px;
  padding:14px 26px;
  border-radius:999px;
  background:#243447;
  color:#fff !important;
  font-size:16px;
  font-weight:700;
  text-decoration:none;
  box-shadow:0 10px 22px rgba(36,52,71,.22);
  transition:transform .2s var(--ih-ease), background-color .2s var(--ih-ease);
}
.ih-rg-help svg{ width:20px; height:20px; }
.ih-rg-help:hover,
.ih-rg-help:focus{ transform:translateY(-2px); background:#1a2736; text-decoration:none; }

.ih-rg-device{
  position:relative;
  z-index:2;
  width:min(62%,260px);
  margin:-40px 6% 0 auto;
  transform:rotate(7deg);
}

/* ---------------------------------------------------------------------------
   OZKI ZASLONI
   ------------------------------------------------------------------------ */

@media (max-width:991px){
  .ih-rg-row--sub{ padding-left:calc(30px + 12px); }
}
@media (max-width:640px){
  .ih-rg-row{ grid-template-columns:30px minmax(0,1fr); row-gap:8px; margin-bottom:16px; }
  .ih-rg-in{ grid-column:1 / -1; }
  .ih-rg-row--sub{ padding-left:0; }
  .ih-rg-badge{ top:-22px; width:72px; }
  .ih-rg-head{ padding-left:0; padding-top:58px; min-height:0; }     /* značka nad naslovom, ne ob njem */
  .ih-lp .ih-rg-info h2{ padding-left:0; padding-top:44px; }
  .ih-rg-badge--info{ width:64px; left:14px; }
  .ih-rg-pack{ grid-template-columns:20px 42px minmax(0,1fr); gap:12px; font-size:15.5px; }
  .ih-rg-pico{ width:42px; height:42px; }
  .ih-rg-device{ width:min(56%,220px); margin-top:-24px; }
}

@media (prefers-reduced-motion:reduce){
  .ih-rg-submit,.ih-rg-help{ transition:none; }
  .ih-rg-submit:hover,.ih-rg-help:hover{ transform:none; }
}