:root{--primary-color:#00bfff;--secondary-color:#d4d5e1;--text-color:#000;--background-color:#d4d5e1;--background-color2:#222}body{background-color:var(--background-color);width:100%;height:100vh;color:var(--text-color);grid-template:"header header""sidebar main"1fr"footer footer"/0 1fr;gap:0 5px;margin:0;padding:0;font-family:Times New Roman,Times,serif;font-size:14px;display:grid}#menu_toggle{display:none}body:has(#menu_toggle:checked) aside{transform:translate(0)}h1,p{margin:0;padding:0}img{width:100%;max-width:100%;height:100%;max-height:100%}div.image{box-sizing:border-box;width:50px;padding:0 5px}a.btn{cursor:pointer;background-color:#fff;border:1px solid #ccc;border-radius:5px;padding:5px 10px;text-decoration:none}a.btn:hover{background-color:#f0f0f0}a.btn{color:#000;transition:all .3s}button{cursor:pointer;background-color:#fff;border:1px solid #ccc;border-radius:5px;padding:5px 10px;font-family:Times New Roman,Times,serif}button:hover{background-color:#f0f0f0}button{transition:all .3s}select{box-sizing:border-box;border:1px solid #ccc;border-radius:5px;padding:3px}input{box-sizing:border-box;border:1px solid #ccc;border-radius:5px;width:100%;padding:3px;display:block}.burger{cursor:pointer;width:30px;height:30px}header{background:var(--background-color2);grid-area:header;justify-content:space-between;align-items:center;padding:5px 10px;display:flex}header .info{align-items:center;gap:10px;display:flex}header .status{color:#fff}footer{background:var(--background-color2);color:#fff;grid-area:footer;justify-content:space-between;align-items:center;padding:5px;font-size:12px;display:flex}footer .feedback_btn{cursor:pointer;padding:5px 10px}footer .feedback_btn:hover{color:#00a0d1}main{grid-area:main;max-height:100%;overflow:auto;container-type:inline-size}aside{z-index:2;background:#000000e6;grid-area:sidebar;width:200px;transition:all .4s;position:sticky;transform:translate(-200px)}aside ul{margin-top:20px;margin-bottom:0;padding:0;list-style:none}aside ul li{padding:15px}aside ul li a{color:#fff;white-space:nowrap;text-overflow:ellipsis;max-width:200px;text-decoration:none;display:block;overflow:hidden}aside ul li a:hover{color:#00bfff}aside ul li a.disabled{pointer-events:none;opacity:.5;cursor:not-allowed}aside .close-menu{color:#fff;cursor:pointer;background:0 0;border:none;padding:0 5px;font-size:20px;position:absolute;top:5px;right:5px}aside .close-menu:hover{background-color:#222}.main-content{grid-template-columns:250px 1fr;gap:0 10px;padding:10px;display:grid}.input-data button{width:100%;margin-bottom:10px}.m-thermal{grid-template-columns:repeat(2,1fr);gap:5px;display:grid}.m-thermal .form_block h3{margin:0 0 5px}.m-thermal .form_block .local_fields{flex-direction:column;gap:5px;max-width:100%;display:flex}.m-thermal .valves{grid-row:1/4;grid-column-start:2}.form-element{grid-template-columns:35px 1fr 20px;align-items:center;padding:0;display:grid;position:relative}.form-element .lbl{font-size:12px;line-height:12px}.form-element .sl{width:100%;display:block}.form-element .tooltip-text{color:#fff;opacity:0;background:#000;border-radius:4px;padding:5px 8px;font-size:10px;transition:all .2s;position:absolute;bottom:80%;left:40%;transform:translate(-50%)}.form-element .lbl:hover~.tooltip-text{opacity:1}.form-element .unit{margin:0 0 0 5px;padding:0;font-size:12px;line-height:12px}.chart-wrapper{background-color:#fff;border-radius:5px;width:100%;max-width:100%;height:calc(100vh - 140px)}canvas{max-width:100%}.modal-main{border:1px solid #fff;border-radius:5px;max-width:80%;padding-top:20px;position:relative;box-shadow:0 0 2px 1px #000c}.modal-main .closeNotification{border:none;padding:2px 4px;font-size:11px;position:absolute;top:2px;right:2px}.modal-main .title{text-align:center;margin:0 0 10px}.modal-main .redirect{text-align:center;color:#00bfff;margin-top:15px;font-size:12px}.modal-main .redirect:hover{cursor:pointer;text-decoration:underline}.modal-main .actions{justify-content:center;gap:10px;margin-top:15px;display:flex}.modal-main #messageNotification{text-wrap:wrap}.modal-main form{flex-direction:column;gap:10px;display:flex}#feedback_list{max-height:300px;margin:0;padding:0;list-style:none;overflow:auto}#feedback_list li{border-bottom:1px solid #ccc;padding:10px 0}#feedback_list li .email{color:#555;font-size:12px}#feedback_list li .message{margin-top:5px}.tabs .tab{display:none}.tabs .tab.active{display:block}.tabs .tab-buttons{justify-content:space-between;margin-bottom:10px;display:flex}.tabs .tab-buttons button.active{color:#000;background:#00bfff}.tabs .chart-toggle{display:flex}.tabs .chart-toggle.hidden{display:none}.result{background-color:#fff;border:1px solid #ccc;border-radius:10px;padding:10px}.result h3{margin:0}.result #technical-params{grid-template-columns:repeat(auto-fit,200px);gap:5px 20px;display:grid}.result #technical-params .result_item{border-bottom:1px solid #ccc;grid-template-columns:50px 1fr 50px;display:grid}.result #technical-params .result_item p{text-align:left;color:#000;margin:0;padding:0}.plans{flex-direction:column;gap:10px;display:flex}.plans .plan{cursor:pointer;border:1px solid #ccc;border-radius:5px;padding:10px}.plans .plan h3{margin:0}.plans .plan:hover,.plans .plan.active{background-color:#00000020;border-color:#000}.dropdown{display:inline-block;position:relative}.dropdown-content{opacity:0;pointer-events:none;background:#fff;flex-direction:column;gap:5px 0;width:100px;padding:6px;transition:all .15s;display:flex;position:absolute;top:100%;right:0;transform:translateY(-5px);box-shadow:0 10px 20px #00000014,0 3px 6px #0000000d}.dropdown:has(>button.active):hover .dropdown-content{opacity:1;pointer-events:auto;transform:translateY(0)}