.fonti-strip-section {
  padding: 8px 10px;
}

.fonti-strip {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.fonti-chip {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 6px 10px;
  border-radius: var(--radius-md);
  border: 1px solid var(--border);
  background: var(--surface-alt);
  min-width: 120px;
}

.fonti-chip-title {
  font-weight: 700;
  font-size: 13px;
  color: #0f172a;
}

.fonti-chip-sub {
  font-size: 12px;
  color: var(--text-muted);
}

.fonti-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 0;
  margin: 0;
  border-bottom: 1px solid var(--border);
}

.sidebar-panel[data-panel="fonti"] .fonti-tabs {
  position: relative;
  z-index: 6;
  background: transparent;
  padding: 0;
  margin: 0;
}

.sidebar-panel[data-panel="fonti"].active {
  display: flex;
  flex-direction: column;
  height: 100%;
}

.fonti-scroll {
  flex: 1;
  overflow-y: auto;
  padding: 0 12px 16px 2px;
  scrollbar-gutter: stable;
  direction: rtl;
}

.fonti-scroll > * {
  direction: ltr;
}

.fonti-tab-button {
  flex: 1;
  padding: 8px 10px;
  border-radius: 0;
  border: none;
  border-bottom: 2px solid transparent;
  background: transparent;
  font-size: 13px;
  font-weight: 500;
  color: var(--text-secondary);
  cursor: pointer;
  text-align: center;
  transition: color 0.15s ease, border-color 0.15s ease;
}

.fonti-tab-button:hover {
  color: var(--text-main);
}

.fonti-tab-button.active {
  background: transparent;
  color: var(--interactive);
  border-bottom-color: var(--interactive);
  font-weight: 600;
}

.fonti-tab-button:last-child {
  border-right: none;
}

.fonti-tab-panel {
  display: none;
  padding-top: 12px;
}

.fonti-tab-panel.active {
  display: block;
}

#sidebar-panel-fonti .fonti-align-shell {
  width: 100%;
  margin-left: 0;
  margin-right: 0;
}

#sidebar-panel-fonti .fonti-align-shell {
  width: min(100%, 980px);
  margin-left: auto;
  margin-right: auto;
}

#sidebar-panel-fonti .fonti-tab-panel > .section,
#sidebar-panel-fonti .fonti-tab-panel > .fonti-ade-footer,
#sidebar-panel-fonti .fonti-align-shell > .section,
#sidebar-panel-fonti .fonti-align-shell > .fonti-ade-footer {
  margin-left: 0;
  margin-right: 0;
}

#sidebar-panel-fonti .fonti-ade-footer {
  padding-left: 2px;
  padding-right: 2px;
}

#sidebar-panel-fonti .fonti-tab-panel .fonti-subsection {
  border: none;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  padding: 0;
  margin: 0 auto 10px;
}

#sidebar-panel-fonti .fonti-tab-panel .fonti-subsection .section-title-row {
  padding: 10px 2px;
  border-bottom: 1px solid #d7dfe8;
}

#sidebar-panel-fonti .fonti-tab-panel .fonti-subsection .section-title-row h2 {
  color: var(--text-secondary);
  transition: color 0.15s ease;
}

#sidebar-panel-fonti .fonti-tab-panel .fonti-subsection .section-title-row:hover h2,
#sidebar-panel-fonti .fonti-tab-panel .fonti-subsection:not(.collapsed) .section-title-row h2 {
  color: var(--interactive);
}

#sidebar-panel-fonti .fonti-tab-panel .fonti-subsection .section-body {
  padding: 10px 2px 12px;
}

#sidebar-panel-fonti .fonti-tab-panel .fonti-subsection .section-eye-btn {
  border: none;
  border-radius: 0;
  background: transparent;
}

#sidebar-panel-fonti .fonti-tab-panel .fonti-subsection .section-eye-btn svg {
  stroke: var(--text-muted);
}

#sidebar-panel-fonti .fonti-tab-panel .fonti-subsection .section-toggle {
  background: transparent;
}

#sidebar-panel-fonti .fonti-tab-panel .fonti-subsection .section-triangle {
  border-left-color: var(--text-muted);
}

#sidebar-panel-fonti .fonti-tab-panel .fonti-subsection .section-title-row:hover .section-triangle,
#sidebar-panel-fonti .fonti-tab-panel .fonti-subsection:not(.collapsed) .section-triangle {
  border-left-color: var(--interactive);
}

#fonti-panel-ade .fonti-subsection {
  margin-bottom: 6px;
}

#fonti-panel-ade .fonti-subsection .section-title-row {
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr) 22px;
  align-items: center;
  column-gap: 8px;
  min-height: 38px;
  padding: 6px 2px;
}

#fonti-panel-ade .fonti-subsection .section-title-row h2 {
  line-height: 1.15;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

#fonti-panel-ade .fonti-subsection .section-eye-btn,
#fonti-panel-ade .fonti-subsection .section-toggle,
#fonti-panel-ade .fonti-subsection .section-eye-placeholder {
  width: 22px;
  height: 22px;
  min-width: 22px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

#fonti-panel-ade .fonti-subsection .section-eye-placeholder {
  visibility: hidden;
  pointer-events: none;
}

#fonti-panel-ade .fonti-ade-footer {
  border-top: 1px solid #d7dfe8;
  padding-top: 10px;
}

.sidebar.fonti-wide .fonti-scroll {
  padding: 0 16px 16px 2px;
}

.sidebar.fonti-wide .fonti-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.sidebar.fonti-wide .fonti-grid .span-2 {
  grid-column: 1 / -1;
}

.sidebar.fonti-wide .fonti-grid .order-1 { order: 1; }
.sidebar.fonti-wide .fonti-grid .order-2 { order: 2; }
.sidebar.fonti-wide .fonti-grid .order-3 { order: 3; }
.sidebar.fonti-wide .fonti-grid .order-4 { order: 4; }
.sidebar.fonti-wide .fonti-grid .order-5 { order: 5; }
.sidebar.fonti-wide .fonti-grid .order-6 { order: 6; }
.sidebar.fonti-wide .fonti-grid .order-7 { order: 7; }

.sidebar.fonti-wide #omiChart,
.sidebar.fonti-wide #ntnChart {
  height: 240px;
}

.sidebar.fonti-wide #omiChart svg,
.sidebar.fonti-wide #ntnChart svg {
  width: 100%;
  height: 240px;
}

.sidebar.fonti-wide #ntnResidentialChart {
  height: 360px;
}

.sidebar.fonti-wide #ntnResidentialChart svg {
  width: 100%;
  height: 100%;
}

.sidebar.fonti-wide #capYoyChart {
  height: 270px;
}

.sidebar.fonti-wide #capYoyChart svg {
  width: 100%;
  height: 270px;
}

.sidebar.fonti-wide .cap-kpi-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.fonti-ade-footer {
  margin-top: 8px;
  font-size: 12px;
  line-height: 1.4;
  color: var(--text-muted);
}
