/* =========================
 Glorymist - 商品详情页细节优化
 仅针对商品详情页 (buy.blade.php)
 ========================= */

/* 全局字体 */
html body {
    font-family: Inter, "PingFang SC", "Microsoft YaHei", sans-serif !important;
    background: #f7f8fc !important;
}

/* 1. 标题优化 - 桌面端 36px */
.good-card .card .card-body h3.card-title {
    font-size: 36px !important;
    font-weight: 700 !important;
    color: #2f3441 !important;
    letter-spacing: -0.5px !important;
    line-height: 1.2 !important;
    margin-bottom: 20px !important;
}

/* 2. 表单标签优化 - 统一清晰 */
.buy-form label.col-form-label,
.buy-form .form-label,
.buy-form fieldset label {
    font-size: 16px !important;
    font-weight: 700 !important;
    color: #3a4050 !important;
    margin-bottom: 10px !important;
}

/* 3. 价格区优化 - 40px 紫色高亮 */
.buy-form .form-group.row .col-12 h6 {
    font-size: 40px !important;
    font-weight: 800 !important;
    color: #6c63ff !important;
    margin-bottom: 24px !important;
    line-height: 1.1 !important;
}

/* 库存信息 */
.card-body h6 small.text-muted {
    font-size: 15px !important;
    color: #7d8597 !important;
    font-weight: 500 !important;
}

/* 4. 加减按钮优化 - 缩小尺寸 */
.buy-form .input-group button,
.buy-form .num-box button {
    width: 48px !important;
    height: 48px !important;
    border-radius: 14px !important;
    background: #f4f6ff !important;
    color: #6c63ff !important;
    font-size: 20px !important;
    font-weight: 700 !important;
    border: 1px solid #e8ebf7 !important;
    box-shadow: 0 2px 8px rgba(108, 99, 255, 0.08) !important;
    transition: 0.25s !important;
}

.buy-form .input-group button:hover,
.buy-form .num-box button:hover {
    background: #e9edff !important;
    box-shadow: 0 4px 12px rgba(108, 99, 255, 0.12) !important;
}

/* 5. 输入框优化 - 浅边框 + 紫色 glow */
.buy-form input.form-control.form-control-sm,
.buy-form input.form-control,
.buy-form select.form-control {
    border: 1px solid #e8ebf7 !important;
    border-radius: 14px !important;
    height: 50px !important;
    padding: 0 16px !important;
    background: #fff !important;
    color: #2f3441 !important;
    font-size: 15px !important;
    transition: all 0.25s ease !important;
}

.buy-form input.form-control.form-control-sm:focus,
.buy-form input.form-control:focus,
.buy-form select.form-control:focus {
    border-color: #8b7cff !important;
    box-shadow: 0 0 0 4px rgba(107, 124, 255, 0.12) !important;
    outline: none !important;
}

/* 6. 支付方式优化 - 紧凑胶囊 */
.buy-form .form-check.form-check-inline {
    margin-right: 10px !important;
    margin-bottom: 10px !important;
}

.buy-form .form-check.form-check-inline label.form-check-label {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    border: 1px solid #e8ebf7 !important;
    border-radius: 999px !important;
    padding: 8px 14px !important;
    background: #fff !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    color: #4a5160 !important;
    transition: 0.25s !important;
    cursor: pointer !important;
}

.buy-form .form-check.form-check-inline label.form-check-label:hover {
    border-color: #8b7cff !important;
    background: #f8f7ff !important;
    color: #5b52e8 !important;
}

.buy-form .form-check-input:checked + .form-check-label {
    border-color: #6c63ff !important;
    background: #f8f7ff !important;
    color: #6c63ff !important;
}

/* 7. 下单按钮优化 - 固定宽度 + 居中 */
.buy-form button[type="submit"].btn.btn-outline-primary,
.buy-form button[type="submit"].btn {
    width: 140px !important;
    height: 50px !important;
    background: linear-gradient(135deg, #6b7cff, #9b6bff, #f36aa0) !important;
    color: white !important;
    border: none !important;
    border-radius: 14px !important;
    font-size: 17px !important;
    font-weight: 700 !important;
    box-shadow: 0 12px 24px rgba(108, 99, 255, 0.24) !important;
    transition: all 0.28s ease !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin-top: 10px !important;
}

.buy-form button[type="submit"].btn.btn-outline-primary:hover,
.buy-form button[type="submit"].btn:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 18px 30px rgba(108, 99, 255, 0.28) !important;
    opacity: 0.95 !important;
}

/* 8. 商品描述区优化 - 同风格卡片 */
.goods-description,
.product-desc,
.desc-card,
.buyCont {
    margin-top: 30px !important;
    background: rgba(255, 255, 255, 0.95) !important;
    border: 1px solid rgba(107, 124, 255, 0.08) !important;
    border-radius: 22px !important;
    box-shadow: 0 14px 40px rgba(76, 81, 191, 0.06) !important;
    overflow: hidden !important;
    padding: 0 !important;
}

/* 商品描述标题栏 */
.goods-description h4,
.product-desc h4,
.desc-title {
    padding: 18px 24px !important;
    font-size: 22px !important;
    font-weight: 700 !important;
    color: #2f3441 !important;
    background: linear-gradient(90deg, rgba(107, 124, 255, 0.08), rgba(243, 106, 160, 0.08)) !important;
    border-bottom: 1px solid #eceffd !important;
    margin: 0 !important;
}

/* 商品描述内容 */
.goods-description .content,
.product-desc .content,
.buyCont {
    padding: 24px !important;
    line-height: 1.8 !important;
    color: #4b5567 !important;
}

/* 描述图片 */
.goods-description img,
.product-desc img,
.buyCont img {
    max-width: 100% !important;
    border-radius: 16px !important;
    margin: 16px auto !important;
    display: block !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08) !important;
}

/* 9. 整体留白优化 - 卡片内边距 */
.good-card .card {
    background: rgba(255, 255, 255, 0.92) !important;
    border: 1px solid rgba(107, 124, 255, 0.10) !important;
    border-radius: 22px !important;
    box-shadow: 0 14px 40px rgba(76, 81, 191, 0.08) !important;
    position: relative !important;
    overflow: hidden !important;
}

.good-card .card::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 0 !important;
    width: 100% !important;
    height: 6px !important;
    background: linear-gradient(90deg, #6b7cff, #9b6bff, #f36aa0) !important;
    z-index: 10 !important;
}

.good-card .card .card-body {
    padding: 32px !important;
}

/* 商品图片区域 */
.good-card .card .card-img-top {
    padding: 24px !important;
}

/* 表单区间距 */
.buy-form .form-group.row {
    margin-bottom: 20px !important;
}

/* 顶部氛围 */
.main-container {
    position: relative !important;
    padding-bottom: 40px !important;
}

.main-container::before {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    height: 220px !important;
    background: linear-gradient(135deg, #6b7cff, #9b6bff, #f36aa0) !important;
    opacity: 0.06 !important;
    z-index: 0 !important;
    pointer-events: none !important;
}

.main-container > * {
    position: relative !important;
    z-index: 1 !important;
}

/* 10. 响应式 - 移动端标题 28px */
@media (max-width: 768px) {
    .good-card .card .card-body h3.card-title {
        font-size: 28px !important;
    }
    
    .buy-form .form-group.row .col-12 h6 {
        font-size: 32px !important;
    }
    
    .good-card .card .card-body {
        padding: 24px !important;
    }
    
    .buy-form button[type="submit"].btn {
        width: 100% !important;
    }
}

/* =========================
 首页顶部区域优化 - 基于真实结构
 ========================= */

/* 一、公告区域优化 - 覆盖内联样式 */
.notice {
    background: linear-gradient(135deg, rgba(107, 124, 255, 0.04), rgba(243, 106, 160, 0.04)) !important;
    padding: 18px 0 !important;
    margin-bottom: 0 !important;
}

.notice .card {
    border: 1px solid rgba(107, 124, 255, 0.10) !important;
    box-shadow: 0 2px 12px rgba(107, 124, 255, 0.06) !important;
    border-radius: 16px !important;
    background: rgba(255, 255, 255, 0.95) !important;
}

.notice .card-body {
    background: linear-gradient(135deg, rgba(107, 124, 255, 0.05), rgba(243, 106, 160, 0.05)) !important;
    border-radius: 16px !important;
    padding: 20px 26px !important;
}

.notice .jumbotron {
    padding: 0 !important;
    margin: 0 !important;
    background: transparent !important;
}

.notice h4 {
    font-size: 20px !important;
    font-weight: 700 !important;
    color: #2f3441 !important;
    margin-bottom: 6px !important;
}

.notice h4 .ali-icon {
    font-size: 20px !important;
    color: #6b7cff !important;
}

.notice p.lead {
    font-size: 14px !important;
    color: #5a6270 !important;
    line-height: 1.6 !important;
    margin: 0 !important;
}

/* 二、Logo 区域优化 */
.logo {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.logo img {
    height: 70px !important;
    width: auto !important;
    object-fit: contain !important;
    vertical-align: middle !important;
}

/* 三、导航菜单优化 */
.navbar-nav {
    align-items: center !important;
}

.navbar-nav .nav-item {
    margin-right: 46px !important;
}

.navbar-nav .nav-item:last-child {
    margin-right: 0 !important;
}

.navbar-nav .nav-link {
    font-size: 17px !important;
    font-weight: 600 !important;
    color: #4b5563 !important;
    letter-spacing: 0.3px !important;
    padding: 8px 16px !important;
    transition: all 0.25s ease !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
}

.navbar-nav .nav-link:hover,
.navbar-nav .nav-link.active {
    color: #6b7cff !important;
}

.navbar-nav .nav-link .ali-icon {
    vertical-align: middle !important;
    line-height: 1 !important;
}

/* 四、搜索框优化 */
.header-right form.d-flex {
    gap: 8px !important;
}

.header-right .form-control.form-control-sm {
    height: 42px !important;
    border-radius: 12px !important;
    border: 1px solid #dbe3f0 !important;
    padding: 0 16px !important;
    font-size: 15px !important;
    transition: all 0.25s ease !important;
}

.header-right .form-control.form-control-sm:focus {
    border-color: #6b7cff !important;
    box-shadow: 0 0 0 3px rgba(107, 124, 255, 0.10) !important;
    outline: none !important;
}

.header-right #searchBtn {
    height: 42px !important;
    width: 42px !important;
    border-radius: 12px !important;
    background: linear-gradient(135deg, #6b7cff, #9b6bff) !important;
    border: none !important;
    color: white !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    transition: all 0.25s ease !important;
}

.header-right #searchBtn:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 16px rgba(107, 124, 255, 0.24) !important;
}

/* 顶部导航整体 */
.header.sticky-top {
    background: rgba(255, 255, 255, 0.98) !important;
    backdrop-filter: blur(12px) !important;
    box-shadow: 0 2px 12px rgba(31, 41, 55, 0.04) !important;
}

/* 响应式 - 移动端 */
@media (max-width: 768px) {
    .logo img {
        height: 56px !important;
    }
    
    .navbar-nav .nav-item {
        margin-right: 0 !important;
        margin-bottom: 8px !important;
    }
    
    .navbar-nav .nav-link {
        font-size: 16px !important;
        padding: 12px 16px !important;
    }
    
    .notice {
        padding: 14px 0 !important;
    }
    
    .notice .card-body {
        padding: 16px 20px !important;
    }
    
    .notice h4 {
        font-size: 18px !important;
    }
}

/* =========================
 首页 UI 第二轮精修
 ========================= */

/* 一、导航菜单升级 - 轻量边框按钮效果 */
.navbar-nav .nav-item {
    margin-right: 28px !important;
}

.navbar-nav .nav-item:last-child {
    margin-right: 0 !important;
}

.navbar-nav .nav-link {
    font-size: 16px !important;
    font-weight: 600 !important;
    color: #4b5563 !important;
    padding: 8px 18px !important;
    border-radius: 10px !important;
    border: 1px solid transparent !important;
    background: rgba(255, 255, 255, 0.55) !important;
    transition: all 0.25s ease !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
}

.navbar-nav .nav-link:hover {
    border: 1px solid rgba(107, 124, 255, 0.35) !important;
    background: rgba(107, 124, 255, 0.08) !important;
    color: #6b7cff !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 6px 14px rgba(107, 124, 255, 0.14) !important;
}

.navbar-nav .nav-link.active {
    border: 1px solid rgba(107, 124, 255, 0.45) !important;
    background: linear-gradient(135deg, #6b7cff, #9b6bff) !important;
    color: #ffffff !important;
    box-shadow: 0 8px 16px rgba(107, 124, 255, 0.18) !important;
}

/* 二、公告条高级版 - 毛玻璃效果 */
.notice {
    padding: 16px 0 !important;
    background: linear-gradient(135deg, rgba(107, 124, 255, 0.08), rgba(243, 106, 160, 0.08)) !important;
}

.notice .card {
    border: 1px solid rgba(255, 255, 255, 0.35) !important;
    border-radius: 18px !important;
    box-shadow: 0 8px 22px rgba(31, 41, 55, 0.06) !important;
    backdrop-filter: blur(8px) !important;
    overflow: hidden !important;
}

.notice .card-body {
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.72), rgba(255, 255, 255, 0.58)) !important;
    border-radius: 18px !important;
    padding: 18px 24px !important;
}

.notice h4 {
    font-size: 20px !important;
    font-weight: 700 !important;
    color: #2f3441 !important;
    margin: 0 !important;
}

.notice p.lead:empty {
    display: none !important;
}

/* 三、Hero 区优化 - 标题和按钮层次感 */
.hero-section h1.display-4 {
    font-weight: 700 !important;
    letter-spacing: -0.5px !important;
    color: #ffffff !important;
}

.hero-section p.lead {
    color: rgba(255, 255, 255, 0.82) !important;
}

.hero-section .btn-light {
    box-shadow: 0 10px 24px rgba(31, 41, 55, 0.14) !important;
    transition: all 0.25s ease !important;
}

.hero-section .btn-light:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 14px 30px rgba(31, 41, 55, 0.18) !important;
}

.hero-section .btn-outline-light {
    border-width: 1.5px !important;
    background: rgba(255, 255, 255, 0.04) !important;
    transition: all 0.25s ease !important;
}

.hero-section .btn-outline-light:hover {
    background: rgba(255, 255, 255, 0.12) !important;
    transform: translateY(-2px) !important;
}

/* 四、右侧数据卡片升级 - 玻璃卡片效果 */
.hero-stats .stat-card {
    background: rgba(255, 255, 255, 0.14) !important;
    border: 1px solid rgba(255, 255, 255, 0.18) !important;
    border-radius: 18px !important;
    backdrop-filter: blur(10px) !important;
    box-shadow: 0 10px 24px rgba(31, 41, 55, 0.08) !important;
    transition: all 0.25s ease !important;
    padding: 25px !important;
}

.hero-stats .stat-card:hover {
    transform: translateY(-4px) !important;
    box-shadow: 0 16px 30px rgba(31, 41, 55, 0.12) !important;
}

.hero-stats .stat-card h2 {
    font-weight: 800 !important;
    color: #ffffff !important;
    font-size: 36px !important;
}

.hero-stats .stat-card p {
    color: rgba(255, 255, 255, 0.85) !important;
    font-size: 15px !important;
}

/* 五、搜索框精修 - 统一风格 */
.header-right .form-control.form-control-sm {
    background: rgba(255, 255, 255, 0.82) !important;
    border: 1px solid rgba(107, 124, 255, 0.12) !important;
}

.header-right #searchBtn {
    background: linear-gradient(135deg, #6b7cff, #9b6bff) !important;
    box-shadow: 0 8px 18px rgba(107, 124, 255, 0.20) !important;
}

.header-right #searchBtn:hover {
    box-shadow: 0 10px 22px rgba(107, 124, 255, 0.28) !important;
}

/* 为什么选择我们 - 统一图标样式 */
.features-section .feature-icon i.ali-icon,
.feature-card .feature-icon i.ali-icon {
    font-size: 42px !important;
    margin-bottom: 16px !important;
    display: inline-block !important;
}

/* =========================
 首页公告区域文字样式优化
 ========================= */

/* 一、公告标题优化 */
.notice h4 {
    font-size: 22px !important;
    font-weight: 700 !important;
    color: #2f3441 !important;
    margin-bottom: 10px !important;
    margin-top: 0 !important;
}

/* 二、公告正文优化 */
.notice p.lead {
    font-size: 16px !important;
    font-weight: 500 !important;
    color: #434a57 !important;
    line-height: 1.7 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    text-align: left !important;
}

/* 三、公告整体排版优化 */
.notice .card-body {
    padding: 20px 28px !important;
}

.notice .jumbotron {
    padding: 0 !important;
    margin: 0 !important;
}

.notice .container {
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
}

/* =========================
 首页公告区域 - 标题和正文同行显示
 ========================= */

/* 公告容器：横向布局 */
.notice .jumbotron .container {
    display: flex !important;
    align-items: center !important;
    gap: 16px !important;
    flex-direction: row !important;
    justify-content: flex-start !important;
}

/* 公告标题：同行显示 */
.notice h4 {
    margin: 0 !important;
    font-size: 20px !important;
    font-weight: 700 !important;
    color: #2f3441 !important;
    flex-shrink: 0 !important;
}

/* 公告正文：同行显示 */
.notice p.lead {
    margin: 0 !important;
    font-size: 16px !important;
    font-weight: 500 !important;
    color: #4b5563 !important;
    line-height: 1.7 !important;
    text-align: left !important;
    flex: 1 !important;
}

/* 移动端：保持同行 */
@media (max-width: 768px) {
    .notice .jumbotron .container {
        flex-direction: row !important;
        gap: 12px !important;
    }
    
    .notice h4 {
        font-size: 18px !important;
    }
    
    .notice p.lead {
        font-size: 14px !important;
    }
}

/* =========================
 Logo 尺寸控制
 ========================= */

.logo img,
.navbar-brand img,
header .logo img {
    height: 52px !important;
    width: auto !important;
    object-fit: contain !important;
}