/* Competition benchmark uses the shared data-table and chart presentation. */
@import "electricity-rates.css";

.competition-section { padding-block-start: var(--space-lg); }

#company-sales { scroll-margin-top: 90px; }
.sales-meta { font-weight: 700; }
.sales-controls { margin: 20px 0; padding: 20px; border: 1px solid var(--color-rule); border-radius: 16px; min-width: 0; background: var(--color-paper-2); }
.sales-controls legend { font-weight: 700; padding-inline: 8px; }
.sales-toolbar { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 12px; }
.sales-toolbar label, .sales-picker>label:first-child { display: grid; gap: 8px; font-weight: 700; }
.sales-controls select, .sales-controls input[type="search"] { width: 100%; min-width: 0; min-height: 44px; background: white; color: var(--color-ink-2); padding: 10px; border: 1px solid var(--color-rule-2); border-radius: 8px; font: inherit; }
.sales-controls button { min-height: 44px; padding: 9px 14px; background: white; border: 1px solid var(--color-rule-2); border-radius: 8px; color: var(--color-ink-2); font: inherit; cursor: pointer; }
.sales-controls button:disabled { opacity: .5; cursor: default; }
.sales-picker { margin-block: 20px; }
.sales-picker>input { margin-top: 8px; }
.sales-check { display: flex; align-items: center; gap: 8px; min-height: 44px; }
.sales-company-list { max-height: 245px; overflow: auto; border: 1px solid var(--color-rule); border-radius: 10px; background: white; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); }
.sales-company-list label { display: grid; grid-template-columns: 20px minmax(0,1fr); align-content: center; column-gap: 8px; min-height: 60px; padding: 10px; border-bottom: 1px solid var(--color-rule); cursor: pointer; }
.sales-company-list small { grid-column: 2; color: var(--color-muted); }
.sales-company-list input { width: 18px; height: 18px; }
.sales-selection-heading { display: flex; align-items: center; gap: 16px; margin-top: 16px; }
.sales-selected { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.sales-selected button { border-left-width: 5px; text-align: left; overflow-wrap: anywhere; }
.sales-chart-card, .sales-table-card, .sales-method { margin-block: 20px; padding: 20px; min-width: 0; }
.sales-chart { position: relative; height: 390px; min-width: 0; }
.sales-chart canvas { max-width: 100%; }
.sales-chart-card p, .sales-method p, .sales-identities p { color: var(--color-muted); font-size: 13px; line-height: 1.9; overflow-wrap: anywhere; }
.sales-table-card table { width: 100%; border-collapse: collapse; font-size: 13px; }
.sales-table-card th, .sales-table-card td { padding: 12px; border-bottom: 1px solid var(--color-rule); text-align: right; white-space: nowrap; }
.sales-table-card th:first-child { text-align: left; }
.sales-table-card .table-wrap { max-height: 560px; overflow: auto; }
.sales-method summary, .sales-table-card summary, .sales-identities summary { min-height: 44px; display: list-item; align-content: center; cursor: pointer; font-weight: 700; }
.sales-identities details { border-bottom: 1px solid var(--color-rule); padding-block: 10px; }
.sales-controls :focus-visible, .sales-table-card :focus-visible, .sales-identities :focus-visible { outline: 3px solid #1666b1; outline-offset: 3px; }
@media(max-width:900px) { .sales-toolbar { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media(max-width:560px) { .sales-controls,.sales-chart-card,.sales-table-card,.sales-method { padding: 12px; } .sales-company-list { grid-template-columns: minmax(0,1fr); } .sales-chart { height: 420px; } .sales-toolbar { grid-template-columns: minmax(0,1fr); } .sales-selection-heading { flex-wrap: wrap; } }