/*
 * 可访问性增强样式
 * BossV Team - 2026-01-27
 *
 * WCAG 2.1 AA 标准支持:
 * - 跳转链接
 * - 键盘焦点可见性
 * - 减少动画
 * - 高对比度模式
 */

/* ========== 跳转到主内容链接 ========== */
.skip-link {
    position: absolute;
    top: -100%;
    left: 50%;
    transform: translateX(-50%);
    background: var(--primary-color, #ff6b35);
    color: #fff;
    padding: 12px 24px;
    border-radius: 0 0 8px 8px;
    font-weight: 600;
    text-decoration: none;
    z-index: 10000;
    transition: top 0.3s ease;
}

.skip-link:focus {
    top: 0;
    outline: 3px solid #fff;
    outline-offset: 2px;
}

/* ========== 视觉隐藏但屏幕阅读器可读 ========== */
.visually-hidden,
.sr-only {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

/* 仅在获得焦点时显示（用于跳转链接等） */
.visually-hidden-focusable:not(:focus):not(:focus-within) {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

/* ========== 键盘焦点样式（仅键盘导航时显示） ========== */
:focus-visible {
    outline: 3px solid var(--primary-color, #ff6b35);
    outline-offset: 3px;
}

/* 鼠标点击时不显示焦点环 */
:focus:not(:focus-visible) {
    outline: none;
}

/* 按钮焦点增强 */
button:focus-visible,
.btn:focus-visible,
[role="button"]:focus-visible {
    outline: 3px solid var(--primary-color, #ff6b35);
    outline-offset: 3px;
    box-shadow: 0 0 0 6px rgba(255, 107, 53, 0.25);
}

/* 链接焦点增强 */
a:focus-visible {
    outline: 3px solid var(--primary-color, #ff6b35);
    outline-offset: 2px;
    border-radius: 4px;
}

/* 表单元素焦点增强 */
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
    outline: 3px solid var(--primary-color, #ff6b35);
    outline-offset: 0;
    border-color: var(--primary-color, #ff6b35);
}

/* ========== 减少动画支持 ========== */
@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }

    /* 轮播图禁用自动播放 */
    .hero-carousel,
    .carousel,
    .slider {
        animation: none !important;
    }
}

/* ========== 高对比度模式增强 ========== */
@media (prefers-contrast: high) {
    /* 增强边框可见性 */
    .movie-card,
    .card,
    article {
        border: 2px solid currentColor;
    }

    /* 增强按钮可见性 */
    button,
    .btn,
    [role="button"] {
        border: 2px solid currentColor;
    }

    /* 增强链接下划线 */
    a {
        text-decoration: underline;
        text-underline-offset: 3px;
    }

    /* 增强焦点可见性 */
    :focus-visible {
        outline: 3px solid currentColor;
        outline-offset: 4px;
    }
}

/* ========== 强制颜色模式（Windows高对比度） ========== */
@media (forced-colors: active) {
    .movie-badge,
    .badge,
    .tag {
        border: 1px solid currentColor;
    }

    button,
    .btn {
        border: 2px solid currentColor;
    }

    /* 确保图标可见 */
    svg {
        fill: currentColor;
    }
}

/* ========== 大字体模式支持 ========== */
@media (min-resolution: 1dppx) {
    html {
        font-size: clamp(14px, 1vw + 10px, 18px);
    }
}

/* ========== 触摸目标尺寸（移动可访问性） ========== */
@media (pointer: coarse) {
    /* 确保按钮足够大 (44x44px minimum) */
    button,
    .btn,
    [role="button"],
    a[class*="btn"] {
        min-height: 44px;
        min-width: 44px;
        padding: 12px 16px;
    }

    /* 导航链接增大点击区域 */
    .nav-menu a,
    .nav-link {
        padding: 12px 16px;
    }

    /* 列表项增大 */
    .hot-item,
    .list-item {
        min-height: 48px;
        padding: 12px;
    }
}

/* ========== 暗色主题下的焦点可见性增强 ========== */
@media (prefers-color-scheme: dark) {
    :focus-visible {
        outline-color: #ff8f5f; /* 更亮的橙色 */
    }
}

/* ========== 打印时的可访问性 ========== */
@media print {
    /* 显示链接URL */
    a[href^="http"]::after {
        content: " (" attr(href) ")";
        font-size: 0.8em;
        color: #666;
    }

    /* 隐藏纯装饰性元素 */
    [aria-hidden="true"],
    .decorative {
        display: none !important;
    }
}
