/* 淡紫色调自定义样式 - Hyper模板 */

/* 使用 Google Fonts 替代本地字体，提升加载速度 */
body, .wrapper, .content-page {
    font-family: 'Nunito', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
}

/* 全局背景 */
body {
    background-color: #f5f0fa !important;
    color: #2e1a3d;
}

/* 头部导航 */
.navbar {
    background-color: #ffffff !important;
    border-bottom: 1px solid #e0d0f0 !important;
}

.navbar-light .navbar-nav .nav-link {
    color: #4a3a5a !important;
}

.navbar-light .navbar-nav .nav-link:hover,
.navbar-light .navbar-nav .nav-link.active {
    color: #8a5cb8 !important;
}

/* 页面标题 */
.page-title {
    color: #8a5cb8 !important;
}

/* 卡片样式 */
.card {
    background-color: #ffffff !important;
    border: 1px solid #e0d0f0 !important;
    border-radius: 10px !important;
    box-shadow: 0 2px 8px rgba(100, 60, 150, 0.08) !important;
}

.card-header {
    background-color: #faf5ff !important;
    border-bottom: 1px solid #e0d0f0 !important;
    color: #8a5cb8 !important;
}

/* 按钮样式 */
.btn-primary {
    background-color: #b88ce8 !important;
    border-color: #b88ce8 !important;
    color: #fff !important;
}

.btn-primary:hover {
    background-color: #c8a0f0 !important;
    border-color: #c8a0f0 !important;
}

.btn-outline-primary {
    color: #8a5cb8 !important;
    border-color: #b88ce8 !important;
}

.btn-outline-primary:hover {
    background-color: #b88ce8 !important;
    border-color: #b88ce8 !important;
    color: #fff !important;
}

.btn-success {
    background-color: #b88ce8 !important;
    border-color: #b88ce8 !important;
}

.btn-success:hover {
    background-color: #c8a0f0 !important;
    border-color: #c8a0f0 !important;
}

.btn-danger {
    background-color: #9b6dc6 !important;
    border-color: #9b6dc6 !important;
    color: #fff !important;
}

.btn-danger:hover {
    background-color: #b88ce8 !important;
    border-color: #b88ce8 !important;
}

/* 徽章 */
.badge.bg-success {
    background-color: #b88ce8 !important;
}

.badge.bg-warning {
    background-color: #e8a4c4 !important;
    color: #2e1a3d !important;
}

.badge.bg-danger {
    background-color: #e88cb8 !important;
}

.badge.bg-primary {
    background-color: #b88ce8 !important;
}

/* 表单 */
.form-control {
    border: 1px solid #e0d0f0 !important;
    border-radius: 6px !important;
}

.form-control:focus {
    border-color: #b88ce8 !important;
    box-shadow: 0 0 0 0.2rem rgba(184, 140, 232, 0.25) !important;
}

.form-label {
    color: #4a3a5a !important;
    font-weight: 500;
}

.form-hint {
    font-size: 12px;
    color: #8a7a9a;
    margin-top: 4px;
    margin-bottom: 0;
}

/* 链接 */
a {
    color: #8a5cb8 !important;
}

a:hover {
    color: #b88ce8 !important;
}

/* 文本颜色 */
.text-muted {
    color: #8a7a9a !important;
}

.text-primary {
    color: #8a5cb8 !important;
}

/* 商品列表 */
.product-card {
    border: 1px solid #e0d0f0 !important;
    border-radius: 10px !important;
    overflow: hidden;
}

.product-card:hover {
    border-color: #b88ce8 !important;
    box-shadow: 0 4px 12px rgba(100, 60, 150, 0.12) !important;
}

.product-price {
    color: #8a5cb8 !important;
    font-weight: 700;
}

/* 分类导航 */
.nav-pills .nav-link {
    color: #8a5cb8 !important;
    border: 1px solid #e0d0f0 !important;
}

.nav-pills .nav-link.active {
    background-color: #b88ce8 !important;
    border-color: #b88ce8 !important;
    color: #fff !important;
}

/* 页脚 */
.footer {
    background-color: transparent !important;
    color: #8a7a9a !important;
    border-top: 1px solid #e0d0f0 !important;
}

/* 模态框 */
.modal-content {
    background-color: #ffffff !important;
    border: 1px solid #e0d0f0 !important;
    border-radius: 10px !important;
}

.modal-header {
    background-color: #faf5ff !important;
    border-bottom: 1px solid #e0d0f0 !important;
}

.modal-title {
    color: #8a5cb8 !important;
}

/* 购买页面特殊样式 */
.product-image {
    border-radius: 10px;
}

.quantity-input {
    border: 1px solid #e0d0f0 !important;
    border-radius: 6px !important;
}

.payment-method .form-check-input:checked {
    background-color: #b88ce8 !important;
    border-color: #b88ce8 !important;
}

/* 响应式调整 */
@media (max-width: 768px) {
    .card-body {
        padding: 15px !important;
    }
}