/* ==================================================================
   PLIK: css/template.css
   Opis: Style szablonu. Zorganizowane w sekcje z komentarzami.
   Uwaga: Kolory paska górnego, stopki i dolnego paska sterowane zmiennymi CSS.
   ================================================================== */

/* ================== ZMIENNE KOLORÓW ================== */
/* ================== GŁÓWNE ZMIENNE KOLORÓW ================== */
:root{
    --topbar-bg:#efefef; /* kolor górnego paska */
    --footer-bg:#f6f6f6; /* tło stopki */
    --bottom-bg:#e0e0e0; /* tło dolnego paska */
}

/* ================== TOPBAR ================== */
.bg-topbar{ background: var(--topbar-bg); }

/* ================== BANNER ================== */
.banner-wrapper{ background: #fafafa; width:100%; }
.banner-wrapper img, .banner-wrapper .moduletable, .banner-wrapper .custom {
    display:block;
    width:100%;
}

/* ================== FOOTER ================== */
.footer-area.bg-footer{ background: var(--footer-bg); }

/* ================== BOTTOM STRIP ================== */
.bottom-strip{ background: var(--bottom-bg); }

/* ================== MODUŁY W STYLU CARD ================== */
.moduletable.card, .module.card {
    border:1px solid #e5e5e5;
    padding:1rem;
    border-radius:.75rem;
    background:#fff;
}

/* ================== HEADER STICKY ================== */
header.sticky-top{ z-index:1030; min-height:60px; padding-top:6px; padding-bottom:6px; }
.site-logo{ flex:0 0 auto; }
.main-menu{ flex:1 1 auto; text-align:right; }

/* ================== KONTENER NAGŁÓWKA (ZWĘŻONY) ================== */
header .custom-header-container {
  max-width: 1000px;
  margin: 0 auto;
}


/* ================== MODUŁY - CARD STYLING ================== */
/* Chrome 'card' dla modułów (delikatna ramka, padding i zaokrąglenie) */
.moduletable.card, .module.card {
  border:1px solid #e5e5e5;
  padding:1rem;
  border-radius:.75rem;
  background:#fff;
}

/* ================== BANER (PEŁNA SZEROKOŚĆ) ================== */
/* Baner przewidziany pod slider/grafikę — wypełnia na 100% szerokości */
.banner-wrapper{ width:100%; }
.banner-wrapper img, .banner-wrapper .moduletable, .banner-wrapper .custom {
  display:block;
  width:100%;
}

/* ================== NAGŁÓWEK (STICKY) ================== */
/* Pasek przyklejony do góry. Z-index nad innymi elementami. */
header.sticky-top{ z-index:1030; }
.site-logo{ flex:0 0 auto; }
.main-menu{ flex:1 1 auto; text-align:right; }

/* ================== WĄSKI NAGŁÓWEK (SZEROKOŚĆ) ================== */
/* Ograniczenie szerokości paska nagłówka i wyśrodkowanie */
header .custom-header-container {
  max-width: 1000px; /* zmień na dowolną */
  margin: 0 auto;
}

/* ================== WYSOKOŚĆ PASKA NAGŁÓWKA ================== */
/* Precyzyjna kontrola wysokości nagłówka */
header.sticky-top {
  min-height: 60px;
  padding-top: 6px;
  padding-bottom: 6px;
}


#mznav{
  --nav-bg:#fff;
  --nav-text:#111;
  --nav-accent:#0077c8;
  --nav-border:1px solid #e6e6e6;
  --nav-radius:12px;
}