.comparison-page{display:none;min-width:0;min-height:0;padding:24px 28px 28px;border:1px solid #dfe8f1;border-radius:16px;background:#fff;box-shadow:0 8px 26px rgba(30,66,108,.05);color:#172a42}
.comparison-page.show{display:block}
.comparison-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:18px}
.comparison-heading h1{margin:0 0 5px;color:#172740;font-size:26px;line-height:1.25}
.comparison-heading p{margin:0;color:#8794a5;font-size:12px}
.comparison-count{flex:none;align-self:center;padding:7px 12px;border:1px solid #d8eee5;border-radius:999px;background:#eaf7f1;color:#168668;font-size:12px;font-weight:700}
.comparison-command{display:flex;align-items:center;flex-wrap:wrap;gap:10px;margin-bottom:16px}
.comparison-command>button,.comparison-sort button{display:inline-flex;align-items:center;justify-content:center;gap:5px;min-height:40px;padding:8px 14px;border:1px solid #dce6ee;border-radius:9px;background:#f6f9fc;color:#35506b;font-size:12px;font-weight:750}
.comparison-command>button:hover,.comparison-sort button:hover{background:#eaf4f6}
.comparison-command .comparison-add,.comparison-dialog-actions .comparison-add{border-color:#079875;background:#08a67f;color:#fff;box-shadow:0 5px 13px rgba(8,166,127,.16)}
.comparison-command .comparison-add:hover,.comparison-dialog-actions .comparison-add:hover{background:#078e6e;color:#fff}
.comparison-command .comparison-add span{font-size:18px;line-height:1}
.comparison-sort{display:flex;gap:8px}
.comparison-sort button[aria-pressed=true]{border-color:#a6d4c8;background:#eaf8f3;color:#087b61}
.comparison-command button:focus-visible,.comparison-actions button:focus-visible,.comparison-dialog button:focus-visible{outline:3px solid #49c5a8;outline-offset:2px}
.comparison-metrics{display:flex;flex-wrap:wrap;gap:8px;margin-inline-start:auto}
.comparison-metrics>div{display:flex;align-items:center;gap:10px;min-height:40px;padding:6px 12px;border:1px solid #cfe8df;border-radius:9px;background:#eaf8f3;color:#14765d;font-size:12px;font-weight:700}
.comparison-metrics strong{color:#087b61;font-size:19px;line-height:1;font-variant-numeric:tabular-nums}
.comparison-metrics .comparison-review{border-color:#f1d7d9;background:#fff3f3;color:#a4525c}
.comparison-metrics .comparison-review strong{color:#b64051}
.comparison-tools .warehouse-search{flex-basis:360px}
.comparison-result-line{margin:17px 0 9px;color:#5f7185;font-size:12px;font-weight:700}
.comparison-table-wrap{border:1px solid #dfe8f1;border-radius:12px;overflow-x:auto}
.comparison-table{width:100%;min-width:850px;border-collapse:separate;border-spacing:0;font-size:12px;line-height:1.5}
.comparison-table th{padding:13px 14px;border-bottom:1px solid #dce5ef;background:#f3f7fa;color:#607287;font-size:11px;font-weight:800;text-align:start;white-space:nowrap}
.comparison-table td{padding:12px 14px;border-bottom:1px solid #e9eef5;color:#344963;vertical-align:middle}
.comparison-table tbody tr:nth-child(even){background:#fbfdff}
.comparison-table tbody tr:hover{background:#f2f8fd}
.comparison-table tbody tr:last-child td{border-bottom:0}
.comparison-table .comparison-material{min-width:280px;max-width:500px;font-weight:650;overflow-wrap:anywhere}
.comparison-price,.comparison-difference{font-variant-numeric:tabular-nums;white-space:nowrap}
.comparison-difference.better{color:#078767;font-weight:800}
.comparison-difference.higher{color:#c04451;font-weight:800}
.comparison-difference.equal{color:#53697d}
.comparison-status{display:inline-flex;align-items:center;padding:5px 9px;border-radius:999px;background:#f0f4f8;color:#65778a;font-size:10px;font-weight:750;white-space:nowrap}
.comparison-status.better{background:#e6f7ef;color:#087f61}
.comparison-status.higher{background:#fff0f1;color:#b94352}
.comparison-status.equal{background:#eef4fb;color:#416c9a}
.comparison-actions{display:flex;align-items:center;gap:4px}
.comparison-actions button{display:grid;place-items:center;width:30px;height:30px;border:0;border-radius:7px;background:#f1f5f8;color:#54708b;font-size:16px}
.comparison-actions button:hover{background:#e4f3ee;color:#087d65}
.comparison-actions button[data-action=delete]:hover{background:#fff0f1;color:#c04451}
.comparison-empty{padding:34px!important;color:#8595a5!important;text-align:center;font-size:12px}
.comparison-pager{margin-top:14px}
.comparison-local-note{margin:14px 0 0;color:#8795a3;font-size:11px}
.comparison-dialog{width:min(580px,calc(100vw - 28px));max-height:90vh;padding:0;border:1px solid #dce7ef;border-radius:15px;background:#fff;color:#193149;box-shadow:0 24px 65px rgba(12,37,62,.24)}
.comparison-dialog::backdrop{background:rgba(12,31,52,.48)}
.comparison-dialog form{padding:23px}
.comparison-dialog-head{display:flex;align-items:center;justify-content:space-between;gap:12px}
.comparison-dialog-head h2{margin:0;font-size:21px}
.comparison-dialog-head button{width:30px;height:30px;border-radius:7px;background:#f1f5f8;color:#65798c;font-size:20px}
.comparison-dialog p{margin:5px 0 17px;color:#8795a3;font-size:11px}
.comparison-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}
.comparison-form label{display:grid;gap:6px;color:#5d7187;font-size:12px;font-weight:700}
.comparison-form .comparison-material-field{grid-column:1/-1}
.comparison-form input{width:100%;height:42px;padding:8px 10px;border:1px solid #dce5ee;border-radius:8px;background:#fff;color:#193149;font-size:13px;outline:0}
.comparison-form input:focus{border-color:#2bb493;box-shadow:0 0 0 3px rgba(43,180,147,.14)}
.comparison-form input[type=number]{direction:ltr;text-align:left}
.comparison-dialog-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:20px}
.comparison-dialog-actions button{min-height:39px;padding:8px 15px;border:1px solid #dce5ee;border-radius:8px;background:#f5f8fa;color:#35506b;font-size:12px;font-weight:700}
html[dir=rtl] .comparison-page,html[dir=rtl] .comparison-table th{text-align:right}
html[dir=ltr] .comparison-page{text-align:left}
@media(max-width:700px){.comparison-page{padding:18px 14px}.comparison-heading{flex-wrap:wrap;gap:8px}.comparison-heading h1{font-size:23px}.comparison-count{align-self:flex-start}.comparison-metrics{width:100%;margin-inline-start:0}.comparison-metrics>div{flex:1 1 140px;justify-content:space-between}}
@media(max-width:600px){.comparison-table-wrap{border:0;overflow:visible}.comparison-table{display:block;min-width:0}.comparison-table thead{display:none}.comparison-table tbody{display:grid;gap:10px}.comparison-table tr{display:grid;gap:7px;padding:12px;border:1px solid #e2e9ef;border-radius:11px;background:#fff}.comparison-table td,.comparison-table .comparison-material{display:flex;justify-content:space-between;align-items:flex-start;gap:8px;min-width:0;max-width:none;padding:0;border:0;font-size:11px;text-align:start;white-space:normal;overflow-wrap:anywhere}.comparison-table .comparison-material{padding-bottom:8px;border-bottom:1px solid #edf1f4;font-size:12px}.comparison-table td:before{content:attr(data-label);flex:none;color:#8795a3;font-size:10px;font-weight:600}.comparison-table .comparison-material:before,.comparison-table .comparison-empty:before{display:none}.comparison-table .comparison-empty{justify-content:center;padding:15px!important}.comparison-form{grid-template-columns:1fr}.comparison-form .comparison-material-field{grid-column:auto}}
