[data-qtool="backcharge-cost-breakdown-calculator"] {
            --bcb-bg: color-mix(in srgb, var(--bs-body-bg, #ffffff) 93%, #e7edf5 7%);
            --bcb-panel: color-mix(in srgb, var(--bs-body-bg, #ffffff) 95%, #dbe6f1 5%);
            --bcb-panel-strong: color-mix(in srgb, var(--bs-body-bg, #ffffff) 90%, #eef4fa 10%);
            --bcb-text: var(--bs-body-color, #1a2433);
            --bcb-muted: color-mix(in srgb, var(--bs-body-color, #1a2433) 66%, transparent);
            --bcb-line: color-mix(in srgb, var(--bs-border-color, #d7dee8) 78%, #8ea5bf 22%);
            --bcb-navy: #12324f;
            --bcb-blue: #245d8f;
            --bcb-blue-soft: #2f6f9f;
            --bcb-orange: #c77719;
            --bcb-red: #b64747;
            --bcb-green: #2a7a55;
            display: block;
            color: var(--bcb-text);
            background:
                radial-gradient(circle at 5% 0%, rgba(36, 93, 143, 0.12), transparent 28rem),
                radial-gradient(circle at 90% 0%, rgba(199, 119, 25, 0.08), transparent 22rem),
                var(--bcb-bg);
            border: 1px solid var(--bcb-line);
            border-radius: 22px;
            box-shadow: 0 16px 36px rgba(17, 41, 65, 0.1);
            overflow: hidden;
        }

        [data-qtool="backcharge-cost-breakdown-calculator"] * {
            box-sizing: border-box;
        }

        [data-qtool="backcharge-cost-breakdown-calculator"] .bcb-wrap {
            padding: clamp(1rem, 2.2vw, 1.6rem);
        }

        [data-qtool="backcharge-cost-breakdown-calculator"] .bcb-grid {
            display: grid;
            gap: 0.9rem;
        }

        [data-qtool="backcharge-cost-breakdown-calculator"] .bcb-card {
            background: var(--bcb-panel);
            border: 1px solid var(--bcb-line);
            border-radius: 16px;
            padding: 0.95rem;
        }

        [data-qtool="backcharge-cost-breakdown-calculator"] .bcb-headline {
            margin: 0 0 0.35rem;
            color: var(--bcb-navy);
            font-size: clamp(1.1rem, 2vw, 1.4rem);
            font-weight: 800;
            line-height: 1.25;
        }

        [data-bs-theme="dark"] [data-qtool="backcharge-cost-breakdown-calculator"] .bcb-headline,
        [data-bs-theme="dark"] [data-qtool="backcharge-cost-breakdown-calculator"] .bcb-section-title {
            color: #e8f3ff;
        }

        [data-qtool="backcharge-cost-breakdown-calculator"] .bcb-subtitle,
        [data-qtool="backcharge-cost-breakdown-calculator"] .bcb-helper {
            margin: 0;
            color: var(--bcb-muted);
            line-height: 1.45;
            font-size: 0.9rem;
        }

        [data-qtool="backcharge-cost-breakdown-calculator"] .bcb-helper {
            font-size: 0.82rem;
        }

        [data-qtool="backcharge-cost-breakdown-calculator"] .bcb-section-title {
            margin: 0;
            color: var(--bcb-navy);
            font-size: 1rem;
            font-weight: 800;
        }

        [data-qtool="backcharge-cost-breakdown-calculator"] .bcb-head-row,
        [data-qtool="backcharge-cost-breakdown-calculator"] .bcb-toolbar {
            display: flex;
            flex-wrap: wrap;
            align-items: center;
            justify-content: space-between;
            gap: 0.55rem;
        }

        [data-qtool="backcharge-cost-breakdown-calculator"] .bcb-toolbar {
            justify-content: flex-start;
        }

        [data-qtool="backcharge-cost-breakdown-calculator"] .bcb-btn {
            appearance: none;
            border: 1px solid var(--bcb-line);
            border-radius: 11px;
            min-height: 38px;
            padding: 0.5rem 0.8rem;
            background: var(--bcb-panel-strong);
            color: var(--bcb-text);
            font-weight: 800;
            font-size: 0.84rem;
            line-height: 1;
            cursor: pointer;
            text-decoration: none;
            transition: border-color 0.16s ease, transform 0.16s ease, box-shadow 0.16s ease;
        }

        [data-qtool="backcharge-cost-breakdown-calculator"] .bcb-btn:hover {
            transform: translateY(-1px);
            border-color: rgba(36, 93, 143, 0.42);
            box-shadow: 0 8px 18px rgba(18, 50, 79, 0.11);
        }

        [data-qtool="backcharge-cost-breakdown-calculator"] .bcb-btn-primary {
            color: #ffffff;
            border-color: rgba(36, 93, 143, 0.8);
            background: linear-gradient(135deg, var(--bcb-blue), var(--bcb-navy));
        }

        [data-qtool="backcharge-cost-breakdown-calculator"] .bcb-btn-warn {
            color: #ffffff;
            border-color: rgba(199, 119, 25, 0.7);
            background: linear-gradient(135deg, #d48728, #b16411);
        }

        [data-qtool="backcharge-cost-breakdown-calculator"] .bcb-btn-danger {
            color: #ffffff;
            border-color: rgba(182, 71, 71, 0.75);
            background: linear-gradient(135deg, #bf5454, #8f3434);
        }

        [data-qtool="backcharge-cost-breakdown-calculator"] .bcb-row-grid {
            display: grid;
            gap: 0.7rem;
            grid-template-columns: repeat(4, minmax(0, 1fr));
        }

        [data-qtool="backcharge-cost-breakdown-calculator"] .bcb-field {
            display: grid;
            gap: 0.32rem;
            min-width: 0;
        }

        [data-qtool="backcharge-cost-breakdown-calculator"] .bcb-field-wide {
            grid-column: span 2;
        }

        [data-qtool="backcharge-cost-breakdown-calculator"] .bcb-label {
            color: var(--bcb-muted);
            font-size: 0.76rem;
            line-height: 1.2;
            font-weight: 800;
            letter-spacing: 0.01em;
            text-transform: uppercase;
        }

        [data-qtool="backcharge-cost-breakdown-calculator"] .bcb-control,
        [data-qtool="backcharge-cost-breakdown-calculator"] .bcb-select {
            width: 100%;
            min-height: 38px;
            color: var(--bcb-text);
            background: var(--bs-body-bg, #ffffff);
            border: 1px solid var(--bcb-line);
            border-radius: 10px;
            padding: 0.45rem 0.6rem;
            font-size: 0.9rem;
            line-height: 1.2;
            outline: none;
            transition: border-color 0.16s ease, box-shadow 0.16s ease;
        }

        [data-qtool="backcharge-cost-breakdown-calculator"] .bcb-control:focus,
        [data-qtool="backcharge-cost-breakdown-calculator"] .bcb-select:focus {
            border-color: rgba(36, 93, 143, 0.7);
            box-shadow: 0 0 0 0.18rem rgba(36, 93, 143, 0.14);
        }

        [data-qtool="backcharge-cost-breakdown-calculator"] .bcb-table-wrap {
            border: 1px solid var(--bcb-line);
            border-radius: 14px;
            background: var(--bs-body-bg, #ffffff);
            overflow: hidden;
        }

        [data-qtool="backcharge-cost-breakdown-calculator"] .bcb-table {
            width: 100%;
            border-collapse: separate;
            border-spacing: 0;
            font-size: 0.88rem;
        }

        [data-qtool="backcharge-cost-breakdown-calculator"] .bcb-table th,
        [data-qtool="backcharge-cost-breakdown-calculator"] .bcb-table td {
            border-bottom: 1px solid var(--bcb-line);
            padding: 0.52rem 0.48rem;
            vertical-align: middle;
        }

        [data-qtool="backcharge-cost-breakdown-calculator"] .bcb-table th {
            position: sticky;
            top: 0;
            z-index: 1;
            white-space: nowrap;
            color: var(--bcb-navy);
            font-size: 0.74rem;
            text-transform: uppercase;
            letter-spacing: 0.02em;
            background: color-mix(in srgb, var(--bs-body-bg, #ffffff) 87%, rgba(36, 93, 143, 0.13) 13%);
        }

        [data-bs-theme="dark"] [data-qtool="backcharge-cost-breakdown-calculator"] .bcb-table th {
            color: #e8f3ff;
        }

        [data-qtool="backcharge-cost-breakdown-calculator"] .bcb-table tr:last-child td {
            border-bottom: 0;
        }

        [data-qtool="backcharge-cost-breakdown-calculator"] .bcb-table .bcb-col-num,
        [data-qtool="backcharge-cost-breakdown-calculator"] .bcb-table .bcb-amount {
            text-align: right;
        }

        [data-qtool="backcharge-cost-breakdown-calculator"] .bcb-amount {
            font-variant-numeric: tabular-nums;
            white-space: nowrap;
            color: var(--bcb-navy);
            font-weight: 800;
        }

        [data-qtool="backcharge-cost-breakdown-calculator"] .bcb-row-actions {
            display: flex;
            justify-content: flex-end;
        }

        [data-qtool="backcharge-cost-breakdown-calculator"] .bcb-row-delete {
            appearance: none;
            border: 1px solid rgba(182, 71, 71, 0.5);
            background: rgba(182, 71, 71, 0.08);
            color: var(--bcb-red);
            border-radius: 9px;
            min-height: 33px;
            padding: 0.35rem 0.55rem;
            font-size: 0.78rem;
            font-weight: 800;
            cursor: pointer;
        }

        [data-qtool="backcharge-cost-breakdown-calculator"] .bcb-row-invalid td {
            background: rgba(182, 71, 71, 0.08);
        }

        [data-qtool="backcharge-cost-breakdown-calculator"] .bcb-summary {
            margin-top: 0.9rem;
            margin-left: auto;
            width: min(100%, 460px);
            border: 1px solid var(--bcb-line);
            border-radius: 14px;
            background: var(--bcb-panel-strong);
            padding: 0.75rem;
            display: grid;
            gap: 0.56rem;
        }

        [data-qtool="backcharge-cost-breakdown-calculator"] .bcb-summary-row {
            display: grid;
            grid-template-columns: minmax(0, 1fr) minmax(130px, auto);
            gap: 0.65rem;
            align-items: center;
        }

        [data-qtool="backcharge-cost-breakdown-calculator"] .bcb-summary-label {
            margin: 0;
            color: var(--bcb-muted);
            font-size: 0.84rem;
            font-weight: 700;
        }

        [data-qtool="backcharge-cost-breakdown-calculator"] .bcb-summary-value {
            margin: 0;
            text-align: right;
            font-variant-numeric: tabular-nums;
            font-weight: 800;
        }

        [data-qtool="backcharge-cost-breakdown-calculator"] .bcb-total {
            color: var(--bcb-navy);
            font-size: 1rem;
        }

        [data-qtool="backcharge-cost-breakdown-calculator"] .bcb-status {
            margin: 0;
            padding: 0.6rem 0.68rem;
            border-radius: 11px;
            border: 1px solid transparent;
            font-size: 0.84rem;
            font-weight: 700;
            display: none;
        }

        [data-qtool="backcharge-cost-breakdown-calculator"] .bcb-status.is-visible {
            display: block;
        }

        [data-qtool="backcharge-cost-breakdown-calculator"] .bcb-status-info {
            color: var(--bcb-blue);
            border-color: rgba(36, 93, 143, 0.26);
            background: rgba(36, 93, 143, 0.12);
        }

        [data-qtool="backcharge-cost-breakdown-calculator"] .bcb-status-warn {
            color: var(--bcb-orange);
            border-color: rgba(199, 119, 25, 0.3);
            background: rgba(199, 119, 25, 0.12);
        }

        [data-qtool="backcharge-cost-breakdown-calculator"] .bcb-status-error {
            color: var(--bcb-red);
            border-color: rgba(182, 71, 71, 0.32);
            background: rgba(182, 71, 71, 0.12);
        }

        [data-qtool="backcharge-cost-breakdown-calculator"] .bcb-disclaimer {
            margin: 0;
            color: var(--bcb-muted);
            font-size: 0.82rem;
            line-height: 1.45;
        }

        [data-qtool="backcharge-cost-breakdown-calculator"] .bcb-sr-only {
            position: absolute;
            width: 1px;
            height: 1px;
            padding: 0;
            margin: -1px;
            overflow: hidden;
            clip: rect(0, 0, 0, 0);
            white-space: nowrap;
            border: 0;
        }

        [data-qtool="backcharge-cost-breakdown-calculator"] .bcb-mobile-label {
            display: none;
            color: var(--bcb-muted);
            font-size: 0.75rem;
            font-weight: 800;
            margin-bottom: 0.22rem;
            text-transform: uppercase;
            letter-spacing: 0.01em;
        }

        @media (max-width: 920px) {
            [data-qtool="backcharge-cost-breakdown-calculator"] .bcb-row-grid {
                grid-template-columns: repeat(2, minmax(0, 1fr));
            }

            [data-qtool="backcharge-cost-breakdown-calculator"] .bcb-field-wide {
                grid-column: span 2;
            }
        }

        @media (max-width: 760px) {
            [data-qtool="backcharge-cost-breakdown-calculator"] .bcb-toolbar {
                align-items: stretch;
                display: grid;
                grid-template-columns: repeat(2, minmax(0, 1fr));
            }

            [data-qtool="backcharge-cost-breakdown-calculator"] .bcb-btn {
                width: 100%;
            }

            [data-qtool="backcharge-cost-breakdown-calculator"] .bcb-table-wrap {
                overflow: visible;
                border: 0;
                background: transparent;
            }

            [data-qtool="backcharge-cost-breakdown-calculator"] .bcb-table thead {
                display: none;
            }

            [data-qtool="backcharge-cost-breakdown-calculator"] .bcb-table,
            [data-qtool="backcharge-cost-breakdown-calculator"] .bcb-table tbody,
            [data-qtool="backcharge-cost-breakdown-calculator"] .bcb-table tr,
            [data-qtool="backcharge-cost-breakdown-calculator"] .bcb-table td {
                display: block;
                width: 100%;
            }

            [data-qtool="backcharge-cost-breakdown-calculator"] .bcb-table tr {
                border: 1px solid var(--bcb-line);
                border-radius: 12px;
                background: var(--bs-body-bg, #ffffff);
                padding: 0.5rem;
                margin-bottom: 0.62rem;
            }

            [data-qtool="backcharge-cost-breakdown-calculator"] .bcb-table td {
                border: 0;
                padding: 0.28rem 0.2rem;
                text-align: left;
            }

            [data-qtool="backcharge-cost-breakdown-calculator"] .bcb-mobile-label {
                display: block;
            }

            [data-qtool="backcharge-cost-breakdown-calculator"] .bcb-row-actions {
                justify-content: flex-start;
            }

            [data-qtool="backcharge-cost-breakdown-calculator"] .bcb-summary {
                width: 100%;
            }

            [data-qtool="backcharge-cost-breakdown-calculator"] .bcb-summary-row {
                grid-template-columns: 1fr;
            }

            [data-qtool="backcharge-cost-breakdown-calculator"] .bcb-summary-value {
                text-align: left;
            }
        }

        @media (max-width: 520px) {
            [data-qtool="backcharge-cost-breakdown-calculator"] .bcb-row-grid,
            [data-qtool="backcharge-cost-breakdown-calculator"] .bcb-toolbar {
                grid-template-columns: 1fr;
            }

            [data-qtool="backcharge-cost-breakdown-calculator"] .bcb-field-wide {
                grid-column: span 1;
            }
        }