/* © 2026 IG Tools — All rights reserved. */
/* Blur Face & License Plate — what the copied shell does not already style (design/plaka-yuz-bulaniklastir/). Screen-only chrome. */

/* entry: the three feature tiles + the "stays on your device" line (mockup B1) */
.bp-feats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:14px 0 6px}
.bp-feat{display:flex;flex-direction:column;align-items:center;gap:4px;padding:14px 6px;border-radius:16px;background:var(--panel);box-shadow:var(--sh);text-align:center}
.bp-feat b{font:600 14px/1.2 var(--sans);color:var(--text)}
.bp-feat small{font:500 12px/1.2 var(--sans);color:var(--muted)}
.bp-fi{display:flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:12px;background:color-mix(in srgb,var(--logo) 14%,transparent);color:var(--logo);margin-bottom:4px}
.bp-local{margin:8px 2px 0;font:500 13px/1.4 var(--sans);color:var(--muted);text-align:center}
body.ready .bp-feats,body.ready .bp-local{display:none}

/* the stage: the picture, the boxes layer and the progress pill */
.stage canvas.bp-cv{touch-action:none}
body.bp-adding .stage canvas.bp-cv{cursor:crosshair}
.bp-boxes{position:absolute;left:0;top:0;width:0;height:0;z-index:5;pointer-events:none}
.bp-box{position:absolute;border:2px dashed #2f80ff;border-radius:6px;box-sizing:border-box;box-shadow:0 0 0 1px rgba(0,0,0,.25)}
.bp-box.ov{border-radius:50%}
.bp-box.off{border-color:rgba(255,255,255,.8);border-style:dotted;background:rgba(0,0,0,.08)}
.bp-tag{position:absolute;left:-2px;top:-20px;padding:2px 6px;border-radius:6px;background:#2f80ff;color:#fff;font:700 10.5px/1.3 var(--sans);white-space:nowrap}
.bp-box.off .bp-tag{background:rgba(0,0,0,.65)}
.bp-x{position:absolute;right:-13px;top:-13px;width:26px;height:26px;border-radius:50%;border:2px solid #fff;background:#1c1c1e;color:#fff;display:flex;align-items:center;justify-content:center;padding:0;cursor:pointer;pointer-events:auto;box-shadow:0 1px 4px rgba(0,0,0,.4)}
.bp-x::before{content:"";position:absolute;inset:-9px}
.bp-box.off .bp-x{background:#34C759}
.bp-rubber{position:absolute;border:2px solid #2f80ff;background:rgba(47,128,255,.16);border-radius:4px}
.bp-pill{position:absolute;left:50%;top:10px;transform:translateX(-50%);z-index:6;min-width:200px;max-width:calc(100% - 120px);padding:8px 12px;border-radius:14px;background:rgba(20,20,22,.78);color:#fff;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-sizing:border-box;pointer-events:none}
.bp-pill[hidden]{display:none}
.bp-pt{display:flex;justify-content:space-between;gap:10px;font:600 12px/1.3 var(--sans)}
.bp-pb{height:4px;margin-top:6px;border-radius:2px;background:rgba(255,255,255,.22);overflow:hidden}
.bp-pb i{display:block;height:100%;width:0;background:#30D158;border-radius:2px;transition:width .25s}
.bp-toast{position:absolute;left:50%;bottom:64px;transform:translateX(-50%);z-index:6;max-width:calc(100% - 32px);padding:8px 14px;border-radius:18px;background:rgba(20,20,22,.82);color:#fff;font:600 13px/1.3 var(--sans);text-align:center;pointer-events:none}
.bp-toast[hidden]{display:none}
body.mcs-prev .bp-boxes,body.mcs-prev .bp-pill{display:none}

/* Önce / sonra capsule, Geri al in the top bar */
.bp-undof{position:absolute;right:12px;bottom:12px;z-index:7;display:none;padding:3px;border-radius:14px;background:rgba(20,20,22,.72);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 2px 10px rgba(0,0,0,.3)}
body.ready .bp-undof{display:block}
body.bp-video .bp-undof{bottom:64px}
body.mcs-prev .bp-undof{display:none}
.bp-undof .mcs-undo{display:flex;align-items:center;justify-content:center;width:40px;height:38px;padding:0;border:0;border-radius:11px;background:transparent;color:#fff;cursor:pointer}
.bp-undof .mcs-undo:disabled{opacity:.4;cursor:default}
@media(max-width:899px){.bp-undof{right:6px;bottom:6px}body.bp-video .bp-undof{bottom:58px}}
/* the top bar keeps one line: tool name and Yeni dosya never wrap */
.mcs-tool b,.mcs-newt{white-space:nowrap}
.mcs-size{display:none!important}
@media(max-width:899px){ body.bp-sheet.ready .stage canvas{max-height:calc(50dvh - 70px)} body.bp-sheet.ready .stage{min-height:0} }

/* Kutular only for a video */
.mcs-tab.bp-vonly{display:none}
body.bp-video .mcs-tab.bp-vonly{display:flex}

/* sheet rows */
.bp-rows{display:flex;flex-direction:column}
.bp-row{display:flex;align-items:center;gap:12px;min-height:52px;padding:6px 2px;border-bottom:1px solid var(--line);font:500 15px/1.2 var(--sans);color:var(--text)}
.bp-row[hidden]{display:none}
.bp-row.bp-col{flex-direction:column;align-items:stretch;gap:6px;padding:10px 2px}
.bp-rh{display:flex;align-items:center;gap:12px}
.bp-ri{display:flex;color:var(--muted);flex:none}
.bp-rl{flex:1;display:flex;align-items:center;gap:8px;min-width:0}
.bp-cnt{font:700 12px/1 var(--sans);font-style:normal;color:var(--accent);background:color-mix(in srgb,var(--accent) 14%,transparent);border-radius:10px;padding:3px 8px}
.bp-val{font:600 14px/1 var(--sans);color:var(--accent)}
.bp-note{margin:10px 2px 2px;font:500 13px/1.45 var(--sans);color:var(--muted)}
.bp-tgl{appearance:none;-webkit-appearance:none;width:51px;height:31px;border-radius:16px;background:var(--fill-hi);position:relative;flex:none;cursor:pointer;margin:0;transition:background .15s}
.bp-tgl::after{content:"";position:absolute;left:2px;top:2px;width:27px;height:27px;border-radius:50%;background:#fff;box-shadow:0 2px 4px rgba(0,0,0,.2);transition:left .18s var(--spring)}
.bp-tgl:checked{background:#34C759}
.bp-tgl:checked::after{left:22px}
.bp-seg{display:flex;background:var(--fill);border-radius:11px;padding:2px;gap:2px;margin:0 0 12px}
.bp-seg button{flex:1;min-height:38px;border:0;border-radius:9px;background:transparent;color:var(--muted);font:600 13px/1 var(--sans);cursor:pointer}
.bp-seg button.on{background:var(--panel);color:var(--text);box-shadow:0 1px 2px rgba(0,0,0,.14)}
.bp-seg.sm{margin:0;flex:none}
.bp-seg.sm button{min-height:34px;padding:0 12px}
.bp-tiles,.bp-addk{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin-bottom:6px}
.bp-addk{grid-template-columns:repeat(3,1fr)}
.bp-tile{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;min-height:72px;padding:8px 2px;border:2px solid transparent;border-radius:14px;background:var(--fill);color:var(--text);font:600 11.5px/1.15 var(--sans);cursor:pointer}
.bp-tile b{font-weight:600}
.bp-tile.on{border-color:var(--accent);color:var(--accent)}
.bp-tile>span{display:block;width:40px;height:24px;border-radius:6px}
.bp-sw-blur{background:linear-gradient(90deg,#c9ccd6,#eef0f4,#b8bcc8);filter:blur(1.5px)}
.bp-sw-pixel{background:conic-gradient(#9aa0ad 25%,#d7dae2 0 50%,#9aa0ad 0 75%,#d7dae2 0) 0 0/12px 12px}
.bp-sw-black{background:#000}
.bp-sw-color{background:#FF9500}
.bp-sw-logo{background:linear-gradient(120deg,#8A3FFC,#FF4D8D 55%,#FF9A3D)}
.bp-addk .bp-tile>span{width:auto;height:auto;background:none;display:flex}
.bp-sws{display:flex;flex-wrap:wrap;gap:8px;justify-content:flex-end}
.bp-dot{width:30px;height:30px;border-radius:50%;border:2px solid var(--line);padding:0;cursor:pointer;position:relative;overflow:hidden}
.bp-dot.on{outline:2px solid var(--accent);outline-offset:2px}
.bp-own{background:conic-gradient(red,yellow,lime,cyan,blue,magenta,red)}
.bp-own input{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%;height:100%}
.bp-logo canvas{display:block;border-radius:4px;background:var(--fill)}
.bp-mini{min-height:34px;padding:0 12px;border:0;border-radius:10px;background:color-mix(in srgb,var(--accent) 14%,transparent);color:var(--accent);font:600 13px/1 var(--sans);cursor:pointer}

/* Kutular: one row per track (mockup B5) */
.bp-tracks{display:flex;flex-direction:column;gap:6px}
.bp-trk{display:flex;align-items:center;gap:10px;min-height:46px;padding:0 4px 0 10px;border-radius:12px;background:var(--fill);color:var(--text);cursor:pointer}
.bp-trk>svg{color:var(--muted);flex:none}
.bp-trk b{font:600 13.5px/1 var(--sans);min-width:56px}
.bp-tb{flex:1;position:relative;height:10px;border-radius:5px;background:var(--fill-hi);overflow:hidden}
.bp-tb i{position:absolute;top:0;bottom:0;background:#2f80ff;border-radius:5px}
.bp-trk.off .bp-tb i{background:var(--muted-2)}
.bp-trk.off b{color:var(--muted)}
.bp-eye{width:40px;height:40px;border:0;border-radius:10px;background:none;color:var(--muted);display:flex;align-items:center;justify-content:center;cursor:pointer;flex:none}

/* Kırp (2026-11-12) — the same two-handle bar as Tracking Effect / Retro Effect / Lyrics Video */
.bp-trim{max-width:900px;margin:0 auto}
.bp-trim[hidden]{display:none}
body.mcs-prev .bp-trim{display:none!important}
.bp-trim .vttop{display:flex;align-items:baseline;justify-content:space-between;margin-top:6px;font-size:12px;color:var(--muted)}
.bp-trim .vttop .vtl{font-weight:600}.bp-trim .vttop .vtxt{font-variant-numeric:tabular-nums}
.bp-trim .vptrim{position:relative;height:40px;margin:4px 12px 0;touch-action:none;user-select:none;-webkit-user-select:none}
.bp-trim .vptrim .vtk{position:absolute;left:0;right:0;top:15px;height:10px;border-radius:5px;background:var(--line)}
.bp-trim .vptrim .vtsel{position:absolute;top:11px;height:18px;border-top:3px solid var(--accent);border-bottom:3px solid var(--accent);background:color-mix(in srgb,var(--accent) 16%,transparent);box-sizing:border-box}
.bp-trim .vptrim .vth{position:absolute;top:5px;width:16px;height:30px;margin-left:-8px;border-radius:6px;background:var(--accent);cursor:ew-resize;touch-action:none;box-shadow:0 1px 4px rgba(0,0,0,.35)}
.bp-trim .vptrim .vth::after{content:'';position:absolute;left:6px;top:9px;width:4px;height:12px;border-left:1.5px solid #fff;border-right:1.5px solid #fff;box-sizing:border-box}
/* the bar sits under the picture: the picture gives up its height so the dock never covers the handles */
body.ready.bp-video.bp-hastrim .stage canvas{max-height:calc((100dvh - 56px - 84px - var(--ad-top,0px) - var(--ad-bot,0px) - 24px - 62px) * var(--vz,1))}
@media(min-width:900px){body.ready.bp-video.bp-hastrim .stage canvas{max-height:calc((100dvh - 190px - 62px - var(--ad-top,0px) - var(--ad-bot,0px)) * var(--vz,1))}}

/* Kare gönder bar (2026-11-13) */
.bp-sendbar{position:fixed;left:50%;bottom:calc(env(safe-area-inset-bottom,0px) + 92px);transform:translateX(-50%);z-index:550;width:min(560px,calc(100vw - 24px));box-sizing:border-box;display:flex;flex-wrap:wrap;align-items:center;gap:10px 12px;padding:12px 14px;border-radius:18px;background:var(--card,rgba(28,28,30,.96));border:1px solid var(--line,rgba(255,255,255,.12));box-shadow:0 18px 40px rgba(0,0,0,.35);color:var(--text,#fff)}
.bp-sendbar>span{flex:1 1 220px;font:500 14px/1.35 var(--sans,system-ui)}
.bp-sendbar>div{display:flex;gap:8px;margin-left:auto}
.bp-sendbar .btn-ghost{min-height:44px;padding:0 14px}
.bp-sendbar .bp-prim{min-height:44px;padding:0 16px;border:0;border-radius:12px;background:var(--accent,#0A84FF);color:#fff;font:600 14px/1 var(--sans,system-ui);cursor:pointer}
.bp-sendbar[hidden]{display:none!important}