/* =========================================================
   SOFTLEGAL – Detail produktu: příznaky a sleva
   Verze: v1
   Doplněk k softlegal-product-cards-v11-flags-circle.css
   (ten řeší dlaždice ve výpisu, tento soubor detail produktu).

   CO ŘEŠÍ:
   Na detailu produktu vykresluje Shoptet příznaky jinak než
   ve výpisu a s vlastními výchozími styly:

     .flags.flags-default.flags-inline  (v .p-detail-info)
        = hranaté štítky pod názvem, které se lámaly do dvou
          řádků („Druhotná / licence") a barevně neseděly

     .flags.flags-extra > .flag-discount  (v .p-image)
        = modré kolečko se slevou, napozicované napevno dolů
          doprava, takže plavalo uprostřed obrázku

   ŘEŠENÍ:
     - štítky pod názvem → stejné kapsle jako na kartách
       (oranžová licence, červená AKCE, modrý TIP), na jednom
       řádku, bez lámání slov
     - slevové kolečko → červené, ukotvené do pravého horního
       rohu obrázku, uvnitř přeškrtnutá původní cena a sleva
     - cenový blok → přeškrtnutá cena šedě, sleva jako červená
       kapsle, ať ladí se zbytkem
   ========================================================= */

/* =========================================================
   ŠTÍTKY POD NÁZVEM PRODUKTU
   ========================================================= */
.p-detail .flags-inline,
.p-detail-info .flags-inline{
  display:flex!important;
  flex-wrap:wrap!important;
  align-items:center!important;
  gap:8px!important;
  width:auto!important;
  height:auto!important;
  margin:12px 0 18px!important;
  padding:0!important;
  float:none!important;
  background:transparent!important;
}

.p-detail .flags-inline .flag,
.p-detail-info .flags-inline .flag{
  position:static!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  flex:0 0 auto!important;
  width:auto!important;
  min-width:0!important;
  max-width:none!important;
  height:30px!important;
  min-height:30px!important;
  max-height:30px!important;
  margin:0!important;
  padding:0 14px!important;
  border:0!important;
  border-radius:999px!important;
  color:#fff!important;
  font-size:12px!important;
  line-height:30px!important;
  font-weight:800!important;
  text-align:center!important;
  text-transform:uppercase!important;
  letter-spacing:.02em!important;
  white-space:nowrap!important;   /* konec lámání „Druhotná / licence" */
  box-sizing:border-box!important;
  box-shadow:0 8px 16px rgba(7,31,72,.12)!important;
}

/* Barvy stejné jako na produktových kartách */
.p-detail .flags-inline .flag-action,
.p-detail .flags-inline .flag-new,
.p-detail-info .flags-inline .flag-action,
.p-detail-info .flags-inline .flag-new{
  background:#ef1717!important;
}

.p-detail .flags-inline .flag-custom1,
.p-detail .flags-inline .flag-custom2,
.p-detail .flags-inline .flag-custom3,
.p-detail-info .flags-inline .flag-custom1,
.p-detail-info .flags-inline .flag-custom2,
.p-detail-info .flags-inline .flag-custom3{
  background:#ff8500!important;
}

.p-detail .flags-inline .flag-tip,
.p-detail-info .flags-inline .flag-tip{
  background:#1673e8!important;
}

/* =========================================================
   SLEVOVÉ KOLEČKO NA OBRÁZKU
   .flags-extra se roztáhne přes šířku obrázku jako neviditelná
   vrstva (pointer-events:none, ať neblokuje lupu/proklik)
   a kolečko se ukotví do pravého horního rohu.
   ========================================================= */
.p-image .flags-extra{
  position:absolute!important;
  top:0!important;
  left:0!important;
  right:0!important;
  bottom:auto!important;
  width:auto!important;
  height:auto!important;
  display:block!important;
  margin:0!important;
  padding:0!important;
  background:transparent!important;
  box-shadow:none!important;
  pointer-events:none!important;
  z-index:51!important;
}

.p-image .flags-extra .flag-discount{
  position:absolute!important;
  top:18px!important;
  right:18px!important;
  left:auto!important;
  bottom:auto!important;
  width:96px!important;
  height:96px!important;
  min-width:0!important;
  max-width:none!important;
  min-height:0!important;
  max-height:none!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  border-radius:50%!important;
  background:#ef1717!important;
  font-size:0!important;
  text-transform:none!important;
  box-shadow:0 12px 26px rgba(239,23,23,.32)!important;
}
.p-image .flags-extra .flag-discount::after{content:none!important;}

.p-image .flags-extra .flag-discount .price-standard{
  display:block!important;
  width:auto!important;
  height:auto!important;
  min-height:0!important;
  max-height:none!important;
  margin:0 0 2px!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  color:rgba(255,255,255,.85)!important;
  text-decoration:line-through!important;
  font-size:13px!important;
  font-weight:600!important;
  line-height:1.1!important;
  letter-spacing:0!important;
  text-transform:none!important;
  white-space:nowrap!important;
}

.p-image .flags-extra .flag-discount .price-save{
  display:block!important;
  width:auto!important;
  height:auto!important;
  min-height:0!important;
  max-height:none!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  color:#fff!important;
  text-decoration:none!important;
  font-size:21px!important;
  font-weight:800!important;
  line-height:1.05!important;
  letter-spacing:-.01em!important;
  text-transform:none!important;
  white-space:nowrap!important;
}

/* =========================================================
   CENOVÝ BLOK NA DETAILU
   ========================================================= */
.p-final-price-wrapper .price-standard{
  color:#8b90a0!important;
  font-size:15px!important;
  font-weight:500!important;
  text-decoration:line-through!important;
}

.p-final-price-wrapper .price-save{
  display:inline-flex!important;
  align-items:center!important;
  margin-left:8px!important;
  padding:3px 10px!important;
  border-radius:999px!important;
  background:#ef1717!important;
  color:#fff!important;
  font-size:12px!important;
  font-weight:800!important;
  text-decoration:none!important;
  white-space:nowrap!important;
}

/* =========================================================
   MOBIL
   ========================================================= */
@media(max-width:575px){
  .p-detail .flags-inline,
  .p-detail-info .flags-inline{
    gap:6px!important;
    margin:10px 0 14px!important;
  }
  .p-detail .flags-inline .flag,
  .p-detail-info .flags-inline .flag{
    height:28px!important;
    min-height:28px!important;
    max-height:28px!important;
    padding:0 12px!important;
    font-size:11px!important;
    line-height:28px!important;
  }
  .p-image .flags-extra .flag-discount{
    top:12px!important;
    right:12px!important;
    width:76px!important;
    height:76px!important;
  }
  .p-image .flags-extra .flag-discount .price-standard{font-size:11px!important;}
  .p-image .flags-extra .flag-discount .price-save{font-size:17px!important;}
}