/* DopeVill — SZERELO-SKIN (2026-09-24): a szerelői felületek a DopeVill design skill szerint.
   Flag: themes/dopevill/.dv_szerelo_skin (on | preview+sha256). CSAK a .dv-szf-skin burkolón belül hat;
   a tokenek --szf-* néven, világos (.dv-szf-skin) + sötét (html.dark-mode .dv-szf-skin) blokkban.
   Eltérés a skilltől (≥3:1 határvonal/jelölő-keret, a riportban számolva):
     világos --szf-border-strong #848A88 (a muted 75%-a fehérrel; surface 3,52 / raised 3,13);
     sötét  --szf-border-strong #727A7F (a skill #3A4146-ja surface-en 1,51 lenne; így 3,59 / 3,01);
     az input kerete border-strong (a skill 1px border-je rgba(.08) ~1,1:1 lenne).
   Világos ok/warn/err (a sötét párok világos megfelelője, ≥4,5:1): #2E6B22/#E5F1E0, #7A5500/#FBF0D6, #A3332B/#FAE5E2. */

.dv-szf-skin{
  --szf-bg:#F0F2F0; --szf-surface:#FFFFFF; --szf-raised:#F0F2F0;
  --szf-text:#1A1E20; --szf-muted:#5B6360; --szf-faint:#5B6360;
  --szf-border:rgba(0,0,0,.08); --szf-border-strong:#848A88;
  --szf-lime:#C8D400; --szf-lime-hover:#B4BF00; --szf-on-lime:#1A1E20;
  --szf-ok:#2E6B22; --szf-ok-bg:#E5F1E0; --szf-warn:#7A5500; --szf-warn-bg:#FBF0D6; --szf-err:#A3332B; --szf-err-bg:#FAE5E2;
  --szf-focus:#1A1E20;
  --szf-shadow:0 1px 2px rgba(0,0,0,.04),0 6px 18px rgba(0,0,0,.05);
  --szf-font:"Saira",system-ui,-apple-system,"Segoe UI",sans-serif;
  --szf-mono:"IBM Plex Mono",ui-monospace,"SFMono-Regular","Menlo","Consolas",monospace;
  --szf-check:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.5 8.5l3 3 6-7' fill='none' stroke='%231A1E20' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  font-family:var(--szf-font); color:var(--szf-text);
}
html.dark-mode .dv-szf-skin{
  --szf-bg:#15181A; --szf-surface:#1F2426; --szf-raised:#2C3134;
  --szf-text:#E8EAE7; --szf-muted:#9AA0A4; --szf-faint:#787E82;
  --szf-border:rgba(255,255,255,.12); --szf-border-strong:#727A7F;
  --szf-on-lime:#15181A;
  --szf-ok:#8FD27A; --szf-ok-bg:#1E2A1A; --szf-warn:#E3B45A; --szf-warn-bg:#2A2310; --szf-err:#E88A82; --szf-err-bg:#2A1715;
  --szf-focus:#F0F2F0;
  --szf-shadow:0 1px 2px rgba(0,0,0,.4);
  --szf-check:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.5 8.5l3 3 6-7' fill='none' stroke='%2315181A' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}
.dv-szf-skin *{font-family:inherit;box-sizing:border-box}

/* --- kártya --- */
.dv-szf-skin .dv-card{background:var(--szf-surface);color:var(--szf-text);border:1px solid var(--szf-border);border-radius:16px;box-shadow:var(--szf-shadow);padding:24px;margin:0 0 16px;position:relative;overflow:hidden}
.dv-szf-skin .dv-card--accent{border-left:4px solid var(--szf-lime)}
.dv-szf-skin .dv-card--bar{padding-top:30px}
.dv-szf-skin .dv-card--bar::before{content:"";position:absolute;left:0;right:0;top:0;height:6px;background:var(--szf-lime)}
.dv-szf-skin .dv-card > :last-child{margin-bottom:0}

/* --- tipográfia (a hero-összeg osztálya .dv-szs-hero: a .dv-hero a my-account.php:9 banner-osztálya) --- */
.dv-szf-skin .dv-eyebrow{display:flex;align-items:center;gap:8px;font-size:12px;font-weight:700;letter-spacing:2.5px;text-transform:uppercase;line-height:1.3;color:var(--szf-muted);margin:0 0 10px}
.dv-szf-skin .dv-eyebrow::before{content:"";flex:none;width:16px;height:3px;background:var(--szf-lime)}
html.dark-mode .dv-szf-skin .dv-eyebrow{color:var(--szf-lime)}
html.dark-mode .dv-szf-skin .dv-eyebrow::before{display:none}
.dv-szf-skin .dv-h2{font-family:var(--szf-font);font-weight:800;font-size:28px;line-height:1.2;letter-spacing:.2px;color:var(--szf-text);margin:0 0 8px;padding:0;border:0;text-transform:none}
.dv-szf-skin .dv-lead{color:var(--szf-muted);font-size:15px;font-weight:400;line-height:1.55;margin:0 0 18px}
.dv-szf-skin p{margin:0 0 12px;line-height:1.55;font-weight:400}
.dv-szf-skin .dv-muted{color:var(--szf-muted)}
.dv-szf-skin .dv-price,.dv-szf-skin .dv-num,.dv-szf-skin .dv-szs-hero{font-family:var(--szf-mono);font-weight:600;letter-spacing:-.19px}
.dv-szf-skin .dv-price{font-size:19px;line-height:1.3}
.dv-szf-skin .dv-szs-hero{display:block;font-size:clamp(28px,3.6vw,36px);line-height:1.1;color:var(--szf-text)}
html.dark-mode .dv-szf-skin .dv-szs-hero{color:var(--szf-lime)}
.dv-szf-skin .dv-sub{display:block;font-size:12px;color:var(--szf-muted);margin-top:6px}

/* --- linkek (szöveg + lime aláhúzás; a lime SOHA nem szövegszín világosban) --- */
.dv-szf-skin a:not(.dv-btn):not(.dv-btn-ghost){color:var(--szf-text);text-decoration:underline;text-decoration-color:var(--szf-lime);text-decoration-thickness:2px;text-underline-offset:3px}
.dv-szf-skin a:not(.dv-btn):not(.dv-btn-ghost):hover{text-decoration-thickness:3px}

/* --- gombok --- */
.dv-szf-skin .dv-btn,.dv-szf-skin .dv-btn-ghost{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-family:var(--szf-font);font-size:14px;line-height:1.2;padding:10px 16px;border-radius:8px;cursor:pointer;text-decoration:none;text-transform:none;letter-spacing:0;box-shadow:none;min-height:0;height:auto;width:auto}
.dv-szf-skin .dv-btn{background:var(--szf-lime);color:var(--szf-on-lime);border:1px solid var(--szf-lime);font-weight:600}
.dv-szf-skin .dv-btn:hover{background:var(--szf-lime-hover);border-color:var(--szf-lime-hover);color:var(--szf-on-lime)}
.dv-szf-skin .dv-btn-ghost{background:transparent;color:var(--szf-text);border:1px solid var(--szf-border-strong);font-weight:500}
.dv-szf-skin .dv-btn-ghost:hover{background:var(--szf-raised);color:var(--szf-text)}
.dv-szf-skin :is(.dv-btn,.dv-btn-ghost,a,.dv-check):focus-visible{outline:2px solid var(--szf-focus);outline-offset:1px}
.dv-szf-skin .dv-actions{display:flex;flex-wrap:wrap;gap:10px;margin:4px 0 0}
@media (max-width:768px){.dv-szf-skin .dv-btn{width:100%}.dv-szf-skin .dv-actions .dv-btn-ghost{width:100%}}

/* --- űrlap --- */
.dv-szf-skin .dv-field{margin:0 0 14px}
.dv-szf-skin .dv-label{display:block;font-family:var(--szf-font);font-size:14px;font-weight:500;line-height:1.4;color:var(--szf-text);margin:0 0 6px}
.dv-szf-skin .dv-req{color:var(--szf-err);font-weight:600}
.dv-szf-skin input.dv-input{display:block;width:100%;height:auto;margin:0;background:var(--szf-raised);color:var(--szf-text);border:1px solid var(--szf-border-strong);border-radius:8px;padding:10px 14px;font-family:var(--szf-font);font-size:14px;line-height:1.4;box-shadow:none}
.dv-szf-skin input.dv-input::placeholder{color:var(--szf-muted);opacity:1}
.dv-szf-skin input.dv-input:focus{outline:2px solid var(--szf-focus);outline-offset:1px;border-color:var(--szf-border-strong);box-shadow:none}
/* a dark-mode.css:216 minden inputra !important hátteret/keretet tesz (0,5,2) -> ID-szintű felülírás (a pénztár .dv-co a11y-mintája) */
html.dark-mode .dv-szf-skin input.dv-input:not(#dv-noop){background:var(--szf-raised) !important;color:var(--szf-text) !important;border-color:var(--szf-border-strong) !important}
.dv-szf-skin .dv-hp{position:absolute;left:-9999px}

/* --- jelölő (mindkét módban ugyanaz a logika) --- */
.dv-szf-skin .dv-checkrow{display:flex;gap:10px;align-items:flex-start;font-size:14px;font-weight:400;line-height:1.45;color:var(--szf-text);cursor:pointer;margin:0}
.dv-szf-skin input.dv-check{-webkit-appearance:none;appearance:none;flex:none;width:18px;height:18px;margin:1px 0 0;padding:0;border:1px solid var(--szf-border-strong);border-radius:4px;background:var(--szf-raised);cursor:pointer;display:inline-block;vertical-align:top}
.dv-szf-skin input.dv-check:checked{background:var(--szf-lime) var(--szf-check) center/14px 14px no-repeat;border-color:var(--szf-lime)}

/* --- badge (pill) --- */
.dv-szf-skin .dv-badge{display:inline-block;font-family:var(--szf-font);font-size:12px;font-weight:600;line-height:1.3;padding:4px 10px;border-radius:999px;background:var(--szf-raised);color:var(--szf-muted);white-space:nowrap}
.dv-szf-skin .dv-badge--ok{background:var(--szf-ok-bg);color:var(--szf-ok)}
.dv-szf-skin .dv-badge--warn{background:var(--szf-warn-bg);color:var(--szf-warn)}
.dv-szf-skin .dv-badge--err{background:var(--szf-err-bg);color:var(--szf-err)}

/* --- (a) fejléc: vendégnek „Szerelőknek” ghost (1280 px alatt nincs; ≤768 px-en a mobil-menüben van) --- */
.dv-szf-skin.dv-szs-hdr{display:inline-flex;margin-right:8px}
.dv-szf-skin.dv-szs-hdr .dv-btn-ghost{height:44px;padding:0 16px;font-size:14px}
@media (max-width:1279px){.dv-szf-skin.dv-szs-hdr{display:none}} /* spec: 1280 alatt csak a mobil-menüben; 1024-en a ghost kiszorította a logót */

/* --- (b) login alatti doboz --- */
.dv-szf-skin.dv-szs-login{margin-top:20px}

/* --- (c) regisztráció --- */
.dv-szf-skin .dv-szs-reg{max-width:560px;margin:0 auto}
.dv-szf-skin .dv-szs-benefits{margin:0 0 20px;padding:18px 20px;box-shadow:none}
.dv-szf-skin .dv-szs-benefits-t{font-size:16px;font-weight:700;margin:0 0 8px}
.dv-szf-skin .dv-szs-benefits ul{list-style:none;margin:0;padding:0}
.dv-szf-skin .dv-szs-benefits li{position:relative;padding-left:18px;margin:0 0 6px;font-size:14px;line-height:1.5}
.dv-szf-skin .dv-szs-benefits li::before{content:"";position:absolute;left:0;top:.55em;width:8px;height:8px;border-radius:2px;background:var(--szf-lime)}
.dv-szf-skin .dv-szs-foot{margin:16px 0 0;font-size:14px}
.dv-szf-skin .woocommerce-error,.dv-szf-skin .woocommerce-message{margin:0 0 16px}

/* --- (d) irányítópult-doboz --- */
.dv-szf-skin .dv-szs-head{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:0 0 10px}
.dv-szf-skin .dv-szs-head .dv-eyebrow{margin:0}

/* --- (e) Jóváírásaim --- */
.dv-szf-skin .dv-szs-bal{display:grid;grid-template-columns:2fr 1fr 1fr;gap:16px;margin:0 0 16px}
.dv-szf-skin .dv-szs-bal .dv-card{margin:0;padding:18px;min-width:0}
.dv-szf-skin .dv-szs-bal .dv-price{overflow-wrap:anywhere}
.dv-szf-skin .dv-szs-k{display:block;font-size:12px;font-weight:600;letter-spacing:1.5px;text-transform:uppercase;color:var(--szf-muted);margin:0 0 8px}
@media (max-width:768px){.dv-szf-skin .dv-szs-bal{grid-template-columns:1fr}}
.dv-szf-skin table.dv-szs-table{width:100%;border:0;border-collapse:collapse;border-radius:0;margin:0;background:transparent}
.dv-szf-skin table.dv-szs-table th{font-size:12px;font-weight:600;letter-spacing:1.5px;text-transform:uppercase;color:var(--szf-muted);background:transparent;text-align:left;padding:0 10px 10px;border:0;border-bottom:1px solid var(--szf-border)}
.dv-szf-skin table.dv-szs-table td{padding:12px 10px;border:0;border-bottom:1px solid var(--szf-border);color:var(--szf-text);background:transparent;font-size:14px;vertical-align:middle}
.dv-szf-skin table.dv-szs-table tr:last-child td{border-bottom:0}
.dv-szf-skin table.dv-szs-table .dv-szs-r{text-align:right;white-space:nowrap}
@media (max-width:768px){
  .dv-szf-skin table.dv-szs-table thead{display:none}
  .dv-szf-skin table.dv-szs-table tr{display:block;border-bottom:1px solid var(--szf-border);padding:6px 0}
  .dv-szf-skin table.dv-szs-table tr:last-child{border-bottom:0}
  .dv-szf-skin table.dv-szs-table td{display:flex;justify-content:space-between;align-items:center;gap:12px;text-align:right;border:0;padding:6px 0}
  .dv-szf-skin table.dv-szs-table td::before{content:attr(data-title);float:none;font-size:12px;font-weight:600;letter-spacing:1.5px;text-transform:uppercase;color:var(--szf-muted);text-align:left}
}

/* --- (g) pénztár --- */
.dv-szf-skin.dv-szs-co{margin:0 0 16px}
.dv-szf-skin.dv-szs-co .dv-card{margin:0;padding:16px 18px}
.dv-szs-fee .dv-tv,.dv-szs-feeval{font-family:"IBM Plex Mono",ui-monospace,"SFMono-Regular","Menlo","Consolas",monospace;font-weight:600;letter-spacing:-.19px}