/* gh7 — prototip düzeni (Teklif · Asistan · Araçlar), gh7 renkleri, büyük yazı */
:root{--zemin:#F4F5F2;--kart:#FFFFFF;--metin:#121614;--ikincil:#5A615C;--soluk:#7B827D;--cizgi:#E2E5E0;--cerceve:#D5D9D3;--vurgu:#0F6B47;--vurgu-koyu:#0A4E33;--vurgu-acik:#E3F1EA;--uyari:#A33A1F;--uyari-acik:#F8E7E1;--sari:#FFF4D6;--sari-koyu:#5C4500;--mavi:#E6EEF8;--mavi-koyu:#24476B}
*{box-sizing:border-box}
html,body{margin:0}
body{background:var(--zemin);color:var(--metin);font-family:Manrope,system-ui,-apple-system,sans-serif;font-size:18px;line-height:1.45;-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent}
button,input,textarea,select{font:inherit;color:inherit}
button{background:none;border:0;cursor:pointer;padding:0;text-align:inherit}
[hidden]{display:none!important}
.app{max-width:600px;margin:0 auto;padding:calc(14px + env(safe-area-inset-top)) 20px calc(110px + env(safe-area-inset-bottom))}
body.alt-cubuklu .app{padding-bottom:calc(120px + env(safe-area-inset-bottom))}

/* başlıklar */
h1{font-size:30px;letter-spacing:-.03em;font-weight:800;margin:4px 0 18px;line-height:1.1}
.ust{display:flex;align-items:center;justify-content:space-between;margin:0 0 18px}
.ust .logo{height:26px;width:auto;color:var(--metin)}
.ust .firma{font-size:15px;color:var(--ikincil);font-weight:700}

/* büyük Geri */
.geri{display:inline-flex;align-items:center;gap:8px;min-height:60px;padding:0 26px 0 16px;border-radius:99px;background:var(--kart);font-weight:800;font-size:19px;border:1px solid var(--cizgi);margin:0 0 18px}
.geri svg{width:26px;height:26px}
.geri:active{background:var(--cizgi)}
.ust .geri{margin:0}

/* asistan cümlesi: "ben yaparım" */
.as{display:flex;gap:12px;align-items:flex-start;margin:0 0 14px;font-size:17px;color:var(--ikincil)}
.as svg{width:24px;height:24px;flex:none;color:var(--vurgu);margin-top:1px}
.as p{margin:0}

/* kutular */
textarea,input[type=text],input[type=tel],input[type=email],input[type=number],input:not([type]),input[type=search]{width:100%;border:1px solid var(--cerceve);border-radius:16px;padding:15px 16px;background:var(--kart);font-size:18px;line-height:1.4}
textarea{resize:vertical;min-height:110px}
textarea:focus,input:focus{outline:2px solid var(--vurgu);outline-offset:-1px;border-color:transparent}
::placeholder{color:var(--soluk)}
.yapistir{background:var(--kart);border-radius:22px;padding:16px;margin:0 0 12px;border:1px solid var(--cizgi)}
.yapistir textarea{border:0;padding:4px 2px;min-height:130px;outline:0!important;font-size:19px}
.yapistir .alt{display:flex;align-items:center;gap:10px;border-top:1px solid var(--cizgi);padding-top:12px;margin-top:6px}
.foto-btn{display:inline-flex;align-items:center;gap:8px;min-height:48px;padding:0 16px;border-radius:99px;background:var(--zemin);font-weight:700;font-size:16px}
.foto-btn svg{width:22px;height:22px}
.on-foto{position:relative}
.on-foto img{width:100%;max-height:260px;object-fit:contain;border-radius:12px;display:block;background:var(--zemin)}
.on-foto button{position:absolute;top:8px;right:8px;width:44px;height:44px;border-radius:50%;background:var(--metin);color:#fff;font-size:24px;line-height:44px;text-align:center}
label.et{display:block;font-size:15px;font-weight:700;color:var(--ikincil);margin:16px 0 8px}

/* düğmeler */
.btn{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;min-height:60px;border-radius:16px;font-weight:800;font-size:18px;background:var(--vurgu);color:#fff;transition:background .15s;text-decoration:none}
.btn:active{background:var(--vurgu-koyu)}
.btn.iki{background:var(--kart);color:var(--metin);border:1px solid var(--cerceve)}
.btn.iki:active{background:var(--cizgi)}
.btn:disabled{opacity:.55}
.btn+.btn,.btn+.bosluk+.btn{margin-top:10px}
.sil-btn{display:block;width:100%;text-align:center;color:var(--uyari);font-weight:800;padding:18px 0;margin-top:8px;font-size:17px}
.bosluk{height:12px}
.sira{display:flex;gap:10px}
.sira>*{flex:1}

/* gruplu liste (prototipteki gibi) */
.grp{background:var(--kart);border-radius:22px;margin:0 0 18px;overflow:hidden;border:1px solid var(--cizgi)}
.grp h2{display:flex;justify-content:space-between;align-items:baseline;gap:10px;margin:0;padding:16px 18px 6px;font-size:14px;letter-spacing:.06em;text-transform:uppercase;color:var(--ikincil);font-weight:800}
.grp h2 small{text-transform:none;letter-spacing:0;font-weight:600;font-size:14px;color:var(--soluk)}
.r{display:flex;align-items:center;gap:14px;width:100%;min-height:64px;padding:12px 18px;border-top:1px solid var(--cizgi);text-align:left}
.grp h2+.r,.grp>.r:first-child{border-top:0}
.r:active{background:var(--zemin)}
.r .i{width:26px;height:26px;flex:none;color:var(--ikincil)}
.r .tx{flex:1;min-width:0}
.r .tx b{display:block;font-weight:800;font-size:18px;line-height:1.3}
.r .tx span{display:block;color:var(--ikincil);font-size:15px;margin-top:2px;word-break:break-word}
.r .tx span.ipucu{color:var(--uyari);font-weight:700}
.r em{font-style:normal;font-weight:800;text-align:right;flex:none;max-width:52%;word-break:break-word;font-size:17px}
.r em small{display:block;font-weight:700;margin-top:4px}
.r .ok{width:22px;height:22px;flex:none;color:var(--cerceve)}
.r .eks{color:var(--uyari)}
.r .tik{width:26px;height:26px;flex:none;border-radius:50%;background:var(--vurgu);color:#fff;display:flex;align-items:center;justify-content:center}
.r .tik svg{width:16px;height:16px}
.r.ekle .tx b{color:var(--vurgu)}
.r img.kucuk{height:34px;max-width:140px;object-fit:contain}
.bos{color:var(--ikincil);padding:18px;margin:0}

/* durum etiketleri */
.pill{display:inline-block;font-size:14px;font-weight:800;padding:5px 11px;border-radius:99px;background:var(--zemin);color:var(--ikincil);white-space:nowrap}
.pill.ok{background:var(--vurgu-acik);color:var(--vurgu-koyu)}
.pill.no{background:var(--uyari-acik);color:var(--uyari)}
.pill.bl{background:var(--mavi);color:var(--mavi-koyu)}
.pill.rv{background:var(--sari);color:var(--sari-koyu)}

/* anahtar */
.sw{width:56px;height:34px;border-radius:99px;background:var(--cerceve);position:relative;flex:none;transition:background .15s}
.sw::after{content:"";position:absolute;top:3px;left:3px;width:28px;height:28px;border-radius:50%;background:#fff;transition:left .15s;box-shadow:0 1px 2px rgba(0,0,0,.2)}
.sw[aria-checked=true]{background:var(--vurgu)}
.sw[aria-checked=true]::after{left:25px}

/* teklif sayfası */
.durum{border-radius:18px;padding:16px 18px;margin:0 0 14px;background:var(--kart);font-size:17px}
.durum b{display:block;font-weight:800}
.durum span{display:block;margin-top:4px}
.durum.ok{background:var(--vurgu-acik);color:var(--vurgu-koyu)}
.durum.rv{background:var(--sari);color:var(--sari-koyu)}
.durum.no{background:var(--uyari-acik);color:var(--uyari)}
.durum.bl{background:var(--mavi);color:var(--mavi-koyu)}
.alt-cubuk{position:fixed;left:0;right:0;bottom:0;background:var(--zemin);border-top:1px solid var(--cizgi);padding:12px 20px calc(12px + env(safe-area-inset-bottom));z-index:10}
.alt-cubuk .ic{max-width:560px;margin:0 auto;display:flex;gap:10px}
.ikon-btn{width:56px;height:56px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:var(--metin);background:var(--kart);border:1px solid var(--cizgi);flex:none}
.ikon-btn svg{width:26px;height:26px}
.doc-kap{margin-top:4px}

/* geri bildirim */
.sor{background:var(--sari);border-radius:20px;padding:18px;margin:14px 0;color:var(--sari-koyu)}
.sor p{margin:0 0 12px;font-weight:800;color:var(--metin)}
.sor input{background:#fff}
.hata{background:var(--uyari-acik);color:var(--uyari);border-radius:16px;padding:16px;margin:14px 0;font-weight:700}
.tamam{background:var(--vurgu-acik);color:var(--vurgu-koyu);border-radius:16px;padding:16px;margin:14px 0;font-weight:700}
.yuk{height:5px;border-radius:3px;margin:16px 0;background:linear-gradient(90deg,var(--vurgu-acik) 0,var(--vurgu) 50%,var(--vurgu-acik) 100%);background-size:200% 100%;animation:ak 1s linear infinite}
@keyframes ak{to{background-position:-200% 0}}
.aciklama{color:var(--ikincil);font-size:17px;margin:0 0 16px}
.bildirim{position:fixed;left:50%;bottom:calc(120px + env(safe-area-inset-bottom));transform:translateX(-50%);background:var(--metin);color:#fff;padding:14px 20px;border-radius:14px;font-weight:700;font-size:16px;z-index:30;opacity:0;transition:opacity .2s;pointer-events:none;max-width:88vw;text-align:center}
.bildirim.acik{opacity:1}

/* imza alanı */
.pad{width:100%;height:220px;background:#fff;border:2px dashed var(--cerceve);border-radius:18px;touch-action:none;display:block}
.imza-on{background:#fff;border:1px solid var(--cizgi);border-radius:18px;padding:18px;text-align:center;margin:0 0 14px}
.imza-on img{max-height:90px;max-width:100%}

/* arama sonuçları */
.sat{display:flex;gap:12px;padding:14px 18px;border-top:1px solid var(--cizgi);font-size:16px}
.sat:first-child{border-top:0}
.sat .fy{font-weight:800;white-space:nowrap}

/* alt sekmeler */
nav.sekme{position:fixed;left:0;right:0;bottom:0;background:var(--kart);border-top:1px solid var(--cizgi);padding-bottom:env(safe-area-inset-bottom);z-index:10}
nav.sekme .ic{display:flex;max-width:600px;margin:0 auto}
nav.sekme button{flex:1;display:flex;flex-direction:column;align-items:center;gap:4px;padding:10px 0 12px;font-size:15px;font-weight:800;color:var(--ikincil)}
nav.sekme button span{display:flex;align-items:center;justify-content:center;width:64px;height:34px;border-radius:99px}
nav.sekme button svg{width:26px;height:26px}
nav.sekme button[aria-selected=true]{color:var(--vurgu)}
nav.sekme button[aria-selected=true] span{background:var(--vurgu-acik)}

@media print{nav.sekme,.alt-cubuk,.ust,.durum,.yazdirma{display:none!important}}

#l{margin-top:22px}
.r em{white-space:normal}
.sira>.btn{margin-top:0!important}

/* abi test kurulu düzeltmeleri */
.bildirim{top:auto;bottom:calc(104px + env(safe-area-inset-bottom))}
.yazi-btn{min-height:56px;padding:0 22px;border-radius:99px;background:var(--kart);border:1px solid var(--cizgi);font-weight:800;font-size:18px}
.sor .secenek{margin-top:10px}
.sor .secenek:first-of-type{margin-top:0}
.baska{display:block;width:100%;text-align:center;color:var(--vurgu);font-weight:800;padding:16px 0 4px;font-size:17px}
.iban{white-space:nowrap;font-size:15px;letter-spacing:-.01em}
#fo:not(:empty){padding-top:12px;border-top:1px solid var(--cizgi);margin-top:6px}
.sira .btn svg{width:24px;height:24px}
.pill.bk{background:#EEEAF8;color:#4A3A80}
.durum.bk{background:#EEEAF8;color:#4A3A80}

.renk{display:inline-block;width:28px;height:28px;border-radius:50%;border:2px solid #fff;box-shadow:0 0 0 1px var(--cerceve);flex:none}

.uyari-y{color:#B4532A!important;font-weight:700}
details.daha summary{display:flex;justify-content:space-between;align-items:center;padding:18px;cursor:pointer;list-style:none}
details.daha summary::-webkit-details-marker{display:none}
details.daha summary span{color:var(--ikincil);font-size:15px}
details.daha[open] summary{border-bottom:1px solid var(--cizgi)}
details.ayrinti{margin-top:14px}details.ayrinti summary{color:var(--vurgu);font-weight:700;cursor:pointer;padding:8px 0}
.bag{background:none;border:0;color:var(--vurgu);font-weight:800;font-size:16px;min-height:44px;padding:0;text-align:left;flex:1 1 100%}
