@import url("https://fonts.googleapis.com/css2?family=Inter+Tight:ital,wght@0,200;0,300;0,400;0,500;0,600;0,700;0,800;1,100&display=swap");

:root {
  --o: #92ff63;
  --d: #ff7a7a;
  --b: #ffe67a;
  --lp: #ffc48a;
  --empty: rgb(200, 200, 200);
}

.expertizWidget {
  font-family: "Inter Tight", sans-serif;
  width: 100%;
}
.expertizWidget.is-interactive{display:flex;flex-direction:column;gap:1rem;align-items:stretch;width:100%;}
.expertizWidget.is-readonly {display:block;width:100%;max-width:640px;}
.expertizReadOnlyStack{display:flex;flex-direction:column;gap:.9rem;width:100%;}
.expertizCanvasWrap {background:#fff; border:1px solid #e5e7eb; border-radius:18px; padding:1rem; box-shadow:0 8px 30px rgba(15,23,42,.06);}
.expertizWidget .svg {width:100%; max-width:100%; margin:0 auto;}
.expertizWidget.is-interactive .svg{max-width:980px;}
.expertizWidget .svg svg {width:100%; height:auto; display:block;}
.expertizWidget path[id^="parca"]{stroke:#cbcbcb; stroke-width:1px; transition:fill .2s ease, opacity .2s ease; cursor:pointer;}
.expertizWidget path[id^="parca"]:hover{opacity:.82;}
.expertizPanel,
.expertizLegendPanel {
  background: #1f2c40;
  color: #fffbf9;
  border-radius: 18px;
  padding: 1.5rem;
  border:1px solid rgba(255,255,255,.05);
}
.expertizPanel--interactive{background:#fff;color:#0f172a;border:1px solid rgba(15,23,42,.08);box-shadow:0 8px 30px rgba(15,23,42,.06);}
.expertizPanelHead{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;margin-bottom:1rem;flex-wrap:wrap;}
.expertizPanelHead h3{margin:0 0 .35rem;font-size:1.1rem;font-weight:800;color:#0f172a;}
.expertizPanelHead p{margin:0;color:#64748b;font-size:.92rem;line-height:1.6;}
.expertizCanvasWrap--interactive{padding:1.25rem;}
.expertizStatusBar{display:flex; flex-wrap:wrap; gap:.6rem; margin-bottom:1rem;}
.expertizStatusBar .legend-chip{border:none; background:#00000033; color:#fff; padding:.6rem .9rem; border-radius:999px; font-size:.8rem; font-weight:700;}
.expertizStatusBar .legend-chip.is-active{background:#fff; color:#1f2c40;}
.ekspertizInputsContainer {
  display:flex;
  flex-wrap:wrap;
  gap:.85rem;
  width:100%;
  margin-bottom:1rem;
}
.expertizWidget.is-interactive .ekspertizInputsContainer .form-group{flex:0 0 calc(25% - .85rem);min-width:170px;}
.expertizWidget .form-group label {font-size: .8em; margin-bottom: .5em; display: block; color: #c6d0df;}
.expertizWidget select.form-control {
  background-clip: padding-box; display: block; width: 100%; padding: .7rem 2rem .7rem 1rem; font-size: .78rem; font-weight: 700; line-height: 1.7; color: white; background-color: #00000033; background-repeat: no-repeat; background-position: right .75rem center; background-size: 20px 20px; border: 1px solid rgba(8, 60, 130, 0.07); border-radius:12px; appearance:none;
}
.expertizWidget select.form-control:focus {border:1px solid #93c5fd; outline:0; box-shadow:0 0 0 3px rgba(147,197,253,.18);}
.expertizActionsRow{display:flex; justify-content:flex-end; align-items:center;}
.expertizWidget .download {background: #b4c4d1; font-size: 1rem; font-weight:800; padding: .75em 1.25em; border: none; border-radius:12px; color: #1f2c40; transition: all .3s ease;}
.expertizWidget .download:hover {background: white; color: #1f2c40;}
.expertizLegendPanel h3{margin:0 0 .35rem; color:#fff; font-size:1.1rem;}
.expertizLegendPanel p{margin:0; color:rgba(255,255,255,.78);}
.expertizLegendPanel--top{width:100%; padding:1rem 1.1rem;}
.expertizLegendList{display:flex;flex-direction:column;gap:.75rem;}
.expertizLegendList--top{gap:.85rem;}
.expertizLegendRow{display:flex;flex-wrap:wrap;gap:.55rem .75rem;align-items:center;}
.expertizLegendItem{display:inline-flex; align-items:center; gap:.55rem; font-weight:700; white-space:nowrap; font-size:.88rem; line-height:1.2;}
.legend-dot{display:inline-block; width:16px; height:16px; border-radius:4px; background:var(--empty); border:1px solid rgba(255,255,255,.18);}
.dot-original{background:var(--o);} .dot-painted{background:var(--b);} .dot-local{background:var(--lp);} .dot-changed{background:var(--d);}
.detail-tab-panel .expertizWidget{margin-top:1rem;}
@media (max-width: 1199px){.expertizWidget.is-interactive .ekspertizInputsContainer .form-group{flex:0 0 calc(33.333% - .85rem);}}
@media (max-width: 991px){.expertizWidget .svg{max-width:100%;}.expertizWidget.is-interactive .ekspertizInputsContainer .form-group{flex:0 0 calc(50% - .85rem);}.expertizActionsRow{justify-content:stretch;}.expertizWidget .download{width:100%;}}
@media (max-width: 640px){.expertizWidget.is-interactive .ekspertizInputsContainer .form-group{flex:1 1 100%;min-width:100%;}}

.expertizCanvasWrap{position:relative;overflow:hidden;}
.expertizTooltip{position:absolute;z-index:10;pointer-events:none;background:rgba(15,23,42,.94);color:#fff;padding:.65rem .75rem;border-radius:12px;box-shadow:0 12px 28px rgba(15,23,42,.28);display:grid;gap:.1rem;font-size:.8rem;min-width:140px;}
.expertizTooltip strong{font-size:.86rem;line-height:1.2;}
.expertizTooltip span{color:rgba(255,255,255,.78);font-weight:700;}
.expertizMiniSummary{display:flex;flex-wrap:wrap;gap:.5rem;}
.expertizMiniPill{display:inline-flex;align-items:center;justify-content:center;padding:.45rem .65rem;border-radius:999px;font-size:.74rem;font-weight:800;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.05);}
.expertizMiniPill.is-original{color:#204d10;background:rgba(146,255,99,.24)}
.expertizMiniPill.is-painted{color:#6b5600;background:rgba(255,230,122,.24)}
.expertizMiniPill.is-local_painted{color:#7c4200;background:rgba(255,196,138,.24)}
.expertizMiniPill.is-changed{color:#7a1111;background:rgba(255,122,122,.22)}
.detail-expertise-grid{margin-top:1rem;}
.detail-expertise-tabs{display:flex;gap:.75rem;flex-wrap:wrap;margin-top:1rem;margin-bottom:1rem;}
.detail-expertise-tab-btn{border:1px solid #dbe5f0;background:#fff;border-radius:999px;padding:.7rem 1rem;font-weight:800;font-size:.82rem;color:#1e293b;}
.detail-expertise-tab-btn.is-active{background:#111827;color:#fff;border-color:#111827;}
.detail-expertise-subpanel[hidden]{display:none!important;}
.detail-expertise-topstats{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:.85rem;margin-top:1rem;margin-bottom:1rem;}
.detail-expertise-stat{border:1px solid #e5e7eb;background:#fff;border-radius:16px;padding:1rem;display:grid;gap:.2rem;}
.detail-expertise-stat strong{font-size:1.35rem;line-height:1;color:#111827;}
.detail-expertise-stat span{font-size:.82rem;color:#64748b;font-weight:700;}
.detail-expertise-report-frame{width:100%;min-height:760px;border:1px solid #e5e7eb;border-radius:18px;background:#fff;}
.detail-expertise-report-link{display:inline-flex;align-items:center;gap:.55rem;padding:.8rem 1rem;border-radius:12px;background:#111827;color:#fff;font-weight:800;}
@media (max-width: 767px){.detail-expertise-report-frame{min-height:420px;}}

.expertizStatusBar{display:none !important;}
.expertizWidget.is-interactive .form-group label{color:#334155;font-weight:700;}
.expertizWidget.is-interactive select.form-control{background-color:#fff;color:#0f172a;border:1px solid #dbe5f0;}
.expertizWidget.is-interactive .download{background:#2563eb;color:#fff;}
.expertizWidget.is-interactive .download:hover{background:#1d4ed8;color:#fff;}
.expertizWidget.is-interactive .ekspertizInputsContainer{margin-bottom:0;}
.expertise-layout-single,.expertise-card-visual-full{width:100%;max-width:100%;}

.expertizWidget.is-interactive .expertizPanel--interactive{
  width:100%;
}
.expertizWidget.is-interactive .ekspertizInputsContainer{
  display:flex;
  flex-wrap:wrap;
  align-items:flex-start;
  justify-content:flex-start;
  gap:12px;
  margin-top:12px;
}
.expertizWidget.is-interactive .ekspertizInputsContainer .form-group{
  flex:0 0 calc(20% - 12px);
  min-width:185px;
  margin:0;
}
.expertizWidget.is-interactive .ekspertizInputsContainer .form-group label{
  color:#0f172a;
  font-size:12px;
  font-weight:800;
  margin-bottom:6px;
}
.expertizWidget.is-interactive .ekspertizInputsContainer .form-control{
  min-height:44px;
  border-radius:12px;
  border:1px solid #dbe5f0;
  background:#fff;
  color:#0f172a;
  width:100%;
}
.expertizWidget.is-interactive .expertizCanvasWrap--interactive{
  width:100%;
  background:#fff;
  border:1px solid #e5e7eb;
  border-radius:18px;
  padding:18px;
}
.expertizWidget.is-interactive .svg{
  width:100%;
  max-width:980px;
  margin:0 auto;
}
@media (max-width: 1280px){
  .expertizWidget.is-interactive .ekspertizInputsContainer .form-group{flex:0 0 calc(25% - 12px);}
}
@media (max-width: 1024px){
  .expertizWidget.is-interactive .ekspertizInputsContainer .form-group{flex:0 0 calc(33.333% - 12px);}
}
@media (max-width: 768px){
  .expertizWidget.is-interactive .ekspertizInputsContainer .form-group{flex:0 0 calc(50% - 12px);min-width:0;}
}
@media (max-width: 520px){
  .expertizWidget.is-interactive .ekspertizInputsContainer .form-group{flex:1 1 100%;}
}

/* Smaller expertise template */
.expertizWidget.is-interactive .expertizCanvasWrap--interactive{padding:12px 14px;}
.expertizWidget.is-interactive .svg svg{max-height:340px; width:auto; max-width:100%; margin:0 auto; display:block;}
@media (max-width: 991px){.expertizWidget.is-interactive .svg svg{max-height:none; width:100%;}}

/* Detail expertise cleanup */
.detail-expertise-visual--compact{width:100%;}
.detail-expertise-visual--compact .expertizWidget.is-readonly{display:block;max-width:100%;}
.detail-expertise-visual--compact .expertizCanvasWrap{max-width:760px;margin:0 auto;padding:1rem 1rem .75rem;}
.detail-expertise-visual--compact .expertizWidget .svg{max-width:700px;}
.detail-expertise-visual--compact .expertizLegendPanel{margin-top:1rem;background:#f8fafc;color:#0f172a;border:1px solid #e5e7eb;padding:1rem 1.1rem;}
.detail-expertise-visual--compact .expertizLegendPanel h3{color:#0f172a;font-size:1rem;margin-bottom:.2rem;}
.detail-expertise-visual--compact .expertizLegendPanel p{color:#64748b;margin-bottom:.75rem;font-size:.9rem;}
.detail-expertise-visual--compact .expertizLegendList{display:flex;flex-wrap:wrap;gap:.55rem .75rem;}
.detail-expertise-visual--compact .expertizLegendItem{font-size:.82rem;color:#334155;background:#fff;border:1px solid #e5e7eb;border-radius:999px;padding:.45rem .7rem;}
.detail-expertise-grid{display:none!important;}
@media (max-width: 767px){.detail-expertise-visual--compact .expertizCanvasWrap{padding:.75rem;}.detail-expertise-visual--compact .expertizWidget .svg{max-width:100%;}.detail-expertise-visual--compact .expertizLegendList{display:flex;flex-direction:column;align-items:flex-start;}}

/* Detail expertise simplified */
.detail-expertise-report-inline{margin-top:1rem;}
.detail-expertise-visual--compact .expertizCanvasWrap,
.detail-expertise-visual--compact .expertizLegendPanel,
.detail-expertise-report-inline{max-width:760px;margin-left:auto;margin-right:auto;}
.detail-expertise-visual--compact .expertizLegendPanel{width:100%;box-sizing:border-box;}
.detail-expertise-visual--compact .expertizLegendPanel h3,.detail-expertise-visual--compact .expertizLegendPanel p{display:block;}
.detail-expertise-tabs,.detail-expertise-topstats,.paint-status-pills,.detail-expertise-grid{display:none!important;}

@media (max-width: 640px){
  .expertizLegendRow{gap:.45rem .55rem;}
  .expertizLegendItem{font-size:.82rem;}
  .expertizLegendPanel--top{padding:.9rem;}
}

/* Detail expertise full-width layout fix */
.detail-expertise-visual--compact{width:100%;max-width:100%;}
.detail-expertise-visual--compact .expertizWidget,
.detail-expertise-visual--compact .expertizWidget.is-readonly,
.detail-expertise-visual--compact .expertizReadOnlyStack,
.detail-expertise-visual--compact .expertizCanvasWrap,
.detail-expertise-visual--compact .expertizLegendPanel,
.detail-expertise-report-inline{width:100%;max-width:100%;}
.detail-expertise-visual--compact .expertizCanvasWrap,
.detail-expertise-visual--compact .expertizLegendPanel,
.detail-expertise-report-inline{margin-left:0;margin-right:0;}
.detail-expertise-visual--compact .expertizCanvasWrap{padding:1rem 1.1rem .9rem;}
.detail-expertise-visual--compact .expertizWidget .svg{max-width:none;width:100%;}
.detail-expertise-visual--compact .expertizWidget .svg svg{width:100%;height:auto;max-height:none;}
.detail-expertise-visual--compact .expertizLegendPanel--top{display:flex;flex-direction:column;gap:.7rem;}
.detail-expertise-visual--compact .expertizLegendPanel--top h3,
.detail-expertise-visual--compact .expertizLegendPanel--top p{margin:0;}
.detail-expertise-visual--compact .expertizLegendList--top{display:flex;flex-direction:column;gap:.7rem;width:100%;}
.detail-expertise-visual--compact .expertizMiniSummary{display:flex;flex-wrap:wrap;gap:.55rem .6rem;width:100%;}
.detail-expertise-visual--compact .expertizLegendRow{display:flex;flex-wrap:wrap;gap:.55rem .6rem;width:100%;align-items:center;}
.detail-expertise-visual--compact .expertizLegendItem{max-width:100%;white-space:normal;line-height:1.2;}
@media (max-width: 767px){
  .detail-expertise-visual--compact .expertizCanvasWrap{padding:.85rem;}
  .detail-expertise-visual--compact .expertizLegendPanel--top{padding:.9rem;}
}

/* Detail expertise template image scale 50% desktop adaptive */
.detail-expertise-visual--compact .expertizWidget .svg svg{
  width:min(50%, 560px);
  max-width:100%;
  margin:0 auto;
  display:block;
}
@media (max-width: 1199px){
  .detail-expertise-visual--compact .expertizWidget .svg svg{
    width:min(60%, 520px);
  }
}
@media (max-width: 991px){
  .detail-expertise-visual--compact .expertizWidget .svg svg{
    width:100%;
    max-width:100%;
  }
}