/* CSS CUSTOM - DD */

/* FORMULARZE - PRZYCISKI - TABLE - RAMKI - POLA SELECT */
.btn {border-radius: 5px;} /* zmniejszone zaokrąglenia przycisków */
.blockcart .cart-products-count {background-color: #14d9a4} /* zmiana koloru - liczba w kółku - koszyk */
.breadcrumb {border-color: #e1e1e1!important;} /* zmiana koloru obramowań */
.page-heading:before {border-color: #585858!important;} /* zmiana koloru obramowań */
.form-control, .custom-file-label, .nav-pills .nav-link, .blockreassurance_product .item-link, .product-features > dl.data-sheet dt.name, .product-features > dl.data-sheet dd.value, .cart-grid-body .card-body, .cart-grid-body .cart-item, .card, .checkout-step .step-title, #cart-summary-product-list .mediad, .select-title, #cart-summary-product-list .media, .card, body.page-customer-account #content {border-radius: 5px;} /* zmniejszenie zaokrągleń pól formularzy */
#checkout-personal-information-step, .checkout-step {border:0!important} /* wyłączenie zbędnych ramek w procesie zamówienia */
.product-prices.border-top, .product-description-short {border-top: 1px solid #000 !important;} /* zmiana grubości linii oddzielających pola w produkcie */
.bootstrap-touchspin .form-control {border-radius: 5px!important} /* zmiana zaokrąglenia pola ilości produktów do zakupu w produkcie */
.card, .page-customer-account #content {border: 1px solid rgba(0, 0, 0, 0.125);} /* zmiana ramki w zakładce kontakt w formularzu */
.custom-checkbox input[type="checkbox"] + span {border: 2px solid #585858;} /* zmiana koloru obramowania pola chackbox - realizacja zamówienia */
.custom-checkbox input[type="checkbox"] + span .checkbox-checked {font-size: 16px;} /* zmiana rozmiaru dziubka chackbox */
.checkout-step .form-footer {text-align: right;} /* wyrownanie do prawej przycisku kolejengo kroku w procesie realziacji zamówienia */
/* zmiana koloru obramowania pola input z przyciskiem - wgrywanie pliku */
.custom-file .custom-file-input + .custom-file-label {border: 1px solid #e3e3e3 !important;/* brak ramki przy przycisku */}
.custom-file-label::after {background:#00b9f3;border-radius: 0 5px 5px 0;height:100%;} /* przycisk - wybierz plik */
.custom-file {white-space: nowrap;overflow: hidden;} /* blokada załamania wiersza, ukrycie tekstu wychodzącego po za pole */
.product-variants .product-variants-item select {width: 450px !important;} /* zmiana szerokości pola select - warianty produktu */
.-widgetbox .owl-nav {right: 2rem;} /* przesunięcie bardziej w lewo przycisków przewijania - produkty z tej samej kategorii */
.input-radio:checked + .radio-label, label:hover .radio-label {border-color: #00b9f3!important;background-color: #00b9f3!important;} /* zmiana koloru przycisku zaznaczenia opcji - realizacja zamówienia */
body .border, body .border-bottom, body .border-top, body .border-left, body .border-right {border-color: #00b9f3 !important;}
#product-availability i {position: relative;top:-1px;}
/* SZCZEGÓLY ZAMÓWIENIA */
.table .thead-dark th {background-color: #00b9f3;border-color: #00b9f3;}
.table-bordered td, .table-bordered th {border-color: #00b9f3!important;}
.badge.badge-primary.bright {background-color: #14d9a4!important;border-radius:3px;}
h3, .h3, .modal-header .modal-title {color: #00b9f3;}
.rounded, .definition-list dl dt, .definition-list dl dd, .order-line, .delivery-option, .payment-options .payment-option {border-radius: 7px!important;}

/* ===== POLA SELECT - ROZWIJANE KARTA PRODUKTU ===== */
.form-control {border:1px solid #d1d1d1 !important;}
/* kontener atrybutu */
.product-variants-item{
  position: relative;
  overflow: visible !important;
}

/* select */
.product-variants-item select.form-control{
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;

  padding-right: 60px !important;
  background-image: none !important;
  position: relative;
  z-index: 1;
}

/* Bazowo: fieldset jako kontener */
.product-variants-item{
  position: relative;
  overflow: visible !important;
}

/* Styl selecta (tylko gdy select istnieje) */
.product-variants-item:has(select.form-control) select.form-control{
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;

  padding-right: 60px !important;
  background-image: none !important;
  position: relative;
  z-index: 1;
}

/* Panel + strzałka NA SELECT (wersja "na beton") */
#product .product-variants-item select.form-control.form-control-sm{
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  appearance: none !important;

  padding-right: 65px !important;

  background-color: #ffffff !important;

  /* 2 warstwy: (1) strzałka SVG, (2) niebieski panel */
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='10' viewBox='0 0 14 10'%3E%3Cpath d='M1 1.5 L7 8.5 L13 1.5' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"),
    linear-gradient(to left, #00b9f3 46px, transparent 46px) !important;

  background-repeat: no-repeat, no-repeat !important;

  background-position:
    right 15px center,
    right -1px center !important;

  background-size:
    14px 10px,
    46px 100% !important;

  border-radius: 6px !important;
  background-clip: padding-box !important;
}
/* ===== KONIEC- POLA SELECT - ROZWIJANE KARTA PRODUKTU ===== */

/* ===== POLA SELECT - ROZWIJANE FILTRY PRODUKTÓW ===== */
/* FACETY (filtry) – dropdown jak select: niebieski panel + biała strzałka */
.facet .facet-dropdown .select-title{
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  line-height: normal !important; /* resetuje zjazd w dół */

  padding: 8px 64px 8px 12px !important;
  background-color: #fff !important;
  border: 1px solid #d1d1d1 !important;
  border-radius: 4px !important;

  font-family: "Roboto", sans-serif !important;
  font-size: 1rem !important;
  font-weight: 400 !important;
  line-height: 1.58 !important;
}

/* Wyłącz domyślną ikonę material (żeby nie było 2 strzałek) */
.facet .facet-dropdown .select-title i.material-icons{
  display: none !important;
}

/* Niebieski panel po prawej */
.facet .facet-dropdown .select-title::after{
  content: "" !important;
  position: absolute !important;
  top: 0 !important;
  right: 0 !important;
  width: 46px !important;
  height: 100% !important;
  background: #00b9f3 !important;
  border-radius: 0 4px 4px 0 !important;
  pointer-events: none !important;
}

/* Biała strzałka „V” */
.facet .facet-dropdown .select-title::before{
  content: "" !important;
  position: absolute !important;
  right: 18px !important;
  top: 38% !important;
  width: 12px !important;
  height: 12px !important;
  z-index: 9;
  border-bottom: 2px solid #fff !important;
  border-left: 2px solid #fff !important;
  transform: translateY(-50%) rotate(-45deg) !important;
  -webkit-transform: translateY(-50%) rotate(-45deg) !important;
  pointer-events: none !important;
}
/* ===== KONIEC - POLA SELECT - ROZWIJANE FILTRY PRODUKTÓW ===== */

/* ===== POLA WYBORU SELECT KARTA PRODUKTU ===== */
/* FONT */
.product-variants-item #group_41 .radio-label{
  font-family: "Roboto", sans-serif !important;
  font-size: 1rem !important;
  font-weight: 400 !important;
  line-height: 1.58 !important;
}

/* SZEROKOŚĆ „KAFELKA” radio (Lewe/Prawe)*/
.product-variants-item #group_41 .radio-label{
  display: inline-block !important;
  min-width: 130px;
  text-align: center !important;
  padding: 8px 14px !important;
  border-radius: 6px;
}

/* żeby kliknięcie działało na całej szerokości */
.product-variants-item #group_41 label{
  display: inline-block !important;
}
/* ===== KONIEC - POLA WYBORU SELECT KARTA PRODUKTU ===== */

/* ===== FORMULARZ CONTACT FORM 7 ===== */

/* Nagłówek formularza CF7 */
.wpcf7 h3 {
    text-transform: none;
    margin-top: -22px !important;
    color: #00b9f3;
}

@media (max-width: 768px) {
    .wpcf7 h3 {
        margin-top: 2rem!important; /* odpowiednik mt-4 */
    }
}

/* Opis nad formularzem */
.description {
    padding-top: 0px !important;
}

/* GŁÓWNY WRAPPER */
.cf7-form {
    max-width: 100%;
    width: 100%;
}

/* Ukrywamy <br>, bo psują layout */
.cf7-form br {
    display: none;
}

/* Odstępy */
.cf7-form .row-cf7,
.cf7-form > label,
.cf7-form > span,
.cf7-form .wpcf7-form-control-wrap {
    margin-bottom: 14px;
}

/* Labelki */
.cf7-form label {
    display: block;
    font-size: 1rem;
    font-weight: 500;
    margin-bottom: 4px;
    color: #585858;
}

/* Kolumny 2x50% */
.cf7-form .row-cf7 {
    display: flex;
    gap: 20px;
    margin-bottom: 16px;
}
.cf7-form .col-cf7 {
    flex: 1;
}

/* Pola wejściowe */
.cf7-form input[type="text"],
.cf7-form input[type="email"],
.cf7-form input[type="tel"],
.cf7-form input[type="file"],
.cf7-form select,
.cf7-form textarea {
    width: 100% !important;
    padding: 9px 12px !important;
    border: 1px solid #d1d1d1 !important;
    border-radius: 4px !important;
    background: #fff !important;
    font-size: 14px !important;
    color: #585858 !important;
    transition: all 0.2s ease-in-out;
    box-sizing: border-box;
}

/* Focus */
.cf7-form input:focus,
.cf7-form select:focus,
.cf7-form textarea:focus {
    border-color: #00b9f3 !important;
    box-shadow: 0 0 0 2px rgba(0,185,243,0.25) !important;
    outline: none !important;
}

/* Textarea */
.cf7-form textarea {
    min-height: 140px;
    resize: vertical;
}

/* Pole załącznika */

/* Hover */
.cf7-form .file-input-wrapper:hover .file-input-button {
    background: #1a3d59;
}

/* Focus efekt */
.cf7-form .file-input-wrapper:focus-within {
    border-color: #00b9f3;
    box-shadow: 0 0 0 2px rgba(0,185,243,0.25);
}

/* Opis pod plikami */
.cf7-form .file_type_des {
    display: block;
    font-size: 12px;
    color: #555;
    margin-top: 4px;
}

/* Ukrycie natywnego przycisku "Wybierz plik" */
.cf7-form .wpcf7-form-control-wrap.zalacznik input[type="file"]::file-selector-button {
    display: none !important;
}

.cf7-form .wpcf7-form-control-wrap.zalacznik input[type="file"]::-webkit-file-upload-button {
    display: none !important;
}

/* Ustawiamy input pliku tak, by kliknięcie pola nadal otwierało okno wyboru */
.cf7-form .wpcf7-form-control-wrap.zalacznik input[type="file"] {
    cursor: pointer !important;
    padding-left: 10px !important; /* żeby tekst "Nie wybrano pliku" był elegancko odsunięty */
    padding-top: 11px !important;
}
.custom_choosefile .button_choosefile {border-radius: 0 4px 4px  0;background: #00b9f3;font-weight: 400;font-size: 1rem !important;}

/* Przycisk wyślij */
.cf7-form input.wpcf7-submit,
.cf7-form input[type="submit"] {
    background: #00b9f3 !important;
    color: #fff !important;
    padding: 11px 24px !important;
    font-size: 15px !important;
    border: none !important;
    border-radius: 4px !important;
    cursor: pointer !important;
    transition: background 0.25s ease-in-out;
    text-transform: none;
    padding: 0.594rem 1.782rem !important;
    font-size: 1rem !important;
    font-weight: 400;
        display: inline-block;
    float: right;
}

.cf7-form input.wpcf7-submit:hover,
.cf7-form input[type="submit"]:hover {
    background: #1a3d59 !important;
}

/* Loader */
.cf7-form .ajax-loader {
    margin-left: 10px;
}

/* Błędy */
.cf7-form .wpcf7-not-valid-tip {
    font-size: 12px;
    margin-top: 3px;
    color: #d00;
}

/* Komunikat po wysłaniu */
.cf7-form .wpcf7-response-output {
    margin-top: 15px;
    border-radius: 4px;
    padding: 10px 15px;
    font-size: 14px;
    border-color: #00b9f3 !important;
}

.alert.alert-success {background-color: #14d9a4 !important;border-color: #118969 !important;}

/* Temat */
.wpcf7-form-control-wrap .select_arrow {background: #00b9f3;border-radius: 0 4px 4px 0 !important;top: 5px;}
.wpcf7-form-control-wrap .select_arrow::before {border-bottom: 2px solid #fff;border-left: 2px solid #fff;}
.wpcf7-form-control-wrap select.form-control:not([size]):not([multiple]) {height: 45px;}
.wpcf7-form-control-wrap .select_arrow {width:45px;height:45px;}
.wpcf7-form-control-wrap .select_arrow::before {left: 15px;top: 13px;}

/* Mobile — kolumny 1 pod 1 */
@media (max-width: 768px) {
    .cf7-form .row-cf7 {
        flex-direction: column;
    }
}

/* Pole wyboru - polityka cookies */

/* Wrapper */
.cf7-form .privacy-field {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin-top: 18px;
    font-size: 14px;
    line-height: 1.5;
}

/* Układ natywnego CF7 – aby list-item nie robił breaka */
.cf7-form .privacy-field .wpcf7-list-item {
    margin: -3px 0;
    display: flex;
    align-items: flex-start;
}

/* Sam checkbox – styl jak reszta pól */
.cf7-form .privacy-field input[type="checkbox"] {
    appearance: none; /* usuwamy natywny wygląd */
    -webkit-appearance: none;
    width: 25px;
    height: 25px;
    border: 1px solid #d1d1d1 !important;
    border-radius: 3px;
    background: #fff;
    cursor: pointer;
    position: relative;
    display: inline-block;
    margin-left:-40px;
    margin-right:10px;
    top: 5px;
}

/* Po zaznaczeniu – niebieskie tło */
.cf7-form .privacy-field input[type="checkbox"]:checked {
    background: #00b9f3 !important;
    border-color: #00b9f3 !important;
}

/* Biała fajka ✓ po zaznaczeniu */
.cf7-form .privacy-field input[type="checkbox"]:checked::after {
    content: "✓";
    color: #fff;
    font-size: 17px;
    position: absolute;
    top: -1px;
    left: 5px;
    font-weight: bold;
}

.wpcf7-list-item label {
    padding-left:40px;
    margin-top:-8px;
    font-size:1rem;
}

/* TEKST zgody po prawej stronie */
.cf7-form .privacy-field .privacy-text {
    display: inline-block;
    margin-left: 4px;
    flex: 1;
}

/* Link w tekście */
.cf7-form .privacy-field a {
    color: #00b9f3;
    text-decoration: underline;
}

@media (min-width: 1200px) {
  .wpcf7 h3 {
    padding-top: 25px;
  }
}

.cf7-form .row-cf7 {margin-bottom:0;}

/* === koniec formularza CONTACT FORM 7 === */

/* MENU - NAWIGACJA */
@media (min-width: 1200px) {.top-menu[data-depth='0'] > li > a {font-weight: 400;}} /* pogrubienie czcionki w menu głównym */
.owl-dots .owl-dot, .owl-dots .owl-dot {width: 25px;height: 25px;border-radius: 5px;} /* zmiana kształtu i wielkośći nawigacji - slider */
.owl-dots .owl-dot, .owl-dots .owl-dot span {background: rgba(29,65,94,.8)!important;}
.owl-dots .owl-dot.active span {width: 25px;height: 25px;border-radius: 5px;background-color: #00b9f3 !important;}


/* WYGLĄD HEADER - LOGO */
#_desktop_logo img {width: 208px;} /* tworcy ustawili 100% - byl problem z logiem w svg - ja ustawiłem na 208 px */
@media (max-width: 991px) {#_mobile_logo img.logo {width: 208px!important;max-width: 208px!important;min-width: 208px!important;height: auto!important;/* żeby na bardzo małych ekranach nie wychodziło poza kontener */ display: inline-block !important;}} /* tworcy ustawili na 350 px- szerokość loga mobilnie - ja ustawiłem na 208 px */
@media (min-width: 992px) {.header-top, .header-nav, #top-menu {background: #1a3d59;color: #fff;}} /* zmiana tła w header str. główna */
/* wymuszenie innego koloru na pasku header-nav */
@media (min-width: 992px) {.header-nav {background-color:#ebebeb!important;}} 
a.link-user {color:#1a3d59!important;font-weight: 400;}
a.link-user:hover, .blockcart-header:hover, .js-search-btn-toggle:hover, a.wishtlist-top:hover {color:#00b9f3!important;}
.right-nav {color:#1a3d59}
.header-contact a {color:#1a3d59!important;}
/* koniec */


/* SKLEP CHWILOWO NIE DOSTĘPNY - INFORMACJA */
/* zmiana tła, wielkości loga oraz tesktu informacji, że sklep jest chwilowo niedostępny */
#layout-error img {width:208px;}
#layout-error {background-color:#1a3d59!important;}
#layout-error h1, #layout-error h3 {color: #fff!important;}


/* ALERTY - INFORMACJE - PASKI INFORMACJI - TŁA - IKONY */
.alert-warning, .alert-info {background-color: #14d9a4!important;border-color: #118969!important}
.btn-warning, .badge-warning {border: 2px solid #118969 !important;background-color: #14d9a4!important;border-color: #118969!important} /* zmiana koloru tła ikon - lista życzeń */
@media (min-width: 769px) {.features-block {background-color: #fff}} /* zmiana koloru tła sekcji - funkcje (wysylka, śledenie, rabaty) */
.testimonials-block {background-color: #f2f3f4!important;padding:100px 0;margin:70px 0 -50px 0!important;} /* zmiana koloru tła sekcji - opinie klientów */
.category-miniature .h2 {background-color: rgba(29, 65, 94, .8);} /* zmiana tła nazwy kategorii */
.product-flags .discount, .current-price .discount, .product-line-grid-body .discount {background: #14d9a4!important;} /* zmiana koloru czerwonego na zielony - etykieta zniżki - produkt */
.text-success {color: #14d9a4 !important;} /* zmiana koloru zielonego na inny - teksty pozytywne */
/* zmiana wygladu małej tabeli w szczegółach produktu */
.product-info{border:1px solid #585858;background: #f6f6f6;border-radius:5px;padding:0.75rem 0.9375rem}
.product-info .product-reference,
.product-info .product-quantities{display:grid!important;grid-template-columns:160px 1fr;gap:5px;align-items:center;padding:6px 0 0 0}
.product-info .product-reference+.product-quantities{border-top:1px solid #d5d5d5}
.product-info .label{color:#000;white-space:nowrap;font-weight:300!important;overflow:hidden;text-overflow:ellipsis}
.product-info .col.px-0:not(.label){min-width:0;font-weight:600;}
.product-info .label:after {padding-left:5px;}
@media(max-width:480px){.product-info .product-reference,.product-info .product-quantities{grid-template-columns:1fr}}
/* koniec - zmiana wygladu małej tabeli w szczegółach produktu */
.product-prices.border-top, .product-description-short {padding-top:15px;} /* Odstęp od górnej linni krótkiego opisu produktu */

/* CZCIONKA - KOLOR TESKTU - wypunktowania listy li */
.product-miniature .product-title {color: #585858;}
h2.display-3 {color:#1a3d59;} /* zmiana koloru nagłówka - produkty wyróżnione */
body ul.category-sub-menu a {text-transform: none !important;} /* zmiana tekstu duzymi literami na zwykly - nazwy kategorii */
.products-block .title, .sidebar .h6, .insta-box .widget-title {background-color: #00b9f3;color:#fff!important;border-radius: 5px 5px 0 0;} /* zmiana tła i koloru czcionki w tytułach bloków w sidebar */
.rte ul li::marker {color: #00b9f3;} /* zmiana koloru kropek w listach wypunktowanych */
.lista-contact li::marker {color: #00b9f3;font-size: 1.2em;} /* zmiana koloru i wielkości kropek w liście kontaktowej */

.lista-contact {background: #f7f9fb;padding: 15px 20px 15px 45px;border-radius: 8px;color: #585858;margin-left: -45px;list-style: disc !important;}
.lista-contact li {display: list-item;}
.lista-contact li::marker {color: #00b9f3;font-size: 1.2em;}

/* ZDJĘCIA - GRAFIKA */
/* rozciągnięcie zdjęcia na całą szerokość w okładce kategorii */
.category-cover img {width: 100%;height: auto;object-fit: cover;}
@media (max-width: 991.98px) {.category-cover {margin: 0!important;}}

/* STOPKA */
.footer-block .logo {width: 195px;} /* zmniejszenie wielkości loga w stopce */
@media (min-width: 992px) {.footer-container .links {margin-bottom: 0.5rem;} /* odstęp stopka */}
.footer-one .row {background-image: url('https://www.coradika.pl/sklep/themes/modernchild/assets/img/coradika.svg');background-repeat: no-repeat;background-position: center center;background-size: 400px auto;padding-bottom: 0;} /* znak wodny coradika - stopka tło */
@media screen and (max-width: 768px) {.footer-one .row {background-image: none !important;background-size: 0 !important;}} /* Wyłącz tło - znak wodny coradika na urządzeniach mobilnych (do 768px szerokości) */
/* Stopka (mobile) – odstęp między nagłówkiem a rozwiniętą treścią */
@media (max-width: 767px) {
  .footer-container .links.wrapper .collapse.show,
  .footer-container .footer-block .collapse.show {
    padding-top: 12px;   /* zwiększ jeśli chcesz */
  }
}
@media (max-width: 767px) {
  .footer-container .links.wrapper .collapse.show,
  .footer-container .footer-block .collapse.show {
    padding-top: 12px;
    padding-bottom: 10px;
  }
}


/* KD */
li.current {color:#00b9f3} /* zmiana koloru aktywnego menu */
.footer-container .links .h3, .footer-container .links .modal-header .modal-title, .modal-header .footer-container .links .modal-title {text-transform: uppercase!important;} /* zmiena na wielkie litery tytułu "Twoje konto" w stopce */

/* POZOSTAŁE USTAWIENIA */
.tax-shipping-delivery-label {top: -9px;position: relative;}
.price-netto {font-size: 0.8125rem;color: #585858;margin-top: 0px;font-weight: 500;} /* dostawienie ceny netto w pliku product-prices.tpl do porduktu */
.testimonials-block {margin: 70px 0 0 0;} /* wyzerowanie marginesu bottom w sekcji opinie strona glowna */
#wrapper, #footer {margin-top:0} /* wyzerowanie marginesu top w sekcji stopce */
.rte {padding-bottom: 20px;} /* padding dolny dla stron */
.modal-body section.products-block.-widgetbox {display: none !important;} /* wyłączenie ostatnio przeglądane w oknie popup warunkami świadczenia usług */
#content-wrapper {margin-bottom: 50px;} /* odsunięie pozostałych stron od tła stopki */
@media (max-width: 991.98px) {
  .description.overlay-layer .title {
    margin-top: 25px;
  }
}
/* Kontakt (CMS id 7) – kolumny na mobile jedna pod drugą */
@media (max-width: 767px) {
  .page-cms-7 .row > .custom-item.col-6,
  .page-cms-7 .row > .custom-item.col-sm-3,
  .page-cms-7 .row > .custom-item.col-sm-6 {
    flex: 0 0 100% !important;
    max-width: 100% !important;
    width: 100% !important;
  }

  .page-cms-7 .custom-item .link {
    margin-top: 2rem;
  }

}

/* zostaw tylko pierwszy przycisk "Zapytaj o produkt" */
#product .ctf_click_open_contactform7 {display: none !important;}
#product .ctf_click_open_contactform7:last-of-type {display: inline-block !important;}

/* USTAWIENIE SLIDERA - MOBILNIE */
@media (max-width: 767.98px) {
  #htmlbanners9 .description .text, p.title-one {
    display: none !important;
  }
  p.title-two {
    font-size: 1.2rem !important;
    line-height: 1.7 !important;
  }
  p.text-primary {
    font-size: 1rem !important;
    line-height: 1.7 !important;
  }
  /* nawigacja: dół-lewo + kasujemy ustawienia "środek" */
  #htmlbanners9 .owl-dots {
    position: absolute !important;

    top: auto !important;
    bottom: 12px !important;
    left: 12px !important;
    right: auto !important;

    transform: none !important;

    display: flex !important;
    justify-content: flex-start !important;
    align-items: center !important;
    gap: 8px;

    z-index: 50 !important;

    /* żeby NIE blokowało przesuwania slajdu */
    pointer-events: none !important;
  }

  /* ale same kropki mają być klikalne */
  #htmlbanners9 .owl-dots .owl-dot {
    pointer-events: auto !important;
  }

  /* opcjonalnie: wielkość kwadratów */
  #htmlbanners9 .owl-dots .owl-dot span {
    width: 25px !important;
    height: 25px !important;
    border-radius: 5px;
    background-color: #00b9f3 !important;
  }

}

@media (max-width: 767.98px) {

  /* MOBILE – kafle htmlbanners1 (.top-banner):
     zrób "ramkę" u góry i zmniejsz obraz, żeby nie dotykał krawędzi */
  .top-banner .wrapper-link.rounded {
    padding-top: 12px !important;
    box-sizing: border-box !important;
  }

  /* resetujemy agresywne pozycjonowanie obrazka, jeśli moduł je narzuca */
  .top-banner .wrapper-link.rounded > img.image,
  .top-banner .wrapper-link.rounded > img {
    position: relative !important;
    top: auto !important;
    right: auto !important;
    bottom: auto !important;
    left: auto !important;
    transform: none !important;

    display: block !important;
    width: 100% !important;
    height: auto !important;
  }
}