/* accessibility.css - Стили для панели доступности и ее функций v9 (Final Design) */

:root {
    --acc-panel-bg: #f8f9fa;
    --acc-text: #212529;
    --acc-border: #dee2e6;
    --acc-btn-bg: #fff;
    --acc-btn-hover: #f1f3f5;
    --acc-active: #0d6efd;
    --acc-active-text: #fff;
    --acc-shadow: 0 4px 12px rgba(0,0,0,0.08);
}

/* --- Логика отображения панели и отступа (стабильная) --- */
body {
    transition: padding-top 0.3s ease;
}
.accessibility-panel {
    position: fixed; top: 0; left: 0;
    width: 100%; z-index: 9999;
    background: var(--acc-panel-bg);
    border-bottom: 1px solid var(--acc-border);
    box-shadow: var(--acc-shadow);
    padding: 1rem 0;
    transform: translateY(-110%);
    transition: transform 0.3s ease;
}
.accessibility-panel.is-open {
    transform: translateY(0);
}

/* --- Основной дизайн панели --- */
.accessibility-panel__container { max-width: 1200px; margin: 0 auto; padding: 0 1.5rem; }
.accessibility-panel__header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1.25rem; }
.accessibility-panel__title { font-size: 1.1rem; font-weight: 600; color: var(--acc-text); margin: 0; }
.accessibility-panel__close { font-size: 0.875rem; background: transparent; border: 1px solid transparent; color: #6c757d; padding: 0.4rem 0.8rem; border-radius: 0.375rem; cursor: pointer; }
.accessibility-panel__close:hover { background: var(--acc-btn-hover); border-color: #dee2e6; }

/* --- Flexbox-сетка для групп --- */
.accessibility-panel__content { display: flex; flex-wrap: wrap; gap: 1rem 1.5rem; }
.accessibility-panel__group { border: none; padding: 0; margin: 0; flex: 1 1 200px; min-width: 200px; }
.accessibility-panel__legend { font-weight: 500; font-size: 0.875rem; color: var(--acc-text); margin-bottom: 0.65rem; }

/* --- Унифицированный дизайн кнопок --- */
.accessibility-panel__buttons { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.accessibility-panel__group button {
    font-size: 0.85rem;
    padding: 0.45rem 0.85rem;
    height: 36px;
    background: var(--acc-btn-bg);
    border: 1px solid #ced4da;
    border-radius: 0.375rem;
    cursor: pointer;
    transition: all 0.2s;
}
.accessibility-panel__group button:hover { background: var(--acc-btn-hover); border-color: #adb5bd; }
.accessibility-panel__group button.acc-active-button { background: var(--acc-active); color: var(--acc-active-text); border-color: var(--acc-active); }
.accessibility-panel__reset-btn { background: #f8f9fa; border-color: #dee2e6; color: #dc3545; font-weight: 500; }
.accessibility-panel__reset-btn:hover { background: #f1f3f5; }


/* --- Стили для изменения контента сайта (без изменений в логике) --- */
html[data-acc-fontsize="1"]{font-size:130%}html[data-acc-fontsize="2"]{font-size:180%}body[data-acc-font-family=serif],body[data-acc-font-family=serif] *{font-family:"Georgia","Times New Roman",Times,serif!important}body[data-acc-images=grayscale] img,body[data-acc-images=grayscale] video{filter:grayscale(100%)!important}body[data-acc-images=hidden] img,body[data-acc-images=hidden] video{display:none!important}body[data-acc-spacing=large] p,body[data-acc-spacing=large] li{text-align:left!important;max-width:80ch;line-height:1.8!important;letter-spacing:.12em!important;word-spacing:.16em!important}body[data-acc-spacing=large] p{margin-bottom:2.7em!important}body[data-acc-theme=wb],body[data-acc-theme=wb] *{background:#000!important;color:#fff!important;border-color:#fff!important;fill:#fff!important}body[data-acc-theme=wb] a{color:#ff0!important}body[data-acc-theme=bw],body[data-acc-theme=bw] *{background:#fff!important;color:#000!important;border-color:#000!important;fill:#000!important}body[data-acc-theme=bw] a{color:#00e!important}body[data-acc-theme=blue],body[data-acc-theme=blue] *{background:#e0f7fa!important;color:#002244!important;border-color:#002244!important;fill:#002244!important}body[data-acc-theme=blue] a{color:#0d47a1!important}body[data-acc-theme=beige],body[data-acc-theme=beige] *{background:#f5eedc!important;color:#5c3d2e!important;border-color:#5c3d2e!important;fill:#5c3d2e!important}body[data-acc-theme=beige] a{color:#933610!important}
