/* ══════════════════════════════════════════════════════════════════════
   silikatytrabki.pl – strefa partnera (logowanie, konto, administracja,
   pasek u góry kalkulatora). Uzupełnia assets/podstrony.css.
   ══════════════════════════════════════════════════════════════════════ */

/* ── Czcionka nagłówków (jak na stronie głównej) ─────────────────────── */
@font-face{font-family:'Saira';font-style:normal;font-weight:400 800;font-stretch:100% 125%;font-display:swap;src:url('../assets/fonts/saira-400-800-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Saira';font-style:normal;font-weight:400 800;font-stretch:100% 125%;font-display:swap;src:url('../assets/fonts/saira-400-800-latin.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

/* ── Pasek zalogowanego użytkownika (25.09.2026: styl nowej strony) ──── */
.pasek-partnera {
    background: rgba(18, 22, 28, .96);
    -webkit-backdrop-filter: saturate(140%) blur(10px);
            backdrop-filter: saturate(140%) blur(10px);
    border-bottom: 1px solid rgba(255, 255, 255, .06);
    color: #d6dce3;
    font-size: 14px;
    position: sticky;
    top: 0;
    z-index: 60;
}
.strefa .pasek-partnera .wrap { max-width: 1320px; }
.pasek-partnera .wrap {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px 18px;
    min-height: 64px;
    flex-wrap: wrap;
}
.pasek-partnera .kto { display: flex; align-items: center; gap: 12px; min-width: 0; }
.pasek-partnera .kto img {
    height: 40px; width: 40px; border-radius: 50%; background: #fff; flex: none;
    box-shadow: 0 0 10px 1px rgba(170, 222, 255, .3), 0 0 22px 4px rgba(29, 143, 208, .18);
}
.pasek-partnera .kto b { display: block; color: #fff; font: 700 16px/1.2 Saira, -apple-system, "Segoe UI", Arial, sans-serif; letter-spacing: .01em; }
.pasek-partnera .kto span { display: block; font-size: 12.5px; color: #9aa6b2; }
.pasek-partnera nav { display: flex; gap: 4px; flex-wrap: wrap; align-items: center; }
.pasek-partnera nav a {
    color: #d6dce3; text-decoration: none; font-size: 14px; font-weight: 600;
    padding: 8px 14px; border-radius: 999px; transition: background .15s, color .15s;
}
.pasek-partnera nav a:hover { color: #fff; background: rgba(255, 255, 255, .08); }
.pasek-partnera nav a[aria-current="page"] { color: #fff; background: rgba(29, 143, 208, .28); box-shadow: inset 0 0 0 1px rgba(125, 196, 240, .35); }
.pasek-partnera nav a.wyjscie { color: #f3b9b9; }
.pasek-partnera nav a.wyjscie:hover { background: rgba(240, 122, 122, .12); }
@media (max-width: 640px) {
    .pasek-partnera .wrap { padding-top: 8px; padding-bottom: 8px; }
    .pasek-partnera nav { width: 100%; justify-content: space-between; }
    .pasek-partnera nav a { padding: 7px 10px; font-size: 13.5px; }
}
@media (max-width: 390px) { .pasek-partnera nav a { padding: 6px 8px; font-size: 13px; } }
@media (max-width: 320px) { .pasek-partnera .kto img { height: 34px; width: 34px; } .pasek-partnera nav a { padding: 6px 6px; font-size: 12.5px; } }
@media (max-width: 280px) {
    .pasek-partnera .kto b { font-size: 14px; }
    .pasek-partnera .kto span { font-size: 11.5px; }
    .pasek-partnera nav { gap: 2px; }
    .pasek-partnera nav a { padding: 5px 5px; font-size: 12px; }
}

/* ── Ekran logowania ─────────────────────────────────────────────────── */
body.logowanie {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, var(--granat), var(--granat-ciemny));
    padding: 28px 18px;
}
.karta-logowania { width: 100%; max-width: 430px; }
.karta-logowania .karta {
    background: #fff;
    border-radius: 14px;
    padding: 34px 32px 28px;
    box-shadow: 0 18px 46px rgba(0, 0, 0, .28);
    text-align: center;
}
.karta-logowania .znak { display: block; margin: 0 auto 14px; border-radius: 50%; }
.karta-logowania h1 { font-size: 24px; color: var(--granat); margin: 0 0 6px; }
.karta-logowania .pod { margin: 0 0 22px; font-size: 14.5px; color: var(--tekst-jasny); line-height: 1.55; }
.karta-logowania form { text-align: left; display: grid; gap: 14px; }
.karta-logowania label { display: flex; flex-direction: column; gap: 5px; font-size: 13.5px; font-weight: 600; color: var(--granat); }
.karta-logowania button { width: 100%; margin-top: 4px; }
.karta-logowania .drobne { margin: 20px 0 0; font-size: 12.5px; color: var(--tekst-jasny); line-height: 1.6; text-align: left; }
.stopka-min { text-align: center; color: #c3d2e0; font-size: 12.5px; margin: 18px 0 0; }
.stopka-min a { color: #fff; }

/* ── Komunikaty ──────────────────────────────────────────────────────── */
.komunikat {
    text-align: left;
    border-radius: 8px;
    padding: 11px 14px;
    font-size: 14px;
    margin: 0 0 18px;
    line-height: 1.5;
}
.komunikat.blad { background: #fdeeee; border: 1px solid #e3b4b4; color: #8f2020; }
.komunikat.ok   { background: #eaf6f0; border: 1px solid #a9d6c1; color: #12603d; }
.komunikat.info { background: #eef4fa; border: 1px solid #b9cfe4; color: #144e7a; }

/* ── Formularze i tabele w strefie ───────────────────────────────────── */
.strefa main { padding: 30px 0 60px; }
.strefa h1 { font-size: 26px; color: var(--granat); margin: 0 0 6px; }
.strefa .wstep { color: var(--tekst-jasny); font-size: 15px; margin: 0 0 24px; }

.karta-tresc {
    background: var(--tlo-szare);
    border: 1px solid var(--ramka);
    border-radius: 10px;
    padding: 22px 24px;
    margin: 0 0 22px;
    max-width: 620px;
}
.karta-tresc h2 { margin: 0 0 4px; font-size: 19px; color: var(--granat); }
.karta-tresc p.opis { margin: 0 0 16px; font-size: 14.5px; color: var(--tekst-jasny); }
.karta-tresc form { display: grid; gap: 14px; }
.karta-tresc label { display: flex; flex-direction: column; gap: 5px; font-size: 13.5px; font-weight: 600; color: var(--granat); }

table.konta { width: 100%; border-collapse: collapse; font-size: 14px; background: #fff; }
table.konta th {
    background: var(--granat); color: #fff; text-align: left;
    padding: 9px 11px; font-size: 12.5px; letter-spacing: .02em; font-weight: 600;
}
table.konta td { padding: 9px 11px; border-bottom: 1px solid var(--ramka); vertical-align: middle; }
table.konta tr:nth-child(even) td { background: #f8fafb; }
table.konta .plakietka {
    display: inline-block; font-size: 11.5px; font-weight: 700; letter-spacing: .03em;
    padding: 2px 8px; border-radius: 20px; text-transform: uppercase;
}
table.konta .plakietka.tak  { background: #eaf6f0; color: #12603d; }
table.konta .plakietka.nie  { background: #f1f3f5; color: #6b7480; }
table.konta .plakietka.szef { background: #eef4fa; color: #144e7a; }
table.konta form { display: inline; }
.przewin { overflow-x: auto; }

.haslo-nowe {
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 19px; font-weight: 700; letter-spacing: .04em; color: var(--granat);
    background: #fff; border: 1px dashed var(--akcent); border-radius: 8px;
    padding: 12px 15px; display: inline-block; margin: 6px 0 2px; user-select: all;
}

/* ── Pola i przyciski (wspólne dla całej strefy) ─────────────────────── */
.strefa input, .strefa select, .strefa textarea,
.karta-logowania input, .karta-logowania select {
    font: inherit; font-size: 15px; font-weight: 400; color: var(--tekst);
    padding: 9px 11px; border: 1px solid #c6ced7; border-radius: 7px;
    background: #fff; width: 100%; box-sizing: border-box;
}
.strefa input:focus, .strefa select:focus, .strefa textarea:focus,
.karta-logowania input:focus {
    outline: 2px solid var(--akcent); outline-offset: -1px; border-color: var(--akcent);
}
.btn2 {
    display: inline-block; cursor: pointer; font: inherit; font-size: 15px; font-weight: 600;
    padding: 11px 20px; border-radius: 8px; border: 1px solid var(--granat);
    background: var(--granat); color: #fff; text-decoration: none; line-height: 1.2;
}
.btn2:hover { background: var(--granat-ciemny); }
.btn2.alt { background: #fff; color: var(--granat); }
.btn2.alt:hover { background: #e9eef3; }
.btn2.mini { font-size: 13.5px; padding: 7px 13px; }
table.konta .btn2.mini { margin: 2px 3px 2px 0; }
