#mdp-theme-toggle{position:fixed;right:18px;bottom:18px;z-index:10000;border:1px solid #64748b!important;border-radius:999px!important;padding:10px 16px!important;background:#17243b!important;color:#f1f5f9!important;box-shadow:0 4px 16px #0003!important;font:600 14px system-ui!important;cursor:pointer;min-height:44px}#mdp-theme-toggle:focus-visible{outline:3px solid #93c5fd;outline-offset:3px}
@media screen{
html[data-theme=dark]{color-scheme:dark;--bubble-ink:#e2e8f0;--ui-bg:#0b1220;--ui-surface:#162237;--ui-surface-soft:#1d2c43;--ui-border:#3b4e69;--ui-text:#e2e8f0;--ui-muted:#b5c3d8}
html[data-theme=dark] body{background:#0b1220!important;color:#e2e8f0!important}
html[data-theme=dark] :is(.card,.panel,.box,.stat,.summary-card,.modal-content,.modal-box,dialog,fieldset,header,.side-nav,.app-sidebar,.sidebar,.topbar){background:#162237!important;color:#e2e8f0!important;border-color:#3b4e69!important;box-shadow:0 6px 20px #0003!important}
html[data-theme=dark] :is(h1,h2,h3,h4,label,strong,b,.amount,.value,.stat-value,.side-brand,.brand){color:#e2e8f0!important}
html[data-theme=dark] :is(.muted,small,.subtitle,.description,.side-footer){color:#b5c3d8!important}
html[data-theme=dark] a{color:#a5c8ff!important}
html[data-theme=dark] :is(input,select,textarea){background:#101b2e!important;color:#f1f5f9!important;border-color:#526782!important;box-shadow:none!important}
html[data-theme=dark] input::placeholder,html[data-theme=dark] textarea::placeholder{color:#a9b8cd!important;opacity:1}
html[data-theme=dark] :is(input,select,textarea):disabled{background:#243044!important;color:#b5c3d8!important}
html[data-theme=dark] :is(button,.btn,summary){background:#253954!important;color:#e2e8f0!important;border-color:#526782!important;box-shadow:none!important}
html[data-theme=dark] :is(.btn.primary,button.primary,button[type=submit]){background:#365bc3!important;color:#fff!important}
html[data-theme=dark] :is(button,.btn):hover{filter:brightness(1.15)}
html[data-theme=dark] :is(table,.table,td){background:transparent!important;color:#e2e8f0!important;border-color:#3b4e69!important}
html[data-theme=dark] th{background:#243651!important;color:#cfdef5!important;border-color:#3b4e69!important}
html[data-theme=dark] tbody tr:hover{background:#20324b!important}
html[data-theme=dark] :is(.notice,.alert,.info){background:#182f50!important;color:#b9d6ff!important;border-color:#42628e!important}
html[data-theme=dark] :is(.error,.danger,.bad,.alert-danger){background:#492630!important;color:#ffb7c2!important;border-color:#8e485c!important}
html[data-theme=dark] :is(.warn,.warning){background:#42351b!important;color:#ffdb8c!important;border-color:#8b723d!important}
html[data-theme=dark] :is(.ok,.success){background:#143c32!important;color:#9ce8c5!important;border-color:#3f816e!important}
html[data-theme=dark] :is(.side-nav a.active,.side-nav a:hover){background:#29456c!important;color:#fff!important;box-shadow:none!important}
html[data-theme=dark] :is(.brand small,header .muted){color:#a5c8ff!important}
html[data-theme=dark] .modal{background:rgba(3,7,18,.75)!important}
html[data-theme=dark] :is(.modal .card,.modal>div){background:#162237!important;color:#e2e8f0!important}
html[data-theme=dark] #mdp-theme-toggle{background:#e2e8f0!important;color:#17243b!important}
html[data-theme=dark] hr{border-color:#3b4e69!important}
}
@media print{#mdp-theme-toggle{display:none!important}html{color-scheme:light!important}}

@media screen{html[data-theme=dark] .workspace-pagehead{background:#162237!important;color:#e2e8f0!important;border:1px solid #3b4e69!important;box-shadow:0 6px 20px #0003!important}html[data-theme=dark] .workspace-pagehead p{color:#b5c3d8!important}html[data-theme=dark] input:not([type=checkbox]):not([type=radio]):not([type=submit]):not([type=button]):not([type=hidden]){background:#101b2e!important;color:#f1f5f9!important;border-color:#526782!important;box-shadow:none!important}}

@media screen{html[data-theme=dark] :is(details,.analytics-chart,.tile){background:#162237!important;color:#e2e8f0!important;border-color:#3b4e69!important;box-shadow:none!important}html[data-theme=dark] #billing .stat .n,html[data-theme=dark] .stat .n{color:#f1f5f9!important}html[data-theme=dark] :is(.analytics-chart span,.analytics-chart strong,.analytics-chart small){color:#c9d8ee!important}html[data-theme=dark] .progress-track{background:#33445d!important}}

@media screen{html[data-theme=dark] :is(#paymentModal,#subscriberModal,#suspendModal,#reactivateModal) label{color:#cbd5e1!important}}

@media screen{html[data-theme=dark] main>section{background:#162237!important;color:#e2e8f0!important;border-color:#3b4e69!important}html[data-theme=dark] .cards>div{background:#243651!important;color:#e2e8f0!important}}

/* Mobile navigation and shared form layout. Kept after the legacy styles. */
.mdp-menu-button,.mdp-menu-close,.mdp-nav-backdrop,.mdp-profile{display:none}
@media screen and (max-width:900px){
 html{scroll-padding-top:80px}
 body{min-width:0!important}
 body.mdp-nav-open{overflow:hidden}
 body.mdp-mobile-ready>header{position:sticky!important;top:0;z-index:1100;margin:0!important;width:100%!important;height:auto!important;min-height:64px!important;display:flex!important;flex-direction:row!important;align-items:center!important;gap:10px!important;padding:10px 12px!important;box-sizing:border-box}
 body.mdp-mobile-ready>header .brand{font-size:17px!important;margin:0!important;flex:1;min-width:0}
 body.mdp-mobile-ready>header .brand small{display:none}
 body.mdp-mobile-ready>header>.actions{display:none!important}
 body.mdp-mobile-ready .mdp-menu-button,body.mdp-mobile-ready .mdp-menu-close{display:inline-flex!important;align-items:center;justify-content:center;min-width:44px;min-height:44px;margin:0!important;padding:8px!important;font-size:23px!important}
 body.mdp-mobile-ready .app-sidebar{position:fixed!important;inset:0 auto 0 0!important;width:min(320px,88vw)!important;height:100vh;height:100dvh;padding:16px!important;z-index:1300!important;transform:translateX(-105%);visibility:hidden;overflow-y:auto!important;overscroll-behavior:contain;box-sizing:border-box!important}
 body.mdp-nav-open .app-sidebar{transform:none;visibility:visible}
 body.mdp-mobile-ready .side-brand{padding:12px 48px 18px 8px!important}
 .mdp-menu-close{position:absolute;right:12px;top:12px}
 body.mdp-mobile-ready .side-nav{display:flex!important;flex-direction:column!important;gap:4px!important}
 body.mdp-mobile-ready .side-nav a{flex:none!important;justify-content:flex-start!important;min-height:44px!important;padding:10px 12px!important;font-size:14px!important}
 body.mdp-nav-open .mdp-nav-backdrop{display:block;position:fixed;inset:0;background:#0008;z-index:1200}
 body.mdp-mobile-ready .mdp-profile{display:block;position:relative}
 .mdp-profile summary{list-style:none;cursor:pointer;border:1px solid #64748b;border-radius:50%;width:44px;height:44px;display:grid;place-items:center;font-size:16px;font-weight:700}
 .mdp-profile-panel{position:absolute;right:0;top:52px;width:min(270px,85vw);padding:16px;border:1px solid #64748b;border-radius:14px;background:var(--bubble-surface,#f8faff);box-shadow:0 10px 32px #0004;display:grid;gap:10px}
 html[data-theme=dark] .mdp-profile-panel{background:#162237;color:#e2e8f0}
 .mdp-profile-panel strong{overflow-wrap:anywhere;text-transform:none}
 .mdp-profile-panel a{display:flex;align-items:center;min-height:44px;padding:8px 10px;text-decoration:none}
 html body #mdp-theme-toggle{position:static!important;display:block;margin:16px auto!important;max-width:calc(100% - 32px);z-index:auto!important}
 html body .mdp-profile-panel #mdp-theme-toggle{margin:0!important;max-width:100%;width:100%}
 html body :is(#mdp-layout-priority,main){margin-left:0!important;max-width:100%!important;min-width:0!important;padding:12px!important;box-sizing:border-box}
 html body :is(#mdp-layout-priority,main) :is(section,.card,.two,.grid,.field,.analytics-chart,.analytics-row){min-width:0;max-width:100%;box-sizing:border-box}
 html body :is(#mdp-layout-priority,main) .card{padding:16px!important;border-radius:16px!important}
 html body :is(#mdp-layout-priority,main) :is(.grid,.summary-grid,.account-summary){grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important}
 html body :is(#mdp-layout-priority,main) :is(.two,.form,.analytics-row){grid-template-columns:minmax(0,1fr)!important}
 html body .workspace-pagehead{padding:16px!important;margin-bottom:14px!important}
 html body h1{font-size:24px!important}
 html body :is(.topline,.statement-head,.statement-footer,.receipt-amount){flex-wrap:wrap;gap:12px}
 html body :is(input,select,textarea){font-size:16px!important;min-height:44px;box-sizing:border-box}
 html body input:is([type=checkbox],[type=radio]){min-height:24px;min-width:24px;width:auto}
 html body :is(button,.btn){min-height:44px!important;white-space:normal;overflow-wrap:anywhere;box-sizing:border-box}
 html body :is(#mdp-layout-priority,main) .actions{flex-wrap:wrap!important;gap:8px!important}
 html body :is(#mdp-layout-priority,main) .actions>*{max-width:100%;min-width:0}
 html body :is(#mdp-layout-priority,main) :is(.table,.scroll,.mdp-table-scroll){display:block!important;width:100%!important;max-width:100%!important;overflow:auto!important;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain}
 html body :is(#mdp-layout-priority,main) :is(#mdp-table-priority,table){display:table!important;min-width:680px!important;width:100%!important;table-layout:auto!important}
 html body :is(#mdp-layout-priority,main) :is(#mdp-table-priority,table) :is(th,td){display:table-cell!important;width:auto!important;min-width:80px!important;font-size:13px!important;white-space:normal!important;overflow-wrap:normal!important}
 html body :is(#mdp-layout-priority,main) :is(#mdp-table-priority,table) th:after{content:none!important}
 html body :is(#mdp-layout-priority,main) :is(#mdp-table-priority,table) td:before{content:none!important}
 html body :is(#mdp-layout-priority,main) :is(#mdp-table-priority,table) tr{display:table-row!important}
 html body :is(#mdp-layout-priority,main) :is(#mdp-table-priority,table) :is(thead,tbody){display:table-row-group!important}
 html body :is(#subscriberModal,#paymentModal,#suspendModal,#reactivateModal){padding:8px!important;align-items:flex-start!important;overflow-y:auto!important}
 html body :is(#subscriberModal,#paymentModal,#suspendModal,#reactivateModal)>.card{width:100%!important;max-height:calc(100dvh - 16px)!important;overflow:auto!important;margin:0!important}
 html body :is(#subscriberModal,#paymentModal,#suspendModal,#reactivateModal) .form{grid-template-columns:minmax(0,1fr)!important}
}
@media screen and (max-width:380px){html body :is(#mdp-layout-priority,main) :is(.grid,.summary-grid,.account-profile,.receipt-grid,.statement-customer){grid-template-columns:minmax(0,1fr)!important}}
@media print{.mdp-menu-button,.mdp-menu-close,.mdp-nav-backdrop,.mdp-profile{display:none!important}}
@media screen and (max-width:900px){
 html body.mdp-mobile-ready>header .mdp-profile{padding:0!important;margin:0!important;border:0!important;background:transparent!important;box-shadow:none!important}
 html body.mdp-mobile-ready>header .brand small{display:none!important}
 html body :is(#mdp-layout-priority,main) .card.stat{box-shadow:none!important}
}
/* Keep the sign-in card and theme switch in separate rows. */
body:has(>.login-card){flex-direction:column;gap:16px;padding:24px 16px;box-sizing:border-box;min-height:100svh}
body>.login-card{box-sizing:border-box;width:100%;max-width:420px;flex-shrink:0}
body:has(>.login-card)>#mdp-theme-toggle{position:static!important;flex:none;width:auto!important;max-width:100%;margin:0!important}
@media(max-width:480px){body>.login-card{padding:24px!important}body>.login-card .brand{font-size:24px}}

/* Subscriber workspace: page scrolling, readable rows, stable action sizes. */
html body #subscribers #subscriberList {max-height:none!important;overflow-x:auto!important;overflow-y:visible!important;}
html body #subscribers #subscriberList table {min-width:1250px!important;table-layout:auto!important;}
html body #subscribers #subscriberList th {position:static!important;}
html body #subscribers #subscriberList td {vertical-align:middle;}
html body #subscribers #subscriberList td:first-child {min-width:105px;white-space:nowrap;}
html body #subscribers #subscriberList td:nth-child(2) {min-width:150px;}
html body #subscribers #subscriberList td:last-child {min-width:310px;width:330px;}
html body #subscribers #subscriberList td .actions {display:flex!important;flex-wrap:wrap!important;justify-content:flex-start;gap:6px!important;}
html body #subscribers #subscriberList td .actions .btn {flex:0 0 auto!important;white-space:nowrap!important;word-break:normal!important;overflow-wrap:normal!important;min-height:34px;padding:7px 12px!important;line-height:1.25!important;max-width:none!important;}
html body #subscribers #subscriberList tr[hidden] {display:none!important;}
html body #subscribers .topline {flex-wrap:wrap;justify-content:flex-start;gap:12px;}
html body #subscribers .topline>div {flex:1 1 260px;}
html body #subscribers .topline .btn {white-space:normal;line-height:1.3;flex-shrink:0;}
.subscriber-list-controls {display:flex;align-items:center;flex-wrap:wrap;gap:10px;margin:12px 0;}
.subscriber-list-controls select {width:auto;max-width:210px;}
.subscriber-list-controls .btn:disabled {opacity:.45;cursor:default;}
@media(max-width:800px){
 html body #subscribers>.grid {grid-template-columns:repeat(2,minmax(0,1fr))!important;}
 html body #subscribers .topline {display:grid!important;grid-template-columns:minmax(0,1fr)!important;align-items:stretch;gap:12px!important;}
 html body #subscribers .topline>div,html body #subscribers .topline>.btn,html body #subscribers .topline>form {flex:none!important;min-height:0!important;height:auto!important;margin:0!important;}
 html body #subscribers .topline .btn {display:flex!important;align-items:center!important;justify-content:center!important;box-sizing:border-box!important;min-height:44px!important;height:auto!important;width:100%!important;padding:12px 16px!important;border-radius:12px!important;}
 html body #subscribers #subscriberList td .actions .btn {min-height:40px;}
}

/* Keep primary subscriber actions in fixed slots; secondary actions expand on demand. */
html body #subscribers #subscriberList td:last-child {min-width:310px!important;width:310px!important;}
html body #subscribers #subscriberList td .subscriber-actions {display:grid!important;grid-template-columns:64px 112px 86px!important;align-items:start!important;gap:8px!important;}
html body #subscribers #subscriberList td .subscriber-actions>.btn,
html body #subscribers #subscriberList td .subscriber-more>.subscriber-more-toggle {display:flex!important;align-items:center!important;justify-content:center!important;width:100%!important;height:36px!important;min-height:36px!important;box-sizing:border-box!important;margin:0!important;padding:0 10px!important;border-radius:9px!important;font-family:inherit!important;font-size:12px!important;font-weight:600!important;line-height:1!important;white-space:nowrap!important;}
html body #subscribers #subscriberList td .subscriber-pay {grid-column:2;}
html body #subscribers #subscriberList td .subscriber-more {grid-column:3;min-width:0;}
html body #subscribers #subscriberList td .subscriber-more>.subscriber-more-toggle {cursor:pointer;list-style:none!important;gap:6px;}
html body #subscribers #subscriberList td .subscriber-more-menu {display:grid;grid-template-columns:1fr 1fr;gap:6px;grid-column:1 / -1;padding:8px;background:var(--card,#182538);border:1px solid #40536c;border-radius:10px;}
html body #subscribers #subscriberList td .subscriber-more-menu .btn {display:flex!important;align-items:center;justify-content:center;box-sizing:border-box;width:100%!important;height:36px!important;min-height:36px!important;border-radius:7px!important;font-family:inherit!important;font-size:12px!important;}
html body #subscribers #subscriberList td .subscriber-more {margin:0!important;padding:0!important;border:0!important;background:transparent!important;box-shadow:none!important;width:auto!important;}
html body #subscribers #subscriberList td .subscriber-more-menu[popover] {display:none;position:fixed!important;inset:auto;margin:0!important;width:268px!important;max-width:calc(100vw - 16px)!important;max-height:calc(100dvh - 16px);overflow:auto;box-sizing:border-box;z-index:10000;box-shadow:0 12px 32px #0005;}
html body #subscribers #subscriberList td .subscriber-more-menu:popover-open {display:grid;}

/* Suspension actions stay fully clickable instead of wrapping inline links. */
html body :is(#mdp-layout-priority,main) #suspended-subscribers .suspension-action-cell {min-width:180px!important;width:180px!important;vertical-align:middle!important;}
html body :is(#mdp-layout-priority,main) #suspended-subscribers .suspension-actions {display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:8px!important;min-width:156px;}
html body :is(#mdp-layout-priority,main) #suspended-subscribers .suspension-actions .btn {display:flex!important;align-items:center!important;justify-content:center!important;box-sizing:border-box!important;width:100%!important;min-width:0!important;min-height:44px!important;height:auto!important;margin:0!important;padding:10px 12px!important;border-radius:10px!important;font-family:inherit!important;font-size:12px!important;line-height:1.3!important;white-space:nowrap!important;word-break:normal!important;overflow-wrap:normal!important;}
