/* GUI backoffice: zakres ograniczony przez klasę nadawaną szablonom panelu. */
body.gl-panel-gui .gl-panel-layout > * { min-width: 0; }
body.gl-panel-gui .gl-panel-layout > .gl-panel-sidebar { flex: 0 0 200px; }
body.gl-panel-gui .gl-panel-layout > :last-child { flex: 1 1 0%; }
body.gl-panel-gui .gl-panel-row { overflow: visible; }
body.gl-panel-gui .gl-panel-layout .top-buttons,
body.gl-panel-gui .gl-panel-layout .filters { flex-wrap: wrap; }
body.gl-panel-gui .gl-panel-layout .filters { min-width: 0; }
body.gl-panel-gui .gl-panel-layout .filters input,
body.gl-panel-gui .gl-panel-layout .filters select { max-width: 100%; border-radius: 10px; }
body.gl-panel-gui .gl-panel-layout .tile h6 { color: #d7dbe2; }
body.gl-panel-gui .gl-panel-layout .gl-active-projects-table td { color: #d7dbe2; }
body.gl-panel-gui .gl-panel-layout .table-wrapper { max-width: 100%; }

/* Starsze formularze: widoczne pola, opisy i spójne przyciski. */
body.gl-panel-gui :is(.add-client-container, .edit-client-container,
.add-realizator-container, .edit-realizator-container) { box-sizing: border-box; }
body.gl-panel-gui :is(.add-client-container, .edit-client-container,
.add-realizator-container, .edit-realizator-container) form { border-radius: 12px; }
body.gl-panel-gui :is(.add-client-container, .edit-client-container) .help {
    color: #c3cad5; line-height: 1.5; margin-top: 4px;
}
body.gl-panel-gui :is(.add-client-container, .edit-client-container,
.add-realizator-container, .edit-realizator-container) :is(input[type="text"],
input[type="email"], input[type="tel"], input[type="number"], input[type="date"], select, textarea) {
    box-sizing: border-box; min-width: 0; max-width: 100%;
    border: 1px solid #737d8d; border-radius: 10px;
    background: #252a33; color: #fff; padding: 10px 12px;
}
body.gl-panel-gui :is(.add-client-container, .edit-client-container,
.add-realizator-container, .edit-realizator-container) :is(.back-link, input[type="submit"], .gus-btn) {
    border-radius: 10px; min-height: 44px; height: auto; line-height: 1.4;
    margin-right: 0; white-space: normal;
}
body.gl-panel-gui :is(.add-client-container, .edit-client-container) .gus-btn {
    flex: 0 0 auto; width: auto; padding: 10px 16px; margin-top: 0;
}
body.gl-panel-gui :is(.add-client-container, .edit-client-container) .gus-row input { flex: 1 1 0%; }
body.gl-panel-gui :is(.add-client-container, .edit-client-container) .gl-col { width: 100%; }

/* Fokus klawiatury pozostaje widoczny również po lokalnych outline:none. */
body.gl-panel-gui #main :is(a, button, input, select, textarea, summary, [contenteditable="true"]):focus-visible {
    outline: 2px solid #ff8795 !important; outline-offset: 3px;
}
body.gl-panel-gui .gl-breadcrumbs__current { min-width: 0; overflow-wrap: anywhere; }

/* Tabela finansowa zachowuje czytelne kolumny i przewija się we własnym kontenerze. */
body.gl-panel-gui #glInvoicesTable { min-width: 960px; table-layout: auto; }
body.gl-panel-gui #glInvoicesTable th { letter-spacing: normal; white-space: nowrap; }
body.gl-panel-gui #glInvoicesTable td:nth-child(7) { min-width: 180px; overflow-wrap: anywhere; }
body.gl-panel-gui #glInvoicesTable :is(th, td):nth-child(8) { min-width: 150px; }
body.gl-panel-gui #glReportModal .box {
    box-sizing: border-box; max-height: calc(100vh - 36px); max-height: calc(100dvh - 36px);
    overflow-y: auto; overscroll-behavior: contain;
}
body.gl-panel-gui #glReportModal .row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
body.gl-panel-gui #glReportModal input { min-width: 0; box-sizing: border-box; }
body.gl-panel-gui #glReportModal .actions { flex-wrap: wrap; }

@media (max-width: 767px) {
    body.gl-panel-gui .gl-panel-layout { flex-direction: column; gap: 12px; }
    body.gl-panel-gui .gl-panel-layout > .gl-panel-sidebar { flex: none; width: 100%; }
    body.gl-panel-gui .gl-panel-layout > :last-child { flex: auto; width: 100%; }
    body.gl-panel-gui :is(.add-client-container, .edit-client-container,
    .add-realizator-container, .edit-realizator-container) {
        width: calc(100% - 24px); margin: 16px auto 24px;
    }
    body.gl-panel-gui :is(.add-client-container, .edit-client-container) .gus-btn { width: 100%; }
    body.gl-panel-gui #main :is(input[type="text"], input[type="email"], input[type="tel"],
    input[type="password"], input[type="number"], input[type="date"], input[type="time"], select, textarea) {
        font-size: 16px;
    }
    body.gl-panel-gui #glReportModal .row { grid-template-columns: minmax(0, 1fr); }
    body.gl-panel-gui #glReportModal .btn { width: 100%; min-height: 44px; }
}
@media (prefers-reduced-motion: reduce) {
    body.gl-panel-gui .gl-bo-nav__drawer,
    body.gl-panel-gui .gl-bo-nav__list a { transition: none; }
}

/* Sekcje sterowane klasą hidden w formularzu edycji projektu. */
body.gl-panel-gui .add-project-container .hidden { display: none !important; }

/* Publiczny nagłówek sklepu nie należy do ekranów backoffice. */
body.gl-panel-gui #wrapper > header { display: none; }

/* Firefox: tło fieldset nie może zasłaniać tekstu legendy. */
body.gl-panel-gui :is(.add-lektor-container, .edit-lektor-container) fieldset { min-width: 0; }
body.gl-panel-gui :is(.add-lektor-container, .edit-lektor-container) fieldset legend {
    position: relative; z-index: 1; float: none; width: auto; max-width: 100%;
    line-height: 1.4; height: auto; overflow-wrap: anywhere;
}
body.gl-panel-gui #glReportModal .row { margin-left: 0; margin-right: 0; }
body.gl-panel-gui #glReportModal button[aria-label="Zamknij raport"] {
    flex: 0 0 44px; width: 44px; height: 44px; padding: 0; margin: 0;
}
@media (max-width: 767px) {
    body.gl-panel-gui:is(.page-template-gl-add-client-php, .page-template-gl-edit-client-php,
    .page-template-gl-add-realizator-php, .page-template-gl-edit-realizator-php) #main {
        padding-left: 0 !important; padding-right: 0 !important;
    }
}

/* Wskaźniki dashboardu korzystają z tych samych tokenów co pozostałe kafle. */
body.gl-panel-gui .gl-dashboard {
    --gl-bg: #323844; --gl-text: #fff; --gl-border: rgba(255,255,255,.10);
    --gl-shadow: 0 10px 26px rgba(0,0,0,.20);
}
body.gl-panel-gui:is(.page-template-gl-add-realizator-php, .page-template-gl-edit-realizator-php) #main {
    padding-top: 12px !important;
}
body.gl-panel-gui :is(.add-lektor-container, .edit-lektor-container) fieldset legend {
    float: left; width: 100%; padding: 0; margin: 0 0 14px;
}
body.gl-panel-gui :is(.add-lektor-container, .edit-lektor-container) fieldset > :not(legend) {
    clear: both;
}

/* Kalkulatory: ten sam porządek nawigacji i czytelny podgląd na telefonie. */
body.gl-panel-gui .calculator-title { margin: 24px 12px 28px !important; font-size: 28px; line-height: 1.3; }
body.gl-panel-gui .main-content { gap: 15px; }
body.gl-panel-gui .main-content > .container { flex: 1 1 70%; min-width: 0; max-width: none; }
body.gl-panel-gui .main-content > .sidebar { flex: 0 1 30%; min-width: 0; margin-left: 0; }
body.gl-panel-gui .sidebar h4 { margin-top: 16px; }
@media (max-width: 768px) {
    body.gl-panel-gui .main-content > .container { flex: auto; width: 100%; }
    body.gl-panel-gui .main-content > .sidebar {
        flex: auto; width: 100%; max-height: none; overflow: visible;
    }
}
@media (max-width: 900px) {
    body.gl-panel-gui:not(.page-template-gl-projekty-php):not(.page-template-gl-panel-php) .gl-panel-layout .table-wrapper::before {
        content: "Przewiń tabelę w poziomie →";
        display: block; position: sticky; left: 0; width: max-content; max-width: 100%;
        padding: 6px 0 10px; color: #c3cad5; font-size: 12px; white-space: normal;
    }
    body.gl-panel-gui .wycena-btn { border-radius: 10px; }
}

body.gl-panel-calculator #main { padding-top: 12px !important; }

/* Po zmianie kierunku flex szerokość bazowa filtrów nie może stać się wysokością. */
@media (max-width: 900px) {
    body.gl-panel-gui .gl-project-topline .filters { flex: 0 1 auto; }
    body.gl-panel-gui .gl-project-topline .filters input[type="text"],
    body.gl-panel-gui .gl-project-topline .filters select {
        width: 100%; min-width: 0; margin-bottom: 0;
    }
}

/* Menu zwijane takze na waskim tablecie, zgodnie z gl-panel-nav.php. */
@media (max-width: 900px) {
    body.gl-panel-gui .gl-panel-layout { flex-direction: column; gap: 12px; }
    body.gl-panel-gui .gl-panel-layout > .gl-panel-sidebar { flex: none; width: 100%; }
    body.gl-panel-gui .gl-panel-layout > :last-child { flex: auto; width: 100%; }
}

/* Przycisk menu nie dziedziczy wariantów przycisków poszczególnych ekranów. */
body.gl-panel-gui .gl-bo-nav__toggle {
    background: #282e38; color: #fff; border: 1px solid rgba(255,255,255,.18);
    border-radius: 12px; min-height: 44px; box-shadow: none;
}
body.gl-panel-gui .gl-bo-nav__toggle:hover,
body.gl-panel-gui .gl-bo-nav__toggle:focus-visible { background: #3d4553; color: #fff; }

/* Ciemne tlo dokumentu panelu, takze poza trescia i pod interfejsem przegladarki.
   Nadpisuje jasne body/html z gl-styles.css; nie zmienia tla wydrukow. */
@media screen {
    body.gl-panel-gui {
        background-color: #252a33 !important;
    }
    html:has(> body.gl-panel-gui) {
        background-color: #252a33 !important;
    }
}