/* 可用性增强样式 */
/* 增强移动端触摸体验和错误处理 */

/* 确保所有按钮符合最小触摸尺寸 */
button, .button, .nav-button, .skill-button {
    min-width: 48px !important;
    min-height: 48px !important;
    touch-action: manipulation !important;
}

/* 增强触摸反馈 */
button:active, .button:active, .nav-button:active {
    transform: scale(0.95) !important;
    transition: transform 0.1s ease !important;
}

/* 改善通知消息的可读性 */
.notification {
    max-width: 90vw;
    word-wrap: break-word;
    text-align: center;
    font-size: 12px !important;
    padding: 12px 16px !important;
}

/* 错误状态样式 */
.error-message {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: rgba(239, 68, 68, 0.95);
    border: 2px solid #EF4444;
    border-radius: 8px;
    padding: 20px;
    color: #FFFFFF;
    font-size: 14px;
    text-align: center;
    z-index: 2000;
    max-width: 80%;
}

/* 加载失败样式 */
.loading-error {
    background: rgba(239, 68, 68, 0.9);
    color: #FFFFFF;
    padding: 15px;
    border-radius: 8px;
    text-align: center;
}

/* 场景加载状态 */
.scene-loading {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: #FFD700;
    font-size: 16px;
    text-align: center;
}

/* 增强技能面板在移动端的可用性 */
.skill-panel {
    max-height: 200px !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
}

/* 改善商店和背包列表的可滚动性 */
.shop-items, .inventory-items {
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
    scrollbar-width: thin !important;
}

.shop-items::-webkit-scrollbar,
.inventory-items::-webkit-scrollbar {
    width: 4px !important;
}

.shop-items::-webkit-scrollbar-thumb,
.inventory-items::-webkit-scrollbar-thumb {
    background: #FFD700 !important;
    border-radius: 2px !important;
}

/* 增强对话框的触摸响应 */
.dialog, .panel {
    touch-action: auto !important;
    user-select: text !important;
    -webkit-user-select: text !important;
}

/* 防止双击缩放 */
* {
    touch-action: pan-x pan-y !important;
}

button, a, input, textarea {
    touch-action: manipulation !important;
}

/* 改善高对比度模式下的可见性 */
@media (prefers-contrast: high) {
    .notification, .dialog, .panel {
        border-width: 3px !important;
    }

    button, .button {
        border-width: 2px !important;
    }
}

/* 改善减少动画模式下的体验 */
@media (prefers-reduced-motion: reduce) {
    * {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}

/* 横屏模式优化 */
@media (orientation: landscape) and (max-height: 500px) {
    .navbar {
        height: 50px !important;
    }

    .nav-button {
        height: 40px !important;
    }

    .skill-panel {
        height: 120px !important;
    }
}

/* 超小屏幕优化 */
@media (max-width: 320px) {
    .notification {
        font-size: 10px !important;
        padding: 8px 12px !important;
    }

    button, .button {
        min-width: 40px !important;
        min-height: 40px !important;
        font-size: 11px !important;
    }
}