/* calc13.css — calculator13.php 页面专用样式（由内联 <style> 抽出，2026-08-10） */

/* 页面专用样式 */
:root {
--primary: #2c80ff;
--primary-light: #e6f0ff;
--primary-dark: #1a5fcc;
--text-secondary: #4a6a8a;
--border-light: #d9e4f0;
}


.calculator-wrapper {
display: grid;
grid-template-columns: 1fr 1fr;
gap: max(12px, var(--column-gap, 16px));
margin-top: 0;
}


@media (max-width: 1100px) {
.calculator-wrapper { grid-template-columns: 1fr 1fr; }
}


@media (max-width: 960px) {
.calculator-wrapper { 
grid-template-columns: 1fr;
gap: 16px;
}
}


.input-section, .result-section {
display: flex;
flex-direction: column;
gap: 10px;
background: white;
border-radius: 0;
padding: 20px;
box-shadow: 0 2px 8px rgba(0,0,0,0.06);
border: 1px solid #eaeef5;
}


.calc-block {
background: white;
border-radius: 0;
border: 1px solid #ddeee6;
overflow: hidden;
box-shadow: 0 2px 6px rgba(0,0,0,.04);
}


.block-content { padding: 10px 12px; }


.form-row.one { grid-template-columns: 1fr; }


.input-item { display: flex; flex-direction: column; gap: 2px; }


.input-item .unit { color: #8ab09a; font-size: .72rem; margin-left: 3px; }


.input-item input, .input-item select {
padding: 5px 7px;
border: 1px solid var(--border-light);
border-radius: 0;
font-size: .85rem;
background: var(--white);
}


.input-item input:focus, .input-item select:focus {
outline: none;
border-color: var(--primary);
box-shadow: 0 0 0 2px rgba(44,128,255,.12);
}


.load-item-row input, .load-item-row select {
padding: 5px 7px;
border: 1px solid var(--border-light);
border-radius: 0;
font-size: .85rem;
width: 100%;
min-width: 0;
}


.load-item-row select {
background: white;
}


.load-item-row input[type="number"] {
text-align: right;
}


.load-item-row .del-btn {
background: var(--danger); color: white; border: none; border-radius: 0;
width: 28px; height: 28px; cursor: pointer; font-size: 1rem; line-height: 28px; text-align: center;
transition: background 0.2s;
}


.load-item-row .del-btn:hover {
background: var(--danger);
}


.btn {
padding: 12px 24px;
border: none;
border-radius: 0;
font-weight: 600;
font-size: .95rem;
cursor: pointer;
transition: .25s;
display: inline-flex;
align-items: center;
justify-content: center;
gap: 8px;
min-height: 44px;
}


.action-row { display: flex; gap: 10px; flex-wrap: wrap; }


/* 示意图 */
#plateSketch { 
width: 100%; 
background: #eef6f1; 
border-radius: 0; 
display: block;
min-height: 220px;
}


/* 结果 */
.result-grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 12px;
margin-bottom: 15px;
}


@media (max-width: 600px) {
.result-grid { grid-template-columns: 1fr; }
}


.result-card {
background: var(--primary-light);
border-radius: 0;
padding: 15px;
border-left: 5px solid var(--primary);
box-shadow: 0 2px 4px rgba(0,0,0,0.05);
}


.result-card.highlight { 
border-left-color: var(--danger); 
background: #fdf3f3;
}


.result-card.blue { 
border-left-color: var(--primary); 
background: var(--primary-50);
}


.result-card .rc-label { 
font-size: .85rem; 
color: var(--text-secondary); 
margin-bottom: 5px;
font-weight: 500;
}


.result-card .rc-value { 
font-size: 1.5rem; 
font-weight: 700; 
color: var(--primary); 
margin: 5px 0;
letter-spacing: -0.5px;
}


.result-card .rc-value small {
font-size: .9rem;
font-weight: 500;
color: var(--gray-500);
}


.result-card.highlight .rc-value { color: var(--danger); }


.result-card.blue .rc-value { color: var(--primary); }


.placeholder-tip {
text-align: center; 
padding: 50px 20px; 
color: #7aaa90; 
font-size: 1rem;
background: #f8fdfa;
border-radius: 0;
border: 2px dashed #d9e4f0;
}


.placeholder-tip i { font-size: 3.5rem; display: block; margin-bottom: 15px; color: #a0c4b0; }


/* 弯矩曲线简图标注 */
.moment-chart { 
width: 100%; 
height: 140px; 
background: #f5fbf8; 
border-radius: 0; 
display: block;
}


/* ========== 右键菜单（表格行管理） ========== */
#rowContextMenu {
display: none;
position: fixed;
z-index: 20000;
min-width: 156px;
background: var(--white);
border: 1px solid #d9e4f0;
border-radius: 0;
box-shadow: 0 6px 20px rgba(0,0,0,.18);
padding: 5px 0;
font-size: .9rem;
user-select: none;
}


#rowContextMenu .ctx-item {
padding: 8px 16px;
cursor: pointer;
color: var(--gray-900);
display: flex;
align-items: center;
gap: 8px;
transition: background .12s;
}


#rowContextMenu .ctx-item:hover { background: var(--primary-50); color: var(--primary-dark); }


#rowContextMenu .ctx-item.danger { color: var(--danger); }


#rowContextMenu .ctx-item.danger:hover { background: #fef2f2; }


#rowContextMenu .ctx-divider {
height: 1px; background: #eaeef5; margin: 4px 0;
}


/* 荷载设置表头：与 load-item-row 六列对齐 */
.u-st171 {
display: grid;
grid-template-columns: 70px 1fr 60px 60px 60px 60px;
gap: 6px;
align-items: center;
padding: 6px 8px;
margin-bottom: 6px;
background: var(--gray-050);
border-bottom: 1px solid var(--gray-200);
font-size: .8rem;
font-weight: 500;
color: var(--gray-500);
}


.u-st171 span { text-align: center; }


/* 荷载行：六列网格（1 select + 5 input） */
.load-item-row {
display: grid;
grid-template-columns: 70px 1fr 60px 60px 60px 60px;
gap: 6px;
align-items: center;
padding: 5px 8px;
border-bottom: 1px solid var(--gray-100);
cursor: context-menu;
transition: background .15s;
}


.load-item-row:hover { background: #eef6f1; }


.load-item-row.ctx-target { background: var(--primary-light) !important; border-color: var(--primary) !important; }


/* 板类型自动判别提示（checkPlateType 写入） */
.auto-check-hint{
display:none;
align-items:center;
gap:8px;
margin-top:10px;
padding:8px 10px;
font-size:.8rem;
line-height:1.4;
border-left:3px solid;
background:var(--gray-050);
}


.auto-check-hint.warning{ border-left-color:var(--warning); color:#92400e; background:#fffbeb; }


.auto-check-hint.info{ border-left-color:var(--primary); color:var(--primary-dark); background:var(--primary-light); }


.auto-check-hint span{ flex:1; }