@charset "utf-8";
/* =========================================================
   Place-order-PL_2025A.css
   Final Optimized Version 2025-10-26 (B)
   ---------------------------------------------------------
   ✅ 桌面端右侧主区块宽度最大化
   ✅ 保持表格与表单居中效果
   ✅ 保持整体与页头页脚对齐
========================================================= */

@media (min-width:1200px) {

/* ========== 1. 主区块与表单容器 ========== */
.float_right_out {
  background: #F9FAFB;
  padding: 40px 50px;
  width: 100%;
  max-width: 100%;                  /* ✅ 解除任何限制 */
  flex: 1 1 auto;                   /* ✅ 在 Grid/Flex 下自动扩展 */
  box-sizing: border-box;
}

/* 强化网格行为（当 main_container 使用 grid 布局时） */
.main_container {
  display: grid;
  grid-template-columns: 230px 1fr;  /* 左栏固定，右栏自适应 */
  align-items: stretch;
  justify-content: center;
  width: 100%;
  max-width: var(--layout-max, 1200px);
  margin: 0 auto;
}

/* ========== 2. 表单容器与内部间距 ========== */
form {
  width: 100%;
  max-width: 900px;                /* ✅ 放宽表单宽度 */
  margin: 0 auto 30px;
  padding: 30px 40px;
  background: #fff;
  border: 1px solid #D0D0D0;
  border-radius: 12px;
  box-shadow: 0 3px 10px rgba(0,0,0,0.08);
  box-sizing: border-box;
}

/* ========== 3. 通用输入样式 ========== */
input[type="text"],
input[type="email"],
input[type="number"],
select {
  padding: 6px 10px;
  font-size: 13px;
  border: 1px solid #AAA;
  border-radius: 5px;
  transition: all .25s;
}

input:focus,
select:focus {
  border-color: #007A29;
  outline: 2px solid #A9D6FF;
}

/* ========== 4. 表格基础修正 ========== */
table.main {
  border-collapse: collapse;
  width: 100%;
}

table.main td,
table.main th {
  white-space: nowrap !important;
  word-break: keep-all !important;
  overflow: visible !important;
  vertical-align: middle !important;
  font-size: 13px;
  line-height: 1.5;
}

/* 第一列：编号 */
table.main td:nth-child(1) {
  text-align: right !important;
  font-weight: bold;
  color: #004080;
  padding-right: 6px;
  width: 50px;
}

/* 第二列：标签文本 */
table.main td:nth-child(2) {
  text-align: left !important;
  padding-left: 6px !important;
  color: #004080;
  font-weight: bold;
}

/* 第三列：输入或结果内容 */
table.main td:nth-child(3) {
  text-align: left !important;
  padding-left: 4px !important;
  vertical-align: middle !important;
}

table.main td:nth-child(3) input,
table.main td:nth-child(3) select,
table.main td:nth-child(3) span,
table.main td:nth-child(3) b,
table.main td:nth-child(3) font,
table.main td:nth-child(3) p {
  text-align: left !important;
  margin-left: 0 !important;
  display: inline-block;
}

table.main td:nth-child(3) input.input1 {
  margin-right: 3px;
}

/* 特例：Total Quote Price 行保持一行 */
table.main tr:nth-child(5) td:nth-child(3) {
  white-space: nowrap !important;
}

/* 顶部提示区域左齐 */
table.main tr:first-child td[colspan="3"],
table.main tr:nth-child(2) td[colspan="3"] {
  text-align: left !important;
}

/* 底部按钮居中 */
table.main tr:last-child td[colspan],
table.main tr:last-child td[colspan] * {
  text-align: center !important;
  margin: 0 auto !important;
}

/* ========== 5. 按钮样式 ========== */
input[type="submit"],
.btn-submit,
button[type="submit"] {
  display: inline-block;
  min-width: 160px;
  background: #007A29;
  color: #fff;
  border: none;
  border-radius: 8px;
  padding: 10px 24px;
  font-weight: bold;
  cursor: pointer;
  font-size: 14px;
  transition: background 0.25s, transform 0.1s;
  margin: 10px auto 0;
}

input[type="submit"]:hover,
.btn-submit:hover,
button[type="submit"]:hover {
  background: #009933;
  transform: translateY(-1px);
}

/* ========== 6. 说明提示块 ========== */
.note {
  max-width: 900px;
  margin: 10px auto 0;
  font-size: 13px;  
  background: #FFF9E5;
  border-left: 4px solid #FFD966;
  padding: 12px 18px;
  border-radius: 6px;
}

} /* END @media (min-width:1200px) */


/* ========== 7. 行距与输入行分隔优化 (2025-10-26补丁) ========== */
table.main tr {
  height: 42px;                /* ✅ 让每行更高 */
}

table.main td {
  padding-top: 8px;            /* ✅ 上下增加内边距 */
  padding-bottom: 8px;
  vertical-align: middle;
}

/* 使输入区块更显层次 */
table.main tr + tr td {
  border-top: 1px solid #EEE;  /* ✅ 行间轻微分隔线 */
}





.checkout-hero {
  width: 92%;
  margin: 18px auto 22px auto;
  padding: 22px 26px;
  box-sizing: border-box;
  border: 1px solid #cfe3d4;
  border-left: 6px solid #0b5e2d;
  background: linear-gradient(135deg, #f6fbf7 0%, #ffffff 70%);
  border-radius: 12px;
  text-align: left;
  box-shadow: 0 4px 14px rgba(0,0,0,0.06);
}

.checkout-eyebrow {
  font-size: 13px;
  font-weight: bold;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #0b5e2d;
  margin-bottom: 8px;
}

.checkout-title {
  font-size: 28px;
  line-height: 34px;
  color: #1f2d1f;
  margin: 0 0 8px 0;
  font-weight: bold;
}

.checkout-subtitle {
  font-size: 15px;
  line-height: 22px;
  color: #4a4a4a;
  margin: 0;
}