/* =========================================================================
   LAPSZABÁSZAT — child theme egyedi CSS
   ========================================================================= */

/* -------------------------------------------------------------------------
   1) UserPro — BELÉPÉSI FOLYAMAT (login / register / reset / change / resend)
   -------------------------------------------------------------------------
   HATÓKÖR: a konténer `data-template` attribútuma.

   Miért ez, és miért mind az öt sablon?
   A „Fiók létrehozása” / „Elfelejtett jelszó” kattintás a
   `userpro_shortcode_template('update', …)`-en át
   **`jQuery(container).replaceWith(response)`**-t hív → a TELJES `.userpro`
   elem lecserélődik egy másik sablonra, UGYANAZON A HELYEN. Ha csak a
   login-t stílusoznánk, a váltás pillanatában a kártya szétesne és nyers
   UserPro-űrlap ugrana be. Ezért az egész folyamatot lefedjük.

   A `view` / `edit` / `card` / `list` sablonok SZÁNDÉKOSAN kimaradnak —
   azok a „Fiókom” munkakörhöz tartoznak.

   Ugyanez a szabálykészlet szolgálja ki a /rendeles/ és /projektjeim/
   oldalba ágyazott shortcode-ot ÉS a UserPro saját /profile/login/ oldalát.

   A UserPro sablonjait NEM módosítjuk. A bal oldali márkapanel `::before`
   pszeudo-elem → plugin-frissítés nem viszi el.

   ⚠️ MIÉRT ENNYI `!important`?
   Mert a plugin is azzal dolgozik, és nélküle veszítünk:
     • css/userpro.css      — input `padding` (0 8px), `height` (30px),
                              `font-size` (13px), `width`, `margin`
     • css/userpro.min.css  — gomb `height:29px`, `line-height:29px`,
                              `padding:0 10px`, `margin-right:15px`,
                              `font-weight:normal`, `transition:none`;
                              submit: `display:inline-block`
     • skins/pure/style.css (dev) és skins/elegant/style.css (éles) —
                              input `border`/`background`/`box-shadow`/
                              `color:#aaa`, gomb `background:#444`,
                              `border-radius:3px`, label `color`/`font-weight`
   ELV: `!important` CSAK ott, ahol a plugin is azt teszi. A layout
   (grid, float-oldás) sima specificitással nyer.

   ⚠️ SPECIFICITÁS — ha új szabályt írsz ide, SZÁMOLD KI!
   A hatókör `.userpro:is([data-template=…])` csak **(0,2,0)**. A plugin
   viszont hosszú, elem-nehéz szelektorokkal dolgozik, pl.:
       div.userpro-submit input[type="submit"].userpro-button   → (0,3,2)
       div.userpro-input label.userpro-checkbox.hide-field       → (0,3,2)
       div.userpro-float div.userpro-input                       → (0,2,2)
   Az `!important` NEM dönt specificitás-egyezésnél: ha mindkét oldal
   `!important`-os, a specifikusabb nyer. Ezért a szabályokba be kell venni
   a szülő-osztályt is (`.userpro-submit .userpro-button`,
   `.userpro-input label.userpro-checkbox`) → (0,4,0) ill. (0,4,1).
   Enélkül a gomb 20px magas marad, a checkbox-felirat pedig 11px UPPERCASE.

   Megjegyzés: a shortcode generál egy inline <style>-t
   (`div.userpro-<ID> { max-width:600px; font-family:Montserrat }`), annak
   specificitása (0,1,1) — a mi (0,2,0)-ás szabályaink verik.

   Betűk: Montserrat / Source Sans Pro — a Kadence tölti be.
   ------------------------------------------------------------------------- */

:root{
  --lapsz-narancs:      #E77817;
  --lapsz-narancs-sotet:#c96410;
  --lapsz-turkiz:       #0F868C;
  --lapsz-turkiz-sotet: #0a5f64;
  --lapsz-szoveg:       #333333;
  --lapsz-halvany:      #6b7280;
  --lapsz-vonal:        #e3e6ea;
  --lapsz-radius:       14px;
  --lapsz-radius-sm:    9px;
}

/* ============================== KÁRTYA VÁZ ============================== */

.userpro:is([data-template="login"],[data-template="register"],[data-template="reset"],[data-template="change"],[data-template="resend"],[data-template="edit"]){
  max-width:960px;
  margin:0 auto 30px;
  display:grid;
  grid-template-columns:0.8fr 1fr;
  grid-template-rows:auto 1fr;
  background:#fff;
  border-radius:var(--lapsz-radius);
  box-shadow:0 1px 2px rgba(16,24,40,.04), 0 20px 50px -14px rgba(16,24,40,.18);
  overflow:hidden;
  font-family:'Source Sans Pro',sans-serif;
  font-size:17px;
  font-weight:400;
  line-height:1.6;
  color:var(--lapsz-szoveg);
}

/* Bal oldali márkapanel — a belépési folyamat sablonjain.
   FIGYELEM: az `edit` (Fiókom) SZÁNDÉKOSAN kimarad: ott a bal oszlopot egy
   valódi elem (.lapsz-account-nav) tölti ki, mert linkeknek kell benne lenniük
   (Projektjeim, Kilépés) — azt egy ::before pszeudo-elem nem tudja.
   A claim szövege ITT szerkeszthető (\A = sortörés).                        */
.userpro:is([data-template="login"],[data-template="register"],[data-template="reset"],[data-template="change"],[data-template="resend"])::before{
  grid-area:1 / 1 / 3 / 2;
  content:"Bútorlap méretre szabva,\A néhány kattintással.";
  white-space:pre-line;
  display:flex;
  align-items:flex-end;
  padding:48px 40px;
  background:
    radial-gradient(130% 80% at 0% 0%, rgba(231,120,23,.34) 0%, rgba(231,120,23,0) 58%),
    linear-gradient(165deg, var(--lapsz-turkiz) 0%, var(--lapsz-turkiz-sotet) 100%);
  font-family:'Montserrat',sans-serif;
  font-size:26px;
  font-weight:600;
  line-height:1.38;
  letter-spacing:-.015em;
  color:#fff;
}

/* A UserPro tele van float-záró divekkel — a .userpro-input BELSEJÉBEN is.
   ⚠️ `!important` KELL: a UserPro JS-e INLINE `style="display: block;"`-ot tesz
   rájuk (16-ból 6-ra), az pedig minden stíluslap-szabályt ver. Blokk-elrendezésben
   ez ártalmatlan volt (0 magas divek), DE a Fiókom kétoszlopos RÁCSÁBAN minden
   ilyen div egy rács-CELLÁT foglalna → szétcsúsznának a mezőpárok.            */
.userpro:is([data-template="login"],[data-template="register"],[data-template="reset"],[data-template="change"],[data-template="resend"],[data-template="edit"]) .userpro-clear{
  display:none !important;
}
.userpro:is([data-template="login"],[data-template="register"],[data-template="reset"],[data-template="change"],[data-template="resend"],[data-template="edit"]) .userpro-close-popup{
  display:none;
}

/* ================================ FEJLÉC =============================== */

.userpro:is([data-template="login"],[data-template="register"],[data-template="reset"],[data-template="change"],[data-template="resend"],[data-template="edit"]) > .userpro-head{
  grid-area:1 / 2 / 2 / 3;
  padding:52px 52px 0;
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:16px;
  border-bottom:0;             /* skin: 1px solid #eee */
  background:transparent;
}
.userpro:is([data-template="login"],[data-template="register"],[data-template="reset"],[data-template="change"],[data-template="resend"],[data-template="edit"]) > .userpro-head .userpro-left{
  font-family:'Montserrat',sans-serif;
  font-size:30px;
  font-weight:700;
  line-height:1.2;
  letter-spacing:-.02em;
  float:none;
  color:var(--lapsz-szoveg) !important;   /* skin: #222 !important */
}
.userpro:is([data-template="login"],[data-template="register"],[data-template="reset"],[data-template="change"],[data-template="resend"],[data-template="edit"]) > .userpro-head .userpro-right{
  font-size:15px;
  float:none;
  text-align:right;
}
.userpro:is([data-template="login"],[data-template="register"],[data-template="reset"],[data-template="change"],[data-template="resend"],[data-template="edit"]) > .userpro-head .userpro-right a{
  color:var(--lapsz-turkiz);
  text-decoration:none;
  border-bottom:1px solid transparent;
  transition:border-color .15s ease;
  white-space:nowrap;
}
.userpro:is([data-template="login"],[data-template="register"],[data-template="reset"],[data-template="change"],[data-template="resend"],[data-template="edit"]) > .userpro-head .userpro-right a:hover{
  border-bottom-color:var(--lapsz-turkiz);
}

/* ============================= TÖRZS / MEZŐK =========================== */

.userpro:is([data-template="login"],[data-template="register"],[data-template="reset"],[data-template="change"],[data-template="resend"],[data-template="edit"]) > .userpro-body{
  grid-area:2 / 2 / 3 / 3;
  padding:26px 52px 52px;
}

.userpro:is([data-template="login"],[data-template="register"],[data-template="reset"],[data-template="change"],[data-template="resend"],[data-template="edit"]) .userpro-field{
  margin:0 0 20px 0;
}

/* A konténer `userpro-float` layoutban van: a plugin a labelt 34%-ra balra,
   az inputot 64%-ra jobbra úsztatja. Egymás alá rendezzük őket.           */
.userpro:is([data-template="login"],[data-template="register"],[data-template="reset"],[data-template="change"],[data-template="resend"],[data-template="edit"]) .userpro-label,
.userpro:is([data-template="login"],[data-template="register"],[data-template="reset"],[data-template="change"],[data-template="resend"],[data-template="edit"]) .userpro-input{
  float:none;
  width:100%;
  margin:0;
}

.userpro:is([data-template="login"],[data-template="register"],[data-template="reset"],[data-template="change"],[data-template="resend"],[data-template="edit"]) .userpro-label{
  display:flex;
  align-items:center;
  gap:5px;
  margin-bottom:7px;
}
.userpro:is([data-template="login"],[data-template="register"],[data-template="reset"],[data-template="change"],[data-template="resend"],[data-template="edit"]) .userpro-label label{
  font-family:'Montserrat',sans-serif;
  font-size:12.5px;
  letter-spacing:.05em;
  text-transform:uppercase;
  /* skin: color:#444 !important; font-weight:normal !important */
  color:#5b6470 !important;
  font-weight:600 !important;
}
.userpro:is([data-template="login"],[data-template="register"],[data-template="reset"],[data-template="change"],[data-template="resend"],[data-template="edit"]) .userpro-label .required{
  float:none;
  color:var(--lapsz-narancs);
  font-size:14px;
  line-height:1;
}

/* Súgó-ikon (telefonszám, jelszó) — a skin egy help.png-t rak bele */
.userpro:is([data-template="login"],[data-template="register"],[data-template="reset"],[data-template="change"],[data-template="resend"],[data-template="edit"]) span.userpro-tip{
  float:none;
  width:15px;
  height:15px;
  opacity:.55;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='2'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M9.1 9a3 3 0 0 1 5.8 1c0 2-3 3-3 3'/%3E%3Cline x1='12' y1='17' x2='12.01' y2='17'/%3E%3C/svg%3E") no-repeat center / contain;
  transition:opacity .15s ease;
}
.userpro:is([data-template="login"],[data-template="register"],[data-template="reset"],[data-template="change"],[data-template="resend"],[data-template="edit"]) span.userpro-tip:hover{
  opacity:1;
}

/* Szöveges mezők — minden érték !important, mert a plugin is azzal írja */
.userpro:is([data-template="login"],[data-template="register"],[data-template="reset"],[data-template="change"],[data-template="resend"],[data-template="edit"]) .userpro-input input[type=text],
.userpro:is([data-template="login"],[data-template="register"],[data-template="reset"],[data-template="change"],[data-template="resend"],[data-template="edit"]) .userpro-input input[type=password]{
  box-sizing:border-box !important;
  width:100% !important;
  height:auto !important;
  padding:14px 16px !important;
  margin:0 !important;
  font-family:inherit !important;
  font-size:17px !important;
  font-weight:400 !important;
  line-height:1.4 !important;
  color:var(--lapsz-szoveg) !important;      /* skin: #aaa !important (!) */
  background:#fff !important;
  border:1.5px solid var(--lapsz-vonal) !important;
  border-radius:var(--lapsz-radius-sm) !important;
  box-shadow:none !important;                /* skin: inset 0 -1px 4px #eee */
  outline:none;
  transition:border-color .15s ease, box-shadow .15s ease;
}
.userpro:is([data-template="login"],[data-template="register"],[data-template="reset"],[data-template="change"],[data-template="resend"],[data-template="edit"]) .userpro-input input::placeholder{
  color:#a6adb8;
}
.userpro:is([data-template="login"],[data-template="register"],[data-template="reset"],[data-template="change"],[data-template="resend"],[data-template="edit"]) .userpro-input input[type=text]:hover,
.userpro:is([data-template="login"],[data-template="register"],[data-template="reset"],[data-template="change"],[data-template="resend"],[data-template="edit"]) .userpro-input input[type=password]:hover{
  border-color:#cdd3da !important;
}
.userpro:is([data-template="login"],[data-template="register"],[data-template="reset"],[data-template="change"],[data-template="resend"],[data-template="edit"]) .userpro-input input[type=text]:focus,
.userpro:is([data-template="login"],[data-template="register"],[data-template="reset"],[data-template="change"],[data-template="resend"],[data-template="edit"]) .userpro-input input[type=password]:focus{
  color:var(--lapsz-szoveg) !important;
  background:#fff !important;
  border:1.5px solid var(--lapsz-turkiz) !important;
  box-shadow:0 0 0 3px rgba(15,134,140,.15) !important;
}

/* ============================== CHECKBOXOK ============================= */
/* Három helyen fordul elő, kicsit eltérő wrapperrel:
     • login    — „Emlékezzen rám”  (.userpro-checkbox-wrap)
     • register — „Ne legyen nyilvános” (az e-mail mező .userpro-input-jában,
                   wrapper NÉLKÜL, közvetlenül az input alatt)
     • register — ÁSZF/Adatkezelés (.userpro-maxwidth + label.userpro-checkbox.full)
   Közös: a valódi input `display:none !important`, a <span> a látható
   négyzet (16×16, absolute), az állapotot a JS a `span.checked` osztállyal
   jelzi, és a skin PNG-t rak bele — azt írjuk felül.                     */

.userpro:is([data-template="login"],[data-template="register"],[data-template="reset"],[data-template="change"],[data-template="resend"],[data-template="edit"]) .userpro-field-compact{
  margin:0;
}
.userpro:is([data-template="login"],[data-template="register"],[data-template="reset"],[data-template="change"],[data-template="resend"],[data-template="edit"]) .userpro-checkbox-wrap{
  display:flex;
  align-items:flex-start;
}
.userpro:is([data-template="login"],[data-template="register"],[data-template="reset"],[data-template="change"],[data-template="resend"],[data-template="edit"]) .userpro-input label.userpro-checkbox{
  position:relative;
  display:inline-block;
  padding:0 0 0 28px;          /* plugin: 0 25px */
  margin:0;
  cursor:pointer;
  font-family:'Source Sans Pro',sans-serif;
  font-size:15.5px;
  line-height:1.5;
  text-transform:none;         /* plugin: .hide-field → UPPERCASE, 11px */
  color:var(--lapsz-halvany) !important;
  font-weight:400 !important;
}
/* az e-mail alatti „Ne legyen nyilvános” kap egy kis levegőt */
.userpro:is([data-template="register"]) .userpro-input > label.userpro-checkbox{
  margin-top:10px;
}
/* ÁSZF: teljes szélességű, több soros */
.userpro:is([data-template="register"]) .userpro-input label.userpro-checkbox.full{
  display:block;
  width:auto !important;
}
.userpro:is([data-template="register"]) .userpro-input label.userpro-checkbox a{
  color:var(--lapsz-turkiz);
  text-decoration:underline;
  text-underline-offset:2px;
}

.userpro:is([data-template="login"],[data-template="register"],[data-template="reset"],[data-template="change"],[data-template="resend"],[data-template="edit"]) .userpro-input label.userpro-checkbox span{
  position:absolute;
  top:1px;
  left:0;
  width:19px;
  height:19px;
  border:1.5px solid var(--lapsz-vonal);
  border-radius:5px;
  background:#fff none;        /* a skin unchecked-checkbox.png-je helyett */
  transition:background-color .12s ease, border-color .12s ease;
}
.userpro:is([data-template="login"],[data-template="register"],[data-template="reset"],[data-template="change"],[data-template="resend"],[data-template="edit"]) .userpro-input label.userpro-checkbox:hover span{
  border-color:#cdd3da;
}
.userpro:is([data-template="login"],[data-template="register"],[data-template="reset"],[data-template="change"],[data-template="resend"],[data-template="edit"]) .userpro-input label.userpro-checkbox span.checked{
  border-color:var(--lapsz-turkiz);
  background:var(--lapsz-turkiz) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E") no-repeat center / 12px;
}

/* ===================== REGISTER — SZEKCIÓ-FEJLÉC ====================== */
/* A skin szürke dobozt csinál belőle (`background:#eee; border:1px solid #eee;
   padding:5px 10px !important; color:#666 !important`). Letisztult
   szekció-címkére cseréljük.                                             */
.userpro:is([data-template="register"]) .userpro-section{
  margin:0 0 18px 0;
  padding:0 0 10px 0 !important;
  border:0;
  border-bottom:1px solid var(--lapsz-vonal);
  border-radius:0;
  background:transparent;
  text-shadow:none;
  font-family:'Montserrat',sans-serif;
  font-size:12.5px;
  font-weight:600;
  letter-spacing:.05em;
  text-transform:uppercase;
  color:#5b6470 !important;
}

/* =================== REGISTER/CHANGE — JELSZÓ-ERŐSSÉG ================= */
/* Markup: .userpro-input > span.strength-text + span.strength-container
             > span.strength-plain ×5   (a JS `.fill` osztályt ad rájuk)   */
.userpro:is([data-template="register"],[data-template="change"],[data-template="edit"]) .userpro-field-passwordstrength{
  margin:-8px 0 20px 0;
}
.userpro:is([data-template="register"],[data-template="change"],[data-template="edit"]) span.strength-text{
  float:none;
  display:block;
  padding:0 0 7px 0;
  font-size:13px;
  color:var(--lapsz-halvany);
}
.userpro:is([data-template="register"],[data-template="change"],[data-template="edit"]) span.strength-container{
  float:none;
  top:0;
  display:flex;
  gap:5px;
  width:100%;
  border:0;                    /* skin: 1px solid #dee5ec */
}
.userpro:is([data-template="register"],[data-template="change"],[data-template="edit"]) span.strength-plain{
  float:none;
  flex:1;
  width:auto;
  height:5px;
  border-radius:3px;
  background:var(--lapsz-vonal);
  transition:background-color .2s ease;
}
.userpro:is([data-template="register"],[data-template="change"],[data-template="edit"]) span.strength-plain.fill{
  background:#4ec130;
}

/* ==================== REGISTER — BIZTONSÁGI KÉRDÉS ==================== */
/* A .userpro-input-ban egy <label> van egy <span> kérdéssel és az inputtal.
   (A plugin ezt a <label>-t nem zárja le — sablonhiba, CSS-ből kezeljük.)  */
.userpro:is([data-template="register"]) .userpro-field-securityqa .userpro-input > label > span{
  display:block;
  margin-bottom:7px;
  font-size:15.5px;
  color:var(--lapsz-halvany);
}

/* ======================= REGISTER — ÁSZF BLOKK ======================== */
.userpro:is([data-template="register"]) .userpro-maxwidth{
  margin:4px 0 0 0;
  padding-top:18px;
  border-top:1px solid var(--lapsz-vonal);   /* skin: 1px solid #e5e5e5 */
}
.userpro:is([data-template="register"]) .userpro-maxwidth .userpro-input{
  margin:0 !important;
}
.userpro:is([data-template="register"]) .userpro-maxwidth .userpro-input label{
  color:var(--lapsz-halvany) !important;     /* skin: #888 !important */
}

/* ===================== RESET — INFO ÜZENET (ajax) ===================== */
.userpro:is([data-template="login"],[data-template="register"],[data-template="reset"],[data-template="change"],[data-template="resend"],[data-template="edit"]) .userpro-message{
  margin:0 0 22px 0;
}
.userpro:is([data-template="login"],[data-template="register"],[data-template="reset"],[data-template="change"],[data-template="resend"],[data-template="edit"]) .userpro-message p{
  margin:0;
  padding:14px 16px !important;   /* plugin: 10px !important */
  border:1px solid #cfe9ea;
  border-left:3px solid var(--lapsz-turkiz);
  border-radius:var(--lapsz-radius-sm);
  background:#f2fafa;
  color:var(--lapsz-szoveg);
  font-size:15.5px;
  line-height:1.55;
}

/* ================================ GOMBOK =============================== */
/* A gombokat a userpro.min.css minden releváns tulajdonságon `!important`-tal
   köti meg (height:29px, line-height:29px, padding:0 10px, margin-right:15px,
   font-weight:normal, transition:none; a submitre ráadásul
   display:inline-block !important) → itt szinte mindenhol kell.
   (A pluginban van `fullwidth-block` osztály ugyanerre, de azt csak
   sablon-módosítással lehetne felvinni.)                                  */

.userpro:is([data-template="login"],[data-template="register"],[data-template="reset"],[data-template="change"],[data-template="resend"],[data-template="edit"]) .userpro-submit{
  margin:28px 0 0 0;
  border-top:0;                /* skin: 1px solid #e5e5e5 */
}
.userpro:is([data-template="login"],[data-template="register"],[data-template="reset"],[data-template="change"],[data-template="resend"],[data-template="edit"]) .userpro-social-connect:empty{
  display:none;
}

.userpro:is([data-template="login"],[data-template="register"],[data-template="reset"],[data-template="change"],[data-template="resend"],[data-template="edit"]) .userpro-submit .userpro-button{
  box-sizing:border-box;
  font-family:'Montserrat',sans-serif;
  letter-spacing:.01em;
  text-align:center;
  cursor:pointer;
  -webkit-appearance:none;
  box-shadow:0 1px 2px rgba(16,24,40,.05);
  /* a plugin/skin !important-jai ellen
     (`div.userpro-submit input { font-size:13px !important }` és
      `div.userpro input { font-size:12px !important }` miatt a méret is)  */
  font-size:16px !important;
  display:block !important;
  width:100% !important;
  height:auto !important;
  line-height:1.4 !important;
  padding:15px 20px !important;
  margin:0 !important;
  vertical-align:baseline !important;
  font-weight:600 !important;
  text-decoration:none !important;
  background:var(--lapsz-narancs) !important;
  color:#fff !important;
  border:1.5px solid var(--lapsz-narancs) !important;
  border-radius:var(--lapsz-radius-sm) !important;
  text-shadow:none !important;
  transition:background .15s ease, border-color .15s ease, transform .06s ease, box-shadow .15s ease !important;
}
.userpro:is([data-template="login"],[data-template="register"],[data-template="reset"],[data-template="change"],[data-template="resend"],[data-template="edit"]) .userpro-submit .userpro-button:hover{
  background:var(--lapsz-narancs-sotet) !important;
  border-color:var(--lapsz-narancs-sotet) !important;
  box-shadow:0 8px 18px -6px rgba(231,120,23,.5);
}
.userpro:is([data-template="login"],[data-template="register"],[data-template="reset"],[data-template="change"],[data-template="resend"],[data-template="edit"]) .userpro-submit .userpro-button:active{
  top:0 !important;            /* skin: position:relative; top:0 !important */
  transform:translateY(1px);
}
.userpro:is([data-template="login"],[data-template="register"],[data-template="reset"],[data-template="change"],[data-template="resend"],[data-template="edit"]) .userpro-submit .userpro-button:focus-visible{
  outline:3px solid rgba(231,120,23,.4);
  outline-offset:2px;
}

/* Másodlagos gomb (login: „Fiók létrehozása”, reset: „Jelszó megváltoztatása”) */
.userpro:is([data-template="login"],[data-template="register"],[data-template="reset"],[data-template="change"],[data-template="resend"],[data-template="edit"]) .userpro-submit .userpro-button.secondary{
  box-shadow:none;
  margin:11px 0 0 0 !important;   /* plugin: margin-right:15px !important */
  background:#fff !important;
  color:var(--lapsz-turkiz) !important;
  border:1.5px solid var(--lapsz-vonal) !important;
}
.userpro:is([data-template="login"],[data-template="register"],[data-template="reset"],[data-template="change"],[data-template="resend"],[data-template="edit"]) .userpro-submit .userpro-button.secondary:hover{
  background:#f5fafa !important;
  border-color:var(--lapsz-turkiz) !important;
  box-shadow:none;
}

/* A loading gif-et a jQuery .show()-ja így is meg tudja jeleníteni */
.userpro:is([data-template="login"],[data-template="register"],[data-template="reset"],[data-template="change"],[data-template="resend"],[data-template="edit"]) .userpro-loading{
  display:none;
  margin:12px auto 0;
}

/* =========================================================================
   2) FIÓKOM  (UserPro `edit` sablon)
   -------------------------------------------------------------------------
   Az `edit` a fenti közös szabályokat (mezők, címkék, gombok, checkboxok,
   szekciók, jelszó-erősség) ÖRÖKLI — itt csak az eltérések vannak.

   Szerkezeti különbség a belépő sablonokhoz képest:
     • NINCS `.userpro-head` — helyette `.userpro-centered` (avatar, név,
       jelvények, „Profil megtekintése", Kilépés) → ELREJTVE
     • `.userpro-alert` („Megjegyzés írása…" doboz, a UserPro
       custom-alerts.php-jából, szintén a .userpro-body ELŐTT) → ELREJTVE
     • a bal oszlop egy VALÓDI elem: `.lapsz-account-nav`, amit a child theme
       functions.php-ja szúr be a `userpro_after_profile_head` hookon

   Az űrlap mezői: Név, Telefonszám, E-mail cím, Jelszó, Jelszó megerősítése.
   Döntés (2026-07-17, felhasználóval egyeztetve): a közösségi elemek mind
   rejtve; „Igazolás kérése" rejtve; „Profil törlése" marad, de visszafogottan.
   ========================================================================= */

.userpro[data-template="edit"]{
  grid-template-rows:1fr;      /* nincs külön fejléc-sor, mint a login-nál */
}
.userpro[data-template="edit"] .lapsz-account-nav{
  grid-area:1 / 1 / 2 / 2;
}

/* A UserPro közösségi körítése — mind a .userpro KÖZVETLEN gyereke,
   tehát grid-elem lenne; display:none kiveszi őket a rácsból.            */
.userpro[data-template="edit"] > .userpro-centered,
.userpro[data-template="edit"] > .userpro-alert{
  display:none;
}

/* ------------------------- bal oldali nav-panel ------------------------ */
/* Két helyen használjuk, ezért nincs a `.userpro[data-template=edit]`-hez
   kötve: (1) a UserPro `edit` sablonjában (hookkal beszúrva),
   (2) a `[lapsz_account_home]` shortcode-ban. A rácsbeli ELHELYEZÉSE
   kontextusonként külön szabály (lásd lentebb).                          */

.lapsz-account-nav{
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  gap:36px;
  padding:48px 40px;
  background:
    radial-gradient(130% 80% at 0% 0%, rgba(231,120,23,.34) 0%, rgba(231,120,23,0) 58%),
    linear-gradient(165deg, var(--lapsz-turkiz) 0%, var(--lapsz-turkiz-sotet) 100%);
  color:#fff;
}
.lapsz-account-nav__eyebrow{
  margin:0 0 6px 0;
  font-family:'Montserrat',sans-serif;
  font-size:12.5px;
  font-weight:600;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:rgba(255,255,255,.72);
}
.lapsz-account-nav__name{
  margin:0;
  font-family:'Montserrat',sans-serif;
  font-size:26px;
  font-weight:600;
  line-height:1.25;
  letter-spacing:-.015em;
  color:#fff;
}
.lapsz-account-nav__links{
  display:flex;
  flex-direction:column;
  gap:10px;
}
.lapsz-account-nav__link{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:13px 16px;
  border:1px solid rgba(255,255,255,.28);
  border-radius:var(--lapsz-radius-sm);
  background:rgba(255,255,255,.10);
  font-family:'Montserrat',sans-serif;
  font-size:15px;
  font-weight:600;
  color:#fff;
  text-decoration:none;
  transition:background-color .15s ease, border-color .15s ease, transform .06s ease;
}
.lapsz-account-nav__link::after{
  content:"";
  flex:none;
  width:16px;
  height:16px;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='9 18 15 12 9 6'/%3E%3C/svg%3E") no-repeat center / contain;
  opacity:.75;
}
.lapsz-account-nav__link:hover{
  background:rgba(255,255,255,.18);
  border-color:rgba(255,255,255,.5);
}
.lapsz-account-nav__link:active{
  transform:translateY(1px);
}
.lapsz-account-nav__link--muted{
  border-color:transparent;
  background:transparent;
  font-weight:400;
  color:rgba(255,255,255,.78);
}
.lapsz-account-nav__link--muted:hover{
  background:rgba(255,255,255,.10);
  border-color:transparent;
  color:#fff;
}
/* Az `edit` sablonban a nav a `.userpro` konténerbe van injektálva, ahol a
   `pure`/`elegant` skin `div.userpro a{color:#444}` szabálya (0,1,1) beleszól
   és elszürkíti a linkeket. A `/profile/` főoldalon (nincs `.userpro`) ez nem
   jelentkezik. Magasabb specificitással (0,2,0) állítjuk vissza a fehéret. */
.userpro .lapsz-account-nav__link{ color:#fff; }
.userpro .lapsz-account-nav__link--muted{ color:rgba(255,255,255,.78); }
.userpro .lapsz-account-nav__link--muted:hover{ color:#fff; }

/* ------------------------------ jobb oszlop ---------------------------- */

.userpro[data-template="edit"] > .userpro-body{
  grid-area:1 / 2 / 2 / 3;
  padding:48px 52px 52px;
}
/* Az `edit`-nek nincs .userpro-head-je → a címet CSS-ből adjuk */
.userpro[data-template="edit"] > .userpro-body::before{
  content:"Személyes adatok";
  display:block;
  margin-bottom:26px;
  font-family:'Montserrat',sans-serif;
  font-size:30px;
  font-weight:700;
  line-height:1.2;
  letter-spacing:-.02em;
  color:var(--lapsz-szoveg);
}

/* ---------------------- kétoszlopos mező-elrendezés -------------------- */
/* Az űrlap rács lesz; alapból MINDEN mező teljes szélességű, és csak a két
   összetartozó pár kerül egymás mellé (Név+Telefonszám, Jelszó+megerősítés)
   — így rövidebb az oldal. A rejtett inputok (`input[type=hidden]`) a
   böngésző alap `display:none`-ja miatt nem foglalnak rács-cellát, a
   `.userpro-clear` divekt pedig mi rejtjük el.

   ⚠️ Specificitás: az alap „teljes szélesség” szabály (0,4,1); ezért a
   pár-szabályokba beletesszük a `.userpro-field` osztályt is → (0,5,1),
   különben nem nyernének.                                                */
.userpro[data-template="edit"] > .userpro-body > form{
  display:grid;
  grid-template-columns:1fr 1fr;
  column-gap:18px;
  align-items:start;
}
.userpro[data-template="edit"] > .userpro-body > form > .userpro-field,
.userpro[data-template="edit"] > .userpro-body > form > .userpro-section{
  grid-column:1 / -1;
}
.userpro[data-template="edit"] > .userpro-body > form > .userpro-field.userpro-field-first_name,
.userpro[data-template="edit"] > .userpro-body > form > .userpro-field.userpro-field-user_pass{
  grid-column:1 / 2;
}
.userpro[data-template="edit"] > .userpro-body > form > .userpro-field.userpro-field-telefonszam,
.userpro[data-template="edit"] > .userpro-body > form > .userpro-field.userpro-field-user_pass_confirm{
  grid-column:2 / 3;
}

/* Az `edit` szekció-fejlécei (a register-rel azonos stílus) */
.userpro[data-template="edit"] .userpro-section{
  margin:0 0 18px 0;
  padding:0 0 10px 0 !important;
  border:0;
  border-bottom:1px solid var(--lapsz-vonal);
  border-radius:0;
  background:transparent;
  text-shadow:none;
  font-family:'Montserrat',sans-serif;
  font-size:12.5px;
  font-weight:600;
  letter-spacing:.05em;
  text-transform:uppercase;
  color:#5b6470 !important;
}

/* --------------------------- gombok az űrlapon ------------------------- */

/* „Igazolás kérése” — elrejtve (döntés).
   A `.userpro-button` alap `display:block !important`-ja miatt kell ide is. */
.userpro[data-template="edit"] .userpro-submit .userpro-button.popup_userpro-request_verify{
  display:none !important;
}

/* „Profil törlése” — marad (GDPR), de visszafogottan: szöveges link-szerű
   gomb a mentés alatt, nem versenyez vele. A skin `.red`-je !important-os. */
.userpro[data-template="edit"] .userpro-submit .userpro-button.red{
  width:auto !important;
  margin:16px auto 0 !important;
  padding:6px 4px !important;
  font-family:'Source Sans Pro',sans-serif !important;
  font-size:14.5px !important;
  font-weight:400 !important;
  text-decoration:underline !important;
  text-underline-offset:3px;
  background:transparent !important;
  color:var(--lapsz-halvany) !important;
  border:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
}
.userpro[data-template="edit"] .userpro-submit .userpro-button.red:hover{
  background:transparent !important;
  color:#b42318 !important;      /* csak hoverre válik veszély-jelzésűvé */
  box-shadow:none !important;
}

/* =========================================================================
   3) FIÓK FŐOLDAL  ([lapsz_account_home] shortcode, a /profile/ oldalon)
   -------------------------------------------------------------------------
   Ez váltja le a UserPro `view` sablonját (Bootstrap-alapú közösségi profil:
   borítókép, avatar, jelvények — idegen ettől az oldaltól).
   Ugyanaz a kártya-váz, mint a belépőnél/Fiókomnál; a jobb oszlopban két
   „fül” (valójában link): Adataim → /profile/edit/, Projektjeim → /projektjeim/.
   ========================================================================= */

.lapsz-account{
  max-width:960px;
  margin:0 auto 30px;
  display:grid;
  grid-template-columns:0.8fr 1fr;
  grid-template-rows:1fr;
  background:#fff;
  border-radius:var(--lapsz-radius);
  box-shadow:0 1px 2px rgba(16,24,40,.04), 0 20px 50px -14px rgba(16,24,40,.18);
  overflow:hidden;
  font-family:'Source Sans Pro',sans-serif;
  font-size:17px;
  line-height:1.6;
  color:var(--lapsz-szoveg);
}
.lapsz-account .lapsz-account-nav{
  grid-area:1 / 1 / 2 / 2;
}

.lapsz-account__body{
  grid-area:1 / 2 / 2 / 3;
  padding:48px 52px;
  display:flex;
  flex-direction:column;
}
.lapsz-account__title{
  margin:0 0 6px 0;
  font-family:'Montserrat',sans-serif;
  font-size:30px;
  font-weight:700;
  line-height:1.2;
  letter-spacing:-.02em;
  color:var(--lapsz-szoveg);
}
.lapsz-account__lead{
  margin:0 0 26px 0;
  font-size:17px;
  color:var(--lapsz-halvany);
}

/* ---------------------------- a két „fül” ------------------------------ */

.lapsz-account__tiles{
  display:flex;
  flex-direction:column;
  gap:14px;
}
.lapsz-account-tile{
  position:relative;
  display:block;
  padding:22px 52px 22px 68px;
  border:1.5px solid var(--lapsz-vonal);
  border-radius:var(--lapsz-radius-sm);
  background:#fff;
  text-decoration:none;
  transition:border-color .15s ease, box-shadow .15s ease, transform .06s ease;
}
.lapsz-account-tile:hover{
  border-color:var(--lapsz-turkiz);
  box-shadow:0 10px 24px -12px rgba(15,134,140,.45);
}
.lapsz-account-tile:active{
  transform:translateY(1px);
}
.lapsz-account-tile:focus-visible{
  outline:3px solid rgba(15,134,140,.35);
  outline-offset:2px;
}
.lapsz-account-tile__title{
  display:block;
  margin-bottom:3px;
  font-family:'Montserrat',sans-serif;
  font-size:18px;
  font-weight:600;
  letter-spacing:-.01em;
  color:var(--lapsz-szoveg);
}
.lapsz-account-tile__desc{
  display:block;
  font-size:15.5px;
  line-height:1.45;
  color:var(--lapsz-halvany);
}

/* ikon balra — a data-icon attribútum alapján */
.lapsz-account-tile::before{
  content:"";
  position:absolute;
  top:24px;
  left:22px;
  width:28px;
  height:28px;
  border-radius:8px;
  background-color:rgba(15,134,140,.10);
  background-repeat:no-repeat;
  background-position:center;
  background-size:16px;
  transition:background-color .15s ease;
}
.lapsz-account-tile:hover::before{
  background-color:rgba(15,134,140,.18);
}
.lapsz-account-tile[data-icon="adatok"]::before{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230F868C' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2'/%3E%3Ccircle cx='12' cy='7' r='4'/%3E%3C/svg%3E");
}
.lapsz-account-tile[data-icon="projektek"]::before{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230F868C' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 16V8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73l7 4a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16z'/%3E%3Cpolyline points='3.27 6.96 12 12.01 20.73 6.96'/%3E%3Cline x1='12' y1='22.08' x2='12' y2='12'/%3E%3C/svg%3E");
}

/* nyíl jobbra */
.lapsz-account-tile::after{
  content:"";
  position:absolute;
  top:50%;
  right:22px;
  transform:translateY(-50%);
  width:18px;
  height:18px;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='9 18 15 12 9 6'/%3E%3C/svg%3E") no-repeat center / contain;
  opacity:.5;
  transition:opacity .15s ease, transform .15s ease;
}
.lapsz-account-tile:hover::after{
  opacity:1;
  transform:translateY(-50%) translateX(3px);
}

/* ================================ MOBIL ================================ */

@media (max-width:820px){
  /* Fiók főoldal */
  .lapsz-account{
    grid-template-columns:1fr;
    grid-template-rows:auto 1fr;
    border-radius:0;
    box-shadow:none;
  }
  .lapsz-account .lapsz-account-nav{
    grid-area:1 / 1 / 2 / 2;
  }
  .lapsz-account__body{
    grid-area:2 / 1 / 3 / 2;
    padding:30px 26px 40px;
  }
  .lapsz-account__title{
    font-size:24px;
  }
  .lapsz-account-tile{
    padding:18px 44px 18px 60px;
  }

  /* Fiókom: a nav-panel felülre kerül, a linkek egymás mellé */
  .userpro[data-template="edit"]{
    grid-template-rows:auto 1fr;
  }
  .lapsz-account-nav{
    grid-area:1 / 1 / 2 / 2;
    gap:18px;
    padding:26px;
  }
  .lapsz-account-nav__name{
    font-size:21px;
  }
  .lapsz-account-nav__links{
    flex-direction:row;
    flex-wrap:wrap;
  }
  .lapsz-account-nav__link{
    flex:1 1 auto;
    padding:11px 14px;
    font-size:14px;
  }
  .userpro[data-template="edit"] > .userpro-body{
    grid-area:2 / 1 / 3 / 2;
    padding:30px 26px 40px;
  }
  .userpro[data-template="edit"] > .userpro-body::before{
    font-size:24px;
    margin-bottom:20px;
  }
  /* mobilon minden mező egy oszlopban */
  .userpro[data-template="edit"] > .userpro-body > form{
    grid-template-columns:1fr;
  }
  .userpro[data-template="edit"] > .userpro-body > form > .userpro-field.userpro-field-first_name,
  .userpro[data-template="edit"] > .userpro-body > form > .userpro-field.userpro-field-user_pass,
  .userpro[data-template="edit"] > .userpro-body > form > .userpro-field.userpro-field-telefonszam,
  .userpro[data-template="edit"] > .userpro-body > form > .userpro-field.userpro-field-user_pass_confirm{
    grid-column:1 / -1;
  }
}

@media (max-width:820px){
  .userpro:is([data-template="login"],[data-template="register"],[data-template="reset"],[data-template="change"],[data-template="resend"],[data-template="edit"]){
    grid-template-columns:1fr;
    grid-template-rows:auto auto 1fr;
    border-radius:0;
    box-shadow:none;
  }
  .userpro:is([data-template="login"],[data-template="register"],[data-template="reset"],[data-template="change"],[data-template="resend"],[data-template="edit"])::before{
    grid-area:1 / 1 / 2 / 2;
    align-items:center;
    padding:30px 26px;
    font-size:20px;
    line-height:1.35;
  }
  .userpro:is([data-template="login"],[data-template="register"],[data-template="reset"],[data-template="change"],[data-template="resend"],[data-template="edit"]) > .userpro-head{
    grid-area:2 / 1 / 3 / 2;
    padding:32px 26px 0;
    flex-direction:column;
    align-items:flex-start;
    gap:5px;
  }
  .userpro:is([data-template="login"],[data-template="register"],[data-template="reset"],[data-template="change"],[data-template="resend"],[data-template="edit"]) > .userpro-head .userpro-left{
    font-size:26px;
  }
  .userpro:is([data-template="login"],[data-template="register"],[data-template="reset"],[data-template="change"],[data-template="resend"],[data-template="edit"]) > .userpro-head .userpro-right{
    text-align:left;
  }
  .userpro:is([data-template="login"],[data-template="register"],[data-template="reset"],[data-template="change"],[data-template="resend"],[data-template="edit"]) > .userpro-body{
    grid-area:3 / 1 / 4 / 2;
    padding:22px 26px 40px;
  }
}