.table-container {
    overflow-x: auto;
    position: relative;
}

.table-container table {
    border-collapse: collapse;
    width: 100%;
}

.table-container th, .table-container td {
    padding: 8px 12px;
    text-align: center;
    border: 1px solid #ddd;
    white-space: nowrap; /* Prevent text from wrapping */
    width: 200px; /* Set a fixed width for each column */
}

.fixed-column {
    position: -webkit-sticky; /* For Safari */
    position: sticky;
    left: 0;
    background-color: #fff; /* Optional: Add a background color */
    z-index: 1; /* Ensure the column is above other content */
}

.wp-block-table.is-style-stripes .fixed-column {
    background-color: #f9f9f9; /* Match the stripe color if using striped rows */
}

.wp-block-table.is-style-stripes th, .wp-block-table.is-style-stripes td {
    font-size: 12 px;
    line-height: 1.1;
}

/* Button link style */
.button-link {
    display: inline-block;
    padding: 5px 10px;
    margin: 0;
    text-decoration: none;
    color: #fff;
    background-color: #0073aa;
    border: none;
    border-radius: 3px;
    cursor: pointer;
}

.button-link:hover {
    background-color: #005f8d;
}

/* 商品列表副标题字体 */
ul.products li.product p {
    font-size: 13px; /* 替换为你希望的字体大小 */
}

body .direct-checkout {
    margin-left: 10px !important;
 /* checkout按钮边距，调整这个值以获得所需的间距 */
}

/*弹窗联系表单按钮居中*/
.uagb-block-1b43c6ea .uagb-forms-main-form .uagb-forms-main-submit-button-wrap {
    text-align: center !important;
}


/* 使所有商品图片为圆角 */
.woocommerce ul.products li.product img,
.woocommerce div.product div.images img {
    border-radius: 10px; /* 您可以调整这个数值来改变圆角的大小 */
}

/*弹窗联系表单，输入框输入状态下颜色*/
.dynamic-block.class-contact-form input:focus {
    border-color: #909090; /* 设置输入框在输入状态下的边框颜色 */
}

/*首页contact us按钮样式*/
.table-contact-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    background-color: #D1642E; /* 默认背景颜色 */
    color: #ffffff; /* 默认文字颜色 */
    border: 1px solid #ffffff; /* 默认白色边框 */
    border-radius: 30px;
    cursor: pointer;
    padding: 8px 15px; /* 统一内边距 */
    text-align: center;
    transition: all 0.3s ease;
    min-width: 150px; /* 防止变形的最小宽度 */
    max-height: 42px; /* 最大高度限制 */
    box-shadow: none; /* 默认无阴影 */
    box-sizing: border-box; /* 确保边框不影响尺寸 */
}

.table-contact-button:hover {
	  font-size: 17px;
    background-color: #D1642E;
    color: #ffffff;
    border: 1px solid transparent; /* 悬停时边框透明 */
    padding: 8px 15px; /* 保持内边距不变 */
    box-shadow: 5px 10px 15px 0px rgba(0,0,0,0.3); /* 增加更深的阴影增强悬浮效果 */
}

.table-contact-button-icon {
    display: flex;
    align-items: center; /* 确保垂直居中 */
    margin-right: 8px;
}

.table-contact-button-icon svg {
    fill: #ffffff; /* SVG图标填充颜色 */
    width: 20px; /* 控制SVG图标宽度 */
    height: 20px; /* 控制SVG图标高度 */
}

.button-text {
    line-height: 1; /* 控制行高，防止意外的高度增加 */
}

.table-contact-button .table-contact-hover-icon {
    display: none; /* 默认不显示悬停的图标 */
}

.table-contact-button .table-contact-default-icon {
    display: block; /* 默认显示的图标 */
}

.table-contact-button:hover .table-contact-hover-icon {
    display: block; /* 悬停时显示悬停的图标 */
    transition: opacity 0.3s ease; /* 添加平滑过渡效果 */
}

.table-contact-button:hover .table-contact-default-icon {
    display: none; /* 悬停时不显示默认的图标 */
}

/*--------------------------------------------*/
/* 调整自定义 WooCommerce 注册表单的样式 */
.woocommerce .form-row {
    clear: both; /* 清除浮动 */
    width: 100%; /* 使得每个字段都占满整行 */
}

/* 修改 WooCommerce 注册表单中所有输入字段的边框颜色 */
.woocommerce form .form-row input,
.woocommerce form .form-row select,
.woocommerce form .form-row textarea {
    border: 1px solid #909090 !important;
}

/* First name 和 Last name 占据完整的一行 */
.woocommerce form .form-row-first,
.woocommerce form .form-row-last {
    width: 100%; /* 每个字段占满整行 */
    float: none; /* 清除浮动，不需要左右分列 */
    box-sizing: border-box; /* 内边距和边框包含在宽度内 */
    margin-bottom: 10px; /* 底部边距增加空间 */
}

/* 设置占位符字体大小 */
.woocommerce form .form-row input::placeholder,
.woocommerce form .form-row select::placeholder,
.woocommerce form .form-row textarea::placeholder {
    font-size: 15px !important; /* 设置占位符字体大小 */
}

.woocommerce .form-row-wide label:first-of-type {
    display: block; /* 确保标题独占一行 */
    margin-bottom: 10px; /* 添加底部边距 */
}


/* 调整复选框标签的布局，确保它们不会与标题重叠 */
.woocommerce label.checkbox {
    display: block; /* 使每个复选框都独占一行 */
    margin-top: 5px; /* 上边距，避免与上面的文案重叠 */
}

/* 特定处理，使得复选框之上的标题单独占据一行 */
.woocommerce p.form-row-wide label:first-of-type {
    display: block; /* 单独占据一行 */
    margin-bottom: 5px; /* 添加底部边距，确保与复选框有足够间隔 */
}

/* 复选框具体样式 */
input[type="checkbox"] {
    -webkit-appearance: none;  /* 移除默认的浏览器样式 */
    -moz-appearance: none;
    appearance: none;
    background-color: #fff;   /* 设置背景颜色为白色 */
    border: 2px solid #ccc;   /* 设置边框颜色和宽度 */
    cursor: pointer;          /* 设置鼠标样式为指针 */
    width: 16px;              /* 设置宽度 */
    height: 16px;             /* 设置高度 */
    vertical-align: middle;   /* 垂直对齐 */
    position: relative;       /* 相对定位，为after伪元素定位做准备 */
    margin-right: 5px;        /* 在复选框和文本之间添加间隔 */
    padding: 5px;             /* 设置内边距 */
}

/* 当复选框被选中时的样式 */
input[type="checkbox"]:checked {
    background-color: #606060; /* 选中状态的背景颜色 */
    border-color: #606060;     /* 选中状态的边框颜色 */
}

/* 选中状态下的勾选标记样式 */
input[type="checkbox"]:checked:after {
    content: '';               /* 添加内容 */
    position: absolute;        /* 绝对定位 */
    left: 4px;                 /* 位置调整 */
    top: 1px;
    width: 5px;
    height: 10px;
    border: solid white;       /* 白色勾选 */
    border-width: 0 2px 2px 0; /* 边框宽度设置 */
    transform: rotate(45deg);  /* 旋转形成勾选符号 */
}

/*------------------------*/
/* 商品详情页价格表格样式 */
.price-table {
    width: 100%;                /* 设置表格宽度为100%，根据需要调整 */
    margin: 20px auto;          /* 上下外边距20px，左右自动（居中） */
    border-collapse: separate;  /* 取消边框合并 */
    border-spacing: 0;          /* 边框间距设为0 */
    text-align: center;         /* 文本居中 */
    border: none;               /* 无外框 */
}

.price-table th,
.price-table td {
    padding: 8px;               /* 单元格内边距 */
    border: none;               /* 无内框 */

}

.price-table th {
    background-color: #ffffff;  /* 表头背景色为白色 */
    color: inherit;             /* 表头字体颜色继承 */
    font-weight: bold;          /* 表头字体粗体 */
    border-bottom: 2px solid #000000; /* 表头下部边框 */
}

.price-table td {
    text-align: center;         /* 单元格文本居中 */
}

.price-table tr:nth-child(odd) td {
    background-color: #ffffff;  /* 奇数行背景色为fafafa */
}

.price-table tr:nth-child(even) td {
    background-color: #fafafa;  /* 偶数行背景色为白色 */
}

.price-table tr:last-child td {
    background-color: #ffffff;  /* 最后一行背景色为白色 */
    border-bottom: 1px solid #fafafa; /* 最下方边框 */
}

.price-table td {
    font-size: 15px;            /* 表格内容字体大小 */
}


/*-------------------------------*/
/* 联系表单样式 */
/* 使表单按钮居中对齐 */
.wpforms-container.popup_contact_form {
    text-align: center;
}

/* 设置按钮圆角，并继承主题按钮样式，使用更具体的选择器 */
.contact_form_button.submit {
    border-radius: 25px !important; /* 设置为25px圆角，你可以根据需要调整 */
    padding: 10px 20px !important; /* 设置按钮内边距，可以根据需要调整 */
    background-color: #cd7f32 !important; /* 继承主题按钮的背景颜色 */
    color: #ffffff !important; /* 继承主题按钮的文字颜色 */
    border: inherit !important; /* 继承主题按钮的边框样式 */
    font-size: 15 !important; /* 继承主题按钮的字体大小 */
 			font-weight: 500; /* 字体粗细 */
    cursor: pointer; /* 鼠标悬停时显示指针 */
}

/* 鼠标悬停和点击效果，使用更具体的选择器 */
.contact_form_button.submit:hover {
    background-color: #d1642e !important; /* 可以设置成主题按钮的悬停背景颜色 */
}

/* Contact page form */
/* 调整表单标题字体weight */
.contact_page_form .wpforms-field-label {
    font-weight: 400 !important; /* 设置字体weight为400 */
    font-size: 15px !important; /* 设置标题字体大小为15px */
    margin-bottom: 10px !important; /* 增加下边距 */
}

/* 增加表格的内边距，仅调整左右间距 */
.contact_page_form {
    padding: 0 20px !important; /* 上下内边距设置为0，左右内边距增加到20px */
    margin-top: 10px !important; /* 减少表单的上下外边距 */
    margin-bottom: 10px !important; /* 减少表单的上下外边距 */
}

/* 增加表格的外边距 */
.contact_page_form .wpforms-field {
    margin-bottom: 20px !important; /* 设置表格外边距，可以根据需要调整 */
}

/* 调整占位符的字体大小 */
.contact_page_form input::placeholder,
.contact_page_form textarea::placeholder {
    font-size: 15px !important; /* 设置占位符字体大小为15px */
}

/* 调整输入框和文本区域的字体大小 */
.contact_page_form input,
.contact_page_form textarea {
    font-size: 15px !important; /* 设置输入框和文本区域的字体大小为15px */
}

/* Popup Contact form */
/* 调整占位符的字体大小 */
.popup_contact_form input::placeholder,
.popup_contact_form textarea::placeholder {
    font-size: 15px !important; /* 设置占位符字体大小为15px */
}

/*------------------------------*/
/*改变商品详情页布局*/
.summary.entry-summary {
    display: flex;
    flex-direction: column; /* 确保内容从上到下排列 */
    width: 100%;
    box-sizing: border-box;
    position: relative; /* 确保子元素可以定位 */
}

.woocommerce-product-details__short-description,
.variations_form.cart {
    width: 68%; 
    box-sizing: border-box;
			margin-right: 32%;
}

#get-a-quote-message, #price-table-container {
    position: absolute; /* 将表格定位到父元素内的右侧 */
    top: 0;
    right: 0;
    width: 30%; /* 根据需要调整此宽度 */
    box-sizing: border-box;
    margin: 0; /* 清除默认外边距 */
    padding: 0; /* 清除默认内边距 */
}

#price-table-container::before {
    content: '';
    position: absolute;
    left: -10px; /* 确保分割线与表格之间有些间距 */
    top: 0;
    bottom: 0;
    width: 1px;
    background-color: #f5f5f7;
    height: 100%; /* 确保分割线高度与容器高度一致 */
}

/*----------------------------------*/
/* 商品详情页未登录时提示查看报价单文案和按钮的样式*/
/* 调整未登录时的信息样式 */
#get-a-quote-message {
    text-align: center; /* 文案和按钮居中 */
    margin: 20px 0; /* 添加上下外边距 */
}

#get-a-quote-message p {
    font-weight: bold; /* 文案粗体 */
    font-size: 16px; /* 设置字体大小 */
}

.get-quote-button {
    display: inline-block; /* 按钮以行内块显示 */
    padding: 5px 20px; /* 内边距 */
    background-color: #cd7f32; /* 按钮背景颜色 */
    font-weight: bold; /* 文案粗体 */
    color: #ffffff; /* 按钮字体颜色 */
    text-decoration: none; /* 移除文本下划线 */
    border-radius: 25px; /* 按钮圆角 */
    font-size: 15px; /* 按钮字体大小 */
}

.get-quote-button:hover {
    font-weight: bold; /* 文案粗体 */
    color: #ffffff; /* 按钮字体颜色 */
    background-color: #D1642E; /* 鼠标悬浮时按钮背景颜色 */
}