/* Layout uwb-panels-layout.
 *
 * Strony tej klasy posiadają szare tło oraz dwie kolumny - szerszą na główną
 * treść strony z lewej, oraz węższą z prawej. Kolumna z prawej jest zawsze
 * szara i wypełniana panelami. Kolumna z lewej właściwie również jest zawsze
 * szara (i również wypełniać ją można panelami), ale można ją również wypełnić
 * (i zwykle się wypełnia) białym obiektem uwb-white-content. W zależności od
 * tego, które bloki Smarty zostały zadeklarowane, szablon powinien domyślić
 * się i ułożyć stronę odpowiednio.
 */

.layout-fixed-wrapper { margin: -40px; }
.uwb-panels-layout {
    background: #ebebeb;
    border-right: 1px solid #ebebeb;
}
.uwb-panels-layout.uwb-layoutContent-defined.uwb-layoutMainPanels-undefined { background: url(img/layout2/panels-bg.png); }
#uwb-panels-layout-manager { display: flex; }

/* uwb-panel jest białym prostokątem, który ma być osadzany na szarym tle.
 * Nie korzystaj bezpośrednio z tej klasy - skorzystać z którejś z podklas. */

.uwb-panel {
    box-sizing: border-box;
    width: 100%;
    background: #fff;
    border: 1px solid #e0e0e0;
    border-top: 1px solid #e5e5e5;
    border-bottom: 1px solid #cdcdcd;
    border-radius: 2px;
    border-collapse: separate;
    border-spacing: 0;
    box-shadow: 0 6px 5px -5px rgba(0,0,0,0.1);
}

/* Kolumna boczna (prawa). Zasadniczo, powinna zawierać elementy dziedziczące
 * z uwb-panel (z pewnymi wyjątkami). */

.uwb-side-panels-container { width: 270px; padding: 24px; }
.uwb-layoutCoverPhoto-none.uwb-layoutContent-undefined .uwb-side-panels-container { padding-top: 40px; }
.uwb-layoutCoverPhoto-right .uwb-side-panels-container { padding-top: 122px; }

/* Dodatkowe ustawienia dla paneli osadzonych w kolumnie bocznej. */

.uwb-side-panels-container .uwb-panel { margin-bottom: 25px; }

/* uwb-sidepanel jest podklasą panelu. To "standardowy" panel boczny, do
 * osadzenia wewnątrz uwb-side-panels-container. */

.uwb-panel.uwb-sidepanel {
    padding: 12px;
    font-size: 12px;
}
.uwb-panel.uwb-sidepanel > hr {
    height: 1px;
    border: 0;
    background: #ddd;
    margin: 10px 0 10px 0;
}
.uwb-panel.uwb-sidepanel p.uwb-grey-centered {
    color: #777;
    text-align: center;
}

/* Do osadzenia w uwb-sidepanel. Zawiera listę atrybutów wyświetlanej encji (np.
 * imię, nazwisko, identyfikator, itp.). */

.uwb-side-defs { font-size: 12px; }
.uwb-side-defs > div { margin: 3px 0; }
.uwb-side-defs > div:first-child { margin-top: 0; }
.uwb-side-defs > div:last-child { margin-bottom: 0; }
.uwb-side-defs > div > div { float: left; }
.uwb-side-defs > div > div:first-child { width: 80px; text-align: right; color: var(--grey); padding-right: 6px; }
.uwb-side-defs > div > div:first-child .ua-icon { color: #aaa; }
.uwb-side-defs > div > div:last-child { width: 141px; }

/* Do osadzenia w uwb-sidepanel. Alternatywa dla uwb-side-defs (można też
 * używać obydwu na jednej stronie). Różni się tym, że zamiast tekstu w lewej
 * kolumnie wyświetlane są ikony (co daje sporo więcej miejsca na tekst w
 * prawej kolumnie). */

.uwb-side-icons { font-size: 0.75rem; }
.uwb-side-icons > div { margin: 8px 0; }
.uwb-side-icons > div:first-child { margin-top: 0; }
.uwb-side-icons > div:last-child { margin-bottom: 0; }
.uwb-side-icons > div > div { float: left; min-height: 16px; }
.uwb-side-icons > div > div:first-child { width: 16px; color: var(--grey); padding-right: 8px; position: relative; top: -1px; }
.uwb-side-icons > div > div:first-child .ua-icon { color: #bbb; }
.uwb-side-icons > div > div:last-child { width: 195px; }
.uwb-side-icons > div > div.uwb-extra-space:last-child { width: 215px; }

/* Odnośnik z ikoną, do umieszczenia pomiędzy sidepanelami. Nie nadużywać,
 * w przypadku większej ilości odnośników należy je umieścić w panelu. */

.uwb-interpanel-link { margin-bottom: 30px; color: #777; text-align: center; }
.uwb-interpanel-link a { color: #555596; }
.uwb-interpanel-link .ua-icon { margin-right: 4px; color: #aaa; text-shadow: 1px 1px 2px rgba(0,0,0,0.1); }

/* Tabelka z dwiema komórkami - z małym logiem/zdjęciem oraz tekstem do
 * wyświetlenia obok. Przydatna jako element listy atrybutów w głównej części
 * storny (tzn. w bloku "layoutContent"). */

.uwb-text-with-photo {
    margin: 12px 0;
    width: 100%;
}
.uwb-text-with-photo td:first-child {
    vertical-align: top;
    width: 62px;
}
.uwb-text-with-photo img {
    width: 62px;
    height: 62px;
    border: 1px solid #fff;
    box-shadow: 0 0 1px rgba(0,0,0,0.2);
}
.uwb-text-with-photo td:nth-child(2) {
    padding-left: 13px;
}
.uwb-text-with-photo {
    font-size: 0.925rem;
}

/* uwb-topnotice to krótki komunikat do wyświetlenia nad treścią strony. Nie
 * powinien być używany w innych miejscach, oraz nie powinien być używany,
 * jeśli nie wyświetlamy na stronie nic poza tym komunikatem. Np. nadaje się
 * do wyświetlenia "Zaloguj się, aby zobaczyć więcej", ale NIE nadaje się do
 * wyświetlenia "Nie masz dostępu do tej strony". */

.uwb-panels-layout .uwb-topnotice {
    box-sizing: border-box;
    padding: 12px 23px 14px 23px;
    width: 639px;
    font-size: 1rem;
    text-align: center;
}
.uwb-panels-layout.uwb-layoutCoverPhoto-left .uwb-topnotice {
    padding: 22px 23px 24px 243px;
}
.uwb-panels-layout .uwb-topnotice.uwb-topnotice-info {
    color: #fff;
    text-shadow: 0 0 5px rgba(0,0,0,0.5);
    background: var(--primary);
}
.uwb-panels-layout .uwb-topnotice.uwb-topnotice-info a {
    text-decoration: underline;
}

/* uwb-white-content zachowuje się różnie, w zależności od tego, które bloki
 * layoutu są w użyciu. Zazwyczaj zawiera główną treść strony. */

.uwb-panels-layout .uwb-white-content {
    box-sizing: border-box;
    width: 640px;
    padding: 40px;
    border-right: 1px solid #d7d7d7;
    border-bottom: 1px solid #d7d7d7;
    background: #fff;
}
.uwb-panels-layout.uwb-layoutCoverPhoto-left.uwb-layoutTopNotice-undefined .uwb-white-content {
    padding-top: 108px;
}
.uwb-panels-layout.uwb-layoutContent-defined.uwb-layoutMainPanels-undefined .uwb-white-content {
    border-bottom: 0;
}

/* Sekcje - główne elementy składowe bloków "layoutContent". */

h2.uwb-section { text-transform: uppercase; font-weight: bold; font-size: 0.75rem; border-bottom: 1px solid #e7e7e7; padding: 0 0 6px 0; margin: 0; }
.uwb-section-content { padding: 15px 0 60px 0; }
.uwb-section-text { color: var(--font-color); font-size: 0.925rem; }

/* Używane, gdy zdefiniowaniu blok layoutMainPanels. Ustala rozmiar i marginesy
 * paneli. */

.uwb-primary-panels-container {
    padding: 40px 0 70px 40px;
    width: 600px;
}
.uwb-primary-panels-container .uwb-panel {
    margin: 10px 0;
    border-radius: 3px;
    border: 1px solid #d7d7d7;
}