/* =========================================================================
 * PJM Portal — szerokość treści.
 * Panel klienta (Twoje zlecenia itd.) i panel admina: pełna kolumna obok
 * sidebara. Header/footer: treść 1280px (nie rozciągać na viewport).
 * ========================================================================= */

.pjm-dashboard-wrapper .pjm-nav--context { margin: 0; padding: 0; background: transparent; border: 0; box-shadow: none; overflow: visible; border-radius: 0; }
.pjm-dashboard-wrapper .pjm-nav--context ul { margin: 0; padding: 0; list-style: none; }
.pjm-dashboard-wrapper .pjm-nav--context li a { display: flex; align-items: center; justify-content: flex-start; flex-direction: row; gap: 10px; width: 100%; min-height: 44px; padding: 10px 12px; white-space: normal; border-radius: 6px; font-size: 14px; box-sizing: border-box; }
.pjm-dashboard-wrapper .pjm-nav--context .link-text { display: block; min-width: 0; overflow-wrap: anywhere; line-height: 1.4; }
.pjm-dashboard-wrapper .pjm-nav--context .material-symbols-rounded,
.pjm-dashboard-wrapper .pjm-nav-home .material-symbols-rounded {
    width: 28px;
    height: 28px;
    flex: 0 0 28px;
    margin-right: 0;
    font-size: 22px;
    line-height: 1;
    overflow: visible;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.pjm-dashboard-wrapper .pjm-nav-home { margin: 0 0 8px; }
.pjm-dashboard-wrapper .pjm-nav.is-menu-section .pjm-nav-home { display: none; }
.pjm-dashboard-wrapper .pjm-nav.is-menu-root .pjm-nav-section { display: none; }
.pjm-dashboard-wrapper .pjm-nav.is-menu-root .pjm-nav-home { display: block; }
.pjm-dashboard-wrapper button.pjm-context-back {
    width: 100%;
    font: inherit;
    font-weight: 650;
    cursor: pointer;
    text-align: left;
}
.pjm-dashboard-wrapper .pjm-nav-kicker {
    margin: 14px 12px 6px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #6b7c74;
}
.pjm-dashboard-wrapper .pjm-nav-home .is-here a {
    background: #f3faf6;
    color: #1b5e4b;
}
.pjm-dashboard-wrapper .pjm-nav-home .is-here a .material-symbols-rounded { color: #1b5e4b; }
.pjm-dashboard-wrapper .pjm-context-back { display: flex; gap: 8px; align-items: center; min-height: 44px; padding: 10px 12px; margin-bottom: 16px; border: 1px solid #a9bdb1; border-radius: 6px; color: #17382a; background: #fff; text-decoration: none; }
.pjm-dashboard-wrapper .pjm-context-group { border-top: 1px solid #d5dfd9; margin-top: 8px; padding-top: 4px; }
.pjm-dashboard-wrapper .pjm-context-group > summary,
.ja-dashboard-wrapper--grouped .ja-nav-group > summary {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 12px 8px;
    min-height: 44px;
    cursor: pointer;
    color: #17382a;
    font-weight: 700;
    list-style: none;
}
.pjm-dashboard-wrapper .pjm-context-group > summary::-webkit-details-marker,
.ja-dashboard-wrapper--grouped .ja-nav-group > summary::-webkit-details-marker { display: none; }
.pjm-dashboard-wrapper .pjm-context-group > summary::marker,
.ja-dashboard-wrapper--grouped .ja-nav-group > summary::marker { content: ""; }
.pjm-dashboard-wrapper .pjm-context-group > summary::before,
.ja-dashboard-wrapper--grouped .ja-nav-group > summary::before {
    content: "";
    flex: 0 0 8px;
    width: 8px;
    height: 8px;
    margin-top: -3px;
    border-right: 2px solid #1b5e4b;
    border-bottom: 2px solid #1b5e4b;
    transform: rotate(45deg);
    transition: transform 0.18s ease;
}
.pjm-dashboard-wrapper .pjm-context-group[open] > summary::before,
.ja-dashboard-wrapper--grouped .ja-nav-group[open] > summary::before {
    margin-top: 3px;
    transform: rotate(225deg);
}
.pjm-dashboard-wrapper .pjm-nav--context :is(a, summary):focus-visible { outline: 3px solid #a16207; outline-offset: -3px; }
.pjm-dashboard-wrapper .pjm-home-four { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.pjm-home-four > * { min-width: 0; }
.pjm-panel-money { line-height: 1.45; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.pjm-panel-money span { color: #52645a; font-size: 12px; }
.pjm-panel-money-gross { font-weight: 700; color: #14352a; }
.pjm-panel-payment { margin-top: 6px; }
@media (max-width: 1100px) { .pjm-dashboard-wrapper .pjm-home-four { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; } }
@media (max-width: 420px) { .pjm-dashboard-wrapper .pjm-home-four { gap: 8px; } .pjm-home-four .kpi { padding: 12px; } .pjm-home-four .icon-box { display: none; } }
.pjm-home-four :is(.label, .k-lbl) { color: #52645a; letter-spacing: 0; overflow-wrap: anywhere; }
.pjm-home-four :is(.value, .k-val, em) { overflow-wrap: anywhere; }
.pjm-home-four :is(.kpi, .pjm-kpi, .pjm-mini-portal__card) { border-radius: 6px; }
@media (max-width: 720px) {
    .ja-table tr.row-hover td[data-label] { display: grid; grid-template-columns: 82px minmax(0, 1fr); gap: 4px 12px; }
    .ja-table tr.row-hover td[data-label] > * { grid-column: 2; min-width: 0; max-width: 100%; overflow-wrap: anywhere; }
    .ja-table tr.row-hover td[data-label]::before { grid-column: 1; grid-row: 1; }
    .ja-table tr.row-hover td[data-label="Usługi"] { display: grid; }
    .pjm-batch-status-edit select { box-sizing: border-box; }
}
@media (max-width: 420px) {
    .ja-table tr.row-hover td[data-label] { grid-template-columns: minmax(0, 1fr); gap: 4px; }
    .ja-table tr.row-hover td[data-label] > * { grid-column: 1; }
    body.pjm-dashboard-admin-tab .ja-card.table-card { padding: 12px; }
}

:root {
    --pjm-portal-pad-x: 32px;
    --pjm-portal-pad-x-mobile: 14px;
}

/* Treść paneli bez limitu 1280 — ale chrome strony zostaje przy 1280. */
body.pjm-dashboard-page,
body.pjm-dashboard-admin-tab {
    --pjm-panel-max: none;
    --pjm-layout-max: 1280px;
    overflow-x: hidden;
}

/* ---------- Header / footer: treść jak na reszcie witryny ---------- */
body.pjm-dashboard-page .pjm-header-inner,
body.pjm-dashboard-page .pjm-footer-wrap,
body.pjm-dashboard-admin-tab .pjm-header-inner,
body.pjm-dashboard-admin-tab .pjm-footer-wrap {
    max-width: 1280px !important;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    box-sizing: border-box;
}

/* ---------- Treść panelu klienta (m.in. Twoje zlecenia) — pełna kolumna ---------- */
body.pjm-dashboard-page .pjm-content {
    max-width: none !important;
    width: 100%;
    margin-left: 0;
    margin-right: 0;
    padding-left: var(--pjm-portal-pad-x);
    padding-right: var(--pjm-portal-pad-x);
    box-sizing: border-box;
}

body.pjm-dashboard-page .pjm-dashboard-wrapper,
body.pjm-dashboard-page .pjm-tab-content-wrapper {
    max-width: none;
    width: 100%;
    margin-left: 0;
    margin-right: 0;
    box-sizing: border-box;
}

/* ---------- Panel admina — ta sama pełna kolumna co Twoje zlecenia ---------- */
body.pjm-dashboard-admin-tab .pjm-content {
    max-width: none !important;
    width: 100%;
    padding: 0 !important;
}

body.pjm-dashboard-admin-tab .ja-dashboard-wrapper {
    max-width: none !important;
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: var(--pjm-portal-pad-x) !important;
    padding-right: var(--pjm-portal-pad-x) !important;
    box-sizing: border-box;
}

body.pjm-dashboard-admin-tab .ja-content-area,
body.pjm-dashboard-admin-tab .ja-view {
    max-width: none;
    width: 100%;
}

/* Realizator — pełna kolumna jak zlecenia */
body.pjm-dashboard-translator-tab .pjm-content,
body.pjm-dashboard-translator-tab .pjm-tp {
    max-width: none !important;
    width: 100%;
    margin-left: 0;
    margin-right: 0;
}

/* Karty / listy wypełniają kolumnę treści. */
body.pjm-dashboard-page .pjm-courses-portal,
body.pjm-dashboard-page .pjm-pack-detail,
body.pjm-dashboard-page .pjm-player,
body.pjm-dashboard-page .pjm-shop-portal,
body.pjm-dashboard-page .pjm-jmai-catalog,
body.pjm-dashboard-page .pjm-courses-admin,
body.pjm-dashboard-page .pjm-infogen-admin,
body.pjm-dashboard-page .pjm-order-list,
body.pjm-dashboard-page .pjm-lead-list,
body.pjm-dashboard-page .pjm-form,
body.pjm-dashboard-page .pjm-portal-form,
body.pjm-dashboard-page .pjm-panel,
body.pjm-dashboard-page .pjm-card,
body.pjm-dashboard-page .pjm-section,
body.pjm-dashboard-page .pjm-account-container,
body.pjm-dashboard-page .pjm-settings-container,
body.pjm-dashboard-page .pjm-account-form,
body.pjm-dashboard-page .pjm-grid-2-col {
    width: 100%;
    max-width: none;
    box-sizing: border-box;
}

/* Logowanie / rejestracja na /moje-konto/ — kompaktowa karta, nie pełna szerokość. */
body.pjm-dashboard-page .pjm-auth-container {
    max-width: none;
    width: 100%;
}

body.pjm-dashboard-page .pjm-auth-card {
    max-width: 400px !important;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    box-sizing: border-box;
}

/* Nagłówki podstron — spójne odstępy. */
body.pjm-dashboard-page .pjm-courses-portal__head,
body.pjm-dashboard-page .pjm-shop-portal__header,
body.pjm-dashboard-page .pjm-pack-detail__hero {
    padding: 20px 24px;
}

@media (max-width: 768px) {
    body.pjm-dashboard-page .pjm-content,
    body.pjm-dashboard-admin-tab .ja-dashboard-wrapper {
        padding-left: var(--pjm-portal-pad-x-mobile);
        padding-right: var(--pjm-portal-pad-x-mobile);
    }
    body.pjm-dashboard-page .pjm-courses-portal__head,
    body.pjm-dashboard-page .pjm-shop-portal__header,
    body.pjm-dashboard-page .pjm-pack-detail__hero {
        padding: 16px;
    }
}

/* ---------- Admin JMai — sub-nawigacja spójna z resztą admina ---------- */

.pjm-courses-admin__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 16px 20px;
    background: #fff;
    border: 1px solid var(--jmai-border, #E3E1D9);
    border-radius: 10px;
    margin-bottom: 16px;
    flex-wrap: wrap;
}
.pjm-courses-admin__head h2 {
    margin: 0;
    font-family: 'Plus Jakarta Sans', sans-serif;
    font-size: 20px;
    color: var(--jmai-text, #16241D);
}

.pjm-courses-admin .pjm-table-wrapper {
    background: #fff;
    border: 1px solid var(--jmai-border, #E3E1D9);
    border-radius: 10px;
    overflow: hidden;
}
.pjm-courses-admin .pjm-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 14px;
}
.pjm-courses-admin .pjm-table th,
.pjm-courses-admin .pjm-table td {
    padding: 12px 14px;
    text-align: left;
    border-bottom: 1px solid var(--jmai-border, #E3E1D9);
}
.pjm-courses-admin .pjm-table thead th {
    background: #F8FAF9;
    color: #5a7568;
    font-weight: 700;
    font-size: 12px;
    letter-spacing: .04em;
    text-transform: uppercase;
}
.pjm-courses-admin .pjm-table tbody tr:hover { background: #F8FAF9; }

.pjm-form--card {
    background: #fff;
    border: 1px solid var(--jmai-border, #E3E1D9);
    border-radius: 12px;
    padding: 20px;
    margin-bottom: 16px;
}
.pjm-form label > span:first-child {
    display: block;
    font-size: 12px;
    font-weight: 700;
    color: #5a7568;
    letter-spacing: .03em;
    text-transform: uppercase;
    margin-bottom: 4px;
}

.pjm-courses-admin .pjm-input {
    width: 100%;
    min-height: var(--pjm-control-h, 42px);
    padding: 8px 10px;
    border: 1px solid var(--jmai-border, #E3E1D9);
    border-radius: 6px;
    font-size: 14px;
    background: #fff;
    box-sizing: border-box;
}
.pjm-courses-admin textarea.pjm-input { line-height: 1.5; }
.pjm-courses-admin .pjm-input:focus {
    border-color: var(--jmai-primary, #1B5E4B);
    outline: 2px solid var(--jmai-primary, #1B5E4B);
    outline-offset: 2px;
}

.pjm-courses-admin .pjm-badge {
    display: inline-block;
    padding: 3px 10px;
    border-radius: 999px;
    font-weight: 800;
    font-size: 12px;
    color: #fff;
    background: #1B5E4B;
}
.pjm-courses-admin .pjm-badge--a { background: #2E7D5B; }
.pjm-courses-admin .pjm-badge--b { background: #1B5E4B; }
.pjm-courses-admin .pjm-badge--c { background: #F2B705; color: #16241D; }
.pjm-courses-admin .pjm-badge--d { background: #8b1a1a; }

.pjm-courses-admin .jm-btn,
.pjm-courses-admin__head .jm-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 14px;
    min-height: 44px;
    background: #fff;
    color: #16241D;
    border: 1px solid var(--jmai-border, #E3E1D9);
    border-radius: 8px;
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
    cursor: pointer;
}
.pjm-courses-admin .jm-btn:hover { border-color: #1B5E4B; color: #1B5E4B; }
.pjm-courses-admin .jm-btn:focus-visible,
.pjm-courses-admin__head .jm-btn:focus-visible {
    outline: 3px solid #E0A33E;
    outline-offset: 2px;
}
.pjm-courses-admin .jm-btn.primary,
.pjm-courses-admin__head .jm-btn.primary {
    background: #1B5E4B;
    color: #fff;
    border-color: #1B5E4B;
}
.pjm-courses-admin .jm-btn.primary:hover { background: #154A3B; color: #fff; }
.pjm-courses-admin .jm-btn.small { padding: 5px 10px; font-size: 12px; min-height: 36px; }