@import url('/tools/css/common.css');

/* ========== HTML格式化工具 - 移动端优化 ========== */
@media (max-width: 768px) {
    /* 减小textarea高度，避免按钮被挤出视口 */
    .tool-card textarea#html-code {
        min-height: 120px;
        max-height: 30vh;
    }
    
    /* 按钮组全宽显示，确保可见可点击 */
    .tool-card .btn-group {
        flex-direction: column;
        align-items: stretch;
        gap: 10px;
    }
    
    .tool-card .btn-group .btn {
        width: 100%;
        padding: 14px 20px;
        font-size: 1rem;
    }
    
    /* 设置面板优化 */
    .settings-panel {
        padding: 15px;
    }
    
    .settings-row {
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
    }
    
    .settings-row .check-label {
        width: 100%;
        padding: 8px 0;
    }
    
    /* 工具头部优化 */
    .tool-header {
        margin-bottom: 20px;
    }
    
    .tool-header h1 {
        font-size: 1.4rem;
    }
    
    .tool-header .icon {
        width: 40px;
        height: 40px;
        font-size: 20px;
    }
}