/* ======================================================
   METRYKI WOŁYŃ
   Joomla 5 / Cassiopeia
   ====================================================== */

:root {
    --wolyn-brown: #6b4a34;
    --wolyn-brown-dark: #4a3121;
    --wolyn-brown-light: #9b6d45;

    --wolyn-paper: #f8f4ea;
    --wolyn-paper-dark: #efe7d8;
    --wolyn-paper-border: #d9ccb3;

    --wolyn-shadow: 0 3px 12px rgba(0,0,0,.08);
}


/* ======================================================
   BODY
   ====================================================== */

body {
    background: #f4efe3;
    color: #2c2925;
    font-family: Georgia, "Times New Roman", serif;
    line-height: 1.7;
}


/* ======================================================
   HEADER
   ====================================================== */

.header {
    background: linear-gradient(
        to bottom,
        #f2ebdc,
        #e5d9c3
    );

    border-bottom: 4px solid var(--wolyn-brown);
    box-shadow: var(--wolyn-shadow);
}


/* ======================================================
   TYTUŁ STRONY
   ====================================================== */

.navbar-brand,
.navbar-brand a,
.brand-text {
    font-family: Georgia, serif !important;
    color: var(--wolyn-brown) !important;
    font-size: 2.6rem !important;
    font-weight: 700 !important;
    letter-spacing: 2px;
    text-transform: uppercase;

    text-shadow:
        1px 1px 0 #fff,
        2px 2px 3px rgba(0,0,0,.08);
}

.site-description,
.brand-description {
    font-style: italic;
    color: #8b6a4c;
    font-size: 1rem;
}


/* ======================================================
   NAGŁÓWKI MODUŁÓW - POG RUBIONE
   ====================================================== */

.container-sidebar-left > .sidebar-left.card > .card-header {
    background: var(--wolyn-brown);
    color: white;

    margin: 0;
    padding: 11px 15px;

    border: none;
    border-radius: 0;

    font-size: 1.05rem;
    font-weight: 700 !important;  /* POG RUBIONE */
    letter-spacing: 0.5px;
    text-transform: uppercase;
}


/* ======================================================
   MODUŁY
   ====================================================== */

.container-sidebar-left > .sidebar-left.card {
    background: var(--wolyn-paper);
    border: 1px solid var(--wolyn-paper-border);
    border-radius: 8px;
    box-shadow: var(--wolyn-shadow);
    overflow: hidden;
    margin-bottom: 15px;
}


/* ======================================================
   ZAWARTOŚĆ MODUŁÓW
   ====================================================== */

.container-sidebar-left > .sidebar-left.card > .card-body {
    padding: 0;
}


/* ======================================================
   LISTY MENU - NOWY STYL BOCZNEGO MENU
   ====================================================== */

/* ---- KONTENER MENU ---- */
.container-sidebar-left .mod-menu {
    list-style: none;
    margin: 0 !important;
    padding: 6px 0 !important;
    background: #fbf8f2;
}

.container-sidebar-left .mod-menu > li {
    margin: 0 !important;
    padding: 0 !important;
}


/* ---- POZYCJE MENU - ZWIĘKSZONA WYSOKOŚĆ ---- */
.container-sidebar-left .mod-menu > li > a {
    display: block;

    padding: 12px 14px 12px 20px !important;  /* ZWIĘKSZONY PADDING */

    background: transparent !important;
    color: var(--wolyn-brown) !important;

    border: none !important;
    border-bottom: none !important;

    border-radius: 0 !important;

    text-decoration: none !important;
    font-weight: 600 !important;  /* POG RUBIONE */

    transition:
        background-color .15s ease,
        color .15s ease,
        padding-left .15s ease;
}


/* ---- HOVER ---- */
.container-sidebar-left .mod-menu > li > a:hover {
    background: #efe4cf !important;
    color: var(--wolyn-brown-dark) !important;
    padding-left: 26px !important;
}


/* ---- AKTYWNA POZYCJA W GŁÓWNYM MENU ---- */
.container-sidebar-left > .sidebar-left.menu-pills
.mod-menu > li.current > a {

    background: #e5d9c3 !important;
    color: var(--wolyn-brown-dark) !important;

    border-left: 4px solid var(--wolyn-brown) !important;
    border-right: none !important;

    padding-left: 16px !important;

    font-weight: 700 !important;  /* POG RUBIONE */
}


/* ---- AKTYWNA POZYCJA - HOVER ---- */
.container-sidebar-left > .sidebar-left.menu-pills
.mod-menu > li.current > a:hover {
    padding-left: 22px !important;
}


/* ---- FACEBOOK / WYSZUKIWARKI / INNE MODUŁY ---- */
.container-sidebar-left > .sidebar-left:not(.menu-pills)
.mod-menu > li.active > a,
.container-sidebar-left > .sidebar-left:not(.menu-pills)
.mod-menu > li.current > a {

    background: #fbf8f2 !important;
    color: var(--wolyn-brown) !important;

    border-left: none !important;

    padding-left: 20px !important;

    font-weight: 600 !important;  /* POG RUBIONE */
}


/* ---- OSTATNI ELEMENT ---- */
.container-sidebar-left .mod-menu > li:last-child > a {
    border-bottom: none !important;
}


/* ======================================================
   TREŚĆ ARTYKUŁÓW
   ====================================================== */

.item-content,
.com-content-article {
    background: rgba(255,255,255,.40);

    border: 1px solid var(--wolyn-paper-border);
    border-radius: 12px;

    padding: 30px;

    box-shadow: var(--wolyn-shadow);
}


/* ======================================================
   NAGŁÓWKI TREŚCI
   ====================================================== */

h1 {
    color: var(--wolyn-brown);
    font-size: 2.5rem;
    text-align: center;

    border-bottom: 2px solid #cdb998;

    padding-bottom: 10px;
    margin-bottom: 30px;
}

h2 {
    color: var(--wolyn-brown);
    margin-top: 35px;
}

h3 {
    color: #7f5b3e;
}


/* ======================================================
   LINKI
   ====================================================== */

a {
    color: var(--wolyn-brown);
    transition: .2s;
}

a:hover {
    color: var(--wolyn-brown-light);
}


/* ======================================================
   BREADCRUMB
   ====================================================== */

.breadcrumb {
    background: #f8f3e8;
    border: 1px solid #e0d3bc;
    border-radius: 6px;
}


/* ======================================================
   PRZYCISKI
   ====================================================== */

.btn-primary {
    background: var(--wolyn-brown);
    border-color: var(--wolyn-brown);
}

.btn-primary:hover {
    background: var(--wolyn-brown-light);
    border-color: var(--wolyn-brown-light);
}


/* ======================================================
   STOPKA
   ====================================================== */

.footer {
    margin-top: 50px;

    background: linear-gradient(
        to bottom,
        #4a3121,
        #2b1c13
    );

    color: #e7d9bf;

    padding: 30px 0;
}

.footer a {
    color: #f3e7d6;
}

.footer a:hover {
    color: white;
}


/* ======================================================
   MOBILE
   ====================================================== */

@media (max-width: 768px) {

    .navbar-brand,
    .navbar-brand a {
        font-size: 1.9rem !important;
        letter-spacing: 1px;
    }

    h1 {
        font-size: 2rem;
    }
}