/* style.css — minimal neutral UI */
:root{
  --bg:#0f1115; --panel:#181b22; --muted:#aab2c0; --text:#f3f5f9; --acc:#ffd457; --ok:#3ddc97; --err:#ef476f; --radius:14px;
}
*{box-sizing:border-box}
body{margin:0;background:linear-gradient(180deg,#0d0f14,#0f1115);color:var(--text);font-family:Inter,system-ui,Segoe UI,Roboto,Arial;line-height:1.45}
a{color:var(--acc);text-decoration:none}
.container{max-width:1100px;margin:0 auto;padding:24px}
.header{position:sticky;top:0;background:rgba(15,17,21,.9);backdrop-filter:blur(8px);border-bottom:1px solid #242733}
.header .inner{display:flex;gap:16px;align-items:center;justify-content:space-between;padding:12px 24px}
.logo{font-weight:800;letter-spacing:.5px}
.nav a{margin-left:16px;opacity:.9}
.card{background:var(--panel);border:1px solid #242733;border-radius:var(--radius);box-shadow:0 10px 30px rgba(0,0,0,.25)}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px}
.p16{padding:16px}
.btn{display:inline-block;padding:10px 14px;border-radius:10px;border:1px solid #2a2e3b;background:#1a1e29;color:var(--text)}
.btn.acc{background:var(--acc);color:#111;border-color:#111;font-weight:700}
.btn.small{padding:6px 10px;font-size:14px}
.input, select, textarea{width:100%;padding:10px 12px;border-radius:10px;border:1px solid #2a2e3b;background:#0f1218;color:var(--text)}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.form-row > *{min-width:0}
.price{font-weight:800}
footer{opacity:.7;padding:24px;text-align:center}
.table{width:100%;border-collapse:collapse}
.table th,.table td{padding:10px;border-bottom:1px solid #242733;text-align:left}
.badge{display:inline-flex;align-items:center;gap:6px;padding:3px 8px;border-radius:999px;background:#242733;font-size:12px}
/* ===== Header layout improvements ===== */
.header-grid{
  display:grid;
  grid-template-columns:auto 1fr auto;
  gap:16px;
  align-items:center;
}

.nav-toggle{
  display:none;
  border:1px solid #2a2e3b;
  background:#1a1e29;
  color:var(--text);
  border-radius:12px;
  padding:10px 12px;
  font-size:18px;
  line-height:1;
}

.logo-wrap{ display:flex; justify-content:center; }
.actions{ display:flex; justify-content:flex-end; gap:10px; align-items:center; }
.cta{ padding:12px 18px; border-radius:999px; }

/* ===== Responsive: telefon (<= 768px) ===== */
@media (max-width: 768px){

  body{ font-size:16px; }

  .header .inner{ padding:10px 14px; }
  .header-grid{
    grid-template-columns:auto 1fr auto; /* burger | logo | actiuni */
  }

  .nav-toggle{ display:inline-block; }

  /* Meniul se retrage într-un panou vertical */
  .nav{
    position: absolute;
    top: 64px; /* sub header */
    left: 0; right: 0;
    background: rgba(24,27,34,.98);
    border-top:1px solid #242733;
    display:none;
    flex-direction:column;
    padding:10px 16px;
    z-index: 50;
  }
  .nav.open{ display:flex; }
  .nav a{ padding:10px 6px; font-size:17px; }

  .logo-wrap img{ height:38px; }

  .actions .btn{ padding:8px 12px; border-radius:12px; }
  .actions .cta{ padding:10px 14px; }

  /* Grilă produse: 2 pe rând sau 1 pe ecrane mici */
  .grid{
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap:12px;
  }
  @media (max-width: 480px){
    .grid{ grid-template-columns: 1fr; }
  }

  /* Carduri & formulare mobile friendly */
  .card{ border-radius:12px; }
  .form-row{ grid-template-columns:1fr; } /* inputuri pe o coloană */
  .btn.acc{ font-weight:700; }

  /* Tabele scrollabile pe orizontală (cont/comenzi) */
  .table{ display:block; overflow-x:auto; white-space:nowrap; }
}

/* Imagini: smooth edges & lazy-friendly */
img{ image-rendering:auto; border-radius:10px; }

/* Tap targets mai mari pe mobil */
@media (max-width: 768px){
  a.btn, button.btn{ min-height:44px; }
}