:root {
    --assess-ink: #112f39;
    --assess-green: #087d50;
    --assess-green-dark: #05633f;
    --assess-green-soft: #e8f3ef;
    --assess-line: #c8d8d3;
    --assess-warning: #fff0c9;
    --assess-error: #fff0ed;
    --assess-white: #fff;
    --assess-shadow: 0 5px 18px rgba(17, 47, 57, .08);
}

* { box-sizing: border-box; }
body { margin: 0; color: var(--assess-ink); background: #eef3f2; font-family: Arial, sans-serif; }
a { color: #006c48; }
button, .button {
    display: inline-block;
    padding: .65rem 1rem;
    color: #fff;
    text-decoration: none;
    cursor: pointer;
    background: var(--assess-green);
    border: 1px solid var(--assess-green);
    border-radius: 2px;
}
button:hover, .button:hover { background: var(--assess-green-dark); }
.button--secondary { color: var(--assess-green-dark); background: #fff; }

/*
 * Stan hover miał większą specyficzność niż sama klasa button--secondary:
 * tło stawało się zielone, ale tekst pozostawał zielony. Definiujemy komplet
 * stanów przycisku, aby kontrast napisu był zawsze zachowany.
 */
button:not(.button--secondary):hover,
button:not(.button--secondary):focus,
button:not(.button--secondary):active {
    color: #fff;
    background: var(--assess-green-dark);
}
button.button--secondary:hover,
button.button--secondary:focus,
button.button--secondary:active {
    color: #fff;
    background: var(--assess-green);
}
button:disabled {
    color: #536662;
    cursor: not-allowed;
    background: #dce4e2;
    border-color: #bdcbc7;
}
[hidden] { display: none !important; }

/* Widok użytkownika — arkusz oceny. */
.assessment-app { width: calc(100% - 32px); max-width: 1900px; margin: 0 auto; padding: 1rem 0 3rem; }
.assessment-app, .assessment-app button, .assessment-app input, .assessment-app select, .assessment-app textarea { font-size: 13px; }
.assessment-app h1, .assessment-app h2, .assessment-app h3 { margin: 0; font-size: 13px; line-height: 1.35; }
.assessment-app__header, .assessment-app-sheet-header { display: flex; align-items: center; justify-content: space-between; gap: 1rem; min-height: 34px; margin-bottom: 1rem; padding: .55rem .75rem; background: #fff; border-top: 2px solid var(--assess-green); }
.assessment-app__header small { font-size: 11px; }
.assessment-app__message, .assessment-app-card { padding: 1rem; background: #fff; border: 1px solid var(--assess-line); }
.assessment-app__message--error { color: #7e2418; background: var(--assess-error); border-left: 4px solid #b83228; }
.assessment-app-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 1rem; }
.assessment-app-card h2 { margin-bottom: .5rem; }
.assessment-app-card__notice { padding: .7rem; background: var(--assess-warning); border-left: 3px solid #d28a00; }
.assessment-app-filters { display: grid; grid-template-columns: repeat(4, minmax(160px, 1fr)); gap: .75rem; padding: .9rem; background: var(--assess-green-soft); border: 1px solid var(--assess-line); }
.assessment-app-filters label { display: flex; flex-direction: column; gap: .3rem; font-weight: 700; }
.assessment-app-filters select { min-height: 2.4rem; padding: .4rem; background: #fff; border: 1px solid #9db5ad; }
.assessment-app-table-wrap { max-height: calc(100vh - 235px); overflow: auto; background: #fff; border: 1px solid var(--assess-line); }
.assessment-app-table { display: table; width: 100%; min-width: 1750px; border-collapse: collapse; font-size: .78rem; }
.assessment-app-table th, .assessment-app-table td { padding: .45rem; vertical-align: top; text-align: left; border: 1px solid #d8e1df; }
.assessment-app-table th { position: sticky; top: 0; z-index: 2; background: #e6eeec; }
.assessment-app-table td:first-child, .assessment-app-table th:first-child { position: sticky; left: 0; z-index: 1; background: inherit; }
.assessment-app-table textarea, .assessment-app-table input:not([type=checkbox]), .assessment-app-table select { width: 100%; min-width: 115px; padding: .4rem; background: #fff; border: 1px solid #9db5ad; }
.assessment-app-table textarea { min-width: 220px; min-height: 5rem; resize: vertical; }
.assessment-app-description { min-width: 300px; line-height: 1.45; }
.assessment-app-audit-mode { margin-top: .65rem; padding: .55rem .65rem; background: #edf6f2; border-top: 1px solid #9db5ad; }
.assessment-app-audit-mode__label { display: block; margin-bottom: .25rem; color: var(--assess-green-dark); }
.assessment-app-audit-mode p { margin: 0; color: #31524a; font-size: .95em; line-height: 1.45; }
.assessment-app-row--fulfilled { background: #e8f6ee; }
.assessment-app-row--failed { background: #fff1ed; }
.assessment-app-row--locked { color: #667276; background: #f0f2f2; }
.assessment-app-row--inconsistent { background: #ffe0c8; }
.assessment-app-save-state { width: 120px; min-width: 120px; max-width: 120px; overflow: hidden; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.assessment-app-save-state.has-error { color: #a12618; }

/* Panel administratora. */
.assess-admin { width: calc(100% - 32px); max-width: 1900px; margin: 0 auto; padding: 1rem 0 4rem; }
.assess-admin__portal-header, .assess-admin__context, .assess-admin__card { margin-bottom: 1rem; padding: 1rem 1.25rem; background: #fff; border: 1px solid var(--assess-line); }
.assess-admin__portal-header { display: flex; align-items: center; justify-content: space-between; border-top: 3px solid var(--assess-green); }
.assess-admin__portal-header h1 { margin: .2rem 0 0; font-size: 1.65rem; }
.assess-admin__context { background: var(--assess-green-soft); border-left: 4px solid var(--assess-green); }
.assess-admin__context p { margin: .25rem 0; }
.assess-admin__menu { display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: 1rem; padding: .75rem; background: var(--assess-ink); }
.assess-admin__menu a, .assess-admin__menu button { padding: .55rem .8rem; color: #fff; background: transparent; border: 1px solid transparent; }
.assess-admin__menu a:hover, .assess-admin__menu button:hover, .assess-admin__menu .is-active { background: var(--assess-green); }
.assess-admin__menu form { margin: 0; }
.assess-admin__menu-title { align-self: center; padding: .55rem .8rem; color: #fff; font-size: 1.05rem; }
.assess-admin__card h2 { margin-top: 0; }
.assess-admin__form { display: grid; grid-template-columns: repeat(4, minmax(150px, 1fr)); gap: .8rem; }
.assess-admin__form label { display: flex; flex-direction: column; gap: .3rem; font-weight: 700; }
.assess-admin__form input, .assess-admin__form select, .assess-admin__form textarea { width: 100%; padding: .55rem; font-size: 14px; border: 1px solid #9db5ad; }
.assess-admin__form textarea { min-height: 4rem; line-height: 1.4; resize: vertical; }
.assess-admin__new-register-value { display: grid; gap: .3rem; margin-top: .35rem; }
.assess-admin__new-register-value > span { font-size: 12px; }
.assess-admin__wide { grid-column: 1 / -1; }
.assess-admin__actions { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem; }
.assess-admin__save-bar { position: sticky; bottom: 0; z-index: 5; padding: .75rem; background: rgba(255,255,255,.97); border-top: 1px solid var(--assess-green); box-shadow: 0 -5px 14px rgba(15,47,56,.08); }
.assess-admin__save-status { font-weight: 700; color: #31524a; }
.assess-admin__save-status.is-unsaved { color: #a64b00; }
.assess-admin__notice { padding: .75rem; background: var(--assess-warning); border-left: 4px solid #d28a00; }
.assess-admin__notice--error { background: var(--assess-error); border-left-color: #b83228; }
.assess-admin__table-wrap { overflow-x: auto; }
.assess-admin table { width: 100%; border-collapse: collapse; }
.assess-admin th, .assess-admin td { padding: .55rem; vertical-align: top; text-align: left; border: 1px solid var(--assess-line); }
.assess-admin th { background: #e6eeec; }
.assess-admin__filters { display: grid; grid-template-columns: minmax(240px,2fr) repeat(3,minmax(150px,1fr)) auto auto; gap: .65rem; align-items: end; margin-bottom: .9rem; }
.assess-admin__filters label { display: flex; flex-direction: column; gap: .3rem; font-weight: 700; }
.assess-admin__filters input, .assess-admin__filters select { width: 100%; padding: .55rem; border: 1px solid #9db5ad; }
.assess-admin__assignments-table { min-width: 1450px; }
.assess-admin__row-actions { min-width: 145px; }
.assess-admin__row-actions form + form { margin-top: .4rem; }
.assess-admin__row-actions button { width: 100%; padding: .45rem; }
.assess-admin__tree-category { margin: 1rem 0; border: 1px solid var(--assess-line); }
.assess-admin__tree-category > h3 { margin: 0; padding: .75rem; background: var(--assess-green-soft); }
.assess-admin__tree-question { display: flex; justify-content: space-between; gap: 1rem; padding: .75rem; border-top: 1px solid var(--assess-line); }
.assess-admin__level { padding: 1rem; background: #f7faf9; border: 1px solid var(--assess-line); }
.assess-admin__level + .assess-admin__level { margin-top: .75rem; }

/* Arkusz budowy Oceny: jedno pytanie oraz wszystkie poziomy w jednym wierszu. */
.assess-sheet__header { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; }
.assess-sheet__header h2 { margin-bottom: .25rem; }
.assess-sheet__header p { margin-top: 0; }
.assess-sheet__empty { padding: 1.25rem; text-align: center; background: var(--assess-green-soft); }
.assess-sheet__table-wrap { max-height: calc(100vh - 270px); overflow: auto; border: 1px solid var(--assess-line); }
.assess-sheet__table { min-width: 1700px; table-layout: fixed; font-size: 13px; }
.assess-sheet__table th { position: sticky; top: 0; z-index: 3; }
.assess-sheet__table th:first-child { width: 48px; }
.assess-sheet__table th:nth-child(2) { width: 150px; }
.assess-sheet__table th:nth-child(n+3) { width: 260px; }
.assess-sheet__table th:last-child { width: 145px; }
.assess-sheet__number { text-align: center; font-weight: 700; }
.assess-sheet__level textarea { width: 100%; min-height: 105px; padding: .45rem; font-size: 13px; line-height: 1.35; resize: vertical; border: 1px solid #9db5ad; }
.assess-sheet__audit textarea { width: 100%; min-height: 105px; padding: .45rem; font-size: 13px; line-height: 1.35; resize: vertical; border: 1px solid #9db5ad; }
.assess-sheet__level-controls { display: grid; grid-template-columns: 62px 1fr 1fr; gap: .45rem; align-items: center; margin-top: .4rem; }
.assess-sheet__level-controls input[type=number] { width: 100%; padding: .35rem; }
.assess-sheet__level-controls label { display: flex; align-items: center; gap: .2rem; font-size: 12px; }
.assess-sheet__actions { display: grid; gap: .55rem; }
.assess-sheet__actions button { width: 100%; padding: .45rem; font-size: 12px; }
.assess-sheet__actions small { min-height: 2.4em; font-weight: 700; }
.assess-sheet__insert-row td { padding: .25rem .5rem; background: #f7faf9; }
.assess-sheet__insert-row button { padding: .25rem .45rem; font-size: 12px; }
.assess-sheet__category-header td { padding: .5rem .65rem; background: var(--assess-green-soft); }
.assess-sheet__category-header td { position: sticky; left: 0; }
.assess-sheet__category-header strong { margin-right: 1rem; font-size: 15px; }
.assess-sheet__category-header button { margin-right: .45rem; padding: .3rem .55rem; font-size: 12px; }
.assess-sheet__category-header { transition: background-color .5s ease; }
.assess-sheet__category-header.is-changed td { background: #fff0b8; }
.assess-sheet__question { transition: background-color .5s ease; }
.assess-sheet__question.is-changed { background: #fff0b8; }
.assess-sheet__dialog-form { display: grid; min-width: min(520px, calc(100vw - 48px)); gap: .8rem; }
.assess-sheet__dialog-form label { display: flex; flex-direction: column; gap: .3rem; font-weight: 700; }
.assess-sheet__dialog-form input, .assess-sheet__dialog-form select, .assess-sheet__dialog-form textarea { width: 100%; padding: .55rem; border: 1px solid #9db5ad; }
.assess-sheet__category-select { width: 100%; }

dialog { color: var(--assess-ink); background: var(--assess-white); border: 1px solid var(--assess-line); box-shadow: var(--assess-shadow); }
dialog::backdrop { background: rgba(17,47,57,.45); }

@media (max-width: 760px) {
    .assessment-app, .assess-admin { width: calc(100% - 16px); }
    .assessment-app__header, .assessment-app-sheet-header, .assess-admin__portal-header { display: block; }
    .assessment-app-filters { grid-template-columns: 1fr 1fr; }
    .assess-admin__form { grid-template-columns: 1fr; }
    .assess-admin__filters { grid-template-columns: 1fr; }
    .assess-admin__wide { grid-column: auto; }
    .assess-admin__tree-question { display: block; }
}
