/* Инфопанель: блок «Требует решения». Только классы td-attention-*. */
.td-attention { border: 1px solid var(--gray-200); background: #fff; border-radius: .75rem; padding: .85rem 1rem; }
.dark .td-attention { background: rgb(255 255 255 / .04); border-color: rgb(255 255 255 / .1); }
.td-attention-ok { display: flex; align-items: center; gap: .5rem; border-color: var(--primary-300); background: rgb(81 175 47 / .1); color: var(--td-link); font-weight: 500; }
.td-attention-ok-icon { width: 1.4rem; height: 1.4rem; flex: none; }
.td-attention-list { display: flex; flex-direction: column; gap: .4rem; }
.td-attention-row { display: flex; align-items: center; gap: .65rem; padding: .55rem .75rem; border-radius: .6rem; border: 1px solid transparent; color: inherit; text-decoration: none; min-height: 44px; }
/* Строки - белые с цветной полоской слева: красный и жёлтый остаются сигналом, но не заливают весь блок. */
.td-attention-row { border-color: var(--gray-200); }
.td-attention-row.tone-danger { box-shadow: inset 4px 0 0 var(--danger-500); }
.td-attention-row.tone-warning { box-shadow: inset 4px 0 0 var(--warning-500); }
.td-attention-row.is-link:hover { background: var(--primary-50); }
.td-attention-icon { width: 1.4rem; height: 1.4rem; flex: none; }
.tone-danger .td-attention-icon, .tone-danger .td-attention-count { color: var(--danger-600); }
.tone-warning .td-attention-icon, .tone-warning .td-attention-count { color: var(--warning-600); }
.td-attention-count { font-size: 1.2rem; font-weight: 700; min-width: 1.6rem; text-align: center; flex: none; }
.td-attention-body { display: flex; flex-direction: column; min-width: 0; flex: 1 1 auto; }
.td-attention-text { font-weight: 500; overflow-wrap: anywhere; }
.td-attention-examples { font-size: .85rem; color: var(--gray-600); overflow-wrap: anywhere; }
.td-attention-go { color: var(--td-link); font-weight: 600; flex: none; }
.td-attention-more { margin-top: .6rem; min-height: 40px; background: none; border: 0; color: var(--td-link); font-weight: 500; cursor: pointer; padding: 0 .25rem; }
.td-attention-more:hover { text-decoration: underline; }
[x-cloak] { display: none !important; }
@media (max-width: 640px) {
    .td-attention { padding: .7rem .75rem; }
    .td-attention-row { padding: .55rem .6rem; gap: .5rem; }
}