/* Dropfiles 2 — frontend */
.df2 { --df2-block-bg: #b0c4de; --df2-text: #444; --df2-hover: #0b5ed7; --df2-muted: #5a6878;
  --df2-btn-bg: #1b5693; --df2-btn-color: #fff; margin: 20px 0; }

/* Solid block: all files of a category in one panel (same look as the site's document lists) */
.df2-block { background: var(--df2-block-bg); border-radius: 10px; padding: 15px 25px; }
.df2-item { display: flex; align-items: flex-start; gap: 10px; padding: 8px 0; }
.df2-item .df2-icon { margin-top: 0; }
.df2-item__body { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.df2-item .df2-title { color: var(--df2-text) !important; font-family: 'Roboto', sans-serif; font-size: 15px; font-weight: 500;
  line-height: 1.4; text-decoration: none !important; overflow-wrap: anywhere; }
.df2-item .df2-title:hover, .df2-item .df2-title:focus-visible { color: var(--df2-hover) !important; text-decoration: underline !important; }
.df2-desc { font-size: .85rem; color: var(--df2-muted); }
.df2-meta { display: flex; flex-wrap: wrap; gap: 2px 10px; font-size: .8rem; color: var(--df2-muted); }

/* File type badge drawn as a small sheet (PDF matches the site's red sheet icon) */
.df2-icon { position: relative; flex: none; display: inline-flex; align-items: flex-end; justify-content: center;
  width: 18px; height: 24px; padding-bottom: 3px; border-radius: 2px 6px 2px 2px;
  font: 700 6px/1 Arial, sans-serif; color: #fff; letter-spacing: -.2px; background: #7d8796; vertical-align: middle; }
.df2-icon::after { content: ""; position: absolute; top: 0; right: 0; border-style: solid; border-width: 0 6px 6px 0;
  border-color: transparent #ffcdd2 transparent transparent; }
.df2-icon--pdf { background: #ea4335; }
.df2-icon--doc { background: #2f6fd1; } .df2-icon--doc::after { border-right-color: #c9dbf7; }
.df2-icon--xls { background: #1e8a4c; } .df2-icon--xls::after { border-right-color: #bfe5cf; }
.df2-icon--ppt { background: #e07a1f; } .df2-icon--ppt::after { border-right-color: #f8d9bd; }
.df2-icon--zip { background: #8a6d3b; } .df2-icon--zip::after { border-right-color: #e3d6bf; }
.df2-icon--img { background: #8a4fc7; } .df2-icon--img::after { border-right-color: #ddc8f2; }
.df2-icon--media { background: #c2185b; } .df2-icon--media::after { border-right-color: #f5c1d5; }
.df2-icon--other::after { border-right-color: #d5dae0; }
.df2-icon--link { align-items: center; padding-bottom: 0; border-radius: 50%; width: 20px; height: 20px; background: #1b5693; }
.df2-icon--link::after { display: none; }

.df2-cat-title { margin: 1.2rem 0 .6rem; font-size: 1.1rem; }
.df2-block > .df2-cat-title { margin: 6px 0 8px; font-size: 1.15rem; font-weight: 400; color: var(--df2-text); }
.df2-cat-desc { margin-bottom: .8rem; color: var(--df2-muted); }
.df2-sub { margin-top: 12px; }

/* Collapsed subcategories (option «Подкатегории свёрнутыми»): a folder row, files appear under it on click */
.df2-fold { margin-top: 8px; }
.df2-fold__title { display: flex; align-items: center; gap: 10px; padding: 10px 25px; border-radius: 10px; cursor: pointer;
  list-style: none; background: var(--df2-block-bg); color: var(--df2-text); font: 500 15px/1.4 'Roboto', sans-serif; }
.df2-fold__title::-webkit-details-marker { display: none; }
.df2-fold__title::before { content: ""; order: -2; flex: none; width: 0; height: 0; border-style: solid; border-width: 5px 0 5px 7px;
  border-color: transparent transparent transparent currentColor; transition: transform .2s ease; }
.df2-fold__title::after { content: ""; order: -1; flex: none; width: 20px; height: 15px; border-radius: 2px 3px 3px 3px;
  background: linear-gradient(#e8b04a, #e8b04a) 0 0 / 9px 3px no-repeat, #f2c35b; }
.df2-fold__title:hover, .df2-fold__title:focus-visible { color: var(--df2-hover); }
.df2-fold[open] > .df2-fold__title { border-radius: 10px 10px 0 0; }
.df2-fold[open] > .df2-fold__title::before { transform: rotate(90deg); }
.df2-fold__body > .df2-block { border-radius: 0 0 10px 10px; padding-top: 0; }
.df2-fold__body > .df2-block .df2-item { padding-left: 30px; }

.df2-list { list-style: none; margin: 0; padding: 0; }
.df2-list li { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 10px; padding: 7px 0; border-bottom: 1px solid #e3e7ee; }
.df2-list a { color: #1b5693; }

.df2-table { width: 100%; border-collapse: collapse; }
.df2-table td { padding: 10px 8px; border-bottom: 1px solid #e3e7ee; vertical-align: middle; }
.df2-table tr:nth-child(odd) td { background: #f2f4f8; }
.df2-table .df2-title { color: #1b5693; }
.df2-table__icon { width: 34px; }
.df2-table__btn { width: 1%; white-space: nowrap; }
.df2-btn { display: inline-block; padding: 6px 14px; border-radius: 6px; background: var(--df2-btn-bg);
  color: var(--df2-btn-color) !important; text-decoration: none !important; font-size: .85rem; }
.df2-btn:hover { filter: brightness(1.1); }
/* «Таблица» без названия файла (как старый Dropfiles table): серая шапка, описание обычным текстом, «Открыть» ссылкой */
.df2-table--desc th { padding: 10px 8px; background: #e6e6e6; border-bottom: 1px solid #d5d5d5; color: #333; font-weight: 700; text-align: left; }
.df2-table--desc th.df2-table__btn { text-align: center; }
.df2-table--desc tr:nth-child(odd) td { background: none; }
.df2-table--desc .df2-title { color: inherit; }
.df2-table--desc .df2-title:hover { color: #1b5693; }
.df2-table--desc .df2-btn { padding: 0; background: none; color: #1b5693 !important; font-weight: 700; }

/* Fallback for the PDF viewer if custom.css styles are missing (custom.css uses !important and wins) */
.df2-pdf-modal { position: fixed; inset: 0; z-index: 999999; display: flex; flex-direction: column; align-items: center; justify-content: center;
  background: rgba(0, 0, 0, .85); opacity: 0; transition: opacity .3s ease; }
.df2-pdf-modal.pdf-visible { opacity: 1; }
.df2-pdf-modal iframe { width: 85%; max-width: 1200px; height: 94vh; border: 0; border-radius: 8px; background: #e5e5e5; }
.df2-pdf-modal .pdf-modal-actionbar { position: absolute; right: 40px; bottom: 30px; display: flex; gap: 15px; }
.df2-pdf-modal .pdf-modal-btn { display: flex; align-items: center; justify-content: center; padding: 10px 20px; border: 1px solid rgba(255,255,255,.3);
  border-radius: 6px; background: rgba(255,255,255,.15); color: #fff; text-decoration: none; cursor: pointer; font-size: 14px; }
.df2-pdf-modal .pdf-modal-btn-close-top { position: absolute; top: 30px; right: 40px; width: 42px; height: 42px; padding: 0; border-radius: 50%; font-size: 20px; }

@media (max-width: 575px) {
  .df2-block { padding: 10px 16px; }
  .df2-table__btn { display: none; }
  .df2-pdf-modal iframe { width: 100%; height: 80vh; border-radius: 0; }
  .df2-pdf-modal .pdf-modal-actionbar { right: 50%; transform: translateX(50%); bottom: 16px; }
  .df2-pdf-modal .pdf-modal-btn-close-top { top: 12px; right: 12px; }
}