.elementor-3263 .elementor-element.elementor-element-9145f57{--display:flex;}/* Start custom CSS for shortcode, class: .elementor-element-2162cac *//* ======================================================================
   TRADE-IN – ALAP VÁLTOZÓK, LAYOUT
   ====================================================================== */
#tradein-form .tradein{
  --brand:#22c55e; --ink:#0f172a; --muted:#64748b; --bg:#f8fafc; --card:#fff;
  max-width:1120px; margin:0 auto; padding:8px 0 40px;
}
#tradein-form .tf-grid{ display:grid; gap:24px; }
@media (min-width:992px){ #tradein-form .tf-grid{ grid-template-columns:1fr 360px; } }

#tradein-form .tf-card{
  background:var(--card); border:1px solid #e5e7eb; border-radius:16px;
  box-shadow:0 8px 24px rgba(15,23,42,.04);
}
#tradein-form .tf-left{ padding:20px; }
#tradein-form .tf-right{ position:relative; }
@media (min-width:992px){ #tradein-form .tf-right{ position:sticky; top:96px; height:fit-content; } }

#tradein-form .tf-summary{ padding:14px 16px; font-weight:700; color:var(--ink); }
#tradein-form .tf-price{ padding:16px; margin-top:12px; font-weight:700; color:var(--ink); }
#tradein-form .tf-hints{ list-style:none; margin:12px 0 0; padding:12px 16px; color:var(--muted); }
#tradein-form .tf-hints li{ padding:6px 0; border-bottom:1px dashed #e5e7eb; }
#tradein-form .tf-hints li:last-child{ border:0; }

#tradein-form .tf-label{
  display:block; font-weight:600; color:#0f172a; margin:8px 0 6px;
}
#tradein-form .tf-note{
  margin-top:10px; padding:12px 16px;
  background:#f0fff4; border:1px solid #bbf7d0; border-radius:12px; color:#065f46;
}

/* ======================================================================
   CF7 – EGYSÉGES MEZŐK
   ====================================================================== */
#tradein-form .wpcf7 input[type="text"],
#tradein-form .wpcf7 input[type="email"],
#tradein-form .wpcf7 input[type="tel"],
#tradein-form .wpcf7 select,
#tradein-form .wpcf7 textarea{
  width:100%; border:1px solid #e5e7eb; background:#fff; border-radius:12px;
  padding:14px 16px; font-size:16px; line-height:1.35; color:var(--ink);
  -webkit-text-fill-color:var(--ink); text-indent:0; opacity:1;
  transition:all .15s ease; outline:none; box-sizing:border-box; margin-bottom:12px;
}
#tradein-form .wpcf7 textarea{ min-height:140px; }

#tradein-form .wpcf7 select{
  appearance:none; -webkit-appearance:none; -moz-appearance:none;
  background:#fff;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='%2364748b'><path d='M7 10l5 5 5-5z'/></svg>");
  background-repeat:no-repeat; background-position:right 14px center; background-size:18px 18px;
  padding-right:40px; color:var(--ink)!important; -webkit-text-fill-color:var(--ink)!important; text-shadow:none!important;
}
#tradein-form .wpcf7 select:has(option[value=""]:checked){
  color:var(--muted)!important; -webkit-text-fill-color:var(--muted)!important;
}
#tradein-form .wpcf7-form-control-wrap{ font-size:inherit!important; }

#tradein-form .wpcf7 input:focus,
#tradein-form .wpcf7 select:focus,
#tradein-form .wpcf7 textarea:focus{
  border-color:var(--brand); box-shadow:0 0 0 3px rgba(34,197,94,.15);
}

#tradein-form .wpcf7 .wpcf7-not-valid-tip{ color:#ef4444; font-size:13px; margin:-6px 0 10px; }
#tradein-form .wpcf7-form-control-wrap[data-name="szin_ui"] .wpcf7-not-valid-tip,
#tradein-form .wpcf7-form-control-wrap[data-name="allapot_ui"] .wpcf7-not-valid-tip,
#tradein-form .wpcf7-form-control-wrap[data-name="aksi_sav_ui"] .wpcf7-not-valid-tip{ display:none!important; }

#tradein-form .wpcf7 input[type="submit"]{
  width:100%;
  background:var(--brand); border:0; color:#fff; border-radius:999px; padding:14px 22px;
  font-weight:700; font-size:16px; cursor:pointer;
  transition:transform .06s ease, box-shadow .2s ease, opacity .2s ease;
  box-shadow:0 6px 18px rgba(34,197,94,.25); margin-top:8px; min-height:52px;
}
#tradein-form .wpcf7 input[type="submit"]:hover{ transform:translateY(-1px); }
#tradein-form .wpcf7 input[type="submit"][disabled]{ opacity:.6; cursor:not-allowed; box-shadow:none; }

#model-display{ font-weight:700; background:#f1f5f9; border-color:#e2e8f0; }
#cf7-price-box{ border:2px solid rgba(34,197,94,.18); background:linear-gradient(180deg,#fff 0%,#f8fdf9 100%); }

.sr-only{ position:absolute!important; left:-9999px!important; width:1px!important; height:1px!important; overflow:hidden!important; }

/* --- UI selectek: hard reset, hogy ne csússzon a szöveg --- */
#tradein-form #szin_ui, #tradein-form #allapot_ui, #tradein-form #aksi_ui{
  appearance:none!important; -webkit-appearance:none!important; -moz-appearance:none!important;
  background:#fff!important; background-clip:border-box!important; -webkit-background-clip:border-box!important;
  color:var(--ink)!important; -webkit-text-fill-color:var(--ink)!important; text-indent:0!important; text-shadow:none!important;
  font:500 16px/1.35 inherit!important; min-height:48px!important; padding:14px 40px 14px 16px!important;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='%2364748b'><path d='M7 10l5 5 5-5z'/></svg>")!important;
  background-repeat:no-repeat!important; background-position:right 14px center!important; background-size:18px 18px!important;
}
#tradein-form #szin_ui:has(option[value='']:checked),
#tradein-form #allapot_ui:has(option[value='']:checked),
#tradein-form #aksi_ui:has(option[value='']:checked){
  color:var(--muted)!important; -webkit-text-fill-color:var(--muted)!important;
}
#tradein-form .wpcf7-form-control-wrap[data-name="szin_ui"],
#tradein-form .wpcf7-form-control-wrap[data-name="allapot_ui"],
#tradein-form .wpcf7-form-control-wrap[data-name="aksi_sav_ui"]{ font-size:inherit!important; line-height:inherit!important; }

/* ======================================================================
   AKKUMULÁTOR – A KÉP MAGA A CSÚSZKA (v2, javított)
   ====================================================================== */
#tradein-form .battery-row{
  position:relative;
  width:100%;               /* mobilon is teljes szélesség */
  margin:8px 0 12px;
}
#battery-meter{
  /* állítható paraméterek */
  --shell:#0b1324;            /* külső héj */
  --well:#0c1730;             /* belső „kút” */
  --r:18px;                   /* lekerekítés */
  --b:4px;                    /* külső keret vastagság */
  --px:px;                  /* !!! fixálva: korábban elütés volt */
  --py:14px;
  --h:82px;                   /* magasság */
  --pct:80;                   /* JS írja át 0..100 */
  --mix: color-mix(in lch, #ef4444 calc(100% - (var(--pct)*1%)), #22c55e calc(var(--pct)*1%));
  --hue: calc( var(--pct) * 1.2 );
  --juice: var(--mix, hsl(var(--hue) 80% 45%));

  position:relative;
  height:var(--h);
  border-radius:var(--r);
  border:var(--b) solid var(--shell);
  padding:var(--py) var(--px);
  box-shadow:
    inset 0 0 0 2px rgba(255,255,255,.06),
    inset 0 12px 30px rgba(0,0,0,.25),
    0 2px 12px rgba(11,19,36,.12);

  /* 1) töltés sáv  2) kút háttér */
  background-image:
    linear-gradient(90deg, var(--juice), var(--juice)),
    linear-gradient(180deg, var(--well) 0%, #0a1224 100%);
  background-repeat:no-repeat, no-repeat;
  background-size: calc(var(--pct)*1%) 100%, 100% 100%;
  background-position: left center, 0 0;
  background-clip: content-box, padding-box;
}
/* sapka */
#battery-meter::after{
  content:""; position:absolute;
  right: calc(-1 * var(--b) + 2px);
  top: 50%; translate: 0 -50%;
  width: 16px; height: calc(100% - 28px);
  border-radius: 6px; background: var(--shell);
  box-shadow: inset 0 0 0 2px rgba(255,255,255,.06), 0 2px 8px rgba(0,0,0,.25);
}
/* csillanás */
#battery-meter::before{
  content:""; position:absolute;
  left: calc(var(--b) + var(--px) + 18px);
  right: calc(var(--b) + var(--px) + 18px);
  top: calc(var(--b) + var(--py) + 6px);
  height: 20px; border-radius:12px; filter:blur(.6px); pointer-events:none;
}

/* RANGE – az akku fölött, láthatatlan */
#tradein-form .battery-row input[type="range"]{
  position:absolute; inset:0; width:100%; height:100%;
  -webkit-appearance:none; appearance:none;
  opacity:0; cursor:pointer; z-index:5;
}

/* ======================================================================
   UPLOAD – DROP-ZONE + PREVIEWS
   ====================================================================== */
#tradein-form .tf-upload { margin-top: 12px; }
#tradein-form .tf-upload-title { display:block; font-weight:700; color:#0f172a; margin:0 0 10px; }

#tradein-form .tf-drop{
  position: relative; display: grid; place-items: center; gap: 8px;
  padding: 22px 18px; border: 2px dashed #cbd5e1; border-radius: 14px;
  background: linear-gradient(180deg,#f8fafc,#f1f5f9);
  color:#475569; text-align:center;
  transition: border-color .15s ease, background .15s ease, box-shadow .2s ease;
}
#tradein-form .tf-drop:hover{ border-color:#94a3b8; }
#tradein-form .tf-drop.drag{ border-color:var(--brand); background:#f0fff4; box-shadow:0 0 0 4px rgba(34,197,94,.10) inset; }

#tradein-form .tf-drop-icon{
  width:44px; height:44px; border-radius:12px;
  background:linear-gradient(#22c55e,#16a34a);
  box-shadow:0 6px 16px rgba(34,197,94,.25);
  -webkit-mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='%23fff' d='M12 5v9m0 0l3.5-3.5M12 14l-3.5-3.5M4 17.5V12a8 8 0 0116 0v5.5M7 17.5h10'/></svg>") center/24px 24px no-repeat;
          mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='%23fff' d='M12 5v9m0 0l3.5-3.5M12 14l-3.5-3.5M4 17.5V12a8 8 0 0116 0v5.5M7 17.5h10'/></svg>") center/24px 24px no-repeat;
}
#tradein-form .tf-drop-text{ font-size:14px; }
#tradein-form .tf-drop-text strong{ color:#0f172a; }
#tradein-form .tf-drop-btn{
  position:relative; z-index:2; display:inline-block;
  margin-left:.25rem; padding:8px 12px; border-radius:999px;
  background:var(--brand); color:#fff; font-weight:700; cursor:pointer;
}
#tradein-form .tf-drop input[type="file"].tf-file{
  position:absolute; inset:0; width:100%; height:100%;
  opacity:0; cursor:pointer; z-index:1;
}

#tradein-form .tf-upload-hint{ display:block; color:#64748b; margin:10px 0 8px; }
#tradein-form .tf-upload-errors{ color:#b91c1c; font-size:13px; margin:6px 0; }

#tradein-form .tf-previews{ display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:10px; }
@media (max-width:900px){ #tradein-form .tf-previews{ grid-template-columns:repeat(4,1fr); } }
@media (max-width:600px){ #tradein-form .tf-previews{ grid-template-columns:repeat(3,1fr); } }
@media (max-width:420px){ #tradein-form .tf-previews{ grid-template-columns:repeat(2,1fr); } }

#tradein-form .tf-previews .thumb{
  position:relative; border-radius:12px; overflow:hidden; background:#e2e8f0;
  box-shadow:0 2px 10px rgba(15,23,42,.10);
}
#tradein-form .tf-previews .thumb img{ display:block; width:100%; aspect-ratio:1/1; object-fit:cover; }
#tradein-form .tf-previews .thumb .remove{
  position:absolute; top:6px; right:6px; width:26px; height:26px;
  display:grid; place-items:center; border-radius:8px; cursor:pointer;
  background:rgba(0,0,0,.45); color:#fff; font-size:16px; line-height:1;
  transition:background .15s ease, transform .1s ease;
}
#tradein-form .tf-previews .thumb .remove:hover{ background:#ef4444; transform:scale(1.05); }

#tradein-form .tf-filechip{
  padding:10px 12px; border-radius:10px; background:#f1f5f9; border:1px solid #e2e8f0;
  color:#0f172a; display:flex; align-items:center; justify-content:center;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}

/* ======================================================================
   MOBIL FINOMHANGOLÁS
   ====================================================================== */
@media (max-width: 600px){
  #tradein-form .tf-grid{ gap:16px; }
  #tradein-form .tf-left{ padding:14px; }
  #tradein-form .tf-card{ border-radius:14px; }
  #tradein-form .wpcf7 input[type="text"],
  #tradein-form .wpcf7 input[type="email"],
  #tradein-form .wpcf7 input[type="tel"],
  #tradein-form .wpcf7 select{ min-height:48px; padding:12px 14px; }
  #tradein-form .wpcf7 select{ background-position:right 12px center; }

  /* akkumulátor kompaktabb */
  #battery-meter{
    --h:64px; --b:3px; --px:14px; --py:10px; --r:16px;
  }
  #battery-meter::after{ width:12px; height:calc(100% - 22px); }
  #battery-meter::before{
    left: calc(var(--b) + var(--px) + 14px);
    right: calc(var(--b) + var(--px) + 14px);
    top: calc(var(--b) + var(--py) + 5px);
    height: 16px;
  }

  /* feltöltő zóna */
  #tradein-form .tf-drop{ padding:16px; }
  #tradein-form .tf-drop-btn{ padding:8px 12px; }
  #tradein-form .tf-upload-hint{ font-size:13px; }
}/* End custom CSS */