/* =====================================================================================================================
   cwp-ui - the shared design of the CWP admin and user panel (served on both panels as /cwp-ui/, see
   /scripts/cwpsrv_ui_setup). Look of control-webpanel.com: Inter, navy menu, CWP red, blue accents, 16 px radius.

   Themes: <html data-theme="cwp|dark|classic">. A theme only sets the --cu-* tokens; everything else reads them.
   Custom themes (kept by updates): /usr/local/cwp/.conf/cwp-ui-themes/<name>.css, same token list.
   Prefix cu- for everything new; the old module classes (.cwp-mod, Bootstrap) are mapped onto the tokens at the end
   so existing modules follow the theme until they are rebuilt.
   ===================================================================================================================== */

@font-face{font-family:"Inter";font-style:normal;font-weight:400 700;font-display:swap;src:url(fonts/inter-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Inter";font-style:normal;font-weight:400 700;font-display:swap;src:url(fonts/inter-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"JetBrains Mono";font-style:normal;font-weight:400 500;font-display:swap;src:url(fonts/jbmono-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"JetBrains Mono";font-style:normal;font-weight:400 500;font-display:swap;src:url(fonts/jbmono-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}

/* old theme fonts (main.css asks for them by name) now show as Inter, so the panel loads no other web font */
@font-face{font-family:"Open Sans";font-weight:300 800;font-display:swap;src:url(fonts/inter-latin.woff2) format("woff2")}
@font-face{font-family:"Droid Sans";font-weight:400 700;font-display:swap;src:url(fonts/inter-latin.woff2) format("woff2")}

/* ---------------------------------------------------------------- tokens: CWP (default, like control-webpanel.com) */
:root{
  --cu-bg:#f3f5f9; --cu-card:#ffffff; --cu-card-2:#f8fafc; --cu-line:#e1e7ef; --cu-line-strong:#cfd8e3;
  --cu-text:#172233; --cu-muted:#5d6b7e; --cu-track:#eef2f7;
  --cu-accent:#1d5fbf; --cu-accent-hover:#164b98; --cu-accent-soft:#e8f0fc; --cu-on-accent:#ffffff;
  --cu-brand:#c8202f; --cu-brand-hover:#a91a27;
  --cu-ok:#15803d; --cu-ok-soft:#e7f6ec; --cu-warn:#b45309; --cu-warn-soft:#fdf1e3; --cu-bad:#c8202f; --cu-bad-soft:#fdeaec;
  --cu-side:#0b1d33; --cu-side-2:#13304f; --cu-side-line:#1f3d61; --cu-side-text:#c9d6e8; --cu-side-strong:#ffffff;
  --cu-side-muted:#8ea3bf; --cu-side-active:#1d5fbf; --cu-side-active-text:#ffffff;
  --cu-top:#ffffff; --cu-hero:#0b1d33;
  --cu-radius:8px; --cu-radius-sm:8px;
  --cu-shadow:0 1px 2px rgba(16,24,40,.05);
  --cu-shadow-lg:0 12px 32px rgba(16,24,40,.12);
  --cu-font:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --cu-mono:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  --cu-side-w:260px;
  color-scheme:light;
}
/* ---------------------------------------------------------------- Dark */
html[data-theme="dark"]{
  --cu-bg:#0b1220; --cu-card:#111a2b; --cu-card-2:#0e1626; --cu-line:#1f2c42; --cu-line-strong:#2b3c57;
  --cu-text:#e6edf7; --cu-muted:#97a6bb; --cu-track:#1a2639;
  --cu-accent:#6ea2ff; --cu-accent-hover:#9cc0ff; --cu-accent-soft:#16294a; --cu-on-accent:#0b1220;
  --cu-brand:#e2414f; --cu-brand-hover:#f06a76;
  --cu-ok:#4ade80; --cu-ok-soft:#123222; --cu-warn:#fbbf24; --cu-warn-soft:#3a2a0c; --cu-bad:#ff6b78; --cu-bad-soft:#3d151b;
  --cu-side:#070d18; --cu-side-2:#0e1828; --cu-side-line:#1a2840; --cu-side-text:#b8c6da; --cu-side-strong:#ffffff;
  --cu-side-muted:#7d8ea6; --cu-side-active:#1d5fbf; --cu-side-active-text:#ffffff;
  --cu-top:#0e1626; --cu-hero:#13304f;
  --cu-shadow:0 1px 2px rgba(0,0,0,.4); --cu-shadow-lg:0 12px 32px rgba(0,0,0,.5);
  color-scheme:dark;
}
/* ---------------------------------------------------------------- Classic (light menu, the old CWP blue) */
html[data-theme="classic"]{
  --cu-bg:#eef1f5; --cu-line:#dfe4ea; --cu-text:#1f2933; --cu-muted:#5f6b7a; --cu-track:#e9edf2;
  --cu-accent:#1c84c6; --cu-accent-hover:#166a9f; --cu-accent-soft:#e6f2fb;
  --cu-side:#ffffff; --cu-side-2:#f1f4f8; --cu-side-line:#dfe4ea; --cu-side-text:#3c4857; --cu-side-strong:#1f2933;
  --cu-side-muted:#6b7785; --cu-side-active:#1c84c6; --cu-hero:#1c84c6;
}

/* ---------------------------------------------------------------- base */
html,body{background:var(--cu-bg) !important;color:var(--cu-text);font-family:var(--cu-font) !important;font-size:14px;line-height:1.5;-webkit-font-smoothing:antialiased}
body{margin:0}
a{color:var(--cu-accent)}
a:hover,a:focus{color:var(--cu-accent-hover)}
code,pre,kbd,.cu-mono{font-family:var(--cu-mono)}
:focus-visible{outline:2px solid var(--cu-accent);outline-offset:2px}

/* ---------------------------------------------------------------- shell */
/* fixed menu + padded content (not flex): an extra </div> in an old module cannot pull the content out of place */
.cu-shell{display:block;min-height:100vh;padding-left:var(--cu-side-w);box-sizing:border-box}
.cu-shell .cu-side,.cu-shell #sidebar.cu-side{position:fixed !important;left:0 !important;top:0 !important;bottom:0;width:var(--cu-side-w) !important;height:100vh !important;margin:0 !important;padding:0 !important;float:none !important;background:var(--cu-side) !important;color:var(--cu-side-text);display:flex;flex-direction:column;overflow-y:auto;scrollbar-width:thin;scrollbar-color:var(--cu-side-line) transparent;border-right:1px solid var(--cu-side-line);z-index:30;box-sizing:border-box}
.cu-brand{display:flex;align-items:center;gap:11px;padding:18px 18px 14px;color:var(--cu-side-strong);text-decoration:none}
.cu-brand:hover,.cu-brand:focus{color:var(--cu-side-strong);text-decoration:none}
/* the same mark as on control-webpanel.com */
.cu-logo{width:40px;height:40px;border-radius:8px;background:var(--cu-brand);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:13px;letter-spacing:.5px;flex:none}
.cu-brand-txt{display:flex;flex-direction:column;min-width:0}
.cu-brand-name{font-weight:700;font-size:16px;line-height:1.15;white-space:nowrap}
.cu-brand-host{font-size:12px;color:#9fb3cc;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
html[data-theme="classic"] .cu-brand-host{color:var(--cu-side-muted)}
.cu-side-load{margin:0 14px 10px;padding:8px 12px;border-radius:var(--cu-radius-sm);background:var(--cu-side-2);color:var(--cu-side-text);font-family:var(--cu-mono);font-size:12px;display:flex;align-items:center;gap:8px}
.cu-side-load a{color:var(--cu-side-text) !important}
.cu-side-load [class*="icon"]{display:none}
.cu-body{min-width:0}
.cu-top{position:sticky;top:0;z-index:20;display:flex;align-items:center;flex-wrap:wrap;gap:10px;padding:12px 28px;background:var(--cu-top);border-bottom:1px solid var(--cu-line)}
.cu-menu-btn{display:none}
.cu-crumbs{flex:1 1 240px;min-width:0;display:flex;flex-direction:column}
.cu-crumbs small{font-size:12px;color:var(--cu-muted)}
.cu-title{margin:0;font-size:18px;font-weight:600;line-height:1.3;color:var(--cu-text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cu-top-actions{display:flex;align-items:center;flex-wrap:wrap;gap:8px}
.cu-main{padding:24px 28px 32px;box-sizing:border-box;min-height:calc(100vh - 140px)}
.cu-foot{padding:16px 28px;color:var(--cu-muted);font-size:12px;display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px;border-top:1px solid var(--cu-line)}
.cu-foot a{color:var(--cu-muted)}

/* ---------------------------------------------------------------- components */
.cu-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:38px;padding:0 14px;border-radius:var(--cu-radius-sm);border:1px solid var(--cu-line);background:var(--cu-card);color:var(--cu-text) !important;font:inherit;font-weight:500;line-height:1;cursor:pointer;text-decoration:none !important;white-space:nowrap;transition:background .12s,border-color .12s}
.cu-btn:hover{border-color:var(--cu-line-strong);background:var(--cu-card-2)}
.cu-btn-primary{background:var(--cu-accent);border-color:var(--cu-accent);color:var(--cu-on-accent) !important}
.cu-btn-primary:hover{background:var(--cu-accent-hover);border-color:var(--cu-accent-hover)}
.cu-btn-brand{background:var(--cu-brand);border-color:var(--cu-brand);color:#fff !important}
.cu-btn-brand:hover{background:var(--cu-brand-hover);border-color:var(--cu-brand-hover)}
.cu-icon-btn{position:relative;width:40px;padding:0}
.cu-dot{position:absolute;top:5px;right:5px;min-width:16px;height:16px;padding:0 4px;border-radius:999px;background:var(--cu-brand);color:#fff;font-size:10px;font-weight:700;line-height:16px;text-align:center}
.cu-ico{width:18px;height:18px;flex:none;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.cu-pill{display:inline-flex;align-items:center;gap:6px;padding:3px 10px;border-radius:999px;font-size:12px;font-weight:600;background:var(--cu-accent-soft);color:var(--cu-accent);white-space:nowrap}
.cu-pill-ok{background:var(--cu-ok-soft);color:var(--cu-ok)}
.cu-pill-warn{background:var(--cu-warn-soft);color:var(--cu-warn)}
.cu-pill-bad{background:var(--cu-bad-soft);color:var(--cu-bad)}
.cu-seg{display:inline-flex;padding:3px;gap:2px;border-radius:var(--cu-radius-sm);background:var(--cu-bg);border:1px solid var(--cu-line)}
.cu-seg button{min-height:30px;padding:0 11px;border:0;border-radius:8px;background:transparent;color:var(--cu-muted);font:inherit;font-size:12.5px;font-weight:600;cursor:pointer}
.cu-seg button[aria-pressed="true"]{background:var(--cu-accent);color:var(--cu-on-accent)}
.cu-card{background:var(--cu-card);border:1px solid var(--cu-line);border-radius:var(--cu-radius);box-shadow:var(--cu-shadow)}
.cu-menu-pop{position:relative}
.cu-menu-pop > ul{display:none;position:absolute;right:0;top:calc(100% + 6px);min-width:200px;margin:0;padding:6px;list-style:none;background:var(--cu-card);border:1px solid var(--cu-line);border-radius:var(--cu-radius-sm);box-shadow:var(--cu-shadow-lg);z-index:50}
.cu-menu-pop.open > ul{display:block}
.cu-menu-pop > ul a{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:8px;color:var(--cu-text);text-decoration:none}
.cu-menu-pop > ul a:hover{background:var(--cu-card-2)}
.cu-menu-pop > ul .cu-lang label{display:flex;align-items:center;gap:10px;margin:0;padding:6px 10px;font-weight:400;color:var(--cu-text)}
.cu-menu-pop > ul .cu-lang select{flex:1;min-width:0;min-height:32px;padding:0 6px;border:1px solid var(--cu-line);border-radius:6px;background:var(--cu-card);color:var(--cu-text);font:inherit}
.cu-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.cu-toast{position:fixed;right:20px;bottom:20px;z-index:2000;display:flex;flex-direction:column;gap:8px}
.cu-toast div{padding:12px 16px;border-radius:var(--cu-radius-sm);background:var(--cu-text);color:var(--cu-bg);box-shadow:var(--cu-shadow-lg);font-weight:500}

/* ---------------------------------------------------------------- the panel menu (menu.php markup: .mainnav > ul > li.menup) */
.cu-side .sidenav{padding:0 10px 24px}
.cu-side .sidebar-widget{display:none}
.cu-side .mainnav{background:transparent !important;border:0 !important;padding:0 !important;margin:0 !important}
.cu-side .mainnav > input#myInput{display:block;width:100% !important;box-sizing:border-box;margin:0 0 10px !important;min-height:38px;padding:0 12px 0 34px;border:1px solid transparent;border-radius:var(--cu-radius-sm);background:var(--cu-side-2) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%238ea3bf' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M20 20l-3.5-3.5'/%3E%3C/svg%3E") no-repeat 11px center;color:var(--cu-side-strong);font:inherit;outline:0}
.cu-side .mainnav > input#myInput:focus{border-color:var(--cu-side-active)}
.cu-side .mainnav > input#myInput::placeholder{color:var(--cu-side-muted)}
.cu-side .mainnav > br{display:none}
.cu-side .mainnav ul{list-style:none;margin:0;padding:0;background:transparent !important;border:0 !important;box-shadow:none !important}
.cu-side .mainnav > ul > li{margin:1px 0;background:transparent !important;border:0 !important}
.cu-side .mainnav > ul > li > a{display:flex !important;align-items:center;gap:11px;min-height:40px;padding:0 12px !important;border-radius:var(--cu-radius-sm);color:var(--cu-side-text) !important;font-weight:500;font-size:14px;text-decoration:none !important;background:transparent !important;border:0 !important;text-shadow:none !important;position:relative}
.cu-side .mainnav > ul > li > a:hover{background:var(--cu-side-2) !important;color:var(--cu-side-strong) !important}
.cu-side .mainnav > ul > li > a [class*="icon"]{width:18px;font-size:16px !important;line-height:1 !important;color:var(--cu-side-muted) !important;margin:0 !important;text-align:center;flex:none}
.cu-side .mainnav > ul > li.highlight-menu > a,.cu-side .mainnav > ul > li > a.expand{background:var(--cu-side-2) !important;color:var(--cu-side-strong) !important;font-weight:600}
.cu-side .mainnav > ul > li.highlight-menu > a [class*="icon"]{color:var(--cu-side-strong) !important}
.cu-side .mainnav ul.sub{margin:2px 0 8px 21px !important;padding:2px 0 2px 10px !important;border-left:2px solid var(--cu-side-line) !important}
.cu-side .mainnav ul.sub li{background:transparent !important;border:0 !important}
.cu-side .mainnav ul.sub li a{display:flex !important;align-items:center;min-height:32px;padding:0 10px !important;border-radius:8px;color:var(--cu-side-text) !important;font-size:13px;text-decoration:none !important;background:transparent !important;border:0 !important;text-shadow:none !important}
.cu-side .mainnav ul.sub li a [class*="icon"]{display:none !important}
.cu-side .mainnav ul.sub li a:hover{color:var(--cu-side-strong) !important;background:var(--cu-side-2) !important}
.cu-side .mainnav ul.sub li a.cu-here{background:var(--cu-side-active) !important;color:var(--cu-side-active-text) !important;font-weight:600}
.cu-side .mainnav .hasSub > a:after,.cu-side .mainnav li > a > .arrow,.cu-side .mainnav .sideNavArrow{display:none !important}
.cu-side .mainnav > ul > li:has(> ul.sub) > a:after{content:"";margin-left:auto;width:7px;height:7px;border-right:2px solid var(--cu-side-muted);border-bottom:2px solid var(--cu-side-muted);transform:rotate(-45deg);transition:transform .15s;flex:none}
.cu-side .mainnav > ul > li.highlight-menu > a:after,.cu-side .mainnav > ul > li > a.expand:after{transform:rotate(45deg)}

/* the old theme styles the menu with #sidebar ids (white "active" box with arrow, 1px lines, fixed 38px rows):
   the same weight here turns all of that off */
#sidebar.cu-side .sidenav{float:none;width:auto}
#sidebar.cu-side .sidenav .mainnav ul li{float:none;width:auto;display:block;position:relative}
#sidebar.cu-side .sidenav .mainnav ul li a{float:none;width:auto;height:auto;min-height:40px;line-height:1.3;border:0 !important;box-shadow:none !important;color:var(--cu-side-text);box-sizing:border-box}
#sidebar.cu-side .sidenav .mainnav ul.sub li a{min-height:32px}
#sidebar.cu-side .sidenav .mainnav ul li a.active{background:var(--cu-side-active) !important;color:var(--cu-side-active-text) !important;font-weight:600}
#sidebar.cu-side .sidenav .mainnav ul li a.active [class*="icon"]{color:var(--cu-side-active-text) !important}
#sidebar.cu-side .sidenav .mainnav ul li a.active:before,#sidebar.cu-side .sidenav .mainnav ul li a.active:after{display:none !important}
#sidebar.cu-side .sidenav .mainnav ul li a .hasDrop{display:none}
#sidebar.cu-side .sidenav .mainnav ul.sub{float:none;width:auto;background:transparent !important;box-shadow:none !important;border-top:0 !important;border-right:0 !important;border-bottom:0 !important}

/* ---------------------------------------------------------------- legacy layout inside the new shell */
.cu-shell #content,.cu-shell .page-content{margin:0 !important;background:transparent !important;min-height:0 !important;border:0 !important;width:auto !important;float:none !important;position:static !important}
.cu-shell .contentwrapper{padding:0 !important;margin:0 !important;background:transparent !important}
/* one content edge for every page: the gutter comes only from .cu-main (not the old theme's #content padding); the
   top level row, its columns and blocks get no side margin/padding, columns side by side keep a 20px gap */
#content.cu-main{padding:24px 28px 32px !important}
.cu-shell .contentwrapper > .row,.cu-shell .contentwrapper > .row > .row{margin-left:0 !important;margin-right:0 !important}
.cu-shell .contentwrapper > .row > [class*="col-"],.cu-shell .contentwrapper > .row > .row > [class*="col-"]{padding-left:0;padding-right:0}
.cu-shell .contentwrapper > .row > :not([class*="col-"]):not(.modal),.cu-shell .contentwrapper > .row > .row > :not([class*="col-"]):not(.modal){margin-left:0;margin-right:0}
@media (min-width:768px){.cu-shell .contentwrapper > .row > [class*="col-sm-"]:not([class*="-12"]) + [class*="col-sm-"],.cu-shell .contentwrapper > .row > .row > [class*="col-sm-"]:not([class*="-12"]) + [class*="col-sm-"]{padding-left:20px}}
@media (min-width:992px){.cu-shell .contentwrapper > .row > [class*="col-md-"]:not([class*="-12"]) + [class*="col-md-"],.cu-shell .contentwrapper > .row > .row > [class*="col-md-"]:not([class*="-12"]) + [class*="col-md-"]{padding-left:20px}}
@media (min-width:1200px){.cu-shell .contentwrapper > .row > [class*="col-lg-"]:not([class*="-12"]) + [class*="col-lg-"],.cu-shell .contentwrapper > .row > .row > [class*="col-lg-"]:not([class*="-12"]) + [class*="col-lg-"]{padding-left:20px}}
/* module wrappers with their own side padding (class modules: .container-fluid, firewall: .fw-wrapper) */
.cu-shell .contentwrapper > .row > .container-fluid,.cu-shell .contentwrapper > .row > .container,.cu-shell .contentwrapper > .row > .fw-wrapper{padding-left:0 !important;padding-right:0 !important;width:auto}
.cu-shell .contentwrapper > .row > .container-fluid > .row,.cu-shell .contentwrapper > .row > .container > .row{margin-left:-15px;margin-right:-15px}
.cu-shell #sidebarbg{display:none !important}
.cu-shell .heading{display:none}
.cu-shell .alert{border-radius:var(--cu-radius-sm);border:1px solid var(--cu-line);background:var(--cu-card);color:var(--cu-text);box-shadow:var(--cu-shadow)}
.cu-shell .alert-info{background:var(--cu-accent-soft);border-color:transparent;color:var(--cu-text)}
.cu-shell .alert-success{background:var(--cu-ok-soft);border-color:transparent;color:var(--cu-text)}
.cu-shell .alert-warning{background:var(--cu-warn-soft);border-color:transparent;color:var(--cu-text)}
.cu-shell .alert-danger{background:var(--cu-bad-soft);border-color:transparent;color:var(--cu-text)}
.cu-shell .alert a{color:var(--cu-accent)}

/* Bootstrap pieces the old modules use: same tokens, so they follow the theme */
.cu-shell .form-horizontal.stripped .form-group:nth-child(even),.cu-shell .form-inline.stripped .form-group:nth-child(even),.cu-shell .form-horizontal.hover-stripped .form-group:hover,.cu-shell .form-inline.hover-stripped .form-group:hover{background:var(--cu-card-2) !important;background-image:none !important;filter:none !important;border-color:var(--cu-line) !important}
.cu-shell .form-horizontal .form-group{border-color:var(--cu-line) !important}
.cu-shell .panel,.cu-shell .box,.cu-shell .well{background:var(--cu-card) !important;border:1px solid var(--cu-line) !important;border-radius:var(--cu-radius) !important;box-shadow:var(--cu-shadow) !important;color:var(--cu-text)}
.cu-shell .panel-heading{background:transparent !important;border-bottom:1px solid var(--cu-line) !important;color:var(--cu-text) !important;border-radius:var(--cu-radius) var(--cu-radius) 0 0 !important;background-image:none !important}
.cu-shell .panel-heading h4,.cu-shell .panel-title{color:var(--cu-text) !important;font-weight:600 !important;font-size:15px !important}
.cu-shell .table{color:var(--cu-text);background:transparent}
.cu-shell .table > thead > tr > th{background:var(--cu-card-2) !important;color:var(--cu-muted) !important;font-weight:500;border-bottom:1px solid var(--cu-line) !important;background-image:none !important}
.cu-shell .table > tbody > tr > td,.cu-shell .table > thead > tr > th{border-color:var(--cu-line) !important}
.cu-shell .table-striped > tbody > tr:nth-of-type(odd){background:var(--cu-card-2)}
.cu-shell .table-hover > tbody > tr:hover{background:var(--cu-accent-soft)}
.cu-shell .form-control,.cu-shell select,.cu-shell textarea,.cu-shell input[type="text"],.cu-shell input[type="password"],.cu-shell input[type="email"],.cu-shell input[type="number"],.cu-shell input[type="search"]{border-radius:var(--cu-radius-sm);border:1px solid var(--cu-line-strong);background:var(--cu-card);color:var(--cu-text);box-shadow:none}
.cu-shell .form-control:focus{border-color:var(--cu-accent);box-shadow:0 0 0 3px var(--cu-accent-soft)}
/* every text field looks the same (modules set square corners, 2px radii, no border or 20px heights in their own CSS) */
.cu-shell .cu-main :is(input[type="text"],input[type="password"],input[type="email"],input[type="number"],input[type="search"],input[type="url"],input[type="tel"],input:not([type]),select,textarea):not(.select2-focusser):not(.select2-search__field):not(.select2-input):not([class*="xterm"]){border:1px solid var(--cu-line-strong) !important;border-radius:var(--cu-radius-sm) !important;background-color:var(--cu-card) !important;color:var(--cu-text) !important;box-shadow:none !important}
.cu-shell .cu-main :is(input[type="text"],input[type="password"],input[type="email"],input[type="number"],input[type="search"],input[type="url"],input[type="tel"],input:not([type]),select:not([multiple]):not([size])):not(.select2-focusser):not(.select2-search__field):not(.select2-input){min-height:34px}
.cu-shell .cu-main :is(input,select,textarea):focus{border-color:var(--cu-accent) !important;box-shadow:0 0 0 3px var(--cu-accent-soft) !important;outline:0}
.cu-shell .cu-main .input-group > :is(.form-control,input,select):not(:last-child){border-top-right-radius:0 !important;border-bottom-right-radius:0 !important}
.cu-shell .cu-main .input-group > :is(.form-control,input,select):not(:first-child){border-top-left-radius:0 !important;border-bottom-left-radius:0 !important}
.cu-shell .cu-main .input-group-addon,.cu-shell .cu-main .input-group-btn > .btn{background:var(--cu-card-2) !important;border:1px solid var(--cu-line-strong) !important;color:var(--cu-muted) !important}
.cu-shell .cu-main .input-group-addon:first-child,.cu-shell .cu-main .input-group-btn:first-child > .btn{border-radius:var(--cu-radius-sm) 0 0 var(--cu-radius-sm) !important;border-right:0 !important}
.cu-shell .cu-main .input-group-addon:last-child,.cu-shell .cu-main .input-group-btn:last-child > .btn{border-radius:0 var(--cu-radius-sm) var(--cu-radius-sm) 0 !important;border-left:0 !important}
.cu-shell .btn{border-radius:var(--cu-radius-sm);font-weight:500;background-image:none !important;text-shadow:none !important}
.cu-shell .btn-default{background:var(--cu-card);border-color:var(--cu-line-strong);color:var(--cu-text)}
.cu-shell .btn-primary,.cu-shell .btn-info{background:var(--cu-accent);border-color:var(--cu-accent);color:var(--cu-on-accent)}
.cu-shell .btn-primary:hover,.cu-shell .btn-info:hover{background:var(--cu-accent-hover);border-color:var(--cu-accent-hover)}
.cu-shell .btn-danger{background:var(--cu-bad);border-color:var(--cu-bad)}
.cu-shell .btn-success{background:var(--cu-ok);border-color:var(--cu-ok)}
.cu-shell .modal-content{background:var(--cu-card);color:var(--cu-text);border-radius:var(--cu-radius);border:1px solid var(--cu-line)}
.cu-shell .modal-header,.cu-shell .modal-footer{border-color:var(--cu-line)}
.cu-shell .nav-tabs{border-bottom-color:var(--cu-line)}
.cu-shell .nav-tabs > li.active > a{background:var(--cu-card);color:var(--cu-text);border-color:var(--cu-line) var(--cu-line) transparent}
.cu-shell .label-success{background:var(--cu-ok)} .cu-shell .label-danger{background:var(--cu-bad)} .cu-shell .label-warning{background:var(--cu-warn)}
html[data-theme="dark"] .cu-shell .table > tbody > tr > td,html[data-theme="dark"] .cu-shell .panel-body,html[data-theme="dark"] .cu-shell label{color:var(--cu-text)}
html[data-theme="dark"] .cu-shell .close{color:var(--cu-text);opacity:.6}
.cu-shell .control-label,.cu-shell .form-group > label,.cu-shell legend{color:var(--cu-text)}
.cu-shell .help-block,.cu-shell .text-muted{color:var(--cu-muted)}

/* DataTables (many modules): a card with themed search, page size, paging and buttons */
.cu-shell .dataTables_wrapper{background:var(--cu-card);border:1px solid var(--cu-line);border-radius:var(--cu-radius);box-shadow:var(--cu-shadow);padding:14px 16px;margin-bottom:20px;color:var(--cu-text);overflow-x:auto}
.cu-shell .cu-table-card .dataTables_wrapper,.cu-shell .cwp-card .dataTables_wrapper,.cu-shell .panel .dataTables_wrapper,.cu-shell .modal .dataTables_wrapper{background:none;border:0;box-shadow:none;padding:0;margin:0}
.cu-shell .dataTables_filter input,.cu-shell .dataTables_length select{min-height:36px;border:1px solid var(--cu-line-strong);border-radius:var(--cu-radius-sm);background:var(--cu-card);color:var(--cu-text);padding:0 10px;margin-left:6px}
.cu-shell .dataTables_info,.cu-shell .dataTables_length,.cu-shell .dataTables_filter{color:var(--cu-muted) !important;font-size:13px}
.cu-shell .dataTables_paginate .paginate_button{border-radius:8px !important;border:1px solid var(--cu-line) !important;background:var(--cu-card) !important;color:var(--cu-text) !important;margin-left:4px;padding:5px 11px !important}
.cu-shell .dataTables_paginate .paginate_button.current,.cu-shell .dataTables_paginate .paginate_button.current:hover{background:var(--cu-accent) !important;border-color:var(--cu-accent) !important;color:var(--cu-on-accent) !important}
.cu-shell .dataTables_paginate .paginate_button:hover{background:var(--cu-card-2) !important;color:var(--cu-text) !important}
.cu-shell table.dataTable{border-collapse:collapse !important;width:100% !important;color:var(--cu-text)}
.cu-shell table.dataTable thead th,.cu-shell table.dataTable thead td{background:var(--cu-card-2) !important;color:var(--cu-muted) !important;font-weight:500;border-bottom:1px solid var(--cu-line) !important;border-top:0 !important;padding:10px 12px !important}
.cu-shell table.dataTable tbody td{border-top:1px solid var(--cu-line) !important;padding:10px 12px !important;vertical-align:middle;background:transparent}
.cu-shell table.dataTable.table-bordered,.cu-shell table.dataTable.table-bordered td,.cu-shell table.dataTable.table-bordered th{border-left:0 !important;border-right:0 !important}
.cu-shell table.dataTable tbody tr:hover{background:var(--cu-accent-soft) !important}
.cu-shell .dt-buttons .btn,.cu-shell .dt-buttons .dt-button{border-radius:var(--cu-radius-sm) !important;background:var(--cu-card) !important;border:1px solid var(--cu-line-strong) !important;color:var(--cu-text) !important;background-image:none !important;min-height:34px;padding:0 12px !important}
.cu-shell .dt-buttons .btn-warning{background:var(--cu-warn-soft) !important;color:var(--cu-warn) !important;border-color:transparent !important}
.cu-table-card{padding:14px 16px;margin-bottom:20px;overflow-x:auto}
.cu-la-stats{display:grid;grid-template-columns:minmax(170px,240px) minmax(0,1fr);gap:16px;margin:0 0 16px}
.cu-la-stat{padding:16px 18px;display:flex;flex-direction:column;justify-content:center;gap:8px;min-width:0}
.cu-la-lbl{font-size:13px;color:var(--cu-muted);font-weight:500}
.cu-la-num{font-size:28px;font-weight:700;line-height:1.1;color:var(--cu-text)}
.cu-la-disk .progress{height:10px;border-radius:999px;background:var(--cu-track);box-shadow:none;margin:0}
.cu-la-disk .progress-bar{border-radius:999px}
.cu-la-disk-row{display:flex;justify-content:space-between;align-items:baseline;gap:12px;font-size:14px;color:var(--cu-text)}
.cu-la-disk-row span{font-weight:700;font-size:18px}
.cu-la-disk-sub{font-size:12.5px;color:var(--cu-muted)}
.cu-pk-stats{grid-template-columns:minmax(170px,240px)}
@media (max-width:640px){.cu-la-stats{grid-template-columns:1fr}}

/* the module design system (.cwp-mod) and the class-based modules read these */
html[data-theme] .cwp-mod{
  --cwp-surface:var(--cu-card); --cwp-surface-2:var(--cu-card-2); --cwp-ink:var(--cu-text); --cwp-muted:var(--cu-muted);
  --cwp-line:var(--cu-line); --cwp-line-strong:var(--cu-line-strong); --cwp-accent:var(--cu-accent); --cwp-accent-ink:var(--cu-accent-hover);
  --cwp-accent-soft:var(--cu-accent-soft); --cwp-ok:var(--cu-ok); --cwp-ok-soft:var(--cu-ok-soft); --cwp-warn:var(--cu-warn);
  --cwp-warn-soft:var(--cu-warn-soft); --cwp-bad:var(--cu-bad); --cwp-bad-soft:var(--cu-bad-soft);
  --cwp-shadow:var(--cu-shadow); --cwp-radius:var(--cu-radius); --cwp-mono:var(--cu-mono);
}
html[data-theme] .cwp-mod .cwp-head{border-top:1px solid var(--cu-line)}
html[data-theme]{
  --primary:var(--cu-accent); --primary-hover:var(--cu-accent-hover); --primary-light:var(--cu-accent-soft);
  --border:var(--cu-line); --border-hover:var(--cu-line-strong); --text-main:var(--cu-text); --text-color:var(--cu-text);
  --text-muted:var(--cu-muted); --danger:var(--cu-bad); --success:var(--cu-ok); --warning:var(--cu-warn);
  --bg:var(--cu-bg); --card:var(--cu-card);
}

/* ---------------------------------------------------------------- user panel (Inspinia layout, body.cu-user) */
.cu-user{background:var(--cu-bg) !important}
.cu-user .navbar-static-side,.cu-user .navbar-default.navbar-static-side,.cu-user nav.navbar-default{background:var(--cu-side) !important;border-right:1px solid var(--cu-side-line)}
.cu-user .nav-header{background:var(--cu-side) !important;background-image:none !important;padding:18px 16px 12px !important}
.cu-user .nav-header .cu-brand{padding:0;display:flex}
.cu-user .nav-header img#logomenu{max-width:100%;height:auto;border-radius:8px}
.cu-user .logo-element{background:var(--cu-brand) !important;color:#fff !important;border-radius:8px;margin:12px auto;width:40px;padding:10px 0 !important;font-size:12px !important;font-weight:700}
.cu-user #side-menu > li{margin:1px 10px;border-radius:var(--cu-radius-sm);border-left:0 !important;background:transparent !important}
.cu-user #side-menu > li > a{display:flex !important;align-items:center;gap:10px;min-height:40px;padding:0 12px !important;color:var(--cu-side-text) !important;font-weight:500;font-size:14px;border-radius:var(--cu-radius-sm)}
.cu-user #side-menu > li > a > .fa:first-child{width:18px;text-align:center;color:var(--cu-side-muted)}
.cu-user #side-menu > li > a .nav-label{flex:1}
.cu-user #side-menu > li > a:hover,.cu-user #side-menu > li > a:focus{background:var(--cu-side-2) !important;color:var(--cu-side-strong) !important}
.cu-user #side-menu > li.active{background:var(--cu-side-2) !important}
.cu-user #side-menu > li.active > a{color:var(--cu-side-strong) !important;font-weight:600}
.cu-user #side-menu > li.active > a > .fa:first-child{color:var(--cu-side-strong)}
.cu-user #side-menu > li:first-child.active{background:var(--cu-side-active) !important}
.cu-user #side-menu > li:first-child.active > a,.cu-user #side-menu > li:first-child.active > a > .fa{color:var(--cu-side-active-text) !important}
.cu-user #side-menu > li.nav-header{margin:0;border-radius:0}
.cu-user .nav-second-level{background:transparent !important;margin:2px 0 8px 22px !important;padding:2px 0 2px 10px !important;border-left:2px solid var(--cu-side-line)}
.cu-user .nav-second-level li a{padding:7px 10px !important;border-radius:8px;color:var(--cu-side-text) !important;font-size:13px}
.cu-user .nav-second-level li a:hover{color:var(--cu-side-strong) !important;background:var(--cu-side-2) !important}
.cu-user .nav-second-level li.active a{background:var(--cu-side-active) !important;color:var(--cu-side-active-text) !important;font-weight:600}
.cu-user .navbar-static-side .text-muted,.cu-user .navbar-static-side small,.cu-user .navbar-static-side h5,.cu-user .navbar-static-side h4{color:var(--cu-side-muted) !important}
.cu-user .navbar-static-side .progress{background:var(--cu-side-2)}
.cu-user #page-wrapper,.cu-user .gray-bg{background:var(--cu-bg) !important}
.cu-user .row.border-bottom{border-bottom:0 !important}
.cu-user .navbar-static-top{background:var(--cu-top) !important;border-bottom:1px solid var(--cu-line) !important;min-height:64px}
.cu-user .navbar-minimalize{background:var(--cu-card) !important;border:1px solid var(--cu-line) !important;color:var(--cu-text) !important;border-radius:var(--cu-radius-sm) !important;box-shadow:none !important}
.cu-user .navbar-form-custom{width:auto;max-width:340px}
.cu-user #top-search{background:var(--cu-bg) !important;border:1px solid var(--cu-line) !important;border-radius:var(--cu-radius-sm) !important;color:var(--cu-text);height:38px;margin:13px 0 0 10px;padding:0 12px;font-size:14px}
.cu-user .navbar-top-links li a,.cu-user .welcome-message{color:var(--cu-muted) !important}
.cu-user .navbar-top-links li a:hover{color:var(--cu-text) !important;background:transparent !important}
.cu-user .dropdown-menu{background:var(--cu-card);border:1px solid var(--cu-line);border-radius:var(--cu-radius-sm);box-shadow:var(--cu-shadow-lg);color:var(--cu-text)}
.cu-user .dropdown-menu > li > a{color:var(--cu-text);border-radius:8px;margin:2px 6px}
.cu-user .dropdown-menu > li > a:hover{background:var(--cu-card-2);color:var(--cu-text)}
.cu-user .dropdown-menu .divider{background:var(--cu-line)}
.cu-user-themes{padding:8px 14px 10px;display:flex;flex-direction:column;gap:8px}
.cu-user-themes-label{font-size:12px;color:var(--cu-muted);font-weight:600}
.cu-user .wrapper-content{padding:24px 28px 32px}
.cu-user .page-heading{background:var(--cu-card) !important;border-bottom:1px solid var(--cu-line) !important;color:var(--cu-text)}
.cu-user .ibox{background:transparent;border-radius:var(--cu-radius);box-shadow:var(--cu-shadow);margin-bottom:20px}
.cu-user .ibox-title{background:var(--cu-card) !important;border:1px solid var(--cu-line) !important;border-bottom:1px solid var(--cu-line) !important;border-radius:var(--cu-radius) var(--cu-radius) 0 0;color:var(--cu-text);min-height:52px;padding:15px 18px 8px}
.cu-user .ibox-title h5{color:var(--cu-text);font-weight:600;font-size:15px}
.cu-user .ibox-content{background:var(--cu-card) !important;border:1px solid var(--cu-line) !important;border-top:0 !important;border-radius:0 0 var(--cu-radius) var(--cu-radius);color:var(--cu-text)}
.cu-user .ibox.collapsed .ibox-title{border-radius:var(--cu-radius)}
.cu-user .ibox-tools a{color:var(--cu-muted)}
.cu-user .widget{border-radius:var(--cu-radius) !important;box-shadow:var(--cu-shadow)}
.cu-user .white-bg,.cu-user .bg-white,.cu-user .panel,.cu-user .well{background:var(--cu-card) !important;color:var(--cu-text)}
.cu-user .panel,.cu-user .well{border:1px solid var(--cu-line) !important;border-radius:var(--cu-radius) !important}
.cu-user .footer{background:var(--cu-card) !important;border-top:1px solid var(--cu-line) !important;color:var(--cu-muted)}
.cu-user .btn{border-radius:var(--cu-radius-sm);font-weight:500;box-shadow:none}
.cu-user .btn-primary,.cu-user .btn-info{background:var(--cu-accent) !important;border-color:var(--cu-accent) !important;color:var(--cu-on-accent) !important}
.cu-user .btn-primary:hover,.cu-user .btn-info:hover,.cu-user .btn-primary:focus{background:var(--cu-accent-hover) !important;border-color:var(--cu-accent-hover) !important}
.cu-user .btn-white,.cu-user .btn-default{background:var(--cu-card) !important;border-color:var(--cu-line-strong) !important;color:var(--cu-text) !important}
.cu-user .btn-danger{background:var(--cu-bad) !important;border-color:var(--cu-bad) !important}
.cu-user .btn-success{background:var(--cu-accent) !important;border-color:var(--cu-accent) !important;color:var(--cu-on-accent) !important}
.cu-user .btn-success:hover,.cu-user .btn-success:focus{background:var(--cu-accent-hover) !important;border-color:var(--cu-accent-hover) !important}
.cu-user .label-primary,.cu-user .badge-primary,.cu-user .navy-bg,.cu-user .progress-bar{background:var(--cu-accent) !important;color:var(--cu-on-accent)}
.cu-user .text-navy{color:var(--cu-accent) !important}
.cu-user .breadcrumb{background:transparent !important}
.cu-user .breadcrumb > li,.cu-user .breadcrumb > .active{color:var(--cu-muted)}
.cu-user .lazur-bg,.cu-user .bg-info,.cu-user .blue-bg{background:var(--cu-accent) !important;color:var(--cu-on-accent) !important}
.cu-user .yellow-bg{background:var(--cu-warn) !important;color:#fff !important}
.cu-user .red-bg{background:var(--cu-bad) !important;color:#fff !important}
.cu-user .page-heading h2,.cu-user .page-heading h1{color:var(--cu-text)}
.cu-user .label-warning{background:var(--cu-warn) !important}
.cu-user .label-success{background:var(--cu-ok) !important}
.cu-user .label-danger{background:var(--cu-bad) !important}
.cu-user .form-control,.cu-user .input-group-addon{border-radius:var(--cu-radius-sm);border:1px solid var(--cu-line-strong);background:var(--cu-card);color:var(--cu-text)}
.cu-user .form-control:focus{border-color:var(--cu-accent) !important;box-shadow:0 0 0 3px var(--cu-accent-soft)}
.cu-user .table{color:var(--cu-text)}
.cu-user .table > thead > tr > th{background:var(--cu-card-2);color:var(--cu-muted);font-weight:500;border-color:var(--cu-line) !important}
.cu-user .table > tbody > tr > td{border-color:var(--cu-line) !important}
.cu-user .table-striped > tbody > tr:nth-of-type(odd){background:var(--cu-card-2)}
.cu-user .modal-content{background:var(--cu-card);color:var(--cu-text);border-radius:var(--cu-radius);border:1px solid var(--cu-line)}
.cu-user .modal-header,.cu-user .modal-footer{border-color:var(--cu-line)}
.cu-user a{color:var(--cu-accent)}
.cu-user .navbar-static-side a{color:var(--cu-side-text)}
.cu-user .dashboard-item,.cu-user .cwp-acc-info{border-color:var(--cu-line) !important}
html[data-theme="dark"] .cu-user h1,html[data-theme="dark"] .cu-user h2,html[data-theme="dark"] .cu-user h3,html[data-theme="dark"] .cu-user h4,html[data-theme="dark"] .cu-user h5,html[data-theme="dark"] .cu-user label{color:var(--cu-text)}
html[data-theme="dark"] .cu-user .text-muted{color:var(--cu-muted) !important}
@media (max-width:768px){.cu-user .wrapper-content{padding:16px}}

/* ---------------------------------------------------------------- login pages (admin and user panel) */
.cu-login{display:flex;flex-wrap:wrap;min-height:100vh;margin:0;background:var(--cu-bg);color:var(--cu-text)}
.cu-login-hero{flex:1 1 440px;box-sizing:border-box;background:var(--cu-hero);color:#fff;padding:48px 56px;display:flex;flex-direction:column;justify-content:space-between;gap:40px}
.cu-login-hero .cu-brand{padding:0;color:#fff}
.cu-login-hero .cu-brand-host{color:#9fb3cc}
.cu-login-claim{max-width:460px;display:flex;flex-direction:column;gap:14px}
.cu-login-claim h1{margin:0;font-size:40px;line-height:1.15;font-weight:700;letter-spacing:-.8px;color:#fff}
.cu-login-claim p{margin:0;font-size:16px;line-height:1.6;color:#c9d6e8}
.cu-login-links{display:flex;flex-wrap:wrap;gap:16px;margin:0;font-size:13px;color:#9fb3cc}
.cu-login-links a{color:#c9d6e8}
.cu-login-main{flex:1 1 440px;display:flex;align-items:center;justify-content:center;padding:40px 20px;box-sizing:border-box}
.cu-login-card{width:100%;max-width:400px;box-sizing:border-box;background:var(--cu-card);border:1px solid var(--cu-line);border-radius:var(--cu-radius);box-shadow:var(--cu-shadow-lg);padding:32px;display:flex;flex-direction:column;gap:16px}
.cu-login-card h2{margin:0;font-size:22px;font-weight:700;color:var(--cu-text)}
.cu-login-sub{margin:4px 0 0;color:var(--cu-muted)}
.cu-login-card label{display:flex;flex-direction:column;gap:6px;font-weight:500;color:var(--cu-text)}
.cu-login-card input[type=text],.cu-login-card input[type=password],.cu-login-card input[type=email],.cu-login-card select{min-height:44px;padding:0 14px;border:1px solid var(--cu-line-strong);border-radius:var(--cu-radius-sm);background:var(--cu-card);color:var(--cu-text);font:inherit;box-sizing:border-box;width:100%}
.cu-login-card input:focus,.cu-login-card select:focus{outline:0;border-color:var(--cu-accent);box-shadow:0 0 0 3px var(--cu-accent-soft)}
.cu-login-card .cu-login-check{flex-direction:row;align-items:center;gap:8px;font-weight:400;color:var(--cu-muted)}
.cu-login-check input{width:18px;height:18px;margin:0}
.cu-login-submit{min-height:46px;font-size:15px;font-weight:600}
.cu-login-msg{padding:10px 14px;border-radius:var(--cu-radius-sm);background:var(--cu-accent-soft);color:var(--cu-text);font-size:13px}
.cu-login-msg.bad{background:var(--cu-bad-soft)}
@media (max-width:720px){.cu-login-hero{padding:28px 24px;gap:20px}.cu-login-claim h1{font-size:28px}.cu-login-links{display:none}}

/* ---------------------------------------------------------------- user panel login (Twig login.html, body.cu-ulogin) */
.cu-ulogin{background:var(--cu-bg) !important;color:var(--cu-text);font-family:var(--cu-font) !important}
.cu-ulogin .loginColumns{max-width:980px;margin:7vh auto 40px;padding:0 20px}
.cu-ulogin #login > .row:first-child{display:flex;flex-wrap:wrap;margin:0;background:var(--cu-card);border:1px solid var(--cu-line);border-radius:var(--cu-radius);box-shadow:var(--cu-shadow-lg);overflow:hidden}
.cu-ulogin #login > .row:first-child > .col-md-6{flex:1 1 380px;float:none;width:auto;padding:40px}
.cu-ulogin #login > .row:first-child > .col-md-6:first-child{background:var(--cu-hero);color:#c9d6e8;display:flex;flex-direction:column;gap:18px}
.cu-ulogin #login > .row:first-child > .col-md-6:first-child > .col-md-12{margin:0 !important;padding:0;text-align:left !important;float:none;width:auto}
.cu-ulogin #login > .row:first-child > .col-md-6:first-child p{margin:0 !important;font-size:15px;line-height:1.6;color:#c9d6e8}
.cu-ulogin #login > .row:first-child > .col-md-6:first-child p:first-of-type{font-size:22px;line-height:1.3;font-weight:700;color:#fff}
.cu-ulogin #login > .row:first-child > .col-md-6:first-child img{max-width:100%;height:auto}
.cu-ulogin .cu-ulogin-brand{padding:0;color:#fff}
.cu-ulogin .ibox-content{background:transparent !important;border:0 !important;padding:0 !important;color:var(--cu-text)}
.cu-ulogin .form-control,.cu-ulogin select.form-control{min-height:44px;border-radius:var(--cu-radius-sm);border:1px solid var(--cu-line-strong);background:var(--cu-card);color:var(--cu-text);box-shadow:none;font-size:14px}
.cu-ulogin .form-control:focus{border-color:var(--cu-accent);box-shadow:0 0 0 3px var(--cu-accent-soft)}
.cu-ulogin .form-group{margin-bottom:14px}
.cu-ulogin #btnsubmit,.cu-ulogin #btn-f2acode,.cu-ulogin #btnsendcode{min-height:46px;border-radius:var(--cu-radius-sm);background:var(--cu-brand) !important;border-color:var(--cu-brand) !important;color:#fff !important;font-weight:600;font-size:15px}
.cu-ulogin #btnsubmit:hover,.cu-ulogin #btn-f2acode:hover,.cu-ulogin #btnsendcode:hover{background:var(--cu-brand-hover) !important}
.cu-ulogin .btn-white{border-radius:var(--cu-radius-sm);border:1px solid var(--cu-line-strong);background:var(--cu-card);color:var(--cu-text);min-height:38px;line-height:24px}
.cu-ulogin #login > hr{border-color:var(--cu-line);margin:20px 0 12px}
.cu-ulogin #login > .row:last-child{color:var(--cu-muted);font-size:13px}
.cu-ulogin .logged-message-wrapper,.cu-ulogin .middle-box{max-width:520px}
.cu-ulogin .logged-message,.cu-ulogin #lost-pass .ibox-content{background:var(--cu-card) !important;border:1px solid var(--cu-line) !important;border-radius:var(--cu-radius);box-shadow:var(--cu-shadow-lg);padding:32px !important}
.cu-ulogin .logged-message{flex-direction:column;margin:0}
.cu-ulogin .logged-message > .col-md-6{width:100%;border:0 !important;float:none}
.cu-ulogin .logged-message-alert{color:var(--cu-text)}
.cu-ulogin #lost-pass > .text-center{display:flex;justify-content:center;margin-bottom:18px}
.cu-ulogin #lost-pass .cu-ulogin-brand{color:var(--cu-text)}
.cu-ulogin #lost-pass .cu-brand-host{color:var(--cu-muted)}
.cu-ulogin .text-success{color:var(--cu-ok) !important}
@media (max-width:720px){.cu-ulogin #login > .row:first-child > .col-md-6{padding:26px}}

/* ---------------------------------------------------------------- phones and small windows */
@media (max-width:991px){
  .cu-shell{padding-left:0}
  .cu-shell .cu-side,.cu-shell #sidebar.cu-side{transform:translateX(-100%);transition:transform .2s;box-shadow:var(--cu-shadow-lg)}
  .cu-shell.cu-menu-open .cu-side{transform:none}
  .cu-menu-btn{display:inline-flex}
  .cu-top,.cu-main,.cu-foot{padding-left:16px;padding-right:16px}
  #content.cu-main{padding:16px 16px 24px !important}
  .cu-scrim{display:none}
  .cu-shell.cu-menu-open .cu-scrim{display:block;position:fixed;inset:0;background:rgba(11,29,51,.45);z-index:25}
}
@media (prefers-reduced-motion:reduce){*{transition:none !important;animation:none !important}}
/* panel notifications (gritter): below the header bar, under its menus, scroll when there are many */
#gritter-notice-wrapper:not(.bottom-right):not(.bottom-left){top:84px}
#gritter-notice-wrapper{z-index:15;max-height:calc(100vh - 104px);overflow-y:auto;overscroll-behavior:contain}
/* CWPpro notice bar (admin panel, without CWPpro) */
.cu-pro-bar{display:flex;align-items:center;flex-wrap:wrap;gap:10px 14px;margin:0 0 20px;padding:10px 12px 10px 16px;background:var(--cu-card);border:1px solid var(--cu-line);border-left:4px solid var(--cu-brand);border-radius:var(--cu-radius-sm);color:var(--cu-text);font-size:13.5px}
.cu-pro-bar > span{flex:1 1 320px;min-width:0}
.cu-pro-bar > .cu-ico{color:var(--cu-brand);flex:none}
.cu-pro-x{border:0;background:none;color:var(--cu-muted);font-size:20px;line-height:1;padding:2px 6px;cursor:pointer;border-radius:6px}
.cu-pro-x:hover{background:var(--cu-card-2);color:var(--cu-text)}
.cu-btn.cu-btn-sm{min-height:30px;padding:0 12px;font-size:12.5px}
/* user panel header bar: one row like the admin header (the Inspinia markup and its JS hooks stay) */
.cu-user .navbar-static-top{display:flex !important;align-items:center;flex-wrap:wrap;gap:10px;padding:10px 28px !important;margin:0 !important}
.cu-user .navbar-static-top::before,.cu-user .navbar-static-top::after{display:none !important}
.cu-user .navbar-static-top .navbar-header{display:flex;align-items:center;gap:12px;float:none;margin:0}
.cu-user .navbar-minimalize{display:inline-flex !important;align-items:center;justify-content:center;width:40px;height:40px;margin:0 !important;padding:0 !important;font-size:15px}
.cu-user .navbar-form-custom{float:none;height:auto;margin:0;padding:0}
.cu-user .navbar-form-custom .form-group{margin:0}
.cu-user #top-search{margin:0 !important;width:300px;max-width:42vw;padding:0 12px !important;font-size:14px}
.cu-user .navbar-top-links{display:flex;align-items:center;flex-wrap:wrap;gap:4px;margin:0 0 0 auto !important;padding:0;float:none}
.cu-user .navbar-top-links > li{float:none;display:flex;align-items:center;margin:0}
.cu-user .navbar-top-links > li > a,.cu-user .navbar-top-links .welcome-message{display:inline-flex !important;align-items:center;gap:7px;min-height:40px;padding:0 10px !important;border-radius:var(--cu-radius-sm);font-size:14px;font-weight:500;color:var(--cu-text) !important;margin:0 !important}
.cu-user .navbar-top-links > li > a:hover,.cu-user .navbar-top-links .welcome-message:hover{background:var(--cu-card-2) !important}
.cu-user .navbar-top-links .welcome-message{border:1px solid var(--cu-line)}
.cu-user .navbar-top-links .fa-2x{font-size:18px}
.cu-user .navbar-top-links img[src*="/img/"]{margin:0 !important;border-radius:3px}
.cu-user .navbar-top-links .label{display:inline-flex;align-items:center;min-height:26px;padding:0 10px;border-radius:999px;font-size:12px;font-weight:600;float:none !important}
.cu-user #imglock.label-warning{background:var(--cu-warn-soft,#fff4e0) !important;color:var(--cu-warn,#9a5b00) !important}
.cu-user #imglock.label-success{background:var(--cu-ok-soft,#e6f6ec) !important;color:var(--cu-ok,#137a3a) !important}
.cu-user .navbar-top-links > li:last-child > a{border:1px solid var(--cu-line);margin-left:6px !important}
.cu-user .navbar-top-links .dropdown-menu{right:0;left:auto;margin-top:6px}
@media (max-width:768px){.cu-user .navbar-static-top{padding:10px 16px !important}.cu-user #top-search{width:160px}}
/* user panel: one palette. Inspinia used green/teal/orange for normal actions and boxes; actions are the accent color,
   green/orange/red only mean ok/warning/error */
.cu-user #wrapper{background:var(--cu-side) !important}
.cu-user #page-wrapper{min-height:100vh}
.cu-user .btn-warning{background:var(--cu-warn) !important;border-color:var(--cu-warn) !important;color:#fff !important}
.cu-user .btn-xs,.cu-user .btn-sm{border-radius:8px}
.cu-user .lazur-bg,.cu-user .navy-bg,.cu-user .blue-bg,.cu-user .bg-primary,.cu-user .bg-info,.cu-user .panel-primary > .panel-heading,.cu-user .panel-info > .panel-heading,.cu-user .panel-success > .panel-heading{background:var(--cu-accent-soft) !important;color:var(--cu-accent) !important;border-color:var(--cu-line) !important}
.cu-user .panel-primary,.cu-user .panel-info,.cu-user .panel-success{border-color:var(--cu-line) !important}
.cu-user .yellow-bg,.cu-user .panel-warning > .panel-heading{background:var(--cu-warn-soft) !important;color:var(--cu-warn) !important}
.cu-user .red-bg,.cu-user .panel-danger > .panel-heading{background:var(--cu-bad-soft) !important;color:var(--cu-bad) !important}
.cu-user .label-success,.cu-user .badge-success{background:var(--cu-ok-soft) !important;color:var(--cu-ok) !important}
.cu-user .label-warning,.cu-user .badge-warning{background:var(--cu-warn-soft) !important;color:var(--cu-warn) !important}
.cu-user .label-danger,.cu-user .badge-danger{background:var(--cu-bad-soft) !important;color:var(--cu-bad) !important}
.cu-user .label-info,.cu-user .badge-info,.cu-user .label-primary,.cu-user .badge-primary{background:var(--cu-accent-soft) !important;color:var(--cu-accent) !important}
.cu-user .label{border-radius:999px;font-weight:600;padding:3px 9px}
.cu-user .alert-info{background:var(--cu-accent-soft) !important;color:var(--cu-text) !important;border:1px solid var(--cu-line) !important;border-left:4px solid var(--cu-accent) !important}
.cu-user .alert-warning{background:var(--cu-warn-soft) !important;color:var(--cu-text) !important;border:1px solid var(--cu-line) !important;border-left:4px solid var(--cu-warn) !important}
.cu-user .alert-success{background:var(--cu-ok-soft) !important;color:var(--cu-text) !important;border:1px solid var(--cu-line) !important;border-left:4px solid var(--cu-ok) !important}
.cu-user .alert-danger{background:var(--cu-bad-soft) !important;color:var(--cu-text) !important;border:1px solid var(--cu-line) !important;border-left:4px solid var(--cu-bad) !important}
.cu-user .alert{border-radius:var(--cu-radius-sm)}
/* empty lists ("No ... created"): quiet text instead of a big colored heading */
.cu-user .empty_list{height:auto;min-height:7rem;padding:24px 12px}
.cu-user .empty_list h1,.cu-user .empty_list h2,.cu-user .empty_list h3,.cu-user .empty_list h4{font-size:15px !important;font-weight:500 !important;color:var(--cu-muted) !important;margin:0}
/* quota box of the list pages ("Email 0 / 10"): was pushed up into the page heading */
.cu-user .mail-contracted{position:static !important;display:inline-block;vertical-align:top;width:300px !important;max-width:100%;margin:0 12px 16px 0;box-shadow:none !important}
.cu-user .mail-contracted .ibox-content{border:1px solid var(--cu-line) !important;border-radius:var(--cu-radius) !important;padding:14px 18px !important}
.cu-user .mail-contracted h2{font-size:20px !important;font-weight:700}
/* on/off switches (onoffswitch) */
.cu-user .onoffswitch-inner:before{background:var(--cu-accent) !important;color:var(--cu-on-accent) !important}
.cu-user .onoffswitch-label{border-color:var(--cu-line-strong) !important}
/* side info boxes built as Bootstrap jumbotrons (Directory protection, Statistics): plain text in the card */
.cu-user .ibox-content .jumbotron{background:transparent !important;padding:0 !important;margin:0 !important;border-radius:0;color:var(--cu-text)}
.cu-user .ibox-content .jumbotron h1,.cu-user .ibox-content .jumbotron h2,.cu-user .ibox-content .jumbotron h3{font-size:17px !important;font-weight:600;margin:0 0 10px;color:var(--cu-text)}
.cu-user .ibox-content .jumbotron p{font-size:13.5px;line-height:1.6;color:var(--cu-muted);margin:0 0 8px}
/* Site.pro and similar "not configured" notices */
.cu-user .siteprobuilder_container > h3{max-width:640px;margin:24px auto;padding:16px 18px;background:var(--cu-warn-soft);border:1px solid var(--cu-line);border-left:4px solid var(--cu-warn);border-radius:var(--cu-radius-sm);font-size:14px;font-weight:500;line-height:1.6;color:var(--cu-text)}
.cu-user #side-menu > li{width:auto !important}
.cu-user .siteprobuilder_container{background:transparent !important;padding:0 !important}
/* the same fields in the user panel */
.cu-user #page-wrapper .wrapper-content :is(input[type="text"],input[type="password"],input[type="email"],input[type="number"],input[type="search"],input[type="url"],input[type="tel"],input:not([type]),select,textarea):not(.select2-focusser):not(.select2-search__field):not(.select2-input):not([class*="xterm"]){border:1px solid var(--cu-line-strong) !important;border-radius:var(--cu-radius-sm) !important;background-color:var(--cu-card) !important;color:var(--cu-text) !important;box-shadow:none !important}
.cu-user #page-wrapper .wrapper-content :is(input[type="text"],input[type="password"],input[type="email"],input[type="number"],input[type="search"],input[type="url"],input[type="tel"],input:not([type]),select:not([multiple]):not([size])):not(.select2-focusser):not(.select2-search__field):not(.select2-input){min-height:34px}
.cu-user #page-wrapper .wrapper-content :is(input,select,textarea):focus{border-color:var(--cu-accent) !important;box-shadow:0 0 0 3px var(--cu-accent-soft) !important;outline:0}
.cu-user #page-wrapper .wrapper-content .input-group > :is(.form-control,input,select):not(:last-child){border-top-right-radius:0 !important;border-bottom-right-radius:0 !important}
.cu-user #page-wrapper .wrapper-content .input-group > :is(.form-control,input,select):not(:first-child){border-top-left-radius:0 !important;border-bottom-left-radius:0 !important}
.cu-user #page-wrapper .wrapper-content .input-group-addon,.cu-user #page-wrapper .wrapper-content .input-group-btn > .btn{background:var(--cu-card-2) !important;border:1px solid var(--cu-line-strong) !important;color:var(--cu-muted) !important}
.cu-user #page-wrapper .wrapper-content .input-group-addon:first-child,.cu-user #page-wrapper .wrapper-content .input-group-btn:first-child > .btn{border-radius:var(--cu-radius-sm) 0 0 var(--cu-radius-sm) !important;border-right:0 !important}
.cu-user #page-wrapper .wrapper-content .input-group-addon:last-child,.cu-user #page-wrapper .wrapper-content .input-group-btn:last-child > .btn{border-radius:0 var(--cu-radius-sm) var(--cu-radius-sm) 0 !important;border-left:0 !important}
/* fields in modal windows (often outside the page content element) */
:is(.cu-shell,.cu-user) .modal :is(input[type="text"],input[type="password"],input[type="email"],input[type="number"],input[type="search"],input[type="url"],input:not([type]),select,textarea):not(.select2-focusser):not(.select2-search__field):not(.select2-input){border:1px solid var(--cu-line-strong) !important;border-radius:var(--cu-radius-sm) !important;background-color:var(--cu-card) !important;color:var(--cu-text) !important;box-shadow:none !important}
:is(.cu-shell,.cu-user) .modal :is(input,select,textarea):focus{border-color:var(--cu-accent) !important;box-shadow:0 0 0 3px var(--cu-accent-soft) !important;outline:0}
:is(.cu-shell,.cu-user) .modal .input-group > :is(.form-control,input,select):not(:last-child){border-top-right-radius:0 !important;border-bottom-right-radius:0 !important}
:is(.cu-shell,.cu-user) .modal .input-group > :is(.form-control,input,select):not(:first-child){border-top-left-radius:0 !important;border-bottom-left-radius:0 !important}
/* Email AutoResponders: the add/edit card only when a form in it is open */
.cu-ar-forms{padding:16px}
.cu-ar-forms:not(:has(> div:not([style*="display: none"]):not([style*="display:none"]))){display:none}
/* New Account: the voice guide player */
.cu-shell .cu-main audio{display:block;width:100%;max-width:420px;height:36px;margin:6px 0 12px}
.cu-acts{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.cu-acts .cu-btn .fa{font-size:12px}
.cu-btn.cu-btn-danger{color:var(--cu-bad) !important;border-color:var(--cu-line)}
.cu-btn.cu-btn-danger:hover{background:var(--cu-bad-soft);border-color:var(--cu-bad)}
/* DNS zone list */
.cu-zone-row > td{padding:6px 12px 6px 0;border-bottom:1px solid var(--cu-line);vertical-align:middle}
.cu-zone-name a{font-weight:500}
/* admin: main action buttons in the accent color (green only for status labels), like the user panel */
.cu-shell .btn-success{background:var(--cu-accent) !important;border-color:var(--cu-accent) !important;color:var(--cu-on-accent) !important}
.cu-shell .btn-success:hover,.cu-shell .btn-success:focus{background:var(--cu-accent-hover) !important;border-color:var(--cu-accent-hover) !important}
/* older modules print a bare <h3> title at the top: give it the look of the module title card */
.cu-shell .contentwrapper > .row > h3:first-of-type,.cu-shell .contentwrapper > .row > .cu-pro-bar + h3{display:block;margin:0 0 16px;padding:18px 22px;background:var(--cu-card);border:1px solid var(--cu-line);border-radius:var(--cu-radius);box-shadow:var(--cu-shadow);font-size:19px;font-weight:700;line-height:1.3;color:var(--cu-text)}
.cu-shell .contentwrapper > .row > h3:first-of-type small{font-size:13px;font-weight:500;color:var(--cu-muted)}
.cu-user .bg-warning{background:var(--cu-warn-soft) !important;color:var(--cu-text) !important}
.cu-user .bg-danger{background:var(--cu-bad-soft) !important;color:var(--cu-text) !important}
.cu-user .bg-success{background:var(--cu-ok-soft) !important;color:var(--cu-text) !important}
.cu-user .bg-info .title-info,.cu-user .bg-warning .title-info{color:var(--cu-text) !important}
/* "module not available" boxes (MongoDB, PostgreSQL, Git, ...) */
.cu-user .not-available-mongodb{text-align:center;padding:48px 24px !important}
.cu-user .not-available-mongodb h3,.cu-user .not-available-mongodb h4,.cu-user .not-available-mongodb h5{font-size:17px !important;font-weight:600;color:var(--cu-text);margin:0 0 8px}
.cu-user .not-available-mongodb p{color:var(--cu-muted);margin:0}
/* admin login, two-factor step */
.cu-login-card input.cu-login-code{font-family:"JetBrains Mono",monospace;font-size:22px;letter-spacing:.3em;text-align:center}
.cu-login-back{align-self:center;font-size:13.5px;font-weight:500}

/* ---------------------------------------------------------------- one look for every admin module (2026-11-04)
   Modules bring their own CSS (square or 2px corners, 22-36px heights, full grid borders). These rules win over them,
   so a table, button, field or search box looks the same on every page. Measured on all admin modules (style audit). */
/* controls: one height; buttons next to fields line up */
.cu-shell .cu-main :is(.btn,.cwp-btn):not(.btn-xs):not(.btn-sm):not(.btn-lg):not(.cwp-btn-sm):not(.close):not(.btn-link){min-height:38px;padding-top:0 !important;padding-bottom:0 !important;display:inline-flex;align-items:center;justify-content:center;gap:6px;line-height:1.2;vertical-align:middle}
.cu-shell .cu-main :is(.btn-sm,.cwp-btn-sm){min-height:32px;padding-top:0 !important;padding-bottom:0 !important;display:inline-flex;align-items:center;justify-content:center;gap:5px;line-height:1.2;border-radius:8px !important}
.cu-shell .cu-main .btn-xs{min-height:26px;padding:0 9px !important;display:inline-flex;align-items:center;justify-content:center;gap:4px;line-height:1.2;border-radius:8px !important;font-size:12px}
.cu-shell .cu-main :is(.btn,.cwp-btn).btn-block{display:flex;width:100%}
.cu-shell .cu-main :is(.btn,.cwp-btn):not(.btn-group > *):not(.input-group-btn > *):not(.btn-xs):not(.btn-sm){border-radius:var(--cu-radius-sm) !important}
/* small ghost buttons inside table rows (startup services, redirects...) */
.cu-shell .cu-main td :is(.cwp-btn,.btn):not(.btn-xs){min-height:30px}
/* button groups: only the outer corners round */
.cu-shell .cu-main .btn-group > .btn{border-radius:0 !important}
.cu-shell .cu-main .btn-group > .btn:first-child{border-top-left-radius:8px !important;border-bottom-left-radius:8px !important}
.cu-shell .cu-main .btn-group > .btn:last-child,.cu-shell .cu-main .btn-group > .dropdown-toggle{border-top-right-radius:8px !important;border-bottom-right-radius:8px !important}
.cu-shell .cu-main .btn-group > .btn:only-child{border-radius:8px !important}
/* fields, selects, search: 38px */
.cu-shell .cu-main :is(input[type="text"],input[type="password"],input[type="email"],input[type="number"],input[type="search"],input[type="url"],input[type="tel"],input:not([type]),select:not([multiple]):not([size]),.form-control:not(textarea):not(select[multiple])):not(.select2-focusser):not(.select2-search__field):not(.select2-input){min-height:38px;height:38px;border-radius:var(--cu-radius-sm) !important}
.cu-shell .cu-main .dataTables_filter input,.cu-shell .cu-main .dataTables_length select{min-height:38px;height:38px}
.cu-shell .cu-main .input-group > :is(.form-control,input,select):not(:last-child){border-top-right-radius:0 !important;border-bottom-right-radius:0 !important}
.cu-shell .cu-main .input-group > :is(.form-control,input,select):not(:first-child){border-top-left-radius:0 !important;border-bottom-left-radius:0 !important}
.cu-shell .cu-main .input-group-btn > .btn,.cu-shell .cu-main .input-group-addon{min-height:38px;height:38px}
.cu-shell .cu-main .input-group-btn:last-child > .btn{border-top-left-radius:0 !important;border-bottom-left-radius:0 !important;border-top-right-radius:var(--cu-radius-sm) !important;border-bottom-right-radius:var(--cu-radius-sm) !important}
.cu-shell .cu-main .input-group-btn:first-child > .btn{border-top-right-radius:0 !important;border-bottom-right-radius:0 !important;border-top-left-radius:var(--cu-radius-sm) !important;border-bottom-left-radius:var(--cu-radius-sm) !important}
/* tables: row lines only (no grid), the same head everywhere */
.cu-shell .cu-main table.table-bordered,.cu-shell .cu-main table.table-bordered > * > tr > *{border-left:0 !important;border-right:0 !important}
.cu-shell .cu-main table.table-bordered{border-top:0 !important;border-bottom:0 !important}
.cu-shell .cu-main :is(table.table,table.cwp-table,table.dataTable) > thead > tr > th{background:var(--cu-card-2) !important;color:var(--cu-muted) !important;font-weight:600;font-size:12.5px;border-top:0 !important;border-bottom:1px solid var(--cu-line) !important;padding:10px 12px !important;vertical-align:middle}
.cu-shell .cu-main :is(table.table,table.cwp-table,table.dataTable) > tbody > tr > td{border-top:1px solid var(--cu-line) !important;padding:9px 12px !important;vertical-align:middle}
.cu-shell .cu-main :is(table.table,table.cwp-table) > tbody > tr:first-child > td{border-top:0 !important}
/* a table that is not inside a card gets the card frame (rounded, one border); inside a card it stays flat */
.cu-shell .cu-main :is(.table-responsive,.cwp-table-scroll):not(:is(.cwp-card,.panel,.box,.well,.ibox,.modal,.cu-card,.dataTables_wrapper,.cu-table-card) *){background:var(--cu-card);border:1px solid var(--cu-line) !important;border-radius:8px;box-shadow:var(--cu-shadow);overflow:auto;margin-bottom:16px}
.cu-shell .cu-main :is(.table-responsive,.cwp-table-scroll) > table{margin-bottom:0 !important}
.cu-shell .cu-main :is(.cwp-card,.panel,.box,.well,.ibox) :is(.table-responsive,.cwp-table-scroll){border:0 !important;border-radius:0;box-shadow:none}
/* a bare table straight in the page (no wrapper, no card): the same frame */
.cu-shell .cu-main table:is(.table,.cwp-table):not(:is(.cwp-card,.panel,.box,.well,.ibox,.modal,.cu-card,.dataTables_wrapper,.table-responsive,.cwp-table-scroll,.cu-table-card,td) *){border-collapse:separate !important;border-spacing:0;background:var(--cu-card);border:1px solid var(--cu-line) !important;border-radius:8px;overflow:hidden;box-shadow:var(--cu-shadow)}
/* cards of every kind: same corners */
.cu-shell .cu-main :is(.ibox,.card,.x_panel,.portlet){background:var(--cu-card);border:1px solid var(--cu-line) !important;border-radius:var(--cu-radius) !important;box-shadow:var(--cu-shadow)}
/* close (x) buttons of alerts and modals */
.cu-shell .cu-main .close,.cu-shell .modal .close{opacity:.55;font-size:22px;line-height:1;text-shadow:none;width:30px;height:30px;border-radius:8px}
.cu-shell .cu-main .close:hover,.cu-shell .modal .close:hover{opacity:.9;background:var(--cu-card-2)}
/* pagination outside DataTables */
.cu-shell .cu-main .pagination > li > :is(a,span){border-color:var(--cu-line) !important;color:var(--cu-text);margin:0 2px;border-radius:8px !important}
.cu-shell .cu-main .pagination > .active > :is(a,span){background:var(--cu-accent) !important;border-color:var(--cu-accent) !important;color:var(--cu-on-accent) !important}
/* input groups (icon + field, field + button): one joined control */
.cu-shell .cu-main .input-group{display:flex !important;align-items:stretch;width:100%;border-collapse:separate}
.cu-shell .cu-main .input-group > :is(.form-control,input,select){flex:1 1 auto;width:1% !important;min-width:0;float:none;margin:0 !important}
.cu-shell .cu-main .input-group > :is(.input-group-addon,.input-group-btn){display:flex;align-items:stretch;width:auto;margin:0 !important;float:none}
.cu-shell .cu-main .input-group > .input-group-addon{align-items:center;padding:0 12px;height:auto;min-height:38px}
.cu-shell .cu-main .input-group > .input-group-btn > .btn{margin:0 !important;height:auto}
/* button groups in table rows wrap in narrow columns: separate small buttons instead of a broken joined bar */
.cu-shell .cu-main td .btn-group{display:inline-flex;flex-wrap:wrap;gap:4px}
.cu-shell .cu-main td .btn-group > .btn{border-radius:8px !important;margin:0 !important;float:none}
/* a module card (ibox) inside a card: no second frame */
.cu-shell .cu-main :is(.cwp-card,.panel,.cu-card,.box) .ibox{border:0 !important;box-shadow:none !important;border-radius:0 !important;background:transparent !important}
/* the inner corners of a joined input group stay square (wins over the field rule above: :not(#_) adds weight) */
.cu-shell .cu-main .input-group > :is(.form-control,input,select):not(:last-child):not(#_){border-top-right-radius:0 !important;border-bottom-right-radius:0 !important}
.cu-shell .cu-main .input-group > :is(.form-control,input,select):not(:first-child):not(#_){border-top-left-radius:0 !important;border-bottom-left-radius:0 !important}
.cu-shell .cu-main .input-group > .input-group-addon:not(:first-child):not(#_),.cu-shell .cu-main .input-group > .input-group-btn:not(:first-child):not(#_) > .btn{border-top-left-radius:0 !important;border-bottom-left-radius:0 !important}
.cu-shell .cu-main .input-group > .input-group-addon:not(:last-child):not(#_),.cu-shell .cu-main .input-group > .input-group-btn:not(:last-child):not(#_) > .btn{border-top-right-radius:0 !important;border-bottom-right-radius:0 !important}
/* rows and cells take the theme background (some modules paint them white: unreadable in the dark theme) */
.cu-shell .cu-main :is(table.table,table.cwp-table,table.dataTable) > tbody > tr,.cu-shell .cu-main :is(table.table,table.cwp-table,table.dataTable) > tbody > tr > td{background-color:transparent !important;color:var(--cu-text)}
.cu-shell .cu-main :is(table.table-striped,table.dataTable.stripe) > tbody > tr:nth-of-type(odd) > td{background-color:var(--cu-card-2) !important}
.cu-shell .cu-main :is(table.table,table.cwp-table,table.dataTable) > tbody > tr:hover > td{background-color:var(--cu-accent-soft) !important}
html[data-theme="dark"] .cu-shell .cu-main td :is(i.fa,i.glyphicon,.fa,.icomoon,[class^="icon"]):not(:is(.btn,.label,.badge) *){color:var(--cu-muted)}
/* tabs: one style in every module - an underlined bar (Bootstrap nav-tabs and the "navbar-nav tab" bars) */
.cu-shell .cu-main .nav-tabs:not(#myTab6),.cu-shell .cu-main ul.navbar-nav.tab{display:flex;flex-wrap:wrap;gap:2px;float:none;margin:0 0 14px;padding:0 4px;border:0;border-bottom:1px solid var(--cu-line) !important;background:transparent;list-style:none}
.cu-shell .cu-main .nav-tabs:not(#myTab6) > li,.cu-shell .cu-main ul.navbar-nav.tab > li{float:none;margin:0 0 -1px}
.cu-shell .cu-main .nav-tabs:not(#myTab6) > li > a,.cu-shell .cu-main ul.navbar-nav.tab > li > a{display:flex;align-items:center;gap:6px;padding:11px 14px !important;margin:0 !important;border:0 !important;border-bottom:2px solid transparent !important;border-radius:0 !important;background:transparent !important;color:var(--cu-muted) !important;font-weight:600;font-size:13.5px;line-height:1.3}
.cu-shell .cu-main .nav-tabs:not(#myTab6) > li > a:hover,.cu-shell .cu-main ul.navbar-nav.tab > li > a:hover{color:var(--cu-text) !important;background:transparent !important}
.cu-shell .cu-main .nav-tabs:not(#myTab6) > li.active > a,.cu-shell .cu-main .nav-tabs:not(#myTab6) > li.active > a:hover,.cu-shell .cu-main .nav-tabs:not(#myTab6) > li.active > a:focus,.cu-shell .cu-main ul.navbar-nav.tab > li.active > a,.cu-shell .cu-main ul.navbar-nav.tab > li > a.active{color:var(--cu-accent) !important;border-bottom-color:var(--cu-accent) !important;background:transparent !important}
.cu-shell .cu-main ul.navbar-nav.tab > li > a h4,.cu-shell .cu-main ul.navbar-nav.tab > li > a .txt{margin:0;font-size:inherit;font-weight:inherit;color:inherit;background:transparent !important;border:0 !important;padding:0 !important}
.cu-shell .cu-main .tab-content{border:0 !important;background:transparent}
.cu-shell .cu-main ul.navbar-nav.tab > li:not(:has(a)){display:none}
.cu-shell .cu-main ul.navbar-nav.tab{justify-content:flex-start;width:100%}

/* ---------------------------------------------------------------- one look for every user panel module (2026-11-04)
   The same rules as the admin block above, for the module content of the user panel (index.html wraps it in .cu-umain). */
/* controls: one height; buttons next to fields line up */
.cu-user .cu-umain :is(.btn,.cwp-btn):not(.btn-xs):not(.btn-sm):not(.btn-lg):not(.cwp-btn-sm):not(.close):not(.btn-link){min-height:38px;padding-top:0 !important;padding-bottom:0 !important;display:inline-flex;align-items:center;justify-content:center;gap:6px;line-height:1.2;vertical-align:middle}
.cu-user .cu-umain :is(.btn-sm,.cwp-btn-sm){min-height:32px;padding-top:0 !important;padding-bottom:0 !important;display:inline-flex;align-items:center;justify-content:center;gap:5px;line-height:1.2;border-radius:8px !important}
.cu-user .cu-umain .btn-xs{min-height:26px;padding:0 9px !important;display:inline-flex;align-items:center;justify-content:center;gap:4px;line-height:1.2;border-radius:8px !important;font-size:12px}
.cu-user .cu-umain :is(.btn,.cwp-btn).btn-block{display:flex;width:100%}
.cu-user .cu-umain :is(.btn,.cwp-btn):not(.btn-group > *):not(.input-group-btn > *):not(.btn-xs):not(.btn-sm){border-radius:var(--cu-radius-sm) !important}
/* small ghost buttons inside table rows (startup services, redirects...) */
.cu-user .cu-umain td :is(.cwp-btn,.btn):not(.btn-xs){min-height:30px}
/* button groups: only the outer corners round */
.cu-user .cu-umain .btn-group > .btn{border-radius:0 !important}
.cu-user .cu-umain .btn-group > .btn:first-child{border-top-left-radius:8px !important;border-bottom-left-radius:8px !important}
.cu-user .cu-umain .btn-group > .btn:last-child,.cu-user .cu-umain .btn-group > .dropdown-toggle{border-top-right-radius:8px !important;border-bottom-right-radius:8px !important}
.cu-user .cu-umain .btn-group > .btn:only-child{border-radius:8px !important}
/* fields, selects, search: 38px */
.cu-user .cu-umain :is(input[type="text"],input[type="password"],input[type="email"],input[type="number"],input[type="search"],input[type="url"],input[type="tel"],input:not([type]),select:not([multiple]):not([size]),.form-control:not(textarea):not(select[multiple])):not(.select2-focusser):not(.select2-search__field):not(.select2-input){min-height:38px;height:38px;border-radius:var(--cu-radius-sm) !important}
.cu-user .cu-umain .dataTables_filter input,.cu-user .cu-umain .dataTables_length select{min-height:38px;height:38px}
.cu-user .cu-umain .input-group > :is(.form-control,input,select):not(:last-child){border-top-right-radius:0 !important;border-bottom-right-radius:0 !important}
.cu-user .cu-umain .input-group > :is(.form-control,input,select):not(:first-child){border-top-left-radius:0 !important;border-bottom-left-radius:0 !important}
.cu-user .cu-umain .input-group-btn > .btn,.cu-user .cu-umain .input-group-addon{min-height:38px;height:38px}
.cu-user .cu-umain .input-group-btn:last-child > .btn{border-top-left-radius:0 !important;border-bottom-left-radius:0 !important;border-top-right-radius:var(--cu-radius-sm) !important;border-bottom-right-radius:var(--cu-radius-sm) !important}
.cu-user .cu-umain .input-group-btn:first-child > .btn{border-top-right-radius:0 !important;border-bottom-right-radius:0 !important;border-top-left-radius:var(--cu-radius-sm) !important;border-bottom-left-radius:var(--cu-radius-sm) !important}
/* tables: row lines only (no grid), the same head everywhere */
.cu-user .cu-umain table.table-bordered,.cu-user .cu-umain table.table-bordered > * > tr > *{border-left:0 !important;border-right:0 !important}
.cu-user .cu-umain table.table-bordered{border-top:0 !important;border-bottom:0 !important}
.cu-user .cu-umain :is(table.table,table.cwp-table,table.dataTable) > thead > tr > th{background:var(--cu-card-2) !important;color:var(--cu-muted) !important;font-weight:600;font-size:12.5px;border-top:0 !important;border-bottom:1px solid var(--cu-line) !important;padding:10px 12px !important;vertical-align:middle}
.cu-user .cu-umain :is(table.table,table.cwp-table,table.dataTable) > tbody > tr > td{border-top:1px solid var(--cu-line) !important;padding:9px 12px !important;vertical-align:middle}
.cu-user .cu-umain :is(table.table,table.cwp-table) > tbody > tr:first-child > td{border-top:0 !important}
/* a table that is not inside a card gets the card frame (rounded, one border); inside a card it stays flat */
.cu-user .cu-umain :is(.table-responsive,.cwp-table-scroll):not(:is(.cwp-card,.panel,.box,.well,.ibox,.modal,.cu-card,.dataTables_wrapper,.cu-table-card) *){background:var(--cu-card);border:1px solid var(--cu-line) !important;border-radius:8px;box-shadow:var(--cu-shadow);overflow:auto;margin-bottom:16px}
.cu-user .cu-umain :is(.table-responsive,.cwp-table-scroll) > table{margin-bottom:0 !important}
.cu-user .cu-umain :is(.cwp-card,.panel,.box,.well,.ibox) :is(.table-responsive,.cwp-table-scroll){border:0 !important;border-radius:0;box-shadow:none}
/* a bare table straight in the page (no wrapper, no card): the same frame */
.cu-user .cu-umain table:is(.table,.cwp-table):not(:is(.cwp-card,.panel,.box,.well,.ibox,.modal,.cu-card,.dataTables_wrapper,.table-responsive,.cwp-table-scroll,.cu-table-card,td) *){border-collapse:separate !important;border-spacing:0;background:var(--cu-card);border:1px solid var(--cu-line) !important;border-radius:8px;overflow:hidden;box-shadow:var(--cu-shadow)}
/* cards of every kind: same corners */
.cu-user .cu-umain :is(.ibox,.card,.x_panel,.portlet){background:var(--cu-card);border:1px solid var(--cu-line) !important;border-radius:var(--cu-radius) !important;box-shadow:var(--cu-shadow)}
/* close (x) buttons of alerts and modals */
.cu-user .cu-umain .close,.cu-user .modal .close{opacity:.55;font-size:22px;line-height:1;text-shadow:none;width:30px;height:30px;border-radius:8px}
.cu-user .cu-umain .close:hover,.cu-user .modal .close:hover{opacity:.9;background:var(--cu-card-2)}
/* pagination outside DataTables */
.cu-user .cu-umain .pagination > li > :is(a,span){border-color:var(--cu-line) !important;color:var(--cu-text);margin:0 2px;border-radius:8px !important}
.cu-user .cu-umain .pagination > .active > :is(a,span){background:var(--cu-accent) !important;border-color:var(--cu-accent) !important;color:var(--cu-on-accent) !important}
/* input groups (icon + field, field + button): one joined control */
.cu-user .cu-umain .input-group{display:flex !important;align-items:stretch;width:100%;border-collapse:separate}
.cu-user .cu-umain .input-group > :is(.form-control,input,select){flex:1 1 auto;width:1% !important;min-width:0;float:none;margin:0 !important}
.cu-user .cu-umain .input-group > :is(.input-group-addon,.input-group-btn){display:flex;align-items:stretch;width:auto;margin:0 !important;float:none}
.cu-user .cu-umain .input-group > .input-group-addon{align-items:center;padding:0 12px;height:auto;min-height:38px}
.cu-user .cu-umain .input-group > .input-group-btn > .btn{margin:0 !important;height:auto}
/* button groups in table rows wrap in narrow columns: separate small buttons instead of a broken joined bar */
.cu-user .cu-umain td .btn-group{display:inline-flex;flex-wrap:wrap;gap:4px}
.cu-user .cu-umain td .btn-group > .btn{border-radius:8px !important;margin:0 !important;float:none}
/* a module card (ibox) inside a card: no second frame */
.cu-user .cu-umain :is(.cwp-card,.panel,.cu-card,.box) .ibox{border:0 !important;box-shadow:none !important;border-radius:0 !important;background:transparent !important}
/* the inner corners of a joined input group stay square (wins over the field rule above: :not(#_) adds weight) */
.cu-user .cu-umain .input-group > :is(.form-control,input,select):not(:last-child):not(#_){border-top-right-radius:0 !important;border-bottom-right-radius:0 !important}
.cu-user .cu-umain .input-group > :is(.form-control,input,select):not(:first-child):not(#_){border-top-left-radius:0 !important;border-bottom-left-radius:0 !important}
.cu-user .cu-umain .input-group > .input-group-addon:not(:first-child):not(#_),.cu-user .cu-umain .input-group > .input-group-btn:not(:first-child):not(#_) > .btn{border-top-left-radius:0 !important;border-bottom-left-radius:0 !important}
.cu-user .cu-umain .input-group > .input-group-addon:not(:last-child):not(#_),.cu-user .cu-umain .input-group > .input-group-btn:not(:last-child):not(#_) > .btn{border-top-right-radius:0 !important;border-bottom-right-radius:0 !important}
/* rows and cells take the theme background (some modules paint them white: unreadable in the dark theme) */
.cu-user .cu-umain :is(table.table,table.cwp-table,table.dataTable) > tbody > tr,.cu-user .cu-umain :is(table.table,table.cwp-table,table.dataTable) > tbody > tr > td{background-color:transparent !important;color:var(--cu-text)}
.cu-user .cu-umain :is(table.table-striped,table.dataTable.stripe) > tbody > tr:nth-of-type(odd) > td{background-color:var(--cu-card-2) !important}
.cu-user .cu-umain :is(table.table,table.cwp-table,table.dataTable) > tbody > tr:hover > td{background-color:var(--cu-accent-soft) !important}
html[data-theme="dark"] .cu-user .cu-umain td :is(i.fa,i.glyphicon,.fa,.icomoon,[class^="icon"]):not(:is(.btn,.label,.badge) *){color:var(--cu-muted)}
/* tabs: one style in every module - an underlined bar (Bootstrap nav-tabs and the "navbar-nav tab" bars) */
.cu-user .cu-umain .nav-tabs:not(#myTab6),.cu-user .cu-umain ul.navbar-nav.tab{display:flex;flex-wrap:wrap;gap:2px;float:none;margin:0 0 14px;padding:0 4px;border:0;border-bottom:1px solid var(--cu-line) !important;background:transparent;list-style:none}
.cu-user .cu-umain .nav-tabs:not(#myTab6) > li,.cu-user .cu-umain ul.navbar-nav.tab > li{float:none;margin:0 0 -1px}
.cu-user .cu-umain .nav-tabs:not(#myTab6) > li > a,.cu-user .cu-umain ul.navbar-nav.tab > li > a{display:flex;align-items:center;gap:6px;padding:11px 14px !important;margin:0 !important;border:0 !important;border-bottom:2px solid transparent !important;border-radius:0 !important;background:transparent !important;color:var(--cu-muted) !important;font-weight:600;font-size:13.5px;line-height:1.3}
.cu-user .cu-umain .nav-tabs:not(#myTab6) > li > a:hover,.cu-user .cu-umain ul.navbar-nav.tab > li > a:hover{color:var(--cu-text) !important;background:transparent !important}
.cu-user .cu-umain .nav-tabs:not(#myTab6) > li.active > a,.cu-user .cu-umain .nav-tabs:not(#myTab6) > li.active > a:hover,.cu-user .cu-umain .nav-tabs:not(#myTab6) > li.active > a:focus,.cu-user .cu-umain ul.navbar-nav.tab > li.active > a,.cu-user .cu-umain ul.navbar-nav.tab > li > a.active{color:var(--cu-accent) !important;border-bottom-color:var(--cu-accent) !important;background:transparent !important}
.cu-user .cu-umain ul.navbar-nav.tab > li > a h4,.cu-user .cu-umain ul.navbar-nav.tab > li > a .txt{margin:0;font-size:inherit;font-weight:inherit;color:inherit;background:transparent !important;border:0 !important;padding:0 !important}
.cu-user .cu-umain .tab-content{border:0 !important;background:transparent}
.cu-user .cu-umain ul.navbar-nav.tab > li:not(:has(a)){display:none}
.cu-user .cu-umain ul.navbar-nav.tab{justify-content:flex-start;width:100%}

/* an all-caps language string shown as a title ("INSTALLED" -> "Installed") */
.cwp-tc{display:inline-block;text-transform:lowercase}.cwp-tc::first-letter{text-transform:uppercase}
/* Antivirus: "Start scan" and its settings button form one joined control */
.cu-user .cu-umain #_run_scan_btn:not(#_){border-top-right-radius:0 !important;border-bottom-right-radius:0 !important}
.cu-user .cu-umain .btn-config-clam:not(#_){border-top-left-radius:0 !important;border-bottom-left-radius:0 !important}
/* module buttons of the newer pages (cj-btn) at the common height; small buttons in table rows stay readable */
.cu-user .cu-umain .cj-btn:not(.cj-btn-s):not(.cj-btn-xs):not(td *){min-height:38px}
.cu-user .cu-umain td .btn-sm{font-size:12.5px !important}
/* tab bodies (Inspinia .tabs-container .panel-body is white) and pagination buttons take the theme colors */
.cu-user .cu-umain .tabs-container :is(.panel-body,.tab-pane){background:var(--cu-card) !important;border-color:var(--cu-line) !important;color:var(--cu-text)}
.cu-user .cu-umain .pagination > li:not(.active) > :is(a,span),.cu-shell .cu-main .pagination > li:not(.active) > :is(a,span){background:var(--cu-card) !important}
.cu-user .cu-umain .pagination > li.disabled > :is(a,span),.cu-shell .cu-main .pagination > li.disabled > :is(a,span){color:var(--cu-muted) !important;opacity:.6}
/* legacy module colors that ignore the theme (unreadable in dark): MySQL Manager user rows, Email Importer choice tiles */
.cu-user .cu-umain .db_list_users .db_list_user_item:nth-child(2n){background:var(--cu-card-2) !important;border-radius:8px}
.cu-user .cu-umain .importer-step1-option:not(:hover){background-color:var(--cu-card) !important;border-color:var(--cu-line) !important;color:var(--cu-text)}