/* ============================================================
   PapilioHost — custom WHMCS client theme design system
   Dark, frost/ice. Loaded LAST so it wins over base CSS.
   ============================================================ */
/* self-hosted fonts (matches papiliohost.com) — variable, latin subset */
@font-face{font-family:'Inter';font-style:normal;font-weight:100 900;font-display:swap;src:url(../fonts/inter.woff2) format('woff2')}
@font-face{font-family:'Space Grotesk';font-style:normal;font-weight:300 700;font-display:swap;src:url(../fonts/spacegrotesk.woff2) format('woff2')}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:100 800;font-display:swap;src:url(../fonts/jetbrainsmono.woff2) format('woff2')}
:root{
  --sans:'Space Grotesk','Inter','Segoe UI',Tahoma,system-ui,sans-serif;
  --body:'Inter','Segoe UI',Tahoma,system-ui,-apple-system,sans-serif;
  --mono:'JetBrains Mono',ui-monospace,'Courier New',monospace;
  /* frost/ice dark — matched to papiliohost.com marketing site */
  --bg:#05080f; --surface:#0b1422; --surface-2:#111d30; --surface-3:#17263d;
  --border:rgba(125,211,252,.15); --border-soft:rgba(125,211,252,.08);
  --text:#e9f4ff; --text-2:#8fa3ba; --text-3:#586d85;
  --brand:#38bdf8; --brand-2:#0ea5e9; --brand-glow:rgba(56,189,248,.20);
  --accent:#38bdf8; --accent-ink:#03141d;
  --green:#34d399; --green-bg:rgba(52,211,153,.14);
  --red:#fb7185;   --red-bg:rgba(251,113,133,.14);
  --amber:#fbbf24; --amber-bg:rgba(251,191,36,.14);
  --blue:#38bdf8;  --blue-bg:rgba(56,189,248,.14);
  --violet:#8aa0ff;--violet-bg:rgba(138,160,255,.14);
  --r:15px; --r-sm:11px; --r-xs:8px;
  --shadow:0 1px 2px rgba(0,0,0,.5); --shadow-lg:0 20px 46px -22px rgba(0,0,0,.85);
  --side-w:248px;
}
*{box-sizing:border-box}
body.primary-bg-color,body{background:var(--bg) !important;color:var(--text);font-family:var(--body);font-size:14px;line-height:1.55;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
a{color:var(--text);text-decoration:none}
a:hover{color:#fff;text-decoration:none}
h1,h2,h3,h4,h5,h6,.h1,.h2,.h3,.h4,.h5{color:var(--text);font-weight:700;font-family:var(--sans);letter-spacing:-.01em}
hr{border-color:var(--border)}
::selection{background:rgba(56,189,248,.28);color:#eaf8ff}
/* hide base theme chrome we replace */
#header,#footer,.master-breadcrumb,.topbar{display:none !important}

/* ---------- APP LAYOUT ---------- */
.pl-app{display:flex;min-height:100vh;position:relative}
/* site-signature ambient: faint aurora + grid behind the whole panel */
.pl-app::before{content:"";position:fixed;inset:0;z-index:0;pointer-events:none;
  background:radial-gradient(38% 34% at 16% 10%,rgba(56,189,248,.10),transparent 70%),
            radial-gradient(36% 40% at 88% 24%,rgba(138,160,255,.07),transparent 72%),
            radial-gradient(44% 38% at 62% 98%,rgba(14,165,233,.06),transparent 70%)}
.pl-app::after{content:"";position:fixed;inset:0;z-index:0;pointer-events:none;
  background-image:linear-gradient(rgba(125,211,252,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(125,211,252,.05) 1px,transparent 1px);
  background-size:62px 62px;
  -webkit-mask-image:radial-gradient(ellipse 72% 55% at 50% 12%,#000 2%,transparent 78%);
  mask-image:radial-gradient(ellipse 72% 55% at 50% 12%,#000 2%,transparent 78%)}
.pl-side,.pl-main{position:relative;z-index:1}
.pl-side{width:var(--side-w);flex-shrink:0;background:var(--surface);border-right:1px solid var(--border);display:flex;flex-direction:column;padding:16px 12px;position:sticky;top:0;height:100vh;overflow-y:auto}
.pl-main{flex:1;min-width:0;display:flex;flex-direction:column}
.pl-top{height:60px;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:14px;padding:0 32px;position:sticky;top:0;background:rgba(5,8,15,.82);backdrop-filter:blur(10px);z-index:20}
.pl-content{padding:26px 32px;width:100%;max-width:none}
/* ============ AUTH: two-pane brand login (fully custom) ============ */
.pl-authwrap{display:flex;min-height:100vh;position:relative;overflow:hidden;
  background:radial-gradient(900px 620px at 10% 6%,rgba(56,189,248,.12),transparent 58%),
             radial-gradient(760px 720px at 88% 96%,rgba(14,165,233,.12),transparent 58%),
             radial-gradient(600px 600px at 60% 40%,rgba(99,102,241,.08),transparent 60%),
             linear-gradient(155deg,#060b16 0%,#05080f 55%,#04070d 100%)}
/* --- left brand panel --- */
/* left brand pane: FIXED to the viewport so it is continuous no matter how long the page is (register etc.) */
.pl-authwrap{--heroW:min(46vw,600px)}
.pl-hero{position:fixed;top:0;left:0;bottom:0;width:var(--heroW);display:flex;align-items:center;justify-content:center;overflow:hidden;border-right:1px solid rgba(255,255,255,.05);z-index:2}
.pl-authwrap{padding-left:var(--heroW)}
[dir=rtl] .pl-authwrap{padding-left:0;padding-right:var(--heroW)}
[dir=rtl] .pl-hero{left:auto;right:0}
.pl-hero::after{content:"";position:absolute;inset:0;pointer-events:none;opacity:.5;
  background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);
  background-size:46px 46px;-webkit-mask-image:radial-gradient(circle at 32% 42%,#000,transparent 74%);mask-image:radial-gradient(circle at 32% 42%,#000,transparent 74%)}
.pl-orb{position:absolute;border-radius:50%;filter:blur(64px);opacity:.5;pointer-events:none;will-change:transform}
.pl-orb.o1{width:360px;height:360px;background:radial-gradient(circle,#38bdf8,transparent 70%);top:-70px;left:-50px;animation:plDrift1 22s ease-in-out infinite alternate}
.pl-orb.o2{width:300px;height:300px;background:radial-gradient(circle,#0ea5e9,transparent 70%);bottom:-60px;left:24%;animation:plDrift2 27s ease-in-out infinite alternate}
.pl-orb.o3{width:280px;height:280px;background:radial-gradient(circle,#6366f1,transparent 70%);top:30%;right:-40px;animation:plDrift3 24s ease-in-out infinite alternate}
.pl-fly{position:absolute;z-index:2;pointer-events:none;opacity:.18;filter:drop-shadow(0 6px 14px rgba(56,189,248,.5));will-change:transform}
.pl-fly.f1{width:30px;top:16%;right:15%;animation:plFly1 18s ease-in-out infinite}
.pl-fly.f2{width:22px;bottom:19%;left:13%;opacity:.13;animation:plFly2 22s ease-in-out infinite}
.pl-hero-in{position:relative;z-index:3;max-width:410px;padding:0 8%;text-align:center}
.pl-hero-mark{width:76px;height:76px;border-radius:20px;display:grid;place-items:center;margin:0 auto 26px;
  background:linear-gradient(160deg,rgba(56,189,248,.22),rgba(14,165,233,.06));
  border:1px solid rgba(56,189,248,.30);
  box-shadow:0 22px 54px -18px rgba(56,189,248,.55),inset 0 1px 0 rgba(255,255,255,.16);
  animation:plFloat 6s ease-in-out infinite}
.pl-hero-mark img{width:44px;height:44px;filter:drop-shadow(0 4px 10px rgba(56,189,248,.5))}
.pl-hero-brand{font-family:var(--sans);font-size:31px;font-weight:700;letter-spacing:-.02em;color:#fff;line-height:1}
.pl-hero-tag{color:#9fb4c9;font-size:15px;margin:12px 0 28px;line-height:1.75}
.pl-hero-feats{list-style:none;padding:0;margin:0 auto;display:inline-flex;flex-direction:column;gap:15px;text-align:left}
.pl-hero-feats li{display:flex;align-items:center;gap:13px;color:#d0dbe8;font-size:13.5px;font-weight:500}
[dir=rtl] .pl-hero-feats{text-align:right}
.pl-hero-feats .ic{width:36px;height:36px;border-radius:11px;background:rgba(56,189,248,.11);border:1px solid rgba(56,189,248,.22);display:grid;place-items:center;flex-shrink:0}
.pl-hero-feats .ic svg{width:17px;height:17px;color:var(--brand)}
.pl-hero-stats{display:flex;justify-content:center;gap:34px;margin-top:30px;padding-top:26px;border-top:1px solid rgba(255,255,255,.09)}
.pl-hero-stats>div{display:flex;flex-direction:column;align-items:center;text-align:center}
.pl-hero-stats b{font-family:var(--sans);font-size:25px;font-weight:800;letter-spacing:-.02em;line-height:1;background:linear-gradient(120deg,#eaf6ff 10%,#7dd3fc 90%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
.pl-hero-stats span{font-size:11px;color:#7e93a8;margin-top:6px;text-transform:uppercase;letter-spacing:.06em;font-weight:600}
.pl-hero-status{display:inline-flex;align-items:center;gap:8px;margin-top:26px;font-size:12px;font-weight:600;color:#8fe3c6;
  padding:7px 13px;border-radius:20px;background:rgba(52,211,153,.1);border:1px solid rgba(52,211,153,.28)}
.pl-hero-status .dot{width:7px;height:7px;border-radius:50%;background:#34d399;box-shadow:0 0 9px #34d399;animation:plPulseDot 2s ease-in-out infinite}
@keyframes plPulseDot{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.45;transform:scale(.78)}}
/* --- right form panel --- */
.pl-authpane{flex:1 1 48%;min-width:0;display:flex;align-items:center;justify-content:center;padding:44px 26px;position:relative;z-index:3;
  background:linear-gradient(180deg,rgba(5,8,15,.35),rgba(5,8,15,.72));backdrop-filter:blur(3px)}
.pl-authpane .login-form,.pl-authpane form,.pl-authpane .pl-content{width:100%;max-width:406px}
.pl-authpane .card{position:relative;overflow:hidden;background:rgba(12,20,34,.58) !important;backdrop-filter:blur(20px) saturate(1.25);
  border:1px solid var(--border) !important;border-radius:18px !important;
  box-shadow:0 40px 100px -46px rgba(0,0,0,.95),0 1px 0 rgba(255,255,255,.05) inset !important;overflow:hidden;
  animation:plRise .5s cubic-bezier(.22,.61,.36,1) both}
@keyframes plRise{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
.pl-authpane .card::before{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent,var(--brand) 45%,var(--brand-2) 55%,transparent);opacity:.85;z-index:2}
.pl-authpane .card-body{padding:36px 32px !important}
.pl-authpane .card .h3,.pl-authpane .card h3{font-size:21px;font-weight:800;color:#fff;text-align:center}
.pl-authpane .card-body>.mb-4:not(.form-group){text-align:center;margin-bottom:26px !important}
.pl-authpane .card-body>.mb-4:not(.form-group) .text-muted{color:var(--text-3)}
.pl-authpane .card-footer{text-align:center;background:rgba(255,255,255,.02) !important;padding:16px !important}
/* merged auth fields: ONE clean rectangle per field (icon + input + reveal btn inside) */
.pl-authpane .input-group{background:rgba(255,255,255,.045);border:1px solid var(--border);border-radius:var(--r-sm);overflow:hidden;align-items:stretch;transition:border-color .15s,box-shadow .15s}
.pl-authpane .input-group:focus-within{border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-glow)}
.pl-authpane .input-group-text{background:transparent !important;border:0 !important;border-radius:0 !important;color:var(--text-3);padding:0 4px 0 14px}
.pl-authpane .input-group .form-control{background:transparent !important;border:0 !important;border-radius:0 !important;box-shadow:none !important;height:46px;padding:0 12px}
.pl-authpane .input-group .form-control:focus{background:transparent !important;border:0 !important;box-shadow:none !important;outline:none !important}
.pl-authpane .input-group input:focus-visible{outline:none !important}
.pl-authpane .input-group .btn-reveal-pw{border:0 !important;border-left:1px solid var(--border-soft) !important;border-radius:0 !important;background:transparent !important;padding:0 15px}
.pl-authpane .input-group .btn-reveal-pw:hover{background:rgba(255,255,255,.06) !important}
.pl-authpane .form-control{background:rgba(255,255,255,.04) !important}
[dir=rtl] .pl-authpane .input-group-text{padding:0 14px 0 4px}
[dir=rtl] .pl-authpane .input-group .btn-reveal-pw{border-left:0 !important;border-right:1px solid var(--border-soft) !important}
.pl-authpane .btn-block,.pl-authpane #login{width:100%;display:block;padding:12px !important;font-size:14.5px !important;margin-top:4px;
  box-shadow:0 10px 30px -10px rgba(56,189,248,.6)}
.pl-authpane .form-check-input{margin-right:6px}
/* Remember Me — custom brand checkbox, properly aligned */
.pl-remember{display:flex;align-items:center;gap:10px;margin:2px 0 0;cursor:pointer;color:var(--text-2);font-weight:600;font-size:13.5px;user-select:none;transition:color .13s}
.pl-remember:hover{color:var(--text)}
.pl-remember input{-webkit-appearance:none;appearance:none;width:19px;height:19px;margin:0;border:1.5px solid var(--border);border-radius:6px;background:rgba(255,255,255,.05);cursor:pointer;position:relative;flex-shrink:0;transition:.13s}
.pl-remember input:hover{border-color:rgba(56,189,248,.5)}
.pl-remember input:checked{background:linear-gradient(135deg,var(--brand),var(--brand-2));border-color:transparent}
.pl-remember input:checked::after{content:"";position:absolute;left:6px;top:2.5px;width:5px;height:9px;border:solid #04121c;border-width:0 2.4px 2.4px 0;transform:rotate(43deg)}
.pl-remember input:focus-visible{outline:none !important;box-shadow:0 0 0 3px var(--brand-glow)}
.pl-remember input:checked~span{color:var(--text)}
/* login submit loading state */
#login.pl-loading{opacity:.85;pointer-events:none}
.pl-spin{display:inline-block;width:18px;height:18px;border:2.5px solid rgba(4,18,28,.3);border-top-color:#04121c;border-radius:50%;animation:plSpin .7s linear infinite;vertical-align:middle}

/* ===== REGISTER (clientregister) — match the login aesthetic ===== */
.pl-authpane #registration{width:100%;max-width:620px}
.pl-authpane #registration form{max-width:none}
#registration .card{margin-bottom:18px !important}
#registration .card-title{font-size:16px;text-align:left;margin-bottom:18px}
#registration .form-group{margin-bottom:16px;position:relative}
#registration .prepend-icon{position:relative}
#registration .prepend-icon label.field-icon,#registration .prepend-icon .field-icon{position:absolute !important;left:0 !important;top:0 !important;bottom:0 !important;width:44px;height:auto !important;display:flex !important;align-items:center;justify-content:center;margin:0 !important;padding:0 !important;color:var(--text-3) !important;z-index:2;pointer-events:none;font-size:14px}
#registration .prepend-icon input.field:not([type=tel]),#registration .prepend-icon input.form-control:not([type=tel]),#registration .prepend-icon select.field,#registration .prepend-icon select{padding-left:44px !important}
/* intl phone widget draws its own flag UI — drop the duplicate fa icon, keep its own padding */
#registration .prepend-icon:has(.iti) .field-icon,#registration .prepend-icon:has(.intl-tel-input) .field-icon{display:none !important}
#registration .form-control,#registration .field,#registration select,#registration input[type=text],#registration input[type=email],#registration input[type=tel],#registration input[type=password]{background:rgba(255,255,255,.045) !important;border:1px solid var(--border) !important;border-radius:var(--r-sm) !important;color:var(--text) !important;height:46px;width:100%;transition:border-color .15s,box-shadow .15s}
#registration .form-control:focus,#registration .field:focus{border-color:var(--brand) !important;box-shadow:0 0 0 2px var(--brand-glow) !important}
#registration .iti,#registration .intl-tel-input{width:100%;display:block}
#registration ::placeholder{color:var(--text-3) !important;opacity:1}
[dir=rtl] #registration .prepend-icon label.field-icon{left:auto !important;right:0 !important}
[dir=rtl] #registration .prepend-icon input.field,[dir=rtl] #registration .prepend-icon input.form-control{padding-left:12px !important;padding-right:44px !important}
/* responsive: stack all register columns on small screens */
@media(max-width:700px){
  #registration [class*="col-sm"],#registration [class*="col-md"],#registration [class*="col-lg"]{flex:0 0 100% !important;max-width:100% !important}
  .pl-authpane #registration{max-width:100%}
}
/* password strength meter */
#registration .progress{height:8px;border-radius:99px;background:var(--surface-3);overflow:hidden;border:1px solid var(--border-soft)}
#registration .progress-bar{background:linear-gradient(90deg,var(--brand),var(--brand-2)) !important;border-radius:99px}
#registration .generate-password{border-radius:99px !important}
/* marketing / ToS checkboxes -> brand checkbox */
#registration input[name=marketingoptin],#registration .accepttos{-webkit-appearance:none;appearance:none;width:19px;height:19px;margin:0 8px 0 0;border:1.5px solid var(--border);border-radius:6px;background:rgba(255,255,255,.05);cursor:pointer;position:relative;vertical-align:middle;transition:.13s}
#registration input[name=marketingoptin]:checked,#registration .accepttos:checked{background:linear-gradient(135deg,var(--brand),var(--brand-2));border-color:transparent}
#registration input[name=marketingoptin]:checked::after,#registration .accepttos:checked::after{content:"";position:absolute;left:6px;top:2.5px;width:5px;height:9px;border:solid #04121c;border-width:0 2.4px 2.4px 0;transform:rotate(43deg)}
#registration .form-check{color:var(--text-2);font-weight:600;display:inline-flex;align-items:center;gap:4px}
#registration .form-check a{color:var(--brand)}
/* submit — same pill as Login */
#registration .btn-primary[type=submit]{border-radius:100px !important;padding:13px 44px !important;font-weight:700 !important;font-size:15px !important;font-family:var(--sans);box-shadow:0 10px 26px -12px var(--brand-glow)}
.pl-login-logo{display:none;justify-content:center;align-items:center;margin-bottom:22px}
.pl-login-logo img{max-height:46px;width:auto;max-width:70%}
#googleLoginWrap,#magicLoginWrap{max-width:406px !important;margin:12px auto 0 !important;width:100%}
/* de-white the addon buttons -> same glass field language as the login card */
#googleLoginBtn,#magicLoginToggle{background:rgba(255,255,255,.045) !important;border:1px solid var(--border) !important;color:var(--text) !important;border-radius:var(--r-sm) !important;box-shadow:none !important;padding:12px 14px !important;font-family:var(--body) !important;transition:.15s !important}
#googleLoginBtn:hover,#magicLoginToggle:hover{background:rgba(255,255,255,.09) !important;border-color:rgba(56,189,248,.45) !important;color:#fff !important}
/* the "or" divider */
#googleLoginWrap>div:not(.alert){color:var(--text-3) !important}
#googleLoginWrap>div:not(.alert)>span:first-child,#googleLoginWrap>div:not(.alert)>span:last-child{background:var(--border-soft) !important}
/* magic-login expanded form */
#magicLoginForm input{background:rgba(255,255,255,.045) !important;border:1px solid var(--border) !important;color:var(--text) !important;border-radius:var(--r-sm) !important;padding:12px !important}
#magicLoginForm input::placeholder{color:var(--text-3)}
#magicLoginForm button[type=submit]{background:var(--accent) !important;color:var(--accent-ink) !important;border-radius:100px !important;font-weight:700 !important;padding:12px 14px !important;font-family:var(--sans) !important;transition:.15s}
#magicLoginForm button[type=submit]:hover{background:var(--brand-2) !important;color:#fff !important}
@keyframes plDrift1{to{transform:translate(42px,32px)}}
@keyframes plDrift2{to{transform:translate(-32px,-42px)}}
@keyframes plDrift3{to{transform:translate(-26px,36px)}}
@keyframes plFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-11px)}}
@keyframes plFly1{0%{transform:translate(0,0) rotate(0)}50%{transform:translate(-32px,26px) rotate(-8deg)}100%{transform:translate(12px,-18px) rotate(6deg)}}
@keyframes plFly2{0%{transform:translate(0,0) rotate(0)}50%{transform:translate(28px,-22px) rotate(9deg)}100%{transform:translate(-16px,16px) rotate(-7deg)}}
@media(max-width:900px){
  .pl-hero{display:none}
  .pl-authwrap{padding-left:0 !important;padding-right:0 !important}
  .pl-authpane{flex:1;border-left:0;padding:40px 18px;background:transparent}
  .pl-login-logo{display:flex}
}
@media(prefers-reduced-motion:reduce){.pl-orb,.pl-fly,.pl-hero-mark,.pl-authpane .card,.pl-hero-status .dot{animation:none !important}}

/* ---------- SIDEBAR ---------- */
.pl-brand{display:flex;align-items:center;justify-content:center;gap:10px;padding:14px 8px 20px;margin-bottom:6px;border-bottom:1px solid var(--border-soft);font-weight:800;font-size:16px;color:#fff}
.pl-brand img{max-height:42px;width:auto;max-width:88%;transition:filter .2s}
.pl-brand:hover img{filter:drop-shadow(0 4px 14px rgba(56,189,248,.45))}
.pl-brand .mk{width:30px;height:30px;border-radius:9px;background:#fff;display:grid;place-items:center;color:#0a0a0b;flex-shrink:0}
.pl-brand .mk svg{width:19px;height:19px}
.pl-navgroup{color:var(--text-3);font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.09em;padding:15px 12px 5px}
.pl-nav{display:flex;flex-direction:column;gap:2px}
.pl-nav a{display:flex;align-items:center;gap:11px;padding:10px 12px;min-height:40px;border-radius:var(--r-sm);color:var(--text-2);font-weight:600;font-size:13.5px;transition:.13s}
.pl-nav a svg{width:18px;height:18px;opacity:.85;flex-shrink:0}
.pl-nav a:hover{background:var(--surface-2);color:var(--text)}
.pl-nav a.active{background:linear-gradient(90deg,rgba(56,189,248,.14),var(--surface-3) 60%);color:#fff;box-shadow:inset 2px 0 0 var(--brand)}
.pl-nav a.active svg{color:var(--brand)}
.pl-nav a.active svg{opacity:1}
.pl-nav a .pl-badge{margin-left:auto;background:var(--red);color:#fff;font-size:10.5px;font-weight:700;border-radius:20px;padding:1px 7px}
.pl-side-user{margin-top:auto;display:flex;align-items:center;gap:10px;padding:10px;border-radius:var(--r-sm);border:1px solid var(--border)}
.pl-side-user .av{width:34px;height:34px;border-radius:9px;background:linear-gradient(135deg,#0ea5e9,#0b2540);display:grid;place-items:center;font-weight:800;font-size:12px;color:#fff}
.pl-side-user .av svg{width:18px;height:18px}
.pl-avatar svg{width:19px;height:19px}
.pl-side-user .nm{font-size:12.5px;font-weight:700;line-height:1.2;color:var(--text)}
.pl-side-user .rl{font-size:11px;color:var(--text-3)}
.pl-side-user .out{margin-left:auto;color:var(--text-3)}
.pl-side-user .out:hover{color:#fff}

/* ---------- TOPBAR ---------- */
.pl-title{display:flex;align-items:center;gap:11px;font-family:var(--sans);font-weight:700;font-size:16px;letter-spacing:-.01em;min-width:0}
.pl-title-ic{width:33px;height:33px;border-radius:9px;background:linear-gradient(150deg,rgba(56,189,248,.18),rgba(56,189,248,.06));border:1px solid rgba(56,189,248,.24);display:grid;place-items:center;color:var(--brand);flex-shrink:0}
.pl-title-ic svg{width:17px;height:17px}
.pl-title-txt{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media(max-width:600px){.pl-title-ic{display:none}}
.pl-search{flex:1;max-width:360px;display:flex;align-items:center;gap:9px;background:var(--surface);border:1px solid var(--border);border-radius:var(--r-sm);padding:8px 12px;color:var(--text-3)}
.pl-top .pl-search input[type=text],.pl-search input[type=text],.pl-search input{border:0 !important;background:transparent !important;outline:0 !important;flex:1;color:var(--text) !important;font-size:13px;border-radius:0 !important;padding:0 !important;height:auto !important;box-shadow:none !important;min-width:0}
.pl-top .pl-search input[type=text]:focus,.pl-search input[type=text]:focus{box-shadow:none !important;border:0 !important;background:transparent !important}
.pl-spacer{flex:1}
.pl-icbtn{width:36px;height:36px;border-radius:var(--r-sm);border:1px solid var(--border);background:var(--surface);display:grid;place-items:center;color:var(--text-2);cursor:pointer;position:relative}
.pl-icbtn:hover{color:#fff;background:var(--surface-2)}
.pl-icbtn .dot{position:absolute;top:8px;right:9px;width:6px;height:6px;border-radius:50%;background:var(--red)}
.pl-avatar{width:34px;height:34px;border-radius:9px;background:linear-gradient(135deg,#0ea5e9,#0b2540);display:grid;place-items:center;font-weight:800;font-size:12px;color:#fff}

/* ---------- GLOBAL COMPONENT RESKIN (applies to every WHMCS page) ---------- */
.card,.panel{background:var(--surface) !important;border:1px solid var(--border) !important;border-radius:var(--r) !important;box-shadow:var(--shadow) !important;color:var(--text)}
.card-header,.panel-heading{background:transparent !important;border-bottom:1px solid var(--border-soft) !important;color:var(--text);font-weight:700;padding:14px 18px}
.card-body,.panel-body{color:var(--text-2)}
.card-footer,.panel-footer{background:transparent !important;border-top:1px solid var(--border-soft) !important}
.table{color:var(--text-2)}
.table thead th{background:transparent;border-bottom:1px solid var(--border) !important;color:var(--text-3);font-size:11px;text-transform:uppercase;letter-spacing:.04em;font-weight:700;padding:12px 14px}
.table td,.table th{border-color:var(--border-soft) !important;padding:12px 14px;vertical-align:middle}
.table-hover tbody tr:hover{background:var(--surface-2) !important}
.table td a{color:#fff}
.btn{border-radius:var(--r-sm) !important;font-weight:600 !important;padding:9px 16px}
.btn-primary,.btn-info{background:var(--accent) !important;border-color:var(--accent) !important;color:var(--accent-ink) !important;font-weight:700 !important}
.btn-primary:hover,.btn-info:hover{background:var(--brand-2) !important;border-color:var(--brand-2) !important;color:#fff !important}
.btn-default,.btn-secondary,.btn-outline-secondary{background:var(--surface-3) !important;border:1px solid var(--border) !important;color:var(--text-2) !important}
.btn-default:hover,.btn-secondary:hover{background:var(--surface-2) !important;color:#fff !important}
.btn-success{background:var(--green) !important;border-color:var(--green) !important;color:#052e12 !important}
.btn-danger{background:var(--red) !important;border-color:var(--red) !important}
.btn-link{color:var(--text-2) !important}
.form-control,.custom-select,textarea,select,input[type=text],input[type=email],input[type=password],input[type=number]{background:var(--surface-2) !important;border:1px solid var(--border) !important;color:var(--text) !important;border-radius:var(--r-sm) !important}
.form-control:focus{border-color:var(--brand) !important;box-shadow:0 0 0 3px var(--brand-glow) !important;background:var(--surface-2) !important;color:#fff !important}
.form-control::placeholder{color:var(--text-3)}
/* stop the browser autofill from painting inputs light */
input:-webkit-autofill,input:-webkit-autofill:hover,input:-webkit-autofill:focus,input:-webkit-autofill:active,textarea:-webkit-autofill,select:-webkit-autofill{
  -webkit-box-shadow:0 0 0 1000px var(--surface-2) inset !important;
  -webkit-text-fill-color:var(--text) !important;caret-color:var(--text) !important;
  border-color:var(--border) !important;transition:background-color 9999s ease-in-out 0s}
label,.control-label{color:var(--text-2);font-weight:600}
.input-group-text{background:var(--surface-3) !important;border-color:var(--border) !important;color:var(--text-2) !important}
.alert{border-radius:var(--r) !important;border:1px solid var(--border) !important}
.alert-success{background:var(--green-bg) !important;color:#9ff0b6 !important;border-color:rgba(34,197,94,.3) !important}
.alert-danger{background:var(--red-bg) !important;color:#ffb4b4 !important;border-color:rgba(239,68,68,.3) !important}
.alert-warning{background:var(--amber-bg) !important;color:#fcd692 !important;border-color:rgba(245,158,11,.3) !important}
.alert-info{background:var(--blue-bg) !important;color:#b9d3ff !important;border-color:rgba(59,130,246,.3) !important}
.badge{border-radius:20px;font-weight:700;padding:3px 9px}
/* status labels in tables -> clean rounded pills */
.table .label,.table .badge,.table-list .label,.table-list .badge,td .label,td .badge,.statusbadge,.invoice-status-tag{display:inline-block;padding:4px 12px !important;border-radius:99px !important;font-size:11px !important;font-weight:700 !important;letter-spacing:.02em;line-height:1.6;border:0 !important}
.badge-success,.label-success{background:var(--green-bg) !important;color:#34d399 !important}
.badge-danger,.label-danger{background:var(--red-bg) !important;color:#fb7185 !important}
.badge-warning,.label-warning{background:var(--amber-bg) !important;color:#fbbf24 !important}
.badge-info,.label-info,.badge-primary{background:var(--blue-bg) !important;color:#7dd3fc !important}
.nav-tabs{border-bottom:1px solid var(--border)}
.nav-tabs .nav-link{color:var(--text-2);border:0;border-bottom:2px solid transparent}
.nav-tabs .nav-link.active{color:#fff;background:transparent;border-bottom:2px solid var(--brand)}
.list-group-item{background:var(--surface) !important;border-color:var(--border) !important;color:var(--text-2)}
.text-muted{color:var(--text-3) !important}
.modal-content{background:var(--surface) !important;border:1px solid var(--border) !important;color:var(--text)}
.modal-header,.modal-footer{border-color:var(--border) !important}
.modal .close,.alert:not(.verification-banner) .close{color:var(--text-2) !important;opacity:.65;text-shadow:none}
.modal .close:hover,.alert:not(.verification-banner) .close:hover{color:#fff !important;opacity:1}
.dropdown-menu{background:var(--surface) !important;border:1px solid var(--border) !important}
.dropdown-item{color:var(--text-2) !important}
.dropdown-item:hover{background:var(--surface-2) !important;color:#fff !important}
.page-header,.page-header h1{border-color:var(--border)}
.well{background:var(--surface-2) !important;border-color:var(--border) !important}
.progress{background:var(--surface-3) !important}
/* DataTables (services/invoices/tickets lists) */
.dataTables_wrapper{color:var(--text-2)}
.dataTables_filter input,.dataTables_length select,.dataTables_length .custom-select{background:var(--surface-2) !important;border:1px solid var(--border) !important;color:var(--text) !important;border-radius:var(--r-sm) !important}
.dataTables_info,.dataTables_length,.dataTables_length label,.dataTables_filter label{color:var(--text-3) !important}
.dataTables_paginate .paginate_button,.page-link{color:var(--text-2) !important;background:var(--surface) !important;border:1px solid var(--border) !important;border-radius:var(--r-sm) !important;margin:0 2px}
.dataTables_paginate .paginate_button:hover,.page-link:hover{background:var(--surface-2) !important;color:#fff !important;border-color:var(--border) !important}
.dataTables_paginate .paginate_button.current,.page-item.active .page-link{background:var(--accent) !important;color:var(--accent-ink) !important;border-color:var(--accent) !important}
.dataTables_paginate .paginate_button.disabled,.page-item.disabled .page-link{opacity:.4}
table.dataTable tbody tr{background:transparent !important}
table.dataTable tbody tr:hover{background:var(--surface-2) !important}
table.dataTable.no-footer{border-color:var(--border) !important}
.table-list td,.table-list th{border-color:var(--border-soft) !important}
.status,.label{border-radius:20px;padding:3px 10px;font-weight:700;font-size:11px}
.status-active,.status-paid,.label-success{background:var(--green-bg) !important;color:#34d399 !important}
.status-pending,.status-unpaid{background:var(--blue-bg) !important;color:#7dd3fc !important}
.status-suspended,.status-cancelled,.status-terminated,.status-overdue{background:var(--red-bg) !important;color:#fb7185 !important}
/* responsive: let wide tables scroll instead of breaking layout */
.table-responsive{overflow-x:auto;-webkit-overflow-scrolling:touch}
.table-container>.table{min-width:560px}
/* list pages (invoices/tickets/domains): wrap the DataTable in a clean card, drop twenty-one chrome */
.table-container{background:var(--surface);border:1px solid var(--border);border-radius:var(--r);padding:10px 18px 16px;margin-top:4px;overflow-x:auto;-webkit-overflow-scrolling:touch}
.dataTables_length{display:none !important}
.dataTables_filter{float:right;margin:8px 0 12px}
.dataTables_filter label{margin:0;color:var(--text-3)}
.dataTables_info{color:var(--text-3) !important;font-size:12px;padding-top:12px}
.dataTables_paginate{padding-top:10px !important}
.table-container .table-list{margin-bottom:0}
.table-container .table-list thead th:first-child:empty{width:0;padding:0}
/* base twenty-one theme forces white cells with !important — override hard */
.table td,.table th,
.table-list thead th,
.table-list>tbody>tr>td,
.table-list>tbody>tr>th{background-color:var(--surface) !important;color:var(--text-2) !important;border-color:var(--border-soft) !important}
.table-list thead th{background-color:var(--surface-2) !important;color:var(--text-3) !important;border-bottom:1px solid var(--border) !important;font-weight:700}
.table-list thead th.sorting_asc,.table-list thead th.sorting_desc,
.dataTables_wrapper table.table-list thead th.sorting_asc,.dataTables_wrapper table.table-list thead th.sorting_desc{background-color:var(--surface-3) !important;color:var(--text) !important}
.table-list>tbody>tr:hover>td{background-color:var(--surface-2) !important}
.table td a,.table-list td a{color:#fff !important}
.table-list>tbody>tr>td .text-muted,.table-list .secondary{color:var(--text-3) !important}
.dataTables_filter label .form-control{background-color:var(--surface-2) !important;background-image:none !important;padding-left:14px !important;color:var(--text) !important}
/* email verification banner: base is a white full-bleed bootstrap-grid bar → make it a tidy aligned card */
.verification-banner,.verification-banner.email-verification{background:var(--amber-bg) !important;border:1px solid rgba(251,191,36,.28) !important;border-radius:var(--r) !important;padding:12px 16px !important;margin:0 0 20px !important;color:var(--text) !important}
.verification-banner .container{max-width:none !important;width:100% !important;padding:0 !important;margin:0 !important}
.verification-banner .row{display:flex !important;align-items:center !important;gap:14px !important;margin:0 !important;flex-wrap:wrap}
.verification-banner [class*="col-"]{padding:0 !important;max-width:none !important;width:auto !important;flex:0 0 auto !important}
.verification-banner .col-10,.verification-banner .col-sm-7,.verification-banner .col-md-8{flex:1 1 240px !important;order:1 !important;display:flex;align-items:center;gap:11px}
.verification-banner .col-12,.verification-banner .col-sm-4,.verification-banner .col-md-3{order:2 !important}
.verification-banner .col-2,.verification-banner .col-sm-1{order:3 !important}
.verification-banner .text{color:var(--text) !important;font-size:13.5px;font-weight:500}
.verification-banner .fa-exclamation-triangle,.verification-banner .fas{color:var(--amber) !important;font-size:17px;flex-shrink:0}
.verification-banner .btn-block{width:auto !important;display:inline-block !important;margin:0 !important}
.verification-banner .btn-resend-verify-email{white-space:nowrap}
.verification-banner .close{color:var(--text-2) !important;opacity:.7;text-shadow:none;font-size:20px;padding:0 2px}
.verification-banner .close:hover{color:#fff !important;opacity:1}
/* login brand mark */
.pl-login-logo .mk{width:30px;height:30px;border-radius:9px;background:#fff;display:inline-grid;place-items:center;color:#0a0a0b}
.pl-login-logo .mk svg{width:19px;height:19px}

/* ---------- DASHBOARD ---------- */
.pl-hello{font-size:22px;font-weight:700;margin:0 0 6px;letter-spacing:-.02em}
.pl-crumbs{color:var(--text-3);font-size:12.5px;margin-bottom:24px}
/* welcome banner */
.pl-welcome{position:relative;overflow:hidden;border-radius:var(--r);padding:22px 26px;margin-bottom:22px;
  display:flex;align-items:center;gap:16px;
  background:linear-gradient(115deg,rgba(56,189,248,.13),rgba(14,165,233,.05) 42%,transparent 68%),var(--surface);
  border:1px solid var(--border)}
.pl-welcome-emblem{flex-shrink:0;width:54px;height:54px;border-radius:15px;display:grid;place-items:center;color:var(--brand);
  background:linear-gradient(150deg,rgba(56,189,248,.22),rgba(14,165,233,.05));border:1px solid rgba(56,189,248,.28);
  box-shadow:0 10px 26px -14px rgba(56,189,248,.5),inset 0 1px 0 rgba(255,255,255,.12)}
.pl-welcome-emblem img{width:36px;height:36px;filter:drop-shadow(0 4px 10px rgba(56,189,248,.4))}
.pl-welcome-emblem svg{width:27px;height:27px}
.pl-welcome-txt{position:relative;z-index:1;flex:1 1 auto;min-width:0}
.pl-welcome .pl-hello{margin:0 0 5px}
.pl-welcome-sub{color:var(--text-2);font-size:13.5px;margin:0;max-width:56ch;line-height:1.6}
.pl-welcome-actions{position:relative;z-index:1;display:flex;gap:10px;flex-shrink:0;flex-wrap:wrap}
.pl-wbtn{display:inline-flex;align-items:center;gap:8px;padding:10px 16px;border-radius:var(--r-sm);font-weight:700;font-size:13px;border:1px solid var(--border);background:var(--surface-2);color:var(--text-2);white-space:nowrap;transition:.15s}
.pl-wbtn svg{width:16px;height:16px}
.pl-wbtn:hover{background:var(--surface-3);color:#fff;border-color:rgba(56,189,248,.35)}
.pl-wbtn.primary{background:var(--accent);color:var(--accent-ink);border-color:var(--accent);box-shadow:0 8px 22px -12px var(--brand-glow)}
.pl-wbtn.primary:hover{background:var(--brand-2);color:#fff;border-color:var(--brand-2)}
.pl-welcome-art{position:absolute;right:30px;top:50%;transform:translateY(-50%);z-index:0;pointer-events:none}
.pl-welcome-art svg{width:134px;height:112px;opacity:.16}
.pl-welcome-art img{width:150px;height:auto;opacity:.14}
[dir=rtl] .pl-welcome-art{right:auto;left:30px}
.pl-grid{display:grid;gap:16px}
.pl-stats{grid-template-columns:repeat(4,1fr)}
.pl-stat{position:relative;overflow:hidden;padding:18px;text-decoration:none;display:block;transition:transform .15s ease,border-color .15s ease}
.pl-stat::after{content:"";position:absolute;top:-34px;right:-34px;width:96px;height:96px;border-radius:50%;background:radial-gradient(circle,rgba(56,189,248,.10),transparent 70%);pointer-events:none}
[dir=rtl] .pl-stat::after{right:auto;left:-34px}
.pl-stat:hover{border-color:rgba(56,189,248,.35) !important;transform:translateY(-2px)}
.pl-stat:focus-visible,.pl-stat:focus-within{outline:2px solid var(--brand);outline-offset:2px}
.pl-stat .top{display:flex;align-items:center;justify-content:space-between}
.pl-chip{width:40px;height:40px;border-radius:11px;display:grid;place-items:center}
.pl-chip svg{width:19px;height:19px}
.pl-chip.blue{background:var(--blue-bg);color:#7dd3fc}
.pl-chip.green{background:var(--green-bg);color:#34d399}
.pl-chip.amber{background:var(--amber-bg);color:#fbbf24}
.pl-chip.red{background:var(--red-bg);color:#fb7185}
.pl-stat .n{font-family:var(--sans);font-size:27px;font-weight:700;margin-top:13px;line-height:1;color:var(--text);letter-spacing:-.02em}
.pl-stat .l{color:var(--text-3);font-size:12.5px;margin-top:5px}
.pl-sec{display:flex;align-items:center;justify-content:space-between;margin:28px 0 14px}
.pl-sec h2{font-size:15px;font-weight:700;margin:0;display:flex;align-items:center;gap:9px}
.pl-sec h2 svg{width:17px;height:17px;color:var(--brand);flex-shrink:0}
.pl-sec a{font-size:12.5px;font-weight:700;color:var(--text-2)}
.pl-servers{grid-template-columns:repeat(3,1fr)}
.pl-srv{padding:18px}
.pl-srv .top{display:flex;align-items:center;justify-content:space-between;gap:8px;min-width:0;margin-bottom:14px}
.pl-srv-ic{width:40px;height:40px;border-radius:11px;background:rgba(56,189,248,.11);border:1px solid rgba(56,189,248,.22);display:grid;place-items:center;color:var(--brand);flex-shrink:0}
.pl-srv-ic svg{width:20px;height:20px}
.pl-srv .nm{font-family:var(--sans);font-weight:700;font-size:15.5px;letter-spacing:-.01em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pl-pill{font-size:11px;font-weight:700;padding:3px 10px;border-radius:20px;display:inline-flex;align-items:center;gap:6px;flex-shrink:0}
.pl-pill:before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}
.pl-pill.on{color:#34d399;background:var(--green-bg)}
.pl-pill.pend{color:#7dd3fc;background:var(--blue-bg)}
.pl-pill.off{color:var(--text-2);background:var(--surface-3)}
.pl-srv .ip{color:var(--text-3);font-size:12px;font-family:var(--mono);margin:3px 0 0;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pl-srv-meta{display:flex;flex-direction:column;gap:9px;padding:13px 0;margin:14px 0 16px;border-top:1px solid var(--border-soft);border-bottom:1px solid var(--border-soft)}
.pl-srv-meta .mrow{display:flex;justify-content:space-between;align-items:center;font-size:12.5px;gap:10px}
.pl-srv-meta .mrow span{color:var(--text-3)}
.pl-srv-meta .mrow b{color:var(--text);font-weight:700;font-family:var(--mono);text-align:right}
.pl-srv>a.pl-b{display:block;flex:none}
.pl-b{padding:10px 16px;border-radius:var(--r-sm);font-weight:700;font-size:12.5px;text-align:center;border:1px solid var(--border);background:var(--surface-3);color:var(--text-2)}
.pl-b:hover{background:var(--surface-2);color:#fff}
.pl-b.primary{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}
.pl-b.primary:hover{background:var(--brand-2);border-color:var(--brand-2);color:#fff}
/* services/invoices/tickets: clickable cards */
.pl-svc{cursor:pointer;transition:transform .15s ease,border-color .15s ease}
a.pl-svc,a.pl-srv{display:flex;flex-direction:column;text-decoration:none;color:var(--text)}
a.pl-svc:hover{text-decoration:none}
.pl-svc:hover{transform:translateY(-2px);border-color:rgba(56,189,248,.4) !important}
.pl-svc:hover .pl-b.primary{background:var(--brand-2);border-color:var(--brand-2);color:#fff}
.pl-srv .nm.unread::after{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--brand);margin-left:7px;vertical-align:middle;box-shadow:0 0 7px var(--brand)}
.pl-srv-check{display:inline-flex;align-items:center;flex-shrink:0}
.pl-srv-check input{width:16px;height:16px;accent-color:var(--brand);cursor:pointer;margin:0}
/* theme toggle button in topbar */
.pl-icbtn .sun,.pl-icbtn .moon{display:inline-flex;align-items:center;justify-content:center}
.pl-empty{text-align:center;padding:34px;color:var(--text-3)}
.pl-empty .big{width:52px;height:52px;border-radius:14px;background:var(--surface-3);display:grid;place-items:center;margin:0 auto 12px;color:var(--text-2)}

/* ============ STORE (standard_cart order form) — match the panel, token-driven so light mode follows ============ */
#order-standard_cart{color:var(--text)}
#order-standard_cart .header-lined{border-bottom:1px solid var(--border);padding-bottom:14px;margin-bottom:22px}
#order-standard_cart .header-lined h1{font-family:var(--sans);font-weight:700;letter-spacing:-.02em;color:var(--text)}
#order-standard_cart .header-lined p{color:var(--text-2)}
#order-standard_cart .pl-plan-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:22px}
#order-standard_cart .pl-plan{position:relative;overflow:hidden;display:flex;flex-direction:column;
  background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:24px 22px;box-shadow:var(--shadow);
  transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease}
#order-standard_cart .pl-plan::after{content:"";position:absolute;top:-40px;right:-40px;width:120px;height:120px;border-radius:50%;background:radial-gradient(circle,rgba(56,189,248,.10),transparent 70%);pointer-events:none}
#order-standard_cart .pl-plan:hover{transform:translateY(-4px);border-color:rgba(56,189,248,.5);box-shadow:0 26px 60px -32px var(--brand-glow)}
#order-standard_cart .pl-plan-head{display:flex;align-items:center;justify-content:space-between;gap:10px}
#order-standard_cart .pl-plan-name{font-family:var(--sans) !important;font-weight:700 !important;font-size:20px !important;color:var(--text) !important;opacity:1 !important;letter-spacing:-.01em}
#order-standard_cart .pl-plan-qty{font-size:11px;color:var(--text-3);font-weight:600;white-space:nowrap}
#order-standard_cart .pl-plan-tag{color:var(--text-3);font-size:12.5px;line-height:1.55;margin:6px 0 0}
#order-standard_cart .pl-plan-price{display:flex;align-items:baseline;flex-wrap:wrap;gap:2px 7px;margin:16px 0 2px}
#order-standard_cart .pl-plan-price .from{width:100%;font-family:var(--mono);font-size:10.5px;text-transform:uppercase;letter-spacing:.09em;color:var(--text-3);margin-bottom:3px}
#order-standard_cart .pl-plan-price .amt{font-family:var(--sans);font-size:32px;font-weight:800;color:var(--brand);line-height:1;letter-spacing:-.02em}
#order-standard_cart .pl-plan-price .per{font-size:12.5px;color:var(--text-3);font-weight:500}
#order-standard_cart .pl-plan-feats{list-style:none;padding:16px 0 0;margin:16px 0 0;border-top:1px solid var(--border-soft);display:flex;flex-direction:column;gap:10px}
#order-standard_cart .pl-plan-feats li{display:flex;align-items:center;gap:11px;font-size:13px;color:var(--text-2)}
#order-standard_cart .pl-plan-feats li svg{width:26px;height:26px;padding:5px;border-radius:8px;background:var(--surface-3);border:1px solid var(--border);color:var(--brand);flex-shrink:0;box-sizing:border-box;transition:transform .2s ease,background .2s ease,border-color .2s ease}
#order-standard_cart .pl-plan:hover .pl-plan-feats li svg{border-color:rgba(56,189,248,.3)}
#order-standard_cart .pl-plan-feats li:hover svg{background:rgba(56,189,248,.14);transform:translateY(-1px) scale(1.06)}
#order-standard_cart .pl-plan-feats b,#order-standard_cart .pl-plan-feats strong,#order-standard_cart .pl-plan-feats .feature-value{color:var(--text);font-weight:700}

/* ===== store sidebar (Categories / Actions) — same language as the main nav ===== */
#order-standard_cart .cart-sidebar .panel{background:var(--surface) !important;border:1px solid var(--border) !important;border-radius:var(--r) !important;overflow:hidden;box-shadow:var(--shadow) !important;margin-bottom:16px !important}
#order-standard_cart .cart-sidebar .panel-heading{background:transparent !important;border-bottom:1px solid var(--border-soft) !important;padding:13px 16px !important}
#order-standard_cart .cart-sidebar .panel-title{display:flex;align-items:center;gap:9px;margin:0;font-family:var(--sans);font-size:13.5px;font-weight:700;color:var(--text) !important}
#order-standard_cart .cart-sidebar .panel-title>i:first-child{color:var(--brand);font-size:14px}
#order-standard_cart .cart-sidebar .panel-minimise{margin-left:auto;color:var(--text-3) !important;font-size:12px;cursor:pointer;transition:transform .2s,color .15s}
#order-standard_cart .cart-sidebar .panel-minimise:hover{color:var(--text) !important}
#order-standard_cart .cart-sidebar .list-group{display:flex;flex-direction:column;gap:2px;padding:8px;border:0 !important;background:transparent !important}
#order-standard_cart .cart-sidebar .list-group-item{background:transparent !important;border:0 !important;border-radius:10px !important;color:var(--text-2) !important;font-weight:600;font-size:13.5px;padding:10px 12px !important;display:flex;align-items:center;gap:10px;transition:.13s}
#order-standard_cart .cart-sidebar .list-group-item i{color:var(--brand);width:18px;text-align:center;font-size:13.5px;flex-shrink:0}
#order-standard_cart .cart-sidebar a.list-group-item:hover{background:var(--surface-2) !important;color:var(--text) !important;transform:translateX(3px)}
#order-standard_cart .cart-sidebar .list-group-item.active{background:linear-gradient(90deg,rgba(56,189,248,.14),var(--surface-3) 60%) !important;color:#fff !important;box-shadow:inset 2px 0 0 var(--brand) !important}
#order-standard_cart .cart-sidebar .list-group-item .badge{margin-left:auto;background:var(--brand);color:var(--accent-ink);border-radius:99px;font-size:10.5px;padding:3px 8px}
[dir=rtl] #order-standard_cart .cart-sidebar a.list-group-item:hover{transform:translateX(-3px)}
[dir=rtl] #order-standard_cart .cart-sidebar .list-group-item.active{box-shadow:inset -2px 0 0 var(--brand) !important}
[dir=rtl] #order-standard_cart .cart-sidebar .panel-minimise{margin-left:0;margin-right:auto}
/* featured / most-popular plan */
#order-standard_cart .pl-plan-feat{border-color:var(--brand) !important;box-shadow:0 0 0 1px var(--brand),0 30px 66px -40px var(--brand-glow) !important}
#order-standard_cart .pl-plan-badge{position:absolute;top:0;left:50%;transform:translateX(-50%);font-family:var(--mono);font-size:10px;letter-spacing:.09em;text-transform:uppercase;font-weight:600;background:linear-gradient(118deg,var(--brand),var(--brand-2));color:#04121c;padding:5px 15px;border-radius:0 0 11px 11px;white-space:nowrap;z-index:2}
#order-standard_cart .pl-plan-feat{padding-top:30px}
#order-standard_cart .pl-plan-setup{font-size:11.5px;color:var(--text-3);margin-top:12px}
#order-standard_cart .pl-plan-btn{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;margin-top:18px;padding:12px;
  border-radius:100px;background:var(--accent);color:var(--accent-ink) !important;font-family:var(--sans);font-weight:700;font-size:14px;
  border:1px solid var(--accent);transition:.15s;box-shadow:0 10px 26px -12px var(--brand-glow)}
#order-standard_cart .pl-plan-btn:hover{background:var(--brand-2);border-color:var(--brand-2);color:#fff !important;transform:translateY(-1px)}
#order-standard_cart .cart-sidebar{background:transparent}
#order-standard_cart .cart-sidebar .panel,#order-standard_cart .cart-sidebar .list-group{background:var(--surface) !important;border:1px solid var(--border) !important;border-radius:var(--r) !important;overflow:hidden}
#order-standard_cart .cart-sidebar .panel-heading,#order-standard_cart .cart-sidebar .list-group-item{background:transparent !important;border-color:var(--border-soft) !important;color:var(--text-2) !important}
#order-standard_cart .cart-sidebar a{color:var(--text-2)}
#order-standard_cart .cart-sidebar a:hover,#order-standard_cart .cart-sidebar .active>a,#order-standard_cart .cart-sidebar .active{color:var(--brand) !important}
.order-summary,.summary-container,#order-standard_cart .cart-total,#frmConfigureProduct .panel{background:var(--surface) !important;border:1px solid var(--border) !important;border-radius:var(--r) !important;color:var(--text)}
.checkout-btn,.btn-checkout{background:var(--accent) !important;border-color:var(--accent) !important;color:var(--accent-ink) !important;font-weight:700 !important}

/* ===== checkout / cart form fields + summary — papilio ===== */
#order-standard_cart .form-group{margin-bottom:16px;position:relative}
#order-standard_cart .prepend-icon{position:relative}
#order-standard_cart .prepend-icon label.field-icon,#order-standard_cart .prepend-icon .field-icon{position:absolute !important;left:0 !important;top:0;bottom:0;width:44px;height:auto !important;display:flex !important;align-items:center;justify-content:center;margin:0 !important;padding:0 !important;color:var(--text-3) !important;z-index:2;pointer-events:none;font-size:14px}
#order-standard_cart .prepend-icon input.field:not([type=tel]),#order-standard_cart .prepend-icon input.form-control:not([type=tel]),#order-standard_cart .prepend-icon select.field,#order-standard_cart .prepend-icon select{padding-left:44px !important}
#order-standard_cart .prepend-icon:has(.iti) .field-icon,#order-standard_cart .prepend-icon:has(.intl-tel-input) .field-icon{display:none !important}
#order-standard_cart input.form-control,#order-standard_cart input.field,#order-standard_cart select,#order-standard_cart .form-control{background:rgba(255,255,255,.04) !important;border:1px solid var(--border) !important;border-radius:var(--r-sm) !important;color:var(--text) !important}
#order-standard_cart input.form-control,#order-standard_cart input.field,#order-standard_cart select{height:46px}
#order-standard_cart .form-control:focus,#order-standard_cart .field:focus{border-color:var(--brand) !important;box-shadow:0 0 0 2px var(--brand-glow) !important}
#order-standard_cart .iti{width:100%;display:block}
#order-standard_cart ::placeholder{color:var(--text-3) !important;opacity:1}
[dir=rtl] #order-standard_cart .prepend-icon label.field-icon{left:auto !important;right:0 !important}
[dir=rtl] #order-standard_cart .prepend-icon input.field,[dir=rtl] #order-standard_cart .prepend-icon input.form-control{padding-left:12px !important;padding-right:44px !important}
/* order summary panel */
#order-standard_cart .order-summary,#order-standard_cart .summary-container{background:var(--surface) !important;border:1px solid var(--border) !important;border-radius:var(--r) !important;box-shadow:var(--shadow);color:var(--text-2)}
#order-standard_cart .summary-container .item,#order-standard_cart .summary-container li,#order-standard_cart .summary-container tr{border-color:var(--border-soft) !important}
#order-standard_cart .total-due-today{border-top:1px solid var(--border) !important;color:var(--text) !important;font-weight:700}
#order-standard_cart .total-due-today .amount,#order-standard_cart .total-due-today b,#order-standard_cart .total-due-today .total{color:var(--brand) !important}
/* checkout button -> brand pill */
#order-standard_cart .btn-checkout,#order-standard_cart #checkout{border-radius:100px !important;font-family:var(--sans);font-weight:700 !important;box-shadow:0 10px 26px -12px var(--brand-glow) !important}
#order-standard_cart .btn-checkout:hover,#order-standard_cart #checkout:hover{background:var(--brand-2) !important;border-color:var(--brand-2) !important;color:#fff !important}

/* ===== FIX leftover WHITE/LIGHT boxes with invisible text (bootstrap .bg-* utils + product/module summaries). Token-based → dark in dark mode, white in light mode ===== */
.bg-white,.bg-light,.bg-default,.bg-faded{background:var(--surface) !important;color:var(--text) !important}
.jumbotron{background:var(--surface-2) !important;color:var(--text) !important}
.product-status,.product-info,.product-summary{background:var(--surface-2) !important;border:1px solid var(--border) !important;border-radius:var(--r) !important;overflow:hidden}
.product-status .product-title,.product-title,.product-status-text,.product-info .product-title{color:var(--text) !important}
.product-status p,.product-info p,.product-status-text p,.product-status small,.product-info small{color:var(--text-2) !important}
.product-details-tab-container,.tab-content.bg-white{background:var(--surface) !important;border:1px solid var(--border) !important;border-radius:var(--r) !important}
.card.bg-default,.card-accent-blue{background:var(--surface) !important;border-color:var(--border) !important}
.module-client-area{color:var(--text-2) !important}
.module-client-area strong,.module-client-area b,.module-client-area h1,.module-client-area h2,.module-client-area h3,.module-client-area h4,.module-client-area label,.module-client-area td:first-child{color:var(--text) !important}
.module-client-area table td,.module-client-area table th{border-color:var(--border-soft) !important}
.product-details .product-actions-wrapper .btn{border-radius:var(--r-sm) !important}
/* store category sidebar — nicer items */
#order-standard_cart .cart-sidebar .list-group-item,#order-standard_cart .cart-sidebar .panel a{transition:.15s ease;border-radius:8px;font-weight:500}
#order-standard_cart .cart-sidebar .list-group-item:hover,#order-standard_cart .cart-sidebar a:hover{background:var(--surface-2) !important;color:var(--brand) !important}
#order-standard_cart .cart-sidebar i,#order-standard_cart .cart-sidebar .fa,#order-standard_cart .cart-sidebar .fal,#order-standard_cart .cart-sidebar svg{color:var(--brand)}
#order-standard_cart .cart-sidebar .panel-heading{font-family:var(--sans);font-weight:700;color:var(--text) !important}
/* bulk-action buttons (domains etc.) — de-twenty-one: separate clean brand pills */
#domainForm .btn-group,.pl-content .btn-toolbar .btn-group{display:inline-flex;flex-wrap:wrap;gap:8px;vertical-align:middle}
#domainForm .btn-group>.btn,#domainForm .setBulkAction,.pl-content .btn-toolbar .btn{border-radius:var(--r-sm) !important;border:1px solid var(--border) !important;background:var(--surface-2) !important;color:var(--text-2) !important;font-weight:600 !important;padding:8px 14px !important;box-shadow:none !important;transition:.15s}
#domainForm .btn-group>.btn:hover,#domainForm .setBulkAction:hover,.pl-content .btn-toolbar .btn:hover{background:var(--surface-3) !important;color:#fff !important;border-color:rgba(56,189,248,.45) !important}
#domainForm .btn-group i,#domainForm .setBulkAction i{color:var(--brand);margin-right:3px}
#domainForm .btn-group .dropdown-menu{border-radius:var(--r-sm) !important}
#domainForm .btn-group .dropdown-toggle::after{color:var(--text-3)}
.pl-search{transition:border-color .15s,box-shadow .15s}
.pl-search:focus-within{border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-glow)}

/* ===== INVOICE (viewinvoice) — beautiful dark invoice, token-driven ===== */
.invoice-container{color:var(--text);background:transparent !important}
.invoice-container h1,.invoice-container h2,.invoice-container h3,.invoice-container h4,.invoice-container h5{color:var(--text) !important;font-family:var(--sans)}
.invoice-container .small-text,.invoice-container address,.invoice-container p,.invoice-container .text-muted,.invoice-container label{color:var(--text-2) !important}
.invoice-container strong{color:var(--text)}
.invoice-container hr{border-color:var(--border)}
.invoice-header{padding-bottom:18px;margin-bottom:8px;border-bottom:1px solid var(--border)}
.invoice-container .invoice-status span{display:inline-block;padding:6px 18px;border-radius:22px;font-weight:800;font-size:15px;letter-spacing:.03em}
.invoice-container .invoice-status .unpaid,.invoice-container .invoice-status .collections{color:#ff7a7a !important;background:var(--red-bg)}
.invoice-container .invoice-status .paid{color:#5edd8a !important;background:var(--green-bg)}
.invoice-container .invoice-status .draft,.invoice-container .invoice-status .cancelled,.invoice-container .invoice-status .refunded{color:var(--text-2) !important;background:var(--surface-3)}
.invoice-container .card,.invoice-container .card.bg-default{background:var(--surface) !important;border:1px solid var(--border) !important;border-radius:var(--r) !important;box-shadow:var(--shadow)}
.invoice-container .card-header{background:transparent !important;border-bottom:1px solid var(--border) !important;color:var(--text) !important;font-family:var(--sans)}
.invoice-container .bg-info,.invoice-container .bg-primary,.invoice-container .card-header.bg-info,.invoice-container .card-title.bg-info{background:linear-gradient(135deg,var(--brand),var(--brand-2)) !important;color:#04121c !important;border:0 !important}
.invoice-container .total-row{color:var(--text) !important;font-weight:700}
.invoice-container .card-header.bg-success{background:var(--green-bg) !important;color:#5edd8a !important;border:0 !important}
.invoice-container table,.invoice-container .table{color:var(--text-2);margin-bottom:0;background:transparent !important}
.invoice-container .table td,.invoice-container .table th{border-color:var(--border-soft) !important;background:transparent !important;padding:12px 14px !important;color:var(--text-2)}
.invoice-container .table thead th{color:var(--text-3) !important;text-transform:uppercase;font-size:11px;letter-spacing:.04em;border-bottom:1px solid var(--border) !important}
.invoice-container .table td a{color:var(--brand) !important}
.invoice-container .table tfoot td,.invoice-container tr[class*="total"] td,.invoice-container tr[class*="subtotal"] td,.invoice-container .table strong{color:var(--text) !important;font-weight:700}
.invoice-container .custom-select,.invoice-container select,.invoice-container .form-control{background:var(--surface-2) !important;color:var(--text) !important;border:1px solid var(--border) !important;border-radius:var(--r-sm) !important}
.invoice-container .btn-default{background:var(--surface-2) !important;border:1px solid var(--border) !important;color:var(--text-2) !important}
.invoice-container .btn-default:hover{background:var(--surface-3) !important;color:#fff !important;border-color:rgba(56,189,248,.4) !important}

/* ===== custom invoice layout (pl-inv) — modern, responsive, replaces twenty-one ===== */
.pl-invoice-body{background:var(--bg) !important;color:var(--text);font-family:var(--body);-webkit-font-smoothing:antialiased}
.pl-inv{max-width:800px;margin:0 auto;padding:28px 20px 60px}
.pl-inv-topbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:20px;flex-wrap:wrap}
.pl-inv-back{color:var(--text-2);font-size:13px;font-weight:600}
.pl-inv-back:hover{color:var(--brand)}
.pl-inv-actions{display:flex;gap:8px;flex-wrap:wrap}
.pl-inv-btn{display:inline-flex;align-items:center;gap:7px;padding:8px 14px;border-radius:var(--r-sm);border:1px solid var(--border);background:var(--surface-2);color:var(--text-2) !important;font-weight:600;font-size:13px}
.pl-inv-btn:hover{background:var(--surface-3);color:#fff !important;border-color:rgba(56,189,248,.4)}
.pl-inv-hero{display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap;
  background:linear-gradient(120deg,rgba(56,189,248,.13),transparent 62%),var(--surface);border:1px solid var(--border);border-radius:16px;padding:26px 28px;margin-bottom:20px}
.pl-inv-hero-l img{max-height:42px;margin-bottom:12px}
.pl-inv-hero-l h2{font-family:var(--sans);font-size:20px;margin:0 0 10px;color:var(--text)}
.pl-inv-num{font-family:var(--sans);font-weight:800;font-size:26px;color:var(--text);letter-spacing:-.02em}
.pl-inv-status{display:inline-block;margin-top:12px;padding:5px 15px;border-radius:20px;font-weight:800;font-size:12px;text-transform:uppercase;letter-spacing:.05em}
.pl-inv-status.status-unpaid,.pl-inv-status.status-collections{color:#ff7a7a;background:var(--red-bg)}
.pl-inv-status.status-paid,.pl-inv-status[class*="pending"]{color:#5edd8a;background:var(--green-bg)}
.pl-inv-status.status-cancelled,.pl-inv-status.status-refunded,.pl-inv-status.status-draft{color:var(--text-2);background:var(--surface-3)}
.pl-inv-hero-r{text-align:right;min-width:210px}
.pl-inv-total-label{color:var(--text-3);font-size:11.5px;text-transform:uppercase;letter-spacing:.06em;font-weight:700}
.pl-inv-total{font-family:var(--sans);font-weight:800;font-size:36px;color:var(--brand);line-height:1.1;letter-spacing:-.02em;margin-top:2px}
.pl-inv-due{color:var(--text-3);font-size:12.5px;margin:4px 0 12px}
.pl-inv-hero-r .payment-btn-container{margin-top:6px}
.pl-inv-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:14px;margin-bottom:20px}
.pl-inv-box{background:var(--surface);border:1px solid var(--border);border-radius:var(--r);padding:16px 18px}
.pl-inv-box-label{display:flex;align-items:center;gap:7px;color:var(--text-3);font-size:11px;text-transform:uppercase;letter-spacing:.06em;font-weight:700;margin-bottom:6px}
.pl-inv-box-label svg{width:14px;height:14px;color:var(--brand);flex-shrink:0}
.pl-inv-numrow{display:flex;align-items:center;gap:12px}
.pl-inv-doc-ic{width:40px;height:40px;border-radius:11px;display:grid;place-items:center;flex-shrink:0;color:var(--brand);background:linear-gradient(150deg,rgba(56,189,248,.2),rgba(14,165,233,.05));border:1px solid rgba(56,189,248,.28)}
.pl-inv-doc-ic svg{width:21px;height:21px}
.pl-inv-card-title{display:flex;align-items:center;gap:9px;padding:15px 20px;border-bottom:1px solid var(--border);font-family:var(--sans);font-weight:700;font-size:14px;color:var(--text)}
.pl-inv-card-title svg{width:17px;height:17px;color:var(--brand);flex-shrink:0}
.pl-inv-ledger-head{display:flex;align-items:center;gap:9px}
.pl-inv-ledger-head svg{width:17px;height:17px;flex-shrink:0}
.pl-inv-box .v,.pl-inv-box address.v{color:var(--text-2) !important;font-size:13px;font-style:normal;line-height:1.65;margin:0}
.pl-inv-box .custom-select,.pl-inv-box select,.pl-inv-box .form-control{width:100%;background:var(--surface-2) !important;color:var(--text) !important;border:1px solid var(--border) !important;border-radius:var(--r-sm) !important;margin-top:2px}
.pl-inv-items{background:var(--surface);border:1px solid var(--border);border-radius:var(--r);overflow:hidden;margin-bottom:20px}
.pl-inv-items-head{display:flex;justify-content:space-between;padding:14px 20px;border-bottom:1px solid var(--border);color:var(--text-3);font-size:11px;text-transform:uppercase;letter-spacing:.05em;font-weight:700}
.pl-inv-item{display:flex;justify-content:space-between;gap:16px;padding:14px 20px;border-bottom:1px solid var(--border-soft);font-size:13.5px}
.pl-inv-item .d{color:var(--text-2);flex:1;min-width:0;word-break:break-word}
.pl-inv-item .a{color:var(--text);font-weight:700;font-family:var(--mono);white-space:nowrap;flex-shrink:0;text-align:right}
.pl-inv-totals{padding:12px 20px 16px;background:rgba(56,189,248,.035)}
.pl-inv-totals .row{display:flex;justify-content:space-between;padding:5px 0;font-size:13.5px;color:var(--text-2)}
.pl-inv-totals .row b{color:var(--text);font-family:var(--mono)}
.pl-inv-totals .grand{border-top:1px solid var(--border);margin-top:6px;padding-top:12px}
.pl-inv-totals .grand span{color:var(--text);font-weight:700;font-family:var(--sans);font-size:15px}
.pl-inv-totals .grand b{color:var(--brand);font-weight:800;font-size:20px;font-family:var(--sans)}
.pl-inv-ledger{background:var(--surface);border:1px solid var(--border);border-radius:var(--r);overflow:hidden;margin-bottom:20px}
.pl-inv-ledger-head{padding:13px 20px;background:linear-gradient(135deg,var(--brand),var(--brand-2));color:#04121c;font-weight:700;font-family:var(--sans)}
.pl-inv-ledger .table{margin:0;color:var(--text-2)}
.pl-inv-ledger .table td{padding:11px 14px !important;color:var(--text-2) !important;font-size:12.5px;border-color:var(--border-soft) !important;background:transparent !important;text-align:left !important;vertical-align:middle}
.pl-inv-ledger .table td:last-child{text-align:right !important}
.pl-inv-ledger .table td[colspan]{text-align:center !important}
.pl-inv-ledger thead td{color:var(--text-3) !important;font-size:10.5px;text-transform:uppercase;letter-spacing:.04em;font-weight:700}
.pl-inv-ledger .table td a{color:var(--brand) !important}
.pl-inv-balance{display:flex;justify-content:space-between;padding:14px 20px;border-top:1px solid var(--border);font-family:var(--sans)}
.pl-inv-balance span{color:var(--text);font-weight:700}
.pl-inv-balance b{color:var(--brand);font-weight:800}
@media(max-width:640px){
  .pl-inv-hero{flex-direction:column}
  .pl-inv-hero-r{text-align:left;min-width:0}
  .pl-inv-topbar{flex-direction:column;align-items:stretch}
  .pl-inv-total{font-size:30px}
}

/* ---------- brand preloader (real logo) ---------- */
#plLoader{position:fixed;inset:0;z-index:9999;display:grid;place-items:center;
  background:radial-gradient(620px 420px at 50% 42%,rgba(56,189,248,.10),transparent 60%),var(--bg);
  transition:opacity .3s ease,visibility .3s ease;
  animation:plLoaderFailsafe 0s linear 2.6s forwards}
html.pl-loaded #plLoader{opacity:0;visibility:hidden;pointer-events:none;animation:none}
@keyframes plLoaderFailsafe{to{opacity:0;visibility:hidden;pointer-events:none}}
.pl-load-in{display:flex;flex-direction:column;align-items:center;gap:20px}
.pl-load-mark{position:relative;width:92px;height:92px;display:grid;place-items:center;animation:plFly 1.7s ease-in-out infinite}
.pl-load-mark::before{content:"";position:absolute;width:122px;height:122px;border-radius:50%;
  background:radial-gradient(circle,rgba(56,189,248,.34),transparent 62%);animation:plGlow 1.7s ease-in-out infinite}
.pl-load-mark img{position:relative;width:80px;height:80px;filter:drop-shadow(0 8px 22px rgba(56,189,248,.55))}
.pl-load-txt{font-family:var(--sans);font-weight:700;font-size:15.5px;letter-spacing:.14em;text-transform:uppercase;
  background:linear-gradient(90deg,#5bc4f5 0%,#eaf8ff 50%,#5bc4f5 100%);background-size:200% 100%;
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;
  animation:plShimmer 2.2s linear infinite}
.pl-load-bar{width:190px;height:3px;border-radius:3px;background:rgba(125,211,252,.13);overflow:hidden}
.pl-load-bar i{display:block;height:100%;border-radius:3px;transform-origin:left;
  background:linear-gradient(90deg,#0ea5e9,#7dd3fc);box-shadow:0 0 10px rgba(56,189,248,.6);
  animation:plLoadFill 1.2s ease-in-out infinite}
@keyframes plGlow{0%,100%{transform:scale(.8);opacity:.45}50%{transform:scale(1.14);opacity:1}}
@keyframes plFly{0%{transform:translate(0,3px) rotate(-7deg)}25%{transform:translate(8px,-9px) rotate(6deg)}50%{transform:translate(0,-15px) rotate(-4deg)}75%{transform:translate(-8px,-7px) rotate(7deg)}100%{transform:translate(0,3px) rotate(-7deg)}}
@keyframes plShimmer{to{background-position:-200% 0}}
@keyframes plLoadFill{0%{transform:scaleX(0);transform-origin:left}48%{transform:scaleX(1);transform-origin:left}52%{transform:scaleX(1);transform-origin:right}100%{transform:scaleX(0);transform-origin:right}}
@media(prefers-reduced-motion:reduce){.pl-load-mark,.pl-load-mark::before,.pl-load-txt,.pl-load-bar i{animation:none !important}}

/* ---------- responsive ---------- */
.pl-burger{display:none}
@media(max-width:1050px){
  .pl-stats{grid-template-columns:repeat(2,1fr)}
  .pl-servers{grid-template-columns:repeat(2,1fr)}
  .pl-search{max-width:220px}
}
@media(max-width:860px){
  .pl-side{position:fixed;left:0;top:0;z-index:60;transform:translateX(-100%);transition:.2s;box-shadow:var(--shadow-lg)}
  body.pl-side-open{overflow:hidden}
  body.pl-side-open .pl-side{transform:none}
  body.pl-side-open::before{content:"";position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:55}
  .pl-burger{display:grid}
  .pl-content{padding:16px}
  .pl-top{padding:0 14px}
  [dir=rtl] .pl-side{left:auto;right:0;transform:translateX(100%)}
  [dir=rtl] body.pl-side-open .pl-side{transform:none}
  .dataTables_filter,.dataTables_length{display:block;float:none;margin-bottom:10px;text-align:left}
  .dataTables_filter label .form-control{width:100% !important;max-width:100% !important}
}
@media(max-width:640px){
  .pl-stats,.pl-servers{grid-template-columns:1fr}
  .pl-search{max-width:150px}
  .pl-welcome-art{display:none}
  .pl-welcome{padding:20px}
}
@media(max-width:600px){
  .verification-banner .row{flex-direction:column;align-items:stretch}
  .verification-banner .col-10,.verification-banner .col-sm-7,.verification-banner .col-md-8,
  .verification-banner .col-12,.verification-banner .col-sm-4,.verification-banner .col-md-3{flex:1 1 100% !important}
  .verification-banner .btn-block{width:100% !important;display:block !important}
}
@media(max-width:480px){
  .pl-authpane .card-body{padding:26px 20px !important}
}
/* ===== QUALITY PACK — premium details ===== */
/* custom scrollbars (token-colored, thin) */
html{scrollbar-width:thin;scrollbar-color:var(--surface-3) transparent}
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:var(--surface-3);border-radius:99px;border:2px solid transparent;background-clip:content-box}
::-webkit-scrollbar-thumb:hover{background:rgba(56,189,248,.4);border:2px solid transparent;background-clip:content-box}
::-webkit-scrollbar-corner{background:transparent}
/* keyboard focus ring — brand, consistent */
a:focus-visible,button:focus-visible,.btn:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--brand) !important;outline-offset:2px;border-radius:6px}
/* bootstrap modals — papilio surface */
.modal-content{background:var(--surface) !important;border:1px solid var(--border) !important;border-radius:16px !important;box-shadow:var(--shadow-lg) !important;color:var(--text)}
.modal-header{border-bottom:1px solid var(--border-soft) !important}
.modal-footer{border-top:1px solid var(--border-soft) !important}
.modal-title{color:var(--text);font-family:var(--sans);font-weight:700}
.modal-body{color:var(--text-2)}
.modal .close{color:var(--text-3);opacity:1;text-shadow:none}
.modal .close:hover{color:var(--text)}
.modal-backdrop{background:rgba(2,6,14,.72) !important}
.modal-backdrop.show{opacity:.9 !important;backdrop-filter:blur(4px)}
/* CRITICAL: .pl-main{position:relative;z-index:1} creates a stacking context that traps
   Bootstrap modals (z-index 1050) BELOW the body-level .modal-backdrop (1040) -> the backdrop
   covers the modal, all clicks are captured, the whole page appears frozen. While any modal is
   open, drop .pl-main's stacking context so the modal escapes to the root context and sits above
   the backdrop. (Can't append the modal to <body>: its submit button must stay inside the cart form.) */
body.modal-open .pl-main,body.modal-open .pl-authpane,body.modal-open .pl-content{z-index:auto !important}
/* guest layout: overflow clip on the wrap must not affect the open modal layer */
body.modal-open .pl-authwrap{overflow:visible}
.modal{z-index:100050 !important}
.modal-backdrop{z-index:100040 !important}
/* dropdown menus */
.dropdown-menu{background:var(--surface) !important;border:1px solid var(--border) !important;border-radius:12px !important;box-shadow:var(--shadow-lg) !important;padding:6px !important;overflow:hidden}
.dropdown-menu .dropdown-item{color:var(--text-2) !important;border-radius:8px;padding:8px 12px;font-size:13.5px;transition:.12s}
.dropdown-menu .dropdown-item:hover{background:var(--surface-2) !important;color:var(--text) !important}
.dropdown-divider{border-color:var(--border-soft) !important}
/* tabular numerals — amounts and tables line up like a terminal */
.table td,.pl-inv-item .a,.pl-inv-totals b,.pl-inv-total,.amt,.pl-stat .n,.pl-vzc-metric .mv{font-variant-numeric:tabular-nums}
/* top navigation progress bar */
#plNav{position:fixed;top:0;left:0;height:2.5px;width:0;z-index:99999;opacity:0;pointer-events:none;background:linear-gradient(90deg,var(--brand),var(--brand-2));box-shadow:0 0 10px var(--brand-glow);transition:width .45s cubic-bezier(.2,.7,.3,1),opacity .3s;border-radius:0 3px 3px 0}
/* smooth theme switch (class added briefly on toggle) */
html.pl-anim,html.pl-anim *,html.pl-anim *::before,html.pl-anim *::after{transition:background-color .32s ease,color .22s ease,border-color .32s ease,box-shadow .32s ease,fill .22s ease,stroke .22s ease !important}
@media(prefers-reduced-motion:reduce){html.pl-anim,html.pl-anim *{transition:none !important}#plNav{transition:none}}

/* ===== fix leftover WHMCS toggle widgets (toggle-switch-success / no-icheck) — the plugin isn't loaded, so style the raw checkbox as a clean brand switch (register mailing opt-in, security SSO, etc.) ===== */
input.toggle-switch-success,input.no-icheck[type=checkbox]{-webkit-appearance:none;appearance:none;width:46px;height:26px;border-radius:99px;background:var(--surface-3);border:1px solid var(--border);position:relative;cursor:pointer;vertical-align:middle;flex-shrink:0;transition:background .2s,border-color .2s;margin:0}
input.toggle-switch-success::before,input.no-icheck[type=checkbox]::before{content:"";position:absolute;top:2px;left:2px;width:20px;height:20px;border-radius:50%;background:var(--text-3);transition:left .2s,background .2s;box-shadow:0 1px 3px rgba(0,0,0,.4)}
input.toggle-switch-success:checked,input.no-icheck[type=checkbox]:checked{background:linear-gradient(135deg,var(--brand),var(--brand-2));border-color:transparent}
input.toggle-switch-success:checked::before,input.no-icheck[type=checkbox]:checked::before{left:23px;background:#fff}
input.toggle-switch-success:focus-visible,input.no-icheck[type=checkbox]:focus-visible{outline:none;box-shadow:0 0 0 3px var(--brand-glow)}
[dir=rtl] input.toggle-switch-success:checked::before,[dir=rtl] input.no-icheck[type=checkbox]:checked::before{left:2px;right:23px}

/* ===== page header row (title + primary CTA) — reusable ===== */
.pl-page-head{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin:2px 0 20px}
.pl-page-head .pl-hello{margin:0}
.pl-cta{display:inline-flex;align-items:center;gap:9px;padding:11px 22px;border-radius:100px;background:var(--accent);color:var(--accent-ink) !important;font-family:var(--sans);font-weight:700;font-size:14px;border:1px solid var(--accent);box-shadow:0 10px 26px -12px var(--brand-glow);transition:.15s;white-space:nowrap}
.pl-cta:hover{background:var(--brand-2);border-color:var(--brand-2);color:#fff !important;transform:translateY(-1px)}
.pl-cta svg{width:17px;height:17px;flex-shrink:0}
.pl-empty-sub{color:var(--text-2);font-size:13.5px;margin:8px 0 18px;max-width:44ch;line-height:1.6}
.pl-empty .pl-cta{margin-top:2px}
.pl-cta-ghost{background:var(--surface-2) !important;border-color:var(--border) !important;color:var(--text-2) !important;box-shadow:none}
.pl-cta-ghost:hover{background:var(--surface-3) !important;border-color:rgba(56,189,248,.4) !important;color:#fff !important}
/* ===== ticket department picker ===== */
.pl-dept-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:14px}
.pl-dept{display:flex;align-items:center;gap:15px;padding:18px 20px;border-radius:var(--r);background:var(--surface);border:1px solid var(--border);box-shadow:var(--shadow);color:var(--text) !important;transition:.15s}
.pl-dept:hover{border-color:rgba(56,189,248,.45);background:var(--surface-2);transform:translateY(-2px);box-shadow:var(--shadow-lg)}
.pl-dept-ic{width:46px;height:46px;border-radius:13px;flex-shrink:0;display:grid;place-items:center;color:var(--brand);background:linear-gradient(150deg,rgba(56,189,248,.2),rgba(56,189,248,.05));border:1px solid rgba(56,189,248,.26)}
.pl-dept-ic svg{width:22px;height:22px}
.pl-dept-tx{display:flex;flex-direction:column;min-width:0;flex:1}
.pl-dept-tx .nm{font-family:var(--sans);font-weight:700;font-size:15px;color:var(--text)}
.pl-dept-tx .ds{color:var(--text-3);font-size:12.5px;margin-top:3px;line-height:1.5}
.pl-dept-arrow{width:18px;height:18px;color:var(--text-3);flex-shrink:0;transition:transform .15s,color .15s}
.pl-dept:hover .pl-dept-arrow{color:var(--brand);transform:translateX(3px)}
[dir=rtl] .pl-dept-arrow{transform:scaleX(-1)}
[dir=rtl] .pl-dept:hover .pl-dept-arrow{transform:scaleX(-1) translateX(3px)}

/* RTL structural flips */
[dir=rtl] .pl-side{border-right:0;border-left:1px solid var(--border)}
[dir=rtl] .pl-nav a.active{box-shadow:inset -2px 0 0 var(--brand)}
[dir=rtl] .pl-nav a svg,[dir=rtl] .pl-side-user .out{margin:0}
[dir=rtl] .pl-hero{border-right:0;border-left:1px solid rgba(255,255,255,.05)}
[dir=rtl] .pl-authpane .input-group-text{border-radius:0 !important}
[dir=rtl] .pl-srv-meta .mrow b{text-align:left}
/* login password-reveal button contrast */
.pl-authpane .btn-reveal-pw{background:rgba(255,255,255,.06) !important;border-color:var(--border) !important;color:var(--text-2) !important}
.pl-authpane .btn-reveal-pw:hover{background:rgba(255,255,255,.12) !important;color:#fff !important}

/* ===== ACCOUNT DETAILS (clientareadetails) — custom papilio, de-twenty-one ===== */
.pl-acct{width:100%;max-width:none}
.pl-acct-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--r);box-shadow:var(--shadow);padding:22px 24px;margin-bottom:18px}
.pl-acct-head{display:flex;align-items:center;gap:12px;margin-bottom:20px;padding-bottom:15px;border-bottom:1px solid var(--border-soft)}
.pl-acct-ic{width:38px;height:38px;border-radius:11px;flex-shrink:0;display:grid;place-items:center;color:var(--brand);background:linear-gradient(150deg,rgba(56,189,248,.18),rgba(56,189,248,.05));border:1px solid rgba(56,189,248,.24)}
.pl-acct-ic svg{width:20px;height:20px}
.pl-acct-head h3{margin:0;font-family:var(--sans);font-size:16px;font-weight:700;color:var(--text)}
.pl-acct-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 22px}
.pl-acct .pl-fg{margin-bottom:16px;min-width:0}
.pl-acct .pl-fg-full{grid-column:1/-1}
.pl-acct .pl-fg>label{display:block;font-size:11.5px;font-weight:700;color:var(--text-3);text-transform:uppercase;letter-spacing:.045em;margin-bottom:7px}
.pl-acct .pl-fg .form-control,.pl-acct .pl-fg select,.pl-acct .pl-fg .custom-select,.pl-acct .pl-fg .control>select,.pl-acct .pl-fg .control>input,.pl-acct .pl-fg .control>textarea{width:100%}
.pl-acct .pl-fg .iti{width:100%;display:block}
.pl-fg-hint{display:block;margin-top:6px;color:var(--text-3);font-size:12px;line-height:1.5}
.pl-acct-note{color:var(--text-2);font-size:13.5px;margin:-4px 0 18px;line-height:1.6}
/* email-preference checkboxes — brand, not pink */
.pl-acct-checks{display:flex;flex-direction:column;gap:2px}
.pl-check{display:flex;align-items:center;gap:12px;padding:11px 13px;border-radius:var(--r-sm);cursor:pointer;transition:background .13s,color .13s;color:var(--text-2);font-weight:600;font-size:13.5px;margin:0}
.pl-check:hover{background:var(--surface-2);color:var(--text)}
.pl-check input[type=checkbox]{-webkit-appearance:none;appearance:none;width:19px;height:19px;flex-shrink:0;margin:0;border:1.5px solid var(--border);border-radius:6px;background:var(--surface-2);cursor:pointer;position:relative;transition:.13s}
.pl-check input[type=checkbox]:hover{border-color:rgba(56,189,248,.5)}
.pl-check input[type=checkbox]:checked{background:linear-gradient(135deg,var(--brand),var(--brand-2));border-color:transparent}
.pl-check input[type=checkbox]:checked::after{content:"";position:absolute;left:6px;top:2.5px;width:5px;height:9px;border:solid #04121c;border-width:0 2.4px 2.4px 0;transform:rotate(43deg)}
.pl-check input[type=checkbox]:focus-visible{outline:none;box-shadow:0 0 0 3px var(--brand-glow)}
.pl-check input:checked~span{color:var(--text)}
/* marketing opt-in — custom switch */
.pl-switch{display:inline-flex;align-items:center;gap:13px;cursor:pointer;user-select:none;margin:0}
.pl-switch input{position:absolute;opacity:0;width:0;height:0;pointer-events:none}
.pl-switch-track{width:48px;height:27px;border-radius:99px;background:var(--surface-3);border:1px solid var(--border);position:relative;flex-shrink:0;transition:background .2s,border-color .2s}
.pl-switch-thumb{position:absolute;top:2px;left:2px;width:21px;height:21px;border-radius:50%;background:var(--text-3);transition:left .2s,background .2s;box-shadow:0 1px 3px rgba(0,0,0,.4)}
.pl-switch input:checked+.pl-switch-track{background:linear-gradient(135deg,var(--brand),var(--brand-2));border-color:transparent}
.pl-switch input:checked+.pl-switch-track .pl-switch-thumb{left:23px;background:#fff}
.pl-switch input:focus-visible+.pl-switch-track{box-shadow:0 0 0 3px var(--brand-glow)}
.pl-switch-state{font-family:var(--sans);font-weight:700;font-size:14px;color:var(--text-2)}
.pl-switch input:checked~.pl-switch-state{color:var(--brand)}
/* actions */
.pl-acct-actions{display:flex;gap:12px;justify-content:flex-end;margin-top:2px;flex-wrap:wrap}
.pl-acct-save{display:inline-flex;align-items:center;gap:8px;padding:11px 26px;border-radius:100px;border:1px solid var(--accent);background:var(--accent);color:var(--accent-ink);font-family:var(--sans);font-weight:700;font-size:14px;cursor:pointer;box-shadow:0 10px 26px -12px var(--brand-glow);transition:.15s}
.pl-acct-save:hover{background:var(--brand-2);border-color:var(--brand-2);color:#fff;transform:translateY(-1px)}
.pl-acct-save svg{width:17px;height:17px}
.pl-acct-cancel{padding:11px 22px;border-radius:100px;border:1px solid var(--border);background:var(--surface-2);color:var(--text-2);font-family:var(--sans);font-weight:600;font-size:14px;cursor:pointer;transition:.15s}
.pl-acct-cancel:hover{background:var(--surface-3);color:#fff}
@media(max-width:640px){
  .pl-acct-grid{grid-template-columns:1fr}
  .pl-acct-card{padding:18px 16px}
  .pl-acct-actions{justify-content:stretch}
  .pl-acct-save,.pl-acct-cancel{flex:1;justify-content:center;text-align:center}
}

/* ===== SUPPORT TICKET (viewticket) — kill the white post-heading bar + markdown editor ===== */
.ticket-reply .posted-by{background:var(--surface-2) !important;border:1px solid var(--border-soft);border-radius:var(--r-sm);padding:11px 16px;color:var(--text-2);font-size:13px;display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-bottom:2px}
.ticket-reply .posted-by .posted-by-name{color:var(--text);font-weight:700}
.ticket-reply .posted-by .posted-on{color:var(--text-3)}
.ticket-reply .requestor-badge,.ticket-reply .posted-by .label{margin-left:auto;float:none !important;padding:3px 12px;border-radius:20px;font-size:11px;font-weight:700;letter-spacing:.02em;line-height:1.6}
.requestor-badge.requestor-type-owner,.requestor-badge.requestor-type-user{background:var(--green-bg) !important;color:#5edd8a !important}
.requestor-badge.requestor-type-admin,.requestor-badge.requestor-type-operator,.requestor-badge.requestor-type-staff{background:var(--blue-bg) !important;color:var(--brand) !important}
.requestor-badge.requestor-type-contact,.requestor-badge.requestor-type-cc,.requestor-badge.requestor-type-other{background:var(--surface-3) !important;color:var(--text-2) !important}
.ticket-reply.staff .posted-by{border-left:2px solid var(--brand)}
[dir=rtl] .ticket-reply.staff .posted-by{border-left:1px solid var(--border-soft);border-right:2px solid var(--brand)}
.ticket-reply.staff{background:rgba(56,189,248,.03)}
.ticket-reply .message{color:var(--text-2);line-height:1.7}
.ticket-reply .message hr{border-color:var(--border-soft)}
.ticket-reply .message a{color:var(--brand)}
.ticket-reply .message code,.ticket-reply .message pre{background:var(--surface) !important;border:1px solid var(--border-soft);border-radius:var(--r-xs);color:var(--text)}
.attachments .attachment-list .caption{color:var(--text-2)}
/* markdown editor (EasyMDE / CodeMirror) — was fully white */
.editor-toolbar{background:var(--surface-2) !important;border:1px solid var(--border) !important;border-bottom:0 !important;border-radius:var(--r-sm) var(--r-sm) 0 0;opacity:1}
.editor-toolbar button{color:var(--text-2) !important;background:transparent !important;border:0 !important;border-radius:var(--r-xs) !important}
.editor-toolbar button:hover,.editor-toolbar button.active{background:var(--surface-3) !important;color:#fff !important}
.editor-toolbar i.separator{border-left:1px solid var(--border) !important;border-right:0 !important}
.editor-toolbar.fullscreen{background:var(--bg) !important}
.CodeMirror{background:var(--surface-2) !important;color:var(--text) !important;border:1px solid var(--border) !important;border-radius:0 0 var(--r-sm) var(--r-sm)}
.CodeMirror-cursor{border-left-color:var(--brand) !important}
.CodeMirror-selected{background:rgba(56,189,248,.18) !important}
.CodeMirror-focused .CodeMirror-selected{background:rgba(56,189,248,.26) !important}
.CodeMirror-placeholder{color:var(--text-3) !important}
.CodeMirror .cm-header,.CodeMirror .cm-strong{color:#fff !important}
.CodeMirror .cm-link,.CodeMirror .cm-url,.CodeMirror .cm-string.cm-url{color:var(--brand) !important}
.CodeMirror .cm-comment,.CodeMirror .cm-quote{color:var(--text-3) !important}
.editor-preview,.editor-preview-side{background:var(--surface) !important;color:var(--text-2) !important;border-color:var(--border) !important}
.editor-preview-active,.editor-preview-active-side{background:var(--surface) !important}
.editor-preview a{color:var(--brand)}
.editor-statusbar{color:var(--text-3)}
/* attachment "Choose file" input (bootstrap custom-file) — was white */
.custom-file-label{background:var(--surface-2) !important;border:1px solid var(--border) !important;color:var(--text-2) !important;border-radius:var(--r-sm) !important}
.custom-file-label::after{background:var(--surface-3) !important;color:var(--text) !important;border-left:1px solid var(--border) !important}
.input-group-append .btn,.input-group-text{background:var(--surface-3) !important;border:1px solid var(--border) !important;color:var(--text-2) !important}

/* ===== ALERT call-to-action buttons (overdue-invoice "Pay Invoice" etc.) — solid brand, pops off the notice ===== */
.alert:not(.verification-banner) .btn,.alert:not(.verification-banner) a.btn{background:var(--brand) !important;border:1px solid var(--brand) !important;color:var(--accent-ink) !important;font-weight:700 !important;border-radius:100px !important;padding:7px 18px !important;box-shadow:0 6px 16px -8px var(--brand-glow) !important;white-space:nowrap;transition:.15s}
.alert:not(.verification-banner) .btn:hover,.alert:not(.verification-banner) a.btn:hover{background:var(--brand-2) !important;border-color:var(--brand-2) !important;color:#fff !important;transform:translateY(-1px)}
/* vertically CENTER the button in the notice (was sitting at the bottom of the line) */
.alert:not(.verification-banner):has(.btn){display:flex;align-items:center;flex-wrap:wrap;gap:6px 12px}
.alert:not(.verification-banner):has(.btn)>.btn,.alert:not(.verification-banner):has(.btn) a.btn{margin-left:auto;vertical-align:middle}
/* fallback for browsers without :has — keep the button mid-line */
.alert:not(.verification-banner) .btn{vertical-align:middle}
/* attachment "+ Add More" / Browse — center in the row too */
.attachment-group,.input-group.attachment-group{align-items:center}

/* ===== SERVICE / PRODUCT DETAILS overview — branded hero + clean meta ===== */
.pl-svc-cols{display:grid;grid-template-columns:1fr 1.05fr;gap:26px;align-items:start}
.pl-svc-hero{position:relative;overflow:hidden;text-align:center;padding:32px 24px 26px;border-radius:var(--r);border:1px solid var(--border);box-shadow:var(--shadow);background:linear-gradient(165deg,rgba(56,189,248,.13),transparent 58%),var(--surface-2) !important}
.pl-svc-hero::before{content:"";position:absolute;top:-42%;left:50%;transform:translateX(-50%);width:220px;height:220px;background:radial-gradient(circle,var(--brand-glow),transparent 65%);pointer-events:none}
.pl-svc-hero-ic{position:relative;width:80px;height:80px;margin:0 auto 16px;border-radius:50%;display:grid;place-items:center;color:var(--brand);background:linear-gradient(150deg,rgba(56,189,248,.24),rgba(14,165,233,.06));border:1px solid rgba(56,189,248,.32);box-shadow:0 14px 34px -14px var(--brand-glow),inset 0 1px 0 rgba(255,255,255,.08)}
.pl-svc-hero-ic svg{width:36px;height:36px}
.pl-svc-hero-name{position:relative;font-family:var(--sans);font-size:22px;font-weight:800;color:var(--text);margin:0 0 5px;letter-spacing:-.01em}
.pl-svc-hero-group{position:relative;font-size:11.5px;color:var(--text-3);font-weight:700;margin:0 0 16px;text-transform:uppercase;letter-spacing:.06em}
.pl-svc-hero-status{position:relative;display:inline-block;padding:6px 18px;border-radius:22px;font-size:11.5px;font-weight:800;text-transform:uppercase;letter-spacing:.05em}
.pl-st-active,.pl-st-completed{background:var(--green-bg);color:var(--green)}
.pl-st-pending{background:var(--blue-bg);color:var(--brand)}
.pl-st-suspended,.pl-st-fraud{background:var(--red-bg);color:var(--red)}
.pl-st-terminated,.pl-st-cancelled{background:var(--surface-3);color:var(--text-2)}
.pl-svc-actions{display:flex;flex-direction:column;gap:10px;margin-top:16px}
.pl-svc-actions .btn{border-radius:var(--r-sm) !important;font-weight:700 !important;display:flex;align-items:center;justify-content:center;gap:8px}
.pl-svc-meta{display:flex;flex-direction:column}
.pl-svc-row{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:13px 2px;border-bottom:1px solid var(--border-soft)}
.pl-svc-row:last-child{border-bottom:0}
.pl-svc-row .k{display:flex;align-items:center;gap:10px;color:var(--text-3);font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.03em}
.pl-svc-row .k svg{width:16px;height:16px;color:var(--brand);flex-shrink:0}
.pl-svc-row .v{color:var(--text);font-weight:700;font-family:var(--sans);font-size:14.5px;text-align:right;word-break:break-word}
@media(max-width:768px){.pl-svc-cols{grid-template-columns:1fr;gap:18px}}
/* copyable primary-IP chip in the service hero */
.pl-svc-hero-ip{display:inline-flex;align-items:center;gap:8px;margin-top:14px;padding:7px 14px;border-radius:99px;background:var(--surface);border:1px solid var(--border);color:var(--text);font-family:var(--mono);font-size:13px;font-weight:600;cursor:pointer;transition:.15s}
.pl-svc-hero-ip:hover{border-color:rgba(56,189,248,.5);color:#fff}
.pl-svc-hero-ip svg{width:14px;height:14px;color:var(--brand);flex-shrink:0}
.pl-svc-hero-ip .cp{opacity:.45}
.pl-svc-hero-ip:hover .cp{opacity:1}
.pl-svc-hero-ip.copied{border-color:var(--green);color:var(--green)}
.pl-svc-hero-ip.copied .cp{color:var(--green)}

/* ===== native VPS Control card (Virtualizor actions, papilio-native) ===== */
.pl-vzc{margin-bottom:18px;position:relative;overflow:hidden}
.pl-vzc::before{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,var(--brand),var(--brand-2) 30%,transparent 72%)}
.pl-vzc-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:18px;flex-wrap:wrap}
.pl-vzc-title{display:flex;align-items:center;gap:11px;font-family:var(--sans);font-weight:700;font-size:16px;color:var(--text)}
.pl-vzc-ic{width:34px;height:34px;border-radius:9px;display:grid;place-items:center;color:var(--brand);background:linear-gradient(150deg,rgba(56,189,248,.18),rgba(56,189,248,.05));border:1px solid rgba(56,189,248,.24);flex-shrink:0}
.pl-vzc-ic svg{width:18px;height:18px}
.pl-vzc-power{display:inline-flex;align-items:center;gap:8px;padding:6px 15px;border-radius:99px;font-weight:700;font-size:12.5px;background:var(--surface-2);border:1px solid var(--border);color:var(--text-2)}
.pl-vzc-power .dot{width:8px;height:8px;border-radius:50%;background:var(--text-3);flex-shrink:0}
.pl-vzc-power.on{background:var(--green-bg);border-color:transparent;color:var(--green)}
.pl-vzc-power.on .dot{background:var(--green);box-shadow:0 0 8px var(--green)}
.pl-vzc-power.off{background:var(--red-bg);border-color:transparent;color:var(--red)}
.pl-vzc-power.off .dot{background:var(--red)}
.pl-vzc-power.na{background:var(--amber-bg);border-color:transparent;color:var(--amber)}
.pl-vzc-power.na .dot{background:var(--amber)}
.pl-vzc-power.loading .dot{animation:plPulse 1s infinite}
@keyframes plPulse{50%{opacity:.25}}
.pl-vzc-actions.pl-vzc-na{opacity:.42;pointer-events:none;filter:saturate(.4)}
.pl-vzc-statuswrap{display:flex;align-items:center;gap:8px}
.pl-vzc-refresh{width:34px;height:34px;border-radius:9px;border:1px solid var(--border);background:var(--surface-2);color:var(--text-2);display:grid;place-items:center;cursor:pointer;transition:.15s;flex-shrink:0}
.pl-vzc-refresh:hover{color:var(--brand);border-color:rgba(56,189,248,.4)}
.pl-vzc-refresh svg{width:16px;height:16px}
.pl-vzc-refresh.spin svg{animation:plSpin .8s linear infinite}
@keyframes plSpin{to{transform:rotate(360deg)}}
.pl-vzc-specs{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin-bottom:18px}
.pl-vzc-specs:empty{display:none}
.pl-vzc-chip{display:flex;align-items:center;gap:11px;padding:12px 14px;border-radius:var(--r-sm);background:var(--surface-2);border:1px solid var(--border);min-width:0}
.pl-vzc-chip svg{width:20px;height:20px;color:var(--brand);flex-shrink:0}
.pl-vzc-chip .tx{display:flex;flex-direction:column;min-width:0}
.pl-vzc-chip .l{font-size:10.5px;text-transform:uppercase;letter-spacing:.05em;color:var(--text-3);font-weight:700}
.pl-vzc-chip .v{font-size:13.5px;color:var(--text);font-weight:700;font-family:var(--sans);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pl-vzc-actions{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:4px}
.pl-vzc-btn{display:flex;align-items:center;justify-content:center;gap:8px;padding:13px;border-radius:var(--r-sm);font-family:var(--sans);font-weight:700;font-size:13.5px;border:1px solid var(--border);background:var(--surface-2);color:var(--text) !important;transition:.15s;cursor:pointer}
.pl-vzc-btn svg{width:16px;height:16px;flex-shrink:0}
.pl-vzc-btn:hover{transform:translateY(-1px)}
.pl-vzc-btn.on{color:var(--green) !important}
.pl-vzc-btn.on:hover{background:var(--green-bg);border-color:var(--green)}
.pl-vzc-btn.re{color:var(--brand) !important}
.pl-vzc-btn.re:hover{background:var(--blue-bg);border-color:var(--brand)}
.pl-vzc-btn.off,.pl-vzc-btn.po{color:var(--text-2) !important}
.pl-vzc-btn.off:hover,.pl-vzc-btn.po:hover{background:var(--red-bg);border-color:var(--red);color:var(--red) !important}
.pl-vzc-usage{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px;margin-top:16px}
.pl-vzc-usage:empty{display:none}
.pl-vzc-metric .mh{display:flex;justify-content:space-between;font-size:12.5px;color:var(--text-2);margin-bottom:7px}
.pl-vzc-metric .mv{font-family:var(--mono);color:var(--text);font-weight:700}
.pl-vzc-metric .mbar{height:8px;border-radius:99px;background:var(--surface-3);overflow:hidden}
.pl-vzc-metric .mbar i{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,var(--brand),var(--brand-2))}
.pl-vzc-raw{margin-top:16px}
.pl-vzc-raw summary{cursor:pointer;color:var(--text-3);font-size:12px;font-weight:600}
.pl-vzc-raw pre{margin-top:8px;max-height:280px;overflow:auto;background:var(--bg);border:1px solid var(--border);border-radius:var(--r-sm);padding:12px;font-size:11.5px;line-height:1.5;color:var(--text-2);font-family:var(--mono)}
@media(max-width:640px){.pl-vzc-actions{grid-template-columns:repeat(2,1fr)}}
/* actions grid also fits 5 buttons */
.pl-vzc-actions{grid-template-columns:repeat(auto-fit,minmax(140px,1fr))}
.pl-vzc-btn.ri{color:var(--amber) !important}
.pl-vzc-btn.ri:hover{background:var(--amber-bg);border-color:var(--amber)}
.pl-vzc-btn.adv{color:var(--violet) !important}
.pl-vzc-btn.adv:hover{background:var(--violet-bg);border-color:var(--violet)}
.pl-vzc-btn.danger{background:var(--red-bg) !important;border-color:var(--red) !important;color:var(--red) !important}
.pl-vzc-btn.danger:disabled{opacity:.4;pointer-events:none}
/* IP chips row */
.pl-vzc-ips{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px}
.pl-vzc-ips:empty{display:none}
.pl-vzc-ips .pl-svc-hero-ip{margin-top:0}
/* reinstall panel */
.pl-vzc-reinstall{margin-top:16px;padding:18px;border-radius:var(--r-sm);border:1px solid rgba(251,191,36,.35);background:var(--amber-bg)}
.pl-vzc-reinstall .rh{display:flex;align-items:center;gap:10px;color:var(--amber);font-weight:700;font-size:13px;margin-bottom:14px}
.pl-vzc-reinstall .rh svg{width:18px;height:18px;flex-shrink:0}
.pl-vzc-reinstall .rg{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:12px}
.pl-vzc-reinstall .rf label{display:block;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--text-3);margin-bottom:6px}
.pl-vzc-reinstall .rp{display:flex;gap:8px}
.pl-vzc-reinstall .rp input{font-family:var(--mono)}
.pl-vzc-mini{width:38px;border-radius:var(--r-sm);border:1px solid var(--border);background:var(--surface-2);color:var(--text-2);cursor:pointer;font-size:15px}
.pl-vzc-mini:hover{color:var(--brand)}
.pl-vzc-reinstall .rc{display:flex;align-items:center;gap:9px;color:var(--text-2);font-size:13px;font-weight:600;margin-bottom:14px;cursor:pointer}
.pl-vzc-reinstall .rc input{width:16px;height:16px;accent-color:var(--red)}
.pl-vzc-reinstall .ra{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.pl-vzc-reinstall .ra .pl-vzc-btn{flex:0 0 auto;padding:10px 18px}
.pl-vzc-reinstall .rmsg{font-size:12.5px;color:var(--text-2);font-family:var(--mono);word-break:break-all}
@media(max-width:640px){.pl-vzc-reinstall .rg{grid-template-columns:1fr}}
/* bandwidth mini chart */
.pl-vzc-chart{margin-top:18px}
.pl-vzc-chart:empty{display:none}
.pl-vzc-chart .ct,.pl-vzc-tasks .ct{font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:var(--text-3);font-weight:700;margin-bottom:10px}
.pl-vzc-chart .cs{border-radius:var(--r-sm);background:var(--surface-2);border:1px solid var(--border-soft);padding:8px 6px 2px;position:relative;overflow:hidden}
.pl-vzc-chart .ctip{position:absolute;transform:translate(-50%,-100%);background:var(--surface);border:1px solid var(--border);border-radius:9px;padding:7px 11px;box-shadow:var(--shadow-lg);pointer-events:none;opacity:0;transition:opacity .12s;white-space:nowrap;z-index:5;display:flex;align-items:center;gap:9px;font-size:11.5px}
.pl-vzc-chart .ctip b{color:var(--text);font-family:var(--mono);font-weight:700}
.pl-vzc-chart .ctip .tt{color:var(--brand);font-weight:800;font-family:var(--mono)}
.pl-vzc-chart .ctip .ti{color:var(--green);font-family:var(--mono)}
.pl-vzc-chart .ctip .to{color:var(--amber);font-family:var(--mono)}
.pl-vzc-chart .cgl{position:absolute;width:0;border-left:1px dashed rgba(56,189,248,.5);pointer-events:none;opacity:0;transition:opacity .12s;z-index:4}
.pl-vzc-chart svg{display:block;max-width:100%}
.pl-vzc-chart .gl{stroke:var(--border-soft);stroke-width:1;stroke-dasharray:3 5}
.pl-vzc-chart .bl{stroke:var(--border);stroke-width:1}
.pl-vzc-chart .ln{fill:none;stroke:var(--brand);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.pl-vzc-chart .dt{fill:var(--brand);stroke:var(--surface);stroke-width:2}
.pl-vzc-chart .dl{fill:var(--text-3);font-size:10px;font-family:var(--body);text-anchor:middle}
.pl-vzc-chart .mx{fill:var(--text-3);font-size:10px;font-family:var(--mono);text-anchor:end}
.pl-vzc-chart .yl{fill:var(--text-3);font-size:9.5px;font-family:var(--mono);text-anchor:end}
/* tasks */
.pl-vzc-tasks{margin-top:18px}
.pl-vzc-tasks:empty{display:none}
.pl-vzc-tasks .tr{display:flex;align-items:center;gap:10px;padding:9px 4px;border-bottom:1px solid var(--border-soft);font-size:13px}
.pl-vzc-tasks .tr:last-child{border-bottom:0}
.pl-vzc-tasks .st{width:8px;height:8px;border-radius:50%;background:var(--text-3);flex-shrink:0}
.pl-vzc-tasks .st.ok{background:var(--green)}
.pl-vzc-tasks .st.run{background:var(--amber);animation:plPulse 1s infinite}
.pl-vzc-tasks .nm{color:var(--text);font-weight:600;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pl-vzc-tasks .tm{color:var(--text-3);font-size:11.5px;font-family:var(--mono);flex-shrink:0}

/* ===== product-details "Server Information" / domain / manage tab — tidy meta list (was floating centered text) ===== */
.product-details-tab-container{padding:8px 22px 16px}
.product-details-tab-container .tab-pane{padding-top:6px}
.product-details-tab-container .tab-pane>.row{max-width:600px;margin:0 auto;padding:12px 6px;border-bottom:1px solid var(--border-soft);align-items:baseline}
.product-details-tab-container .tab-pane>.row:last-child{border-bottom:0}
.product-details-tab-container .tab-pane .col-sm-5{color:var(--text-3)}
.product-details-tab-container .tab-pane .col-sm-5 strong{color:var(--text-3);font-weight:700;font-size:12px;text-transform:uppercase;letter-spacing:.04em}
.product-details-tab-container .tab-pane .col-sm-7{color:var(--text);font-weight:600;font-size:14px;font-family:var(--sans);line-height:1.7}
/* nav tabs above it — brand active underline, muted rest */
.nav-tabs{border-bottom:1px solid var(--border) !important;gap:2px}
.nav-tabs .nav-link{color:var(--text-3) !important;border:0 !important;border-bottom:2px solid transparent !important;font-weight:600;padding:11px 16px;background:transparent !important}
.nav-tabs .nav-link:hover{color:var(--text) !important;border-bottom-color:var(--border) !important}
.nav-tabs .nav-link.active{color:var(--brand) !important;border-bottom-color:var(--brand) !important;background:transparent !important}
.nav-tabs .nav-link i,.nav-tabs .nav-link svg{color:var(--brand)}

/* no domains sold - hide renewals entry in cart sidebar */
a[href*="gid=renewals"]{display:none !important}
/* configure-step polish */
#order-standard_cart .sub-heading span{background:var(--surface-2);color:var(--text);border:1px solid var(--border);border-radius:99px;padding:5px 16px;font-size:12px;font-weight:700;font-family:var(--sans)}
#order-standard_cart .alert a{color:var(--brand) !important;font-weight:700;text-decoration:underline}

/* ===== configure page rebuild (v101) ===== */
#order-standard_cart .secondary-cart-body>p:first-of-type{color:var(--text-3);font-size:13px;margin:0 0 18px}
#order-standard_cart .pl-cfg-hero{position:relative;background:linear-gradient(165deg,var(--surface-2),var(--surface));border:1px solid var(--border);border-radius:var(--r);padding:26px 28px;overflow:hidden;margin-bottom:22px;box-shadow:var(--shadow)}
#order-standard_cart .pl-cfg-hero::before{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,var(--brand),var(--brand-2) 35%,transparent 75%)}
#order-standard_cart .pl-cfg-hero .product-title{font-family:var(--sans);font-weight:800;font-size:26px;color:var(--text);margin:0 0 2px;letter-spacing:-.01em}
#order-standard_cart .pl-cfg-hero>p{color:var(--text-3);font-size:13px;margin-bottom:0}
#order-standard_cart .pl-cfg-feats{list-style:none;display:grid;grid-template-columns:repeat(auto-fill,minmax(215px,1fr));gap:10px 20px;padding:18px 0 0;margin:16px 0 0;border-top:1px dashed var(--border)}
#order-standard_cart .pl-cfg-feats li{display:flex;align-items:center;gap:10px;color:var(--text-2);font-size:13.2px;margin:0}
#order-standard_cart .pl-cfg-feats li svg{width:16px;height:16px;color:var(--brand);flex-shrink:0}
#order-standard_cart .pl-cycle{display:flex;gap:10px;flex-wrap:wrap;margin-top:8px}
#order-standard_cart .pl-cycle-chip{background:var(--surface-2);border:1px solid var(--border);color:var(--text-2);border-radius:100px;padding:11px 24px;font-size:13.5px;font-weight:600;font-family:var(--sans);cursor:pointer;transition:.15s}
#order-standard_cart .pl-cycle-chip:hover{border-color:var(--brand);color:var(--text);transform:translateY(-1px)}
#order-standard_cart .pl-cycle-chip.on{background:var(--accent);border-color:var(--accent);color:var(--accent-ink);box-shadow:0 8px 22px -10px var(--brand-glow)}
#order-standard_cart select.pl-cycle-hidden{position:absolute !important;width:1px;height:1px;opacity:0;pointer-events:none;margin:0;padding:0;border:0;display:block}
#order-standard_cart .secondary-cart-sidebar{position:sticky;top:24px}
#order-standard_cart #btnCompleteProductConfig{width:100%;border-radius:100px;padding:13px 20px;font-weight:700;font-family:var(--sans);font-size:15px;margin-top:14px;background:var(--accent);border-color:var(--accent);color:var(--accent-ink);transition:.15s}
#order-standard_cart #btnCompleteProductConfig:hover{background:var(--brand-2);border-color:var(--brand-2);color:#fff;transform:translateY(-1px)}
#order-standard_cart .alert-warning.info-text-sm{background:var(--surface-2);border:1px solid var(--border);color:var(--text-3);border-radius:var(--r-sm)}
#order-standard_cart #frmConfigureProduct .form-group>label{font-size:11.5px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--text-3)}

/* ===== configure page structural rebuild (v102) ===== */
#order-standard_cart.pl-cfgx{max-width:1180px;margin:0 auto;float:none}
.pl-cfgx>.row{display:block;margin:0}
.pl-cfgx .cart-body{width:100% !important;float:none !important;padding:0 !important;flex:none !important;max-width:none !important}
.pl-cfgx-head{margin:4px 0 28px}
.pl-cfgx-steps{display:flex;align-items:center;gap:14px;margin-bottom:20px;flex-wrap:wrap}
.pl-cfgx-steps .st{display:inline-flex;align-items:center;gap:9px;font-family:var(--sans);font-size:13px;font-weight:600;color:var(--text-3);white-space:nowrap}
.pl-cfgx-steps .st i{font-style:normal;width:27px;height:27px;border-radius:50%;display:grid;place-items:center;background:var(--surface-2);border:1px solid var(--border);font-size:12.5px;font-weight:700}
.pl-cfgx-steps .st.done i{background:var(--green-bg);border-color:rgba(52,211,153,.4);color:var(--green)}
.pl-cfgx-steps .st.done{color:var(--text-2)}
.pl-cfgx-steps .st.on{color:var(--text)}
.pl-cfgx-steps .st.on i{background:var(--accent);border-color:var(--accent);color:var(--accent-ink);box-shadow:0 6px 16px -8px var(--brand-glow)}
.pl-cfgx-steps .sep{flex:0 0 36px;height:1px;background:var(--border)}
.pl-cfgx-head h1{font-family:var(--sans);font-weight:800;font-size:30px;letter-spacing:-.02em;color:var(--text);margin:0;border:0;padding:0}
.pl-cfgx #frmConfigureProduct>.row{display:grid;grid-template-columns:minmax(0,1fr) 350px;gap:26px;align-items:start;margin:0}
.pl-cfgx .secondary-cart-body{width:auto !important;float:none !important;padding:0 !important;flex:none !important;max-width:none !important}
.pl-cfgx .secondary-cart-sidebar{width:auto !important;float:none !important;padding:0 !important;position:sticky;top:24px;flex:none !important;max-width:none !important}
.pl-cfgx .secondary-cart-body>p:first-of-type{color:var(--text-3);font-size:13px;margin:0 0 16px}
.pl-cfgx .field-container{background:var(--surface);border:1px solid var(--border);border-radius:var(--r);padding:20px 22px;margin-bottom:6px}
.pl-cfgx .sub-heading{border:0;text-align:left;margin:24px 0 10px;background:none}
.pl-cfgx .sub-heading span{background:transparent !important;border:0 !important;padding:0 !important;color:var(--text) !important;font-size:14.5px;font-weight:800;font-family:var(--sans);text-transform:none;letter-spacing:-.01em;border-radius:0}
.pl-cfgx .order-summary{background:var(--surface);border:1px solid var(--border);border-radius:var(--r);padding:22px;box-shadow:var(--shadow);position:relative;overflow:hidden}
.pl-cfgx .order-summary::before{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,var(--brand),var(--brand-2) 40%,transparent 80%)}
.pl-cfgx .order-summary h2{font-family:var(--sans);font-weight:800;font-size:18px !important;color:var(--text);margin:0 0 14px}
@media(max-width:920px){.pl-cfgx #frmConfigureProduct>.row{grid-template-columns:1fr}.pl-cfgx .secondary-cart-sidebar{position:static}}

/* ===== funnel-wide polish (v103) ===== */
.pl-cfgx .row:has(> .secondary-cart-body){display:grid;grid-template-columns:minmax(0,1fr) 350px;gap:26px;align-items:start;margin:0}
@media(max-width:920px){.pl-cfgx .row:has(> .secondary-cart-body){grid-template-columns:1fr}}
.pl-cfgx .alert-danger{background:var(--red-bg);border:1px solid rgba(251,113,133,.35);color:var(--red);border-radius:var(--r-sm)}
.pl-cfgx .alert-warning{border-radius:var(--r-sm)}
.pl-cfgx .view-cart-items{margin-bottom:6px}
.pl-cfgx .view-cart-items .item{background:var(--surface);border:1px solid var(--border);border-radius:var(--r);padding:18px 20px;margin-bottom:14px;box-shadow:var(--shadow)}
.pl-cfgx .view-cart-items .item-title{font-family:var(--sans);font-weight:800;font-size:16px;color:var(--text)}
.pl-cfgx .view-cart-items .item-group{color:var(--text-3);font-size:12px}
.pl-cfgx .view-cart-items .item-price span{color:var(--brand);font-weight:800;font-family:var(--sans)}
.pl-cfgx .already-registered{background:var(--surface-2);border:1px solid var(--border);border-radius:var(--r-sm);padding:12px 16px;margin-bottom:18px}
.pl-cfgx .already-registered p{color:var(--text-2);margin:6px 0}
.pl-cfgx fieldset,.pl-cfgx .sub-heading+.field-container{margin-top:2px}
.pl-cfgx .order-summary .summary-container{font-variant-numeric:tabular-nums}
.pl-cfgx .pl-cfg-hero .product-title{display:flex;align-items:center;gap:12px}
.pl-cfgx input.form-control:focus,.pl-cfgx select:focus{border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-glow)}

/* ===== hero spec chips (v104) ===== */
.pl-cfgx .pl-cfg-specs{display:grid;grid-template-columns:repeat(auto-fill,minmax(235px,1fr));gap:10px;margin-top:18px;padding-top:18px;border-top:1px dashed var(--border)}
.pl-cfgx .pl-cfg-specs .sp{display:flex;align-items:center;gap:11px;background:rgba(255,255,255,.03);border:1px solid var(--border);border-radius:11px;padding:10px 14px;min-width:0}
.pl-cfgx .pl-cfg-specs .sp .ic{width:31px;height:31px;border-radius:8px;display:grid;place-items:center;background:linear-gradient(150deg,rgba(56,189,248,.16),rgba(56,189,248,.04));border:1px solid rgba(56,189,248,.22);color:var(--brand);flex-shrink:0}
.pl-cfgx .pl-cfg-specs .sp .ic svg{width:15px;height:15px}
.pl-cfgx .pl-cfg-specs .sp .tx{color:var(--text-2);font-size:12.8px;line-height:1.35;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pl-cfgx .pl-cfg-specs .sp .tx b,.pl-cfgx .pl-cfg-specs .sp .tx strong{color:var(--text);font-weight:700}

/* ===== section title + info bar specificity fix (v105) ===== */
#order-standard_cart.pl-cfgx .sub-heading,#order-standard_cart.pl-cfgx .sub-heading-borderless{height:auto;border-top:0;text-align:left;margin:26px 0 12px}
#order-standard_cart.pl-cfgx .sub-heading span,#order-standard_cart.pl-cfgx .sub-heading-borderless span{position:static;top:auto;display:inline-block;padding:0;background:transparent !important;border:0 !important;color:var(--text) !important;font-family:var(--sans);font-size:15px;font-weight:800;letter-spacing:-.01em;text-transform:none;border-radius:0}
#order-standard_cart.pl-cfgx .alert-warning.info-text-sm{background:var(--surface) !important;border:1px solid var(--border) !important;color:var(--text-3) !important;text-align:left !important;border-radius:var(--r-sm);padding:13px 16px}
#order-standard_cart.pl-cfgx .alert-warning.info-text-sm .fas{color:var(--brand)}

/* ===== order summary flatten (v106) ===== */
#order-standard_cart.pl-cfgx #orderSummary{background:var(--surface);border:1px solid var(--border);border-radius:var(--r);box-shadow:var(--shadow);padding:22px;position:relative;overflow:hidden}
#order-standard_cart.pl-cfgx #orderSummary::before{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,var(--brand),var(--brand-2) 40%,transparent 80%)}
#order-standard_cart.pl-cfgx #orderSummary .order-summary{background:transparent !important;border:0 !important;border-radius:0 !important;box-shadow:none !important;padding:0 !important;margin:0 !important;overflow:visible}
#order-standard_cart.pl-cfgx #orderSummary .order-summary::before{display:none}
#order-standard_cart.pl-cfgx .order-summary h2{text-align:left;padding:0;margin:0 0 16px;color:var(--text);font-family:var(--sans);font-weight:800;font-size:18px}
#order-standard_cart.pl-cfgx .summary-container{background:transparent !important;border:0 !important;border-radius:0 !important;box-shadow:none !important;padding:0 !important;min-height:0;font-size:13px;color:var(--text-2);font-variant-numeric:tabular-nums}
#order-standard_cart.pl-cfgx .order-summary .product-name{color:var(--text);font-size:15px;font-family:var(--sans);font-weight:800}
#order-standard_cart.pl-cfgx .order-summary .product-group{color:var(--text-3);font-style:normal;font-size:12px;margin:0 0 12px}
#order-standard_cart.pl-cfgx .order-summary .summary-totals{border-top:1px dashed var(--border);border-bottom:1px dashed var(--border);margin:14px 0 10px;padding:10px 0;color:var(--text-3)}
#order-standard_cart.pl-cfgx .order-summary .subtotal{border-bottom:0;font-size:13px;color:var(--text-2);padding:0}
#order-standard_cart.pl-cfgx .order-summary .total-due-today{border-top:0 !important;margin-top:10px}
#order-standard_cart.pl-cfgx .order-summary .total-due-today .amt{font-size:30px;color:var(--brand) !important;font-family:var(--sans);font-weight:800;letter-spacing:-.02em;line-height:1.1}
#order-standard_cart.pl-cfgx .order-summary .total-due-today span:not(.amt){color:var(--text-3);font-size:11.5px;text-transform:uppercase;letter-spacing:.06em;font-weight:700}
#order-standard_cart.pl-cfgx .order-summary .loader{color:var(--text-3)}
#order-standard_cart.pl-cfgx #btnCompleteProductConfig{margin-top:18px}

/* ===== view cart page (v107) ===== */
#order-standard_cart.pl-cfgx .view-cart-items-header{background:var(--surface-2) !important;border:1px solid var(--border);border-bottom:0;border-radius:12px 12px 0 0;color:var(--text-3) !important;font-weight:700;font-size:11.5px;text-transform:uppercase;letter-spacing:.05em;padding:12px 20px}
#order-standard_cart.pl-cfgx .view-cart-items{margin-bottom:10px}
#order-standard_cart.pl-cfgx .view-cart-items .item{background:var(--surface) !important;border:1px solid var(--border) !important;border-top:0 !important;border-radius:0;color:var(--text-2) !important;padding:18px 20px;margin:0}
#order-standard_cart.pl-cfgx .view-cart-items .item:last-child{border-radius:0 0 12px 12px}
#order-standard_cart.pl-cfgx .item-title{color:var(--text) !important;font-family:var(--sans);font-weight:800;font-size:15.5px}
#order-standard_cart.pl-cfgx .item-title .btn-link{color:var(--text-3) !important}
#order-standard_cart.pl-cfgx .item-title .btn-link:hover{color:var(--brand) !important}
#order-standard_cart.pl-cfgx .item-group{color:var(--text-3) !important;font-size:12px;font-style:normal}
#order-standard_cart.pl-cfgx .item-domain{color:var(--brand) !important;font-family:var(--mono,monospace);font-size:12.5px}
#order-standard_cart.pl-cfgx .item-price .cost{color:var(--brand) !important;font-family:var(--sans);font-weight:800;font-size:17px}
#order-standard_cart.pl-cfgx .item-price .cycle,#order-standard_cart.pl-cfgx .item-price .renewal-price{color:var(--text-3) !important;font-size:11.5px}
#order-standard_cart.pl-cfgx .btn-remove-from-cart{color:var(--text-3) !important}
#order-standard_cart.pl-cfgx .btn-remove-from-cart:hover{color:var(--red) !important}
#order-standard_cart.pl-cfgx .empty-cart .btn{background:var(--surface-2);border:1px solid var(--border);color:var(--text-2);border-radius:99px;font-weight:600}
#order-standard_cart.pl-cfgx .empty-cart .btn:hover{border-color:var(--red);color:var(--red)}
#order-standard_cart.pl-cfgx .view-cart-tabs{margin-top:24px}
#order-standard_cart.pl-cfgx .view-cart-tabs .nav-tabs{border-bottom:1px solid var(--border)}
#order-standard_cart.pl-cfgx .view-cart-tabs .nav-tabs a{color:var(--text-3);font-weight:700;font-size:13px;border:0;background:transparent}
#order-standard_cart.pl-cfgx .view-cart-tabs .nav-tabs li.active a,#order-standard_cart.pl-cfgx .view-cart-tabs .nav-tabs a.active{color:var(--brand);border-bottom:2px solid var(--brand);background:transparent}
#order-standard_cart.pl-cfgx .view-cart-tabs .tab-content{background:var(--surface) !important;border:1px solid var(--border) !important;border-radius:0 0 12px 12px;padding:18px 20px;color:var(--text-2)}
#order-standard_cart.pl-cfgx .view-cart-tabs .tab-content .form-control{background:rgba(255,255,255,.045) !important;border:1px solid var(--border) !important;color:var(--text) !important}
#order-standard_cart.pl-cfgx .view-cart-tabs .tab-content ::placeholder{color:var(--text-3)}
#order-standard_cart.pl-cfgx .view-cart-tabs .tab-content .btn-default{background:var(--accent) !important;border:1px solid var(--accent) !important;color:var(--accent-ink) !important;border-radius:99px;font-weight:700;font-family:var(--sans)}
#order-standard_cart.pl-cfgx .view-cart-tabs .tab-content .btn-default:hover{background:var(--brand-2) !important;border-color:var(--brand-2) !important;color:#fff !important}
#order-standard_cart.pl-cfgx .view-cart-tabs .prepend-icon i{color:var(--text-3)}
#order-standard_cart.pl-cfgx #orderSummary .bordered-totals{border-top:1px dashed var(--border);border-bottom:1px dashed var(--border);padding:8px 0;margin:8px 0;color:var(--text-3)}
#order-standard_cart.pl-cfgx #orderSummary #checkout{width:100%;border-radius:100px;padding:13px 20px;font-weight:700;font-family:var(--sans);font-size:15px;margin-top:18px;background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
#order-standard_cart.pl-cfgx #orderSummary #checkout:hover{background:var(--brand-2);border-color:var(--brand-2);color:#fff}
#order-standard_cart.pl-cfgx .view-cart-gateway-checkout{background:transparent}

/* ===== checkout page (v108) ===== */
#order-standard_cart.pl-cfgx .account-select-container{border-right:0 !important;margin:0 -6px !important}
#order-standard_cart.pl-cfgx .account-select-container>div[class*=col-]{padding:0 6px !important}
#order-standard_cart.pl-cfgx .account-select-container div.account{background:var(--surface) !important;border:1px solid var(--border) !important;border-radius:12px !important;padding:14px 16px !important;margin-bottom:10px;color:var(--text-2)}
#order-standard_cart.pl-cfgx .account-select-container div.account.active{background:linear-gradient(160deg,rgba(56,189,248,.10),rgba(56,189,248,.02)) !important;border-color:rgba(56,189,248,.38) !important}
#order-standard_cart.pl-cfgx .account-select-container .address strong{color:var(--text)}
#order-standard_cart.pl-cfgx .account-select-container .small{color:var(--text-3)}
#order-standard_cart.pl-cfgx .account-select-container .radio-inline{color:var(--text-2);width:100%;cursor:pointer;margin:0}
#order-standard_cart.pl-cfgx .account-select-container .label-info{background:rgba(56,189,248,.15) !important;color:var(--brand) !important;border-radius:99px;padding:2px 10px;font-weight:700}
#order-standard_cart.pl-cfgx .account-select-container .label-default{background:var(--surface-3) !important;color:var(--text-3) !important;border-radius:99px;padding:2px 10px}
#order-standard_cart.pl-cfgx #totalDueToday{background:linear-gradient(160deg,rgba(56,189,248,.12),rgba(56,189,248,.03)) !important;border:1px solid rgba(56,189,248,.3) !important;color:var(--text) !important;border-radius:var(--r-sm) !important;font-family:var(--sans);font-weight:700}
#order-standard_cart.pl-cfgx #totalDueToday span,#order-standard_cart.pl-cfgx #totalDueToday strong,#order-standard_cart.pl-cfgx #totalDueToday b{color:var(--brand) !important;font-weight:800}
#order-standard_cart.pl-cfgx .checkout-security-msg{background:var(--surface) !important;border:1px solid var(--border) !important;color:var(--text-3) !important;border-radius:var(--r-sm) !important}
#order-standard_cart.pl-cfgx .checkout-security-msg i{color:var(--brand) !important}
#order-standard_cart.pl-cfgx .checkout-security-msg strong,#order-standard_cart.pl-cfgx .checkout-security-msg b{color:var(--text-2) !important}
#order-standard_cart.pl-cfgx .radio-inline,#order-standard_cart.pl-cfgx .checkbox-inline{color:var(--text-2)}

/* ===== responsive QA pack (v109) ===== */
/* topbar at small phones: keep the page title readable */
@media(max-width:430px){
 .pl-top .pl-title-txt{font-size:13.5px;letter-spacing:0}
 .pl-top{gap:6px}
 .pl-top .pl-icbtn,.pl-top .pl-avatar{width:34px;height:34px}
}
/* mobile knowledgebase search reveal */
header.pl-top{position:relative}
@media(max-width:767px){
 header.pl-top.pl-search-open .pl-search{display:flex !important;position:absolute;top:calc(100% + 6px);left:10px;right:10px;z-index:80;background:var(--surface-2);border:1px solid var(--border);border-radius:11px;padding:9px 13px;box-shadow:var(--shadow)}
 header.pl-top.pl-search-open .pl-search input{background:transparent;border:0;color:var(--text);width:100%;outline:none}
}
/* email-verification banner: pin the dismiss X top-right at all sizes */
.verification-banner{position:relative;padding-right:44px}
.verification-banner .close,.verification-banner button.close{position:absolute;top:8px;right:12px;margin:0;float:none}
/* alerts with a CTA: stack text-first on phones */
@media(max-width:560px){
 .alert:not(.verification-banner):has(.btn){flex-direction:column;align-items:stretch;text-align:left}
 .alert:not(.verification-banner) .btn{order:9;margin-top:10px;width:100%}
}
/* funnel stepper: compact on phones, no orphan connectors */
@media(max-width:600px){
 .pl-cfgx-steps{gap:10px}
 .pl-cfgx-steps .sep{display:none}
 .pl-cfgx-steps .st{font-size:12px;gap:7px}
 .pl-cfgx-steps .st i{width:24px;height:24px;font-size:11.5px}
}
/* order summary: full width when the funnel stacks (beats scrollingPanel inline width) */
@media(max-width:920px){
 #order-standard_cart.pl-cfgx .secondary-cart-sidebar,#order-standard_cart.pl-cfgx #scrollingPanelContainer{width:100% !important;max-width:none !important;min-width:0 !important;float:none !important;position:static !important;left:auto !important;top:auto !important;margin:0 !important}
 #order-standard_cart.pl-cfgx #orderSummary{width:100% !important;max-width:none !important}
}
/* summary rows: flex so labels and values never collide */
#order-standard_cart.pl-cfgx #orderSummary .clearfix{display:flex;justify-content:space-between;gap:12px;align-items:baseline}
#order-standard_cart.pl-cfgx #orderSummary .clearfix .pull-right{text-align:right}
#order-standard_cart.pl-cfgx #orderSummary .total-due-today{padding:0 2px}
#order-standard_cart.pl-cfgx .empty-cart{margin-top:12px}
/* configure hero: remove dead space from stray breaks in the description */
.pl-cfgx .pl-cfg-hero p br{display:none}
.pl-cfgx .pl-cfg-hero p:empty{display:none;margin:0;padding:0}
.pl-cfgx .pl-cfg-hero>p{margin-bottom:0}
/* announcements: themed body text */
.pl-content .announcement-single p,.pl-content div[class*=announcement] p{color:var(--text-2)}

/* ===== micro-fixes (v110) ===== */
.verification-banner{position:relative}
#btnEmailVerificationClose{position:absolute !important;top:6px !important;right:8px !important;margin:0 !important;float:none !important;z-index:5;width:auto !important}
.verification-banner .col-2.order-3,.verification-banner .col-sm-1.order-3{position:static}
#order-standard_cart.pl-cfgx #orderSummary .total-due-today{padding:0 10px 0 2px}
.pl-cfgx .pl-cfg-specs{margin-top:10px;padding-top:14px}

/* ============================================================
   v200 — Aurora "bold" dashboard pack (appended; loads last)
   token-driven so papilio-light.css remaps carry over.
   ============================================================ */
/* turn up the ambient signature a touch on the dashboard */
.pl-app::before{background:
  radial-gradient(40% 36% at 15% 8%,rgba(56,189,248,.14),transparent 70%),
  radial-gradient(38% 42% at 89% 20%,rgba(138,160,255,.10),transparent 72%),
  radial-gradient(46% 40% at 60% 100%,rgba(14,165,233,.08),transparent 70%)}

/* ---- hero greeting ---- */
.pl-hero2{position:relative;overflow:hidden;border:1px solid var(--border);border-radius:var(--r);
  padding:26px 28px;margin-bottom:22px;
  background:linear-gradient(118deg,rgba(56,189,248,.14),rgba(138,160,255,.06) 46%,transparent 72%),var(--surface);
  box-shadow:var(--shadow-lg)}
.pl-hero2::before{content:"";position:absolute;top:0;left:24px;right:24px;height:1px;
  background:linear-gradient(90deg,transparent,rgba(125,211,252,.4),transparent)}
.pl-hero2-glow{position:absolute;right:-90px;top:-130px;width:360px;height:360px;border-radius:50%;
  background:radial-gradient(circle,rgba(56,189,248,.26),transparent 68%);filter:blur(22px);pointer-events:none}
.pl-hero2-row{position:relative;display:flex;align-items:flex-start;gap:20px;flex-wrap:wrap;z-index:1}
.pl-hero2-txt{flex:1 1 auto;min-width:0}
.pl-hero2 .pl-hello{font-family:var(--sans);font-size:26px;font-weight:700;letter-spacing:-.02em;margin:0}
.pl-wave{display:inline-block;transform-origin:70% 70%;animation:plWave 2.6s ease-in-out infinite}
@keyframes plWave{0%,60%,100%{transform:rotate(0)}10%{transform:rotate(15deg)}20%{transform:rotate(-8deg)}30%{transform:rotate(15deg)}40%{transform:rotate(-4deg)}50%{transform:rotate(10deg)}}
.pl-hero2 .pl-welcome-sub{margin:7px 0 0}
.pl-hero2-status{display:inline-flex;align-items:center;gap:8px;margin-top:15px;font-family:var(--mono);font-size:11.5px;font-weight:600;
  color:#8fe3c6;padding:6px 13px;border-radius:20px;background:var(--green-bg);border:1px solid rgba(52,211,153,.3)}
.pl-hero2-status i{width:7px;height:7px;border-radius:50%;background:var(--green);box-shadow:0 0 9px var(--green);animation:plPulseDot 2s ease-in-out infinite}
.pl-hero2-acts{display:flex;gap:10px;flex-wrap:wrap;flex-shrink:0}

/* ---- stat cards: gradient top edge + bolder number ---- */
.pl-stats2 .pl-stat{background:linear-gradient(180deg,rgba(125,211,252,.05),transparent 130px),var(--surface)}
.pl-stats2 .pl-stat::before{content:"";position:absolute;top:0;left:16px;right:16px;height:1px;
  background:linear-gradient(90deg,transparent,rgba(125,211,252,.3),transparent);z-index:1}
.pl-stats2 .pl-stat .n{font-size:29px}

/* ---- bold server cards: 2-up info grid ---- */
.pl-servers2{grid-template-columns:repeat(auto-fill,minmax(320px,1fr))}
.pl-srv2{padding:18px;background:linear-gradient(158deg,rgba(56,189,248,.06),transparent 42%),var(--surface)}
.pl-srv2-head{display:flex;align-items:center;gap:12px;margin-bottom:2px}
.pl-srv2-id{flex:1 1 auto;min-width:0}
.pl-srv2-id .nm{font-family:var(--sans);font-weight:700;font-size:15.5px;letter-spacing:-.01em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pl-srv2-grid{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--border-soft);border:1px solid var(--border-soft);border-radius:11px;overflow:hidden;margin:16px 0}
.pl-srv2-cell{background:var(--surface);padding:10px 12px}
.pl-srv2-cell.wide{grid-column:1 / -1}
.pl-srv2-cell .k{font-family:var(--mono);font-size:9px;letter-spacing:.09em;text-transform:uppercase;color:var(--text-3);font-weight:600}
.pl-srv2-cell .val{font-family:var(--mono);font-size:12.5px;margin-top:4px;color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pl-srv2-cell .val.brand{color:var(--brand)}
.pl-srv2-acts{display:flex;gap:9px}
.pl-srv2-acts .pl-b{flex:1}

/* ---- bottom row: activity + wallet ---- */
.pl-dashrow{display:grid;grid-template-columns:1.55fr 1fr;gap:16px;margin-top:6px}
.pl-card-h{display:flex;align-items:center;gap:10px;padding:16px 20px;border-bottom:1px solid var(--border)}
.pl-card-h h3{margin:0;font-family:var(--sans);font-size:15px;font-weight:700}
.pl-card-link{margin-left:auto;font-size:12.5px;font-weight:700;color:var(--brand)}
[dir=rtl] .pl-card-link{margin-left:0;margin-right:auto}
.pl-activity{padding-bottom:6px}
.pl-act{display:flex;align-items:center;gap:13px;padding:12px 20px;border-bottom:1px solid var(--border-soft);text-decoration:none;color:var(--text);transition:background .13s}
.pl-act:last-child{border-bottom:0}
.pl-act:hover{background:rgba(125,211,252,.05)}
.pl-act-ic{width:34px;height:34px;border-radius:10px;flex-shrink:0;display:grid;place-items:center}
.pl-act-ic svg{width:16px;height:16px}
.pl-act-ic.paid{background:var(--green-bg);color:var(--green)}
.pl-act-ic.tkt{background:var(--violet-bg);color:var(--violet)}
.pl-act-ic.due{background:var(--amber-bg);color:var(--amber)}
.pl-act-ic.svc{background:var(--blue-bg);color:var(--brand)}
.pl-act-m{flex:1;min-width:0}
.pl-act-m b{font-size:13px;font-weight:700;display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pl-act-m span{font-size:11.5px;color:var(--text-3);font-family:var(--mono)}
.pl-act-t{font-family:var(--mono);font-size:10.5px;color:var(--text-3);white-space:nowrap;flex-shrink:0}
.pl-act-empty{padding:30px 20px;text-align:center;color:var(--text-3);font-size:13px}
.pl-wallet2{padding:22px;position:relative;overflow:hidden;background:linear-gradient(160deg,rgba(56,189,248,.08),transparent 55%),var(--surface)}
.pl-wallet2-l{font-family:var(--mono);font-size:10.5px;text-transform:uppercase;letter-spacing:.1em;color:var(--text-3)}
.pl-wallet2-bal{font-family:var(--mono);font-size:33px;font-weight:600;letter-spacing:-.03em;margin-top:6px;line-height:1;
  background:linear-gradient(120deg,#eaf6ff 8%,#7dd3fc 92%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
.pl-wallet2-acts{display:flex;gap:10px;margin-top:18px}
.pl-wallet2-acts .pl-b{flex:1;display:inline-flex;align-items:center;justify-content:center;gap:7px}
.pl-wallet2-acts .pl-b svg{width:15px;height:15px}
.pl-wallet2-note{display:flex;align-items:center;gap:9px;margin-top:16px;padding-top:14px;border-top:1px solid var(--border);font-size:12.5px;color:var(--text-2)}
.pl-wallet2-note .d{width:8px;height:8px;border-radius:50%;background:var(--amber);flex-shrink:0}
.pl-wallet2-note b{margin-left:auto;font-family:var(--mono);font-weight:700;color:var(--text)}
[dir=rtl] .pl-wallet2-note b{margin-left:0;margin-right:auto}

/* ---- responsive ---- */
@media(max-width:1100px){.pl-dashrow{grid-template-columns:1fr}}
@media(max-width:640px){
  .pl-hero2{padding:20px 18px}
  .pl-hero2 .pl-hello{font-size:22px}
  .pl-hero2-acts{width:100%}
  .pl-hero2-acts .pl-wbtn{flex:1;justify-content:center}
  .pl-srv2-grid{grid-template-columns:1fr 1fr}
}

/* ---- light-mode fixes for the new elements ---- */
.pl-light .pl-wallet2-bal{background:linear-gradient(120deg,var(--brand-2),var(--brand));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.pl-light .pl-hero2-status{color:#0f766e;background:rgba(16,185,129,.10);border-color:rgba(16,185,129,.28)}
.pl-light .pl-hero2{box-shadow:0 20px 46px -30px rgba(2,132,199,.5)}
.pl-light .pl-wallet2-bal{-webkit-text-fill-color:transparent}

/* ============================================================
   v201 — precision polish
   ============================================================ */
/* hero: vertically-centered actions, tighter box */
.pl-hero2{padding:24px 26px}
.pl-hero2-row{align-items:center}
.pl-hero2-txt .pl-welcome-sub{max-width:52ch}
@media(max-width:640px){.pl-hero2-row{align-items:flex-start}}

/* stat cards: number + icon on ONE row (denser, kills the hollow gap) */
.pl-stat2{display:flex;flex-direction:column;justify-content:center;min-height:112px}
.pl-stat2-row{display:flex;align-items:center;justify-content:space-between;gap:12px}
.pl-stat2 .n{margin-top:0;font-size:30px}
.pl-stat2 .l{margin-top:9px}

/* bottom row: right column is a stack (wallet + quick actions) — no dead space */
.pl-dashside{display:flex;flex-direction:column;gap:16px;min-width:0}
.pl-dashside .pl-wallet2{flex:0 0 auto;margin:0}
.pl-quick{flex:1 1 auto;display:flex;flex-direction:column}
.pl-quick .pl-qrows{flex:1;display:flex;flex-direction:column}
.pl-qrow{display:flex;align-items:center;gap:12px;padding:12px 18px;border-bottom:1px solid var(--border-soft);color:var(--text);text-decoration:none;transition:background .13s}
.pl-qrow:last-child{border-bottom:0}
.pl-qrow:hover{background:rgba(125,211,252,.05)}
.pl-qrow .qic{width:32px;height:32px;border-radius:9px;flex-shrink:0;display:grid;place-items:center;background:var(--surface-3);color:var(--brand);border:1px solid var(--border-soft)}
.pl-qrow .qic svg{width:16px;height:16px}
.pl-qrow .qt{flex:1;font-size:13px;font-weight:600;min-width:0}
.pl-qrow .qc{color:var(--text-3);flex-shrink:0;display:inline-flex}
.pl-qrow .qc svg{width:15px;height:15px}
.pl-qrow:hover .qc{color:var(--brand)}
[dir=rtl] .pl-qrow .qc{transform:scaleX(-1)}

/* server card: Manage carries the weight, Details is a compact ghost */
.pl-srv2-acts .pl-b.primary{flex:1 1 auto}
.pl-srv2-acts .pl-b:not(.primary){flex:0 0 auto;padding-left:18px;padding-right:18px}

/* activity rows a touch tighter */
.pl-activity .pl-act{padding:11px 20px}

/* v201.1 — let the two bottom columns hug their content (no empty card bottoms) */
.pl-dashrow{align-items:start}