.a24-ssb{
  --a24-ssb-progress:0;
  position:fixed;
  top:50%;
  width:var(--a24-ssb-w-current, var(--a24-ssb-w,420px));
  max-width:calc(100vw - 24px);
  background:var(--a24-ssb-bg,#0057d9);
  color:var(--a24-ssb-text,#fff);
  border-radius:var(--a24-ssb-radius,18px);
  font-family:var(--a24-ssb-font,inherit);
  z-index:99999;
  display:block;
  padding:0;
  box-sizing:border-box;
  transition:transform .45s cubic-bezier(.2,.8,.2,1),opacity .25s ease;
  opacity:0;
  pointer-events:none;
  overflow:hidden;
}

.a24-ssb::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:0;
  pointer-events:none;
}
.a24-ssb-bg--color::before{
  background:var(--a24-ssb-bg,#0057d9);
}
.a24-ssb-bg--image::before{
  background-image:linear-gradient(var(--a24-ssb-overlay),var(--a24-ssb-overlay)),var(--a24-ssb-bg-image);
  background-size:var(--a24-ssb-bg-size,cover);
  background-position:var(--a24-ssb-bg-position,center center);
  background-repeat:no-repeat;
}
.a24-ssb-bg--gradient::before{
  background:
    radial-gradient(ellipse at 12% 18%, var(--a24-ssb-g1) 0%, transparent 42%),
    radial-gradient(ellipse at 88% 15%, var(--a24-ssb-g2) 0%, transparent 44%),
    radial-gradient(ellipse at 28% 86%, var(--a24-ssb-g3) 0%, transparent 48%),
    radial-gradient(ellipse at 82% 78%, var(--a24-ssb-g4) 0%, transparent 46%),
    radial-gradient(ellipse at 52% 48%, var(--a24-ssb-g5) 0%, transparent 58%),
    var(--a24-ssb-bg,#0057d9);
}
.a24-ssb__close,
.a24-ssb__variant{
  position:relative;
  z-index:2;
}

.a24-ssb--shadow{box-shadow:0 18px 45px rgba(0,0,0,.24)}
.a24-ssb--right{right:18px;transform:translate(calc((1 - var(--a24-ssb-progress))*115%),calc(-50% + (1 - var(--a24-ssb-progress))*var(--a24-ssb-parallax,40px)))}
.a24-ssb--left{left:18px;transform:translate(calc((1 - var(--a24-ssb-progress))*-115%),calc(-50% + (1 - var(--a24-ssb-progress))*var(--a24-ssb-parallax,40px)))}
.a24-ssb.is-visible{opacity:1;pointer-events:auto}
.a24-ssb--right.is-visible:not(.a24-ssb--parallax),
.a24-ssb--left.is-visible:not(.a24-ssb--parallax){transform:translate(0,-50%)}
.a24-ssb__close{
  position:absolute;right:10px;top:10px;width:28px;height:28px;border:0;border-radius:50%;
  background:var(--a24-ssb-close-bg,#fff);color:var(--a24-ssb-close,#0057d9);
  font-size:22px;line-height:26px;cursor:pointer;font-weight:700;z-index:3
}
.a24-ssb__variant{display:none;gap:16px;align-items:center;padding:18px 20px;box-sizing:border-box;min-height:var(--a24-ssb-h,0px)}
.a24-ssb__image{flex:0 0 92px}
.a24-ssb__image img{display:block;width:92px;height:92px;object-fit:contain}
.a24-ssb__content{padding-right:18px}
.a24-ssb__title{display:block;color:var(--a24-ssb-title,#fff);font-size:var(--a24-ssb-title-size,22px);line-height:1.1;margin:0 0 8px;font-weight:800;text-transform:uppercase}
.a24-ssb__text{font-size:var(--a24-ssb-text-size,15px);line-height:1.45}
.a24-ssb__text p{margin:0 0 10px}
.a24-ssb__button{display:inline-flex;margin-top:6px;padding:10px 16px;border-radius:10px;background:var(--a24-ssb-btn-bg,#ffd400);color:var(--a24-ssb-btn,#111);text-decoration:none!important;font-weight:800}
.a24-ssb__button:hover{filter:brightness(.96)}

@media(min-width:1201px){
  .a24-ssb{width:var(--a24-ssb-w,420px)}
  .a24-ssb__variant--desktop{display:flex}
}
@media(min-width:992px) and (max-width:1200px){
  .a24-ssb{width:var(--a24-ssb-w,360px)}
  .a24-ssb__variant--small{display:flex}
  .a24-ssb__image{flex-basis:76px}
  .a24-ssb__image img{width:76px;height:76px}
}
@media(min-width:768px) and (max-width:991px){
  .a24-ssb{width:var(--a24-ssb-w,320px)}
  .a24-ssb__variant--tablet{display:flex}
  .a24-ssb__image{flex-basis:68px}
  .a24-ssb__image img{width:68px;height:68px}
  .a24-ssb__variant{padding:16px}
}
@media(max-width:767px){
  .a24-ssb-mobile--hidden{display:none!important}
  .a24-ssb__variant--mobile{display:flex}
  .a24-ssb__variant{padding:14px 14px 14px 14px;gap:10px}
  .a24-ssb__image{flex:0 0 54px}
  .a24-ssb__image img{width:54px;height:54px}
  .a24-ssb__content{padding-right:22px}
  .a24-ssb__title{font-size:var(--a24-ssb-title-size,17px);margin-bottom:4px}
  .a24-ssb__text{font-size:var(--a24-ssb-text-size,14px);line-height:1.32}
  .a24-ssb__text p{margin-bottom:6px}
  .a24-ssb__button{padding:8px 12px;font-size:13px;border-radius:8px}

  .a24-ssb-mobile--bottom{
    top:auto;left:10px;right:10px;bottom:12px;width:auto;max-width:none;
    transform:translateY(calc((1 - var(--a24-ssb-progress))*130%));
    border-radius:14px;
  }
  .a24-ssb-mobile--bottom.is-visible:not(.a24-ssb--parallax){transform:translateY(0)}
  .a24-ssb-mobile--side.a24-ssb--right{right:10px}
  .a24-ssb-mobile--side.a24-ssb--left{left:10px}
  .a24-ssb-mobile--side{width:calc(100vw - 20px);max-width:calc(100vw - 20px)}
}

/* A24 v1.4.4 – skutečná šířka a výška podle aktivní varianty */
@media(min-width:1201px){.a24-ssb{--a24-ssb-w-current:var(--a24-ssb-w-desktop,420px);--a24-ssb-h-current:var(--a24-ssb-h-desktop,0px)}}
@media(min-width:992px) and (max-width:1200px){.a24-ssb{--a24-ssb-w-current:var(--a24-ssb-w-small,360px);--a24-ssb-h-current:var(--a24-ssb-h-small,0px)}}
@media(min-width:768px) and (max-width:991px){.a24-ssb{--a24-ssb-w-current:var(--a24-ssb-w-tablet,320px);--a24-ssb-h-current:var(--a24-ssb-h-tablet,0px)}}
@media(max-width:767px){.a24-ssb{--a24-ssb-w-current:var(--a24-ssb-w-mobile,0px);--a24-ssb-h-current:var(--a24-ssb-h-mobile,0px)}}

.a24-ssb__variant{min-height:var(--a24-ssb-h-current,0px)}
.a24-ssb--bg-natural-size{width:min(var(--a24-ssb-natural-w), calc(100vw - 24px))}
.a24-ssb--bg-natural-size .a24-ssb__variant{min-height:var(--a24-ssb-natural-h)}

.a24-ssb__content{display:flex;flex-direction:column;align-self:stretch;flex:1}
.a24-ssb-btn-h--left .a24-ssb__button{align-self:flex-start}
.a24-ssb-btn-h--center .a24-ssb__button{align-self:center}
.a24-ssb-btn-h--right .a24-ssb__button{align-self:flex-end}

.a24-ssb-btn-v--top .a24-ssb__button{margin-top:0;margin-bottom:auto}
.a24-ssb-btn-v--middle .a24-ssb__button{margin-top:auto;margin-bottom:auto}
.a24-ssb-btn-v--bottom .a24-ssb__button{margin-top:auto;margin-bottom:0}
