/* 写真天堂网站通用样式 */

/* 背景图片样式 */
.bg-image {
    background-image: url('https://source.unsplash.com/random/1920x1080/?model,portrait');
    background-size: cover;
    background-position: center;
}

/* 登录/注册容器样式 */
.auth-container {
    backdrop-filter: blur(8px);
    background-color: rgba(255, 255, 255, 0.8);
}

/* 注册容器样式（保持兼容） */
.register-container {
    backdrop-filter: blur(8px);
    background-color: rgba(255, 255, 255, 0.8);
}

/* 表单输入框聚焦效果 */
.form-input:focus {
    border-color: #ff3b6b;
    box-shadow: 0 0 0 3px rgba(255, 59, 107, 0.2);
}

/* 主按钮样式 */
.btn-primary {
    background-color: #ff3b6b;
    transition: all 0.3s;
}

.btn-primary:hover {
    background-color: #e02e5a;
    transform: translateY(-1px);
}

/* 标题下划线 */
.title-divider {
    height: 0.25rem;
    width: 4rem;
    background-color: #f472b6;
    margin: 0.75rem auto;
    border-radius: 0.25rem;
}

/* 页面步骤指示器 */
.step-indicator {
    transition: all 0.3s;
}

.step-indicator.active {
    color: #ff3b6b;
    border-color: #ff3b6b;
}

.step-indicator.completed {
    background-color: #ff3b6b;
    color: white;
}

/* 密码强度指示器 */
.password-strength {
    height: 4px;
    transition: all 0.3s;
}

/* 首页通用样式 */
body {
    font-family: 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', sans-serif;
}

/* 轮播图片样式 */
.banner-slide {
    height: 500px;
    background-size: cover;
    background-position: center;
}

/* 卡片悬停效果 */
.card-hover:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 20px rgba(0,0,0,0.1);
}

/* 渐变覆盖层 */
.gradient-overlay {
    background: linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(0,0,0,0.8) 100%);
}

/* 水印样式 */
.watermark {
    position: relative;
}

.watermark::after {
    content: "写真天堂";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2rem;
    color: rgba(255,255,255,0.3);
    font-weight: bold;
    pointer-events: none;
    transform: rotate(-30deg);
}

/* 图片悬停放大效果 */
.photo-wrapper img {
    transition: transform 0.3s ease;
}

.photo-wrapper:hover img {
    transform: scale(1.03);
}

/* 模糊效果 */
.blur-lg {
    filter: blur(15px);
}

/* 高亮按钮脉冲效果 */
.premium-btn {
    animation: pulse 2s infinite;
}

@keyframes pulse {
    0% {
        box-shadow: 0 0 0 0 rgba(236, 72, 153, 0.7);
    }
    70% {
        box-shadow: 0 0 0 10px rgba(236, 72, 153, 0);
    }
    100% {
        box-shadow: 0 0 0 0 rgba(236, 72, 153, 0);
    }
}

/* 模态框过渡效果 */
.payment-modal {
    transition: all 0.3s ease;
}

/* 固定购买栏过渡效果 */
.sticky-buy-bar {
    transition: transform 0.3s ease;
}

.sticky-buy-bar.hide {
    transform: translateY(100%);
}