/* Custom code goes here
   A template should always ship with an empty custom.css */

/* General Styles */
body {
    direction: ltr;
    font-family: "Noto Sans", sans-serif;
    font-size: 0.9rem;
    -webkit-font-smoothing: antialiased;
    color: rgb(174, 174, 174);
    line-height: 1.25em;
}

body, html {
    height: 100%;
}

/* Header styles */
#header {
    background: white !important;
}

#header .logo {
    max-width: 80%;
    height: auto;
}

#header .header-nav .cart-preview.active {
    background: rgb(54, 125, 217);
}

#header .header-top {
    padding-top: 1.25rem;
    background-color: rgb(5, 14, 64);
}

/* Menu styles */
#header .header-top a[data-depth="0"] {
    text-transform: uppercase;
    color: rgb(222, 184, 135);
}

.block-category h1 {
    margin-bottom: 1rem;
    font-size: 2rem;
}

/* Footer styles */
.footer-container {
    margin-top: 1.5rem;
    padding-top: 1.5rem;
    background-color: rgb(5, 14, 64);
    box-shadow: rgba(0, 0, 0, 0.3) 2px 2px 11px 0px;
    overflow: hidden;
}

.footer-container li a {
    color: rgb(174, 174, 174);
    cursor: pointer;
    font-size: 0.875rem;
}

/* Product styles */
.product-prices {
    margin-bottom: 1.5rem;
}

.product-flags li.product-flag {
    background: #e7bc87;
    font-size: 0.85rem;
}

.product-description h2, .h2 {
    font-size: 1.05rem;
}

.product-prices div {
    margin-bottom: 0rem;
}

.product-discounts-title {
    margin-top: 1.5rem;
    color: rgb(54, 125, 217);
}

/* Pe�na szeroko�� slidera */
#slider,
#slider .container,
.carousel,
.carousel-inner {
    width: 100vw !important;
    max-width: 100% !important;
    margin: 0 auto !important;
    padding: 0 !important;
}

/* Obrazy w sliderze na pe�n� szeroko�� */
.carousel-item img {
    width: 100vw !important;
    max-width: 100% !important;
    height: auto !important;
    object-fit: cover !important;
}

/* Usuwa marginesy dla wszystkich tytu��w i opis�w */
.carousel .caption,
.carousel .display-1 {
    margin: 0 !important; 
    display: none; /* Ukrywa tytu� i opis, aby nie zajmowa�y miejsca */
}

#slider {
    margin-bottom: 0 !important; /* Ustawia margines dolny na 0 */
}



/* Button styles */
.btn-primary {
    color: #fff;
    background-color: #050e40;
    border-color: rgba(0, 0, 0, 0);
}

/* Search bar */
.search-widget form input[type="text"] {
    min-width: 300px;
}

/* Additional Customizations */
#product #content {
    max-width: 600px;
}

.scroll-box-arrows .right {
    right: -30px;
    color: #e7bc87;
}

.scroll-box-arrows .left {
    left: -30px;
    color: #e7bc87;
}

/* kolor h3 */
.h3 {
    color: #e7bc87;
    text-transform: uppercase
}

/* stopka - nagłowek Moje Konto */
#block_myaccount_infos .myaccount-title a {
    color: #e7bc87;
}

/* stopka - nagłowek o firmie */
.block-contact .block-contact-title {
    color: #e7bc87
}

/* kolory i inne ustawienia dla ikon social mediów */
.block-social ul li {
    display: inline-block;
    width: 2.0rem;
    height: 2.0rem;
    margin: .125rem;
    cursor: pointer;
    background-color: rgba(5, 14, 64, 0.7); /* Użyj przezroczystości */
    background-repeat: no-repeat;
    background-size: contain; /* Upewnij się, że ikony są odpowiednio skalowane */
    border-radius: 0.5rem; /* Lekko zaokrąglone rogi */
}

.block-social ul li:hover {
    background-color: rgba(231, 188, 135, 0.7); /* Tło po najechaniu */
}

.block-social ul li a {
    display: block;
    height: 100%;
    overflow: hidden;
    text-indent: 100%; 
    white-space: nowrap;
}

/* kolumna z wyszukiwarką */
 .col-sm-6 {
        float: left;
        width: 35vh;
}

/* Ustawienia dla kolumn w nagłówku */
@media (min-width: 768px) {
    .col-md-5,
    .col-md-7 {
        float: left;
        width: 50%; !important; /* Ustawienie ambasadorowe dla obu kolumn */
    }
}

@media (max-width: 768px) {
    .col-md-5,
    .col-md-7 {
        width: 100%; /* Aby na mniejszych ekranach kolumny były na całą szerokość */
    }
}

@media (max-width: 767px) {
    #header .top-logo {
        flex-direction: column; /* Zmień na kolumny dla mniejszych ekranów */
        align-items: center; /* Wyrównanie do środka */
        justify-content: center; /* wyrównanie pionowe */
    }

    .menu {
        margin-top: 10px; /* Przestrzeń między logo a menu */
    }

    .search-widget {
        margin-top: 10px; /* Przestrzeń między menu a polem wyszukiwania */
        text-align: center; /* Wyrównanie wyszukiwania na środku */
    }
}



/* Styl dla ikony telefonu w wersji mobilnej */
#mobile_phone {
  margin-right: 10px;
}

#mobile_phone a {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 15px 0;
}

#mobile_phone i.material-icons {
  font-size: 24px;
  color: #2fb5d2; /* Domyślny kolor PrestaShop, można dostosować */
  margin-right: 5px;
  margin-left: 10px;
}

/* Styl dla ikony telefonu w wersji desktopowej */
#contact-link a {
  display: inline-flex;
  align-items: center;
  text-decoration: none;
}

#contact-link a i.material-icons {
  margin-right: 5px;
  margin-left: 10px;
}


/* Stylowanie tekstu zgody */



.condition-label label {
    color: #dc3545;
    font-size: 1.1em;
}

}