/**
 * 响应式样式（媒体查询�?
 */

/* 响应式工具类 */

/* 显示/隐藏工具�?*/
.hide-xs { display: block !important; }
.hide-sm { display: block !important; }
.hide-md { display: block !important; }
.hide-lg { display: block !important; }

.show-xs { display: none !important; }
.show-sm { display: none !important; }
.show-md { display: none !important; }
.show-lg { display: none !important; }

/* 新增的响应式工具类：默认显示 */
.hide-category { display: block !important; }

/* 手机版隐藏电脑版搜索元素 */
.hide-mobile-search-module { display: flex !important; }
.hide-mobile-search-btn { display: flex !important; }

/* 响应式显示/隐藏工具类 */
/* 电脑版显示，手机版隐藏 */
.hide-mobile { 
    display: block !important; 
}
/* 按钮类型的 hide-mobile 元素应该使用 inline-flex */
.mdc-top-bar__button.hide-mobile,
.mdc-button.hide-mobile,
.mdc-icon-button.hide-mobile {
    display: inline-flex !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* 电脑版隐藏，手机版显示 */
.hide-desktop { display: none !important; }

/* 手机版（≤767px）隐藏电脑版元素（包括顶部栏登录/注册按钮、电脑版搜索分类和搜索按钮、分类按钮） */
@media (max-width: 767px) {
    /* 手机版隐藏电脑版元素 */
    .hide-mobile {
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
        pointer-events: none !important;
    }
    
    /* 手机版隐藏 hide-mobile 按钮内的图标（虽然父元素已隐藏，但为了逻辑一致性明确设置） */
    .mdc-top-bar__button.hide-mobile .material-symbols-outlined.mdc-top-bar__icon,
    .mdc-top-bar__button.hide-mobile span.material-symbols-outlined.mdc-top-bar__icon {
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
    }
    
    /* 手机版显示手机版元素 */
    .hide-desktop {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        pointer-events: auto !important;
    }
    
    /* 按钮类型的 hide-desktop 元素应该使用 inline-flex */
    .mdc-top-bar__button.hide-desktop,
    .mdc-button.hide-desktop,
    .mdc-icon-button.hide-desktop {
        display: inline-flex !important;
    }
    
    /* 页头登录和注册按钮在手机版隐藏（已移除，不再需要） */
    /* 手机版隐藏分类按钮（多种选择器确保隐藏） */
    .hide-category,
    .mdc-category-toggle.hide-category,
    .mdc-top-app-bar__section .hide-category,
    .mdc-top-app-bar__section--align-center .hide-category {
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
        pointer-events: none !important;
        width: 0 !important;
        height: 0 !important;
        padding: 0 !important;
        margin: 0 !important;
        overflow: hidden !important;
    }
    
    
    .hide-mobile-search-module {
        display: none !important;
    }
    
    /* 手机版隐藏搜索按钮（多种选择器确保隐藏） */
    .hide-mobile-search-btn,
    .mdc-search-submit-btn.hide-mobile-search-btn,
    .mdc-search-form .hide-mobile-search-btn,
    .mdc-search-form .mdc-search-submit-btn.hide-mobile-search-btn,
    #destoon-search .mdc-search-submit-btn.hide-mobile-search-btn,
    form#destoon-search .mdc-search-submit-btn.hide-mobile-search-btn {
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
        pointer-events: none !important;
        width: 0 !important;
        height: 0 !important;
        padding: 0 !important;
        margin: 0 !important;
        overflow: hidden !important;
        position: absolute !important;
        left: -9999px !important;
    }
}

/* 响应式工具类：浏览器宽度 ≤ 862px 隐藏，≥ 863px 显示（hide-xs 类，用于其他元素） */
@media (max-width: 862px) {
    .hide-xs {
        display: none !important;
    }
    
    .show-xs {
        display: block !important;
    }
}

@media (min-width: 863px) {
    .hide-xs {
        display: block !important;
    }
}

/* 小屏幕（手机横屏、小平板�?76px - 767px�?*/
@media (min-width: 576px) and (max-width: 767px) {
    .hide-sm {
        display: none !important;
    }
    
    .show-sm {
        display: block !important;
    }
}

/* 中等屏幕及以上（平板、桌面，�?68px�? 隐藏移动端元�?*/
@media (min-width: 768px) {
    .hide-sm {
        display: none !important;
    }
}

/* 中等屏幕（平板，768px - 991px�?*/
@media (min-width: 768px) and (max-width: 991px) {
    .hide-md {
        display: none !important;
    }
    
    .show-md {
        display: block !important;
    }
}

/* 大屏幕（桌面�?92px+�?*/
@media (min-width: 992px) {
    .hide-lg {
        display: none !important;
    }
    
    .show-lg {
        display: block !important;
    }
}

/* 文本对齐 */
.text-left { text-align: left; }
.text-center { text-align: center; }
.text-right { text-align: right; }

@media (max-width: 575px) {
    .text-xs-center {
        text-align: center;
    }
}

/* 响应式字体大�?*/
@media (max-width: 575px) {
    html {
        font-size: 14px;
    }
}

@media (min-width: 576px) and (max-width: 767px) {
    html {
        font-size: 15px;
    }
}

@media (min-width: 768px) {
    html {
        font-size: 16px;
    }
}

/* 电脑版（≥768px）显示/隐藏控制 */
@media (min-width: 768px) {
    /* 电脑版显示电脑版元素 */
    .hide-mobile {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        pointer-events: auto !important;
    }
    
    /* 顶部栏按钮在电脑版显示 */
    .mdc-top-bar__button.hide-mobile {
        display: inline-flex !important;
        visibility: visible !important;
        opacity: 1 !important;
    }
    
    
    /* 电脑版隐藏手机版元素 */
    .hide-desktop {
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
        pointer-events: none !important;
    }
    
    /* 页头按钮在电脑版隐藏 */
    .mdc-button.hide-desktop {
        display: none !important;
    }
    
    /* 页头导航按钮（三杠菜单）在电脑版隐藏 */
    .mdc-icon-button.hide-desktop,
    .mdc-top-app-bar__navigation-icon.hide-desktop {
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
        pointer-events: none !important;
    }
}