.container.divider {
    margin-top: 183px;
}
h1 {
    margin: 0px;
    margin-bottom: 64px;
    line-height: 60px;
}
.report-categories {
    display: flex;
    align-items: flex-start;
    gap: 10px;
}
.report-categories .report-category {
    font-size: 18px;
    font-weight: 400;
    line-height: 38px;
    padding: 10px 16px;
    background: none;
    border: none;
    color: var(--second-text-color);
    height: 48px;
    display: flex;
    align-items: center;
}
.report-categories .report-category.active {
    background: #F4EBE0;
    color: #14151C;
    border-radius: 10px;
}

.reports-wrapper {
    display: flex;
    flex-wrap: nowrap;
    align-items: flex-start;
    color: var(--second-text-color);
    margin-top: 64px;
    gap: 120px;
}
.reports-wrapper p {
    margin: 0;
}
.reports-wrapper .reports-categories {
    width: 292px;
    word-wrap: break-word;
    display: flex;
    flex-direction: column;
    gap: 48px;
}
.reports-wrapper .reports-content {
    width: 948px;
}

.reports-content h1 {
    font-family: 'Libre Franklin';
    font-size: 48px;
    font-weight: 600;
    margin-bottom: 80px;
}

.reports-category ul {
    list-style: none;
    padding: 0px;
    display: flex;
    flex-direction: column;
    gap: 16px;
}
.reports-category ul li {
    line-height: 30px;
    font-size: 16px;
    cursor: pointer;
}
.reports-category ul li.empty {
    opacity: .5;
}
.reports-category__name {
    font-size: 24px;
    line-height: 30px;
    font-weight: 600;
    margin-bottom: 16px!important;
    display: flex;
    justify-content: space-between;
    cursor: pointer;
}
.reports-category__name::after {
    content: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTQiIGhlaWdodD0iOCIgdmlld0JveD0iMCAwIDE0IDgiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CiAgPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik02LjI4OCA3LjE1Ny42MzEgMS41IDIuMDQ1LjA4Nmw0Ljk1IDQuOTUgNC45NS00Ljk1TDEzLjM2IDEuNSA3LjcwMiA3LjE1N2ExIDEgMCAwIDEtMS40MTQgMCIgZmlsbD0iI2ZmZiIvPgo8L3N2Zz4K");
    margin-top: -5px;
}

.reports-category.minimized .reports-category__name::after {
    transform: rotate(180deg);
}
.reports-category.minimized ul {
    display: none;
}

.reports-category.active .reports-category__name {
    color: #6E050F;
}

.reports-content__documents {
    display: flex;
    flex-direction: column;
    gap: 128px;
}
.reports-content__documents-document {
    position: relative;
}
.reports-content__documents-document.hidden {
    display: none;
}
.reports-content__documents-document::after {
    content: "";
    width: 100%;
    height: 1px;
    position: absolute;
    background: #6E050F;
    bottom: -60px;
}
.reports-content__documents-document:last-child::after {
    display: none;
}
.reports-content__documents .reports-content__documents-title {
    line-height: 40px;
    color: var(--second-text-color);
    font-weight: 700;
    font-family: 'Playfair Display';
    font-size: 32px;
    margin: 0px;
    margin-bottom: 44px;
}

.reports-content__documents-files {
    display: flex;
    gap: 24px;
    flex-wrap: wrap;
}

.reports-content__documents-files .reports-content__documents-file {
    display: flex;
    align-items: center;
    gap: 17px;
    padding: 16px;
    background: #1E1E21;
    width: fit-content;
    border-radius: 16px;
    color: var(--second-text-color);
    text-decoration: none;
    min-width: 325px;
    position: relative;
    display: none;
}
.reports-content__documents-files .reports-content__documents-file.visible {
    display: flex;
}
.reports-content__documents-files .reports-content__documents-file p {
    font-size: 18px;
}
.reports-content__documents-files .reports-content__documents-file .reports-content__documents-file__extension {
    position: absolute;
    right: 20px;
    top: 0;
    background: #5A0D14;
    text-transform: uppercase;
    line-height: 24px;
    padding: 0px 10px;
    font-size: 14px;
    border-radius: 6px;
    top: -10px;
}

.right-btn.hidden {
    display: none;
}


/* acces */
body.accessibility-mode  .reports-content__documents-files .reports-content__documents-file {
 
    background: #a9a9a9;
 
}

body.accessibility-mode  .reports-content__documents-files .reports-content__documents-file .reports-content__documents-file__extension {
   
    background: #ffffff;
  
}
/*tablet*/
@media (max-width: 1200px) and (min-width: 769px) {

    .container.divider {
        margin-top: 140px;
    }

    h1 {
        font-size: 44px;
        line-height: 54px;
        margin-bottom: 48px;
    }

    .report-categories .report-category {
        font-size: 16px;
        line-height: 32px;
        padding: 8px 14px;
        height: 44px;
    }

    .reports-wrapper {
        display: flex;
        flex-wrap: nowrap;
        gap: 60px; 
        margin-top: 48px;
    }

    .reports-wrapper .reports-categories {
        width: 240px;
        gap: 32px;   
    }

    .reports-wrapper .reports-content {
        width: calc(100% - 300px); 
        min-width: 0; 
    }

    .reports-content h1 {
        font-size: 36px;
        margin-bottom: 60px;
    }

    .reports-category__name {
        font-size: 20px;
        line-height: 26px;
        margin-bottom: 12px!important;
    }

    .reports-category ul li {
        font-size: 15px;
        line-height: 26px;
    }

    .reports-content__documents {
        gap: 80px;
    }

    .reports-content__documents .reports-content__documents-title {
        font-size: 24px;
        line-height: 32px;
        margin-bottom: 32px;
    }

    .reports-content__documents-files {
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
        gap: 20px;
    }

    .reports-content__documents-files .reports-content__documents-file {
        display: flex;
        align-items: center;
        gap: 17px;
        padding: 14px;
        background: #1E1E21;
        border-radius: 16px;
        color: var(--second-text-color);
        text-decoration: none;
        width: 100%;     
        min-width: 0;    
        box-sizing: border-box; 
    }

    .reports-content__documents-files .reports-content__documents-file.visible {
        display: flex;
    }

    .reports-content__documents-files .reports-content__documents-file {
        min-width: auto;
        width: 100%;
        padding: 14px;
    }

    .reports-content__documents-files .reports-content__documents-file p {
        font-size: 16px;
    }
    body.accessibility-mode .report-categories {
  display: flex;
  flex-direction: column;    /* щоб кнопки йшли стовпчиком */
  gap: 16px;                 /* відстань між кнопками */
  max-width: 100%;           /* щоб не вилазило */
}

body.accessibility-mode .report-category {
  white-space: normal !important;  /* ✅ дозволяє перенос рядків */
  word-wrap: break-word;           /* ✅ переносить довгі слова */
  text-align: left;                /* щоб текст не прилипав по центру */
  padding: 8px 16px;               /* відступи всередині кнопки */
  box-sizing: border-box;          /* враховує padding у ширині */
  width: 100%;                     /* кнопка розтягується під контейнер */
}
body.accessibility-mode .report-categories .report-category.active {
    background: #ffffff;
    color: #14151C;
    border-radius: 10px;
}


}
@media (max-width: 1024px) and (min-width: 769px) {
    .reports-wrapper .reports-categories{
        display: none;
    }
    .reports-wrapper {
        flex-wrap: wrap
    }
    .reports-wrapper .reports-content {
        width: 100%;
    }

}
/*mobile*/
@media (max-width: 768px) {
    .container.divider {
        margin-top: 104px;
    }
    h1 {
        font-size: 40px;
        line-height: 60px;
        margin-bottom: 40px;
    }

    .report-categories {
        overflow: scroll;
    }
    .report-categories::-webkit-scrollbar {
        display: none;
    }
    .report-categories .report-category {
        white-space: nowrap;
        font-size: 14px;
    }
    .reports-wrapper .reports-categories {
        display: none;
    }

    .reports-wrapper {
        margin-top: 40px;
        display: flex;
        flex-direction: column;
        gap: 72px;
    }

    h1#reportName {
        font-size: 18px;
        line-height: 30px;
        font-family: 'Playfair Display';
        margin-bottom: 40px;
        text-transform: uppercase;
    }

    .reports-content {
        width: 100%!important;
    }

    .reports-content__documents .reports-content__documents-title {
        font-size: 18px;
        line-height: 30px;
        margin-bottom: 24px;
    }
    .reports-content__documents-files {
        gap: 28px;
        display: flex;
        flex-direction: column;
    }
    .reports-content__documents-files .reports-content__documents-file {
        height: 30px;
        padding: 16px;
    }
    .reports-content__documents-files .reports-content__documents-file p {
        font-size: 16px;
    }

    .reports-content .centered-btn {
        padding-top: 100px;
    }
}