/* v28.1 — كاميرا بأسلوب 2026: معاينة بزوايا دائرية + شريط سفلي داكن + فلاتر حول زر التصوير */
.cam.v281{--bar:calc(92px + env(safe-area-inset-bottom));background:#000}
.cam.v281 .cam-stage{top:calc(env(safe-area-inset-top) + 4px);bottom:var(--bar);left:0;right:0;border-radius:20px}
.cam.v281 .cam-shade{top:calc(env(safe-area-inset-top) + 4px);bottom:var(--bar);border-radius:20px;background:linear-gradient(180deg,#0000008c 0%,#00000000 20%,#00000000 66%,#000000a6 100%)}

/* الأدوات الجانبية: أيقونات فقط + ظل يجعلها واضحة على أي خلفية */
.cam.v281 .cam-side{top:calc(78px + env(safe-area-inset-top))!important;gap:6px!important}
.cam.v281 .cam-side button{width:46px!important;height:46px!important;justify-content:center;filter:drop-shadow(0 1px 2px #000c) drop-shadow(0 0 8px #0006)}
.cam.v281 .cam-side button small{display:none}
.cam.v281 .cam-side button svg{width:27px;height:27px}
.cam.v281 .cam-side .chev svg{width:26px;height:26px;padding:0;background:none;transition:transform .25s}
.cam.v281.side-open .cam-side .chev svg{transform:rotate(180deg)}
.cam.v281 .cs-extra{display:none;flex-direction:column;gap:6px}
.cam.v281.side-open .cs-extra{display:flex}
.cam.v281 .cam-side em{top:2px!important;right:0!important}
.cam.v281 .cam-top button,.cam.v281 .cam-sound{filter:drop-shadow(0 1px 3px #0009)}

/* دوائر الفلاتر على نفس سطر زر التصوير — الدائرة المختارة تحت الزر */
.cam.v281 .cam-filters{bottom:calc(var(--bar) + 26px)!important;height:84px;align-items:center!important;gap:16px!important;padding:0 calc(50% - 27px)!important;opacity:1!important;pointer-events:auto!important;transform:none!important}
.cam.v281 .cam-filters button small{display:none}
.cam.v281 .cam-filters span{width:54px!important;height:54px!important;border-radius:27px!important;border:2px solid #ffffffb3!important;box-shadow:0 2px 10px #0008!important}
.cam.v281 .cam-filters button.on span{width:54px!important;height:54px!important;border:2px solid #fff!important;box-shadow:none!important;transform:none!important}
.cam.v281 .cam-bottom{bottom:calc(var(--bar) + 20px)!important;left:0!important;right:0!important;justify-content:center;pointer-events:none}
.cam.v281 .cam-bottom>*{pointer-events:auto}
.cam.v281 .cam-rec{width:90px;height:90px}
.cam.v281 .cam-ring{width:90px;height:90px}
.cam.v281 .cam-dot{width:66px;height:66px;box-shadow:0 0 0 0 #0000}
.cam.v281.show-filters:not(.recording):not(.has-segs):not(.photo):not(.textmode) .cam-dot{background:#FF2D7Ae6}
.cam.v281 .cam-del,.cam.v281 .cam-done{position:absolute;top:50%;transform:translateY(-50%)}
.cam.v281 .cam-del{right:calc(50% + 70px)}
.cam.v281 .cam-done{left:calc(50% + 70px)}
.cam.v281 .cam-fmini{position:absolute;z-index:4;left:0;right:0;bottom:calc(var(--bar) + 118px);text-align:center;font-size:12px;font-weight:800;color:#fff;text-shadow:0 1px 4px #000;pointer-events:none;transition:opacity .2s}
.cam.v281.recording .cam-filters,.cam.v281.has-segs .cam-filters,.cam.v281.textmode .cam-filters,.cam.v281.duet .cam-filters{opacity:0!important;pointer-events:none!important}
.cam.v281.recording .cam-fmini,.cam.v281.has-segs .cam-fmini,.cam.v281.textmode .cam-fmini,.cam.v281.duet .cam-fmini{opacity:0}

/* الشريط السفلي الداكن: المعرض + الأوضاع + الملصقات */
.cam.v281 .cam-modes{bottom:calc(env(safe-area-inset-bottom) + 30px)!important;background:none!important;padding:0!important;gap:4px!important;border:0!important;backdrop-filter:none!important}
.cam.v281 .cam-modes button{padding:6px 10px!important;font-size:14px!important;color:#ffffff80!important;background:none!important;border-radius:0!important;position:relative}
.cam.v281 .cam-modes button.on{color:#fff!important;font-weight:800;background:none!important}
.cam.v281 .cam-modes button.on::after{content:'';position:absolute;left:50%;bottom:-4px;width:5px;height:5px;margin-left:-2.5px;border-radius:50%;background:#fff}
.cam.v281 .cam-gal,.cam.v281 .cam-stk{position:fixed;bottom:calc(env(safe-area-inset-bottom) + 22px);width:42px;height:42px}
.cam.v281 .cam-gal{right:18px;border-radius:10px;border:2px solid #fff!important;background-size:cover!important;background-position:center!important}
.cam.v281 .cam-gal.has-thumb svg{opacity:0}
.cam.v281 .cam-stk{left:18px;border-radius:21px}
.cam.v281 .cam-hint{bottom:calc(env(safe-area-inset-bottom) + 34px)}
.cam.v281.recording .cam-hint,.cam.v281.has-segs .cam-hint{display:block!important}

/* المنشور النصي */
.cam.v281 .cam-textmode{position:absolute;inset:0;z-index:2;display:flex;align-items:center;justify-content:center;padding:90px 28px 150px;touch-action:auto}
.cam-textmode textarea{width:100%;min-height:160px;max-height:60%;background:none;border:0;outline:none;resize:none;color:#fff;text-align:center;font:800 32px/1.5 Cairo,sans-serif;text-shadow:0 2px 12px #0005;direction:rtl}
.cam-textmode textarea::placeholder{color:#ffffffa6}
.cam-textmode textarea.mid{font-size:25px}.cam-textmode textarea.long{font-size:20px}
.ctm-bg{position:absolute;top:84px;right:16px;display:flex!important;align-items:center;gap:6px;height:36px;padding:0 12px 0 6px!important;border-radius:18px;background:#0000004d!important;font-size:12.5px;font-weight:700}
.ctm-bg i{width:24px;height:24px;border-radius:12px;border:2px solid #fff}
.cam.v281.textmode .cam-side,.cam.v281.textmode .cam-stk{display:none!important}
.cam.v281.textmode .cam-dot{background:#fff}
/* الأوضاع بين مربع المعرض وزر الملصقات بدون تداخل */
.cam.v281 .cam-modes{left:62px!important;right:62px!important;transform:none!important;justify-content:center;gap:0!important;overflow-x:auto;scrollbar-width:none}
.cam.v281 .cam-modes::-webkit-scrollbar{display:none}
.cam.v281 .cam-modes button{padding:6px 7px!important;font-size:13.5px!important;flex-shrink:0}
.cam.v281 .cam-gal,.cam.v281 .cam-stk{width:40px;height:40px;bottom:calc(env(safe-area-inset-bottom) + 24px)}
.cam.v281 .cam-gal{right:12px}.cam.v281 .cam-stk{left:12px}
.cam.v281 .cam-modes{padding:2px 0 10px!important;bottom:calc(env(safe-area-inset-bottom) + 22px)!important}
