// AgreePopup 组件样式 .agree-popup { width: 327px; background: #ffffff; border-radius: 12px; overflow: hidden; box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1); // 弹窗头部 .popup-header { position: relative; padding: 20px 20px 0 20px; .popup-title { font-size: 18px; font-weight: 600; color: #333333; text-align: center; line-height: 24px; } .close-btn { position: absolute; top: 16px; right: 16px; width: 28px; height: 28px; display: flex; align-items: center; justify-content: center; cursor: pointer; &:hover { background: #f5f5f5; border-radius: 50%; } } } // 弹窗内容 .popup-content { padding: 20px; .content-text { margin-bottom: 16px; .main-text { font-size: 14px; color: #333; line-height: 22px; display: block; } } .notice-text { text { font-size: 13px; color: #333; line-height: 20px; display: block; } } } // 按钮区域 .button-area { padding: 0 20px 20px 20px; display: flex; justify-content: center; align-items: center; .confirm-btn { width: 148px; height: 44px; background: linear-gradient(90deg, #22a7ff 0%, #2567ff 100%); display: flex; align-items: center; justify-content: center; color: #ffffff; border-radius: 50px; font-size: 16px; font-weight: 500; transition: all 0.3s ease; &:hover { background: #0056cc; } &:active { background: #004499; transform: scale(0.98); } } } }