/**
 * 前端样式
 */

.plan-sku-frontend-list {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 20px;
    margin: 20px 0;
}

.plan-sku-product-card {
    background: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    padding: 20px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
    transition: transform 0.2s, box-shadow 0.2s;
}

.plan-sku-product-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 8px rgba(0,0,0,0.15);
}

.product-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 15px;
    padding-bottom: 15px;
    border-bottom: 1px solid #f0f0f0;
}

.product-name {
    margin: 0;
    font-size: 18px;
    font-weight: 600;
    color: #1d2327;
    flex: 1;
}

.product-price {
    font-size: 20px;
    font-weight: 700;
    color: #2271b1;
    margin-left: 15px;
}

.product-description {
    color: #646970;
    font-size: 14px;
    line-height: 1.6;
    margin-bottom: 15px;
}

.product-features {
    list-style: none;
    padding: 0;
    margin: 0 0 15px 0;
}

.product-features li {
    padding: 5px 0;
    padding-left: 20px;
    position: relative;
    color: #50575e;
    font-size: 14px;
}

.product-features li:before {
    content: "✓";
    position: absolute;
    left: 0;
    color: #00a32a;
    font-weight: bold;
}

.product-features .more-features {
    color: #646970;
    font-style: italic;
}

.product-features .more-features:before {
    content: "";
}

.product-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-top: 15px;
    border-top: 1px solid #f0f0f0;
    font-size: 12px;
}

.delivery-info {
    color: #646970;
}

/* 报价单生成器样式 */
.plan-sku-quote-generator {
    max-width: 1200px; /* 左侧320px + gap30px + A4宽度210mm(约794px) + 边距 ≈ 1200px */
    margin: 0 auto;
    padding: 10px 20px 20px 20px; /* 减少顶部padding */
}

/* 左右分栏布局 */
.quote-generator-layout {
    display: grid;
    /* 26.9.041：右栏 minmax(0,1fr)——默认 1fr 的 min-width:auto 会被
       794px 的 A4 文档撑开轨道，导致窄屏容器假性变宽、缩放失效 */
    grid-template-columns: 320px minmax(0, 1fr);
    gap: 30px;
    margin-top: 5px;
}

/* 左侧面板：客户信息 + SKU列表 */
.quote-left-panel {
    display: flex;
    flex-direction: column;
    gap: 0;
    max-height: calc(100vh - 40px);
    overflow: visible;
    padding-right: 15px;
}

/* 左侧面板不再需要滚动条，滚动条在SKU列表区域内部 */

/* 客户信息区域 */
.customer-info-section {
    flex-shrink: 0;
    margin-bottom: 0;
    margin-top: 0;
}

/* 折扣码区域 */
.discount-section {
    flex-shrink: 0;
    margin-bottom: 6px;
    margin-top: 6px;
}

/* SKU产品列表区域 */
.quote-products-list {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 0;
    overflow-y: auto;
    overflow-x: hidden;
    margin-top: 0;
    margin-bottom: 0;
    /* 移除固定的 max-height，让 flex: 1 自动分配剩余空间 */
}

.quote-products-list .products-list-title {
    position: sticky;
    top: 0;
    margin: 0 0 12px 0;
    padding: 8px;
    font-size: 13px;
    font-weight: 600;
    color: #1d2327;
    flex-shrink: 0;
    background: #f9f9f9;
    z-index: 10;
    border-bottom: 1px solid #e0e0e0;
}

.quote-products-list::-webkit-scrollbar {
    width: 8px;
}

.quote-products-list::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-radius: 4px;
}

.quote-products-list::-webkit-scrollbar-thumb {
    background: #888;
    border-radius: 4px;
}

.quote-products-list::-webkit-scrollbar-thumb:hover {
    background: #555;
}

/* 兼容旧类名 */
.quote-products-sidebar {
    overflow-y: auto;
    max-height: calc(100vh - 300px);
    padding-right: 15px;
    min-width: 0;
}

.quote-products-sidebar::-webkit-scrollbar {
    width: 8px;
}

.quote-products-sidebar::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-radius: 4px;
}

.quote-products-sidebar::-webkit-scrollbar-thumb {
    background: #888;
    border-radius: 4px;
}

.quote-products-sidebar::-webkit-scrollbar-thumb:hover {
    background: #555;
}

.quote-preview-sidebar {
    position: sticky;
    top: 20px;
    align-self: start;
    max-height: none;
    overflow: visible;
    width: 100%;
    max-width: 225mm; /* 限制预览区域宽度 */
    margin-left: auto;
    margin-right: auto;
    /* 26.9.041：grid item 防御——min-width:auto 同样会被 A4 文档撑开 */
    min-width: 0;
}

.quote-header {
    text-align: center;
    margin-bottom: 10px;
    padding-bottom: 10px;
    border-bottom: 2px solid #2271b1;
}

.quote-header h2 {
    margin: 0 0 5px 0;
    color: #1d2327;
}

.quote-section {
    margin-bottom: 4px;
    margin-top: 0;
    background: #f9f9f9;
    padding: 6px 8px;
    border-radius: 4px;
}

.quote-section:last-child {
    margin-bottom: 0;
}

.section-title {
    margin: 0 0 6px 0;
    font-size: 13px;
    font-weight: 600;
    color: #1d2327;
    padding-bottom: 4px;
    border-bottom: 1px solid #2271b1;
}

.products-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 4px;
}

.quote-product-item {
    background: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 4px;
    transition: all 0.2s;
    min-width: 0;
    overflow: visible;
    position: relative;
}

.quote-product-item:hover {
    border-color: #2271b1;
}

.product-checkbox {
    display: flex;
    align-items: flex-start;
    gap: 6px;
    padding: 4px 6px;
    cursor: pointer;
    margin: 0;
}

.product-checkbox input[type="checkbox"] {
    margin: 0;
    width: 16px;
    height: 16px;
    cursor: pointer;
    flex-shrink: 0;
    margin-top: 2px;
}

.product-checkbox input[type="checkbox"]:checked + .product-info,
.product-checkbox input[type="radio"]:checked + .product-info {
    color: #2271b1;
}

.product-info {
    display: flex;
    flex-direction: column;
    gap: 2px;
    flex: 1;
    min-width: 0;
    word-wrap: break-word;
}

.product-info .product-name {
    font-size: 13px;
    font-weight: 600;
    color: #1d2327;
    flex: 1;
    min-width: 0;
    margin-bottom: 1px;
    line-height: 1.3;
    word-wrap: break-word;
    min-height: 18px;
    display: flex;
    align-items: flex-start;
}

.product-price-row {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 4px;
    margin-top: 0;
    min-height: 14px;
}

.product-info .product-price {
    font-size: 11px;
    font-weight: 500;
    color: #646970;
    white-space: nowrap;
    flex-shrink: 0;
}

.product-features-list {
    list-style: none;
    padding: 0;
    margin: 10px 0 0 0;
    font-size: 12px;
    color: #646970;
}

.product-features-list li {
    padding: 3px 0;
    padding-left: 15px;
    position: relative;
}

.product-features-list li:before {
    content: "•";
    position: absolute;
    left: 0;
    color: #2271b1;
}

/* 报价单预览 */
.quote-preview-section {
    background: transparent;
    border: none;
    border-radius: 0;
    padding: 0;
    margin-top: 0;
    position: relative;
    /* 宽度限制已移到 quote-preview-sidebar */
}

.quote-preview {
    max-width: 100%;
    width: 220mm; /* 比报价单内容(210mm)稍宽，留出outline空间 */
    margin: 0 auto;
    position: relative;
    /* 添加A4纸张区域背景提示 */
    background: #f5f5f5;
    padding: 20px;
    border-radius: 8px;
}

/* 禁止复制和选择 */
.quote-preview-section,
.quote-preview,
.quote-document {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-touch-callout: none;
    -webkit-tap-highlight-color: transparent;
}

.quote-preview-section *,
.quote-preview *,
.quote-document * {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    pointer-events: auto;
}

/* 按钮区域允许交互 */
.quote-actions,
.quote-actions *,
.quote-actions button {
    -webkit-user-select: auto;
    -moz-user-select: auto;
    -ms-user-select: auto;
    user-select: auto;
    pointer-events: auto;
    cursor: pointer;
}

/* 防截图水印 */
.quote-document::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-image: repeating-linear-gradient(
        45deg,
        transparent,
        transparent 100px,
        rgba(0, 0, 0, 0.02) 100px,
        rgba(0, 0, 0, 0.02) 200px
    );
    pointer-events: none;
    z-index: 1;
}

/* 防截图水印文字 - 通过JavaScript动态设置 */
.quote-document .watermark-text {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) rotate(-45deg);
    font-size: 48px;
    color: rgba(0, 0, 0, 0.03);
    white-space: nowrap;
    pointer-events: none;
    z-index: 1;
    font-weight: 700;
    letter-spacing: 8px;
    user-select: none;
    font-family: "Microsoft YaHei", "SimHei", Arial, sans-serif;
}

.quote-document > * {
    position: relative;
    z-index: 2;
}

.quote-preview-header {
    text-align: center;
    margin-bottom: 30px;
    padding-bottom: 20px;
    border-bottom: 2px solid #2271b1;
}

.quote-preview-header h4 {
    margin: 0 0 10px 0;
    font-size: 24px;
    font-weight: 700;
    color: #1d2327;
}

.quote-number,
.quote-validity {
    font-size: 14px;
    color: #646970;
    margin: 5px 0;
}

.quote-preview-body {
    margin-bottom: 30px;
}

.quote-items-table {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 20px;
}

.quote-items-table th,
.quote-items-table td {
    padding: 12px;
    text-align: left;
    border-bottom: 1px solid #e0e0e0;
}

.quote-items-table th {
    background: #f6f7f7;
    font-weight: 600;
    color: #1d2327;
}

.quote-items-table td {
    color: #50575e;
}

.quote-items-table .item-name {
    font-weight: 600;
    color: #1d2327;
}

.quote-items-table .item-price {
    text-align: right;
    font-weight: 600;
    color: #2271b1;
}

.empty-message {
    text-align: center;
    color: #646970;
    padding: 40px;
    font-style: italic;
}

.quote-items-table .empty-message {
    padding: 20px;
}

/* 折扣信息行样式 */
.quote-items-table .discount-info-row {
    background: transparent;
}

.quote-items-table .discount-info-row td {
    padding: 8px 10px;
    font-size: 13px;
}

.quote-items-table .discount-info-row .item-name {
    font-weight: 600;
    color: #1d2327;
}

.quote-items-table .discount-info-row .item-desc.discount-info-label {
    text-align: left;
    color: #50575e;
}

.quote-items-table .discount-info-row .item-amount.discount-info-amount {
    text-align: right;
    font-weight: 600;
    color: #00a32a;
}

.quote-summary {
    margin-top: 20px;
    padding-top: 20px;
    border-top: 2px solid #2271b1;
}

.summary-row {
    display: flex;
    justify-content: space-between;
    padding: 10px 0;
    font-size: 16px;
}

.summary-row.total {
    font-size: 20px;
    font-weight: 700;
    color: #2271b1;
    padding-top: 15px;
    border-top: 1px solid #e0e0e0;
}

.summary-label {
    font-weight: 600;
}

.summary-value {
    font-weight: 700;
    color: #2271b1;
}

.quote-actions {
    text-align: center;
    padding-top: 20px;
    border-top: 1px solid #e0e0e0;
}

.quote-actions .button {
    margin: 0 10px;
    padding: 10px 20px;
    font-size: 14px;
}

/* 打印样式已移至文件底部，统一管理 */

/* 26.9.041：A4 等比缩放层——窄屏时 JS 把 .quote-document 整体
   transform:scale 缩到容器宽（保持 A4 排版真实还原），并在此层
   显式设置缩放后的占位高度；文档原始占位由 .quote-preview 裁掉 */
.quote-document-scaler {
    position: relative;
    width: 100%;
}

/* 报价单文档样式 - A4格式 */
.quote-document {
    background: #fff;
    padding: 20mm 20mm;
    border: 1px solid #e0e0e0;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
    width: 210mm;
    min-height: 297mm;
    margin: 0 auto;
    box-sizing: border-box;
    /* A4边界标识 - 预览时显示A4纸张边界 */
    outline: 2px dashed #ccc;
    outline-offset: 4px;
    position: relative;
}

/* A4尺寸提示标签 */
.quote-document::after {
    content: "A4 (210mm × 297mm)";
    position: absolute;
    bottom: 4px;
    right: 8px;
    font-size: 10px;
    color: #999;
    pointer-events: none;
    opacity: 0.6;
}

/* PDF生成模式 - 隐藏所有预览辅助元素 */
.quote-document.pdf-generating-mode {
    outline: none !important;
}

.quote-document.pdf-generating-mode::after {
    display: none !important;
}

.quote-preview.pdf-generating-mode {
    background: transparent !important;
    padding: 0 !important;
    border-radius: 0 !important;
}

/* PDF生成模式下隐藏水印 */
.pdf-generating-mode .watermark-text {
    display: none !important;
}

.quote-header-info {
    text-align: left;
    margin-bottom: 18px;
    padding-bottom: 0;
    border-bottom: none;
}

.quote-title {
    font-size: 24px;
    font-weight: 700;
    margin-bottom: 8px;
    color: #1d2327;
}

.quote-meta {
    font-size: 13px;
    color: #646970;
    line-height: 1.6;
}

.quote-number,
.quote-validity {
    margin: 4px 0;
}

/* 客户信息输入区域 - 紧凑样式 */
.customer-info-section {
    margin-bottom: 0;
    margin-top: 0;
    padding: 6px;
    background: #f9f9f9;
    border-radius: 4px;
    flex-shrink: 0;
}

.customer-info-section h3 {
    margin: 0 0 4px 0;
    font-size: 12px;
    font-weight: 600;
    color: #1d2327;
}

.customer-info-form {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 4px;
}

.customer-info-form > div {
    display: flex;
    flex-direction: column;
    gap: 1px;
}

.customer-info-form label {
    font-size: 11px;
    color: #646970;
    margin-bottom: 0;
}

.customer-info-form input[type="text"],
.customer-info-form input[type="email"] {
    padding: 2px 4px !important;
    border: 1px solid #ddd;
    border-radius: 2px;
    font-size: 12px;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    height: 22px !important;
    line-height: 1.4;
    min-height: 22px;
}

.customer-info-form input:focus {
    outline: none;
    border-color: #2271b1;
}

/* 报价单保护遮罩 */
.quote-protection-overlay {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 220mm; /* 与 quote-preview 宽度一致 */
    max-width: 100%;
    height: calc(100% - 60px); /* 减去按钮区域高度 */
    background: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(2px);
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding-top: 40px;
    z-index: 10;
    border-radius: 8px;
    overflow-y: auto;
}

.quote-protection-overlay.hidden {
    display: none;
}

/* 开发者工具检测遮罩 - 固定在页面顶部 */
.devtools-protection-overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(255, 255, 255, 0.98);
    backdrop-filter: blur(10px);
    display: none;
    align-items: center;
    justify-content: center;
    z-index: 99999;
    border-radius: 0;
}

.devtools-protection-overlay.active {
    display: flex;
}

.devtools-protection-message {
    text-align: center;
    padding: 40px;
    background: #fff;
    border: 2px solid #dc3232;
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    max-width: 500px;
}

.devtools-protection-message h3 {
    color: #dc3232;
    font-size: 20px;
    margin: 0 0 15px 0;
    font-weight: 700;
}

.devtools-protection-message p {
    color: #646970;
    font-size: 14px;
    margin: 10px 0;
    line-height: 1.6;
}

.protection-message {
    text-align: center;
    padding: 20px 30px;
    background: #fff;
    border: 2px solid #2271b1;
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    margin-top: 0;
}

.protection-message p {
    margin: 0 0 10px 0;
    font-size: 16px;
    font-weight: 600;
    color: #1d2327;
}

.protection-message p:last-child {
    margin-bottom: 0;
}

.protection-hint {
    font-size: 14px;
    color: #646970;
    font-weight: normal;
}

/* quote-preview-section 样式已在上面定义，这里不再重复 */

/* 公司信息（左右布局） */
.quote-companies-info {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 40px;
    margin-bottom: 18px;
}

.quote-company-info {
    line-height: 1.6;
    padding: 0;
    background: transparent;
    border-radius: 0;
    border: none;
}

/* quote-sender-info: 移除边框，按照截图格式 */

.quote-sender-info .company-name {
    font-size: 16px;
    font-weight: 600;
    margin-bottom: 6px;
    color: #1d2327;
}

/* quote-customer-info: 移除边框，按照截图格式 */

.company-name {
    font-size: 13px;
    font-weight: normal;
    margin-bottom: 4px;
    color: #50575e;
    line-height: 1.5;
}

.company-address,
.company-email {
    font-size: 13px;
    color: #50575e;
    margin-bottom: 4px;
    line-height: 1.5;
}

.company-contact {
    font-size: 16px;
    font-weight: 600;
    margin-bottom: 6px;
    color: #1d2327;
}

.company-contact .contact-name {
    font-size: 16px;
    font-weight: 600;
    color: #1d2327;
}

.company-contact .company-name-inline {
    font-size: 13px;
    font-weight: normal;
    color: #50575e;
}

.quote-content {
    margin-bottom: 30px;
}

.quote-section-header {
    font-size: 16px;
    font-weight: 600;
    padding: 12px 15px;
    background: transparent;
    margin-top: 20px;
    margin-bottom: 0;
    border: none;
}

.quote-items-table {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 0;
    border: none;
}

.quote-items-table th,
.quote-items-table td {
    padding: 8px 10px;
    text-align: left;
    border: none;
}

.quote-items-table tbody tr:not(.section-subtotal):not(.empty-row):not(.discount-info-row):not(.last-row) {
    border-bottom: 1px dashed #ccc;
}

.quote-items-table tbody tr.section-subtotal,
.quote-items-table tbody tr.empty-row,
.quote-items-table tbody tr.discount-info-row,
.quote-items-table tbody tr.last-row {
    border-bottom: none;
}

/* 26.8.8：表头下线与合计分隔线统一为蓝色 2px（与打印件同款，上下呼应） */
.quote-items-table thead {
    border-bottom: 2px solid #2271b1;
}

.quote-items-table thead tr {
    border-bottom: 2px solid #2271b1;
}

.quote-items-table th {
    background: transparent;
    font-weight: 600;
    color: #1d2327;
    border-bottom: 2px solid #2271b1;
    padding-bottom: 10px;
    padding-top: 10px;
    font-size: 13px;
}

.quote-items-table td {
    color: #50575e;
    vertical-align: top;
    font-size: 13px;
}

.quote-items-table th:first-child,
.quote-items-table .item-name {
    font-weight: 600;
    color: #1d2327;
    width: 12%;
    text-align: left;
}

.quote-items-table th:first-child {
    text-align: left;
}

.quote-items-table .item-name {
    text-align: left;
    font-size: 13px;
}

.quote-items-table .item-desc {
    width: 38%;
    font-size: 13px;
    line-height: 1.6;
}

.quote-items-table .item-desc p {
    margin: 5px 0;
}

.quote-items-table th:nth-child(3),
.quote-items-table .item-quantity {
    width: 10%;
    text-align: center;
}

.quote-items-table th:nth-child(3) {
    text-align: center;
}

.quote-items-table th:nth-child(4),
.quote-items-table .item-price {
    text-align: right;
    font-weight: 600;
    color: #2271b1;
    width: 15%;
}

.quote-items-table th:nth-child(4) {
    text-align: right;
}

.quote-items-table th:nth-child(5),
.quote-items-table .item-amount {
    text-align: right;
    font-weight: 600;
    color: #2271b1;
    width: 15%;
}

.quote-items-table .item-price,
.quote-items-table .item-amount,
.summary-total-row .summary-value {
    letter-spacing: 0.4px;
}

.quote-items-table th:nth-child(5) {
    text-align: right;
}

.section-subtotal {
    background: transparent;
    font-weight: 600;
}

.section-subtotal .subtotal-label {
    text-align: right;
    padding-right: 15px;
}

.quote-summary-section {
    margin-top: 0;
    padding-top: 0;
    border-top: none;
}

.summary-divider {
    border-top: 2px solid #2271b1;
    margin-bottom: 10px;
    margin-top: 0;
}

.summary-total-row {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 15px;
    padding: 0;
    width: 100%;
    flex-wrap: nowrap;
}

.summary-total-row .summary-label {
    font-weight: 600;
    color: #1d2327;
    font-size: 16px;
    flex-shrink: 0;
    text-align: right;
    padding-right: 10px;
    white-space: nowrap;
}

.summary-total-row .summary-value {
    font-weight: 700;
    color: #2271b1;
    font-size: 18px;
    flex-shrink: 0;
    text-align: right;
    white-space: nowrap;
}

.summary-total-row .summary-value-chinese {
    display: none;
}

.summary-table {
    border: none;
    border-collapse: collapse;
}

.summary-row {
    display: flex;
    border-bottom: none;
}

.summary-row:last-child {
    border-bottom: none;
}

.summary-label {
    width: 150px;
    padding: 15px;
    background: transparent;
    font-weight: 600;
    color: #1d2327;
    border-right: none;
}

.summary-details {
    flex: 1;
    padding: 15px;
}

.summary-item {
    margin-bottom: 10px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.summary-item:last-child {
    margin-bottom: 0;
}

.summary-item-label {
    color: #50575e;
}

.summary-item-value {
    font-weight: 600;
    color: #2271b1;
    font-size: 16px;
}

.quote-footer {
    margin-top: 20px;
    padding-top: 0;
    border-top: none;
    text-align: left;
}

.company-name-footer {
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 6px;
    color: #1d2327;
}

.company-tax-id {
    font-size: 13px;
    color: #646970;
}

/* 云服务器选项样式 */
.server-options {
    display: grid;
    grid-template-columns: 1fr;
    gap: 8px;
}

.server-option {
    padding: 0;
}

.server-checkbox {
    width: 100%;
}

.product-checkbox input[type="radio"] {
    margin: 0;
    width: 16px;
    height: 16px;
    cursor: pointer;
    flex-shrink: 0;
    margin-top: 2px;
}

.server-info {
    width: 100%;
}

.server-price-row {
    justify-content: flex-end;
    align-items: center;
    margin-top: auto;
}

.server-price {
    font-size: 11px;
    font-weight: 500;
    color: #646970;
}

.server-desc {
    margin-top: 6px;
    font-size: 12px;
    color: #50575e;
    line-height: 1.6;
}

.server-desc-line {
    margin: 2px 0;
    padding-left: 12px;
    position: relative;
}

.server-desc-line::before {
    content: '-';
    position: absolute;
    left: 0;
    color: #2271b1;
}

.server-note {
    font-size: 11px;
    color: #dc3232;
    margin-top: 4px;
}

/* 数量输入框样式已随月数输入框移除（26.9.043） */

/* SKU悬浮提示框 */
.sku-tooltip-wrapper {
    position: absolute;
    z-index: 10000;
    display: none;
    pointer-events: none;
    max-width: 350px;
}

.sku-tooltip {
    background: #fff;
    border: 1px solid #2271b1;
    border-radius: 4px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.15);
    padding: 12px;
    font-size: 12px;
    line-height: 1.5;
}

.tooltip-desc {
    color: #50575e;
    margin-bottom: 8px;
}

.tooltip-features {
    color: #50575e;
}

.tooltip-feature {
    margin-bottom: 4px;
}

.tooltip-feature:last-child {
    margin-bottom: 0;
}

@media print {
    /* 隐藏不需要打印的元素 */
    .quote-section,
    .quote-actions,
    .quote-header,
    .quote-left-panel,
    .quote-protection-overlay,
    .devtools-protection-overlay,
    .plan-sku-quote-generator > .quote-header,
    .quote-generator-layout {
        display: none !important;
    }

    /* 确保报价单预览区域显示 */
    .quote-preview-section {
        border: none;
        padding: 0;
        display: block !important;
        position: static !important;
        max-width: 100% !important;
        width: 100% !important;
    }

    .quote-preview {
        max-width: 100%;
        display: block !important;
    }

    /* 确保报价单文档显示 - 严格遵循A4尺寸，无边距 */
    .quote-document {
        border: none;
        box-shadow: none;
        padding: 15mm 15mm !important; /* 保持内边距以确保内容不贴边 */
        /* 打印时使用A4标准尺寸，填满整个页面 */
        width: 210mm !important;
        max-width: 210mm !important;
        min-height: 297mm !important;
        height: auto !important;
        margin: 0 !important; /* 移除外边距，填满页面 */
        display: block !important;
        position: relative !important;
        page-break-inside: avoid;
        /* 移除预览时的outline */
        outline: none !important;
    }

    /* 移除预览容器的背景和padding */
    .quote-preview {
        background: transparent !important;
        padding: 0 !important;
        border-radius: 0 !important;
        /* 26.9.041：窄屏缩放引入的 overflow:hidden 在打印时放开（A4 原尺寸直出） */
        overflow: visible !important;
    }

    /* 缩放层在打印时还原自然占位 */
    .quote-document-scaler {
        height: auto !important;
    }

    /* 移除A4尺寸提示（打印时不需要） */
    .quote-document::after {
        display: none !important;
    }

    /* 确保报价单内容显示 */
    .quote-header-info,
    .quote-companies-info,
    .quote-content,
    .quote-summary-section,
    .quote-footer {
        display: block !important;
        visibility: visible !important;
    }

    /* 确保表格内容显示 */
    .quote-items-table,
    .quote-items-table thead,
    .quote-items-table tbody,
    .quote-items-table tr,
    .quote-items-table th,
    .quote-items-table td {
        display: table !important;
        visibility: visible !important;
    }

    .quote-items-table thead {
        display: table-header-group !important;
    }

    .quote-items-table tbody {
        display: table-row-group !important;
    }

    .quote-items-table tr {
        display: table-row !important;
    }

    .quote-items-table th,
    .quote-items-table td {
        display: table-cell !important;
    }

    /* 确保汇总信息显示 */
    .summary-table,
    .summary-row {
        display: flex !important;
        visibility: visible !important;
    }

    /* 隐藏水印（打印时不需要） */
    .watermark-text {
        display: none !important;
    }

    /* 确保所有文本可见 */
    .quote-document * {
        color: #000 !important;
        background: transparent !important;
    }

    .quote-document {
        background: #fff !important;
    }

    /* A4纸张设置 - 确保打印时使用A4尺寸 */
    @page {
        size: A4;
        margin: 0;
    }

    /* 确保body不会影响A4尺寸 */
    body {
        background: #fff !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    /* 确保html和body不会添加额外的间距 */
    html {
        margin: 0 !important;
        padding: 0 !important;
    }
}

@media (max-width: 1200px) {
    .quote-generator-layout {
        grid-template-columns: minmax(0, 1fr);
        gap: 20px;
    }

    .quote-left-panel {
        max-height: none;
        padding-right: 0;
    }

    .quote-products-list {
        max-height: none;
        min-height: 0;
    }

    .quote-products-sidebar {
        max-height: none;
        padding-right: 0;
    }

    .quote-preview-sidebar {
        position: static;
        max-height: none;
        overflow: visible;
    }

    /* 26.9.041：窄屏报价单不再 width:100% 流式压缩（375px 屏文档被压到
       372px，表格列表头逐字竖排）——保持桌面 A4 版式，由 JS 在
       .quote-document-scaler 内整体 transform:scale 等比缩小 */
    .quote-preview {
        width: 100%;
        max-width: 100%;
        /* 缩放后文档的原始占位框仍宽于容器，裁掉两侧空白占位 */
        overflow: hidden;
    }

    .quote-document {
        /* 保持桌面 A4 尺寸（210mm），缩放交给 JS */
        outline-width: 1px;
    }

    .products-grid {
        grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    }

    .server-options {
        grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    }

    /* 折扣码区域中等屏幕优化 */
    .discount-input-group {
        gap: 8px;
    }

    /* 客户信息区域中等屏幕优化 */
    .customer-info-form {
        gap: 15px;
    }
}

@media (min-width: 1201px) and (max-width: 1400px) {
    .plan-sku-quote-generator {
        max-width: 1200px; /* 保持一致的宽度 */
    }
    
    .quote-generator-layout {
        grid-template-columns: 320px 1fr; /* 保持左侧面板宽度一致 */
    }
}

@media (max-width: 768px) {
    .plan-sku-frontend-list {
        grid-template-columns: 1fr;
    }
    
    .products-grid {
        grid-template-columns: 1fr;
    }
    
    .server-options {
        grid-template-columns: 1fr;
    }
    
    .form-row {
        grid-template-columns: 1fr;
        gap: 15px;
    }
    
    .quote-companies-info {
        grid-template-columns: 1fr;
        gap: 20px;
    }
    
    .quote-actions .button {
        display: block;
        width: 100%;
        margin: 10px 0;
    }
    
    .quote-items-table {
        font-size: 12px;
    }
    
    .quote-items-table th,
    .quote-items-table td {
        padding: 8px;
    }
    
    .summary-row {
        flex-direction: column;
    }
    
    .summary-label {
        width: 100%;
        border-right: none;
        border-bottom: 1px solid #e0e0e0;
    }
    
    /* 折扣码区域移动端优化 */
    .discount-section {
        padding: 12px;
    }
    
    .discount-input-group {
        flex-direction: column;
        gap: 8px;
    }
    
    .discount-input-group .button {
        width: 100%;
    }
    
    /* 客户信息区域移动端优化 */
    .customer-info-form {
        gap: 12px;
    }
    
    .customer-info-form input {
        font-size: 14px;
    }
    
    .info-completeness-hint {
        padding: 8px;
        font-size: 11px;
    }
    
    .info-declaration {
        padding: 8px;
    }
    
    .info-declaration label {
        font-size: 11px;
    }
    
    /* 报价单预览移动端优化 */
    .quote-preview-sidebar {
        margin-top: 20px;
    }
    
    .quote-header-info {
        flex-direction: column;
        gap: 10px;
    }
    
    .quote-title {
        font-size: 20px;
    }
    
    .quote-meta {
        font-size: 11px;
    }
}

/* 折扣码区域样式 */
.discount-section {
    background: #f9f9f9;
    padding: 8px;
    border-radius: 4px;
    flex-shrink: 0;
}

.discount-section h3 {
    margin: 0 0 6px 0;
    font-size: 12px;
    font-weight: 600;
    color: #1d2327;
}

.discount-input-group {
    display: flex;
    gap: 6px;
    margin-bottom: 4px;
}

.discount-input-group input {
    flex: 1;
    padding: 4px 8px;
    border: 1px solid #ddd;
    border-radius: 4px;
    font-size: 13px;
    text-transform: uppercase;
}

.discount-input-group input:focus {
    outline: none;
    border-color: #2271b1;
}

.discount-input-group .button {
    padding: 4px 12px;
    white-space: nowrap;
    font-size: 13px;
}

.discount-message {
    padding: 8px 12px;
    border-radius: 4px;
    font-size: 13px;
    margin-top: 8px;
}

.discount-message.success {
    background: #d4edda;
    color: #155724;
    border: 1px solid #c3e6cb;
}

.discount-message.error {
    background: #f8d7da;
    color: #721c24;
    border: 1px solid #f5c6cb;
}

/* 客户信息完整度提示 */
.info-completeness-hint {
    background: #e7f3ff;
    border: 1px solid #2271b1;
    border-radius: 4px;
    padding: 10px;
    margin-top: 10px;
    font-size: 12px;
}

.info-completeness-hint p {
    margin: 5px 0;
    color: #1d2327;
}

.info-completeness-hint strong {
    color: #2271b1;
}

.completeness-desc {
    color: #646970;
    font-size: 11px;
}

/* 客户信息真实性声明 */
.info-declaration {
    margin-top: 8px;
    padding: 6px;
    background: #fff3cd;
    border: 1px solid #ffc107;
    border-radius: 4px;
}

.info-declaration label {
    display: flex;
    align-items: flex-start;
    gap: 6px;
    cursor: pointer;
    font-size: 11px;
    color: #856404;
    margin: 0;
    line-height: 1.4;
}

.info-declaration input[type="checkbox"] {
    margin-top: 1px;
    flex-shrink: 0;
}

.info-declaration span {
    flex: 1;
    line-height: 1.4;
}

.required {
    color: #dc3232;
    margin-left: 3px;
}

/* 报价单汇总折扣显示 */
.summary-discount-row {
    color: #00a32a;
}

.summary-discount {
    color: #00a32a;
    font-weight: 600;
}

.discount-details {
    margin-top: 10px;
    padding: 8px;
    background: #f0f0f0;
    border-radius: 4px;
    font-size: 12px;
    color: #646970;
}

.discount-info-text {
    margin: 0;
    line-height: 1.5;
}

/* ============================================================
   26.9 前端报价单生成器 UI 重设计（Cloudflare 控制台风格）
   设计语言：白色卡片 + 1px 细边框 + 8px 圆角 + 16/12/8px 间距
   体系 + focus 蓝色光环。仅重排生成器非预览区域（客户信息、
   折扣码、产品选择），A4 预览区保持原有样式不动。
   实现方式：本段追加在文件末尾，以"同权重后定义优先"覆盖
   上方旧规则；全部选择器为插件自有类名，不设 font-family、
   不加页面级背景（尊重 WordPress 主题），CSS 变量作用域限定
   在生成器容器内，零 DOM/JS 改动。
   ============================================================ */

/* --- 设计令牌（作用域限定在生成器容器内） --- */
.plan-sku-quote-generator {
    --psk-card: #ffffff;
    --psk-border: #e3e6ea;
    --psk-border-strong: #ccd2d9;
    --psk-border-hover: #a9bccd;
    --psk-text: #1d2327;
    --psk-text-2: #50575e;
    --psk-text-3: #646970;
    --psk-accent: #2271b1;
    --psk-accent-bg: #f0f6fc;
    --psk-radius: 8px;
    --psk-radius-sm: 5px;
    --psk-shadow: 0 1px 2px rgba(16, 24, 40, 0.04);
    padding: 24px 24px 32px;
}

/* --- 页头：左对齐标题 + 辅助描述（去蓝色分隔线） --- */
.plan-sku-quote-generator .quote-header {
    text-align: left;
    border-bottom: none;
    margin: 0 0 20px;
    padding: 0;
}

.plan-sku-quote-generator .quote-header h2 {
    margin: 0 0 4px;
    font-size: 22px;
    line-height: 1.3;
    color: var(--psk-text);
}

.plan-sku-quote-generator .quote-header p {
    margin: 0;
    font-size: 14px;
    color: var(--psk-text-3);
}

/* --- 左右分栏：左栏 340px（避免挤压右侧 A4 预览宽度） --- */
.plan-sku-quote-generator .quote-generator-layout {
    grid-template-columns: 340px minmax(0, 1fr);
    gap: 24px;
    margin-top: 0;
    align-items: start;
}

/* 左栏：各区块独立卡片，统一 16px 间距。
   26.8.3：解除视口高度限制，产品列表完整展开随页面滚动——
   此前内部滚动区被 100vh 挤到只显示约 3 个 SKU；展开后左栏
   高度必然 ≥ 右侧 A4 预览（右侧 sticky 预览仍跟随滚动） */
.plan-sku-quote-generator .quote-left-panel {
    gap: 16px;
    padding-right: 0;
    max-height: none;
}

/* --- 客户信息卡片 --- */
.plan-sku-quote-generator .customer-info-section {
    margin: 0;
    padding: 20px;
    background: var(--psk-card);
    border: 1px solid var(--psk-border);
    border-radius: var(--psk-radius);
    box-shadow: var(--psk-shadow);
}

.plan-sku-quote-generator .customer-info-section h3 {
    margin: 0 0 16px;
    font-size: 15px;
    font-weight: 600;
    color: var(--psk-text);
}

/* 联系人+邮箱同行（短字段），公司全称+地址整行（长字段） */
.plan-sku-quote-generator .customer-info-form {
    grid-template-columns: 1fr 1fr;
    gap: 14px 10px;
}

.plan-sku-quote-generator .customer-info-form > div {
    gap: 5px;
}

.plan-sku-quote-generator .customer-info-form > div:nth-child(3),
.plan-sku-quote-generator .customer-info-form > div:nth-child(4) {
    grid-column: 1 / -1;
}

.plan-sku-quote-generator .customer-info-form label {
    font-size: 13px;
    font-weight: 500;
    color: var(--psk-text-2);
}

.plan-sku-quote-generator .customer-info-form input[type="text"],
.plan-sku-quote-generator .customer-info-form input[type="email"] {
    padding: 7px 10px !important;
    height: 36px !important;
    min-height: 36px;
    border: 1px solid var(--psk-border-strong) !important;
    border-radius: var(--psk-radius-sm) !important;
    font-size: 13px !important;
    background: #fff;
    color: var(--psk-text);
    transition: border-color 0.15s, box-shadow 0.15s;
}

.plan-sku-quote-generator .customer-info-form input[type="text"]::placeholder,
.plan-sku-quote-generator .customer-info-form input[type="email"]::placeholder {
    color: #9aa2ab;
}

.plan-sku-quote-generator .customer-info-form input[type="text"]:focus,
.plan-sku-quote-generator .customer-info-form input[type="email"]:focus {
    border-color: var(--psk-accent) !important;
    box-shadow: 0 0 0 3px rgba(34, 113, 177, 0.13);
    outline: none;
}

/* --- 真实性声明：黄色警示条 → 蓝色信息条 --- */
.plan-sku-quote-generator .info-declaration {
    margin-top: 14px;
    padding: 10px 12px;
    background: #f0f6fc;
    border: 1px solid #d3e2f2;
    border-radius: var(--psk-radius-sm);
}

.plan-sku-quote-generator .info-declaration label {
    gap: 8px;
    font-size: 12px;
    line-height: 1.5;
    color: #455a72;
}

.plan-sku-quote-generator .info-declaration input[type="checkbox"] {
    accent-color: var(--psk-accent);
}

/* --- 信息完整度提示：蓝底重色块 → 中性浅色条 --- */
.plan-sku-quote-generator .info-completeness-hint {
    margin-top: 12px;
    padding: 10px 12px;
    background: #fafbfc;
    border: 1px solid var(--psk-border);
    border-radius: var(--psk-radius-sm);
    font-size: 12px;
}

/* --- 折扣码卡片 --- */
.plan-sku-quote-generator .discount-section {
    margin: 0;
    padding: 20px;
    background: var(--psk-card);
    border: 1px solid var(--psk-border);
    border-radius: var(--psk-radius);
    box-shadow: var(--psk-shadow);
}

.plan-sku-quote-generator .discount-section h3 {
    margin: 0 0 12px;
    font-size: 15px;
    font-weight: 600;
    color: var(--psk-text);
}

.plan-sku-quote-generator .discount-input-group {
    gap: 8px;
}

.plan-sku-quote-generator .discount-input-group input {
    height: 36px;
    padding: 7px 10px;
    border: 1px solid var(--psk-border-strong);
    border-radius: var(--psk-radius-sm);
    font-size: 13px;
    transition: border-color 0.15s, box-shadow 0.15s;
}

.plan-sku-quote-generator .discount-input-group input::placeholder {
    color: #9aa2ab;
}

.plan-sku-quote-generator .discount-input-group input:focus {
    border-color: var(--psk-accent);
    box-shadow: 0 0 0 3px rgba(34, 113, 177, 0.13);
    outline: none;
}

.plan-sku-quote-generator .discount-message {
    border-radius: var(--psk-radius-sm);
    font-size: 12px;
    padding: 8px 10px;
}

/* --- 产品列表：完整展开，随页面自然滚动（不再内部滚动） --- */
.plan-sku-quote-generator .quote-products-list {
    gap: 0;
    overflow: visible;
}

.plan-sku-quote-generator .quote-products-list .products-list-title {
    position: static;
    margin: 0 0 2px;
    padding: 0 4px;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.02em;
    color: var(--psk-text-2);
    background: transparent;
    border-bottom: none;
}

/* --- 分类卡片（白卡 + 灰底标题分隔线） --- */
.plan-sku-quote-generator .quote-section {
    margin-bottom: 14px;
    padding: 16px;
    background: var(--psk-card);
    border: 1px solid var(--psk-border);
    border-radius: var(--psk-radius);
    box-shadow: var(--psk-shadow);
}

.plan-sku-quote-generator .quote-section:last-child {
    margin-bottom: 0;
}

/* 分类标题：可折叠行（▸ 收起 / ▾ 展开，点击或 Enter/空格切换） */
.plan-sku-quote-generator .section-title {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0 0 10px;
    padding: 0 0 10px;
    font-size: 14px;
    font-weight: 600;
    color: var(--psk-text);
    border-bottom: 1px solid var(--psk-border);
    cursor: pointer;
    user-select: none;
}

/* 折叠指示三角（CSS 绘制，▸ 右指；展开时旋转 90° 变 ▾） */
.plan-sku-quote-generator .toggle-arrow {
    width: 0;
    height: 0;
    border-left: 5px solid var(--psk-text-3);
    border-top: 4px solid transparent;
    border-bottom: 4px solid transparent;
    flex-shrink: 0;
    transition: transform 0.15s ease;
}

.plan-sku-quote-generator .quote-section:not(.collapsed) .toggle-arrow {
    transform: rotate(90deg);
}

/* 收起时隐藏产品网格（已勾选项保持选中，计数徽标可见） */
.plan-sku-quote-generator .quote-section.collapsed .products-grid,
.plan-sku-quote-generator .quote-section.collapsed .server-options {
    display: none;
}

.plan-sku-quote-generator .quote-section.collapsed .section-title {
    margin-bottom: 0;
    padding-bottom: 0;
    border-bottom-color: transparent;
}

/* "已选 N"计数徽标（推到行尾，空时不占位） */
.plan-sku-quote-generator .section-count {
    margin-left: auto;
    padding: 2px 8px;
    border-radius: 10px;
    background: var(--psk-accent-bg);
    color: var(--psk-accent);
    font-size: 11px;
    font-weight: 500;
}

.plan-sku-quote-generator .section-count:empty {
    display: none;
}

/* --- 产品卡片行：hover 柔化、选中整卡浅蓝（:has 现代浏览器全支持） --- */
.plan-sku-quote-generator .products-grid {
    gap: 8px;
}

.plan-sku-quote-generator .quote-product-item {
    background: #fff;
    border: 1px solid var(--psk-border);
    border-radius: 6px;
    transition: border-color 0.15s, background-color 0.15s;
}

.plan-sku-quote-generator .quote-product-item:hover {
    border-color: var(--psk-border-hover);
    background: #fafbfd;
}

.plan-sku-quote-generator .quote-product-item:has(.product-select:checked),
.plan-sku-quote-generator .quote-product-item:has(.server-select:checked) {
    border-color: var(--psk-accent);
    background: var(--psk-accent-bg);
    /* 26.9.042：选中非颜色线索——左内侧 3px 蓝竖条（色弱友好） */
    box-shadow: inset 3px 0 0 var(--psk-accent);
}

.plan-sku-quote-generator .product-checkbox {
    gap: 9px;
    /* 26.9.042：紧凑行内边距同步压缩 */
    padding: 8px 10px;
}

.plan-sku-quote-generator .product-checkbox input[type="checkbox"],
.plan-sku-quote-generator .product-checkbox input[type="radio"] {
    width: 16px;
    height: 16px;
    margin-top: 2px;
    accent-color: var(--psk-accent);
}

/* 选中文字变蓝（旧规则保留，与整卡浅蓝叠加） */
.plan-sku-quote-generator .product-checkbox input[type="checkbox"]:checked + .product-info,
.plan-sku-quote-generator .product-checkbox input[type="radio"]:checked + .product-info {
    color: var(--psk-accent);
}

/* 26.9.042：产品行紧凑化——名称与价格/数量同行（名称左、价格右），
   行高近乎减半，一屏可见产品数翻倍；长名称自动换行、价格行垂直居中。
   :not(.server-info) 排除服务器选项（其容器双挂 product-info server-info
   且含多行描述列表，须保持纵向堆叠） */
.plan-sku-quote-generator .product-info:not(.server-info) {
    flex-direction: row;
    align-items: center;
    gap: 8px;
}

.plan-sku-quote-generator .product-info .product-name {
    font-size: 13px;
    line-height: 1.4;
    min-height: 0;
}

.plan-sku-quote-generator .product-price-row {
    gap: 6px;
    margin-top: 0;
    flex-shrink: 0;
}

.plan-sku-quote-generator .product-info .product-price {
    font-size: 12px;
    font-weight: 600;
    color: var(--psk-text-2);
}

/* --- 云服务器选项（与产品卡片同风格，模板已挂 quote-product-item 类） --- */
.plan-sku-quote-generator .server-options {
    gap: 8px;
}

.plan-sku-quote-generator .server-desc {
    font-size: 12px;
    line-height: 1.6;
}

/* --- 滚动条：浅色纤细（Cloudflare 风） --- */
.plan-sku-quote-generator .quote-products-list::-webkit-scrollbar {
    width: 6px;
}

.plan-sku-quote-generator .quote-products-list::-webkit-scrollbar-track {
    background: transparent;
    border-radius: 3px;
}

.plan-sku-quote-generator .quote-products-list::-webkit-scrollbar-thumb {
    background: #c9ced4;
    border-radius: 3px;
}

.plan-sku-quote-generator .quote-products-list::-webkit-scrollbar-thumb:hover {
    background: #aab2bb;
}

/* --- 响应式（覆盖段内重申，后定义优先于上方旧媒体查询） --- */
@media (max-width: 1200px) {
    .plan-sku-quote-generator .quote-generator-layout {
        grid-template-columns: minmax(0, 1fr);
        gap: 24px;
    }

    .plan-sku-quote-generator .quote-left-panel {
        max-height: none;
        gap: 16px;
    }

    /* 单列布局下产品列表随页面自然滚动 */
    .plan-sku-quote-generator .quote-products-list {
        overflow: visible;
    }
}

@media (max-width: 768px) {
    .plan-sku-quote-generator {
        padding: 16px 14px 24px;
    }

    .plan-sku-quote-generator .customer-info-section,
    .plan-sku-quote-generator .discount-section,
    .plan-sku-quote-generator .quote-section {
        padding: 14px;
    }

    /* 移动端小屏字段全部单列 */
    .plan-sku-quote-generator .customer-info-form {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    /* iOS 防 focus 自动放大：输入字号 ≥16px */
    .plan-sku-quote-generator .customer-info-form input[type="text"],
    .plan-sku-quote-generator .customer-info-form input[type="email"],
    .plan-sku-quote-generator .discount-input-group input {
        font-size: 16px !important;
    }
}