/*
Theme Name: KmJar
Description: Temă custom de la 0 pentru restaurantul KmJar (centura Lugojului) — meniu QR pe WooCommerce, homepage „în lucru". Negru + roșu + flacără, ca logo-ul.
Version: 1.2
Author: creceweb360
Text Domain: kmjar
*/

:root{
  --negru:#0e0c0a;
  --negru2:#171310;
  --crem:#f3ede4;
  --crem-slab:rgba(243,237,228,.72);
  --rosu:#d21f1f;
  --portocaliu:#f07f24;
  --linie:rgba(243,237,228,.14);
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  background:var(--negru);
  color:var(--crem);
  font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Arial,sans-serif;
  line-height:1.6;
}
img{max-width:100%;height:auto}
a{color:var(--portocaliu)}

h1,h2,h3,.titlu{
  font-family:'Oswald',Impact,'Arial Narrow',sans-serif;
  text-transform:uppercase;
  letter-spacing:.04em;
  line-height:1.15;
}

/* ─── homepage „în lucru" ─── */
.acasa{
  min-height:100vh;
  background:var(--negru) var(--acasa-bg,none) center 30%/cover no-repeat;
}
.acasa-val{
  min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;
  text-align:center;padding:2.5rem 1.25rem;
  background:linear-gradient(rgba(14,12,10,.88),rgba(14,12,10,.72) 45%,rgba(14,12,10,.92));
}
.acasa-logo{width:min(240px,60vw)}
.acasa-chip{
  margin-top:2rem;font-size:.78rem;letter-spacing:.35em;text-transform:uppercase;
  border:1px solid var(--linie);padding:.65rem 1.3rem .65rem 1.65rem;border-radius:999px;color:var(--crem-slab);
}
.acasa-deschis{margin-top:2rem;font-size:1.05rem}
.acasa-deschis b{color:var(--crem)}
.acasa-btn{
  display:inline-block;margin-top:1.6rem;background:var(--rosu);color:#fff;text-decoration:none;
  font-family:'Oswald',Impact,sans-serif;text-transform:uppercase;letter-spacing:.08em;
  font-size:1.25rem;padding:1rem 2.6rem;border-radius:6px;border-bottom:4px solid #8f1414;
}
.acasa-btn:hover{background:#e02a2a}
.acasa-info{margin-top:2.4rem;font-size:.95rem;line-height:2;color:var(--crem-slab)}
.acasa-info a{border-bottom:1px solid rgba(240,127,36,.5);text-decoration:none}
.acasa-fb{margin-top:2rem;font-size:.85rem;color:rgba(243,237,228,.55)}
.acasa-fb a{color:inherit}
.acasa-harta{margin-top:2.2rem;width:min(680px,100%)}
.acasa-harta iframe{
  display:block;width:100%;height:320px;border:0;border-radius:12px;
  box-shadow:0 0 0 1px var(--linie),0 18px 50px rgba(0,0,0,.55);
}

/* ─── meniu ─── */
.meniu-cap{
  text-align:center;padding:2.2rem 1rem 1.4rem;
  background:radial-gradient(ellipse at top,#241a12 0%,var(--negru) 70%);
  border-bottom:1px solid var(--linie);
}
.meniu-cap img{width:min(300px,70vw)}
.meniu-cap .sub{margin-top:.6rem;font-size:.85rem;letter-spacing:.28em;text-transform:uppercase;color:var(--crem-slab)}

.meniu-nav{
  position:sticky;top:0;z-index:50;background:rgba(14,12,10,.97);
  border-bottom:1px solid var(--linie);
  overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;
  white-space:nowrap;padding:.7rem .9rem;text-align:center;
}
.meniu-nav::-webkit-scrollbar{display:none}
.meniu-nav a{
  display:inline-block;margin:0 .22rem;padding:.42rem 1rem;border-radius:999px;
  border:1px solid var(--linie);color:var(--crem);text-decoration:none;
  font-family:'Oswald',Impact,sans-serif;font-size:.86rem;text-transform:uppercase;letter-spacing:.06em;
}
.meniu-nav a:hover{border-color:var(--portocaliu);color:var(--portocaliu)}

.meniu-corp{max-width:760px;margin:0 auto;padding:1rem 1.25rem 3rem}
.sectiune{padding-top:1.2rem;scroll-margin-top:4.4rem}
.sectiune h2{
  font-size:1.55rem;color:var(--crem);margin:1.6rem 0 .4rem;
  display:flex;align-items:center;gap:.8rem;
}
.sectiune h2::after{content:'';flex:1;height:2px;background:linear-gradient(90deg,var(--rosu),transparent)}
.fel{
  display:flex;align-items:baseline;gap:.5rem;padding:.78rem 0;border-bottom:1px dashed var(--linie);
}
.fel:last-child{border-bottom:0}
.fel-nume{font-weight:600;font-size:1.02rem}
.fel-desc{display:block;font-weight:400;font-size:.85rem;color:var(--crem-slab);margin-top:.1rem}
.fel-puncte{flex:1;border-bottom:2px dotted rgba(243,237,228,.25);transform:translateY(-4px);min-width:24px}
.fel-pret{
  font-family:'Oswald',Impact,sans-serif;font-size:1.12rem;color:var(--portocaliu);white-space:nowrap;
}
.fel-foto{
  display:block;width:100%;max-height:240px;object-fit:cover;
  border-radius:10px;margin:.9rem 0 .1rem;
}
.harta-subsol{max-width:760px;margin:2.6rem auto 0;padding:0 1.25rem}
.harta-subsol iframe{
  display:block;width:100%;height:300px;border:0;border-radius:12px;
  box-shadow:0 0 0 1px var(--linie),0 18px 50px rgba(0,0,0,.55);
}
.meniu-note{
  margin-top:2.6rem;padding:1.1rem 1.3rem;border:1px solid var(--linie);border-radius:8px;
  font-size:.85rem;color:var(--crem-slab);line-height:1.9;
}

/* ─── editor prețuri ─── */
.editor{max-width:760px;margin:0 auto;padding:1.5rem 1.25rem 4rem}
.editor h1{font-size:1.7rem;margin:.8rem 0 1.2rem}
.editor .mesaj{background:#173417;border:1px solid #2c7a2c;color:#c9f0c9;padding:.8rem 1.1rem;border-radius:8px;margin-bottom:1.2rem}
.editor h2{font-size:1.25rem;margin:1.8rem 0 .5rem;color:var(--portocaliu)}
.ed-rand{display:flex;align-items:center;gap:.7rem;padding:.55rem 0;border-bottom:1px dashed var(--linie)}
.ed-nume{flex:1;font-size:.98rem}
.ed-nume small{color:var(--crem-slab)}
.ed-rand input[type=number]{
  width:5.2rem;padding:.55rem .5rem;font-size:1.05rem;text-align:right;
  background:var(--negru2);border:1px solid var(--linie);border-radius:6px;color:var(--crem);
}
.ed-rand label.aschide{font-size:.78rem;color:var(--crem-slab);display:flex;align-items:center;gap:.3rem}
.ed-rand input[type=checkbox]{width:1.25rem;height:1.25rem;accent-color:var(--rosu)}
.ed-salveaza{
  position:sticky;bottom:0;background:rgba(14,12,10,.97);padding:1rem 0;margin-top:1rem;
  border-top:1px solid var(--linie);text-align:center;
}
.ed-salveaza button{
  background:var(--rosu);color:#fff;border:0;border-radius:6px;border-bottom:4px solid #8f1414;
  font-family:'Oswald',Impact,sans-serif;text-transform:uppercase;letter-spacing:.08em;
  font-size:1.15rem;padding:.9rem 3rem;cursor:pointer;
}
.ed-info{font-size:.85rem;color:var(--crem-slab);margin-top:.8rem}

/* ─── subsol ─── */
.subsol{
  border-top:1px solid var(--linie);text-align:center;padding:2rem 1.25rem 2.6rem;
  font-size:.9rem;color:var(--crem-slab);line-height:2;
}
.subsol b{color:var(--crem)}
.subsol a{text-decoration:none;border-bottom:1px solid rgba(240,127,36,.4)}

@media (max-width:520px){
  .fel{flex-wrap:wrap}
  .fel-puncte{min-width:12px}
}