.bills-list-grid-container{padding:1.6rem;background:linear-gradient(180deg,#0b2835,#0c1113);border-radius:1rem;height:80vh}.bills-list-grid-container .bills-list-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(30rem,1fr));gap:1.6rem;list-style:none;overflow-y:auto}.bills-list-grid-container .bills-list-grid li{display:grid;grid-template-columns:repeat(6,1fr);gap:.5rem 1rem;background-color:var(--color-background-ascent);border-radius:1.6rem;padding:1.6rem;font-size:1.4rem;height:20rem}.bills-list-grid-container .bills-list-grid li>:nth-child(1){grid-area:1/1/2/2;width:2.6rem;height:2.6rem}.bills-list-grid-container .bills-list-grid li>:nth-child(2){grid-area:1/2/2/7;margin:auto 0}.bills-list-grid-container .bills-list-grid li>:nth-child(3){grid-area:2/1/3/3;margin:auto 0}.bills-list-grid-container .bills-list-grid li>:nth-child(4){grid-area:2/6/3/7}.bills-list-grid-container .bills-list-grid li>:nth-child(4) svg{width:2.6rem;height:2.6rem}.bills-list-grid-container .bills-list-grid li>:nth-child(5){grid-area:3/1/4/7;margin:auto 0;font-size:1.2rem;opacity:.9}.bills-list-grid-container .bills-list-grid li>:nth-child(6){grid-area:4/1/5/4;margin:auto 0}.bills-list-grid-container .bills-list-grid li>:nth-child(7){grid-area:4/4/5/7;text-align:right;margin:auto 0}.bills-list-grid-container .bills-list-grid li>:nth-child(8){grid-area:5/5/6/7;display:flex;justify-content:flex-end;align-items:center}.bills-list-grid-container .bills-list-grid li .pdf-link{display:flex;align-items:center;justify-content:center;background:none;border:none;cursor:pointer;padding:0;color:var(--color-primary);opacity:.8}.bills-list-grid-container .bills-list-grid li .pdf-link:hover{opacity:1}.bills-list-grid-container .bills-list-grid li .quick-account-picker{position:relative;display:inline-flex;align-items:center;gap:.5rem;width:100%;height:2.6rem;padding:0 .7rem 0 .8rem;border-radius:999px;font-size:1.15rem;font-weight:500;border:1px solid rgba(255,255,255,.1);background:#2e3d44;color:#c8d0d6;transition:all .18s ease;overflow:hidden}.bills-list-grid-container .bills-list-grid li .quick-account-picker:hover{border-color:#ffffff2e;background:#34454e}.bills-list-grid-container .bills-list-grid li .quick-account-picker:has(select:focus){border-color:var(--color-primary);box-shadow:0 0 0 3px rgba(var(--color-primary),.18)}.bills-list-grid-container .bills-list-grid li .quick-account-picker .qa-icon{width:1.4rem;height:1.4rem;flex-shrink:0;opacity:.9}.bills-list-grid-container .bills-list-grid li .quick-account-picker select{flex:1;min-width:0;background:transparent;border:none;color:inherit;font:inherit;font-size:1.12rem;outline:none;cursor:pointer;appearance:none;-webkit-appearance:none;padding-right:1.4rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.bills-list-grid-container .bills-list-grid li .quick-account-picker select option{color:#1a1a1a;background:#fff}.bills-list-grid-container .bills-list-grid li .quick-account-picker .qa-chevron{position:absolute;right:.6rem;width:1.1rem;height:1.1rem;opacity:.5;pointer-events:none}.bills-list-grid-container .bills-list-grid li .quick-account-picker--linked{background:rgba(var(--color-primary),.14);border-color:rgba(var(--color-primary),.28);color:#e6f0ff}.bills-list-grid-container .bills-list-grid li .quick-account-picker--linked .qa-icon{color:var(--color-primary);opacity:1}.bills-list-grid-container .bills-list-grid li .quick-account-picker--unlinked{background:#ffffff0d;border-style:dashed;border-color:#ffffff24;color:#9aa8b3;font-style:italic}.bills-list-grid-container .bills-list-grid li .quick-account-picker--unlinked .qa-icon{opacity:.5}.bills-list-grid-container .bills-list-grid li .quick-account-picker.is-updating{opacity:.55;pointer-events:none}.bills-list-grid-container .bills-list-grid li .quick-account-picker .spin{position:absolute;right:.6rem;animation:spin .8s linear infinite;width:1.2rem;height:1.2rem}.bills-list-grid-container .bills-list-grid li .actions{display:flex;align-items:center;justify-content:center;gap:.8rem}.bills-list-grid-container .bills-list-grid li .actions .edit-button{display:flex;align-items:center;justify-content:center;padding:.8rem;border-radius:.8rem;background-color:var(--color-dark);cursor:pointer;transition:all .2s ease;text-decoration:none}.bills-list-grid-container .bills-list-grid li .actions .edit-button svg{width:2rem;height:2rem;color:var(--color-primary)}.bills-list-grid-container .bills-list-grid li .actions .edit-button:hover{background-color:var(--color-primary)}.bills-list-grid-container .bills-list-grid li .actions .edit-button:hover svg{color:#fff}.bills-list-table-container{padding:1.6rem;background:linear-gradient(180deg,#0b2835,#0c1113);border-radius:1rem}.bills-list-table-container .bills-list-table{display:flex;flex-direction:column;gap:1rem;list-style:none;overflow-y:auto;height:80vh}.bills-list-table-container .bills-list-table li{display:grid;grid-template-columns:auto 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1.2fr auto;gap:1.6rem;background-color:var(--color-background-ascent);border-radius:1.6rem;padding:1rem 1.6rem;font-size:1.4rem}.bills-list-table-container .bills-list-table li>:nth-child(1){width:2.6rem;height:2.6rem}.bills-list-table-container .bills-list-table li>:nth-child(2){margin:auto 0}.bills-list-table-container .bills-list-table li>:nth-child(3){margin:auto 0}.bills-list-table-container .bills-list-table li>:nth-child(4){margin:auto 0}.bills-list-table-container .bills-list-table li>:nth-child(5){margin:auto 0}.bills-list-table-container .bills-list-table li>:nth-child(6){display:flex;align-items:center;justify-content:center;gap:1rem}.bills-list-table-container .bills-list-table li>:nth-child(6) svg{width:2.6rem;height:2.6rem}.bills-list-table-container .bills-list-table li>:nth-child(7){margin:auto 0}.bills-list-table-container .bills-list-table li>:nth-child(8){text-align:right;margin:auto 0}.bills-list-table-container .bills-list-table li>:nth-child(9){margin:auto 0}.bills-list-table-container .bills-list-table li .pdf-link{display:flex;align-items:center;gap:1rem;background:none;border:none;text-decoration:none;color:var(--color-primary);opacity:.8;cursor:pointer;font-size:1.4rem;font-family:inherit;padding:0}.bills-list-table-container .bills-list-table li .pdf-link:hover{opacity:1}.bills-list-table-container .bills-list-table li .quick-account-picker{position:relative;display:inline-flex;align-items:center;gap:.6rem;min-width:14rem;max-width:18rem;height:2.8rem;padding:0 .8rem 0 .9rem;border-radius:999px;font-size:1.2rem;font-weight:500;border:1px solid rgba(255,255,255,.1);background:#2e3d44;color:#c8d0d6;transition:all .18s ease;overflow:hidden}.bills-list-table-container .bills-list-table li .quick-account-picker:hover{border-color:#ffffff2e;background:#34454e}.bills-list-table-container .bills-list-table li .quick-account-picker:has(select:focus){border-color:var(--color-primary);box-shadow:0 0 0 3px rgba(var(--color-primary),.18)}.bills-list-table-container .bills-list-table li .quick-account-picker .qa-icon{width:1.5rem;height:1.5rem;flex-shrink:0;opacity:.9}.bills-list-table-container .bills-list-table li .quick-account-picker select{flex:1;min-width:0;background:transparent;border:none;color:inherit;font:inherit;font-size:1.22rem;font-weight:500;outline:none;cursor:pointer;appearance:none;-webkit-appearance:none;padding-right:1.6rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.bills-list-table-container .bills-list-table li .quick-account-picker select option{color:#1a1a1a;background:#fff}.bills-list-table-container .bills-list-table li .quick-account-picker .qa-chevron{position:absolute;right:.7rem;width:1.2rem;height:1.2rem;opacity:.55;pointer-events:none}.bills-list-table-container .bills-list-table li .quick-account-picker--linked{background:rgba(var(--color-primary),.14);border-color:rgba(var(--color-primary),.28);color:#e6f0ff}.bills-list-table-container .bills-list-table li .quick-account-picker--linked .qa-icon{color:var(--color-primary);opacity:1}.bills-list-table-container .bills-list-table li .quick-account-picker--linked .qa-chevron{opacity:.7}.bills-list-table-container .bills-list-table li .quick-account-picker--unlinked{background:#ffffff0d;border-style:dashed;border-color:#ffffff24;color:#9aa8b3;font-style:italic}.bills-list-table-container .bills-list-table li .quick-account-picker--unlinked .qa-icon{opacity:.5}.bills-list-table-container .bills-list-table li .quick-account-picker.is-updating{opacity:.55;pointer-events:none}.bills-list-table-container .bills-list-table li .quick-account-picker .spin{position:absolute;right:.6rem;animation:spin .8s linear infinite;width:1.3rem;height:1.3rem}@keyframes spin{to{transform:rotate(360deg)}}.bills-list-table-container .bills-list-table li .actions{display:flex;align-items:center;justify-content:center;gap:.8rem}.bills-list-table-container .bills-list-table li .actions .edit-button{display:flex;align-items:center;justify-content:center;padding:.8rem;border-radius:.8rem;background-color:var(--color-dark);cursor:pointer;transition:all .2s ease;text-decoration:none}.bills-list-table-container .bills-list-table li .actions .edit-button svg{width:2rem;height:2rem;color:var(--color-primary)}.bills-list-table-container .bills-list-table li .actions .edit-button:hover{background-color:var(--color-primary)}.bills-list-table-container .bills-list-table li .actions .edit-button:hover svg{color:#fff}.month-select-container{padding:1.6rem;background:linear-gradient(180deg,#0b2835,#0c1113);border-radius:1rem;width:30rem}.month-select-container__list{display:grid;gap:1rem;grid-template-columns:repeat(2,1fr)}.month-select-container__list label{text-transform:capitalize;text-align:center;font-size:1.6rem;padding:1rem;background-color:#ffffff0c;border-radius:.5rem;cursor:pointer}.month-select-container__list label input{display:none}.month-select-container__list label:hover{background-color:#ffffff1a}.month-select-container__list label:has(input:checked){background-color:var(--color-primary)}.month-select-container__list label:has(input:checked):hover{background-color:var(--color-primary)}.month-select-container__list label:has(input:disabled){color:#5b5f69;cursor:not-allowed}.month-select-container__list label:has(input:disabled):hover{background-color:#ffffff0c}.bills{display:grid;grid-template-columns:auto 1fr;gap:1.6rem;height:100%;overflow-y:auto}.bills__main{display:flex;flex-direction:column;gap:1.2rem;min-width:0;overflow-y:auto}.bills .bills-filter-info{display:flex;align-items:center;gap:.8rem;padding:.9rem 1.2rem;border-radius:.8rem;background:rgba(var(--color-primary),.1);border:1px solid rgba(var(--color-primary),.22);font-size:1.25rem;color:#d6e4ff;flex-wrap:wrap}.bills .bills-filter-info__icon{width:1.6rem;height:1.6rem;color:var(--color-primary);flex-shrink:0}.bills .bills-filter-info strong{color:#fff;font-weight:700}.bills .bills-filter-info__total{margin-left:auto;font-weight:700;color:#fff;background:rgba(var(--color-primary),.18);padding:.35rem .7rem;border-radius:999px;font-size:1.2rem}.bills .bills-filter-info__clear{display:inline-flex;align-items:center;gap:.4rem;padding:.45rem .85rem;border-radius:999px;border:1px solid rgba(255,255,255,.18);background:#ffffff14;color:#fff;font-size:1.15rem;cursor:pointer;transition:all .15s}.bills .bills-filter-info__clear svg{width:1.2rem;height:1.2rem}.bills .bills-filter-info__clear:hover{background:#ffffff24;border-color:#ffffff47}.bills .bills-empty{display:flex;flex-direction:column;align-items:center;gap:1rem;padding:3rem 1.6rem;border-radius:1rem;background:linear-gradient(180deg,#0b2835,#0c1113);color:#9fb3c0;text-align:center}.bills .bills-empty svg{width:2.4rem;height:2.4rem;opacity:.5}.bills .bills-empty p{font-size:1.35rem}.bills .bills-empty button{padding:.6rem 1.2rem;border-radius:999px;border:1px solid rgba(var(--color-primary),.32);background:rgba(var(--color-primary),.14);color:#e6f0ff;cursor:pointer;font-size:1.25rem}.bills .bills-empty button:hover{background:rgba(var(--color-primary),.22)}.bills ul{list-style:none}.bills ul li{display:flex;gap:1.6rem}.bills ul li a{text-decoration:none;color:var(--color-dark)}.bills ul li a:hover{color:var(--color-primary)}:root{--color-primary-hsl: 214, 78%, 36%;--color-primary-ascent-hsl: 195, 9%, 25%;--color-secondary-hsl: 208, 7%, 46%;--color-success-hsl: 134, 61%, 41%;--color-danger-hsl: 353, 88%, 57.8%;--color-warning-hsl: 45, 100%, 51%;--color-info-hsl: 188, 78%, 41%;--color-light-hsl: 210, 17%, 98%;--color-dark-hsl: 210, 10%, 23%;--color-background-hsl: 214, 53%, 61%;--color-background-ascent-hsl: 197, 28%, 7%;--color-primary: hsl(var(--color-primary-hsl));--color-primary-ascent: hsl(var(--color-primary-ascent-hsl));--color-secondary: hsl(var(--color-secondary-hsl));--color-success: hsl(var(--color-success-hsl));--color-danger: hsl(var(--color-danger-hsl));--color-warning: hsl(var(--color-warning-hsl));--color-info: hsl(var(--color-info-hsl));--color-light: hsl(var(--color-light-hsl));--color-dark: hsl(var(--color-dark-hsl));--color-background: hsl(var(--color-background-hsl));--color-background-ascent: hsl(var(--color-background-ascent-hsl))}:root{font-size:.625rem}*::-webkit-scrollbar{width:.6rem}*::-webkit-scrollbar-track{background:transparent}*::-webkit-scrollbar-thumb{border-radius:.3rem;background-color:var(--color-primary)}*::-webkit-scrollbar-thumb:hover{background-color:var(--color-secondary)}:root{--h-xl: 4.2rem;--h-lg: 4rem;--h-md: 3.8rem;--h-sm: 3.6rem;--h-xs: 3.4rem}.bill-list__right-head{display:flex;gap:1rem;align-items:center;flex-wrap:wrap;justify-content:flex-end;flex:1;min-width:0}.bill-list__right-head .bill-list__metrics{display:flex;gap:.8rem;flex-wrap:wrap;align-items:center;flex:1;min-width:22rem;justify-content:flex-start}.bill-list__right-head .bill-list__metrics--empty{opacity:.7}.bill-list__right-head .bill-list__metrics .metric-pill{display:inline-flex;align-items:center;gap:.5rem;padding:.55rem .9rem;border-radius:999px;background:#ffffff14;border:1px solid rgba(255,255,255,.1);font-size:1.22rem;line-height:1;white-space:nowrap;text-transform:none;letter-spacing:0;font-weight:500}.bill-list__right-head .bill-list__metrics .metric-pill__icon{width:1.35rem;height:1.35rem;opacity:.85;flex-shrink:0}.bill-list__right-head .bill-list__metrics .metric-pill__label{font-weight:600;color:#9fb3c0;text-transform:capitalize}.bill-list__right-head .bill-list__metrics .metric-pill__value{font-weight:700;color:#e6f0ff}.bill-list__right-head .bill-list__metrics .metric-pill__count{opacity:.55;font-size:1.05rem}.bill-list__right-head .bill-list__metrics .metric-pill--total{background:rgba(var(--color-primary),.18);border-color:rgba(var(--color-primary),.32)}.bill-list__right-head .bill-list__metrics .metric-pill--total .metric-pill__label{color:#cfe0ff}.bill-list__right-head .bill-list__metrics .metric-pill--unlinked{border-style:dashed;opacity:.9}.bill-list__right-head .bill-list__metrics .metric-pill--unlinked .metric-pill__label{color:#9aa8b3;font-style:italic}.bill-list__right-head .bill-list__metrics .metric-pill--empty{background:transparent;border-style:dashed;opacity:.6;font-style:italic}.bill-list__right-head .bill-list__metrics .metric-pill--clickable{cursor:pointer;transition:all .15s ease;border:none;font:inherit;color:inherit}.bill-list__right-head .bill-list__metrics .metric-pill--clickable:hover{background:#ffffff1f;border-color:#ffffff29;transform:translateY(-1px)}.bill-list__right-head .bill-list__metrics .metric-pill--clickable:active{transform:translateY(0)}.bill-list__right-head .bill-list__metrics .metric-pill--clickable.is-active{background:rgba(var(--color-primary),.22);border:1px solid rgba(var(--color-primary),.4);box-shadow:0 0 0 2px rgba(var(--color-primary),.18)}.bill-list__right-head .bill-list__metrics .metric-pill--clickable.is-active .metric-pill__label{color:#dbe8ff}.bill-list__right-head .bill-list__account-filter{position:relative;display:inline-flex;align-items:center;height:3.4rem;border-radius:999px;background:#2e3d44;border:1px solid rgba(255,255,255,.1);color:#c8d0d6;font-size:1.25rem;transition:all .15s;flex-shrink:0;min-width:18rem}.bill-list__right-head .bill-list__account-filter:hover{background:#34454e;border-color:#ffffff29}.bill-list__right-head .bill-list__account-filter.is-active{background:rgba(var(--color-primary),.14);border-color:rgba(var(--color-primary),.28);color:#e6f0ff}.bill-list__right-head .bill-list__account-filter.is-active .filter-icon{color:var(--color-primary)}.bill-list__right-head .bill-list__account-filter.is-open{border-color:var(--color-primary);box-shadow:0 0 0 3px rgba(var(--color-primary),.18)}.bill-list__right-head .bill-list__account-filter .filter-trigger{display:inline-flex;align-items:center;gap:.5rem;width:100%;height:100%;padding:0 .9rem;border:none;background:transparent;color:inherit;font:inherit;font-size:1.22rem;font-weight:500;cursor:pointer;border-radius:inherit;white-space:nowrap;text-align:left}.bill-list__right-head .bill-list__account-filter .filter-trigger__label{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis}.bill-list__right-head .bill-list__account-filter .filter-icon{width:1.4rem;height:1.4rem;flex-shrink:0;opacity:.85}.bill-list__right-head .bill-list__account-filter .filter-badge{display:inline-flex;align-items:center;justify-content:center;min-width:1.8rem;height:1.8rem;padding:0 .4rem;border-radius:999px;background:var(--color-primary);color:#fff;font-size:1.05rem;font-weight:700}.bill-list__right-head .bill-list__account-filter .filter-chevron{width:1.1rem;height:1.1rem;opacity:.5;flex-shrink:0;transition:transform .18s}.bill-list__right-head .bill-list__account-filter .filter-chevron.is-open{transform:rotate(180deg);opacity:.85}.bill-list__right-head .bill-list__account-filter .filter-dropdown{position:absolute;top:calc(100% + .6rem);left:0;min-width:22rem;width:max-content;max-width:28rem;background:#1a2a33;border:1px solid rgba(255,255,255,.1);border-radius:1rem;box-shadow:0 12px 32px #00000073;z-index:20;overflow:hidden;padding:.6rem}.bill-list__right-head .bill-list__account-filter .filter-dropdown__actions{display:flex;gap:.5rem;padding:.4rem .4rem .6rem;border-bottom:1px solid rgba(255,255,255,.06);margin-bottom:.4rem}.bill-list__right-head .bill-list__account-filter .filter-dropdown__actions .filter-action{flex:1;padding:.45rem .6rem;border-radius:.6rem;border:1px solid rgba(255,255,255,.08);background:#ffffff0f;color:#c8d0d6;font-size:1.15rem;cursor:pointer}.bill-list__right-head .bill-list__account-filter .filter-dropdown__actions .filter-action:hover{background:#ffffff1a;color:#fff}.bill-list__right-head .bill-list__account-filter .filter-dropdown__actions .filter-action--clear{background:rgba(var(--color-danger),.12);border-color:rgba(var(--color-danger),.18);color:#ffb3b3}.bill-list__right-head .bill-list__account-filter .filter-dropdown__actions .filter-action--clear:hover{background:rgba(var(--color-danger),.18)}.bill-list__right-head .bill-list__account-filter .filter-dropdown .filter-option{display:flex;align-items:center;gap:.7rem;padding:.7rem .8rem;border-radius:.6rem;cursor:pointer;font-size:1.25rem;color:#c8d0d6;transition:background .12s;user-select:none}.bill-list__right-head .bill-list__account-filter .filter-dropdown .filter-option:hover{background:#ffffff0f}.bill-list__right-head .bill-list__account-filter .filter-dropdown .filter-option.is-checked{background:rgba(var(--color-primary),.14);color:#e6f0ff}.bill-list__right-head .bill-list__account-filter .filter-dropdown .filter-option input[type=checkbox]{width:1.45rem;height:1.45rem;accent-color:var(--color-primary);flex-shrink:0}.bill-list__right-head .bill-list__account-filter .filter-dropdown .filter-option__label{flex:1;text-transform:capitalize}.bill-list__right-head .bill-list__account-filter .filter-dropdown .filter-option__count{font-size:1.05rem;opacity:.55;background:#ffffff14;padding:.2rem .5rem;border-radius:999px}.bill-list__right-head .bill-list__controls{display:flex;gap:1rem;align-items:center;flex-shrink:0;flex-wrap:wrap}.bill-list__right-head__display{display:flex;border-radius:1rem;overflow:hidden}.bill-list__right-head__display label{display:flex;padding:1rem;background-color:var(--color-dark);cursor:pointer}.bill-list__right-head__display label:hover{background-color:var(--color-primary)}.bill-list__right-head__display label:has(input:checked){background-color:var(--color-primary)}.bill-list__right-head__display label svg{color:#fff;width:2.6rem}.bill-list__right-head__display label input{display:none}@media (max-width: 767px){.bill-list__right-head{flex-direction:column;align-items:stretch;width:100%}.bill-list__right-head .bill-list__metrics{min-width:0;width:100%;order:2}.bill-list__right-head .bill-list__controls{width:100%;justify-content:space-between;order:1}.bill-list__right-head .bill-list__controls .bill-list__account-filter{flex:1;min-width:0}}
