/* ─────────────────────────────────────────────
   505 — jurnal de calorii
   Negru profund, auriu metalic. Aurul apare rar
   și doar acolo unde contează: cifra zilei,
   linia de progres, elementul activ.
   ───────────────────────────────────────────── */

:root{
  --void:#08080B;
  --deep:#0C0C10;
  --panel:#121218;
  --panel2:#16161D;
  --raise:#1C1C24;
  --hair:#22222B;
  --hair2:#2E2E39;
  --hairgold:rgba(198,166,102,.20);

  --txt:#F0EDE5;
  --txt2:#A5A199;
  --dim:#78746C;
  --faint:#565349;

  --gold:#D9BE7E;
  --gold-hi:#F5E7C3;
  --gold-dp:#A98944;
  --gold-s:rgba(217,190,126,.09);
  --metal:linear-gradient(147deg,#F8EDD2 0%,#D6B87C 34%,#F1E1BB 56%,#B9974E 100%);
  --metal-thin:linear-gradient(90deg,#B9974E,#F1E1BB 45%,#D6B87C 70%,#A98944);

  --rose:#D08E7E;
  --rose-s:rgba(208,142,126,.10);
  --shadow:0 1px 0 rgba(255,255,255,.02) inset;

  --bg:var(--void); --bg2:var(--deep); --line:var(--hair);
  --text:var(--txt); --mint:var(--gold); --mint2:var(--gold-dp); --red:var(--rose);
}

*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;padding:0;background:var(--void)}
body{
  color:var(--txt);
  font-family:Manrope,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  font-size:16px;line-height:1.5;padding-bottom:94px;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
}
.wrap{max-width:600px;margin:0 auto;padding:0 20px}
.num{font-family:Newsreader,Georgia,serif;font-variant-numeric:tabular-nums;
  font-feature-settings:"tnum" 1;letter-spacing:-.01em}
.gold{background:var(--metal);-webkit-background-clip:text;background-clip:text;
  color:transparent}
button,input,select,textarea{font-family:inherit;font-size:inherit;color:inherit}
:focus-visible{outline:1px solid var(--gold-dp);outline-offset:3px;border-radius:3px}
::selection{background:rgba(217,190,126,.22)}

/* ── Antet ───────────────────────────────────── */
header.apphead{
  position:relative;padding:22px 0 26px;
  background:
    radial-gradient(120% 130% at 50% -25%, rgba(217,190,126,.055) 0%, transparent 62%),
    linear-gradient(180deg,#0E0E13 0%,var(--void) 100%);
}
header.apphead:after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:1px;
  background:var(--metal-thin);opacity:.34;
}
.topline{display:flex;align-items:flex-start;justify-content:space-between;gap:14px}
.brand{font-family:Newsreader,Georgia,serif;font-weight:500;font-size:22px;
  letter-spacing:-.015em;line-height:1.1}
.brand small{display:block;font-family:Manrope,sans-serif;font-weight:400;font-size:12px;
  color:var(--dim);letter-spacing:.01em;margin-top:3px}
.marketpill{font-size:11px;color:var(--txt2);border:1px solid var(--hair2);
  padding:4px 10px;border-radius:99px;background:var(--panel);white-space:nowrap}

.datebar{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:22px}
.datenav{display:flex;align-items:center;gap:3px}
.datenav button{background:var(--panel);border:1px solid var(--hair2);color:var(--txt2);
  width:30px;height:30px;border-radius:8px;font-size:15px;cursor:pointer;line-height:1;
  display:grid;place-items:center;transition:border-color .15s,color .15s}
.datenav button:hover:not(:disabled){border-color:var(--gold-dp);color:var(--gold)}
.datenav button:disabled{opacity:.25;cursor:default}
.daylabel{font-size:13px;color:var(--dim);min-width:104px;text-align:center;
  letter-spacing:.02em}

/* ── Cifra zilei ─────────────────────────────── */
.summary{margin-top:20px}
.calcard,.remaincard{background:transparent;border:0;padding:0}
.calcard{display:flex;align-items:baseline;gap:13px;flex-wrap:wrap}
.calcard .big{font-family:Newsreader,Georgia,serif;font-size:72px;font-weight:300;
  line-height:.84;letter-spacing:-.03em;font-variant-numeric:tabular-nums;
  background:var(--metal);-webkit-background-clip:text;background-clip:text;color:transparent}
.calcard small,.remaincard small{font-size:13px;color:var(--dim)}
.remaincard{margin-top:12px;font-size:13px;color:var(--dim)}
.remaincard b{font-family:Newsreader,Georgia,serif;font-weight:500;color:var(--txt);
  font-variant-numeric:tabular-nums;font-size:15px}

/* linia de progres: fir subțire, cu reper la capăt */
.progress{position:relative;margin-top:20px;height:3px;background:var(--hair);
  border-radius:99px;overflow:visible}
.progress span{position:absolute;left:0;top:0;display:block;height:3px;
  background:var(--metal-thin);border-radius:99px;
  transition:width .42s cubic-bezier(.22,1,.36,1)}
.progress span:after{content:"";position:absolute;right:-3px;top:-2.5px;
  width:8px;height:8px;border-radius:99px;background:var(--gold-hi);
  box-shadow:0 0 0 3px rgba(217,190,126,.16)}
.progress.over span{background:linear-gradient(90deg,#B9694E,#D08E7E)}
.progress.over span:after{background:#E9B0A0;box-shadow:0 0 0 3px var(--rose-s)}

.macros{margin-top:24px;display:grid;grid-template-columns:repeat(4,1fr);
  border-top:1px solid var(--hair)}
.macro{padding:13px 0 3px;border-right:1px solid var(--hair)}
.macro:last-child{border-right:0}
.macro b{display:block;font-family:Newsreader,Georgia,serif;font-size:21px;font-weight:400;
  font-variant-numeric:tabular-nums;line-height:1.1;color:var(--gold)}
.macro small{font-size:11px;color:var(--dim);display:block;margin-top:2px;letter-spacing:.01em}
.macro .mini{display:block;font-size:10px;color:var(--faint);margin-top:4px}
.macro .mini i{font-style:normal;color:var(--gold-dp)}

/* ── Secțiuni ────────────────────────────────── */
.sectiontitle{font-family:Newsreader,Georgia,serif;font-size:18px;font-weight:500;
  color:var(--txt);margin:32px 0 12px;letter-spacing:-.01em}
.sectionhero{margin:28px 0 12px}
.card{background:var(--panel);border:1px solid var(--hair);border-radius:12px;
  box-shadow:var(--shadow)}
.pad{padding:17px}

/* ── Căutare ─────────────────────────────────── */
.searchbox{position:relative;margin-top:20px}
.searchbox input{width:100%;padding:14px 42px 14px 15px;font-size:16px;
  border:1px solid var(--hair2);border-radius:11px;background:var(--panel);color:var(--txt);
  transition:border-color .15s,box-shadow .15s}
.searchbox input::placeholder{color:var(--faint)}
.searchbox input:focus{outline:none;border-color:var(--gold-dp);
  box-shadow:0 0 0 3px var(--gold-s)}
.searchbox .clr{position:absolute;right:7px;top:50%;transform:translateY(-50%);
  background:none;border:0;font-size:19px;color:var(--faint);cursor:pointer;
  padding:6px;display:none}
.searchbox .clr:hover{color:var(--txt2)}
.results{margin-top:9px;max-height:380px;overflow-y:auto}
.results:empty{display:none}
.hit{display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:13px 15px;border:0;border-bottom:1px solid var(--hair);cursor:pointer;
  background:none;width:100%;text-align:left;color:var(--txt);transition:background .12s}
.hit:last-child{border-bottom:0}
.hit:hover{background:var(--raise)}
.hit strong{font-weight:500;font-size:15px}
.hit .meta{display:block;font-size:11.5px;color:var(--dim);margin-top:2px}
.hit .kcal{font-family:Newsreader,Georgia,serif;font-weight:400;font-size:17px;
  font-variant-numeric:tabular-nums;white-space:nowrap;color:var(--gold)}

.quickrow{display:flex;gap:7px;flex-wrap:wrap;margin-top:13px}
.quickchip{font-size:13px;padding:7px 13px;border-radius:99px;border:1px solid var(--hair2);
  background:var(--panel);cursor:pointer;color:var(--txt2);transition:border-color .15s,color .15s}
.quickchip:hover{border-color:var(--gold-dp);color:var(--gold)}
.quickchip.star{border-color:rgba(217,190,126,.4);color:var(--gold);background:var(--gold-s)}

/* ── Jurnal ──────────────────────────────────── */
.entry{display:flex;align-items:center;gap:12px;padding:13px 15px;
  border-bottom:1px solid var(--hair)}
.entry:last-child{border-bottom:0}
.entry .n{flex:1;min-width:0}
.entry .n strong{font-weight:500;font-size:15px;display:block}
.entry .n small{color:var(--dim);font-size:12px}
.entry .k{font-family:Newsreader,Georgia,serif;font-weight:400;font-size:18px;
  font-variant-numeric:tabular-nums;color:var(--gold)}
.entry .del{background:none;border:0;color:var(--faint);font-size:18px;cursor:pointer;
  padding:5px;line-height:1;border-radius:5px;transition:color .15s,background .15s}
.entry .del:hover{color:var(--rose);background:var(--rose-s)}
.empty{padding:26px 18px;color:var(--dim);font-size:14px;text-align:center;line-height:1.6}

/* ── Butoane ─────────────────────────────────── */
.btn{font-size:15px;font-weight:500;padding:13px 18px;border-radius:11px;
  border:1px solid var(--hair2);background:var(--raise);color:var(--txt);cursor:pointer;
  width:100%;transition:border-color .15s,color .15s,background .15s}
.btn:hover{border-color:var(--gold-dp);color:var(--gold)}
.btn.primary{background:var(--metal);border:0;color:#171208;font-weight:700;
  letter-spacing:.005em}
.btn.primary:hover{color:#171208;filter:brightness(1.06)}
.btn.danger{color:var(--rose);border-color:rgba(208,142,126,.3);background:transparent}
.btn.danger:hover{background:var(--rose-s);border-color:var(--rose);color:var(--rose)}
.ghostlink{background:none;border:0;color:var(--gold);padding:11px;font-size:14px;
  cursor:pointer;text-decoration:underline;text-underline-offset:3px;
  text-decoration-color:var(--gold-dp)}

/* ── Formulare ───────────────────────────────── */
label.fld{display:block;font-size:12px;color:var(--dim);margin:15px 0 6px;letter-spacing:.01em}
input[type=number],input[type=text],select,textarea{width:100%;padding:12px 13px;
  font-size:16px;border:1px solid var(--hair2);border-radius:10px;
  background:var(--deep);color:var(--txt);transition:border-color .15s,box-shadow .15s}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--gold-dp);
  box-shadow:0 0 0 3px var(--gold-s)}
select{appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--dim) 50%),
  linear-gradient(135deg,var(--dim) 50%,transparent 50%);
  background-position:calc(100% - 17px) 50%,calc(100% - 12px) 50%;
  background-size:5px 5px,5px 5px;background-repeat:no-repeat;padding-right:34px}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.row3{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.note{font-size:12px;color:var(--dim);line-height:1.6;margin-top:13px}
.desc{font-size:12px;color:var(--dim);line-height:1.6;margin:13px 0 0}
.notice{background:var(--gold-s);border-left:2px solid var(--gold-dp);color:var(--gold);
  font-size:13px;padding:12px 14px;border-radius:0 8px 8px 0;margin-top:13px}
.warn{background:var(--rose-s);border-left:2px solid var(--rose);color:#E5B4A6;
  font-size:13px;padding:12px 14px;border-radius:0 8px 8px 0;margin-top:13px}

/* ── Categorii ───────────────────────────────── */
.chips{display:flex;flex-wrap:wrap;gap:7px;margin:0 0 15px}
.chip{font-size:13px;padding:7px 13px;border-radius:99px;border:1px solid var(--hair2);
  background:var(--panel);cursor:pointer;color:var(--txt2);transition:all .15s}
.chip:hover{border-color:var(--gold-dp);color:var(--gold)}
.chip.on{background:var(--metal);border-color:transparent;color:#171208;font-weight:600}
.filtergrid{display:grid;grid-template-columns:1fr 1fr;gap:10px}

/* ── Tabel ───────────────────────────────────── */
.tablewrap{background:var(--panel);border:1px solid var(--hair);border-radius:12px;
  overflow:auto;box-shadow:var(--shadow)}
.foodtable{width:100%;border-collapse:collapse;font-size:13.5px}
.foodtable th{position:sticky;top:0;background:var(--panel2);text-align:right;
  font-weight:500;font-size:11px;color:var(--dim);padding:11px 8px;
  border-bottom:1px solid var(--hair2);white-space:nowrap;letter-spacing:.02em}
.foodtable th:first-child{text-align:left}
.foodtable td{padding:12px 8px;border-bottom:1px solid var(--hair);text-align:right;
  font-family:Newsreader,Georgia,serif;font-variant-numeric:tabular-nums;color:var(--txt2)}
.foodtable td:first-child{text-align:left;font-family:Manrope,sans-serif;color:var(--txt)}
.foodtable tr:last-child td{border-bottom:0}
.foodtable tr.pick{cursor:pointer}
.foodtable tr.pick:hover{background:var(--raise)}
.foodtable .kc{color:var(--gold);font-weight:500}

/* ── Calculatoare ────────────────────────────── */
.acc{margin-bottom:10px;overflow:hidden}
.acc>summary{list-style:none;cursor:pointer;padding:16px 17px;display:flex;
  align-items:center;justify-content:space-between;gap:10px;
  font-family:Newsreader,Georgia,serif;font-weight:500;font-size:17px;
  transition:color .15s}
.acc>summary:hover{color:var(--gold)}
.acc>summary::-webkit-details-marker{display:none}
.acc>summary:after{content:"";width:7px;height:7px;flex:0 0 auto;
  border-right:1px solid var(--gold-dp);border-bottom:1px solid var(--gold-dp);
  transform:rotate(45deg);margin-right:3px;transition:transform .2s}
.acc[open]>summary:after{transform:rotate(-135deg);margin-top:4px}
.acc[open]>summary{border-bottom:1px solid var(--hair)}
.acc .body{padding:5px 17px 19px}

.out{background:var(--deep);border:1px solid var(--hair2);border-radius:10px;
  padding:17px;margin-top:17px;text-align:center}
.out b{display:block;font-family:Newsreader,Georgia,serif;font-size:36px;font-weight:300;
  line-height:1.05;font-variant-numeric:tabular-nums;
  background:var(--metal);-webkit-background-clip:text;background-clip:text;color:transparent}
.out small{display:block;font-size:12px;color:var(--dim);margin-top:5px}
.outgrid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:17px}
.outgrid .out{margin-top:0}
.outgrid .out b{font-size:27px}

/* ── Greutate ────────────────────────────────── */
.progresscard{background:var(--panel);border:1px solid var(--hair);border-radius:12px;
  padding:17px;box-shadow:var(--shadow)}
.weightrow{display:flex;gap:9px;align-items:flex-end}
.weightrow button{width:auto;white-space:nowrap;flex:0 0 auto}
.weightlist{margin-top:15px;border-top:1px solid var(--hair)}
.weightitem{display:flex;justify-content:space-between;align-items:center;
  padding:11px 0;border-bottom:1px solid var(--hair);font-size:14px}
.weightitem:last-child{border-bottom:0}
.chartbox{margin-top:15px;background:var(--deep);border:1px solid var(--hair);
  border-radius:10px;padding:11px}
.chartbox canvas{display:block;width:100%!important;height:auto!important}

/* ── Foaia de adăugare ───────────────────────── */
.veil{position:fixed;inset:0;background:rgba(4,4,6,.68);display:none;z-index:40;
  backdrop-filter:blur(3px)}
.veil.on{display:block}
.sheet{position:fixed;left:0;right:0;bottom:0;z-index:50;background:var(--deep);
  border-top:1px solid var(--hair2);border-radius:18px 18px 0 0;
  padding:22px 20px calc(22px + env(safe-area-inset-bottom));
  max-height:88vh;overflow-y:auto;transform:translateY(100%);
  transition:transform .3s cubic-bezier(.32,.72,0,1);
  box-shadow:0 -20px 60px rgba(0,0,0,.55);max-width:600px;margin:0 auto}
.sheet:before{content:"";position:absolute;left:0;right:0;top:0;height:1px;
  background:var(--metal-thin);opacity:.3}
.sheet.on{transform:translateY(0)}
.sheet h3{font-family:Newsreader,Georgia,serif;font-size:22px;font-weight:500;
  margin:0 0 4px;letter-spacing:-.015em}
.sheet .sub{color:var(--dim);font-size:12.5px;margin-bottom:16px;line-height:1.55}
.preview{background:var(--panel);border:1px solid var(--hair);border-radius:11px;
  padding:15px 10px;margin:17px 0;display:grid;grid-template-columns:repeat(5,1fr);
  gap:4px;text-align:center}
.preview div{border-right:1px solid var(--hair)}
.preview div:last-child{border-right:0}
.preview b{display:block;font-family:Newsreader,Georgia,serif;font-size:19px;
  font-weight:400;font-variant-numeric:tabular-nums;color:var(--gold)}
.preview small{font-size:10px;color:var(--dim)}
.sheetactions{display:flex;gap:10px;align-items:center}
.sheetactions .btn{flex:1}
.favbtn{flex:0 0 auto;width:48px;height:48px;border-radius:11px;border:1px solid var(--hair2);
  background:var(--panel);cursor:pointer;font-size:18px;color:var(--faint);
  display:grid;place-items:center;transition:all .15s}
.favbtn.on{color:var(--gold);border-color:rgba(217,190,126,.4);background:var(--gold-s)}

/* ── Bara de jos ─────────────────────────────── */
.tabbar{position:fixed;left:0;right:0;bottom:0;z-index:30;
  background:rgba(8,8,11,.92);backdrop-filter:blur(14px);
  border-top:1px solid var(--hair);display:flex;padding-bottom:env(safe-area-inset-bottom)}
.tabbar button{flex:1;background:none;border:0;padding:10px 4px 12px;font-size:10.5px;
  color:var(--faint);cursor:pointer;display:flex;flex-direction:column;align-items:center;
  gap:4px;letter-spacing:.02em;transition:color .15s;position:relative}
.tabbar button.on{color:var(--gold)}
.tabbar button.on:before{content:"";position:absolute;top:0;left:50%;transform:translateX(-50%);
  width:22px;height:1px;background:var(--metal-thin)}
.tabbar .ico{font-size:17px;line-height:1}
.view{display:none}
.view.on{display:block}

.foot{text-align:center;color:var(--faint);font-size:11px;margin:32px 0 14px;line-height:1.8}
.foot a{color:var(--dim)}
.admincard{margin-top:22px}

@media (max-width:400px){
  .calcard .big{font-size:60px}
  .macros{grid-template-columns:repeat(2,1fr)}
  .macro:nth-child(2){border-right:0}
  .macro:nth-child(3),.macro:nth-child(4){border-top:1px solid var(--hair)}
  .preview{grid-template-columns:repeat(3,1fr)}
  .preview div:nth-child(3){border-right:0}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}