/* =========================================================
   JOSPORT.CZ — REDESIGN 2026 / PATIČKA V9 PREMIUM
   ČISTÁ ÚPRAVA DESIGNU — POUZE CSS
   Hlavní barva: #254480
   Akcent: #199CE6
   ========================================================= */

:root{
  --jf9-primary:#254480;
  --jf9-primary-dark:#1b3565;
  --jf9-primary-light:#315a9c;
  --jf9-accent:#199ce6;
  --jf9-accent-light:#59bff3;
  --jf9-white:#fff;
  --jf9-text:#eaf1f8;
  --jf9-muted:#b8c6d7;
  --jf9-line:rgba(255,255,255,.12);
}

/* Zbytky starších variant */
.josport-footer-extra,
.jf4-shell{
  display:none!important;
}

#footer .footer-rows,
.footer .footer-rows{
  display:block!important;
}

/* CELÁ PATIČKA */
#footer,
.footer{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  margin-top:0;
  padding-bottom:92px;
  color:var(--jf9-text)!important;
  font-family:"Roboto",Arial,sans-serif;
  background:
    radial-gradient(circle at 88% 12%,rgba(25,156,230,.15),transparent 28%),
    radial-gradient(circle at 10% 100%,rgba(255,255,255,.025),transparent 28%),
    linear-gradient(135deg,var(--jf9-primary-dark) 0%,var(--jf9-primary) 56%,var(--jf9-primary-light) 100%)!important;
  border-top:4px solid var(--jf9-accent);
}

#footer::before,
.footer::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  pointer-events:none;
  background:
    linear-gradient(120deg,transparent 0 72%,rgba(255,255,255,.014) 72% 73%,transparent 73%),
    radial-gradient(circle at 72% 18%,rgba(25,156,230,.035),transparent 18%);
}

#footer::after,
.footer::after{
  content:"";
  position:absolute;
  top:0;
  left:10%;
  right:10%;
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.45),transparent);
  pointer-events:none;
}

#footer .container,
.footer .container{
  width:100%;
  max-width:1480px;
  padding-left:30px;
  padding-right:30px;
}

/* HLAVNÍ ROZLOŽENÍ */
#footer .footer-rows,
.footer .footer-rows{
  padding:36px 0 24px!important;
  background:transparent!important;
}

#footer .footer-row,
.footer .footer-row,
#footer .custom-footer,
.footer .custom-footer{
  margin:0!important;
  background:transparent!important;
}

#footer .custom-footer,
.footer .custom-footer{
  display:grid!important;
  grid-template-columns:1fr 1fr 1.05fr 1.34fr;
  gap:0!important;
  align-items:start!important;
}

#footer .custom-footer>div,
.footer .custom-footer>div{
  float:none!important;
  width:auto!important;
  min-width:0!important;
  height:auto!important;
  margin:0!important;
  padding:0 28px!important;
  border-right:1px solid var(--jf9-line);
}

#footer .custom-footer>div:first-child,
.footer .custom-footer>div:first-child{
  padding-left:0!important;
}

#footer .custom-footer>div:last-child,
.footer .custom-footer>div:last-child{
  padding-right:0!important;
  border-right:0!important;
}

#footer .custom-footer>div>div,
.footer .custom-footer>div>div{
  height:auto!important;
  min-height:0!important;
  padding:0!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
}

/* NADPISY */
#footer h4,
#footer .h4,
.footer h4,
.footer .h4{
  position:relative;
  display:inline-block;
  margin:0 0 20px!important;
  padding:0 0 12px!important;
  color:var(--jf9-white)!important;
  font-family:"Roboto Condensed","Roboto",Arial,sans-serif!important;
  font-size:19px!important;
  font-weight:700!important;
  line-height:1.2!important;
  letter-spacing:.015em;
  text-transform:none!important;
}

#footer h4::after,
#footer .h4::after,
.footer h4::after,
.footer .h4::after{
  content:"";
  position:absolute;
  left:0;
  bottom:0;
  width:48px;
  height:3px;
  border-radius:99px;
  background:linear-gradient(90deg,var(--jf9-accent),var(--jf9-accent-light));
  box-shadow:0 0 12px rgba(25,156,230,.28);
}

/* ODKAZY */
#footer ul,
.footer ul{
  margin:0!important;
  padding:0!important;
  list-style:none!important;
}

#footer li,
.footer li{
  margin:0 0 8px!important;
  padding:0!important;
}

#footer a,
.footer a{
  color:var(--jf9-text)!important;
  text-decoration:none!important;
  transition:color .2s ease,transform .2s ease,opacity .2s ease,background .2s ease,border-color .2s ease;
}

#footer li a,
.footer li a{
  position:relative;
  display:inline-flex;
  align-items:flex-start;
  min-height:21px;
  padding-left:16px!important;
  font-size:14px!important;
  line-height:1.42!important;
}

#footer li a::before,
.footer li a::before{
  content:"";
  position:absolute;
  left:1px;
  top:.52em;
  width:6px;
  height:6px;
  border-top:2px solid var(--jf9-accent);
  border-right:2px solid var(--jf9-accent);
  transform:rotate(45deg);
  transition:transform .2s ease;
}

#footer li a:hover,
.footer li a:hover{
  color:#fff!important;
  transform:translateX(4px);
}

#footer li a:hover::before,
.footer li a:hover::before{
  transform:translateX(2px) rotate(45deg);
}

/* TEXTY A KONTAKTY */
#footer p,
#footer address,
.footer p,
.footer address{
  margin:0 0 8px!important;
  color:var(--jf9-text)!important;
  font-size:14px!important;
  line-height:1.58!important;
  font-style:normal!important;
}

#footer strong,
.footer strong{
  color:#fff!important;
  font-weight:700!important;
}

#footer a[href^="tel:"],
#footer a[href^="mailto:"],
.footer a[href^="tel:"],
.footer a[href^="mailto:"]{
  color:#fff!important;
  font-weight:600!important;
}

#footer a[href^="tel:"]:hover,
#footer a[href^="mailto:"]:hover,
.footer a[href^="tel:"]:hover,
.footer a[href^="mailto:"]:hover{
  color:var(--jf9-accent-light)!important;
}

/* NEWSLETTER */
#footer .newsletter-widget,
.footer .newsletter-widget{
  margin-top:0!important;
}

#footer .newsletter-widget form,
.footer .newsletter-widget form,
#footer form[name="newsletter"],
.footer form[name="newsletter"]{
  display:flex!important;
  align-items:center!important;
  width:100%!important;
  max-width:100%!important;
  margin:13px 0 0!important;
  padding:4px!important;
  background:rgba(255,255,255,.09)!important;
  border:1px solid rgba(255,255,255,.20)!important;
  border-radius:8px!important;
  box-shadow:0 12px 28px rgba(11,31,63,.16)!important;
}

#footer .newsletter-widget input,
.footer .newsletter-widget input,
#footer form[name="newsletter"] input,
.footer form[name="newsletter"] input{
  flex:1 1 auto!important;
  min-width:0!important;
  height:43px!important;
  margin:0!important;
  padding:0 13px!important;
  color:#fff!important;
  background:transparent!important;
  border:0!important;
  outline:0!important;
  box-shadow:none!important;
}

#footer .newsletter-widget input::placeholder,
.footer .newsletter-widget input::placeholder,
#footer form[name="newsletter"] input::placeholder,
.footer form[name="newsletter"] input::placeholder{
  color:var(--jf9-muted)!important;
  opacity:1!important;
}

#footer .newsletter-widget button,
#footer .newsletter-widget .btn,
.footer .newsletter-widget button,
.footer .newsletter-widget .btn,
#footer form[name="newsletter"] button,
.footer form[name="newsletter"] button{
  flex:0 0 auto!important;
  min-width:47px!important;
  height:43px!important;
  margin:0!important;
  padding:0 14px!important;
  color:#fff!important;
  background:linear-gradient(135deg,var(--jf9-accent),#0d83c8)!important;
  border:0!important;
  border-radius:5px!important;
  box-shadow:0 8px 18px rgba(25,156,230,.28)!important;
}

#footer .newsletter-widget button:hover,
#footer .newsletter-widget .btn:hover,
.footer .newsletter-widget button:hover,
.footer .newsletter-widget .btn:hover,
#footer form[name="newsletter"] button:hover,
.footer form[name="newsletter"] button:hover{
  background:linear-gradient(135deg,var(--jf9-accent-light),var(--jf9-accent))!important;
  transform:translateY(-1px);
}

/* SOCIÁLNÍ SÍTĚ */
#footer .social-icons,
.footer .social-icons{
  display:flex!important;
  flex-wrap:wrap!important;
  gap:10px!important;
  margin-top:17px!important;
}

#footer .social-icons a,
.footer .social-icons a,
#footer a.facebook,
#footer a.instagram,
.footer a.facebook,
.footer a.instagram{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:42px!important;
  height:42px!important;
  padding:0!important;
  color:#fff!important;
  background:rgba(255,255,255,.065)!important;
  border:1px solid rgba(255,255,255,.20)!important;
  border-radius:50%!important;
  box-shadow:0 8px 20px rgba(11,31,63,.14);
}

#footer .social-icons a::before,
.footer .social-icons a::before{
  display:none!important;
}

#footer .social-icons a:hover,
.footer .social-icons a:hover,
#footer a.facebook:hover,
#footer a.instagram:hover,
.footer a.facebook:hover,
.footer a.instagram:hover{
  background:var(--jf9-accent)!important;
  border-color:var(--jf9-accent)!important;
  transform:translateY(-3px);
}

/* COPYRIGHT */
#footer .footer-bottom,
.footer .footer-bottom{
  position:relative!important;
  z-index:2!important;
  margin-top:18px!important;
  color:var(--jf9-muted)!important;
  background:transparent!important;
  border-top:1px solid rgba(255,255,255,.12)!important;
}

#footer .footer-bottom .container,
.footer .footer-bottom .container{
  min-height:56px!important;
  padding-top:14px!important;
  padding-bottom:14px!important;
}

#footer .copyright,
.footer .copyright,
#footer .footer-bottom,
.footer .footer-bottom{
  font-size:13px!important;
  line-height:1.45!important;
}

/* TABLET */
@media (max-width:1199px){
  #footer,
  .footer{
    padding-bottom:120px;
  }

  #footer .custom-footer,
  .footer .custom-footer{
    grid-template-columns:1fr 1fr;
    row-gap:28px!important;
  }

  #footer .custom-footer>div,
  .footer .custom-footer>div{
    padding:0 24px!important;
  }

  #footer .custom-footer>div:nth-child(2),
  .footer .custom-footer>div:nth-child(2){
    border-right:0!important;
  }

  #footer .custom-footer>div:nth-child(3),
  .footer .custom-footer>div:nth-child(3){
    padding-left:0!important;
  }
}

/* MOBIL */
@media (max-width:767px){
  #footer,
  .footer{
    padding-bottom:150px;
  }

  #footer .container,
  .footer .container{
    padding-left:15px;
    padding-right:15px;
  }

  #footer .footer-rows,
  .footer .footer-rows{
    padding:28px 0 16px!important;
  }

  #footer .custom-footer,
  .footer .custom-footer{
    display:block!important;
  }

  #footer .custom-footer>div,
  .footer .custom-footer>div{
    padding:0 0 20px!important;
    margin:0 0 20px!important;
    border-right:0!important;
    border-bottom:1px solid var(--jf9-line)!important;
  }

  #footer .custom-footer>div:last-child,
  .footer .custom-footer>div:last-child{
    margin-bottom:0!important;
    border-bottom:0!important;
  }

  #footer h4,
  #footer .h4,
  .footer h4,
  .footer .h4{
    margin-bottom:16px!important;
    font-size:17px!important;
  }

  #footer .footer-bottom .container,
  .footer .footer-bottom .container{
    text-align:center!important;
  }
}