/* Shell layout + tabs */
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%;overflow:hidden;background:#F0F7F2}
.shell{display:flex;flex-direction:column;height:100vh}
.top-bar{background:linear-gradient(135deg,#1B5E20 0%,#2E7D32 100%);border-bottom:1px solid rgba(27,94,32,0.35);padding:10px 20px;display:flex;align-items:center;gap:14px;flex-shrink:0;position:relative;overflow:hidden}
.top-bar::before{content:'';position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.12),transparent);animation:scan 6s linear infinite;pointer-events:none}
@keyframes scan{0%{transform:translateX(-100%)}100%{transform:translateX(100%)}}
.logo{font-family:'Orbitron',monospace;font-size:13px;font-weight:900;color:#ffffff;letter-spacing:3px;text-shadow:0 0 8px rgba(0,0,0,.25);white-space:nowrap}
.logo span{color:#A5D6A7;font-size:11px;margin-left:6px;letter-spacing:1px}
.version{font-family:'Share Tech Mono',monospace;font-size:9px;color:rgba(255,255,255,0.72);letter-spacing:1px;margin-left:4px}
.tab-bar{background:#ffffff;border-bottom:1px solid #C8E6C9;display:flex;flex-shrink:0;overflow-x:auto}
.tab-bar::-webkit-scrollbar{height:2px}
.tab-bar::-webkit-scrollbar-thumb{background:#A5D6A7}
.tab{font-family:'Rajdhani',sans-serif;font-weight:700;font-size:12px;letter-spacing:1.5px;padding:13px 24px;background:transparent;border:none;color:#3D6B4A;cursor:pointer;white-space:nowrap;border-bottom:2px solid transparent;transition:color .2s,border-color .2s,background .2s;position:relative}
.tab:hover{color:#1B5E20;background:rgba(27,94,32,0.07)}
.tab.active{color:#1B5E20;border-bottom-color:#2E7D32;background:rgba(27,94,32,0.10)}
.tab.active::after{content:'';position:absolute;bottom:-1px;left:0;right:0;height:1px;background:rgba(46,125,50,0.5)}
.content{flex:1;display:flex;flex-direction:column;overflow:hidden;min-height:0}
.pane{min-height:0}
.corner-badge{margin-left:auto;flex-shrink:0;font-family:'Share Tech Mono',monospace;font-size:9px;color:rgba(255,255,255,0.65);letter-spacing:1px;text-align:right}
.formula-accordion{margin:24px 16px 16px;border:1px solid #c8e6c9;border-radius:6px;background:#f1f8e9;font-family:Arial,sans-serif}
.formula-accordion summary{padding:10px 16px;cursor:pointer;font-weight:700;font-size:13px;color:#1B5E20;background:#dcedc8;border-radius:6px 6px 0 0;user-select:none;list-style:none}
.formula-accordion summary::-webkit-details-marker{display:none}
.formula-accordion summary::before{content:"▶";display:inline-block;margin-right:8px;font-size:10px;transition:transform .2s}
.formula-accordion[open] summary::before{transform:rotate(90deg)}
.formula-accordion[open] summary{background:#aed581;color:#1B5E20}
.formula-content{padding:12px 20px 16px;font-size:12px;line-height:1.65;color:#333}
.formula-content h3{margin:14px 0 6px;font-size:13px;color:#1B5E20;font-weight:700;border-bottom:1px solid #c8e6c9;padding-bottom:3px}
.formula-content h3:first-child{margin-top:0}
.formula-content code{display:inline-block;background:#fff8e1;color:#bf360c;padding:3px 8px;margin:3px 0;border-radius:3px;font-family:Consolas,Monaco,monospace;font-size:12px;border:1px solid #ffe082}
.formula-content ul{margin:4px 0 8px;padding-left:22px}
.formula-content li{margin:2px 0}
.formula-content p{margin:6px 0}
.formula-content b{color:#1B5E20}

/* Master BOM */
#pane-bom h1 { font-size:16px;font-weight:700;color:#1B5E20;margin:0 0 4px;letter-spacing:.3px; }
#pane-bom .bom-subtitle { font-size:11px;color:#666;margin-bottom:18px; }
#pane-bom .bom-refresh { background:#1B5E20;color:#fff;border:none;padding:7px 18px;border-radius:5px;font-size:12px;font-weight:600;cursor:pointer;margin-bottom:16px;margin-right:8px; }
#pane-bom .bom-refresh:hover { background:#2E7D32; }
#pane-bom .bom-print { background:#C0392B;color:#fff;border:none;padding:7px 18px;border-radius:5px;font-size:12px;font-weight:600;cursor:pointer;margin-bottom:16px; }
#pane-bom .bom-print:hover { background:#E74C3C; }
#pane-bom table.master-bom-table { width:100%;border-collapse:collapse;font-size:12.5px;table-layout:fixed; }
#pane-bom thead tr { background:#E8F5E9; }
#pane-bom th { padding:7px 8px;text-align:left;border:1px solid #c8e6c9;font-weight:700;font-size:11.5px;color:#1B5E20; }
#pane-bom th.num { text-align:center;width:42px; }
#pane-bom th.qty { text-align:center;width:80px; }
#pane-bom th.unit { text-align:center;width:60px; }
#pane-bom th.price { text-align:right;width:130px; }
#pane-bom th.total { text-align:right;width:140px; }
#pane-bom th.note { width:120px; }
/* Section header row: 8 cell, nền xanh nhạt, tên loại vật tư + Lot + 1 + sum */
#pane-bom tr.bom-section-row td { padding:8px 10px;background:#E8F5E9;border:1px solid #c8e6c9;font-size:12.5px;font-weight:700;color:#1B5E20; }
#pane-bom tr.bom-section-row td.bom-section-stt { text-align:center;letter-spacing:1px; }
#pane-bom tr.bom-section-row td.bom-section-name { letter-spacing:0.6px;text-transform:uppercase; }
#pane-bom tr.bom-section-row td.bom-section-unit { text-align:center;font-style:italic; }
#pane-bom tr.bom-section-row td.bom-section-qty { text-align:center; }
#pane-bom tr.bom-section-row td.bom-section-total { text-align:right;color:#c0392b;font-weight:800; }
#pane-bom tbody tr:not(.bom-section-row):nth-child(even) td { background:#f9fdf9; }
#pane-bom tbody tr:not(.bom-section-row):hover td { background:#f0f9f0; }
#pane-bom td { padding:6px 8px;border:1px solid #ddd;vertical-align:middle;word-wrap:break-word;overflow-wrap:break-word; }
#pane-bom td.num { text-align:center;color:#888;font-size:11px; }
#pane-bom td.qty { text-align:center;font-weight:700;color:#1B5E20; }
#pane-bom td.unit { text-align:center; }
#pane-bom td.price input { width:100%;border:none;background:transparent;text-align:right;font-size:12px;padding:2px 4px;font-family:inherit;color:#333; }
#pane-bom td.total { text-align:right;font-weight:600;color:#27AE60; }
#pane-bom td.note input { width:100%;border:none;background:transparent;font-size:11px;padding:2px 4px;font-family:inherit;color:#888; }
#pane-bom .bom-grand-total { margin-top:14px;padding:10px 16px;background:#E8F5E9;border:1.5px solid #a5d6a7;border-radius:6px;display:flex;align-items:center;justify-content:space-between; }
#pane-bom .bom-grand-total .lbl { font-weight:700;font-size:14px;color:#c0392b;letter-spacing:.5px; }
#pane-bom .bom-grand-total .val { font-weight:800;font-size:16px;color:#c0392b; }
#pane-bom .empty-note { color:#aaa;font-style:italic;font-size:12px;padding:12px;text-align:center; }
/* Print: ẩn nút, hiện chỉ bảng */
@media print {
  body * { visibility:hidden; }
  #pane-bom, #pane-bom * { visibility:visible; }
  #pane-bom { position:absolute;left:0;top:0;width:100%;padding:10mm; }
  #pane-bom .bom-refresh, #pane-bom .bom-print { display:none !important; }
  #pane-bom td.note input { display:none; }
  #pane-bom th.note, #pane-bom td.note { display:none; }
}

/* Phụ trợ */
#pane-phutro h1{font-size:16px;font-weight:700;color:#1B5E20;margin:0 0 4px}
#pane-phutro .pt-sub{font-size:11px;color:#666;margin-bottom:16px}
#pane-phutro table{width:100%;border-collapse:collapse;font-size:12.5px}
#pane-phutro th{padding:8px 7px;border:1.5px solid #aaa;font-weight:700;background:#E8F5E9;color:#1B5E20;text-align:center}
#pane-phutro th.left{text-align:left}
#pane-phutro td{padding:6px 7px;border:1px solid #ccc;vertical-align:middle}
#pane-phutro tr.sec-row td{background:#e8f5e9;font-weight:700;color:#1B5E20;font-size:12px}
#pane-phutro input.qty-inp,#pane-phutro input.price-inp{width:100%;border:none;background:transparent;text-align:center;font-size:12px;padding:2px 4px;font-family:inherit;color:#333;outline:none}
#pane-phutro input.price-inp{text-align:right}
#pane-phutro input:focus{background:#f0f7f0;border-radius:3px}
#pane-phutro td.total-cell{text-align:right;font-weight:600;color:#27AE60}
#pane-phutro .grand-row td{font-weight:800;color:#c0392b;font-size:13px;text-align:center;background:#fff8f8;border:1.5px solid #aaa;padding:9px 8px}
#pane-phutro .grand-row td.grand-val{text-align:right;font-size:14px}
#pane-phutro .note-inp{width:100%;border:none;background:transparent;font-size:11px;padding:2px 4px;font-family:inherit;color:#888;outline:none}

.logo-icon{
  width:36px;height:36px;
  background:linear-gradient(135deg,#1B5E20,#43A047);
  border-radius:7px;
  display:flex;align-items:center;justify-content:center;
  font-size:20px;
  box-shadow:0 0 18px rgba(27,94,32,.45);
  flex-shrink:0;
}

/* Layout fill for tool iframes */
.content{position:relative}
.pane{flex:1;display:none;min-height:0;overflow:hidden}
.pane[style*="display: flex"],
.pane[style*="display:flex"]{/* runtime toggled via JS */}
.pane iframe{
  flex:1;
  width:100%;
  height:100%;
  min-height:0;
  border:0;
  display:block;
  background:#fff;
}