@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');
:root{--bg:#f4f6fa;--ink:#172235;--muted:#748095;--line:#e6eaf1;--blue:#315eea;--nav:#111c2e;--white:#fff;--green:#16865c}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font-family:'DM Sans',sans-serif;font-size:14px}h1,h2,strong{font-family:'Manrope','DM Sans',sans-serif}h1{font-size:30px;letter-spacing:-1px;margin:4px 0 8px}h2{font-size:16px;margin:0 0 7px}p{margin:0 0 8px}.muted{color:var(--muted);line-height:1.55}.tiny{font-size:11px}.eyebrow{font-size:10px;letter-spacing:1.5px;color:#8491a7;font-weight:700;margin:0 0 8px}.shell{min-height:100vh}.sidebar{width:246px;background:var(--nav);position:fixed;inset:0 auto 0 0;color:#dbe3f2;padding:25px 17px;display:flex;flex-direction:column;z-index:2}.brand{display:flex;align-items:center;gap:11px;padding:0 8px 32px}.brand strong{display:block;color:#fff;font-size:14px}.brand small{display:block;color:#8796ad;font-size:11px;margin-top:3px}.brandmark{width:36px;height:36px;border-radius:12px;background:#315eea;color:white;display:inline-flex;align-items:center;justify-content:center;font-weight:800;font-family:Manrope;letter-spacing:-1px;flex-shrink:0}.brandmark.big{width:64px;height:64px;border-radius:19px;font-size:23px;letter-spacing:-1.2px;box-shadow:0 7px 18px #315cf535}.sidebar nav{display:grid;gap:6px}.sidebar nav a{color:#9cabc2;text-decoration:none;padding:12px 13px;border-radius:9px;display:flex;gap:13px;align-items:center;font-size:13px}.sidebar nav a:hover,.sidebar nav a:focus{background:#1c2c46;color:#fff}.sidebottom{margin-top:auto;border-top:1px solid #29364a;padding:18px 8px 0;color:#dbe3f2;font-size:12px}.sidebottom small{display:block;color:#8493aa;margin:7px 0 12px}.dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:#38c995;margin-right:6px}.logout{border:1px solid #3b4960;background:transparent;color:#dbe3f2;padding:9px 12px;border-radius:7px;cursor:pointer;width:100%}.main{margin-left:246px;padding:32px 34px 20px;max-width:1800px}.topbar{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:24px}.userpill{display:flex;align-items:center;gap:10px;background:white;border:1px solid var(--line);padding:8px 12px;border-radius:12px}.avatar{background:#e9efff;color:#315eea;width:34px;height:34px;display:grid;place-items:center;border-radius:10px;font-weight:700}.userpill strong,.userpill small{display:block}.userpill small{color:var(--muted);font-size:11px;margin-top:2px}.stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-bottom:20px}.stat,.panel{background:white;border:1px solid var(--line);border-radius:14px;box-shadow:0 2px 8px #192b4405}.stat{padding:19px 20px}.statlabel{color:var(--muted);font-size:12px;display:flex;justify-content:space-between}.statlabel span{font-size:18px;color:#8796ac}.stat>strong{font-size:32px;display:block;letter-spacing:-1px;margin:10px 0 4px}.stat small{color:#8a95a7;font-size:11px}.twocol{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:18px;margin-bottom:18px}.panel{padding:21px;margin-bottom:18px;min-width:0}.sectionhead{display:flex;justify-content:space-between;align-items:flex-start;gap:15px;margin-bottom:17px}.sectionhead p{font-size:12px;margin:0}.textlink{color:var(--blue);text-decoration:none;font-size:12px;font-weight:700;white-space:nowrap}.notice{border:1px solid #dbe6ff;background:#eef3ff;border-radius:11px;padding:13px 15px;display:flex;gap:12px;margin-bottom:18px;color:#405273;font-size:12px;line-height:1.5}.notice strong{color:#2345a8;white-space:nowrap}.empty{padding:28px 15px;text-align:center;color:var(--muted)}.empty>span{font-size:25px;display:block;color:#aab6c8;margin-bottom:8px}.empty strong{display:block;color:#435069;margin-bottom:6px}.empty p{font-size:12px;margin-bottom:13px}.tablewrap{overflow:auto}table{width:100%;border-collapse:collapse;font-size:12px;white-space:nowrap}th{text-align:left;color:#8994a7;font-size:10px;text-transform:uppercase;letter-spacing:.7px;font-weight:700;padding:10px 11px;border-bottom:1px solid var(--line)}td{padding:13px 11px;border-bottom:1px solid #f0f2f6;color:#59667a}tbody tr:last-child td{border-bottom:0}td strong{color:#29364a;font-size:12px}code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:11px;color:#43516a;background:#f3f5f9;padding:4px 6px;border-radius:5px}.eventlist{display:grid}.event{display:flex;gap:11px;padding:12px 0;border-bottom:1px solid #eff2f6}.event:last-child{border:0}.eventicon{width:28px;height:28px;border-radius:8px;background:#edf2ff;color:#315eea;display:grid;place-items:center;flex-shrink:0}.event strong{font-size:12px}.event p{color:#657186;font-size:11px;margin:4px 0}.event small{color:#9aa4b4;font-size:10px}.tag{font-size:10px;font-weight:700;color:#596780;background:#f0f3f8;padding:6px 8px;border-radius:6px;white-space:nowrap}.stack{display:grid;gap:14px}.formrow{display:grid;grid-template-columns:1fr 1fr;gap:13px}label{display:grid;gap:7px;font-size:12px;color:#526077;font-weight:600}input,select{width:100%;border:1px solid #dce2eb;background:white;border-radius:8px;padding:11px 12px;font:inherit;color:#25334a;outline:none}input:focus,select:focus{border-color:#7391f4;box-shadow:0 0 0 3px #315eea13}button{font:inherit;cursor:pointer}.primary{border:0;border-radius:8px;background:var(--blue);color:white;padding:11px 14px;font-weight:700;font-size:12px;display:inline-flex;justify-content:center;align-items:center;gap:16px;text-decoration:none}.primary:hover{background:#244bd0}.primary.full{width:100%;margin-top:5px}.secondary{background:white;border:1px solid #dfe5ee;color:#526078;border-radius:7px;padding:8px 10px;font-size:11px;font-weight:700}.dangerbtn{background:white;border:1px solid #f1d4d4;color:#b44343;border-radius:7px;padding:8px 10px;font-size:11px}.actions{display:flex;gap:7px}.featurelist{padding-left:18px;color:#647187;font-size:12px;line-height:2}.tablepanel{padding-bottom:12px}.cellsub{display:block;color:#a0a9b7;font-size:10px;margin-top:4px}.status{font-size:11px;font-weight:700}.status:before{content:'';display:inline-block;width:6px;height:6px;border-radius:50%;margin-right:6px}.status.on{color:#16865c}.status.on:before{background:#28b883}.status.off{color:#b44343}.status.off:before{background:#d65b5b}.alert{border-radius:9px;padding:13px 15px;margin:0 0 16px;font-size:12px;line-height:1.5}.alert.danger{background:#fff0f0;border:1px solid #f3d2d2;color:#a73b3b}.alert.success{background:#edfbf5;border:1px solid #c9f0df;color:#176a4d}.alert.warning{background:#fff8e8;border:1px solid #f5e5b7;color:#8d6816}.alert p{margin-top:7px}.loginwrap{max-width:900px;margin:8vh auto;display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:center}.authmain{margin:0 auto;padding:24px;width:100%;min-height:100vh;display:flex;flex-direction:column;justify-content:center}.loginbrand h1{font-size:42px}.loginbrand .eyebrow{margin-top:25px}.loginform{padding:28px}.loginform h2{font-size:20px}.loginform>p{font-size:12px;margin-bottom:22px}.loginform label{margin-bottom:14px}.loginform .tiny{font-size:10px;margin:13px 0 0;text-align:center}.sidebottom form{margin-top:12px}footer{text-align:center;color:#a4adbb;font-size:10px;padding:25px 0 5px}
@media(max-width:1000px){.sidebar{width:205px}.main{margin-left:205px;padding:25px 22px}.twocol{grid-template-columns:1fr}.loginwrap{gap:25px}}
@media(max-width:700px){.sidebar{position:static;width:100%;height:auto;padding:12px 14px}.brand{padding:0 5px 12px}.sidebar nav{display:flex;overflow:auto}.sidebar nav a{padding:9px;white-space:nowrap}.sidebottom{display:none}.main{margin:0;padding:20px 13px}.stats{grid-template-columns:1fr}.topbar{align-items:flex-start}.userpill{display:none}.formrow{grid-template-columns:1fr}.loginwrap{grid-template-columns:1fr;margin:15px auto;max-width:440px}.loginbrand{padding:12px}.loginbrand h1{font-size:34px}.authmain{padding:16px}.loginform{padding:21px}.notice{display:block}.notice strong{display:block;margin-bottom:4px}}
.formgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:14px;align-items:end;margin-top:16px}.formgrid label{display:flex;flex-direction:column;gap:7px;font-size:.9rem;color:var(--muted,#667085)}.formgrid input,.formgrid select{width:100%;padding:10px 12px;border:1px solid #d0d5dd;border-radius:8px;background:#fff;color:#101828}.formgrid .checkline{display:flex;flex-direction:row;align-items:center}.formgrid .checkline input{width:auto}

/* Dashboard 8083 improvements: clear white cards and responsive real-data metrics. */
.dashboard-stats{grid-template-columns:repeat(6,minmax(0,1fr))}.dashboard-secondary{grid-template-columns:repeat(3,minmax(0,1fr));margin-top:-2px}.statstatus{font-size:20px!important;letter-spacing:-.4px!important}.stat .textlink{display:inline-block;margin-top:8px;font-size:11px}
@media(max-width:1250px){.dashboard-stats{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:850px){.dashboard-stats,.dashboard-secondary{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:480px){.dashboard-stats,.dashboard-secondary{grid-template-columns:1fr}}

/* v6: orderly client workspace, role permissions, and clear session-data limitations */
.clients-stats{grid-template-columns:repeat(5,minmax(0,1fr));margin-bottom:18px}
.create-client-panel{padding:24px}
.client-create-form{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;align-items:end}
.client-create-form>label{display:flex;flex-direction:column;gap:8px;min-width:0}
.client-create-form .demo-option{grid-column:span 2;display:flex;align-items:center;gap:10px;padding:12px 14px;border:1px solid var(--line);border-radius:10px;min-height:54px}
.demo-option input{width:auto;flex-shrink:0}.demo-option strong,.demo-option small{display:block}.demo-option small{font-size:11px;color:var(--muted);font-weight:400;margin-top:4px}
.create-button{min-height:48px}
.filter-tabs{display:flex;gap:8px;flex-wrap:wrap;margin:4px 0 18px;border-bottom:1px solid var(--line);padding-bottom:14px}
.filter-tabs a{padding:8px 13px;border:1px solid var(--line);border-radius:9px;text-decoration:none;color:#58677e;background:#fff;font-size:12px;font-weight:700}
.filter-tabs a.selected{background:#eaf0ff;border-color:#cbd8ff;color:#2345b5}
.client-filters{display:flex;align-items:end;gap:12px;flex-wrap:wrap;margin-bottom:16px}.client-filters label{min-width:240px;flex:1}
.secondary-link{color:#526078;font-size:12px;text-decoration:none;padding:9px 10px}
.clients-table{min-width:1120px}.clients-table td{vertical-align:middle}.clients-table td:first-child{min-width:145px}.clients-table td:first-child small{display:block;margin-top:5px}
.client-actions{display:flex;gap:7px;align-items:center;flex-wrap:wrap}.inlineform{display:flex;gap:5px;align-items:center}.inlineform select{max-width:110px;padding:8px;font-size:11px}
.connection-pill{display:inline-flex;align-items:center;gap:7px;padding:6px 9px;border-radius:999px;font-size:11px;font-weight:700;white-space:nowrap}.connection-pill i{width:7px;height:7px;border-radius:50%;display:inline-block;background:#9aa4b2}.connection-pill.unknown{color:#667085;background:#f2f4f7}.connection-note{margin-top:14px;line-height:1.6}
.permission-box{display:grid;gap:12px;padding:16px;border:1px solid var(--line);border-radius:11px;background:#fbfcfe}.permission-box>.checkline{display:flex;flex-direction:row;align-items:center;gap:9px}.permission-box input{width:auto}.server-check-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px;margin-top:12px}.server-check-grid .checkline{display:flex;flex-direction:row;align-items:flex-start;gap:9px;padding:11px;border:1px solid var(--line);border-radius:9px}.server-check-grid input{width:auto;margin-top:2px}.permission-edit{margin-top:8px}.permission-edit form{padding:12px;min-width:230px;background:#fbfcfe;border:1px solid var(--line);border-radius:8px}.permission-edit .checkline{display:flex;flex-direction:row;align-items:center;gap:8px}.permission-edit input{width:auto}
@media(max-width:1100px){.client-create-form{grid-template-columns:repeat(2,minmax(0,1fr))}.clients-stats{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:700px){.client-create-form{grid-template-columns:1fr}.client-create-form .demo-option{grid-column:auto}.clients-stats{grid-template-columns:repeat(2,minmax(0,1fr))}.client-filters label{min-width:100%}}

.credential-panel{max-width:900px;padding:28px}.credential-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:22px 0}.credential-grid>div{display:grid;gap:8px;padding:16px;border:1px solid var(--line);border-radius:10px;min-width:0}.credential-grid>div strong{font-size:14px}.credential-grid code{white-space:normal;overflow-wrap:anywhere}.copy-credentials{width:100%;min-height:48px;margin:4px 0 12px}.copy-credentials.copied{background:#16865c}.credential-panel .secondary-link{display:inline-block;margin-top:14px}@media(max-width:600px){.credential-grid{grid-template-columns:1fr}}

.connection-pill.connected{color:#087443;background:#e8f8ef}.connection-pill.connected i{background:#16a36a}.connection-pill.waiting{color:#956500;background:#fff5d8}.connection-pill.waiting i{background:#e7a008}.clients-table{min-width:1240px}

/* v7 navigation: collapsible, scrollable, and with persistent active-route highlight. */
.sidebar{overflow-y:auto;overflow-x:hidden;transition:width .18s ease,padding .18s ease}.sidebar nav{flex:1;align-content:start;overflow-y:auto;padding-right:2px}.sidebar nav a{position:relative;min-height:42px}.sidebar nav a.active{background:#243653;color:#fff;box-shadow:inset 3px 0 0 #4d79ff;font-weight:700}.sidebar nav a.active .nav-icon{color:#8eabff}.nav-icon{width:17px;min-width:17px;text-align:center;font-size:16px;line-height:1}.brand{position:relative;flex-shrink:0}.brand-copy{min-width:0}.sidebar-toggle{margin-left:auto;width:27px;height:27px;flex-shrink:0;border:1px solid #33435b;border-radius:7px;background:#17253a;color:#dbe3f2;font-size:20px;line-height:1;display:grid;place-items:center}.sidebar-toggle:hover{background:#293b58}.logout-short{display:none}.sidebar-collapsed .sidebar{width:78px;padding:22px 11px}.sidebar-collapsed .main{margin-left:78px}.sidebar-collapsed .brand{padding:0 4px 28px;justify-content:center;flex-wrap:wrap}.sidebar-collapsed .brand-copy,.sidebar-collapsed .nav-label{display:none}.sidebar-collapsed .sidebar-toggle{margin:8px auto 0}.sidebar-collapsed .sidebar nav a{justify-content:center;padding:12px 5px}.sidebar-collapsed .sidebar nav a.active{box-shadow:inset 0 -3px 0 #4d79ff}.sidebar-collapsed .sidebottom{padding:15px 2px 0;text-align:center}.sidebar-collapsed .sidebottom .dot{margin-right:0}.sidebar-collapsed .logout{padding:9px 4px}.sidebar-collapsed .logout-short{display:inline}.fslb-endpoint-note{display:flex;gap:10px;align-items:flex-start;background:#f5f7fb;border:1px solid var(--line);border-radius:9px;padding:12px 14px;margin:12px 0 18px;color:#536179;font-size:12px;line-height:1.5}.fslb-endpoint-note strong{color:#27364d}.dns-add-grid{display:grid;grid-template-columns:1.2fr .6fr 1.4fr auto;gap:12px;align-items:end}.dns-proxy-toggle{display:flex;align-items:center;gap:8px;min-height:42px}.dns-proxy-toggle input{width:auto}.proxy-state{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:700}.proxy-state.on{color:#bd6b00}.proxy-state.on:before{content:'';width:8px;height:8px;border-radius:50%;background:#f59e0b}.proxy-state.off{color:#667085}.proxy-state.off:before{content:'';width:8px;height:8px;border-radius:50%;background:#9aa4b2}
@media(max-width:700px){.sidebar{position:fixed;width:78px;height:100vh;padding:14px 10px}.sidebar .brand-copy,.sidebar .nav-label{display:none}.sidebar .brand{padding:0 4px 18px;flex-wrap:wrap;justify-content:center}.sidebar .sidebar-toggle{margin:8px auto 0}.sidebar nav a{justify-content:center;padding:12px 5px}.sidebar nav a.active{box-shadow:inset 0 -3px 0 #4d79ff}.sidebar .sidebottom{padding:12px 2px 0;text-align:center}.sidebar .sidebottom .dot{margin-right:0}.sidebar .logout{padding:9px 4px}.sidebar .logout-short{display:inline}.main{margin-left:78px;padding:18px 12px}.sidebar-collapsed .sidebar{width:78px}.sidebar-collapsed .main{margin-left:78px}.dns-add-grid{grid-template-columns:1fr}}
.firewall-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:16px}.firewall-options article{display:grid;gap:12px;align-content:start;padding:16px;border:1px solid var(--line);border-radius:11px;min-width:0}.firewall-options article>strong{font-size:13px}.firewall-options article p{font-size:12px;min-height:54px}.firewall-options button:disabled,.firewall-options input:disabled{opacity:.55;cursor:not-allowed}@media(max-width:900px){.firewall-options{grid-template-columns:1fr}}

/* v7.1: public IP/country and compact client actions */
.compact-actions{gap:5px;max-width:290px}.compact-actions .inlineform{gap:4px}.compact-actions .inlineform select{max-width:84px;padding:7px 5px}.compact-actions .secondary,.compact-actions .dangerbtn{padding:7px 8px}.more-actions{position:relative}.more-actions summary{list-style:none;cursor:pointer;border:1px solid #f1d4d4;color:#b44343;background:#fff;border-radius:7px;padding:7px 9px;font-size:11px;font-weight:700}.more-actions summary::-webkit-details-marker{display:none}.more-actions form{position:absolute;right:0;top:calc(100% + 5px);z-index:5;background:#fff;padding:8px;border:1px solid var(--line);border-radius:8px;box-shadow:0 8px 24px #17223520}.more-actions:not([open]) form{display:none}.copy-client:disabled{opacity:.6;cursor:wait}

/* v7.2: make country flag emoji reliably visible and keep endpoint access controls compact */
.geo-flag{display:inline-block;font-family:"Segoe UI Emoji","Apple Color Emoji","Noto Color Emoji",sans-serif;font-size:16px;line-height:1;vertical-align:-2px;margin-right:3px}.endpoint-access{position:relative}.endpoint-access>summary{cursor:pointer;list-style:none;background:#fff;border:1px solid #dfe5ee;color:#526078;border-radius:7px;padding:8px 10px;font-size:11px;font-weight:700}.endpoint-access[open] form{position:absolute;right:0;top:32px;z-index:5;min-width:210px;padding:12px;background:white;border:1px solid var(--line);border-radius:9px;box-shadow:0 8px 24px #192b4418}.endpoint-access .checkline{display:flex;align-items:center;gap:8px}.endpoint-access .checkline input{width:auto}


/* IKS visual readability and copy controls */
.clients-table { font-size: 13px; }
.clients-table th { font-size: 11px; padding: 13px 12px; }
.clients-table td { padding: 15px 12px; vertical-align: middle; }
.clients-table td strong { font-size: 13px; }
.clients-table .cellsub { font-size: 11px; color: #68768b; line-height: 1.45; }
.clients-table tbody tr:hover { background: #f7f9ff; }
.clients-table .geo-flag { font-size: 19px; }
.client-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 7px; }
.client-actions button, .client-actions select { min-height: 36px; }
.copy-client, .copy-generated, .copy-credentials { white-space: nowrap; }
.generated-account { padding: 17px 18px; }
.generated-account code { display: inline-block; font-size: 13px; overflow-wrap: anywhere; }
.generated-account .copy-generated { margin: 6px 0; }
.tablewrap { max-width: 100%; }
@media (max-width: 900px) {
  .main { margin-left: 0; padding: 20px 14px; }
  .clients-table th, .clients-table td { padding: 12px 10px; }
  .panel { padding: 15px; }
}

/* Integrated v7.3 readability and compact action controls */
:root{--muted:#59677d;--line:#dce3ed}
body{font-size:14px;color:#172235}
.muted{color:#59677d}
.stat small,.cellsub,.userpill small{color:#65738a}
td{color:#3f4d63}
th{color:#65738a}
.clients-table .cellsub{color:#58677e}
.sidebar nav{gap:5px}
.sidebar nav a{font-weight:600}
.client-actions{max-width:420px;gap:5px}
.client-actions .secondary,.client-actions .dangerbtn{padding:7px 9px}
.client-actions .inlineform select{max-width:88px}
.more-actions{display:none}
.metric-bars{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.metric-row>div:first-child{display:flex;justify-content:space-between;gap:10px;margin-bottom:10px;font-size:12px;color:#344258}
.metric-row>div:first-child span{font-weight:800;color:#172235}
.metric-track{height:10px;background:#edf1f7;border-radius:99px;overflow:hidden}
.metric-track i{display:block;height:100%;background:linear-gradient(90deg,#315eea,#5b8cff);border-radius:99px;min-width:2px}
@media(max-width:850px){.metric-bars{grid-template-columns:1fr}.client-actions{max-width:340px}}


/* IKS visual system v2: consistent typography, controls and spacing across modules */
:root{
  --bg:#f3f5f9;--ink:#152238;--muted:#58677d;--line:#d9e1ec;
  --blue:#315eea;--nav:#101c30;--white:#fff;--green:#16865c;
  --control-h:42px;--radius:9px;
}
body{font-family:'DM Sans',Arial,sans-serif;font-size:14px;line-height:1.5;color:var(--ink)}
h1,h2,h3,h4,strong,b,label,button,.primary,.secondary,.dangerbtn,.sidebar nav a,.tag,.status,th{font-weight:700}
h1{font-size:clamp(25px,2vw,30px);line-height:1.22;letter-spacing:-.55px;margin:4px 0 9px}
h2{font-size:17px;line-height:1.35;letter-spacing:-.15px;margin:0 0 9px}
p,.muted{font-size:13px;line-height:1.55}
.sidebar nav a{min-height:44px;font-size:13px;letter-spacing:0}
.sidebar nav a.active{background:#243652;color:#fff;box-shadow:inset 3px 0 0 #4f76ff}
.sidebar nav a.active .nav-label{font-weight:800}
.main{min-width:0}
.panel,.stat{border-color:#d9e2ef;border-radius:13px;box-shadow:0 2px 7px rgba(18,38,68,.035)}
.panel{padding:22px;margin-bottom:18px}
.sectionhead{align-items:center}
label{font-size:13px;color:#34445c;line-height:1.4;gap:7px}
input,select,textarea{min-height:var(--control-h);font-family:inherit;font-size:13px;font-weight:600;color:#18263c;border:1px solid #cbd5e3;border-radius:9px;padding:10px 12px;line-height:1.35}
input::placeholder,textarea::placeholder{color:#8995a7;font-weight:500;opacity:1}
input:focus,select:focus,textarea:focus{border-color:#315eea;box-shadow:0 0 0 3px rgba(49,94,234,.14);outline:0}
button,.primary,.secondary,.dangerbtn,.secondary-link{font-family:inherit;font-size:12px;font-weight:800;line-height:1.2;min-height:38px;border-radius:9px;letter-spacing:.05px}
.primary{padding:11px 16px;background:#315eea;color:#fff}
.primary:focus-visible,.secondary:focus-visible,.dangerbtn:focus-visible,.sidebar nav a:focus-visible{outline:3px solid rgba(49,94,234,.35);outline-offset:2px}
.secondary{padding:10px 14px;border-color:#cbd5e3;color:#263954}
.dangerbtn{padding:10px 13px}
.formgrid{gap:14px}
.formgrid label{font-size:13px;color:#34445c}
.formgrid input,.formgrid select{min-height:var(--control-h);font-size:13px;font-weight:600}
table{font-size:13px;line-height:1.45;white-space:normal}
th{font-size:11px;color:#42536b;letter-spacing:.55px;padding:12px}
td{font-size:13px;color:#34445c;padding:13px 12px;vertical-align:middle}
td strong{font-size:13px;color:#152238}
.tag{font-size:11px;padding:6px 9px;border-radius:7px}
.status{font-size:12px}
.cellsub,.tiny{font-size:12px;line-height:1.45}
.eyebrow{font-size:11px;letter-spacing:1.2px;font-weight:800}
.tablewrap{max-width:100%;border-radius:8px}
.tablewrap table{min-width:760px}
.clients-table{min-width:1120px}
.details,details{max-width:100%}
details summary{cursor:pointer;font-size:12px;font-weight:800;color:#315eea;padding:7px 0}
details[open] summary{margin-bottom:8px}
.client-actions,.actions{gap:8px;align-items:center;flex-wrap:wrap}
.filter-tabs a{min-height:38px;display:inline-flex;align-items:center;font-size:12px;font-weight:800}
.topbar{align-items:flex-start}
.topbar .muted{max-width:760px}
@media(max-width:900px){
 .clients-stats{grid-template-columns:repeat(2,minmax(0,1fr))}
 .client-create-form{grid-template-columns:repeat(2,minmax(0,1fr))}
 .main{padding:24px 20px}
}
@media(max-width:700px){
 .sidebar nav a{font-size:12px}
 .panel{padding:16px}
 .client-create-form,.formrow{grid-template-columns:1fr}
 .topbar{gap:10px}
 h1{font-size:25px}
}

/* FIX-ACCIONES-LINEALES-V1: acciones claras y alineadas */
.clients-table {
  min-width: 1320px;
  table-layout: auto;
}

.clients-table th:last-child,
.clients-table td:last-child {
  min-width: 340px;
  width: 340px;
  white-space: nowrap;
}

.clients-table td:last-child .actions,
.clients-table td:last-child .client-actions {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  flex-wrap: nowrap;
  gap: 8px;
  white-space: nowrap;
}

.clients-table td:last-child button,
.clients-table td:last-child .primary,
.clients-table td:last-child .secondary,
.clients-table td:last-child .dangerbtn,
.clients-table td:last-child .secondary-link {
  flex: 0 0 auto;
  min-height: 36px;
  margin: 0;
}

.clients-table td {
  vertical-align: middle;
}

.tablewrap {
  overflow-x: auto;
  max-width: 100%;
}

@media (max-width: 700px) {
  .clients-table {
    min-width: 1320px;
  }

  .clients-table th:last-child,
  .clients-table td:last-child {
    min-width: 340px;
  }
}

/* IKS-RESALTE-FILAS-V1: resalte suave al pasar sobre clientes y paneles */
.tablewrap table tbody tr {
  transition: background-color .16s ease, box-shadow .16s ease;
}

.tablewrap table tbody tr:hover > td {
  background-color: #eaf2ff !important;
}

.tablewrap table tbody tr:hover > td:first-child {
  box-shadow: inset 3px 0 0 #4778ee;
}

.tablewrap table tbody tr:focus-within > td {
  background-color: #f0f5ff;
}

.clients-table tbody tr:hover > td {
  background-color: #eaf2ff !important;
}

.clients-table tbody tr:hover > td:first-child {
  box-shadow: inset 3px 0 0 #4778ee;
}

@media (prefers-reduced-motion: reduce) {
  .tablewrap table tbody tr {
    transition: none;
  }
}


/* IKS-UX-REBUILD-2026-V1: clean, consistent tables and controls */
:root{--iks-blue:#1765f5;--iks-blue-soft:#eaf2ff;--iks-line:#dce5f2;--iks-text:#16243b;--iks-muted:#63738b}
body{font-family:'DM Sans',Inter,system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;color:var(--iks-text);font-size:13px;line-height:1.45}
h1,h2,h3{letter-spacing:-.025em}
.panel{border-color:var(--iks-line);border-radius:14px;box-shadow:0 5px 20px rgba(26,52,93,.045);padding:22px}
.tablewrap{max-width:100%;overflow:auto;border:1px solid var(--iks-line);border-radius:10px;background:#fff;scrollbar-gutter:stable}
.tablewrap table{width:100%;border-collapse:separate;border-spacing:0;margin:0;font-size:12px}
.tablewrap thead th{position:sticky;top:0;z-index:1;background:#f6f9fe;color:#42536e;font-size:10px;letter-spacing:.055em;text-transform:uppercase;white-space:nowrap;border-bottom:1px solid var(--iks-line);padding:12px 13px}
.tablewrap tbody td{padding:12px 13px;border-bottom:1px solid #eaf0f7;vertical-align:middle;line-height:1.45}
.tablewrap tbody tr:last-child td{border-bottom:0}
.tablewrap tbody tr{transition:background-color .14s ease,box-shadow .14s ease}
.tablewrap tbody tr:hover>td{background:#eaf2ff!important}
.tablewrap tbody tr:hover>td:first-child{box-shadow:inset 3px 0 0 #3978ff}
.tablewrap tbody tr:focus-within>td{background:#f0f5ff}
.tablewrap td .tag{display:inline-flex;max-width:190px;white-space:normal;overflow-wrap:anywhere;line-height:1.35;margin:2px 3px 2px 0}
.tablewrap td button,.tablewrap td a.secondary-link{white-space:nowrap}
.accounts-table{min-width:1060px;table-layout:auto}
.accounts-table th:nth-child(1){min-width:125px}.accounts-table th:nth-child(2),.accounts-table th:nth-child(3){min-width:95px}
.accounts-table th:nth-child(5){min-width:145px}.accounts-table th:nth-child(6){min-width:100px}
.accounts-table .assigned-servers{min-width:180px;max-width:280px}
.server-tags{display:flex;gap:5px;flex-wrap:wrap;align-items:center;max-width:270px}
.server-tag{font-size:10px!important;padding:5px 7px!important;background:#eef4ff!important;color:#234a92!important;border:1px solid #dce8ff}
.credit-balance{display:inline-flex;align-items:center;gap:4px;border-radius:8px;background:#eff6ff;padding:6px 9px;color:#184ea8;font-weight:800;white-space:nowrap}
.credit-balance small{font-weight:600;font-size:10px;color:#5b6d89}
.credit-link{display:block;margin-top:5px;color:#1765f5;font-size:11px;font-weight:700;text-decoration:none;white-space:nowrap}
.credit-link:hover{text-decoration:underline}
.account-actions{display:flex;flex-direction:column;gap:6px;align-items:stretch;min-width:120px;max-width:160px}
.account-actions form{margin:0}
.account-actions button,.account-actions summary{width:100%;min-height:34px;display:flex;align-items:center;justify-content:center;text-align:center;white-space:normal;line-height:1.25}
.account-actions details{position:relative}
.account-actions details>summary{cursor:pointer;list-style:none;border:1px solid #d8e2f0;border-radius:8px;padding:8px 10px;color:#2457ad;background:#fff;font-weight:700;font-size:11px}
.account-actions details>summary::-webkit-details-marker{display:none}
.account-actions details[open]>form{position:relative;z-index:2;background:#f8faff;border:1px solid #dce5f2;border-radius:8px;padding:10px;margin-top:5px;min-width:190px;box-shadow:0 8px 24px rgba(25,43,69,.08)}
.account-actions .stack{gap:8px}
.account-actions .danger-text{color:#c43f4b}
.account-filters{display:grid;grid-template-columns:minmax(200px,1.5fr) repeat(3,minmax(125px,1fr)) auto auto;gap:10px;align-items:end;margin:0 0 16px;padding:14px;background:#f8faff;border:1px solid #e4ebf6;border-radius:11px}
.account-filters label,.client-filters label{display:grid;gap:6px;min-width:0;color:#455771;font-size:11px;font-weight:700}
.account-filters input,.account-filters select,.client-filters input,.client-filters select{width:100%;min-width:0;min-height:38px;border:1px solid #d5dfed;border-radius:8px;background:#fff;padding:8px 10px;color:#1b2b44;font:inherit;font-size:12px}
.account-filters button,.client-filters button{min-height:38px;white-space:nowrap}
.account-filters .secondary-link,.client-filters .secondary-link{display:inline-flex;align-items:center;justify-content:center;min-height:38px;padding:8px 10px;border:1px solid #d5dfed;border-radius:8px;background:#fff;white-space:nowrap;text-decoration:none}
.client-filters{display:grid;grid-template-columns:minmax(220px,1.3fr) minmax(220px,1fr) auto auto;align-items:end;gap:10px;padding:13px;margin-bottom:16px;background:#f8faff;border:1px solid #e4ebf6;border-radius:11px}
.clients-table{min-width:1280px}
.clients-table .compact-actions{display:flex;align-items:center;flex-wrap:nowrap;gap:6px;max-width:none;min-width:max-content}
.clients-table td:last-child{min-width:330px}
.clients-table .compact-actions .inlineform{display:flex;align-items:center;gap:5px;flex-shrink:0}
.clients-table .compact-actions select{width:92px;min-width:92px;max-width:92px;height:36px;padding:6px 8px;font-size:11px;border:1px solid #d5dfed;border-radius:8px;background:#fff}
.clients-table .compact-actions button{min-height:36px;padding:7px 10px;font-size:11px}
.clients-table td{white-space:normal}
.clients-table td:nth-child(7),.clients-table td:nth-child(8){min-width:100px}
.status,.connection-pill{white-space:nowrap}
@media(max-width:1200px){.account-filters{grid-template-columns:repeat(3,minmax(0,1fr))}.account-filters .search-field{grid-column:span 2}.client-filters{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){.main{padding:16px 12px}.panel{padding:14px}.account-filters,.client-filters{grid-template-columns:1fr}.account-filters .search-field{grid-column:auto}.accounts-table{min-width:980px}.sectionhead{align-items:flex-start}}
@media(prefers-reduced-motion:reduce){.tablewrap tbody tr{transition:none}}


/* IKS-CLIENT-TABLE-FIX-V2 */
.tablewrap .clients-table {
  width: 100%;
  min-width: 1550px;
  table-layout: fixed;
}

.tablewrap .clients-table th:nth-child(1),
.tablewrap .clients-table td:nth-child(1) { width: 150px; }

.tablewrap .clients-table th:nth-child(2),
.tablewrap .clients-table td:nth-child(2) { width: 200px; }

.tablewrap .clients-table th:nth-child(3),
.tablewrap .clients-table td:nth-child(3) {
  width: 190px;
  min-width: 190px;
}

.tablewrap .clients-table th:nth-child(4),
.tablewrap .clients-table td:nth-child(4) { width: 125px; }

.tablewrap .clients-table th:nth-child(5),
.tablewrap .clients-table td:nth-child(5) { width: 145px; }

.tablewrap .clients-table th:nth-child(6),
.tablewrap .clients-table td:nth-child(6) { width: 165px; }

.tablewrap .clients-table th:nth-child(7),
.tablewrap .clients-table td:nth-child(7) { width: 115px; }

.tablewrap .clients-table th:nth-child(8),
.tablewrap .clients-table td:nth-child(8) { width: 145px; }

.tablewrap .clients-table th:nth-child(9),
.tablewrap .clients-table td:nth-child(9) {
  width: 315px;
  min-width: 315px;
}

.tablewrap .clients-table td:nth-child(3) .tag {
  display: inline-flex;
  align-items: center;
  max-width: 100%;
  white-space: normal;
  overflow-wrap: normal;
  word-break: normal;
  line-height: 1.4;
  padding: 6px 8px;
}

.tablewrap .clients-table td {
  vertical-align: middle;
  line-height: 1.45;
}

.tablewrap .clients-table tbody tr:hover > td {
  background-color: #eaf2ff !important;
}

@media (max-width: 760px) {
  .tablewrap .clients-table {
    min-width: 1550px;
  }
}


/* IKS-CLIENT-SEARCH-FOCUS-V1 */
#client-results {
  scroll-margin-top: 20px;
  outline: none;
}

#client-results tbody tr.search-result-focus > td {
  background: #dce9ff !important;
  box-shadow: inset 0 1px 0 #8bb0ff, inset 0 -1px 0 #8bb0ff;
}

#client-results tbody tr.search-result-focus > td:first-child {
  box-shadow: inset 4px 0 0 #3563ee, inset 0 1px 0 #8bb0ff, inset 0 -1px 0 #8bb0ff;
}

#client-results tbody tr:focus {
  outline: 2px solid #3563ee;
  outline-offset: -2px;
}



/* IKS-UX-CONSOLIDATED-V3: compact, consistent controls and tables */
.tablewrap td .tag {
  overflow-wrap: normal;
  word-break: normal;
  max-width: 220px;
}
.clients-table { min-width: 1120px !important; table-layout: auto; }
.clients-table th:nth-child(1), .clients-table td:nth-child(1) { min-width: 170px; }
.clients-table th:nth-child(2), .clients-table td:nth-child(2) { min-width: 165px; }
.clients-table th:nth-child(3), .clients-table td:nth-child(3) { min-width: 125px; }
.clients-table th:nth-child(4), .clients-table td:nth-child(4) { min-width: 125px; }
.clients-table th:nth-child(5), .clients-table td:nth-child(5) { min-width: 145px; }
.clients-table th:nth-child(6), .clients-table td:nth-child(6) { min-width: 110px; }
.clients-table th:nth-child(7), .clients-table td:nth-child(7) { min-width: 135px; }
.clients-table th:nth-child(8), .clients-table td:nth-child(8) { min-width: 330px; }
.clients-table td:nth-child(2) .tag { display:inline-flex; white-space:nowrap; overflow-wrap:normal; }
.clients-table .compact-actions { display:flex!important; flex-flow:row nowrap!important; align-items:center; gap:6px; min-width:max-content; max-width:none; }
.clients-table .compact-actions .inlineform { display:flex; flex:0 0 auto; flex-flow:row nowrap; align-items:center; gap:5px; margin:0; }
.clients-table .compact-actions button,.clients-table .compact-actions select { min-height:34px; white-space:nowrap; }
.clients-table .compact-actions select { width:88px; min-width:88px; max-width:88px; padding:6px; }

.accounts-table { min-width:1180px; }
.accounts-table td { vertical-align:middle; }
.accounts-table td .tag { white-space:nowrap; overflow-wrap:normal; }
.accounts-table .account-actions { display:flex!important; flex-flow:row nowrap!important; align-items:center; gap:6px; min-width:315px; max-width:none; }
.accounts-table .account-actions > form,.accounts-table .account-actions > details { flex:0 0 auto; margin:0; }
.accounts-table .account-actions button,.accounts-table .account-actions summary { width:auto; min-width:88px; min-height:33px; padding:7px 9px; white-space:nowrap; line-height:1.2; font-size:11px; }
.accounts-table .account-actions details,.accounts-table .permission-edit,.accounts-table .server-edit { position:relative; }
.accounts-table .account-actions details[open]>form,.accounts-table .permission-edit[open]>form,.accounts-table .server-edit[open]>form {
  position:absolute; z-index:30; top:calc(100% + 5px); left:0; width:240px; min-width:0;
  max-width:min(280px,75vw); max-height:260px; overflow:auto; margin:0; padding:11px;
  border:1px solid #dce5f2; border-radius:10px; background:#fff;
  box-shadow:0 10px 28px rgba(22,36,59,.14);
}
.accounts-table .account-actions details:last-child[open]>form { left:auto; right:0; width:250px; }
.accounts-table .permission-edit,.accounts-table .server-edit { display:inline-block; margin-top:6px; }
.accounts-table .permission-edit>summary,.accounts-table .server-edit>summary { display:inline-flex; align-items:center; min-height:28px; padding:4px 0; white-space:nowrap; font-size:11px; }
.accounts-table .permission-edit .checkline,.accounts-table .server-edit .checkline { display:flex; flex-flow:row nowrap; align-items:center; gap:8px; padding:5px 2px; white-space:normal; font-size:11px; }
.accounts-table .permission-edit input[type="checkbox"],.accounts-table .server-edit input[type="checkbox"] { flex:0 0 14px; width:14px!important; min-width:14px; height:14px; margin:0; padding:0; }
.accounts-table .server-edit button,.accounts-table .permission-edit button { width:100%; margin-top:8px; }
.account-filters input::placeholder,.client-filters input::placeholder { color:#8795aa; opacity:1; }
@media(max-width:760px) { .accounts-table{min-width:1180px}.clients-table{min-width:1120px!important} }


/* IKS-UX-V4: compact edit credentials and credit management */
.accounts-table .account-actions details:first-child[open] > form { width:250px; max-height:300px; }
.accounts-table .account-actions details:first-child > form label { display:block; margin-bottom:8px; font-size:12px; }
.accounts-table .account-actions details:first-child > form input { width:100%; min-width:0; margin-top:4px; }
.credits-filters {
 display:grid; grid-template-columns:minmax(220px,1.6fr) minmax(170px,1fr) auto auto;
 align-items:end; gap:10px; padding:12px; border:1px solid var(--border,#d8e2f0);
 border-radius:12px; background:var(--surface-soft,#f7f9fd);
}
.credits-assign-form {
 display:grid; grid-template-columns:minmax(240px,1.4fr) minmax(130px,.7fr) minmax(180px,1fr) auto;
 align-items:end; gap:12px;
}
.credits-assign-form input,.credits-assign-form select { min-width:0; }
.credits-table { width:100%; min-width:720px; }
.credits-table td,.credits-table th { vertical-align:middle; }
@media(max-width:850px) {
 .credits-filters { grid-template-columns:1fr 1fr; }
 .credits-assign-form { grid-template-columns:1fr 1fr; }
}
@media(max-width:520px) {
 .credits-filters,.credits-assign-form { grid-template-columns:1fr; }
}


/* IKS-UX-V6: use centered dialogs for editing instead of clipped table dropdowns */
.edit-dialog {
  width: min(440px, calc(100vw - 32px));
  max-width: calc(100vw - 32px);
  max-height: min(82vh, 680px);
  padding: 0;
  border: 1px solid #d6e0ef;
  border-radius: 14px;
  background: #fff;
  color: #17253d;
  box-shadow: 0 24px 70px rgba(17, 31, 53, .25);
  overflow: auto;
}
.edit-dialog::backdrop {
  background: rgba(12, 24, 43, .42);
  backdrop-filter: blur(2px);
}
.edit-dialog-form {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 22px;
}
.edit-dialog-form h3 {
  margin: 0 0 4px;
  font-size: 17px;
  line-height: 1.35;
  font-weight: 650;
}
.edit-dialog-form label {
  display: flex;
  flex-direction: column;
  gap: 6px;
  color: #354762;
  font-size: 12px;
  font-weight: 600;
}
.edit-dialog-form input {
  width: 100%;
  min-height: 40px;
  box-sizing: border-box;
  padding: 9px 11px;
  border: 1px solid #ccd8e9;
  border-radius: 8px;
  background: #fff;
  color: #17253d;
  font: inherit;
  font-weight: 400;
}
.edit-dialog-form input[readonly] {
  background: #f3f6fb;
  color: #65758d;
}
.edit-dialog-form p { margin: 0; line-height: 1.5; }
.edit-dialog-actions {
  display: flex;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 8px;
  padding-top: 5px;
}
.edit-dialog-actions button {
  min-height: 36px;
  padding: 8px 14px;
  white-space: nowrap;
}
.accounts-table .account-actions > .edit-dialog,
.clients-table .compact-actions > .edit-dialog {
  position: fixed;
  z-index: 1000;
  min-width: 0;
}
@media (max-width: 520px) {
  .edit-dialog-form { padding: 16px; }
  .edit-dialog-actions { flex-direction: column-reverse; }
  .edit-dialog-actions button { width: 100%; }
}


/* IKS-UX-V8: alineacion estable de datos y acciones en tablas */
.tablewrap {
  overflow-x: auto;
  overflow-y: visible;
  scrollbar-gutter: stable;
}
.tablewrap table {
  border-collapse: separate;
  border-spacing: 0;
}
.tablewrap th {
  vertical-align: middle;
  text-align: left;
  white-space: nowrap;
  line-height: 1.25;
}
.tablewrap td {
  vertical-align: middle;
  line-height: 1.4;
  overflow-wrap: normal;
  word-break: normal;
}
.clients-table th, .clients-table td {
  padding: 12px 13px;
}
.clients-table th:nth-child(1), .clients-table td:nth-child(1) { min-width: 145px; }
.clients-table th:nth-child(2), .clients-table td:nth-child(2) { min-width: 125px; }
.clients-table th:nth-child(3), .clients-table td:nth-child(3) { min-width: 140px; }
.clients-table th:nth-child(5), .clients-table td:nth-child(5) { min-width: 155px; }
.clients-table th:nth-child(6), .clients-table td:nth-child(6) { min-width: 135px; }
.clients-table td:nth-child(5) .ip-country,
.clients-table td:nth-child(5) .ip-country-row,
.clients-table .ip-country-row {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  gap: 8px;
  min-width: 135px;
  white-space: nowrap;
}
.clients-table td:nth-child(5) .tag {
  display: inline-flex;
  width: max-content;
  max-width: none;
  white-space: nowrap;
  overflow-wrap: normal;
  word-break: normal;
}
.clients-table td:nth-child(6) > *,
.clients-table td:nth-child(7) > * {
  white-space: nowrap;
}
.clients-table td:nth-child(7) small,
.clients-table .cellsub {
  display: block;
  margin-top: 3px;
  white-space: nowrap;
  line-height: 1.35;
}
.clients-table .compact-actions {
  display: flex !important;
  flex-flow: row nowrap !important;
  align-items: center;
  gap: 7px;
  min-width: max-content;
  white-space: nowrap;
}
.clients-table .compact-actions button,
.clients-table .compact-actions select {
  flex: 0 0 auto;
  white-space: nowrap;
  min-height: 35px;
}
.accounts-table {
  min-width: 1160px;
  table-layout: auto;
}
.accounts-table th, .accounts-table td {
  padding: 12px 12px;
  vertical-align: middle;
}
.accounts-table td:first-child strong,
.accounts-table td .tag,
.accounts-table .credit-balance,
.accounts-table .status {
  white-space: nowrap;
}
.accounts-table .account-actions {
  display: flex !important;
  flex-flow: row nowrap !important;
  align-items: center;
  justify-content: flex-start;
  gap: 7px;
  min-width: max-content;
  white-space: nowrap;
}
.accounts-table .account-actions > form,
.accounts-table .account-actions > details {
  flex: 0 0 auto;
  margin: 0;
}
.accounts-table .account-actions button,
.accounts-table .account-actions summary {
  min-height: 35px;
  white-space: nowrap;
  line-height: 1.25;
}
.accounts-table .assigned-servers .server-tags {
  display: flex;
  flex-flow: row wrap;
  align-items: center;
  gap: 5px;
}
.accounts-table .permission-edit,
.accounts-table .server-edit {
  margin-top: 5px;
}
.accounts-table .permission-edit > summary,
.accounts-table .server-edit > summary {
  white-space: nowrap;
}
.accounts-table .created-cell,
.accounts-table .created-cell small {
  white-space: nowrap;
  line-height: 1.4;
}
@media (max-width: 760px) {
  .clients-table { min-width: 1120px !important; }
  .accounts-table { min-width: 1160px; }
}


/* IKS-UX-V10: selectores verificados contra clients.html y accounts.html de V8 */
.clients-table th:last-child,
.accounts-table th:last-child {
  text-align: center !important;
}
.clients-table td:last-child,
.accounts-table td:last-child {
  text-align: center !important;
  vertical-align: middle !important;
}

/* Clientes: la clase real del grupo es client-actions compact-actions */
.clients-table .client-actions.compact-actions {
  display: inline-flex !important;
  flex-flow: row nowrap !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
  width: max-content !important;
  min-width: max-content !important;
  max-width: none !important;
  margin: 0 auto !important;
  padding: 9px !important;
  border: 1px solid #e0e7f2 !important;
  border-radius: 12px !important;
  background: #fbfcff !important;
  box-shadow: 0 3px 9px rgba(23, 42, 72, .09), 0 1px 2px rgba(23, 42, 72, .04) !important;
  box-sizing: border-box !important;
}
.clients-table .client-actions.compact-actions > form,
.clients-table .client-actions.compact-actions > button,
.clients-table .client-actions.compact-actions > select {
  flex: 0 0 auto !important;
  margin: 0 !important;
}

/* Cuentas: agrupa solo los controles de la columna Acciones */
.accounts-table td:last-child > .account-actions {
  display: inline-flex !important;
  flex-flow: row nowrap !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
  width: max-content !important;
  min-width: max-content !important;
  max-width: none !important;
  margin: 0 auto !important;
  padding: 9px !important;
  border: 1px solid #e0e7f2 !important;
  border-radius: 12px !important;
  background: #fbfcff !important;
  box-shadow: 0 3px 9px rgba(23, 42, 72, .09), 0 1px 2px rgba(23, 42, 72, .04) !important;
  box-sizing: border-box !important;
}
.accounts-table .account-actions > form,
.accounts-table .account-actions > details,
.accounts-table .account-actions > button {
  flex: 0 0 auto !important;
  margin: 0 !important;
}

/* Menú de servidores asignados: más legible y con controles espaciados */
.accounts-table td.assigned-servers details.server-edit {
  position: relative !important;
}
.accounts-table td.assigned-servers details.server-edit[open] > form {
  position: absolute !important;
  top: calc(100% + 8px) !important;
  right: 0 !important;
  z-index: 1200 !important;
  width: 290px !important;
  max-width: min(320px, 78vw) !important;
  max-height: min(340px, 55vh) !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  padding: 12px !important;
  border: 1px solid #dce5f2 !important;
  border-radius: 11px !important;
  background: #fff !important;
  box-shadow: 0 12px 30px rgba(22, 39, 66, .16) !important;
  text-align: left !important;
}
.accounts-table td.assigned-servers details.server-edit[open] > form .checkline {
  display: flex !important;
  align-items: flex-start !important;
  gap: 9px !important;
  padding: 8px 7px !important;
  margin: 2px 0 !important;
  border-radius: 7px !important;
  line-height: 1.35 !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
}
.accounts-table td.assigned-servers details.server-edit[open] > form .checkline:hover {
  background: #f0f5ff !important;
}
.accounts-table td.assigned-servers details.server-edit[open] > form input[type="checkbox"] {
  flex: 0 0 15px !important;
  width: 15px !important;
  min-width: 15px !important;
  height: 15px !important;
  margin-top: 2px !important;
}
.accounts-table td.assigned-servers details.server-edit[open] > form button {
  position: sticky !important;
  bottom: 0 !important;
  width: 100% !important;
  margin-top: 10px !important;
  padding: 10px !important;
  background: #315cf5 !important;
  color: #fff !important;
  box-shadow: 0 -5px 12px rgba(255,255,255,.9) !important;
}


/* IKS V12: IP a la izquierda y país a la derecha; sin superposición */
.clients-table .client-ip-country {
  display: flex !important;
  flex-flow: row nowrap !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 10px !important;
  min-width: max-content !important;
  white-space: nowrap !important;
}
.clients-table .client-ip-country .client-ip,
.clients-table .client-ip-country .client-country {
  display: inline-flex !important;
  align-items: center !important;
  flex: 0 0 auto !important;
  white-space: nowrap !important;
  margin: 0 !important;
}
.clients-table .client-ip-country .client-country {
  color: #60718d;
  gap: 4px;
}
.clients-table .client-ip-country .cellsub {
  display: inline !important;
  margin: 0 !important;
}

/* Dialog compacto, centrado y sin overflow horizontal */
dialog.edit-dialog.client-edit-dialog {
  width: min(500px, calc(100vw - 32px)) !important;
  max-width: calc(100vw - 32px) !important;
  max-height: calc(100dvh - 32px) !important;
  padding: 0 !important;
  margin: auto !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  border: 1px solid #dce5f2 !important;
  border-radius: 18px !important;
  box-shadow: 0 24px 70px rgba(12, 27, 52, .28) !important;
}
dialog.edit-dialog.client-edit-dialog::backdrop {
  background: rgba(12, 24, 42, .48) !important;
  backdrop-filter: blur(3px);
}
dialog.edit-dialog.client-edit-dialog .edit-dialog-form {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 13px !important;
  width: 100% !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
  padding: 24px !important;
  overflow: visible !important;
}
dialog.edit-dialog.client-edit-dialog .edit-dialog-form h3 {
  margin: 0 0 2px !important;
  text-align: center !important;
}
dialog.edit-dialog.client-edit-dialog .edit-dialog-form label {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 6px !important;
  min-width: 0 !important;
}
dialog.edit-dialog.client-edit-dialog .edit-dialog-form input {
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}
dialog.edit-dialog.client-edit-dialog .edit-dialog-actions {
  display: flex !important;
  flex-flow: row wrap !important;
  justify-content: flex-end !important;
  align-items: center !important;
  gap: 8px !important;
  margin-top: 4px !important;
}
@media (max-width: 520px) {
  dialog.edit-dialog.client-edit-dialog .edit-dialog-form {
    padding: 18px !important;
  }
  dialog.edit-dialog.client-edit-dialog .edit-dialog-actions > button {
    flex: 1 1 auto;
  }
}

/* Desplegable de servidores: compacto y anclado al control, no a la tabla */
.accounts-table td.assigned-servers details.server-edit[open] > form {
  width: 245px !important;
  max-width: min(270px, 75vw) !important;
  max-height: min(260px, 42vh) !important;
  top: auto !important;
  bottom: calc(100% + 7px) !important;
  right: 0 !important;
  left: auto !important;
  z-index: 1500 !important;
}
.accounts-table td.assigned-servers details.server-edit[open] > form .checkline {
  display: flex !important;
  align-items: flex-start !important;
  flex-flow: row nowrap !important;
  gap: 8px !important;
  padding: 6px 5px !important;
}


/* V15 — Clientes: encabezados y datos centrados, IP/país en una sola línea,
   y todas las acciones agrupadas visualmente como en Cuentas del panel. */
#client-results .clients-table {
  min-width: 1320px !important;
  table-layout: auto;
}
#client-results .clients-table thead th {
  text-align: center !important;
  vertical-align: middle;
  white-space: nowrap;
}
#client-results .clients-table tbody td {
  vertical-align: middle;
}
#client-results .clients-table tbody td:nth-child(1),
#client-results .clients-table tbody td:nth-child(2),
#client-results .clients-table tbody td:nth-child(3),
#client-results .clients-table tbody td:nth-child(4),
#client-results .clients-table tbody td:nth-child(5),
#client-results .clients-table tbody td:nth-child(6),
#client-results .clients-table tbody td:nth-child(7) {
  text-align: center !important;
}
#client-results .clients-table tbody td:first-child strong,
#client-results .clients-table tbody td:first-child .cellsub {
  display: block;
  text-align: center;
}
#client-results .clients-table tbody td:first-child .cellsub {
  white-space: nowrap;
}
#client-results .clients-table td:nth-child(2) .tag {
  margin-left: auto;
  margin-right: auto;
  justify-content: center;
}
#client-results .clients-table .status,
#client-results .clients-table .connection-pill {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  white-space: nowrap;
}
#client-results .clients-table .client-ip-country {
  display: inline-flex !important;
  flex-flow: row nowrap !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  width: max-content;
  max-width: none;
  margin-inline: auto;
  white-space: nowrap !important;
}
#client-results .clients-table .client-ip-country .client-ip,
#client-results .clients-table .client-ip-country .client-country {
  display: inline-flex !important;
  flex-flow: row nowrap !important;
  align-items: center !important;
  gap: 4px;
  white-space: nowrap !important;
  min-width: max-content;
  margin: 0;
}
#client-results .clients-table .client-ip-country .client-ip code {
  white-space: nowrap;
}
#client-results .clients-table td:nth-child(6) .cellsub,
#client-results .clients-table td:nth-child(7) .cellsub {
  display: block;
  text-align: center;
  white-space: nowrap;
}
#client-results .clients-table td:last-child {
  min-width: 360px !important;
  text-align: center !important;
}
#client-results .clients-table .client-actions.compact-actions {
  display: inline-flex !important;
  flex-flow: row nowrap !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  width: max-content;
  min-width: max-content;
  max-width: none !important;
  padding: 9px 10px;
  margin: 2px auto;
  border: 1px solid #dce5f2;
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 4px 13px rgba(24, 45, 78, .10);
}
#client-results .clients-table .client-actions.compact-actions > form,
#client-results .clients-table .client-actions.compact-actions > button,
#client-results .clients-table .client-actions.compact-actions > select {
  flex: 0 0 auto !important;
  margin: 0 !important;
}
#client-results .clients-table .client-actions.compact-actions button,
#client-results .clients-table .client-actions.compact-actions select {
  white-space: nowrap !important;
}
@media (max-width: 760px) {
  #client-results .clients-table { min-width: 1320px !important; }
  #client-results .clients-table .client-ip-country {
    flex-flow: row nowrap !important;
  }
}


/* V16 — Asignación de servidores mediante mini ventana modal */
.accounts-table .server-assign-open {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  white-space: nowrap;
  margin-top: 7px;
  padding: 7px 10px;
  min-height: 32px;
  font-size: 11px;
}
dialog.server-assign-dialog {
  width: min(440px, calc(100vw - 32px));
  max-width: calc(100vw - 32px);
  max-height: min(82vh, 620px);
  padding: 0;
  overflow: hidden;
  border: 1px solid #d9e3f2;
  border-radius: 16px;
  background: #fff;
  color: var(--ink, #172b4d);
  box-shadow: 0 22px 65px rgba(14, 31, 58, .24);
}
dialog.server-assign-dialog::backdrop {
  background: rgba(15, 27, 47, .46);
  backdrop-filter: blur(2px);
}
dialog.server-assign-dialog .server-assign-form {
  display: flex;
  flex-direction: column;
  gap: 12px;
  max-height: min(82vh, 620px);
  padding: 22px;
  overflow: hidden;
}
dialog.server-assign-dialog .server-assign-form h3 {
  margin: 0;
  text-align: center;
  font-size: 18px;
}
dialog.server-assign-dialog .server-assign-form > .muted {
  margin: 0;
  text-align: center;
}
dialog.server-assign-dialog .server-assign-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  padding: 3px;
  max-height: min(45vh, 340px);
  overflow: auto;
}
dialog.server-assign-dialog .server-assign-option {
  display: flex;
  align-items: center;
  gap: 9px;
  min-width: 0;
  padding: 10px;
  border: 1px solid #e0e8f4;
  border-radius: 9px;
  background: #fbfcff;
  cursor: pointer;
  font-size: 12px;
  line-height: 1.35;
  overflow-wrap: anywhere;
}
dialog.server-assign-dialog .server-assign-option:has(input:checked) {
  border-color: #9bb8ff;
  background: #edf3ff;
  box-shadow: inset 0 0 0 1px rgba(49, 92, 245, .10);
}
dialog.server-assign-dialog .server-assign-option input {
  flex: 0 0 16px;
  width: 16px;
  min-width: 16px;
  height: 16px;
  margin: 0;
  accent-color: #315cf5;
}
dialog.server-assign-dialog .edit-dialog-actions {
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  gap: 9px;
  padding-top: 12px;
  border-top: 1px solid #edf1f7;
}
dialog.server-assign-dialog .edit-dialog-actions button {
  min-height: 38px;
  white-space: nowrap;
}
@media (max-width: 480px) {
  dialog.server-assign-dialog .server-assign-form { padding: 16px; }
  dialog.server-assign-dialog .server-assign-grid { grid-template-columns: 1fr; }
}


/* V17 — Modales consistentes para permisos y créditos en Cuentas del panel */
.modal-action {
  display: inline-flex !important;
  border: 0;
  background: transparent;
  padding: 5px 0;
  cursor: pointer;
  font: inherit;
  font-size: 11px;
  font-weight: 700;
  text-decoration: none;
}
.action-config-dialog {
  width: min(420px, calc(100vw - 32px));
}
.action-config-dialog .action-config-form {
  display: flex;
  flex-direction: column;
  gap: 13px;
  max-height: min(82vh, 620px);
  overflow: auto;
  padding: 22px;
}
.action-config-dialog .action-config-form h3 {
  margin: 0;
  text-align: center;
  font-size: 18px;
}
.action-config-dialog .action-config-form > .muted {
  margin: -3px 0 2px;
  text-align: center;
}
.action-config-dialog .action-config-options {
  display: flex;
  flex-direction: column;
  gap: 9px;
}
.action-config-dialog .server-assign-option {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px;
  border: 1px solid #e0e8f4;
  border-radius: 10px;
  background: #fbfcff;
  cursor: pointer;
  font-size: 13px;
}
.action-config-dialog .server-assign-option:has(input:checked) {
  border-color: #9bb8ff;
  background: #edf3ff;
}
.action-config-dialog .server-assign-option input {
  flex: 0 0 16px;
  width: 16px;
  height: 16px;
  margin: 0;
  accent-color: #315cf5;
}
.action-config-dialog .action-config-form > label {
  display: flex;
  flex-direction: column;
  gap: 7px;
}
.action-config-dialog .action-config-form input[type="number"],
.action-config-dialog .action-config-form input[type="text"] {
  width: 100%;
}


/* V19 — Desk en una sola línea, editable también en servidores existentes */
.serverlayout input[name="desk"] {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  letter-spacing: .015em;
  white-space: nowrap;
}
.server-desk-cell { min-width: 330px; }
.server-desk-edit {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-width: 320px;
}
.server-desk-edit input[name="desk"] {
  width: 255px;
  min-width: 255px;
  padding: 8px 9px;
  font-size: 11px;
}
.server-desk-edit button { flex: 0 0 auto; white-space: nowrap; }


/* V20 — IP arriba, país debajo y tiempo conectado legible */
#client-results .clients-table .client-ip-country {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 4px !important;
  width: 100% !important;
  white-space: normal !important;
}
#client-results .clients-table .client-ip-country .client-ip,
#client-results .clients-table .client-ip-country .client-country {
  display: flex !important;
  flex-direction: row !important;
  justify-content: center !important;
  align-items: center !important;
  min-width: 0 !important;
  white-space: nowrap !important;
  line-height: 1.35;
}
#client-results .clients-table .client-country {
  font-size: 11px;
  color: var(--muted, #64748b);
}
#client-results .clients-table .connection-duration {
  display: block;
  margin-top: 4px;
  text-align: center;
  white-space: nowrap;
  font-size: 11px;
  font-variant-numeric: tabular-nums;
  color: var(--muted, #64748b);
}


/* V21 — Endpoints alineados y acciones agrupadas en panel sombreado */
.endpoints-table { min-width: 1060px; }
.endpoints-table th, .endpoints-table td { vertical-align: middle; text-align: center; }
.endpoints-table th { white-space: nowrap; }
.endpoints-table .endpoint-name { min-width: 175px; text-align: center; }
.endpoints-table .endpoint-ip { min-width: 150px; }
.endpoints-table .endpoint-address { min-width: 180px; white-space: nowrap; }
.endpoints-table .server-desk-cell { min-width: 300px; text-align: center; }
.desk-display { display: inline-block; white-space: nowrap; font-size: 11px; letter-spacing: .015em; }
.endpoint-action-cell { min-width: 230px; }
.endpoint-action-box { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; margin: 5px auto; padding: 12px; width: fit-content; min-width: 175px; max-width: 100%; background: var(--surface-soft, rgba(100,116,139,.10)); border: 1px solid var(--border, rgba(100,116,139,.22)); border-radius: 12px; box-shadow: 0 4px 12px rgba(15,23,42,.10); }
.endpoint-action-box > form, .endpoint-action-box > details { width: 100%; display: flex; justify-content: center; }
.endpoint-action-box button, .endpoint-action-box summary { white-space: nowrap; }
.endpoint-action-box summary { cursor: pointer; list-style-position: inside; padding: 7px 10px; border-radius: 8px; background: rgba(100,116,139,.12); text-align: center; }
.endpoint-edit { position: relative; }
.endpoint-edit[open] { display: block !important; }
.endpoint-edit-form { width: min(320px, 75vw); padding: 14px; margin-top: 8px; text-align: left; background: var(--panel, #fff); border: 1px solid var(--border, #d1d5db); border-radius: 12px; box-shadow: 0 12px 30px rgba(15,23,42,.18); }
.endpoint-edit-form label { text-align: left; }
.endpoint-edit-form input[name="desk"] { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 11px; }

/* V21 — Endpoints: acciones ordenadas y formularios en ventana centrada */
.endpoint-action-cell { min-width: 290px; width: 290px; }
.endpoint-action-box { display:flex; flex-flow:row wrap; align-items:center; justify-content:center; gap:8px; margin:6px auto; padding:12px; width:min(100%,280px); min-width:0; box-sizing:border-box; background:var(--surface-soft,rgba(100,116,139,.10)); border:1px solid var(--border,rgba(100,116,139,.22)); border-radius:12px; box-shadow:0 4px 12px rgba(15,23,42,.10); }
.endpoint-action-box > form { display:flex; justify-content:center; margin:0; }
.endpoint-action-box button { white-space:nowrap; min-height:38px; }
.endpoint-action-box .endpoint-open-modal { flex:0 1 auto; }
dialog.endpoint-dialog { width:min(520px,calc(100vw - 32px)); max-width:520px; max-height:calc(100dvh - 32px); overflow:auto; padding:0; border:1px solid var(--border,#d1d5db); border-radius:16px; background:var(--panel,#fff); color:var(--text,#111827); box-shadow:0 24px 70px rgba(0,0,0,.28); }
dialog.endpoint-dialog::backdrop { background:rgba(15,23,42,.58); backdrop-filter:blur(2px); }
.endpoint-dialog-form { padding:24px; gap:14px; }
.endpoint-dialog-form h3 { margin:0; font-size:1.2rem; }
.endpoint-dialog-form > .muted { margin:0 0 4px; }
.endpoint-dialog-form label { display:flex; flex-direction:column; gap:6px; }
.endpoint-dialog-form input:not([type=checkbox]) { width:100%; box-sizing:border-box; }
.endpoint-dialog-form input[name=desk] { font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; font-size:13px; }
.endpoint-dialog-actions { display:flex; justify-content:flex-end; gap:10px; margin-top:8px; }
.endpoint-access-list { display:grid; gap:8px; max-height:45vh; overflow:auto; padding:10px; border:1px solid var(--border,#d1d5db); border-radius:10px; }
@media(max-width:600px){ .endpoint-action-cell { min-width:230px; width:230px; } .endpoint-action-box { width:210px; } .endpoint-dialog-form { padding:17px; } .endpoint-dialog-actions { flex-direction:column-reverse; } .endpoint-dialog-actions button { width:100%; } }

/* V23: Endpoints uses a compact action entry; actions run in a centered modal. */
.endpoints-table { width:100%; table-layout:auto; }
.endpoints-table th,.endpoints-table td { vertical-align:middle; }
.endpoints-table .endpoint-name { min-width:130px; text-align:left; }
.endpoints-table .endpoint-ip { min-width:115px; }
.endpoints-table .endpoint-address { min-width:135px; white-space:nowrap; }
.endpoints-table .server-desk-cell { min-width:155px; }
.endpoint-action-cell { width:105px !important; min-width:105px !important; text-align:center; }
.endpoint-action-cell > button { min-width:92px; }
dialog.endpoint-actions-dialog { width:min(860px,calc(100vw - 32px)); max-width:860px; max-height:calc(100dvh - 32px); overflow:auto; padding:0; border:1px solid var(--border,#d1d5db); border-radius:16px; background:var(--panel,#fff); color:var(--text,#111827); box-shadow:0 24px 70px rgba(0,0,0,.28); }
dialog.endpoint-actions-dialog::backdrop { background:rgba(15,23,42,.58); backdrop-filter:blur(2px); }
.endpoint-dialog-inner { padding:22px; }
.endpoint-dialog-head { display:flex; align-items:flex-start; justify-content:space-between; gap:14px; margin-bottom:16px; }
.endpoint-dialog-head h3 { margin:0 0 4px; }
.endpoint-dialog-head p { margin:0; overflow-wrap:anywhere; }
.endpoint-actions-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; align-items:start; }
.endpoint-action-card { min-width:0; display:flex; flex-direction:column; gap:10px; padding:16px; border:1px solid var(--border,#d1d5db); border-radius:12px; background:var(--surface-soft,rgba(100,116,139,.08)); box-shadow:0 3px 10px rgba(15,23,42,.08); }
.endpoint-action-card p { margin:0; }
.endpoint-action-card label { display:flex; flex-direction:column; gap:5px; min-width:0; }
.endpoint-action-card input:not([type=checkbox]) { width:100%; box-sizing:border-box; min-width:0; }
.endpoint-action-card input[name=desk] { font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; font-size:12px; }
.endpoint-action-card .endpoint-access-list { max-height:220px; overflow:auto; }
.endpoint-action-card .checkline { display:flex; flex-direction:row; align-items:center; gap:8px; overflow-wrap:anywhere; }
.endpoint-action-card .checkline input { width:auto; flex:0 0 auto; }
.endpoint-delete-card { border-color:rgba(190,50,50,.28); }
@media(max-width:680px){ .endpoint-actions-grid { grid-template-columns:minmax(0,1fr); } .endpoint-dialog-inner { padding:15px; } .endpoints-table .server-desk-cell { min-width:120px; } }

/* V27: separated client/demo workflows in the navigation */
.nav-submenu{display:flex;flex-direction:column;gap:3px;margin:-5px 0 8px 34px;padding-left:10px;border-left:1px solid var(--border, #d7dce3)}
.nav-submenu a{display:block;padding:7px 9px;border-radius:7px;font-size:.82rem;line-height:1.25;color:var(--muted, #667085);text-decoration:none;white-space:normal}
.nav-submenu a:hover,.nav-submenu a.active{background:var(--surface-soft, rgba(127,127,127,.12));color:var(--text, inherit)}
.workflow-tabs{margin-bottom:16px;flex-wrap:wrap}
.demo-permission-note{grid-column:1/-1}

/* V28: compact action column with server-style Manage dialogs */
.manage-cell { min-width: 112px; text-align: center; vertical-align: middle; }
.manage-open { min-width: 96px; white-space: nowrap; }
dialog.manage-dialog { width: min(650px, calc(100vw - 28px)); max-width: 650px; max-height: calc(100dvh - 28px); overflow: auto; padding: 0; border: 1px solid var(--border,#d1d5db); border-radius: 16px; background: var(--panel,#fff); color: var(--text,#111827); box-shadow: 0 24px 70px rgba(0,0,0,.28); }
dialog.manage-dialog::backdrop { background: rgba(15,23,42,.58); backdrop-filter: blur(2px); }
.manage-actions-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
.manage-actions-grid > button, .manage-action-form { min-width: 0; border: 1px solid var(--border,#d7dee8); border-radius: 10px; background: var(--surface-muted,#f7f9fc); padding: 12px; display: flex; flex-direction: column; align-items: stretch; justify-content: center; gap: 8px; }
.manage-actions-grid > button { align-items: center; min-height: 44px; }
.manage-action-form label { display: flex; flex-direction: column; gap: 6px; }
.manage-action-form input, .manage-action-form select { width: 100%; box-sizing: border-box; }
.manage-action-form p { margin: 0; }
.manage-delete { border-color: #efc7cb; background: #fff8f8; }
.manage-actions-grid .copy-client { min-height: 44px; }
@media(max-width:600px) { .manage-actions-grid { grid-template-columns: minmax(0,1fr); } .manage-dialog .endpoint-dialog-inner { padding: 15px; } }

/* V30: collapsible Clients/Demos group, separate Multilogin routes. */
.nav-dropdown{margin:0;padding:0}.nav-dropdown-summary{position:relative;display:flex;align-items:center;gap:11px;min-height:42px;padding:11px 12px;border-radius:9px;color:var(--muted,#667085);cursor:pointer;list-style:none;user-select:none}.nav-dropdown-summary::-webkit-details-marker{display:none}.nav-dropdown-summary:hover{background:var(--surface-soft,rgba(127,127,127,.12));color:var(--text,inherit)}.nav-dropdown[open]>.nav-dropdown-summary{background:#243653;color:#fff;font-weight:700}.nav-dropdown[open]>.nav-dropdown-summary .nav-icon{color:#8eabff}.nav-chevron{margin-left:auto;font-size:15px;transition:transform .15s ease}.nav-dropdown[open]>.nav-dropdown-summary .nav-chevron{transform:rotate(180deg)}.nav-dropdown .nav-submenu{margin-top:0}


/* V33 — acabado SaaS moderno, consistente y responsive */
:root{
  --bg:#f3f6fc;
  --ink:#13213a;
  --muted:#687891;
  --line:#dfe7f4;
  --blue:#315cf5;
  --nav:#101d33;
  --green:#14966b;
}
body{background:linear-gradient(180deg,#f7f9fd 0%,#f1f5fb 100%);color:var(--ink)}
h1,h2,h3{letter-spacing:-.035em}
h1{font-size:clamp(25px,2.2vw,32px);font-weight:800}
.sidebar{background:linear-gradient(180deg,#111f36 0%,#0d192d 100%);box-shadow:8px 0 28px #0e1b2c0b}
.brandmark{box-shadow:0 5px 14px #315cf52c}
.sidebar nav a,.nav-dropdown-summary{transition:background .18s ease,color .18s ease,transform .18s ease}
.sidebar nav a:hover,.sidebar nav a:focus,.nav-dropdown-summary:hover{background:#1b2d4a;color:#fff}
.sidebar nav a.active,.sidebar nav a[class~="active"]{background:linear-gradient(100deg,#243957,#20334f);color:#fff;box-shadow:inset 3px 0 0 #5278ff}
.main{padding-top:30px}
.panel,.stat{border-color:#dce5f3;border-radius:16px;box-shadow:0 5px 18px #18345a08;transition:box-shadow .18s ease,border-color .18s ease}
.panel:hover,.stat:hover{border-color:#d1def2;box-shadow:0 9px 26px #18345a0c}
.stat{padding:21px 22px}
.stat>strong{font-size:clamp(28px,2.4vw,34px);letter-spacing:-.055em}
.statlabel{font-weight:600}
.panel{padding:22px}
th{color:#687995;background:#f8faff;letter-spacing:.8px}
th:first-child{border-top-left-radius:8px}
th:last-child{border-top-right-radius:8px}
td{color:#52627a}
tbody tr{transition:background .15s ease}
tbody tr:hover td{background:#f7f9ff}
.accounts-table tbody tr:target td{background:#eef4ff}
.tag{border:1px solid #e7edf7;background:#f5f7fc;color:#4b5c77}
input,select,textarea{border-color:#d5dfef;border-radius:10px;transition:border-color .15s ease,box-shadow .15s ease}
input:focus,select:focus,textarea:focus{border-color:#7896ff;box-shadow:0 0 0 4px #315cf514}
.primary{background:linear-gradient(135deg,#3865ff,#2d55e8);border-radius:10px;box-shadow:0 3px 8px #315cf51c;transition:transform .15s ease,box-shadow .15s ease,background .15s ease}
.primary:hover{background:linear-gradient(135deg,#2d58ed,#2348d4);box-shadow:0 5px 13px #315cf52b;transform:translateY(-1px)}
.secondary{border-color:#d4dfef;border-radius:10px;color:#405573;transition:background .15s ease,border-color .15s ease}
.secondary:hover{background:#f5f8ff;border-color:#b9cafa}
.accounts-table .manage-open{background:linear-gradient(135deg,#3865ff,#2d55e8)!important;color:#fff!important;border:1px solid #315cf5!important;border-radius:10px;box-shadow:0 3px 8px #315cf51c;font-weight:700}
.accounts-table .manage-open:hover{background:linear-gradient(135deg,#2d58ed,#2348d4)!important;border-color:#244bd0!important}
.edit-dialog,.endpoint-dialog{border:1px solid #dce5f3;border-radius:18px;box-shadow:0 24px 80px #0b19334a;padding:0}
dialog::backdrop{background:#101c32a6;backdrop-filter:blur(3px)}
.edit-dialog-form,.endpoint-dialog-inner{padding:24px}
.edit-dialog h3,.endpoint-dialog h3{font-size:19px;margin:0 0 8px}
.edit-dialog-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:20px}
.status.on{color:#11835f}
.status.on:before{box-shadow:0 0 0 3px #1db7841a}
.account-filters{background:#f7f9fe;border:1px solid #e1e9f6;border-radius:13px;padding:14px;margin-bottom:17px}
@media(max-width:700px){
 .main{padding:19px 13px}
 .panel{padding:16px;border-radius:13px}
 .stat{padding:17px}
 .account-filters{padding:12px}
}


/* V34 — Auditoría agrupada por IP */
.audit-notice{margin-bottom:18px}
.audit-groups-panel,.audit-ungrouped-panel{margin-top:16px}
.audit-ip-list{display:flex;flex-direction:column;gap:10px}
.audit-ip-group{border:1px solid #dfe7f4;border-radius:13px;background:#fff;overflow:hidden}
.audit-ip-group[open]{border-color:#bfd0ff;box-shadow:0 5px 18px #18345a08}
.audit-ip-group>summary{list-style:none;display:grid;grid-template-columns:minmax(170px,1.3fr) minmax(110px,.8fr) minmax(175px,1fr) auto 18px;align-items:center;gap:16px;padding:15px 17px;cursor:pointer}
.audit-ip-group>summary::-webkit-details-marker{display:none}
.audit-ip-group>summary:hover{background:#f7f9ff}
.audit-ip-main,.audit-ip-time{display:flex;flex-direction:column;gap:4px;min-width:0}
.audit-ip-main strong{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;color:#2448b5;overflow-wrap:anywhere}
.audit-ip-main small,.audit-ip-time small{color:#71809a;font-size:12px}
.audit-ip-time strong{font-size:13px;color:#263752}
.audit-ip-country{font-size:13px;color:#52627a}
.audit-chevron{color:#315cf5;transition:transform .15s ease}
.audit-ip-group[open] .audit-chevron{transform:rotate(180deg)}
.audit-events-table{border-top:1px solid #e6edf7}
.audit-events-table table{min-width:800px}
.audit-detail-text{max-width:460px;overflow-wrap:anywhere}
@media(max-width:800px){
 .audit-ip-group>summary{grid-template-columns:minmax(0,1fr) auto 18px;gap:10px}
 .audit-ip-country{grid-column:1}
 .audit-ip-time{grid-column:1}
 .audit-ip-group>summary>.tag{grid-column:2;grid-row:1}
 .audit-chevron{grid-column:3;grid-row:1}
}


/* V35 — búsqueda por IP y retención de auditoría */
.audit-ip-search-form{display:flex;flex-direction:column;gap:8px;margin:0 0 18px;padding:15px;background:#f7f9fe;border:1px solid #e1e9f6;border-radius:12px}
.audit-ip-search-form label{font-size:13px;font-weight:700;color:#52627a}
.audit-ip-search-row{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.audit-ip-search-row input{flex:1;min-width:220px;max-width:520px;background:#fff}
.audit-clear-search{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;padding:10px 13px;border:1px solid #d4dfef;border-radius:10px;color:#405573;background:#fff}
.audit-clear-search:hover{background:#f0f5ff}
@media(max-width:560px){.audit-ip-search-row input{min-width:100%;max-width:none}.audit-ip-search-row button,.audit-clear-search{width:100%}}

/* V36: versión oficial visible en el pie del menú lateral */
.app-version{display:block;margin-top:5px;font-size:11px;letter-spacing:.04em;color:#94a3b8}

/* V38 — indicador visual claro del estado de los respaldos automáticos */
.backup-state{display:inline-flex;align-items:center;gap:7px;padding:6px 10px;border-radius:999px;font-size:12px;font-weight:800;letter-spacing:.04em}
.backup-state-dot{display:inline-block;width:8px;height:8px;border-radius:50%;flex:0 0 8px}
.backup-state-on{color:#1457d9;background:#e8f0ff;border:1px solid #b9d0ff}
.backup-state-on .backup-state-dot{background:#2160f5;box-shadow:0 0 0 3px #d4e3ff}
.backup-state-off{color:#667085;background:#f1f3f6;border:1px solid #d9dee7}
.backup-state-off .backup-state-dot{background:#98a2b3}
.backup-control-row{display:grid;grid-template-columns:minmax(230px,1.3fr) minmax(130px,.7fr) minmax(170px,.8fr) auto;gap:18px;align-items:center;margin:16px 0;padding:16px;border:1px solid #dbe5f7;border-radius:14px;background:linear-gradient(110deg,#f5f8ff,#fff)}
.backup-current-state{display:flex;align-items:center;gap:12px;padding:14px;border-radius:12px}
.backup-current-state.is-on{background:#eaf1ff;color:#174ea6;border:1px solid #c6d8ff}
.backup-current-state.is-off{background:#f3f4f6;color:#475467;border:1px solid #e0e3e8}
.backup-current-state.is-on .backup-state-dot{background:#2160f5;box-shadow:0 0 0 4px #d4e3ff}
.backup-current-state.is-off .backup-state-dot{background:#98a2b3}
.backup-current-state strong,.backup-current-state small{display:block}
.backup-current-state small{margin-top:5px;color:#667085}
.backup-current-state.is-on small b{color:#2160f5}
.backup-current-state.is-off small b{color:#667085}
.backup-schedule-meta{display:flex;flex-direction:column;gap:4px;padding-left:12px;border-left:1px solid #d8e3f5}
.backup-schedule-meta strong{font-size:16px;color:#102a56}
.backup-schedule-meta small,.backup-meta-label{font-size:12px;color:#667085}
.backup-disable-btn{background:#fff!important;color:#344054!important;border:1px solid #cbd5e1!important;border-radius:10px;padding:11px 14px;font-weight:700;cursor:pointer}
.backup-disable-btn:hover{background:#f2f5fa!important}
.backup-enable-btn{background:#285cf6!important;color:#fff!important;border:1px solid #285cf6!important;border-radius:10px;padding:11px 14px;font-weight:700;cursor:pointer}
.backup-enable-btn:hover{background:#1747d4!important}
@media(max-width:900px){.backup-control-row{grid-template-columns:1fr 1fr}.backup-current-state{grid-column:1/-1}}
@media(max-width:560px){.backup-control-row{grid-template-columns:1fr}.backup-current-state{grid-column:auto}.backup-schedule-meta{border-left:0;padding-left:0}.backup-control-row form,.backup-control-row button{width:100%}}




/* V42: compact sidebar navigation and grouped server integrations */
.sidebar nav{gap:3px}
.sidebar nav>a{padding:9px 11px;gap:10px}
.sidebar .nav-dropdown-summary{min-height:36px;padding:8px 10px;gap:9px;font-size:12.5px}
.sidebar .nav-submenu{gap:2px;margin:-3px 0 5px 29px;padding-left:8px}
.sidebar .nav-submenu a{padding:6px 7px;font-size:12px;display:flex;align-items:center;gap:8px}
.sidebar .nav-submenu a .nav-icon{font-size:13px;min-width:14px}
.sidebar .nav-dropdown-summary .nav-icon{min-width:16px}
.sidebar-collapsed .sidebar nav .nav-dropdown-summary{justify-content:center;padding:9px 5px}
.sidebar-collapsed .sidebar nav .nav-dropdown-summary .nav-chevron{display:none}
.sidebar-collapsed .sidebar nav .nav-dropdown[open] .nav-submenu{margin:0;padding:5px 0;border:0;align-items:center}
.sidebar-collapsed .sidebar nav .nav-submenu a{justify-content:center;padding:8px 3px;font-size:0}
.sidebar-collapsed .sidebar nav .nav-submenu a .nav-icon{font-size:14px}

/* V44: one compact navigation group for infrastructure and client/account types */
.sidebar .nav-submenu a{min-height:29px}
.sidebar .nav-submenu a.active{background:rgba(71,116,255,.16);border-left:2px solid #4774ff;border-radius:8px}
.sidebar .nav-dropdown-summary{font-weight:650}

/* V45: modern server performance dashboard */
.performance-hero{align-items:center;margin-bottom:22px}
.performance-live{display:inline-flex;align-items:center;gap:9px;padding:10px 13px;border:1px solid #dbe5f7;background:#fff;border-radius:999px;color:#294166;font-size:12px;font-weight:700;white-space:nowrap;box-shadow:0 5px 18px rgba(24,49,91,.04)}
.live-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:#21bd91;box-shadow:0 0 0 4px rgba(33,189,145,.12);flex:0 0 auto}
.performance-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin:0 0 20px}
.metric-card{min-width:0;background:linear-gradient(160deg,#fff 0%,#fbfcff 100%);border:1px solid #dce6f6;border-radius:18px;padding:20px;box-shadow:0 8px 25px rgba(28,54,96,.045)}
.metric-cpu{background:linear-gradient(145deg,#fff 0%,#f5f8ff 100%)}
.metric-head{display:flex;align-items:center;gap:10px;margin-bottom:17px}
.metric-icon{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:11px;background:#eaf0ff;color:#365cf5;font-size:20px;font-weight:700}
.metric-icon.blue{background:#e9f2ff;color:#3277e9}.metric-icon.violet{background:#f0eaff;color:#8255d9}.metric-icon.green{background:#e4faf2;color:#159b72}
.metric-label{font-size:12px;font-weight:650;color:#627493}
.metric-value{font-size:clamp(28px,2.4vw,36px);line-height:1.12;letter-spacing:-1.2px;font-weight:750;color:#142544;margin-bottom:9px}
.metric-value small{font-size:16px;letter-spacing:0;font-weight:650}
.metric-caption{font-size:11px;line-height:1.65;color:#7383a0;min-height:19px}
.metric-track{height:7px;background:#edf1f8;border-radius:99px;overflow:hidden;margin-top:15px}
.metric-track span{display:block;height:100%;min-width:0;max-width:100%;border-radius:99px;background:linear-gradient(90deg,#355cf6,#6093ff)}
.violet-track span{background:linear-gradient(90deg,#8054d8,#b18bff)}
.load-chips{display:flex;gap:5px;margin-top:14px;flex-wrap:wrap}
.load-chips span{display:flex;gap:5px;align-items:center;padding:5px 7px;border-radius:7px;background:#edf2ff;color:#6a7b9b;font-size:10px}
.load-chips b{color:#2445b9}
.metric-uptime{background:linear-gradient(145deg,#fff 0%,#f3fcf8 100%)}
.performance-details{padding:24px;margin-bottom:18px}
.performance-details .sectionhead{margin-bottom:20px}
.resource-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px}
.resource-meta{display:flex;justify-content:space-between;align-items:center;gap:12px;color:#5f7191;font-size:12px;font-weight:600;margin-bottom:10px}
.resource-meta strong{color:#172849}
.large-track{height:10px;margin-top:0}
.performance-note{display:flex;align-items:flex-start;gap:13px;padding:17px 19px;border:1px solid #dce6f6;border-radius:15px;background:#f7f9fe;color:#667795;font-size:12px;line-height:1.7;margin-bottom:20px}
.performance-note p{margin:4px 0 0}.performance-note strong{color:#243653}
.note-icon{display:flex;align-items:center;justify-content:center;flex:0 0 25px;width:25px;height:25px;border-radius:50%;background:#e5edff;color:#3157e9;font-weight:800}
@media(max-width:1100px){.performance-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:620px){.performance-grid{grid-template-columns:1fr}.resource-list{grid-template-columns:1fr}.performance-hero{align-items:flex-start;flex-direction:column}.metric-card{padding:17px}.performance-details{padding:18px}}


/* V48: consistent contextual back links */
.context-back-wrap{margin:0 0 12px;display:flex;align-items:center}.context-back{display:inline-flex;align-items:center;gap:7px;padding:8px 11px;border:1px solid var(--line,#dce2eb);border-radius:8px;background:#fff;color:var(--muted,#526077);text-decoration:none;font-size:12px;font-weight:700}.context-back:hover{border-color:#9eb2ff;color:var(--blue,#315eea);background:#f8faff}.context-back:focus-visible{outline:3px solid #315eea35;outline-offset:2px}


/* Firewall delete confirmation: compact checkbox row matching account permission controls. */
.firewall-delete-form label.checkline {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  justify-content: flex-start;
  gap: 9px;
  width: 100%;
  min-height: 34px;
  margin: 0;
  padding: 5px 2px;
  font-size: 12px;
  line-height: 1.4;
  white-space: normal;
  cursor: pointer;
}
.firewall-delete-form label.checkline input[type="checkbox"] {
  appearance: auto;
  -webkit-appearance: checkbox;
  flex: 0 0 15px;
  width: 15px !important;
  min-width: 15px;
  height: 15px;
  margin: 0;
  padding: 0;
}
.firewall-delete-form button.dangerbtn {
  width: 100%;
  min-height: 38px;
  padding: 10px 14px;
  border-radius: 8px;
  font-size: 12px;
  font-weight: 700;
}


/* IKS bulk actions: compact, aligned with the existing Control Center design */
.bulk-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:10px 12px;margin:10px 0 12px;background:#f8faff;border:1px solid var(--line);border-radius:9px;min-height:48px}
.bulk-select-all{display:inline-flex!important;align-items:center;gap:8px;margin:0!important;white-space:nowrap;font-size:12px!important;color:#42516a}
.bulk-hint{flex:1;min-width:180px;font-size:11px;color:var(--muted);line-height:1.4}
.bulk-actions .dangerbtn{min-height:32px;padding:7px 11px;white-space:nowrap}
input[type=checkbox].bulk-panel-id,input[type=checkbox].bulk-client-id,input[type=checkbox].bulk-credit-id,.bulk-select-all input[type=checkbox]{appearance:auto!important;-webkit-appearance:checkbox!important;display:inline-block!important;flex:0 0 14px!important;width:14px!important;min-width:14px!important;max-width:14px!important;height:14px!important;min-height:14px!important;margin:0!important;padding:0!important;border:initial!important;border-radius:3px!important;box-shadow:none!important;accent-color:#315eea;vertical-align:middle}
.bulk-check-cell{width:92px}
.accounts-table td:has(> .bulk-panel-id),.clients-table td:has(> .bulk-client-id),.credits-table td:has(> .bulk-credit-id){width:92px;text-align:center}
@media(max-width:720px){.bulk-actions{align-items:flex-start;gap:9px}.bulk-hint{flex-basis:100%;order:3}.bulk-actions .dangerbtn{margin-left:auto}}


/* IKS UX patch: keep panel usernames on one line and give assigned servers room. */
.accounts-table th:nth-child(2),
.accounts-table td:nth-child(2) {
  width: 155px !important;
  min-width: 155px !important;
  max-width: 190px;
}
.accounts-table td:nth-child(2) strong {
  display: inline-block;
  white-space: nowrap !important;
  overflow-wrap: normal !important;
  word-break: keep-all !important;
}
.accounts-table th:nth-child(7),
.accounts-table td:nth-child(7) {
  min-width: 205px !important;
}
.accounts-table th:nth-child(8),
.accounts-table td:nth-child(8) {
  min-width: 105px;
}
@media (max-width: 760px) {
  .accounts-table th:nth-child(2),
  .accounts-table td:nth-child(2) {
    width: 155px !important;
    min-width: 155px !important;
  }
}

/* Automatic password reset: explanatory action card inside Manage dialogs. */
.password-reset-info { grid-column: auto; }
.password-reset-info .tiny { line-height: 1.35; }
.password-reset-info button { white-space: normal; }


/* IKS compact management actions and friendly result dialog */
.manage-actions-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: start;
  gap: 8px;
}
.manage-actions-grid > * { min-width: 0; max-width: 100%; }
.manage-actions-grid button,
.manage-actions-grid input,
.manage-actions-grid select { max-width: 100%; box-sizing: border-box; }
.manage-actions-grid .password-reset-info { overflow: hidden; }
.manage-actions-grid .password-reset-info p { overflow-wrap: anywhere; }
.manage-actions-grid .manage-delete { grid-column: auto; }
.iks-notice-overlay {
  position: fixed; inset: 0; z-index: 100000;
  display: flex; align-items: center; justify-content: center;
  padding: 18px; background: rgba(12, 24, 44, .58);
  backdrop-filter: blur(3px);
}
.iks-notice-card {
  width: min(100%, 440px); box-sizing: border-box;
  padding: 26px 24px 22px; border: 1px solid #d9e2ef;
  border-radius: 18px; background: #fff; color: #17233b;
  box-shadow: 0 24px 80px rgba(0,0,0,.24); text-align: center;
}
.iks-notice-icon {
  width: 42px; height: 42px; display: grid; place-items: center;
  margin: 0 auto 12px; border-radius: 50%; font-size: 22px; font-weight: 800;
}
.iks-notice-icon.is-success { background: #e6f8ef; color: #137448; }
.iks-notice-icon.is-error { background: #fff0f0; color: #b4232d; }
.iks-notice-card h3 { margin: 0 0 10px; font-size: 18px; }
.iks-notice-message { margin: 0 0 20px; color: #53627a; white-space: pre-line; overflow-wrap: anywhere; }
.iks-notice-card .iks-notice-close { min-width: 130px; }
@media (max-width: 640px) {
  .manage-actions-grid { grid-template-columns: minmax(0, 1fr); }
}


/* IKS manage actions v3: compact two-column dialogs without horizontal scrolling. */
dialog.manage-dialog {
  width: min(680px, calc(100vw - 24px)) !important;
  max-width: calc(100vw - 24px) !important;
  max-height: calc(100dvh - 24px) !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  box-sizing: border-box !important;
}
dialog.manage-dialog .endpoint-dialog-inner {
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  overflow-x: hidden !important;
}
dialog.manage-dialog .manage-actions-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 8px !important;
  width: 100% !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
  align-items: start !important;
}
dialog.manage-dialog .manage-actions-grid > *,
dialog.manage-dialog .manage-actions-grid > form,
dialog.manage-dialog .manage-actions-grid > button,
dialog.manage-dialog .manage-actions-grid .manage-action-form {
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  margin: 0 !important;
  box-sizing: border-box !important;
}
dialog.manage-dialog .manage-actions-grid label,
dialog.manage-dialog .manage-actions-grid strong,
dialog.manage-dialog .manage-actions-grid p,
dialog.manage-dialog .manage-actions-grid small {
  min-width: 0 !important;
  max-width: 100% !important;
  overflow-wrap: anywhere !important;
  word-break: normal !important;
}
dialog.manage-dialog .manage-actions-grid input,
dialog.manage-dialog .manage-actions-grid select,
dialog.manage-dialog .manage-actions-grid button {
  min-width: 0 !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  white-space: normal !important;
}
dialog.manage-dialog .manage-actions-grid .manage-delete {
  grid-column: auto !important;
  align-self: start !important;
}
.iks-notice-overlay { z-index: 2147483000 !important; }
@media (max-width: 620px) {
  dialog.manage-dialog { width: calc(100vw - 16px) !important; max-width: calc(100vw - 16px) !important; }
  dialog.manage-dialog .endpoint-dialog-inner { padding: 14px !important; }
  dialog.manage-dialog .manage-actions-grid { grid-template-columns: minmax(0, 1fr) !important; }
}

/* Footer global: versión solicitada */
footer{font-weight:700;color:#43536d;font-size:11px;text-align:center;padding:20px 0 5px;line-height:1.5}


/* Compact controls for the independent IKS client-IP audit section. */
.audit-client-ip-help{display:flex;gap:12px;align-items:flex-start;margin:0 0 12px;padding:11px 13px;font-size:12px;line-height:1.55}
.audit-client-ip-help strong{flex:0 0 auto}
.audit-client-ip-search{display:flex;align-items:center;gap:8px;margin:0 0 12px}
.audit-client-ip-search input{flex:1;min-width:160px;max-width:520px}
.audit-client-ip-search-btn,.audit-client-ip-reset,.audit-client-ip-clear-btn{min-height:34px;padding:7px 12px;font-size:12px;white-space:nowrap}
.audit-client-ip-footer{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 12px}
.audit-client-ip-footer form{margin:0}
@media(max-width:640px){.audit-client-ip-help{display:block}.audit-client-ip-help strong{display:block;margin-bottom:3px}.audit-client-ip-search{flex-wrap:wrap}.audit-client-ip-search input{max-width:none;flex-basis:100%}.audit-client-ip-footer{align-items:flex-start;flex-direction:column}}

/* Compact independent controls for grouped IP activity */
.audit-group-help{margin:0 0 14px}
.audit-group-bulk-actions{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:0 0 16px;padding:10px 12px;border:1px solid #e1e9f6;border-radius:10px;background:#fbfcff}
.audit-group-bulk-actions small{flex:1;min-width:220px}
.audit-group-clear-btn{padding:8px 12px;font-size:12px;white-space:nowrap}
@media(max-width:560px){.audit-group-bulk-actions{align-items:stretch}.audit-group-clear-btn{width:100%}}

/* Expandable details for client IKS IP audit rows */
.audit-client-ip-detail{position:relative;min-width:92px}
.audit-client-ip-detail>summary{display:inline-flex;align-items:center;gap:5px;cursor:pointer;list-style:none;color:var(--primary,#315efb);font-size:12px;font-weight:600;white-space:nowrap}
.audit-client-ip-detail>summary::-webkit-details-marker{display:none}
.audit-client-ip-detail>summary:after{content:"⌄";font-size:13px;transition:transform .15s ease}
.audit-client-ip-detail[open]>summary:after{transform:rotate(180deg)}
.audit-client-ip-detail-body{position:absolute;z-index:5;right:0;top:calc(100% + 7px);width:min(330px,78vw);padding:13px;display:grid;gap:9px;background:var(--surface,#fff);border:1px solid var(--border,#d8e2f2);border-radius:10px;box-shadow:0 10px 28px rgba(25,45,85,.14);white-space:normal}
.audit-client-ip-detail-body>div{display:flex;flex-direction:column;gap:3px}
.audit-client-ip-detail-body small{font-size:11px;color:var(--muted,#64748b)}
.audit-client-ip-detail-body strong{font-size:12px;font-weight:600;overflow-wrap:anywhere}
.audit-client-ip-detail-body p{font-size:11px;margin:2px 0 0;line-height:1.45}


/* IKS UI CENTERED TABLES v2 — CSS-only, based on active VPS CSS */
.accounts-table th,
.accounts-table td,
.credits-table th,
.credits-table td,
#client-results .clients-table th,
#client-results .clients-table td {
  text-align: center;
  vertical-align: middle;
}

/* Keep selection checkboxes and bulk-selection cells centered. */
.accounts-table td:has(> .bulk-panel-id),
.credits-table td:has(> .bulk-credit-id),
#client-results .clients-table td:has(> .bulk-client-id) {
  text-align: center;
  vertical-align: middle;
}

/* Align row actions consistently without changing action behavior. */
.accounts-table td:last-child,
.credits-table td:last-child,
#client-results .clients-table td:last-child {
  text-align: center;
  vertical-align: middle;
}
.accounts-table td:last-child > .account-actions,
#client-results .clients-table .client-actions.compact-actions {
  justify-content: center;
  align-items: center;
}

/* Let long notes/IDs wrap, but preserve username and credential rules already
   defined by the active stylesheet (including existing !important rules). */
.credits-table td:nth-child(6) {
  overflow-wrap: anywhere;
}

/* Responsive table cells: allow content to wrap on narrow screens. */
@media (max-width: 760px) {
  .accounts-table th,
  .accounts-table td,
  .credits-table th,
  .credits-table td,
  #client-results .clients-table th,
  #client-results .clients-table td {
    padding-left: 8px;
    padding-right: 8px;
  }
}

/* IKS FIX: compactar vencimiento y acciones de clientes */
#client-results .clients-table {
  table-layout: auto !important;
  min-width: 1120px !important;
}

#client-results .clients-table th:last-child,
#client-results .clients-table td:last-child {
  min-width: 145px !important;
  width: 145px !important;
  max-width: 170px !important;
  padding-left: 10px !important;
  padding-right: 10px !important;
  text-align: center !important;
}

#client-results .clients-table .client-actions.compact-actions {
  min-width: 0 !important;
  width: 100% !important;
  justify-content: center !important;
  gap: 6px !important;
}

#client-results .clients-table td:nth-last-child(2) {
  min-width: 150px !important;
  padding-right: 8px !important;
}

@media (max-width: 760px) {
  #client-results .clients-table {
    min-width: 1000px !important;
  }

  #client-results .clients-table th:last-child,
  #client-results .clients-table td:last-child {
    min-width: 130px !important;
    width: 130px !important;
  }
}



/* IKS integrated UI v3: protocol column + live server health */
#client-results .clients-table { min-width: 1180px !important; table-layout: auto !important; }
#client-results .clients-table th:nth-last-child(3), #client-results .clients-table td:nth-last-child(3) { min-width: 150px !important; white-space: nowrap; }
#client-results .clients-table th:nth-last-child(2), #client-results .clients-table td:nth-last-child(2) { min-width: 115px !important; width: 135px; text-align: center !important; }
#client-results .clients-table th:last-child, #client-results .clients-table td:last-child { min-width: 125px !important; width: 135px !important; max-width: 155px !important; padding-left: 8px !important; padding-right: 8px !important; text-align: center !important; }
#client-results .clients-table .client-protocol-cell { text-align: center !important; white-space: nowrap; }
.client-protocol-pill { display:inline-flex; align-items:center; justify-content:center; max-width:160px; padding:5px 9px; border-radius:999px; background:#eef2ff; color:#3348a8; border:1px solid #dce4ff; font-size:11px; font-weight:700; overflow-wrap:anywhere; white-space:normal; }
.server-health-cell { min-width:135px; text-align:center !important; vertical-align:middle; }
.server-health-badge { display:inline-flex; align-items:center; justify-content:center; gap:7px; padding:6px 10px; border-radius:999px; font-size:11px; font-weight:700; white-space:nowrap; }
.server-health-badge i { display:inline-block; width:8px; height:8px; border-radius:50%; background:currentColor; flex:0 0 8px; }
.server-health-badge.is-connected { color:#087f5b; background:#e3f8ef; }
.server-health-badge.is-offline { color:#c92a2a; background:#fff0f0; }
.server-health-badge.is-unknown { color:#667085; background:#eef1f5; }
@media(max-width:760px){ #client-results .clients-table { min-width:1180px !important; } .server-health-cell { min-width:125px; } }



/* Paginación compacta compartida por las dos listas de Auditoría */
.audit-pagination {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 6px;
  margin: 12px 0 2px;
  font-size: 12px;
}
.audit-pagination > span:first-child {
  margin-right: 6px;
  color: var(--muted, #64748b);
}
.audit-pagination a,
.audit-pagination .current {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 28px;
  min-height: 28px;
  padding: 4px 8px;
  border: 1px solid var(--border, #d8e2f2);
  border-radius: 7px;
  text-decoration: none;
  box-sizing: border-box;
}
.audit-pagination a {
  color: var(--primary, #315efb);
  background: var(--surface, #fff);
}
.audit-pagination .current {
  color: #fff;
  border-color: var(--primary, #315efb);
  background: var(--primary, #315efb);
  font-weight: 700;
}

/* Ajuste visual compacto para acciones de endpoints y respaldos */
.bulk-delete-endpoints-form {
    gap: 8px;
    padding: 10px;
    border-radius: 10px;
}

.bulk-delete-endpoints-form input {
    min-width: 0;
    padding: 8px 10px;
    font-size: 12px;
}

.bulk-delete-endpoints-form .dangerbtn {
    min-height: 36px;
    padding: 8px 13px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 600;
}

@media (max-width: 700px) {
    .bulk-delete-endpoints-form {
        align-items: stretch;
    }

    .bulk-delete-endpoints-form label,
    .bulk-delete-endpoints-form input {
        min-width: 0;
        width: 100%;
        box-sizing: border-box;
    }
}

/* Ajuste visual compacto para acciones de endpoints y respaldos */



@media (max-width: 700px) {
    .bulk-delete-endpoints-form {
        align-items: stretch;
    }

    .bulk-delete-endpoints-form label,
    .bulk-delete-endpoints-form input {
        min-width: 0;
        width: 100%;
        box-sizing: border-box;
    }
}8faff;border:1px solid var(--line);border-radius:9px;min-height:48px}
.endpoint-bulk-actions .bulk-hint,.backup-bulk-actions .bulk-hint{flex:1;min-width:150px;font-size:11px;color:var(--muted)}
.bulk-delete-form,.bulk-delete-all-form,.backup-delete-all-form{display:flex;align-items:center;gap:7px;margin:0}
.bulk-delete-form .dangerbtn,.bulk-delete-all-form .dangerbtn,.backup-delete-all-form .dangerbtn{min-height:32px;padding:7px 11px;border-radius:8px;font-size:12px;font-weight:600;white-space:nowrap}
.dangerbtn-subtle{background:#fff!important;color:#c43d43!important;border:1px solid #f2c9cb!important;box-shadow:none!important}
.dangerbtn-subtle:hover{background:#fff5f5!important;border-color:#e9a7aa!important}
.bulk-delete-form button:disabled{opacity:.45;cursor:not-allowed}
.bulk-check-cell{width:82px;text-align:center}
input[type=checkbox].bulk-endpoint-id,input[type=checkbox].bulk-backup-id,#select-visible-endpoints,#select-visible-backups{appearance:auto!important;-webkit-appearance:checkbox!important;display:inline-block!important;width:14px!important;min-width:14px!important;height:14px!important;min-height:14px!important;margin:0!important;padding:0!important;accent-color:#315eea;vertical-align:middle}
.backup-row-actions{display:flex;align-items:center;gap:10px;white-space:nowrap}
.backup-delete-one-form{display:inline-flex;align-items:center;gap:6px;margin:0}
.backup-delete-one-form input{width:76px;min-width:76px;padding:7px 8px;font-size:11px;border:1px solid var(--line);border-radius:7px}
.backup-delete-one-form .dangerbtn{min-height:30px;padding:6px 10px;border-radius:7px;font-size:11px}
@media(max-width:720px){.endpoint-bulk-actions,.backup-bulk-actions{align-items:flex-start;gap:9px}.endpoint-bulk-actions .bulk-hint,.backup-bulk-actions .bulk-hint{flex-basis:100%;order:3}.bulk-delete-form,.bulk-delete-all-form,.backup-delete-all-form{flex-wrap:wrap}.backup-row-actions{align-items:flex-start;flex-direction:column}}


/* Ajuste de coherencia visual: selección y borrado compacto */
.bulk-actions {
  display:flex; align-items:center; gap:8px; flex-wrap:wrap;
  padding:10px 12px; border:1px solid var(--border, #d9e3f5);
  border-radius:10px; background:#f7f9fd; margin:10px 0 12px;
}
.bulk-actions .bulk-select-all {
  display:inline-flex; align-items:center; gap:7px;
  font-size:12px; font-weight:600; margin:0;
}
.bulk-actions .bulk-hint { font-size:11px; color:#64748b; margin-right:auto; }
.bulk-actions input[type="checkbox"], .tablewrap input[type="checkbox"],
.endpoints-table input[type="checkbox"] {
  appearance:auto !important; width:14px !important; height:14px !important;
  min-width:14px !important; padding:0 !important; margin:0 2px 0 0 !important;
  border-radius:3px !important; box-shadow:none !important;
}
.bulk-actions button, .bulk-actions .dangerbtn, .backup-row-actions button,
.backup-delete-one-button {
  min-height:32px; padding:6px 11px; border-radius:7px;
  font-size:11px; line-height:1.2; font-weight:600;
}
.bulk-actions .bulk-delete-all-form, .bulk-actions .backup-delete-all-form,
.bulk-actions .bulk-delete-form {
  display:inline-flex; align-items:center; gap:6px; margin:0;
}
.bulk-actions .dangerbtn-subtle {
  background:#fff; color:#b91c1c; border:1px solid #fecaca; box-shadow:none;
}
.backup-row-actions { white-space:nowrap; }
.backup-row-actions .backup-delete-one-form {
  display:inline-flex; margin:0 0 0 6px; vertical-align:middle;
}
.backup-row-actions .textlink {
  display:inline-flex; align-items:center; justify-content:center;
  min-height:30px; padding:5px 9px; border-radius:7px; font-size:11px;
}
.bulk-actions input:not([type="checkbox"]):not([type="hidden"]) { display:none !important; }




/* IKS: selección compacta y acciones coherentes; solo borrado seleccionado */
.bulk-actions, .endpoint-bulk-actions, .backup-bulk-actions {
  display:flex; align-items:center; gap:8px; flex-wrap:wrap;
  padding:9px 12px; border:1px solid #d9e3f5; border-radius:10px;
  background:#f7f9fd; margin:10px 0 12px;
}
.bulk-actions input[type="checkbox"], .endpoint-bulk-actions input[type="checkbox"],
.backup-bulk-actions input[type="checkbox"], .bulk-check-cell input[type="checkbox"],
table input.bulk-endpoint-id, table input.bulk-backup-id {
  appearance:auto !important; -webkit-appearance:checkbox !important;
  width:14px !important; height:14px !important; min-width:14px !important;
  min-height:14px !important; max-width:14px !important; padding:0 !important;
  margin:0 5px 0 0 !important; border:initial !important; border-radius:3px !important;
  box-shadow:none !important; accent-color:#315efb; vertical-align:middle;
}
.bulk-actions button, .endpoint-bulk-actions button, .backup-bulk-actions button,
.bulk-delete-form button {
  min-height:30px !important; padding:6px 11px !important; border-radius:7px !important;
  font-size:11px !important; line-height:1.2 !important; font-weight:600 !important;
}
.bulk-delete-form {display:inline-flex; align-items:center; gap:6px; margin:0;}

/* IKS-SIDEBAR-DENSITY-V2 */
.sidebar .nav-dropdown-summary {
  padding-top: 7px !important;
  padding-bottom: 7px !important;
  min-height: 32px;
  gap: 7px;
}
.sidebar .nav-label {
  font-size: 11.5px !important;
  line-height: 1.18 !important;
  letter-spacing: -0.025em;
}
.sidebar .nav-icon,
.sidebar .nav-chevron {
  flex-shrink: 0;
}
.sidebar .sidebottom {
  padding-top: 6px !important;
  padding-bottom: 7px !important;
  gap: 4px !important;
}
.sidebar .sidebottom small {
  font-size: 10px !important;
  line-height: 1.15 !important;
}
.sidebar .sidebottom .logout {
  min-height: 32px !important;
  padding-top: 6px !important;
  padding-bottom: 6px !important;
  font-size: 11.5px !important;
  line-height: 1.1 !important;
}


/* Proxy Nginx: compact certificate-removal option and tidy action row. */
.proxy-uninstall-form { display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.proxy-uninstall-form .proxy-cert-option { display:inline-flex; align-items:center; gap:7px; width:auto; margin:0; padding:6px 9px; border:1px solid #e3e8f1; border-radius:8px; background:#f8faff; color:#59667a; font-size:11px; line-height:1.2; cursor:pointer; }
.proxy-uninstall-form .proxy-cert-option input[type="checkbox"] { appearance:auto!important; -webkit-appearance:checkbox!important; display:inline-block!important; flex:0 0 14px!important; width:14px!important; min-width:14px!important; max-width:14px!important; height:14px!important; min-height:14px!important; margin:0!important; padding:0!important; border:initial!important; border-radius:3px!important; box-shadow:none!important; accent-color:#315eea; }
.proxy-uninstall-form .dangerbtn { min-height:32px; padding:7px 12px; border-radius:8px; font-size:11px; font-weight:700; }
.proxy-uninstall-form .dangerbtn:hover { background:#fff5f5; border-color:#e9a7aa; }
@media(max-width:720px) { .proxy-uninstall-form { gap:7px; } }


/* IKS fix4: acciones compactas y centradas en Hosts gestionados de Nginx. */
.proxy-actions-cell {
  text-align: center !important;
  vertical-align: middle !important;
}
.proxy-actions-cell .proxy-uninstall-form {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
  flex-wrap: wrap !important;
  margin: 0 auto !important;
  width: 100% !important;
}
.proxy-actions-cell .proxy-uninstall-form .proxy-cert-option {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  width: auto !important;
  min-height: 27px !important;
  margin: 0 !important;
  padding: 4px 7px !important;
  border: 1px solid #e3e8f1 !important;
  border-radius: 7px !important;
  background: #f8faff !important;
  color: #59667a !important;
  font-size: 11px !important;
  line-height: 1.15 !important;
  white-space: nowrap !important;
}
.proxy-actions-cell .proxy-uninstall-form .proxy-cert-option > input[type="checkbox"] {
  appearance: auto !important;
  -webkit-appearance: checkbox !important;
  display: inline-block !important;
  position: static !important;
  flex: 0 0 14px !important;
  width: 14px !important;
  min-width: 14px !important;
  max-width: 14px !important;
  height: 14px !important;
  min-height: 14px !important;
  max-height: 14px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: initial !important;
  border-radius: 2px !important;
  box-shadow: none !important;
  accent-color: #315eea !important;
  vertical-align: middle !important;
}
.proxy-actions-cell .proxy-uninstall-form .dangerbtn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 28px !important;
  height: 28px !important;
  padding: 5px 10px !important;
  margin: 0 !important;
  border-radius: 7px !important;
  font-size: 11px !important;
  line-height: 1 !important;
  font-weight: 600 !important;
  white-space: nowrap !important;
}
@media (max-width: 720px) {
  .proxy-actions-cell .proxy-uninstall-form { gap: 6px !important; }
}

/* Client password reset result: keep every item stacked and readable inside the manage card. */
dialog.manage-dialog .client-password-reset-form {
  min-width: 0 !important;
  overflow: hidden !important;
  align-items: stretch !important;
}
dialog.manage-dialog .client-password-reset-result {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  justify-content: flex-start !important;
  gap: 7px !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  margin: 4px 0 0 !important;
  padding: 12px !important;
  border: 1px solid #cfe3d8 !important;
  border-radius: 9px !important;
  background: #f1faf5 !important;
  color: #294b3b !important;
  font-size: 12px !important;
  line-height: 1.45 !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
  box-sizing: border-box !important;
}
dialog.manage-dialog .client-password-reset-result.is-loading {
  border-color: #d8e2f0 !important;
  background: #f6f8fc !important;
  color: #526078 !important;
}
dialog.manage-dialog .client-password-reset-result.is-error {
  border-color: #f0cccc !important;
  background: #fff5f5 !important;
  color: #a33c3c !important;
}
dialog.manage-dialog .client-password-reset-title {
  display: block !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
  color: #176a4d !important;
}
dialog.manage-dialog .client-password-reset-label {
  display: block !important;
  margin-top: 3px !important;
  color: #65738a !important;
  font-size: 11px !important;
  font-weight: 700 !important;
}
dialog.manage-dialog .client-password-reset-value {
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  padding: 8px 9px !important;
  border: 1px solid #dce5ef !important;
  border-radius: 7px !important;
  background: #fff !important;
  color: #25334a !important;
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace !important;
  font-size: 12px !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
  word-break: break-word !important;
  box-sizing: border-box !important;
}
dialog.manage-dialog .client-password-reset-copy {
  display: flex !important;
  width: 100% !important;
  min-height: 36px !important;
  justify-content: center !important;
  white-space: normal !important;
}
dialog.manage-dialog .client-password-reset-note {
  display: block !important;
  color: #65738a !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
}


/* IKS Manage dialogs — unified card geometry for client and panel accounts (2026-10) */
dialog.manage-dialog .manage-actions-grid { grid-auto-rows:max-content !important; align-items:start !important; align-content:start !important; gap:10px !important; }
dialog.manage-dialog .manage-actions-grid > form,
dialog.manage-dialog .manage-actions-grid > button,
dialog.manage-dialog .manage-actions-grid > .manage-action-form { align-self:start !important; min-height:0 !important; height:auto !important; }
dialog.manage-dialog .manage-actions-grid .manage-action-form { display:flex !important; flex-direction:column !important; justify-content:flex-start !important; align-items:stretch !important; gap:8px !important; padding:12px !important; }
dialog.manage-dialog .manage-actions-grid .manage-action-form > strong { display:block !important; margin:0 !important; text-align:center !important; font-size:13px !important; line-height:1.35 !important; }
dialog.manage-dialog .manage-actions-grid .manage-action-form > small,
dialog.manage-dialog .manage-actions-grid .manage-action-form > .muted { display:block !important; margin:0 !important; text-align:center !important; font-size:11.5px !important; line-height:1.45 !important; white-space:normal !important; overflow-wrap:anywhere !important; }
dialog.manage-dialog .manage-actions-grid .manage-action-form > button,
dialog.manage-dialog .manage-actions-grid > button { min-height:38px !important; height:auto !important; padding:9px 12px !important; font-size:12.5px !important; line-height:1.3 !important; font-weight:650 !important; }
dialog.manage-dialog .manage-actions-grid .client-password-reset-result,
dialog.manage-dialog .manage-actions-grid .panel-password-reset-result { display:flex !important; flex-direction:column !important; align-items:stretch !important; justify-content:flex-start !important; gap:7px !important; width:100% !important; min-width:0 !important; max-width:100% !important; margin:5px 0 0 !important; padding:11px !important; box-sizing:border-box !important; border:1px solid #cfe3d8 !important; border-radius:9px !important; background:#f1faf5 !important; color:#294b3b !important; font-size:12px !important; line-height:1.45 !important; text-align:left !important; white-space:normal !important; overflow-wrap:anywhere !important; }
dialog.manage-dialog .client-password-reset-result > *,
dialog.manage-dialog .panel-password-reset-result > * { display:block !important; width:100% !important; min-width:0 !important; margin:0 !important; box-sizing:border-box !important; white-space:normal !important; overflow-wrap:anywhere !important; }
dialog.manage-dialog .client-password-reset-result .client-password-reset-title,
dialog.manage-dialog .panel-password-reset-result strong { color:#176a4d !important; font-size:12.5px !important; font-weight:750 !important; line-height:1.4 !important; }
dialog.manage-dialog .client-password-reset-result .client-password-reset-label { margin-top:2px !important; color:#65738a !important; font-size:11px !important; font-weight:700 !important; }
dialog.manage-dialog .client-password-reset-result .client-password-reset-value,
dialog.manage-dialog .panel-password-reset-result .password-reset-value { display:block !important; width:100% !important; padding:8px 9px !important; border:1px solid #dce5ef !important; border-radius:7px !important; background:#fff !important; color:#25334a !important; font-family:ui-monospace,SFMono-Regular,Menlo,monospace !important; font-size:12px !important; line-height:1.4 !important; white-space:normal !important; overflow-wrap:anywhere !important; word-break:break-word !important; }
dialog.manage-dialog .client-password-reset-result .client-password-reset-copy,
dialog.manage-dialog .panel-password-reset-result button { display:flex !important; width:100% !important; min-height:36px !important; align-items:center !important; justify-content:center !important; }
dialog.manage-dialog .client-password-reset-result.is-loading { border-color:#d8e2f0 !important; background:#f6f8fc !important; color:#526078 !important; }
dialog.manage-dialog .client-password-reset-result.is-error,
dialog.manage-dialog .panel-password-reset-result.is-error { border-color:#f0cccc !important; background:#fff5f5 !important; color:#a33c3c !important; }
@media(max-width:620px){dialog.manage-dialog .manage-actions-grid{grid-template-columns:minmax(0,1fr) !important;}}


/* Sidebar account action: keep the password link white on the dark navigation. */
.sidebar .sidebottom a.nav-label,
.sidebar .sidebottom a.nav-label:link,
.sidebar .sidebottom a.nav-label:visited {
  display: block !important;
  width: 100%;
  box-sizing: border-box;
  padding: 7px 0 !important;
  margin: 3px 0 5px !important;
  color: #f8fafc !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  line-height: 1.35 !important;
  text-align: left;
  text-decoration: underline;
  text-decoration-color: rgba(248,250,252,.72);
  text-underline-offset: 3px;
  border-radius: 5px;
  background: transparent;
}
.sidebar .sidebottom a.nav-label:hover,
.sidebar .sidebottom a.nav-label:focus-visible {
  color: #ffffff !important;
  text-decoration-color: #ffffff;
  background: rgba(255,255,255,.07);
  outline: none;
}
.sidebar .sidebottom a.nav-label:focus-visible {
  box-shadow: 0 0 0 2px rgba(147,197,253,.65);
}


/* Shared layout for panel-account and client Manage dialogs. */
dialog.manage-dialog .manage-actions-grid {
  display:grid !important;
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  grid-auto-rows:max-content !important;
  align-items:start !important;
  align-content:start !important;
  gap:8px !important;
}
dialog.manage-dialog .manage-actions-grid > form,
dialog.manage-dialog .manage-actions-grid > button {
  min-width:0 !important;
  min-height:0 !important;
  height:auto !important;
  align-self:start !important;
  margin:0 !important;
  box-sizing:border-box !important;
}
dialog.manage-dialog .manage-actions-grid > button {
  min-height:38px !important;
  padding:9px 12px !important;
  line-height:1.25 !important;
}
dialog.manage-dialog .manage-actions-grid .manage-action-form {
  min-height:0 !important;
  height:auto !important;
  justify-content:flex-start !important;
  align-self:start !important;
}
dialog.manage-dialog .endpoint-dialog-head {
  justify-content:space-between !important;
  align-items:flex-start !important;
  text-align:left !important;
}
@media(max-width:620px) {
  dialog.manage-dialog .manage-actions-grid { grid-template-columns:minmax(0,1fr) !important; }
}

/* Brand link: blue underline accent; password action now lives in Configuration. */
.sidebar .brand-home .brand-copy strong {
  text-decoration-line: underline;
  text-decoration-color: #315cf5;
  text-decoration-thickness: 2px;
  text-underline-offset: 4px;
}
.sidebar .brand-home:hover .brand-copy strong,
.sidebar .brand-home:focus-visible .brand-copy strong {
  text-decoration-color: #6d8cff;
}


/* IKS theme selector: preserve the original light appearance and add a true black dark theme. */
.brand-tools{display:flex;align-items:center;gap:8px;margin-left:auto}
.theme-toggle{width:36px;height:36px;display:inline-flex;align-items:center;justify-content:center;border:1px solid #3b4960;border-radius:9px;background:transparent;color:#f8fafc;font-size:18px;cursor:pointer}
.theme-toggle:hover{background:#1c2c46}
.brand{align-items:center}
html[data-theme="dark"]{color-scheme:dark;--bg:#000000;--ink:#f2f4f8;--muted:#a1a1aa;--line:#292929;--white:#101010;--nav:#050505;--green:#39c58a}
html[data-theme="dark"] body{background:#000;color:#f2f4f8}
html[data-theme="dark"] .main{background:#000;color:#f2f4f8}
html[data-theme="dark"] .panel,html[data-theme="dark"] .stat,html[data-theme="dark"] .userpill{background:#101010!important;border-color:#292929!important;color:#f2f4f8!important;box-shadow:none!important}
html[data-theme="dark"] h1,html[data-theme="dark"] h2,html[data-theme="dark"] h3,html[data-theme="dark"] strong,html[data-theme="dark"] td,html[data-theme="dark"] label{color:#f2f4f8}
html[data-theme="dark"] .muted,html[data-theme="dark"] .tiny,html[data-theme="dark"] .eyebrow,html[data-theme="dark"] th,html[data-theme="dark"] .cellsub{color:#a1a1aa!important}
html[data-theme="dark"] input,html[data-theme="dark"] select,html[data-theme="dark"] textarea,html[data-theme="dark"] .formgrid input,html[data-theme="dark"] .formgrid select{background:#171717!important;color:#f5f5f5!important;border-color:#383838!important}
html[data-theme="dark"] input::placeholder,html[data-theme="dark"] textarea::placeholder{color:#888!important}
html[data-theme="dark"] table th{border-color:#303030!important}
html[data-theme="dark"] table td{border-color:#242424!important;color:#d4d4d8!important}
html[data-theme="dark"] td strong{color:#fff!important}
html[data-theme="dark"] tbody tr:hover{background:#181818!important}
html[data-theme="dark"] code,html[data-theme="dark"] .tag,html[data-theme="dark"] .avatar{background:#222!important;color:#e5e7eb!important}
html[data-theme="dark"] .secondary,html[data-theme="dark"] .dangerbtn,html[data-theme="dark"] .secondary-link{background:#171717!important;color:#e5e7eb!important;border-color:#383838!important}
html[data-theme="dark"] .more-actions form,html[data-theme="dark"] .endpoint-access[open] form{background:#111!important;border-color:#333!important;color:#eee!important}
html[data-theme="dark"] .alert.info,html[data-theme="dark"] .notice{background:#111827!important;border-color:#26364d!important;color:#dbeafe!important}
html[data-theme="dark"] footer{color:#777}
html[data-theme="dark"] .sidebar{background:#050505}
html[data-theme="dark"] .sidebar nav a.active{background:#202020}
html[data-theme="dark"] .theme-toggle{border-color:#444;background:#151515;color:#fff}


/* Panel-Proxy-4 — unified Dark Pro surfaces and readable tables. */
html[data-theme="dark"] {
  color-scheme: dark;
  --bg:#080b12; --ink:#edf2fb; --muted:#9aa9bf; --line:#283244;
  --blue:#5685ff; --nav:#05070c; --white:#111722; --green:#39c58a;
}
html[data-theme="dark"] body,
html[data-theme="dark"] .main { background:#080b12 !important; color:#edf2fb !important; }
html[data-theme="dark"] .panel,
html[data-theme="dark"] .stat,
html[data-theme="dark"] .userpill {
  background:#111722 !important; color:#edf2fb !important;
  border:1px solid #283244 !important; box-shadow:none !important;
}
html[data-theme="dark"] .panel .panel,
html[data-theme="dark"] .panel .stat { background:#171e2b !important; }
html[data-theme="dark"] h1,
html[data-theme="dark"] h2,
html[data-theme="dark"] h3,
html[data-theme="dark"] h4,
html[data-theme="dark"] strong,
html[data-theme="dark"] td,
html[data-theme="dark"] label { color:#edf2fb; }
html[data-theme="dark"] p,
html[data-theme="dark"] .muted,
html[data-theme="dark"] .tiny,
html[data-theme="dark"] .eyebrow,
html[data-theme="dark"] .cellsub { color:#a9b9d4 !important; }
html[data-theme="dark"] .tablewrap,
html[data-theme="dark"] .connections-table-wrap,
html[data-theme="dark"] .table-panel,
html[data-theme="dark"] .table-container {
  background:#111722 !important; border-color:#283244 !important;
  border-radius:11px;
}
html[data-theme="dark"] table { background:#111722 !important; color:#dbe5f4 !important; }
html[data-theme="dark"] table thead,
html[data-theme="dark"] table thead tr,
html[data-theme="dark"] table th {
  background:#1b2637 !important; color:#aebed5 !important;
  border-color:#303d51 !important;
}
html[data-theme="dark"] table td {
  background:transparent !important; color:#d2dced !important;
  border-color:#273246 !important;
}
html[data-theme="dark"] table tbody tr:nth-child(even) { background:#151e2c !important; }
html[data-theme="dark"] table tbody tr:nth-child(odd) { background:#111722 !important; }
html[data-theme="dark"] table tbody tr:hover { background:#202d40 !important; }
html[data-theme="dark"] td strong { color:#f7f9fc !important; }
html[data-theme="dark"] input,
html[data-theme="dark"] select,
html[data-theme="dark"] textarea,
html[data-theme="dark"] .formgrid input,
html[data-theme="dark"] .formgrid select {
  background:#171e2b !important; color:#edf2fb !important; border-color:#35445b !important;
}
html[data-theme="dark"] input::placeholder,
html[data-theme="dark"] textarea::placeholder { color:#8393aa !important; }
html[data-theme="dark"] code,
html[data-theme="dark"] .tag,
html[data-theme="dark"] .avatar,
html[data-theme="dark"] .connections-summary span {
  background:#202c3e !important; color:#dce7f7 !important;
}
html[data-theme="dark"] .notice,
html[data-theme="dark"] .alert.info,
html[data-theme="dark"] .demo-info,
html[data-theme="dark"] .empty {
  background:#142239 !important; border-color:#294b7a !important; color:#c7d8f1 !important;
}
html[data-theme="dark"] .secondary,
html[data-theme="dark"] .dangerbtn,
html[data-theme="dark"] .secondary-link,
html[data-theme="dark"] .pagination-links a {
  background:#1a2433 !important; color:#dbe6f5 !important; border-color:#35445b !important;
}
html[data-theme="dark"] dialog,
html[data-theme="dark"] .manage-dialog,
html[data-theme="dark"] .credit-manage-dialog,
html[data-theme="dark"] .connections-dialog {
  color:#edf2fb !important; background:#111722 !important; border-color:#35445b !important;
}
html[data-theme="dark"] dialog form,
html[data-theme="dark"] dialog .formgrid,
html[data-theme="dark"] .credit-manage-menu[open] form,
html[data-theme="dark"] .credit-manage-menu[open] .formgrid {
  background:#171e2b !important; color:#edf2fb !important; border-color:#35445b !important;
}
html[data-theme="dark"] dialog p,
html[data-theme="dark"] dialog label { color:#c2cee0 !important; }
html[data-theme="dark"] .workflow-navigation,
html[data-theme="dark"] .event,
html[data-theme="dark"] .connections-dialog-head { border-color:#283244 !important; }
html[data-theme="dark"] .eventicon { background:#202d43 !important; color:#8eb0ff !important; }
html[data-theme="dark"] footer { color:#78879c !important; border-top:1px solid #202a39; margin-top:28px; padding:20px 0 8px; }
html[data-theme="dark"] .pagination-controls { color:#a9b9d4 !important; border-top:1px solid #283244; margin-top:10px; }
html[data-theme="dark"] .pagination-links a,
html[data-theme="dark"] .pagination-links .current {
  display:inline-flex; align-items:center; justify-content:center; min-width:32px;
  padding:7px 10px; border:1px solid #35445b; border-radius:8px;
  text-decoration:none; font-weight:700;
}
html[data-theme="dark"] .pagination-links .current { background:#315eea !important; color:#fff !important; border-color:#5685ff !important; }
html[data-theme="dark"] .pagination-links a:hover { background:#263750 !important; }
html[data-theme="dark"] .page-size-form { margin:0; }
html[data-theme="dark"] .page-size-form label { color:#c6d3e6 !important; }
html[data-theme="dark"] .bulk-actions { background:#151e2c !important; border-color:#283244 !important; }
html[data-theme="dark"] .connections-table th { background:#1b2637 !important; color:#aebed5 !important; }
html[data-theme="dark"] .connections-table td { border-color:#273246 !important; color:#d2dced !important; }
html[data-theme="dark"] .connection-usage-bar { background:#344258 !important; }
@media(max-width:700px) {
  .pagination-controls { align-items:flex-start; }
  .movement-pagination { flex-direction:column; }
  .movement-pagination .page-size-form { width:100%; }
  .movement-pagination .page-size-form label { justify-content:space-between; width:100%; }
  .movement-pagination .pagination-links { flex-wrap:wrap; }
}

/* Shared pagination component, used consistently across all paged tables. */
.pagination-controls{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:14px 2px 4px;font-size:12px;color:var(--muted,#64748b)}
.pagination-controls label,.page-size-form label{display:flex;align-items:center;gap:8px}
.page-size-form select{width:auto;min-width:72px}
.pagination-links{display:flex;gap:6px;align-items:center}
.pagination-links a,.pagination-links .current{display:inline-flex;align-items:center;justify-content:center;min-width:32px;padding:7px 10px;border:1px solid var(--line,#dbe3ef);border-radius:8px;text-decoration:none;font-weight:650;color:var(--ink,#172235)}
.pagination-links .current{background:var(--blue,#315eea);border-color:var(--blue,#315eea);color:#fff}
.page-size-form{display:flex;align-items:center;margin:0;font-size:12px}

/* Catch legacy inline light surfaces inside individual modules in dark mode. */
html[data-theme="dark"] [style*="background:#fff"],
html[data-theme="dark"] [style*="background: #fff"],
html[data-theme="dark"] [style*="background:#ffffff"],
html[data-theme="dark"] [style*="background: #ffffff"],
html[data-theme="dark"] [style*="background:white"],
html[data-theme="dark"] [style*="background: white"],
html[data-theme="dark"] [style*="background-color:#fff"],
html[data-theme="dark"] [style*="background-color: #fff"],
html[data-theme="dark"] [style*="background-color:#ffffff"],
html[data-theme="dark"] [style*="background-color: #ffffff"] {
  background:#171e2b !important; color:#edf2fb !important; border-color:#35445b !important;
}

/* Panel-Proxy-4 Dark Pro — remove white hover/selected/control surfaces. */
html[data-theme="dark"] .filter-tabs,
html[data-theme="dark"] .client-filters,
html[data-theme="dark"] .account-filters,
html[data-theme="dark"] .credits-filters,
html[data-theme="dark"] .bulk-actions,
html[data-theme="dark"] .formgrid,
html[data-theme="dark"] .search-panel,
html[data-theme="dark"] .filter-panel {
  background:#111722 !important;
  color:#edf2fb !important;
  border-color:#283244 !important;
}
html[data-theme="dark"] .filter-tabs a,
html[data-theme="dark"] .filter-tabs a.selected,
html[data-theme="dark"] .filter-tabs a:hover,
html[data-theme="dark"] button:not(.primary),
html[data-theme="dark"] .secondary,
html[data-theme="dark"] .dangerbtn,
html[data-theme="dark"] .secondary-link,
html[data-theme="dark"] .more-actions summary,
html[data-theme="dark"] .endpoint-access>summary,
html[data-theme="dark"] .account-actions summary,
html[data-theme="dark"] .pagination-links a,
html[data-theme="dark"] .page-size-form select {
  background:#1a2433 !important;
  color:#e5edf9 !important;
  border-color:#35445b !important;
  box-shadow:none !important;
}
html[data-theme="dark"] button:not(.primary):hover,
html[data-theme="dark"] .filter-tabs a:hover,
html[data-theme="dark"] .secondary:hover,
html[data-theme="dark"] .dangerbtn:hover,
html[data-theme="dark"] .secondary-link:hover,
html[data-theme="dark"] .pagination-links a:hover,
html[data-theme="dark"] .more-actions summary:hover,
html[data-theme="dark"] .endpoint-access>summary:hover {
  background:#263750 !important;
  color:#ffffff !important;
  border-color:#5685ff !important;
  transform:scale(1.025);
  transition:transform .14s ease,background-color .14s ease,border-color .14s ease;
}
html[data-theme="dark"] .primary { background:#315eea !important; color:#fff !important; border-color:#5685ff !important; }
html[data-theme="dark"] .primary:hover { background:#416ff5 !important; transform:scale(1.025); }
html[data-theme="dark"] .filter-tabs a.selected,
html[data-theme="dark"] .filter-tabs a[aria-current="page"] {
  background:#202f49 !important; color:#ffffff !important; border-color:#5685ff !important;
  box-shadow:inset 0 -2px 0 #5685ff !important;
}
html[data-theme="dark"] .tablewrap tbody tr,
html[data-theme="dark"] .tablewrap tbody tr:nth-child(odd),
html[data-theme="dark"] .tablewrap tbody tr:nth-child(even),
html[data-theme="dark"] .tablewrap tbody tr:hover,
html[data-theme="dark"] .tablewrap tbody tr:focus,
html[data-theme="dark"] .tablewrap tbody tr:focus-within,
html[data-theme="dark"] .tablewrap tbody tr.search-result-focus {
  background:#111722 !important;
}
html[data-theme="dark"] .tablewrap tbody tr:hover > td,
html[data-theme="dark"] .tablewrap tbody tr:focus-within > td,
html[data-theme="dark"] .tablewrap tbody tr.search-result-focus > td {
  background:#1a2638 !important; color:#edf2fb !important;
}
html[data-theme="dark"] .tablewrap tbody tr.search-result-focus > td:first-child {
  box-shadow:inset 3px 0 0 #5685ff !important;
}
html[data-theme="dark"] input[type="checkbox"],
html[data-theme="dark"] input[type="radio"] { accent-color:#5685ff; }
html[data-theme="dark"] select option { background:#171e2b !important; color:#edf2fb !important; }
html[data-theme="dark"] .account-filters label,
html[data-theme="dark"] .client-filters label,
html[data-theme="dark"] .filter-tabs a { color:#cbd7e8 !important; }
html[data-theme="dark"] .pagination-links .current { background:#315eea !important; color:#fff !important; }
@media (prefers-reduced-motion: reduce) {
  html[data-theme="dark"] button,html[data-theme="dark"] a { transition:none !important; }
}

/* Seguridad 2FA: controles compactos y alineados con el resto del panel */
.twofa-policy-options{display:grid;gap:12px;margin:14px 0 16px;max-width:620px}
.twofa-policy-option{display:flex!important;align-items:center;gap:10px!important;width:100%;font-size:12px!important;line-height:1.4;color:var(--ink);cursor:pointer}
.twofa-policy-option input[type="checkbox"]{appearance:auto!important;-webkit-appearance:checkbox!important;flex:0 0 16px!important;width:16px!important;min-width:16px!important;max-width:16px!important;height:16px!important;min-height:16px!important;margin:0!important;padding:0!important;accent-color:#315eea;cursor:pointer}
.btn-compact{min-height:32px!important;padding:7px 12px!important;font-size:11px!important;line-height:1.2!important;border-radius:8px!important}
html[data-theme="dark"] .twofa-policy-option{color:#e5edf9!important}
html[data-theme="dark"] .twofa-policy-option input[type="checkbox"]{accent-color:#5685ff}


/* Dark Pro consistency: client creation and account workflows must never flash light surfaces. */
html[data-theme="dark"] .create-client-panel,
html[data-theme="dark"] .create-client-panel .client-create-form,
html[data-theme="dark"] .create-client-panel .client-create-form label,
html[data-theme="dark"] .create-client-panel .client-create-form .field-name,
html[data-theme="dark"] .create-client-panel .client-create-form .form-row,
html[data-theme="dark"] .create-client-panel .client-create-form fieldset {
  background-color:#111722 !important; color:#edf2fb !important; border-color:#283244 !important;
}
html[data-theme="dark"] .create-client-panel .client-create-form input:not([type="hidden"]),
html[data-theme="dark"] .create-client-panel .client-create-form select,
html[data-theme="dark"] .create-client-panel .client-create-form textarea,
html[data-theme="dark"] .client-filters input,
html[data-theme="dark"] .client-filters select,
html[data-theme="dark"] #client-results input:not([type="checkbox"]),
html[data-theme="dark"] #client-results select {
  background:#171e2b !important; color:#edf2fb !important; border:1px solid #35445b !important;
  box-shadow:none; color-scheme:dark;
}
html[data-theme="dark"] .create-client-panel .client-create-form input:focus,
html[data-theme="dark"] .create-client-panel .client-create-form select:focus,
html[data-theme="dark"] .create-client-panel .client-create-form textarea:focus,
html[data-theme="dark"] .client-filters input:focus,
html[data-theme="dark"] .client-filters select:focus {
  background:#1a2638 !important; border-color:#5685ff !important; outline:0; box-shadow:0 0 0 2px #5685ff35 !important;
}
html[data-theme="dark"] .create-client-panel .client-create-form button:not(.primary),
html[data-theme="dark"] .create-client-panel .client-create-form .secondary,
html[data-theme="dark"] .client-filters button:not(.primary),
html[data-theme="dark"] .filter-tabs a {
  background:#1a2433 !important; color:#dbe6f5 !important; border-color:#35445b !important;
}
html[data-theme="dark"] .create-client-panel .client-create-form button:hover,
html[data-theme="dark"] .client-filters button:hover,
html[data-theme="dark"] .filter-tabs a:hover {
  background:#24344d !important; color:#fff !important; border-color:#5685ff !important; transform:scale(1.015);
}
html[data-theme="dark"] .filter-tabs a.selected,
html[data-theme="dark"] .filter-tabs a[aria-current="page"] {
  background:#202f49 !important; color:#fff !important; border:1px solid #5685ff !important;
}
html[data-theme="dark"] .client-filters,
html[data-theme="dark"] .client-create-form,
html[data-theme="dark"] .client-create-form > *,
html[data-theme="dark"] .client-filters > * {
  color:#edf2fb !important;
}
html[data-theme="dark"] .client-create-form .alert.warning,
html[data-theme="dark"] .client-create-form .demo-permission-note {
  background:#2b2418 !important; color:#f4d9a4 !important; border-color:#66502a !important;
}
/* Keep the active navigation group visible after following links within it. */
.sidebar .nav-dropdown[open] > .nav-dropdown-summary { background:#243653; color:#fff; }
.sidebar .nav-dropdown .nav-submenu a.active { background:#202d40; color:#fff; border-left:3px solid #5685ff; }


/* PANEL-PROXY-4 DARK PRO CONSOLIDATION — global dark surfaces, forms and controls. */
html[data-theme="dark"] {
  color-scheme: dark;
  --bg:#080b12; --surface:#111722; --surface-soft:#171e2b;
  --line:#283244; --ink:#edf2fb; --muted:#a9b9d4; --blue:#315eea;
}
html[data-theme="dark"] body,
html[data-theme="dark"] .main,
html[data-theme="dark"] .shell { background:#080b12 !important; color:#edf2fb !important; }
html[data-theme="dark"] .panel,
html[data-theme="dark"] .card,
html[data-theme="dark"] .stat-card,
html[data-theme="dark"] .create-client-panel,
html[data-theme="dark"] .tablewrap,
html[data-theme="dark"] .table-panel,
html[data-theme="dark"] .table-container,
html[data-theme="dark"] .audit-ip-group,
html[data-theme="dark"] .more-actions form,
html[data-theme="dark"] .endpoint-access[open] form,
html[data-theme="dark"] .account-actions[open] form,
html[data-theme="dark"] .manage-dialog,
html[data-theme="dark"] .credit-manage-dialog,
html[data-theme="dark"] dialog,
html[data-theme="dark"] .modal,
html[data-theme="dark"] .popover,
html[data-theme="dark"] .dropdown-menu {
  background:#111722 !important; color:#edf2fb !important; border-color:#283244 !important;
}
html[data-theme="dark"] form,
html[data-theme="dark"] fieldset,
html[data-theme="dark"] .client-create-form,
html[data-theme="dark"] .client-filters,
html[data-theme="dark"] .account-filters,
html[data-theme="dark"] .formgrid,
html[data-theme="dark"] .search-panel,
html[data-theme="dark"] .filter-panel,
html[data-theme="dark"] .bulk-actions {
  background-color:#111722 !important; color:#edf2fb !important; border-color:#283244 !important;
}
html[data-theme="dark"] label,
html[data-theme="dark"] legend,
html[data-theme="dark"] .sectionhead,
html[data-theme="dark"] .sectionhead p,
html[data-theme="dark"] .muted,
html[data-theme="dark"] .cellsub,
html[data-theme="dark"] small { color:#a9b9d4; }
html[data-theme="dark"] input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
html[data-theme="dark"] select,
html[data-theme="dark"] textarea,
html[data-theme="dark"] .formgrid input,
html[data-theme="dark"] .formgrid select,
html[data-theme="dark"] .formgrid textarea {
  background:#171e2b !important; color:#edf2fb !important;
  border:1px solid #35445b !important; color-scheme:dark;
}
html[data-theme="dark"] input::placeholder,
html[data-theme="dark"] textarea::placeholder { color:#8393aa !important; opacity:1; }
html[data-theme="dark"] input:focus,
html[data-theme="dark"] select:focus,
html[data-theme="dark"] textarea:focus {
  background:#1a2638 !important; border-color:#5685ff !important;
  outline:0; box-shadow:0 0 0 2px #5685ff35 !important;
}
html[data-theme="dark"] select option { background:#171e2b !important; color:#edf2fb !important; }
html[data-theme="dark"] button:not(.primary),
html[data-theme="dark"] .secondary,
html[data-theme="dark"] .dangerbtn,
html[data-theme="dark"] .secondary-link,
html[data-theme="dark"] .context-back,
html[data-theme="dark"] .more-actions summary,
html[data-theme="dark"] .endpoint-access>summary,
html[data-theme="dark"] .account-actions details>summary,
html[data-theme="dark"] .backup-disable-btn {
  background:#1a2433 !important; color:#e5edf9 !important; border-color:#35445b !important;
  box-shadow:none !important;
}
html[data-theme="dark"] button:not(.primary):hover,
html[data-theme="dark"] .secondary:hover,
html[data-theme="dark"] .dangerbtn:hover,
html[data-theme="dark"] .secondary-link:hover,
html[data-theme="dark"] .context-back:hover,
html[data-theme="dark"] .more-actions summary:hover,
html[data-theme="dark"] .endpoint-access>summary:hover {
  background:#263750 !important; color:#fff !important; border-color:#5685ff !important;
  transform:scale(1.02); transition:transform .14s ease,background-color .14s ease,border-color .14s ease;
}
html[data-theme="dark"] .primary { background:#315eea !important; color:#fff !important; border-color:#5685ff !important; }
html[data-theme="dark"] .primary:hover { background:#416ff5 !important; transform:scale(1.02); }
html[data-theme="dark"] input[type="checkbox"],
html[data-theme="dark"] input[type="radio"] { accent-color:#5685ff !important; color-scheme:dark; }
html[data-theme="dark"] .alert.warning,
html[data-theme="dark"] .alert.info,
html[data-theme="dark"] .alert.success,
html[data-theme="dark"] .alert.danger,
html[data-theme="dark"] .notice,
html[data-theme="dark"] .demo-info,
html[data-theme="dark"] .empty,
html[data-theme="dark"] .demo-permission-note {
  background:#192437 !important; color:#dce8fa !important; border-color:#354b6b !important;
}
html[data-theme="dark"] .alert.warning,
html[data-theme="dark"] .demo-permission-note { background:#2b2418 !important; color:#f4d9a4 !important; border-color:#66502a !important; }
html[data-theme="dark"] .alert.success { background:#142b25 !important; color:#b9ead7 !important; border-color:#285844 !important; }
html[data-theme="dark"] .alert.danger { background:#301d24 !important; color:#ffd5d9 !important; border-color:#69404a !important; }
html[data-theme="dark"] .tablewrap,
html[data-theme="dark"] .tablewrap table,
html[data-theme="dark"] table { background:#111722 !important; color:#dbe5f4 !important; }
html[data-theme="dark"] table th { background:#1b2637 !important; color:#aebed5 !important; border-color:#283244 !important; }
html[data-theme="dark"] table td { background:#111722 !important; color:#d2dced !important; border-color:#273246 !important; }
html[data-theme="dark"] table tbody tr:nth-child(even) td { background:#151e2c !important; }
html[data-theme="dark"] table tbody tr:hover td,
html[data-theme="dark"] table tbody tr:focus-within td { background:#202d40 !important; color:#edf2fb !important; }
html[data-theme="dark"] .filter-tabs a,
html[data-theme="dark"] .filter-tabs a.selected,
html[data-theme="dark"] .filter-tabs a[aria-current="page"] {
  background:#1a2433 !important; color:#dbe6f5 !important; border-color:#35445b !important;
}
html[data-theme="dark"] .filter-tabs a.selected,
html[data-theme="dark"] .filter-tabs a[aria-current="page"] {
  background:#202f49 !important; color:#fff !important; border-color:#5685ff !important;
}
html[data-theme="dark"] .sidebar .nav-dropdown:has(.nav-submenu a.active) > .nav-dropdown-summary {
  background:#243653 !important; color:#fff !important;
}
html[data-theme="dark"] footer { background:transparent !important; color:#78879c !important; }
@media (prefers-reduced-motion: reduce) {
  html[data-theme="dark"] button, html[data-theme="dark"] a { transition:none !important; }
}


/* FINAL DARK PRO PASS: eliminate light surfaces across every module.
   QR canvases retain a white quiet-zone only where QR scanning requires it. */
html[data-theme="dark"] .userpill,
html[data-theme="dark"] .avatar,
html[data-theme="dark"] .connections-summary span,
html[data-theme="dark"] .connection-usage.over-limit,
html[data-theme="dark"] .connections-table th,
html[data-theme="dark"] .created-account-card,
html[data-theme="dark"] .created-account-code,
html[data-theme="dark"] .created-account-copy,
html[data-theme="dark"] .panel-created-card,
html[data-theme="dark"] .panel-created-code,
html[data-theme="dark"] .panel-created-copy,
html[data-theme="dark"] .alert-stats .alert-stat,
html[data-theme="dark"] .credits-table .credit-manage-menu[open] .formgrid,
html[data-theme="dark"] .performance-metric,
html[data-theme="dark"] .metric-card,
html[data-theme="dark"] .info-card,
html[data-theme="dark"] .about-metrics,
html[data-theme="dark"] .permission-card,
html[data-theme="dark"] .permissions-box,
html[data-theme="dark"] .backup-status,
html[data-theme="dark"] .backup-manual,
html[data-theme="dark"] .audit-clear-row,
html[data-theme="dark"] .firewall-output,
html[data-theme="dark"] pre,
html[data-theme="dark"] code:not(.inline-code) {
  background:#111722 !important;
  color:#dbe6f5 !important;
  border-color:#283244 !important;
  box-shadow:none !important;
}
html[data-theme="dark"] .created-account-code,
html[data-theme="dark"] .panel-created-code,
html[data-theme="dark"] pre,
html[data-theme="dark"] code:not(.inline-code) {
  background:#171e2b !important;
  color:#dbe6f5 !important;
}
html[data-theme="dark"] .created-account-copy,
html[data-theme="dark"] .panel-created-copy {
  background:#1a2b49 !important;
  color:#dce8ff !important;
  border-color:#4569b5 !important;
}
html[data-theme="dark"] .alert,
html[data-theme="dark"] .notice,
html[data-theme="dark"] .empty,
html[data-theme="dark"] .info-box,
html[data-theme="dark"] .help-box,
html[data-theme="dark"] .metric-note,
html[data-theme="dark"] .explain-box,
html[data-theme="dark"] .status-box,
html[data-theme="dark"] .backup-row,
html[data-theme="dark"] .backup-schedule,
html[data-theme="dark"] .permission-box,
html[data-theme="dark"] .permissions-box *,
html[data-theme="dark"] .backup-status *,
html[data-theme="dark"] .backup-manual * {
  background-color:transparent;
  color:#dbe6f5;
}
html[data-theme="dark"] .alert,
html[data-theme="dark"] .notice,
html[data-theme="dark"] .empty,
html[data-theme="dark"] .info-box,
html[data-theme="dark"] .help-box,
html[data-theme="dark"] .metric-note,
html[data-theme="dark"] .explain-box,
html[data-theme="dark"] .status-box,
html[data-theme="dark"] .backup-row,
html[data-theme="dark"] .backup-schedule,
html[data-theme="dark"] .permission-box {
  background:#192437 !important;
  border-color:#354b6b !important;
}
html[data-theme="dark"] .permissions-box,
html[data-theme="dark"] .permissions-box label,
html[data-theme="dark"] .permissions-box p,
html[data-theme="dark"] .backup-status,
html[data-theme="dark"] .backup-status *,
html[data-theme="dark"] .backup-manual,
html[data-theme="dark"] .backup-manual *,
html[data-theme="dark"] .audit-clear-row,
html[data-theme="dark"] .audit-clear-row * {
  color:#dbe6f5 !important;
}
html[data-theme="dark"] [style*="background:#fff"],
html[data-theme="dark"] [style*="background: #fff"],
html[data-theme="dark"] [style*="background-color:#fff"],
html[data-theme="dark"] [style*="background-color: #fff"],
html[data-theme="dark"] [style*="background:white"],
html[data-theme="dark"] [style*="background: white"],
html[data-theme="dark"] [style*="background:#f8"],
html[data-theme="dark"] [style*="background: #f8"],
html[data-theme="dark"] [style*="background:#f1"],
html[data-theme="dark"] [style*="background: #f1"],
html[data-theme="dark"] [style*="background:#eef"],
html[data-theme="dark"] [style*="background: #eef"] {
  background:#111722 !important;
  color:#dbe6f5 !important;
  border-color:#283244 !important;
  box-shadow:none !important;
}
/* Keep the fixed sidebar stable; only its navigation list scrolls when needed. */
.sidebar { overflow:hidden; }
.sidebar > nav {
  flex:1 1 auto;
  min-height:0;
  overflow-y:auto;
  overflow-x:hidden;
  overscroll-behavior:contain;
  scrollbar-width:thin;
  scrollbar-color:#35445b transparent;
  padding-right:3px;
}
.sidebar > nav::-webkit-scrollbar { width:6px; }
.sidebar > nav::-webkit-scrollbar-thumb { background:#35445b; border-radius:8px; }
.sidebar .sidebottom { flex:0 0 auto; }
html[data-theme="dark"] .sidebar { background:#05070b !important; }
html[data-theme="dark"] .sidebar .nav-dropdown-summary,
html[data-theme="dark"] .sidebar .nav-submenu a { color:#a9b9d4; }
html[data-theme="dark"] .sidebar .nav-dropdown[open] > .nav-dropdown-summary {
  background:#243653 !important; color:#fff !important;
}
html[data-theme="dark"] .sidebar .nav-submenu a.active {
  background:#202d40 !important; color:#fff !important;
  border-left:3px solid #5685ff !important;
}


/* Panel-Proxy-4 FINAL FIX: dark-mode contrast for backup controls and audit IP cards. */
html[data-theme="dark"] .backup-control-row,
html[data-theme="dark"] .backup-current-state,
html[data-theme="dark"] .backup-schedule-meta,
html[data-theme="dark"] .audit-ip-group,
html[data-theme="dark"] .audit-ip-group > summary,
html[data-theme="dark"] .audit-ip-search-form,
html[data-theme="dark"] .audit-clear-search,
html[data-theme="dark"] .audit-ip-group[open] {
  background:#111722 !important;
  color:#e7edf7 !important;
  border-color:#35445b !important;
  box-shadow:none !important;
}
html[data-theme="dark"] .backup-control-row > *,
html[data-theme="dark"] .backup-control-row strong,
html[data-theme="dark"] .backup-control-row small,
html[data-theme="dark"] .backup-control-row p,
html[data-theme="dark"] .backup-control-row span,
html[data-theme="dark"] .backup-schedule-meta strong,
html[data-theme="dark"] .backup-schedule-meta small,
html[data-theme="dark"] .backup-meta-label,
html[data-theme="dark"] .audit-ip-group > summary *,
html[data-theme="dark"] .audit-ip-search-form label,
html[data-theme="dark"] .audit-ip-search-row,
html[data-theme="dark"] .audit-clear-search {
  color:#dbe6f5 !important;
}
html[data-theme="dark"] .backup-current-state.is-on {
  background:#172945 !important;
  border-color:#36588b !important;
}
html[data-theme="dark"] .backup-current-state.is-off {
  background:#202a38 !important;
  border-color:#465366 !important;
}
html[data-theme="dark"] .backup-current-state small b,
html[data-theme="dark"] .backup-current-state.is-on small b {
  color:#8db5ff !important;
}
html[data-theme="dark"] .backup-schedule-meta { border-left-color:#35445b !important; }
html[data-theme="dark"] .backup-state-on {
  background:#172d4d !important; color:#a9c7ff !important; border-color:#36588b !important;
}
html[data-theme="dark"] .audit-ip-main strong { color:#a9c5ff !important; }
html[data-theme="dark"] .audit-ip-main small,
html[data-theme="dark"] .audit-ip-time small { color:#a9b9d4 !important; }
html[data-theme="dark"] .audit-ip-time strong,
html[data-theme="dark"] .audit-ip-country { color:#dbe6f5 !important; }
html[data-theme="dark"] .audit-ip-group > summary:hover { background:#1a2638 !important; }
html[data-theme="dark"] .audit-events-table { border-color:#35445b !important; }
html[data-theme="dark"] .audit-ip-search-form input,
html[data-theme="dark"] .audit-ip-search-row input { background:#171e2b !important; color:#edf2fb !important; border-color:#35445b !important; }
html[data-theme="dark"] .backup-disable-btn { background:#202a38 !important; color:#edf2fb !important; border-color:#465366 !important; }

/* Keep sidebar scroll position stable across page navigation; active item stays highlighted. */
.sidebar, .sidebar nav { overscroll-behavior:contain; }
.sidebar nav { scroll-behavior:auto !important; }
.sidebar nav a.active, .sidebar .nav-submenu a.active {
  position:relative;
  background:#243653 !important;
  color:#fff !important;
  box-shadow:inset 3px 0 0 #5685ff !important;
  outline:none;
}
html[data-theme="dark"] .sidebar nav a.active,
html[data-theme="dark"] .sidebar .nav-submenu a.active {
  background:#243653 !important; color:#fff !important;
}


/* Panel-Proxy-4: dark-mode contrast for the performance explanation card. */
html[data-theme="dark"] .performance-note {
  background:#111722 !important;
  color:#c5d2e5 !important;
  border-color:#35445b !important;
  box-shadow:none !important;
}
html[data-theme="dark"] .performance-note strong {
  color:#edf3fc !important;
}
html[data-theme="dark"] .performance-note p {
  color:#c5d2e5 !important;
}
html[data-theme="dark"] .performance-note .note-icon {
  background:#1d3154 !important;
  color:#8db5ff !important;
}


/* Panel-Proxy-4: dark-theme contrast fixes for remaining light information rows. */
html[data-theme="dark"] .fslb-endpoint-note,
html[data-theme="dark"] .audit-group-bulk-actions {
  background:#111a28 !important;
  color:#dbe6f5 !important;
  border-color:#35445b !important;
  box-shadow:none !important;
}
html[data-theme="dark"] .fslb-endpoint-note strong,
html[data-theme="dark"] .fslb-endpoint-note div,
html[data-theme="dark"] .fslb-endpoint-note span,
html[data-theme="dark"] .audit-group-bulk-actions small {
  color:#c6d4e8 !important;
}
html[data-theme="dark"] .fslb-endpoint-note code {
  background:#202d40 !important;
  color:#edf3ff !important;
  border-color:#435675 !important;
}
html[data-theme="dark"] .audit-group-bulk-actions .audit-group-clear-btn {
  color:#edf2fb !important;
}

/* MySQL legacy integration: compact save action and full-width expandable access. */
.legacy-save-btn{width:auto!important;min-width:0!important;min-height:36px!important;padding:8px 15px!important;justify-self:start;align-self:flex-start}
.legacy-access{width:100%;border:1px solid var(--line,#dbe3ef);border-radius:10px;overflow:hidden;background:var(--surface,#fff)}
.legacy-access>summary{width:100%;min-height:48px;display:flex;align-items:center;justify-content:space-between;gap:14px;padding:12px 15px;cursor:pointer;list-style:none;font-weight:750;color:var(--ink,#172235)}
.legacy-access>summary::-webkit-details-marker{display:none}
.legacy-access>summary:after{content:'⌄';font-size:18px;line-height:1;transition:transform .15s ease}
.legacy-access[open]>summary:after{transform:rotate(180deg)}
.legacy-access-hint{margin-left:auto;color:var(--muted,#667085);font-size:11px;font-weight:600}
.legacy-access-links{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;padding:0 12px 12px}
.legacy-access-links a,.legacy-all-access{display:flex;align-items:center;justify-content:center;gap:8px;min-height:40px;padding:9px 12px;border:1px solid var(--line,#dbe3ef);border-radius:8px;text-decoration:none;font-size:12px;font-weight:700;color:var(--ink,#172235);background:var(--surface-muted,#f7f9fc)}
.legacy-access-links a:hover,.legacy-all-access:hover{border-color:#5685ff;background:var(--surface,#fff)}
.legacy-all-access{width:100%;justify-content:space-between;min-height:48px}
.legacy-query-btn{width:auto!important;min-width:110px;align-self:end}
.legacy-result-panel{margin-top:16px;scroll-margin-top:20px}
.legacy-pagination-row{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-top:8px}
.legacy-pagination-row .pagination-links{flex-wrap:wrap;gap:5px}
.legacy-pagination-row .pagination-links a,.legacy-pagination-row .pagination-links .current{min-width:34px;min-height:34px;padding:6px 9px}
.legacy-page-ellipsis{padding:5px;color:var(--muted,#667085)}
html[data-theme="dark"] .legacy-access{background:#111722;border-color:#35445b}
html[data-theme="dark"] .legacy-access>summary{color:#edf3fc}
html[data-theme="dark"] .legacy-access-links a,html[data-theme="dark"] .legacy-all-access{background:#1a2638;color:#dbe6f5;border-color:#35445b}
html[data-theme="dark"] .legacy-access-links a:hover,html[data-theme="dark"] .legacy-all-access:hover{background:#243653;border-color:#5685ff}
@media(max-width:650px){.legacy-access-links{grid-template-columns:1fr}.legacy-pagination-row{align-items:flex-start;flex-direction:column}.legacy-query-btn{width:100%!important}}


/* MySQL server cards: compact collapsed headers and consistent controls */
.legacy-server-accordion{padding:0!important;overflow:hidden;min-width:0}
.legacy-server-summary{display:flex;align-items:center;gap:12px;min-height:62px;padding:14px 18px;cursor:pointer;list-style:none}
.legacy-server-summary::-webkit-details-marker{display:none}
.legacy-server-summary:after{content:'⌄';margin-left:auto;font-size:19px;color:var(--muted,#8794a8);transition:transform .15s ease}
.legacy-server-accordion[open]>.legacy-server-summary:after{transform:rotate(180deg)}
.legacy-server-title{font-size:16px;font-weight:800;color:var(--ink,#172235)}
.legacy-server-caption{font-size:12px;color:var(--muted,#667085)}
.legacy-server-content{padding:0 18px 18px;border-top:1px solid var(--line,#dbe3ef);padding-top:16px}
.legacy-server-content .legacy-save-btn{display:inline-flex!important;width:max-content!important;min-width:0!important;max-width:220px!important;min-height:36px!important;padding:8px 16px!important;justify-self:start!important;align-self:flex-start!important}
.legacy-server-content .checkline{display:flex!important;align-items:center!important;justify-content:flex-start!important;gap:9px!important}
.legacy-server-content .checkline input[type=checkbox]{width:16px!important;height:16px!important;min-width:16px!important;min-height:16px!important;margin:0!important;flex:0 0 16px!important;accent-color:#3563eb}
html[data-theme="dark"] .legacy-server-summary{color:#edf3fc}
html[data-theme="dark"] .legacy-server-title{color:#edf3fc}
@media(max-width:650px){.legacy-server-summary{flex-wrap:wrap}.legacy-server-caption{width:100%;padding-left:1px}.legacy-server-content{padding-left:12px;padding-right:12px}}

/* MySQL sources: compact server-name accordion and consistent bottom pagination. */
.legacy-server-summary{min-height:54px!important;padding:12px 18px!important}
.legacy-server-title{font-size:15px!important;font-weight:800!important}
.legacy-server-summary:after{margin-left:auto}
.legacy-server-caption{display:none!important}
.legacy-server-content small.muted{display:block;margin-top:5px;font-size:11px}
.legacy-server-content .legacy-save-btn{display:inline-flex!important;width:auto!important;min-width:0!important;max-width:190px!important;min-height:34px!important;padding:7px 13px!important;justify-self:start!important;align-self:flex-start!important}
.legacy-pagination-tools{display:flex;align-items:center;justify-content:flex-end;gap:16px;flex-wrap:wrap}
.legacy-page-size-inline{margin:0}
.legacy-page-size-inline label{display:flex;align-items:center;gap:9px;font-size:12px;font-weight:650}
.legacy-page-size-inline select{min-width:64px;width:auto;min-height:36px;padding:6px 10px}
@media(max-width:700px){.legacy-pagination-tools{justify-content:flex-start;width:100%}.legacy-pagination-row{align-items:flex-start!important;gap:12px!important}}


/* PANEL-PROXY-4 — estándar único de paginación para todo el panel.
   Selector siempre a la izquierda; resumen y navegación a la derecha.
   No altera consultas, filtros ni el estado independiente de cada listado. */
.pagination-controls,
.audit-pagination,
.legacy-pagination-row,
.legacy-pagination-tools {
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:12px !important;
  flex-wrap:wrap !important;
  width:100%;
  box-sizing:border-box;
}
.pagination-controls > .page-size-form,
.pagination-controls > form.page-size-form,
.legacy-pagination-row > .legacy-page-size-inline,
.legacy-pagination-tools > .legacy-page-size-inline {
  order:1;
  margin:0 !important;
  margin-right:auto !important;
}
.pagination-controls > span,
.audit-pagination > span,
.legacy-pagination-row > .muted {
  order:2;
  margin-left:auto;
  text-align:right;
}
.pagination-controls > .pagination-links,
.pagination-controls > nav.pagination-links,
.audit-pagination .pagination-links,
.audit-pagination > .pagination-links,
.legacy-pagination-row > .pagination-links {
  order:3;
  margin-left:0 !important;
}
.pagination-controls .page-size-form select,
.audit-pagination .page-size-form select,
.legacy-page-size-inline select {
  min-width:68px;
  width:auto !important;
}
.pagination-controls .pagination-links,
.audit-pagination .pagination-links,
.legacy-pagination-row .pagination-links {
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:6px;
  flex-wrap:wrap;
}
.pagination-controls .pagination-links a,
.pagination-controls .pagination-links .current,
.audit-pagination .pagination-links a,
.audit-pagination .pagination-links .current,
.legacy-pagination-row .pagination-links a,
.legacy-pagination-row .pagination-links .current {
  min-width:34px;
  min-height:34px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  box-sizing:border-box;
}
.pagination-controls form,
.audit-pagination form,
.legacy-pagination-row form { margin-top:0 !important; margin-bottom:0 !important; }
@media(max-width:700px) {
  .pagination-controls,
  .audit-pagination,
  .legacy-pagination-row,
  .legacy-pagination-tools {
    justify-content:flex-start !important;
    align-items:center !important;
  }
  .pagination-controls > span,
  .audit-pagination > span,
  .legacy-pagination-row > .muted {
    margin-left:0;
    text-align:left;
  }
  .pagination-controls > .pagination-links,
  .audit-pagination .pagination-links,
  .legacy-pagination-row > .pagination-links {
    margin-left:auto !important;
  }
}