/* МОЯТ КЕЙС БАР - public/assets/js/casebar.js */
.kcb{--c-ink:#11141B;--c-lime:#D4F23C;--c-muted:#59606C;--c-field:#E7EAE3;--c-line:#D9DCD6;
  /* --pw/--pg: ширината на копчето на колелото и отстоянието до него (casebar.js ги мери).
     Двете стоят като една група в центъра: [копче][лента]. */
  --pw:0px;--pg:0px;--bw:min(780px,calc(100% - 24px - var(--pw) - var(--pg)));
  position:fixed;left:calc(50% - (var(--bw) + var(--pw) + var(--pg)) / 2 + var(--pw) + var(--pg));bottom:calc(14px + env(safe-area-inset-bottom,0px));z-index:80;width:var(--bw);
  font-family:var(--font-body,system-ui,sans-serif);opacity:0;transition:opacity .3s,transform .35s cubic-bezier(.2,.8,.2,1)}
body.kcb-ready .kcb{opacity:1}
body.has-kcb{padding-bottom:96px}
/* Не се бие с другите слоеве */
body.kd-locked .kcb,body.mnav-locked .kcb,body.search-open .kcb,html.kw-open .kcb,html.kcb-locked .kcb{opacity:0;pointer-events:none;transform:translateY(20px)}
/* Копчето на колелото стои вляво от лентата, на същата линия и със същата височина. */
body.has-kcb .kw-pill{--pw:var(--kcb-pw,0px);--pg:var(--kcb-pg,0px);--bw:min(780px,calc(100% - 24px - var(--pw) - var(--pg)));
  left:calc(50% - (var(--bw) + var(--pw) + var(--pg)) / 2);bottom:calc(14px + env(safe-area-inset-bottom,0px));height:68px;padding:0 22px 0 8px}
body.has-kcb .kw-pill b{height:52px;padding:0 16px}
body.has-kcb .kcb{--pw:var(--kcb-pw,0px);--pg:var(--kcb-pg,0px)}
/* По-тесен екран: копчето е само кръгче с отстъпката (кодът пак се копира с натискане) - лентата има място за текста. */
@media (max-width:1099px){
  body.has-kcb .kw-pill{padding:0 8px;gap:0;font-size:0;letter-spacing:0}
  body.has-kcb .kw-pill b{font-size:13px}
  body.has-kcb .kw-pill.is-copied::after{display:none}
}
body.kcb-open .kw-pill{opacity:0;pointer-events:none}

.kcb__bar{display:flex;align-items:center;gap:14px;padding:8px 8px 8px 10px;border-radius:999px;background:var(--c-ink);color:#fff;box-shadow:0 18px 40px -16px rgba(17,20,27,.6)}
.kcb__slots{display:flex;align-items:center;gap:0;padding:0;border:0;background:none;cursor:pointer;flex:none}
.kcb__slot{width:40px;height:52px;margin-right:-10px;border-radius:10px;border:1.5px dashed rgba(255,255,255,.35);background:rgba(255,255,255,.06);overflow:hidden;display:block;transition:transform .2s}
.kcb__slot.is-full{border:2px solid var(--c-ink);background:#fff}
.kcb__slot img{width:100%;height:100%;object-fit:contain;display:block}
.kcb__slot:nth-child(2){transform:rotate(-4deg)}.kcb__slot:nth-child(3){transform:rotate(4deg)}
.kcb__slots:hover .kcb__slot{transform:translateY(-3px)}
.kcb__more{margin-left:16px;font-size:12px;font-weight:700;color:var(--c-lime)}
.kcb__msg{flex:1;min-width:0;margin-left:10px;display:flex;flex-direction:column;align-items:flex-start;gap:2px;background:none;border:0;color:inherit;text-align:left;padding:0;cursor:default}
.kcb__msg b{font-family:var(--font-display,"Alumni Sans",Impact,sans-serif);font-weight:800;font-size:22px;line-height:1;text-transform:uppercase;letter-spacing:.01em;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.kcb__msg small{font-size:12.5px;color:rgba(255,255,255,.62);max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.kcb__actions{display:flex;align-items:center;gap:8px;flex:none}
.kcb__cta{height:46px;padding:0 20px;border:0;border-radius:999px;background:var(--c-lime);color:var(--c-ink);font-weight:700;font-size:12px;letter-spacing:.12em;text-transform:uppercase;cursor:pointer;white-space:nowrap;transition:transform .2s}
.kcb__cta:hover{transform:translateY(-2px)}
.kcb__cta:disabled{opacity:.6}
.kcb__friend{width:46px;height:46px;border-radius:50%;border:1.5px solid rgba(255,255,255,.22);background:transparent;color:#fff;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:border-color .2s,color .2s}
.kcb__friend:hover{border-color:var(--c-lime);color:var(--c-lime)}
.kcb__min{width:30px;height:30px;border-radius:50%;border:0;background:transparent;color:rgba(255,255,255,.5);cursor:pointer;flex:none;display:inline-flex;align-items:center;justify-content:center}
.kcb__min:hover{color:#fff}
/* Свита */
.kcb.is-min .kcb__bar{display:none}
.kcb__tab{position:absolute;right:0;bottom:0;display:inline-flex;align-items:center;gap:8px;height:44px;padding:0 16px 0 6px;border-radius:999px;border:0;background:var(--c-ink);color:#fff;font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;cursor:pointer;box-shadow:0 12px 26px -12px rgba(17,20,27,.6)}
.kcb__tab[hidden]{display:none}
.kcb__tabcount{display:inline-flex;align-items:center;justify-content:center;min-width:32px;height:32px;border-radius:999px;background:var(--c-lime);color:var(--c-ink)}
.kcb-need{outline:3px solid var(--c-lime)!important;outline-offset:2px}

/* Панел */
.kcb-sheet{position:fixed;inset:0;z-index:2147482000;display:flex;align-items:center;justify-content:center;padding:16px}
.kcb-sheet[hidden]{display:none}
html.kcb-locked{overflow:hidden;scrollbar-gutter:stable}
.kcb-sheet__bg{position:absolute;inset:0;background:rgba(17,20,27,.55);backdrop-filter:blur(4px);opacity:0;transition:opacity .25s}
.kcb-sheet__card{position:relative;width:min(640px,100%);max-height:calc(100dvh - 32px);overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;background:#fff;border-radius:28px;padding:34px 30px 28px;
  box-shadow:0 40px 90px -30px rgba(17,20,27,.55);opacity:0;transform:translateY(14px);transition:opacity .25s,transform .3s cubic-bezier(.2,.7,.2,1);color:var(--c-ink,#11141B)}
.kcb-sheet.is-in .kcb-sheet__bg{opacity:1}
.kcb-sheet.is-in .kcb-sheet__card{opacity:1;transform:none}
.kcb-sheet__x{position:absolute;top:12px;right:14px;width:40px;height:40px;border-radius:50%;border:0;background:#E7EAE3;color:#11141B;font-size:24px;line-height:1;cursor:pointer}
.kcb-h{margin:0 40px 10px 0;font-family:var(--font-display,"Alumni Sans",Impact,sans-serif);font-weight:900;font-size:clamp(32px,4.4vw,46px);line-height:.92;text-transform:uppercase}
.kcb-p{margin:0 0 18px;font-size:14.5px;line-height:1.55;color:#59606C}
.kcb-p--muted{margin:8px 0}
.kcb-fine{margin:10px 0 0;font-size:12.5px;color:#59606C;text-align:center}
.kcb-err{margin:10px 0 0;font-size:13px;color:#B42318}
.kcb-err[hidden]{display:none}
.kcb-link{display:block;margin:14px auto 0;background:none;border:0;color:#59606C;font-size:13px;text-decoration:underline;cursor:pointer}
.kcb-btn{display:inline-flex;align-items:center;justify-content:center;height:50px;padding:0 20px;border-radius:999px;border:1.5px solid #D9DCD6;background:#fff;color:#11141B;font-weight:700;font-size:12px;letter-spacing:.1em;text-transform:uppercase;text-decoration:none;cursor:pointer;white-space:nowrap;transition:transform .2s,border-color .2s}
.kcb-btn:hover{transform:translateY(-2px);border-color:#11141B}
.kcb-btn--ink{background:#11141B;border-color:#11141B;color:#fff}
.kcb-btn:disabled{opacity:.5;transform:none;cursor:default}
.kcb-row{display:flex;gap:10px;margin-top:16px}
.kcb-row>.kcb-btn{flex:1}
.kcb-row--share{margin-top:10px}
.kcb-in{flex:1;min-width:0;height:50px;padding:0 20px;border-radius:999px;border:1.5px solid #D9DCD6;font-size:16px;color:#11141B;background:#fff;outline:none}
.kcb-in:focus{border-color:#11141B;box-shadow:0 0 0 4px #D4F23C}
.kcb-form,.kcb-share{display:flex;gap:10px}
/* Настроение */
.kcb-chips{display:flex;flex-wrap:wrap;gap:8px;margin:6px 0 18px}
.kcb-chip{height:38px;padding:0 16px;border-radius:999px;border:1.5px solid #D9DCD6;background:#fff;color:#11141B;font-size:13px;font-weight:600;cursor:pointer;transition:background .2s,border-color .2s}
.kcb-chip:hover{border-color:#11141B}
.kcb-chip.is-on{background:#11141B;border-color:#11141B;color:#D4F23C}
.kcb-pick{display:grid;grid-template-columns:180px 1fr;gap:20px;align-items:center;padding:14px;border-radius:22px;background:#E7EAE3;animation:kcb-in .35s cubic-bezier(.2,.8,.2,1)}
.kcb-pick--empty{display:block;text-align:center;color:#59606C;font-size:14px;padding:30px}
.kcb-pick__img{display:block;border-radius:14px;overflow:hidden;background:#fff}
.kcb-pick__img img{display:block;width:100%;aspect-ratio:3/4;object-fit:contain}
.kcb-pick__info b{display:block;font-family:var(--font-display,"Alumni Sans",Impact,sans-serif);font-weight:800;font-size:28px;line-height:.95;text-transform:uppercase}
.kcb-pick__info span{display:block;margin:6px 0 14px;font-weight:700}
.kcb-pick__btns{display:flex;flex-direction:column;gap:8px}
@keyframes kcb-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
/* Гардероб */
.kcb-looks{display:flex;gap:12px;overflow-x:auto;padding:4px 2px 10px;scroll-snap-type:x mandatory}
.kcb-look{flex:0 0 164px;margin:0;scroll-snap-align:start;border-radius:18px;background:#E7EAE3;padding:10px;display:flex;flex-direction:column;gap:8px;position:relative}
.kcb-look img{width:100%;aspect-ratio:3/4;object-fit:contain;border-radius:12px;background:#fff}
.kcb-look__tag{position:absolute;top:16px;left:16px;height:26px;padding:0 10px;border-radius:999px;border:0;background:#D4F23C;color:#11141B;font-size:10.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;cursor:pointer}
.kcb-look figcaption{font-size:13px;font-weight:600;line-height:1.3}
.kcb-look figcaption small{display:block;font-weight:400;color:#59606C;margin-top:2px}
.kcb-look--add{border:1.5px dashed rgba(89,96,108,.55);background:transparent;align-items:center;justify-content:center;min-height:250px;color:#59606C;font-size:13px;font-weight:600;cursor:pointer}
.kcb-look--add span{font-size:34px;line-height:1;color:#11141B}
.kcb-sum{display:flex;justify-content:space-between;align-items:center;margin-top:12px;padding:14px 16px;border-radius:14px;background:#F3F4F1;font-size:13.5px}
.kcb-sum b{font-size:18px}
/* С приятел */
.kcb-list{margin-top:18px;display:flex;flex-direction:column;gap:14px}
.kcb-who>b{display:block;margin-bottom:6px;font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:#59606C}
.kcb-item{display:flex;align-items:center;gap:12px;padding:8px;border-radius:14px;background:#F3F4F1;margin-bottom:6px}
.kcb-item img{width:44px;height:58px;object-fit:contain;border-radius:10px;background:#fff}
.kcb-item div{flex:1;min-width:0}
.kcb-item span{display:block;font-weight:600;font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.kcb-item small{display:block;color:#59606C;font-size:12.5px}
.kcb-item__x{width:34px;height:34px;border-radius:50%;border:0;background:#fff;font-size:20px;cursor:pointer;color:#59606C}

@media (max-width:720px){
  .kcb{bottom:calc(8px + env(safe-area-inset-bottom,0px))}
  body.has-kcb{padding-bottom:80px}
  .kcb__bar{flex-wrap:wrap;gap:10px;padding:8px 8px 8px 10px;border-radius:28px}
  .kcb__slot{width:32px;height:42px;margin-right:-8px}
  .kcb__msg{margin-left:8px;cursor:pointer}
  .kcb__msg b{font-size:18px}
  .kcb__msg small{display:none}
  .kcb__actions{display:none;width:100%;order:3}
  .kcb__min{order:2}
  .kcb__actions .kcb__cta{flex:1}
  .kcb.is-open .kcb__msg small{display:block;white-space:normal}
  .kcb.is-open .kcb__actions{display:flex}
  .kcb.is-open .kcb__min svg{transform:rotate(0)}
  .kcb__min svg{transform:rotate(180deg)}
  body.has-kcb .kcb,body.has-kcb .kw-pill{--bw:calc(100% - 16px - var(--pw) - var(--pg))}
  body.has-kcb .kw-pill{bottom:calc(8px + env(safe-area-inset-bottom,0px));height:58px;padding:0 7px}
  body.has-kcb .kw-pill b{height:44px;padding:0 10px;font-size:12px}
  .kcb-sheet{align-items:flex-end;padding:0}
  .kcb-sheet__card{border-radius:28px 28px 0 0;max-height:92dvh;padding:28px 18px calc(22px + env(safe-area-inset-bottom,0px))}
  .kcb-pick{grid-template-columns:120px 1fr;gap:14px}
  .kcb-pick__info b{font-size:22px}
  .kcb-row{flex-direction:column}
  .kcb-form,.kcb-share{flex-direction:column}
  .kcb-look{flex-basis:140px}
}
@media (prefers-reduced-motion:reduce){.kcb,.kcb-sheet__card,.kcb-sheet__bg,.kcb-pick{transition:none;animation:none}}
/* Избор на модел направо в предложението */
.kcb-model{display:block;margin:0 0 10px}
.kcb-model span{display:block;margin:0 0 6px;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#59606C}
.kcb-sheet select.kcb-model__sel{display:block;width:100%;height:50px;padding:0 48px 0 22px!important;border:1.5px solid #D9DCD6!important;border-radius:999px!important;
  font-family:inherit;font-size:16px;font-weight:600;color:#11141B!important;cursor:pointer;-webkit-appearance:none;appearance:none;
  background:#fff url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2311141B' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'><path d='M6 9l6 6 6-6'/></svg>") no-repeat right 20px center!important;
  transition:border-color .2s,box-shadow .2s}
.kcb-sheet select.kcb-model__sel:hover{border-color:#11141B!important}
.kcb-sheet select.kcb-model__sel:focus{outline:none;border-color:#11141B!important;box-shadow:0 0 0 4px #D4F23C}
.kcb-sheet select.kcb-model__sel.kcb-need{border-color:#11141B!important;box-shadow:0 0 0 4px #D4F23C;outline:none!important}
.kcb-ok{display:inline-flex;align-items:center;gap:8px;margin:0 0 12px;height:34px;padding:0 14px 0 10px;border-radius:999px;background:#D4F23C;color:#11141B;font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.kcb-ok svg{flex:none}
.kcb-pick__info{min-width:0}
.kcb-pick__btns .kcb-btn{width:100%;padding:0 12px}
@media (max-width:720px){.kcb-pick__btns .kcb-btn{letter-spacing:.04em;font-size:11px}}
/* Премахване от гардероба */
.kcb-look__x{position:absolute;bottom:10px;right:10px;width:30px;height:30px;border-radius:50%;border:0;background:#fff;color:#11141B;font-size:20px;line-height:1;cursor:pointer;box-shadow:0 2px 8px rgba(17,20,27,.18);display:flex;align-items:center;justify-content:center;transition:transform .2s}
.kcb-look__x:hover{transform:translateY(-2px)}
.kcb-look__x:focus-visible{outline:3px solid #D4F23C;outline-offset:2px}
.kcb-look.is-removing{opacity:.4;pointer-events:none}
.kcb-look:not(.kcb-look--add) figcaption{padding-right:34px}
@media (max-width:720px){.kcb-row>.kcb-btn{flex:none}}

/* Общ сет: три стъпки + блокове по стъпка (18.10.2026) */
.kcb-btn--accent{background:#D4F23C;border-color:#D4F23C;color:#11141B}
.kcb-btn--accent:hover{border-color:#D4F23C}
.kcb-btn--wide{display:flex;width:100%;margin-top:12px}
.kcb-steps{list-style:none;margin:6px 0 20px;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:8px;counter-reset:none}
.kcb-step{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:14px;background:#F3F4F1;color:#59606C}
.kcb-step>b{flex:none;display:flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:50%;background:#fff;color:#11141B;font-size:13px;font-weight:700}
.kcb-step>span{display:flex;flex-direction:column;font-size:13px;font-weight:700;line-height:1.2;color:#11141B}
.kcb-step small{font-size:11.5px;font-weight:400;color:#59606C}
.kcb-step.is-cur{background:#11141B}
.kcb-step.is-cur>b{background:#D4F23C}
.kcb-step.is-cur>span,.kcb-step.is-cur small{color:#fff}
.kcb-step.is-done>b{background:#D4F23C}
.kcb-lbl{display:block;margin:0 0 8px;font-size:12px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:#59606C}
.kcb-block{margin-top:14px;padding:18px;border-radius:22px;background:#F3F4F1}
.kcb-block__h{display:flex;align-items:center;flex-wrap:wrap;gap:10px;margin:0 0 12px;font-weight:700;font-size:15px;color:#11141B}
.kcb-block__h>b{display:flex;align-items:center;justify-content:center;width:26px;height:26px;border-radius:50%;background:#D4F23C;font-size:12px}
.kcb-block__h em{margin-left:auto;font-style:normal;font-weight:600;font-size:12px;color:#59606C}
.kcb-block .kcb-in{background:#fff}
.kcb-block .kcb-list{margin:0 0 4px}
.kcb-fine--left{text-align:left}
@media (max-width:640px){
  .kcb-steps{grid-template-columns:1fr;gap:6px}
  .kcb-step{padding:8px 12px}
  .kcb-block{padding:14px}
  .kcb-block__h em{margin-left:36px;width:100%}
}
@media (max-width:640px){.kcb-form .kcb-in,.kcb-share .kcb-in{flex:none;height:50px;min-height:50px;width:100%}}