/* Explicit field layout: generic .filters .search is horizontal and unsuitable here. */
.billing-filters{display:flex;flex-wrap:wrap;align-items:flex-end;gap:16px;padding:16px 20px;background:white;border:1px solid var(--line);border-radius:12px;margin-bottom:16px}
.billing-filters label{display:flex;flex-direction:column;gap:var(--form-label-gap);min-width:150px;flex:1;font-size:13px;color:#61736c}
.billing-filters input,.billing-filters select{width:100%;min-width:0}.billing-filters button{white-space:nowrap}
.billing-summary{display:flex;flex-wrap:wrap;gap:12px 28px;margin:16px 0;color:#61736c}.billing-summary strong{margin-left:6px;color:#24353b}
.billing-list{background:white;border:1px solid var(--line);border-radius:12px;padding:0 20px}
.billing-list-head,.billing-row>summary{display:grid;grid-template-columns:minmax(140px,1.3fr) 120px minmax(120px,1fr) 48px;gap:12px;align-items:center;padding:12px 0;min-height:52px}
.billing-list-operator .billing-list-head,.billing-list-operator .billing-row>summary{grid-template-columns:minmax(140px,1.3fr) 150px 120px minmax(120px,1fr) 48px}
.billing-list-head{font-size:13px;color:#61736c}.billing-row{border-top:1px solid var(--line)}.billing-row>summary{cursor:pointer;list-style:none}.billing-row>summary::-webkit-details-marker{display:none}.billing-row>summary>*{min-width:0;overflow-wrap:anywhere}.billing-row .badge{justify-self:start}.billing-row strong{white-space:nowrap}.billing-row>summary:focus-visible{outline:2px solid #93c5fd;outline-offset:2px}
.billing-details{border-top:1px solid var(--line);padding:12px 0}.billing-line{display:flex;justify-content:space-between;gap:16px;padding:8px 0;border-bottom:1px solid var(--line)}.billing-line span{overflow-wrap:anywhere}.billing-line strong{flex-shrink:0;white-space:nowrap}.billing-line small{display:block}.billing-details button{margin-top:12px}
@media(min-width:761px) and (max-width:1000px){.billing-list-operator .billing-list-head,.billing-list-operator .billing-row>summary{grid-template-columns:minmax(0,1.3fr) 100px 100px minmax(85px,1fr) 40px}}
@media(max-width:760px){.billing-filters{padding:14px;gap:14px}.billing-filters label{min-width:120px}.billing-list{padding:0 16px}.billing-list-head{display:none!important}.billing-row>summary,.billing-list-operator .billing-row>summary{grid-template-columns:minmax(0,1fr) auto;gap:10px}.billing-row .billing-name{grid-column:1/-1}.billing-summary{gap:10px 18px}}

.billing-customer-picker{position:relative}.billing-customer-picker input{padding-right:28px;background:white}.billing-customer-picker::after{position:absolute;right:11px;top:50%;pointer-events:none}
#billing-customer-options{position:absolute;z-index:30;top:calc(100% + 4px);left:0;right:0;max-height:260px;overflow:auto;background:white;border:1px solid var(--line);border-radius:8px;box-shadow:0 6px 18px #24353b18;padding:4px}
#billing-customer-options [role=option]{padding:10px;cursor:pointer;color:#24353b}#billing-customer-options [role=option]:hover,#billing-customer-options .active{background:#eef5f2}#billing-customer-options [aria-selected=true]{font-weight:600}
.billing-customers>.billing-list-head,.billing-customers>.billing-row>summary{grid-template-columns:minmax(180px,1.7fr) repeat(3,minmax(85px,1fr)) minmax(110px,1fr) 48px}
.billing-customers> .billing-row>summary small{display:none}.billing-daily{border-top:1px solid var(--line);padding:0 16px 12px}.billing-daily>p{font-size:13px}.billing-daily>.billing-row:first-of-type{border-top:0}
@media(max-width:760px){.billing-customers>.billing-row>summary{grid-template-columns:minmax(0,1fr) auto}.billing-customers>.billing-row>summary small{display:inline;font-weight:400;color:#61736c}.billing-daily{padding:0 0 12px}}
.billing-row[open]>summary .notification-toggle:after{transform:translateY(-2px) rotate(45deg)}

.billing-customers>.billing-list-head,.billing-customers>.billing-row>summary{grid-template-columns:minmax(180px,1.8fr) repeat(4,minmax(70px,.8fr)) 75px 48px;gap:10px}.billing-period{display:block;font-size:12px;margin-top:5px;font-weight:400}.billing-free-settings{padding:12px 0}.billing-free-settings>summary{cursor:pointer;color:#61736c;font-size:13px}.billing-free-settings form{display:flex;flex-wrap:wrap;align-items:end;gap:var(--form-field-gap) 16px;padding-top:16px}.billing-free-settings label{display:flex;flex:1;min-width:140px;flex-direction:column;gap:var(--form-label-gap)}.billing-free-settings p{flex-basis:100%;margin:0}.billing-daily>.billing-row>summary{grid-template-columns:120px 140px minmax(180px,1fr) 48px}
@media(max-width:760px){.billing-customers>.billing-row>summary,.billing-daily>.billing-row>summary{grid-template-columns:minmax(0,1fr) auto}.billing-daily>.billing-row>summary>span:nth-child(3){grid-column:1/-1}}

/* The seven-column customer summary needs the same readable reflow on tablets. */
@media(min-width:761px) and (max-width:1000px){
 .operator-page .billing-customers>.billing-list-head{display:none}
 .operator-page .billing-customers>.billing-row>summary,.operator-page .billing-customers .billing-daily>.billing-row>summary{grid-template-columns:minmax(0,1fr) auto;gap:10px}
 .operator-page .billing-customers>.billing-row>summary .billing-name{grid-column:1/-1}
 .operator-page .billing-customers>.billing-row>summary small{display:inline;font-weight:400;color:#61736c}
 .operator-page .billing-customers .billing-daily>.billing-row>summary>span:nth-child(3){grid-column:1/-1}
}

/* Give the shared amount summary room without widening the page. */
.billing-list:not(.billing-customers)>.billing-list-head,.billing-list:not(.billing-customers)>.billing-row>summary{grid-template-columns:minmax(110px,.7fr) 120px minmax(280px,2fr) 48px}
@media(max-width:760px){.billing-list:not(.billing-customers)>.billing-row>summary{grid-template-columns:minmax(0,1fr) auto}.billing-list:not(.billing-customers)>.billing-row>summary>span:nth-child(3){grid-column:1/-1}}

.billing-customers .billing-name{display:flex;align-items:center;gap:8px;min-width:0}.billing-customer-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}.billing-free-badge{flex:none;white-space:nowrap;font-size:12px}

/* Keep date controls readable on narrow phones. */
@media(max-width:480px){.billing-filters label{flex-basis:100%;min-width:0}}

@media(min-width:761px) and (max-width:1000px){.billing-list:not(.billing-customers)>.billing-list-head,.billing-list:not(.billing-customers)>.billing-row>summary{grid-template-columns:minmax(85px,.7fr) 70px minmax(0,2fr) 40px}}

.billing-reports{margin:16px 0}.billing-reports h2{font-size:16px;margin:16px 0}.billing-report>summary{padding:12px 0;cursor:pointer;list-style:none;display:flex;align-items:center;gap:8px}.billing-report>summary::-webkit-details-marker{display:none}.billing-report+.billing-report{border-top:1px solid var(--line)}.billing-report[open] .notification-toggle:after{transform:translateY(-2px) rotate(45deg)}.billing-payment{color:var(--action)}

.report-table-wrap{background:#fff;border:1px solid var(--line);border-radius:12px;padding:0 20px;overflow-x:auto}.report-table{width:100%;border-collapse:collapse;font-size:13px;text-align:left}.report-table th,.report-table td{padding:14px 10px;border-bottom:1px solid var(--line);white-space:nowrap}.report-table th{font-weight:400}.report-table thead{color:#61736c}.report-table th:first-child,.report-table td:first-child{padding-left:0}.report-table>tbody>tr:last-child>td,.report-table>tbody>tr:last-child>th{border-bottom:0}.report-total th{font-weight:500}@media(max-width:760px){.report-table-wrap{padding:0 14px}}

.report-expand{display:inline-flex;align-items:center;gap:8px;border:0;background:transparent;padding:0;min-height:0;font:inherit;color:inherit;white-space:nowrap}.report-expand:hover{background:transparent;color:inherit}.report-expand span{width:6px;height:6px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(-45deg)}.report-expand[aria-expanded=true] span{transform:rotate(45deg);margin-top:-3px}.report-table tr[hidden]{display:none}

.report-clickable{cursor:pointer}

.report-summary-table{table-layout:fixed;min-width:720px}.report-summary-table.report-operator-table{min-width:820px}.report-summary-table>.report-total{background:transparent}.report-summary-table>tbody>.report-total>td{overflow:hidden;text-overflow:ellipsis}.report-summary-table .report-expand{width:auto;min-height:28px;justify-content:flex-end;color:#61736c}.report-table .report-child-cell{padding:4px 0 18px 20px;white-space:normal}.report-child-scroll{max-width:100%;overflow-x:auto;border:1px solid var(--line);border-radius:8px;padding:0 14px}.report-child-table{min-width:750px;table-layout:auto}.report-child-table td,.report-child-table th{padding-top:12px;padding-bottom:12px}.report-summary-table .sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}

/* Table-cell height is a minimum; expanded child-table containers keep their own spacing. */
@media(min-width:761px){
 .report-table>thead>tr>:is(th,td){height:var(--list-head-height);padding-block:var(--list-row-padding-y);line-height:var(--list-head-line-height)}
 .report-table>tbody>tr:not([data-report-group])>:is(th,td):not(.report-child-cell){height:var(--list-row-min-height);padding-block:var(--list-row-padding-y)}
 .report-table .report-expand{min-height:var(--list-action-height)}
}

.page-title-line{display:flex;align-items:flex-start;gap:12px;flex-wrap:wrap}.page-title-line .badge{font-size:12px;font-weight:400;white-space:nowrap}

.billing-list .notification-toggle{color:#61736c}

/* Explicit delay avoids browser-dependent native title timing. */
/* Optical alignment: the heading glyph starts below its line box. */
#billingPeriodBadge{position:relative;margin-top:7px}
#billingPeriodBadge::after{content:attr(data-tooltip);position:absolute;top:calc(100% + 8px);left:0;z-index:20;padding:7px 10px;border:1px solid var(--line);border-radius:6px;background:#fff;color:#596d62;font-size:12px;line-height:1.5;white-space:nowrap;box-shadow:0 3px 10px #24353b14;visibility:hidden;opacity:0;transition:visibility 0s,opacity 0s;pointer-events:none}
#billingPeriodBadge:hover::after,#billingPeriodBadge:focus-visible::after{visibility:visible;opacity:1;transition-delay:1s}

.report-child-table thead{font-size:12px}.report-summary-table>tbody>.report-total:has(+tr:not([hidden]))>th,.report-summary-table>tbody>.report-total:has(+tr:not([hidden]))>td{border-bottom-color:transparent}
@media(max-width:760px){.report-table .report-child-cell{padding-left:12px}.report-child-scroll{padding:0 10px}}

/* Match report disclosure hierarchy: white inset detail panels, neutral borders. */
.billing-row>.billing-details,.billing-row>.billing-daily{margin:4px 0 18px 20px;padding:0 14px 12px;border:1px solid var(--line);border-radius:8px;background:#fff}
.billing-details>p{font-size:13px;line-height:1.6;color:#61736c;margin:12px 0}
.billing-details>p.error{color:#b42318}.billing-details>.billing-line:last-of-type{border-bottom:0}
.billing-daily .billing-row>.billing-details{margin-left:12px}
@media(max-width:760px){.billing-row>.billing-details,.billing-row>.billing-daily{margin-left:0;padding-left:10px;padding-right:10px}.billing-daily .billing-row>.billing-details{margin-left:0}}

/* Hidden detail rows must not leave a divider under the final visible summary. */
.report-summary-table>tbody>.report-total:not(:has(~.report-total))>th,.report-summary-table>tbody>.report-total:not(:has(~.report-total))>td{border-bottom:0}

/* Keep visually hidden table headings inside the scrolling table surface. */
.report-table-wrap{position:relative}
.report-mobile-list{display:none}
.date-range-disclosure{margin-bottom:16px}
.date-range-disclosure>summary{display:none}
.date-range-disclosure .billing-filters{margin-bottom:0}
.billing-summary{display:flex;align-items:center;justify-content:space-between;gap:20px;background:#fff;border:1px solid var(--line);border-radius:12px;padding:20px}
.billing-due{display:grid;gap:6px;flex:0 0 auto}
.billing-due>span{font-size:13px;color:#61736c}.billing-due>strong{font-size:28px;line-height:1.25;color:#24353b;font-variant-numeric:tabular-nums;margin:0}
.billing-due>small{font-size:13px;line-height:1.6;color:#61736c}
.billing-summary-details{display:flex;flex-wrap:wrap;gap:12px 24px;justify-content:flex-end}
.billing-summary-details>span{display:grid;gap:6px;min-width:90px;font-size:13px}
.billing-summary-details strong{margin:0;font-size:15px;font-weight:550;font-variant-numeric:tabular-nums}
.report-source-note:empty{display:none}
@media(max-width:760px){
 .date-range-disclosure{background:#fff;border:1px solid var(--line);border-radius:12px}
 .date-range-disclosure>summary{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:50px;padding:12px 14px;font-size:14px;cursor:pointer;list-style:none}
 .date-range-disclosure>summary::-webkit-details-marker{display:none}
 .date-range-action{color:var(--green);white-space:nowrap}
 .date-range-disclosure .billing-filters{border:0;border-top:1px solid var(--line);border-radius:0 0 12px 12px}
 .report-desktop{display:none}.report-mobile-list{display:grid;gap:12px}
 .report-mobile-row{background:#fff;border:1px solid var(--line);border-radius:12px;min-width:0}
 .report-mobile-row>summary{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px 12px;align-items:center;list-style:none;padding:14px 16px;cursor:pointer}
 .report-mobile-row>summary::-webkit-details-marker{display:none}
 .report-mobile-date{font-weight:600;overflow-wrap:anywhere}.report-mobile-date small{display:block;margin-top:6px;font-size:14px;font-weight:400;color:#61736c}
 .report-mobile-main{font-size:14px;white-space:nowrap}.report-mobile-main strong{font-size:18px;font-variant-numeric:tabular-nums}
 .report-mobile-row .notification-toggle{min-height:36px}
 .report-mobile-row[open]>summary .notification-toggle::after{transform:translateY(-2px) rotate(45deg)}
 .report-mobile-detail{border-top:1px solid var(--line);padding:14px 16px}
 .report-metrics{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 16px;font-size:15px;margin:0}
 .report-metrics>div{min-width:0}.report-metrics dt{color:#61736c;font-size:14px}.report-metrics dd{margin:3px 0 0;font-size:16px;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
 .report-mobile-group{padding-top:16px;margin-top:16px;border-top:1px solid var(--line)}.report-mobile-group h3{margin:0;font-size:16px;overflow-wrap:anywhere}.report-mobile-group>p{margin:4px 0 12px}
 .billing-summary{display:block;padding:16px}.billing-due>strong{font-size:28px}.billing-summary-details{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:18px;padding-top:16px;border-top:1px solid var(--line)}
 .billing-summary-details>span{min-width:0;font-size:14px}.billing-summary-details strong{font-size:16px}
}
.date-range-disclosure>summary:focus-visible,.filter-disclosure>summary:focus-visible,.report-mobile-row>summary:focus-visible{outline:3px solid #83bbaa;outline-offset:3px}
