/* Diyetim tasarım sistemi
   Kimlik: taze ve iştah açıcı. Sıcak krem zemin, mandalina (ana renk), avokado yeşili (ilerleme / başarı),
   narenciye sarısı, böğürtlen moru ve su mavisi (makrolar). Başlıklar Bricolage Grotesque, metin Plus Jakarta Sans. */
:root{
  /* zemin */
  --bg:#FFF8F1; --surface:#fff; --sand:#F7EDE2; --line:#EFE2D3; --line-2:#E6D5C2;
  --text:#2B1D17; --muted:#7A6A60;
  /* ana renk: mandalina */
  --primary:#E8613C; --primary-ink:#C2421E; --primary-btn:#C94A24; --primary-btn-h:#B23E1C;
  --primary-soft:#FDEBE3; --primary-light:#F6A88E; --primary-dark:#2B1D17;
  /* yardımcı tonlar */
  --green:#16734D; --green-soft:#E2F3E9; --green-mid:#3FAE7A;
  --citrus:#F4B740; --citrus-ink:#9A6412; --citrus-soft:#FDF2D9;
  --berry:#8A3FB0; --berry-soft:#F3E8F9;
  --sky:#2F7FB8; --sky-soft:#E4F0F9;
  /* durum */
  --danger:#C23B3B; --danger-soft:#FBE7E5; --warning:#9A6412; --success:#16734D; --wa:#1FA855;
  --grad:linear-gradient(135deg,#F07A4F 0%,#E8613C 45%,#D94E2A 100%);
  --shadow:0 18px 40px rgba(73,40,20,.14); --shadow-sm:0 1px 2px rgba(73,40,20,.05),0 2px 8px rgba(73,40,20,.04);
  --r:18px; --r-sm:12px;
  --font:"Plus Jakarta Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --display:"Bricolage Grotesque","Plus Jakarta Sans",system-ui,sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{font-family:var(--font);background:var(--bg);color:var(--text);line-height:1.55;font-size:15.5px;-webkit-font-smoothing:antialiased}
img,svg{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font:inherit;cursor:pointer;border:0;background:none;color:inherit}
input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:2.5px solid var(--primary);outline-offset:2px;border-radius:8px}
[hidden]{display:none!important}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.wrap{width:min(1160px,100% - 40px);margin-inline:auto}
h1,h2,h3{font-family:var(--display);font-weight:700;letter-spacing:-.025em}

/* Marka */
.brand{display:inline-flex;align-items:center;gap:10px;font-family:var(--display);font-weight:800;font-size:22px;letter-spacing:-.035em;color:var(--text)}
.brand img{width:36px;height:36px;border-radius:11px}

/* Butonlar */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 20px;border-radius:12px;font-weight:700;font-size:15px;transition:transform .12s,background .15s,box-shadow .15s,opacity .2s;white-space:nowrap;line-height:1.2}
.btn:active{transform:translateY(1px)}
.btn-primary{background:var(--primary-btn);color:#fff;box-shadow:0 2px 0 #9E3618,0 6px 14px rgba(201,74,36,.22)}
.btn-primary:hover{background:var(--primary-btn-h)}
.btn-ghost{background:#fff;color:var(--text);border:1.5px solid var(--line-2)}
.btn-ghost:hover{border-color:var(--primary-light)}
.btn-soft{background:var(--primary-soft);color:var(--primary-ink)}
.btn-soft:hover{background:#FADCCF}
.btn-danger{background:var(--danger-soft);color:var(--danger)}
.btn-danger:hover{background:#F6D6D3}
.btn-sm{padding:8px 13px;font-size:13.5px;border-radius:10px}
.btn-sm.btn-primary{box-shadow:0 2px 0 #9E3618}
.btn-lg{padding:15px 26px;font-size:16px;border-radius:14px}
.btn-block{width:100%}
.btn[disabled]{opacity:.5;pointer-events:none}
.btn svg{width:18px;height:18px}

/* Form */
.field{display:flex;flex-direction:column;gap:6px}
.field>label,.label{font-size:13px;font-weight:700;color:var(--text)}
.field .hint{font-size:12.5px;color:var(--muted)}
.input,.select,.textarea{width:100%;padding:13px 15px;background:#FFFCF8;border:1.5px solid var(--line);border-radius:12px;font-size:15px;transition:border .15s,box-shadow .15s,background .15s}
.input::placeholder,.textarea::placeholder{color:#B3A396}
.input:hover,.select:hover,.textarea:hover{border-color:var(--line-2)}
.input:focus,.select:focus,.textarea:focus{outline:0;background:#fff;border-color:var(--primary);box-shadow:0 0 0 4px rgba(232,97,60,.14)}
.textarea{resize:vertical;min-height:90px}
.select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='8' fill='none' stroke='%237A6A60' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M1 1l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 15px center;padding-right:40px}
.row{display:grid;gap:14px}
.row.two{grid-template-columns:1fr 1fr}
.row.three{grid-template-columns:repeat(3,1fr)}
@media(max-width:560px){.row.two,.row.three{grid-template-columns:1fr}}
.phone-input{display:flex;align-items:center;background:#FFFCF8;border:1.5px solid var(--line);border-radius:12px;transition:border .15s,box-shadow .15s}
.phone-input:focus-within{border-color:var(--primary);background:#fff;box-shadow:0 0 0 4px rgba(232,97,60,.14)}
.phone-input span{padding-left:15px;color:var(--muted);font-weight:700}
.phone-input input{border:0;background:none;padding:13px 15px 13px 8px;flex:1;min-width:0;font-size:15px}
.phone-input input:focus{outline:0}
.check{display:flex;gap:10px;align-items:flex-start;font-size:13.5px;color:var(--muted);cursor:pointer}
.check input{width:18px;height:18px;margin-top:2px;accent-color:var(--primary-btn);flex:none}

/* Kart / etiket */
.card{background:var(--surface);border:1.5px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow-sm)}
.pill{display:inline-flex;align-items:center;gap:5px;padding:4px 10px;border-radius:99px;font-size:12px;font-weight:700;background:var(--sand);color:var(--text);white-space:nowrap}
.pill.ok{background:var(--green-soft);color:var(--green)}
.pill.warn{background:var(--citrus-soft);color:var(--citrus-ink)}
.pill.bad{background:var(--danger-soft);color:var(--danger)}
.pill.mute{background:var(--sand);color:var(--muted)}
.pill.hot{background:var(--primary-soft);color:var(--primary-ink)}
.muted{color:var(--muted)}
.spin{width:20px;height:20px;border:2.5px solid rgba(255,255,255,.4);border-top-color:#fff;border-radius:50%;animation:sp .7s linear infinite;display:inline-block}
.spin.dark{border-color:rgba(232,97,60,.2);border-top-color:var(--primary)}
@keyframes sp{to{transform:rotate(360deg)}}

/* Renk tonları (avatar, ikon kutuları) */
.t-coral{--tone:var(--primary-ink);--tone-bg:var(--primary-soft)}
.t-green{--tone:var(--green);--tone-bg:var(--green-soft)}
.t-citrus{--tone:var(--citrus-ink);--tone-bg:var(--citrus-soft)}
.t-berry{--tone:var(--berry);--tone-bg:var(--berry-soft)}
.t-sky{--tone:var(--sky);--tone-bg:var(--sky-soft)}

/* Bildirim */
#toasts{position:fixed;top:16px;left:50%;transform:translateX(-50%);z-index:1000;display:flex;flex-direction:column;gap:8px;width:min(440px,100% - 32px);pointer-events:none}
.toast{padding:13px 18px 13px 44px;border-radius:14px;background:var(--text);color:#fff;font-weight:600;font-size:14.5px;box-shadow:var(--shadow);animation:tin .25s ease-out;position:relative}
.toast:before{content:"";position:absolute;left:18px;top:50%;width:12px;height:12px;border-radius:50%;transform:translateY(-50%);background:var(--citrus)}
.toast.error:before{background:#FF7A6B}
.toast.success:before{background:#5FD39A}
@keyframes tin{from{opacity:0;transform:translateY(-10px)}}