/* Digital Punjab frontend refresh - presentation only. Existing PHP/API flows remain unchanged. */
:root { --dp-navy:#061a47; --dp-blue:#1168ee; --dp-cyan:#22c9ef; --dp-gold:#f8bd28; --dp-ink:#142039; --dp-muted:#778399; }
.dp-page-loader { position:fixed; inset:0; z-index:99999; display:grid; place-items:center; background:radial-gradient(circle at 50% 45%, #0f367e 0, #071b47 46%, #031536 100%); transition:opacity .55s ease, visibility .55s ease; }
.dp-page-loader::before { position:absolute; inset:0; content:""; opacity:.22; background-image:radial-gradient(rgba(255,255,255,.5) 1px, transparent 1px); background-size:24px 24px; mask-image:linear-gradient(90deg, transparent, #000 45%, transparent); animation:dp-loader-grid 10s linear infinite; }
.dp-page-loader-hidden { opacity:0; visibility:hidden; pointer-events:none; }
.dp-loader-card { position:relative; width:min(330px, calc(100vw - 42px)); padding:24px 22px 25px; border:1px solid rgba(255,255,255,.28); border-radius:25px; background:rgba(52,82,132,.72); box-shadow:0 25px 60px rgba(0,0,0,.3), inset 0 1px 0 rgba(255,255,255,.14); text-align:center; color:#fff; backdrop-filter:blur(16px); }
.dp-loader-ring { display:grid; width:148px; height:148px; margin:0 auto 17px; place-items:center; border:6px solid rgba(255,255,255,.18); border-top-color:var(--dp-gold); border-right-color:var(--dp-cyan); border-radius:50%; animation:dp-loader-spin 2.4s linear infinite; }
.dp-loader-ring-inner { display:grid; width:116px; height:116px; place-items:center; border:3px solid #f5c734; border-radius:50%; background:#061333; box-shadow:0 0 0 8px rgba(4,18,50,.65), 0 0 25px rgba(38,195,236,.22); animation:dp-loader-counter-spin 2.4s linear infinite; }
.dp-loader-ring img { max-width:92px; max-height:92px; border-radius:50%; object-fit:contain; }
.dp-loader-card h2 { margin:0; font-size:1.25rem; font-weight:900; letter-spacing:-.04em; } .dp-loader-card p { margin:5px 0 0; color:#f3f7ff; font-size:.73rem; font-weight:750; }
.dp-loader-dots { display:flex; justify-content:center; gap:7px; margin-top:14px; } .dp-loader-dots span { width:8px; height:8px; border-radius:50%; background:#fff; opacity:.35; animation:dp-loader-dot 1s ease-in-out infinite; } .dp-loader-dots span:nth-child(2){animation-delay:.18s}.dp-loader-dots span:nth-child(3){animation-delay:.36s}
body:has(.login-container), body:has(.register-container) { min-height:100vh; background:#0870ef!important; }
body:has(.login-container) .navbar, body:has(.register-container) .navbar, body:has(.login-container) .footer, body:has(.register-container) .footer { display:none; }
body:has(.login-container)::before, body:has(.register-container)::before { position:fixed; inset:0; z-index:0; content:""; background:linear-gradient(120deg,rgba(0,51,179,.44),rgba(4,123,245,.08)), url('../images/punjab-eservices-auth-background.png?v=203630') center/cover; animation:dp-auth-drift 16s ease-in-out infinite alternate; }
body:has(.login-container)::after, body:has(.register-container)::after { position:fixed; inset:0; z-index:0; content:""; opacity:.44; pointer-events:none; background-image:radial-gradient(rgba(255,255,255,.75) 1px, transparent 1px); background-size:20px 20px; mask-image:linear-gradient(90deg,#000 0 28%,transparent 53%,#000 100%); }
.login-container, .register-container { position:relative; z-index:2; min-height:100vh; padding:28px 15px; background:transparent!important; }
.login-card, .register-card { width:min(100%,430px)!important; max-width:430px!important; margin:0 auto; border:1px solid rgba(255,255,255,.95)!important; border-radius:25px!important; background:rgba(255,255,255,.94)!important; box-shadow:0 25px 70px rgba(4,26,87,.35), inset 0 1px 0 rgba(255,255,255,.95)!important; color:var(--dp-ink)!important; backdrop-filter:blur(17px); }
.login-card::before, .register-card::before { position:absolute; top:0; left:0; right:0; height:6px; content:""; background:linear-gradient(90deg,var(--dp-gold),var(--dp-blue),var(--dp-cyan),var(--dp-gold)); border-radius:25px 25px 0 0; }
.login-header, .register-header { padding-top:13px; } .login-header::before, .register-header::before { display:block; width:58px; height:58px; margin:0 auto 12px; content:""; border:3px solid #0d204d; border-radius:17px; background:radial-gradient(circle at 35% 25%,#f5d646,#173da6 47%,#030b23); box-shadow:0 5px 13px rgba(8,37,111,.28); }
.login-header h1, .register-header h1 { margin:0 0 4px!important; color:var(--dp-ink)!important; font-size:1.55rem!important; font-weight:900!important; background:none!important; -webkit-text-fill-color:initial!important; } .login-header p, .register-header p { color:#778399!important; font-size:.75rem!important; }
.login-header p::after { display:block; width:max-content; margin:13px auto 0; padding:6px 10px; border:1px solid #e4eaf3; border-radius:999px; content:"🔐 Secure Login System"; color:#1357bd; background:#f7fbff; font-size:.67rem; font-weight:800; }
.login-body, .register-body { padding:17px!important; border:1px solid #eef1f6; border-radius:20px; background:rgba(255,255,255,.7); box-shadow:0 15px 30px rgba(48,81,140,.08); } .form-label { color:#34415a!important; font-size:.72rem!important; font-weight:800!important; } .form-control, .form-select { border:1px solid #dfe5ee!important; border-radius:13px!important; background:#fff!important; color:var(--dp-ink)!important; box-shadow:none!important; } .form-control::placeholder { color:#8a94a5!important; }
.form-control:focus, .form-select:focus { border-color:var(--dp-blue)!important; box-shadow:0 0 0 4px rgba(17,104,238,.12)!important; } .remember-me { color:#718096!important; } .forgot-password { color:#1764d4!important; } .login-btn, .register-btn { min-height:50px; border:0!important; border-radius:14px!important; background:linear-gradient(135deg,#1467ed,#1461df)!important; box-shadow:0 12px 20px rgba(20,101,234,.28)!important; } .login-btn:hover, .register-btn:hover { transform:translateY(-1px); filter:brightness(1.06); } .register-link, .login-link { color:#758195!important; } .register-link a, .login-link a { color:#1d66d8!important; }
/* Shared admin shell skin. Menu links, data, forms, APIs and PHP actions are untouched. */
body:not(:has(.login-container)):not(:has(.register-container)) { background:#eef4fb!important; } body:not(:has(.login-container)):not(:has(.register-container)) .sidebar-wrapper { background:linear-gradient(180deg,#061945,#0b338f)!important; box-shadow:8px 0 30px rgba(6,25,69,.15); } body:not(:has(.login-container)):not(:has(.register-container)) .sidebar-header { background:rgba(4,18,57,.24)!important; border-bottom:1px solid rgba(255,255,255,.14)!important; } body:not(:has(.login-container)):not(:has(.register-container)) .logo-text, body:not(:has(.login-container)):not(:has(.register-container)) .sidebar-wrapper .menu-title { color:#fff!important; } body:not(:has(.login-container)):not(:has(.register-container)) .page-wrapper { background:#eef4fb!important; } body:not(:has(.login-container)):not(:has(.register-container)) .card, body:not(:has(.login-container)):not(:has(.register-container)) .banner-container { border:1px solid #e2e9f3; border-radius:16px; box-shadow:0 10px 26px rgba(44,81,142,.08); }
@keyframes dp-loader-spin { to { transform:rotate(360deg); } } @keyframes dp-loader-counter-spin { to { transform:rotate(-360deg); } } @keyframes dp-loader-dot { 0%,100%{opacity:.3;transform:translateY(0)}50%{opacity:1;transform:translateY(-5px)} } @keyframes dp-loader-grid { to { transform:translateX(24px); } } @keyframes dp-auth-drift { from { transform:scale(1); background-position:center; } to { transform:scale(1.04); background-position:52% 48%; } }
@media (max-width:700px) { .login-container,.register-container { padding-top:7vh; } .login-card,.register-card { padding:1.25rem!important; } .form-row { display:block!important; } .form-col { width:100%!important; } }
.auth-card-logo { display:block; width:58px; height:58px; margin:0 auto 12px; border:3px solid #0d204d; border-radius:17px; object-fit:contain; background:#061333; box-shadow:0 5px 13px rgba(8,37,111,.28); }
.login-header::before, .register-header::before { display:none!important; }
body:has(.forgot-container) { min-height:100vh; background:#0870ef!important; }
body:has(.forgot-container) .navbar, body:has(.forgot-container) .footer { display:none; }
body:has(.forgot-container)::before { position:fixed; inset:0; z-index:0; content:""; background:linear-gradient(120deg,rgba(0,51,179,.44),rgba(4,123,245,.08)),url('../images/punjab-eservices-auth-background.png?v=203630') center/cover; animation:dp-auth-drift 16s ease-in-out infinite alternate; }
.forgot-container { position:relative; z-index:2; min-height:100vh; display:flex; align-items:center; justify-content:center; padding:28px 15px; background:transparent!important; }
.forgot-card { width:min(100%,430px)!important; border:1px solid rgba(255,255,255,.95)!important; border-radius:25px!important; background:rgba(255,255,255,.94)!important; box-shadow:0 25px 70px rgba(4,26,87,.35)!important; color:var(--dp-ink)!important; }
.forgot-header h1 { color:var(--dp-ink)!important; font-size:1.5rem!important; font-weight:900!important; } .forgot-header p,.instructions p,.back-to-login { color:#778399!important; } .forgot-body { border:1px solid #eef1f6; border-radius:20px; background:rgba(255,255,255,.7); } .forgot-card .form-label { color:#34415a!important; } .forgot-card .form-control { border:1px solid #dfe5ee!important; border-radius:13px!important; background:#fff!important; color:var(--dp-ink)!important; } .forgot-card .submit-btn { border:0!important; border-radius:14px!important; background:linear-gradient(135deg,#1467ed,#1461df)!important; box-shadow:0 12px 20px rgba(20,101,234,.28)!important; } .back-to-login a { color:#1d66d8!important; }
/* Exact reference loader geometry and motion */
#dpPremiumLoader{position:fixed;inset:0;z-index:2147483647;display:flex;align-items:center;justify-content:center;padding:20px;background:radial-gradient(circle at 50% 30%,rgba(37,99,235,.24),transparent 38%),linear-gradient(135deg,#020617,#071b3f,#0b4ca3);opacity:1;visibility:visible;transition:opacity .28s ease,visibility .28s ease;pointer-events:all}
#dpPremiumLoader.dp-loader-hidden{opacity:0;visibility:hidden;pointer-events:none}
#dpPremiumLoader .dp-loader-card{width:min(330px,88vw);padding:25px 22px;border-radius:30px;text-align:center;color:#fff;background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.23);box-shadow:0 30px 90px rgba(0,0,0,.42);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
#dpPremiumLoader .dp-loader-logo-wrap{position:relative;width:145px;height:145px;margin:0 auto 17px;display:grid;place-items:center}
#dpPremiumLoader .dp-loader-ring{position:absolute;inset:-7px;border-radius:50%;border:5px solid rgba(255,255,255,.17);border-top-color:#fbbf24;border-right-color:#38bdf8;animation:dpPremiumSpin .9s linear infinite}
#dpPremiumLoader .dp-loader-logo{width:128px;height:128px;border-radius:50%;object-fit:contain;padding:4px;background:#06142f;box-shadow:0 15px 40px rgba(0,0,0,.34)}
#dpPremiumLoader .dp-loader-title{margin:0;font-size:23px;line-height:1.2;font-weight:950;letter-spacing:.2px}
#dpPremiumLoader .dp-loader-subtitle{margin:8px 0 0;font-size:13px;line-height:1.5;font-weight:800;color:#dbeafe}
#dpPremiumLoader .dp-loader-dots{display:flex;justify-content:center;gap:7px;margin-top:17px}
#dpPremiumLoader .dp-loader-dots i{width:9px;height:9px;border-radius:50%;background:#fff;animation:dpPremiumDot 1s ease-in-out infinite}
#dpPremiumLoader .dp-loader-dots i:nth-child(2){animation-delay:.14s}#dpPremiumLoader .dp-loader-dots i:nth-child(3){animation-delay:.28s}
@keyframes dpPremiumSpin{to{transform:rotate(360deg)}}@keyframes dpPremiumDot{0%,100%{opacity:.35;transform:translateY(0)}50%{opacity:1;transform:translateY(-6px)}}
@media(max-width:480px){#dpPremiumLoader .dp-loader-card{width:min(290px,90vw);padding:22px 17px}#dpPremiumLoader .dp-loader-logo-wrap{width:125px;height:125px}#dpPremiumLoader .dp-loader-logo{width:110px;height:110px}#dpPremiumLoader .dp-loader-title{font-size:20px}}

/* Public home page matched to the inspected reference */
.dp-home-page { min-height:100vh; margin:0; color:#111827; background:radial-gradient(circle at top right,#dbeafe 0,#f1f5fb 32%,#f8fafc 100%)!important; font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif; }
.dp-home-nav { display:flex; align-items:center; justify-content:space-between; padding:18px 7vw; background:#fff; border-bottom:1px solid #e5e7eb; }
.dp-home-nav nav { display:flex; align-items:center; gap:12px; } .dp-home-nav a { color:#2563eb; font-weight:800; text-decoration:none; } .dp-home-nav-button { padding:10px 16px; border-radius:999px; background:#2563eb; color:#fff!important; }
.dp-home-brand { display:flex; align-items:center; gap:10px; font-size:1.05rem; color:#101827!important; } .dp-home-brand-mark { display:grid; width:34px; height:34px; place-items:center; border-radius:10px; background:#0b4fb3; color:#fff; font-size:.8rem; font-weight:950; }
.dp-home-hero { display:grid; grid-template-columns:1.3fr .7fr; gap:24px; align-items:center; padding:72px 7vw 44px; } .dp-home-copy { max-width:800px; } .dp-home-pill { display:inline-block; padding:8px 13px; border-radius:999px; background:#dbeafe; color:#1d4ed8; font-weight:800; } .dp-home-copy h1 { margin:18px 0; max-width:760px; font-size:clamp(34px,6vw,66px); line-height:1.02; letter-spacing:-.055em; } .dp-home-copy p { max-width:790px; color:#536176; font-size:20px; line-height:1.45; } .dp-home-actions { display:flex; gap:12px; margin-top:22px; } .dp-home-button { display:inline-block; padding:14px 24px; border-radius:13px; background:#2563eb; color:#fff!important; font-weight:900; text-decoration:none; } .dp-home-button-dark { background:#0f172a; }
.dp-home-service-card, .dp-home-grid article { padding:22px; border:1px solid #e6eefb; border-radius:20px; background:#fff; box-shadow:0 14px 35px rgba(15,23,42,.08); } .dp-home-service-card h2 { margin:0 0 18px; font-size:1.05rem; } .dp-home-service-item { margin:10px 0; padding:14px; border:1px solid #dbe5f5; border-radius:14px; background:#f8fbff; font-weight:800; }
.dp-home-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; padding:0 7vw 60px; } .dp-home-grid article { min-height:130px; } .dp-home-grid h3 { margin:0 0 16px; font-size:1rem; } .dp-home-grid p { margin:0; color:#536176; line-height:1.45; } .dp-policy-grid article { min-height:160px; } .dp-home-disclaimer { padding:0 7vw 80px; } .dp-home-disclaimer h2 { font-size:1.35rem; } .dp-home-disclaimer p { max-width:840px; color:#536176; font-size:1.1rem; line-height:1.5; }
@media(max-width:760px){.dp-home-nav{padding:14px 18px}.dp-home-hero,.dp-home-grid{grid-template-columns:1fr;padding:30px 18px}.dp-home-copy h1{font-size:42px}.dp-home-copy p{font-size:18px}.dp-home-actions{flex-wrap:wrap}.dp-home-disclaimer{padding:0 18px 60px}}

/* Login composition matching the public reference card */
body:has(.login-container) { overflow-x:hidden; overflow-y:auto; }
body:has(.login-container) .login-container { align-items:flex-start; padding:7vh 15px 36px; }
body:has(.login-container) .login-card { width:min(100%,336px)!important; max-width:336px!important; padding:1.25rem!important; border-radius:24px!important; }
body:has(.login-container) .login-header { margin-bottom:14px; }
body:has(.login-container) .login-header h1 { font-size:1.25rem!important; }
body:has(.login-container) .login-header p { font-size:.68rem!important; }
body:has(.login-container) .login-body { padding:12px!important; }
body:has(.login-container) .form-group { margin-bottom:12px; }
body:has(.login-container) .form-label { display:none!important; }
body:has(.login-container) .form-control { height:41px; padding:10px 11px; border-radius:12px!important; font-size:.82rem; }
body:has(.login-container) .form-options { display:none; }
body:has(.login-container) .login-btn { min-height:41px; padding:10px; font-size:.82rem; }
body:has(.login-container) .login-btn i { display:none; }
body:has(.login-container) .register-link { display:none; }
.dp-login-magic-panel { display:flex; flex-direction:column; gap:5px; margin-top:13px; padding:13px 14px; border-radius:15px; color:#fff; background:linear-gradient(135deg,#071733,#142854); box-shadow:0 10px 18px rgba(7,23,51,.2); }
.dp-login-magic-panel strong { font-size:.78rem; line-height:1.25; }
.dp-login-magic-panel span { font-size:.62rem; line-height:1.35; color:#dbeafe; font-weight:700; }
.dp-login-shortcuts { display:grid; grid-template-columns:1fr 1fr; gap:9px; margin-top:9px; }
.dp-login-shortcut { display:flex; min-height:70px; flex-direction:column; justify-content:center; padding:11px; border:1px solid #e5ebf3; border-radius:15px; color:#2464d6; background:linear-gradient(145deg,#fff,#f6f9fd); text-decoration:none; box-shadow:0 7px 16px rgba(57,82,120,.08); }
.dp-login-shortcut:nth-child(3) { grid-column:1 / -1; }
.dp-login-shortcut b { font-size:.75rem; line-height:1.25; }
.dp-login-shortcut small { margin-top:4px; color:#7d899c; font-size:.59rem; font-weight:700; }
.dp-login-shortcut:hover { border-color:#9fc2ff; transform:translateY(-1px); }
.dp-auth-footer-tags { display:flex; justify-content:center; flex-wrap:wrap; gap:7px; margin-top:12px; }
.dp-auth-footer-tags span { padding:6px 9px; border:1px solid #e5ebf3; border-radius:999px; color:#718096; background:#f8fbff; font-size:.58rem; font-weight:800; }
@media(max-width:480px) { body:has(.login-container) .login-container { padding-top:4vh; } }
/* Shared auth family: register and password reset follow the login composition */
body:has(.register-container), body:has(.forgot-container) { overflow-x:hidden; overflow-y:auto; }
body:has(.register-container) .register-container, body:has(.forgot-container) .forgot-container { align-items:flex-start; padding:7vh 15px 36px; }
body:has(.register-container) .register-card { width:min(100%,390px)!important; max-width:390px!important; padding:1.25rem!important; border-radius:24px!important; }
body:has(.register-container) .register-header, body:has(.forgot-container) .forgot-header { margin-bottom:14px; }
body:has(.register-container) .register-header h1, body:has(.forgot-container) .forgot-header h1 { font-size:1.25rem!important; }
body:has(.register-container) .register-header p, body:has(.forgot-container) .forgot-header p { font-size:.68rem!important; }
body:has(.register-container) .register-body, body:has(.forgot-container) .forgot-body { padding:12px!important; }
body:has(.register-container) .register-card .form-row { display:block!important; }
body:has(.register-container) .register-card .form-col { width:100%!important; }
body:has(.register-container) .register-card .form-label, body:has(.forgot-container) .forgot-card .form-label { display:none!important; }
body:has(.register-container) .register-card .form-group, body:has(.forgot-container) .forgot-card .form-group { margin-bottom:12px; }
body:has(.register-container) .register-card .form-control, body:has(.register-container) .register-card .form-select, body:has(.forgot-container) .forgot-card .form-control { height:41px; padding:10px 11px; border-radius:12px!important; font-size:.82rem; }
body:has(.register-container) .register-btn, body:has(.forgot-container) .submit-btn { min-height:41px; padding:10px; font-size:.82rem; }
body:has(.register-container) .register-btn i, body:has(.forgot-container) .submit-btn i { display:none; }
body:has(.register-container) .login-link, body:has(.forgot-container) .back-to-login { margin-top:12px; font-size:.68rem; }
body:has(.register-container) .toggle-password { color:#74839a!important; }
.dp-signup-note { margin:-3px 0 12px; padding:9px 11px; border:1px solid #d9e8ff; border-radius:12px; color:#2455a5; background:#f2f7ff; font-size:.65rem; font-weight:800; line-height:1.35; }
.dp-forgot-title { margin:0 0 12px; color:#142039; font-size:.92rem; font-weight:900; }
body:has(.forgot-container) .forgot-card { width:min(100%,336px)!important; max-width:336px!important; padding:1.25rem!important; border-radius:24px!important; }
body:has(.forgot-container) .forgot-icon { display:none!important; }
body:has(.forgot-container) .instructions { margin:0 0 12px; padding:10px 11px; border:1px solid #d9e8ff; border-left:3px solid #2563eb; border-radius:12px; color:#66758b; background:#f7fbff; font-size:.65rem; line-height:1.4; }
body:has(.forgot-container) .instructions p { margin:0; font-size:.65rem; }
body:has(.forgot-container) .forgot-header p::after { display:block; width:max-content; margin:13px auto 0; padding:6px 10px; border:1px solid #e4eaf3; border-radius:999px; content:"🔐 Secure Password Reset"; color:#1357bd; background:#f7fbff; font-size:.62rem; font-weight:800; }
@media(max-width:480px) { body:has(.register-container) .register-container, body:has(.forgot-container) .forgot-container { padding-top:4vh; } }
/* Advanced public portal home */
.dp-home-page { min-height:100vh; margin:0; overflow-x:hidden; color:#111c35; background:linear-gradient(180deg,#f7fbff 0%,#edf5ff 45%,#f8fbff 100%)!important; font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif; }
.dp-home-page *, .dp-home-page *::before, .dp-home-page *::after { box-sizing:border-box; }
.dp-home-page a { text-decoration:none; }
.dp-home-container { width:min(1180px,calc(100% - 48px)); margin-inline:auto; }
.dp-home-nav { position:sticky; top:0; z-index:20; display:flex; align-items:center; justify-content:space-between; gap:24px; width:100%; padding:16px max(24px,calc((100vw - 1180px)/2)); border-bottom:1px solid rgba(209,224,245,.8); background:rgba(255,255,255,.86); box-shadow:0 8px 30px rgba(22,63,123,.05); backdrop-filter:blur(18px); }
.dp-home-brand { display:flex; align-items:center; gap:10px; color:#0c1730!important; }
.dp-home-brand-logo { display:grid; width:42px; height:42px; place-items:center; overflow:hidden; border:2px solid #0a1c4f; border-radius:13px; background:#061333; box-shadow:0 6px 14px rgba(7,39,105,.18); }
.dp-home-brand-logo img { width:100%; height:100%; object-fit:contain; }
.dp-home-brand strong { display:block; font-size:.98rem; letter-spacing:-.02em; }
.dp-home-brand small { display:block; margin-top:2px; color:#71809a; font-size:.6rem; font-weight:700; }
.dp-home-nav nav { display:flex; align-items:center; gap:23px; }
.dp-home-nav-link { color:#50627d!important; font-size:.76rem; font-weight:800; }
.dp-home-nav-link:hover { color:#1764d4!important; }
.dp-home-nav-button { padding:11px 17px; border-radius:12px; color:#fff!important; background:#1466e9; box-shadow:0 8px 18px rgba(20,102,233,.2); font-size:.76rem; font-weight:900; }
.dp-home-nav-button span { margin-left:5px; font-size:.9rem; }
.dp-home-hero { display:grid; grid-template-columns:minmax(0,1.03fr) minmax(400px,.77fr); gap:60px; align-items:center; min-height:650px; padding-top:75px; padding-bottom:65px; }
.dp-home-copy { position:relative; z-index:2; }
.dp-home-pill { display:inline-flex; align-items:center; gap:8px; padding:8px 12px; border:1px solid #cfe0fb; border-radius:999px; color:#245bc4; background:#e9f2ff; font-size:.67rem; font-weight:900; letter-spacing:.01em; }
.dp-home-pill i { width:7px; height:7px; border-radius:50%; background:#16b876; box-shadow:0 0 0 4px rgba(22,184,118,.12); }
.dp-home-copy h1 { max-width:700px; margin:20px 0 17px; color:#101c36; font-size:clamp(42px,5.5vw,70px); line-height:1.02; letter-spacing:-.065em; }
.dp-home-copy h1 em { color:#1466e9; font-style:normal; }
.dp-home-copy p { max-width:610px; margin:0; color:#64738a; font-size:1.03rem; line-height:1.65; }
.dp-home-actions { display:flex; flex-wrap:wrap; gap:11px; margin-top:26px; }
.dp-home-button { display:inline-flex; align-items:center; justify-content:center; gap:11px; min-height:47px; padding:0 18px; border:1px solid #1466e9; border-radius:12px; color:#fff!important; background:#1466e9; box-shadow:0 12px 22px rgba(20,102,233,.2); font-size:.76rem; font-weight:900; }
.dp-home-button span { font-size:1.05rem; transition:transform .2s ease; }
.dp-home-button:hover span { transform:translateX(3px); }
.dp-home-button-light { border-color:#dce7f6; color:#315173!important; background:#fff; box-shadow:0 8px 16px rgba(53,87,132,.06); }
.dp-home-trust-row { display:flex; flex-wrap:wrap; gap:16px; margin-top:24px; color:#75849b; font-size:.63rem; font-weight:800; }
.dp-home-trust-row b { display:inline-grid; width:16px; height:16px; margin-right:4px; place-items:center; border-radius:50%; color:#fff; background:#19a875; font-size:.55rem; }
.dp-home-visual { position:relative; min-height:500px; display:grid; place-items:center; }
.dp-home-visual-card { position:relative; z-index:2; width:min(100%,390px); padding:23px; border:1px solid rgba(255,255,255,.65); border-radius:28px; background:linear-gradient(145deg,rgba(8,33,83,.97),rgba(18,79,172,.96)); box-shadow:0 30px 70px rgba(16,67,143,.28),inset 0 1px 0 rgba(255,255,255,.24); color:#fff; overflow:hidden; }
.dp-home-visual-card::before { position:absolute; right:-85px; bottom:-95px; width:240px; height:240px; border:1px solid rgba(94,206,255,.3); border-radius:50%; box-shadow:0 0 0 24px rgba(94,206,255,.05),0 0 0 48px rgba(94,206,255,.04); content:""; }
.dp-home-visual-top { position:relative; z-index:1; display:flex; align-items:center; gap:7px; color:#bcd3fa; font-size:.61rem; font-weight:800; }
.dp-home-visual-top b { margin-left:auto; color:#79f0c0; font-size:.6rem; }
.dp-home-live-dot { width:7px; height:7px; border-radius:50%; background:#63e8b0; box-shadow:0 0 0 4px rgba(99,232,176,.12); }
.dp-home-logo-orbit { position:relative; display:grid; width:170px; height:170px; margin:27px auto 19px; place-items:center; }
.dp-home-orbit-ring { position:absolute; inset:0; border:3px solid transparent; border-top-color:#f8bd28; border-right-color:#35d1ed; border-radius:50%; transform:rotate(-22deg); }
.dp-home-orbit-ring::after { position:absolute; inset:12px; border:1px solid rgba(255,255,255,.3); border-radius:50%; content:""; }
.dp-home-logo-orbit img { position:relative; width:135px; height:135px; padding:5px; border:1px solid rgba(255,255,255,.27); border-radius:50%; object-fit:contain; background:#061333; box-shadow:0 15px 35px rgba(0,0,0,.26); }
.dp-home-visual-card h2 { position:relative; z-index:1; margin:0; text-align:center; font-size:1.58rem; line-height:1.12; letter-spacing:-.045em; }
.dp-home-visual-card h2 span { color:#65d7f4; }
.dp-home-visual-card > p { position:relative; z-index:1; max-width:275px; margin:11px auto 0; color:#c4d7f4; text-align:center; font-size:.68rem; line-height:1.5; }
.dp-home-mini-metrics { position:relative; z-index:1; display:grid; grid-template-columns:repeat(3,1fr); gap:7px; margin-top:22px; }
.dp-home-mini-metrics div { padding:10px 5px; border:1px solid rgba(255,255,255,.12); border-radius:12px; text-align:center; background:rgba(255,255,255,.08); }
.dp-home-mini-metrics strong { display:block; color:#fff; font-size:.78rem; }
.dp-home-mini-metrics small { display:block; margin-top:3px; color:#b1c7e8; font-size:.52rem; font-weight:700; }
.dp-home-visual-orb { position:absolute; border-radius:50%; filter:blur(1px); opacity:.55; }
.dp-home-visual-orb.orb-one { top:8%; right:1%; width:170px; height:170px; background:radial-gradient(circle,#4bdaf3 0,rgba(75,218,243,0) 70%); }
.dp-home-visual-orb.orb-two { bottom:4%; left:0; width:220px; height:220px; background:radial-gradient(circle,#3f70f6 0,rgba(63,112,246,0) 70%); }
.dp-home-float-card { position:absolute; z-index:3; display:flex; align-items:center; gap:9px; padding:11px 13px; border:1px solid #e5eefb; border-radius:14px; background:rgba(255,255,255,.94); box-shadow:0 14px 30px rgba(16,65,128,.15); }
.dp-home-float-card > span { display:grid; width:26px; height:26px; place-items:center; border-radius:9px; color:#fff; background:#1a6be9; font-weight:900; }
.dp-home-float-card strong,.dp-home-float-card small { display:block; }
.dp-home-float-card strong { color:#213451; font-size:.61rem; }
.dp-home-float-card small { margin-top:3px; color:#8090a6; font-size:.53rem; font-weight:700; }
.dp-home-float-top { top:16%; left:-8%; }
.dp-home-float-bottom { right:-7%; bottom:13%; }
.dp-home-float-bottom > span { background:#12a77a; }
.dp-home-stats { display:grid; grid-template-columns:repeat(4,1fr); gap:1px; padding:0; border:1px solid #dfeaf8; border-radius:18px; background:#dfeaf8; box-shadow:0 14px 30px rgba(38,84,142,.06); overflow:hidden; }
.dp-home-stats div { padding:19px 16px; background:rgba(255,255,255,.85); text-align:center; }
.dp-home-stats strong,.dp-home-stats span { display:block; }
.dp-home-stats strong { color:#1466e9; font-size:1.15rem; letter-spacing:-.04em; }
.dp-home-stats span { margin-top:3px; color:#74839a; font-size:.6rem; font-weight:800; }
.dp-home-section { padding-top:105px; padding-bottom:105px; }
.dp-home-section-heading { display:flex; align-items:end; justify-content:space-between; gap:30px; margin-bottom:31px; }
.dp-home-kicker { color:#1764d4; font-size:.61rem; font-weight:950; letter-spacing:.14em; }
.dp-home-section-heading h2 { max-width:620px; margin:9px 0 0; color:#13203b; font-size:clamp(28px,3.5vw,43px); line-height:1.08; letter-spacing:-.055em; }
.dp-home-section-heading > p { max-width:310px; margin:0; color:#738299; font-size:.75rem; line-height:1.55; }
.dp-home-service-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:15px; }
.dp-home-service-card { position:relative; min-height:270px; padding:21px; border:1px solid #e1eaf6; border-radius:20px; color:#1c2c49; background:#fff; box-shadow:0 13px 28px rgba(39,84,142,.07); overflow:hidden; transition:transform .2s ease,box-shadow .2s ease; }
.dp-home-service-card::after { position:absolute; right:-25px; bottom:-28px; width:105px; height:105px; border:1px solid rgba(36,112,231,.12); border-radius:50%; box-shadow:0 0 0 15px rgba(36,112,231,.04),0 0 0 30px rgba(36,112,231,.03); content:""; }
.dp-home-service-card:hover { transform:translateY(-5px); box-shadow:0 22px 40px rgba(39,84,142,.14); }
.dp-service-icon { display:grid; width:42px; height:42px; place-items:center; border-radius:13px; color:#fff; background:#1466e9; font-size:1.15rem; font-weight:900; }
.dp-service-gold .dp-service-icon { color:#2f2607; background:#f7c53c; }.dp-service-cyan .dp-service-icon { background:#24c7df; }.dp-service-navy .dp-service-icon { background:#102a67; }
.dp-service-arrow { position:absolute; top:23px; right:21px; color:#98a7ba; font-size:1rem; }
.dp-home-service-card h3 { margin:28px 0 9px; font-size:.96rem; letter-spacing:-.02em; }
.dp-home-service-card p { min-height:67px; margin:0; color:#74839a; font-size:.68rem; line-height:1.55; }
.dp-home-service-card small { display:block; margin-top:20px; color:#2467d6; font-size:.61rem; font-weight:900; }.dp-home-service-card small b { margin-left:4px; }
.dp-home-process-wrap { background:#071b45; color:#fff; }
.dp-home-process-wrap .dp-home-section-heading h2 { color:#fff; }.dp-home-process-wrap .dp-home-section-heading > p { color:#aebfde; }.dp-home-process-wrap .dp-home-kicker { color:#63d8f0; }
.dp-home-process-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:15px; }
.dp-home-process-grid article { position:relative; min-height:220px; padding:23px; border:1px solid rgba(181,216,255,.15); border-radius:18px; background:rgba(255,255,255,.07); }
.dp-home-process-grid article > span { position:absolute; top:19px; right:20px; color:#6b8cbf; font-size:.65rem; font-weight:900; }
.dp-process-icon { display:grid; width:42px; height:42px; place-items:center; border-radius:13px; color:#071b45; background:#5bd8ec; font-size:1.3rem; font-weight:900; }.dp-home-process-grid article:nth-child(2) .dp-process-icon { background:#f7c53c; }.dp-home-process-grid article:nth-child(3) .dp-process-icon { background:#75e4af; }
.dp-home-process-grid h3 { margin:28px 0 8px; font-size:.95rem; }.dp-home-process-grid p { max-width:260px; margin:0; color:#b3c6e2; font-size:.68rem; line-height:1.55; }
.dp-home-benefit-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:15px; }.dp-home-benefit-grid article { padding:25px; border:1px solid #dfebf8; border-radius:18px; background:#fff; box-shadow:0 12px 25px rgba(39,84,142,.05); }.dp-home-benefit-grid article > span { color:#2a75e5; font-size:.68rem; font-weight:950; }.dp-home-benefit-grid h3 { margin:35px 0 9px; font-size:.98rem; }.dp-home-benefit-grid p { margin:0; color:#74839a; font-size:.68rem; line-height:1.58; }
.dp-home-cta { display:flex; align-items:center; justify-content:space-between; gap:24px; padding:34px 38px; border-radius:23px; color:#fff; background:linear-gradient(120deg,#0b2f7d,#1466e9); box-shadow:0 24px 45px rgba(17,77,170,.2); }.dp-home-cta .dp-home-kicker { color:#7de2f1; }.dp-home-cta h2 { margin:9px 0 7px; font-size:clamp(25px,3vw,37px); line-height:1.08; letter-spacing:-.045em; }.dp-home-cta p { margin:0; color:#c5d8f6; font-size:.72rem; }.dp-home-cta-actions { display:flex; flex-wrap:wrap; gap:10px; }.dp-home-cta .dp-home-button { background:#fff; color:#125dcc!important; box-shadow:none; }.dp-home-cta .dp-home-button-outline { border-color:rgba(255,255,255,.35); color:#fff!important; background:transparent; }
.dp-home-disclaimer { display:flex; justify-content:space-between; gap:35px; padding-top:75px; padding-bottom:75px; }.dp-home-disclaimer h2 { margin:9px 0 10px; color:#15223d; font-size:1.55rem; letter-spacing:-.045em; }.dp-home-disclaimer p { max-width:710px; margin:0; color:#718098; font-size:.75rem; line-height:1.65; }.dp-home-contact { display:flex; min-width:220px; flex-direction:column; gap:7px; padding:18px; border:1px solid #dce8f6; border-radius:16px; background:#fff; }.dp-home-contact strong { margin-bottom:3px; color:#263b5c; font-size:.72rem; }.dp-home-contact a { color:#1e66d4; font-size:.66rem; font-weight:800; word-break:break-word; }
.dp-home-footer { display:grid; grid-template-columns:1fr auto auto; align-items:center; gap:25px; padding:25px max(24px,calc((100vw - 1180px)/2)); border-top:1px solid #dce8f6; background:#fff; }.dp-home-footer strong,.dp-home-footer span { display:block; }.dp-home-footer strong { color:#16233e; font-size:.78rem; }.dp-home-footer span { margin-top:4px; color:#8693a6; font-size:.59rem; }.dp-home-footer div:nth-child(2) { display:flex; gap:17px; }.dp-home-footer a { color:#53708f; font-size:.63rem; font-weight:800; }.dp-home-footer small { color:#8b98aa; font-size:.58rem; }
@media(max-width:900px) { .dp-home-hero { grid-template-columns:1fr; gap:35px; padding-top:55px; }.dp-home-copy h1 { max-width:650px; }.dp-home-visual { max-width:560px; width:100%; margin:auto; }.dp-home-service-grid { grid-template-columns:repeat(2,1fr); }.dp-home-float-top { left:0; }.dp-home-float-bottom { right:0; } }
@media(max-width:650px) { .dp-home-container { width:min(100% - 32px,520px); }.dp-home-nav { padding:12px 16px; }.dp-home-nav-link { display:none; }.dp-home-nav-button { padding:10px 12px; font-size:.67rem; }.dp-home-hero { min-height:auto; padding-top:45px; padding-bottom:40px; }.dp-home-copy h1 { font-size:44px; }.dp-home-copy p { font-size:.9rem; }.dp-home-trust-row { gap:9px; }.dp-home-trust-row span { font-size:.57rem; }.dp-home-visual { min-height:440px; }.dp-home-visual-card { width:calc(100% - 32px); }.dp-home-float-card { transform:scale(.82); }.dp-home-float-top { left:-14px; }.dp-home-float-bottom { right:-14px; }.dp-home-stats { grid-template-columns:repeat(2,1fr); }.dp-home-section { padding-top:70px; padding-bottom:70px; }.dp-home-section-heading { display:block; }.dp-home-section-heading > p { margin-top:13px; }.dp-home-service-grid,.dp-home-process-grid,.dp-home-benefit-grid { grid-template-columns:1fr; }.dp-home-service-card { min-height:225px; }.dp-home-process-grid article { min-height:180px; }.dp-home-cta { display:block; padding:27px 23px; }.dp-home-cta-actions { margin-top:20px; }.dp-home-disclaimer { display:block; padding-top:55px; padding-bottom:55px; }.dp-home-contact { margin-top:22px; }.dp-home-footer { display:block; padding:24px 16px; }.dp-home-footer div:nth-child(2) { margin:17px 0; }.dp-home-footer small { display:block; line-height:1.5; } }
/* Unified logged-in dashboard and existing-service design system */
body.dp-dashboard-shell, body:has(.sidebar-wrapper) { min-height:100vh; color:#17233d; background:#eef5fd!important; font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif; }
body.dp-dashboard-shell .dp-dashboard-ticker, body:has(.sidebar-wrapper) .dp-dashboard-ticker { position:fixed; top:0; left:0; right:0; z-index:1200; height:38px; display:flex; align-items:center; justify-content:center; overflow:hidden; border-bottom:1px solid rgba(255,255,255,.3); color:#fff; background:linear-gradient(100deg,#061838,#0a3c98,#126ee8); box-shadow:0 4px 18px rgba(5,25,72,.18); font-size:.72rem; font-weight:900; white-space:nowrap; }
body.dp-dashboard-shell .dp-dashboard-ticker span, body:has(.sidebar-wrapper) .dp-dashboard-ticker span { display:block; min-width:max-content; animation:dp-dashboard-ticker 24s linear infinite; }
@keyframes dp-dashboard-ticker { from { transform:translateX(55vw); } to { transform:translateX(-100%); } }
body.dp-dashboard-shell .wrapper, body:has(.sidebar-wrapper) .wrapper { min-height:100vh; }
body.dp-dashboard-shell .sidebar-wrapper, body:has(.sidebar-wrapper) .sidebar-wrapper { position:fixed; top:38px; left:0; bottom:0; z-index:1100; width:220px!important; overflow:hidden; border-right:1px solid rgba(255,255,255,.14); background:linear-gradient(180deg,#06142f 0%,#082a65 58%,#06142f 100%)!important; box-shadow:8px 0 28px rgba(2,11,34,.18); }
body.dp-dashboard-shell .sidebar-header, body:has(.sidebar-wrapper) .sidebar-header { height:178px!important; display:flex; flex-direction:column; justify-content:center; gap:7px; padding:15px 10px 12px!important; border-bottom:1px solid rgba(255,255,255,.13)!important; background:rgba(3,14,40,.32)!important; text-align:center; }
body.dp-dashboard-shell .sidebar-header > div:first-child, body:has(.sidebar-wrapper) .sidebar-header > div:first-child { width:132px; height:132px; margin:0 auto; }
body.dp-dashboard-shell .sidebar-header .logo-icon, body:has(.sidebar-wrapper) .sidebar-header .logo-icon { width:132px!important; height:132px!important; border:3px solid #f8bd28; border-radius:50%; object-fit:contain; background:#061333; box-shadow:0 0 0 5px rgba(248,189,40,.08),0 14px 30px rgba(0,0,0,.24); }
body.dp-dashboard-shell .sidebar-header .logo-text, body:has(.sidebar-wrapper) .sidebar-header .logo-text { margin:0!important; color:#fff!important; font-size:.75rem!important; font-weight:950!important; line-height:1.15; letter-spacing:.04em; text-transform:uppercase; }
body.dp-dashboard-shell .sidebar-header .toggle-icon, body:has(.sidebar-wrapper) .sidebar-header .toggle-icon { display:none; }
body.dp-dashboard-shell .sidebar-wrapper .metismenu, body:has(.sidebar-wrapper) .sidebar-wrapper .metismenu { padding:15px 9px 28px; }
body.dp-dashboard-shell .sidebar-wrapper .metismenu > li, body:has(.sidebar-wrapper) .sidebar-wrapper .metismenu > li { margin:6px 0; }
body.dp-dashboard-shell .sidebar-wrapper .metismenu > li > a, body:has(.sidebar-wrapper) .sidebar-wrapper .metismenu > li > a { min-height:38px; padding:9px 10px!important; border:1px solid rgba(255,255,255,.14); border-radius:11px; color:#eaf2ff!important; background:rgba(255,255,255,.07)!important; font-size:.67rem; font-weight:850; transition:all .18s ease; }
body.dp-dashboard-shell .sidebar-wrapper .metismenu > li > a:hover, body.dp-dashboard-shell .sidebar-wrapper .metismenu > li.mm-active > a, body:has(.sidebar-wrapper) .sidebar-wrapper .metismenu > li > a:hover, body:has(.sidebar-wrapper) .sidebar-wrapper .metismenu > li.mm-active > a { border-color:rgba(106,213,241,.55); color:#fff!important; background:linear-gradient(100deg,rgba(38,125,235,.72),rgba(12,57,144,.86))!important; box-shadow:0 8px 16px rgba(1,17,52,.2); transform:translateX(2px); }
body.dp-dashboard-shell .sidebar-wrapper .metismenu .parent-icon, body:has(.sidebar-wrapper) .sidebar-wrapper .metismenu .parent-icon { min-width:24px; color:#77ddf1; font-size:1rem; }
body.dp-dashboard-shell .sidebar-wrapper .metismenu .submenu, body:has(.sidebar-wrapper) .sidebar-wrapper .metismenu .submenu { padding:4px 0 4px 12px; }
body.dp-dashboard-shell .sidebar-wrapper .metismenu .submenu a, body:has(.sidebar-wrapper) .sidebar-wrapper .metismenu .submenu a { padding:8px 9px!important; border-radius:9px; color:#bdd0ed!important; font-size:.62rem; }
body.dp-dashboard-shell .sidebar-wrapper .metismenu .submenu a:hover, body:has(.sidebar-wrapper) .sidebar-wrapper .metismenu .submenu a:hover { color:#fff!important; background:rgba(74,151,255,.2); }
body.dp-dashboard-shell > .wrapper > header, body:has(.sidebar-wrapper) > .wrapper > header { position:fixed; top:38px; left:220px; right:0; z-index:1000; height:62px; }
body.dp-dashboard-shell .topbar, body:has(.sidebar-wrapper) .topbar { min-height:62px; padding:7px 18px; border-bottom:1px solid #dce8f6; background:rgba(255,255,255,.88)!important; box-shadow:0 7px 25px rgba(37,79,135,.07); backdrop-filter:blur(16px); }
body.dp-dashboard-shell .topbar .navbar, body:has(.sidebar-wrapper) .topbar .navbar { width:100%; min-height:48px; padding:5px 0; background:transparent!important; }
body.dp-dashboard-shell .mobile-toggle-menu, body:has(.sidebar-wrapper) .mobile-toggle-menu { display:grid; width:38px; height:38px; margin-right:12px; place-items:center; border:1px solid #dce8f6; border-radius:11px; color:#1466e9; background:#f6faff; }
body.dp-dashboard-shell .topbar .btn-light, body:has(.sidebar-wrapper) .topbar .btn-light { border:1px solid #cfe0f6; border-radius:11px; color:#115dcc; background:#f6faff; font-size:.68rem; font-weight:900; }
body.dp-dashboard-shell .topbar .btn-success, body:has(.sidebar-wrapper) .topbar .btn-success { border:0; border-radius:11px; background:linear-gradient(135deg,#10a774,#1cc88a); font-size:.65rem; font-weight:900; }
body.dp-dashboard-shell .user-box, body:has(.sidebar-wrapper) .user-box { padding:4px 9px; border:1px solid #e0eaf5; border-radius:14px; background:#f8fbff; }
body.dp-dashboard-shell .user-box .user-img, body:has(.sidebar-wrapper) .user-box .user-img { width:33px; height:33px; border:2px solid #1768df; border-radius:50%; object-fit:contain; background:#061333; }
body.dp-dashboard-shell .user-box .user-name, body:has(.sidebar-wrapper) .user-box .user-name { color:#1c2e4d!important; font-size:.67rem; font-weight:900; }.user-box .designattion { color:#7990aa!important; font-size:.57rem; }
body.dp-dashboard-shell .page-wrapper, body:has(.sidebar-wrapper) .page-wrapper { min-height:100vh; margin-left:220px!important; padding-top:102px; background:#eef5fd!important; }
body.dp-dashboard-shell .page-content, body:has(.sidebar-wrapper) .page-content { width:min(1460px,100%); margin:0 auto; padding:23px!important; }
body.dp-dashboard-shell .page-content h1, body.dp-dashboard-shell .page-content h2, body.dp-dashboard-shell .page-content h3, body:has(.sidebar-wrapper) .page-content h1, body:has(.sidebar-wrapper) .page-content h2, body:has(.sidebar-wrapper) .page-content h3 { color:#14223e; font-weight:950; letter-spacing:-.035em; }
body.dp-dashboard-shell .page-content .card, body.dp-dashboard-shell .page-content .banner-container, body:has(.sidebar-wrapper) .page-content .card, body:has(.sidebar-wrapper) .page-content .banner-container { border:1px solid #deebf8!important; border-radius:20px!important; background:rgba(255,255,255,.94)!important; box-shadow:0 13px 30px rgba(37,79,135,.07)!important; }
body.dp-dashboard-shell .page-content .banner-container, body:has(.sidebar-wrapper) .page-content .banner-container { padding:14px 18px!important; }
body.dp-dashboard-shell .page-content .carousel, body:has(.sidebar-wrapper) .page-content .carousel { overflow:hidden; border-radius:18px; }.page-content .carousel img { min-height:120px; border-radius:16px; object-fit:cover; }
body.dp-dashboard-shell .summary-card, body:has(.sidebar-wrapper) .summary-card { min-height:106px; display:flex; flex-direction:column; justify-content:center; padding:21px 14px!important; border:0!important; border-radius:20px!important; color:#fff!important; box-shadow:0 14px 25px rgba(38,88,168,.15); }
body.dp-dashboard-shell .summary-card h5, body:has(.sidebar-wrapper) .summary-card h5 { font-size:1.35rem!important; font-weight:950; }.summary-card small { margin-top:6px; font-size:.64rem!important; font-weight:800; opacity:.88; }
body.dp-dashboard-shell .bg-wallet, body:has(.sidebar-wrapper) .bg-wallet { background:linear-gradient(135deg,#0d6de8,#19b8f2)!important; }.bg-admin { background:linear-gradient(135deg,#1769e8,#5e45e9)!important; }.bg-distributor { background:linear-gradient(135deg,#f1a928,#f5c442)!important; }.bg-users { background:linear-gradient(135deg,#6f3de8,#a143e9)!important; }.bg-success { background:linear-gradient(135deg,#0cab83,#21c7a5)!important; }.bg-info { background:linear-gradient(135deg,#3158d6,#19a1dd)!important; }.bg-warning { background:linear-gradient(135deg,#e79220,#f5bb32)!important; }.bg-primary { background:linear-gradient(135deg,#4d40d9,#803de4)!important; }.bg-purple { background:linear-gradient(135deg,#853fe8,#c449e8)!important; }.bg-dark { background:linear-gradient(135deg,#132b60,#1f518e)!important; }
body.dp-dashboard-shell .hand, body:has(.sidebar-wrapper) .hand { margin-bottom:16px; }.hand .card { height:100%; min-height:198px; display:flex; flex-direction:column; justify-content:center; align-items:center; padding:19px!important; }.hand .card:hover { transform:translateY(-4px); }.hand .card-icon img { width:68px; height:68px; margin-bottom:13px; border-radius:16px; object-fit:contain; }.hand .card-text { margin:0 0 11px; color:#1e3556!important; font-size:.74rem; font-weight:950; line-height:1.35; }.hand .badge { padding:7px 10px; border-radius:999px; background:#e6f0ff!important; color:#1b64d3!important; font-size:.58rem; font-weight:900; }
body.dp-dashboard-shell .page-content .table, body:has(.sidebar-wrapper) .page-content .table { overflow:hidden; border:1px solid #dfebf7; border-radius:16px; background:#fff; }.page-content .table thead th { border:0; color:#56708f; background:#edf5ff; font-size:.65rem; font-weight:900; }.page-content .table td { color:#455b77; font-size:.67rem; vertical-align:middle; }
body.dp-dashboard-shell .page-content .form-control, body.dp-dashboard-shell .page-content .form-select, body.dp-dashboard-shell .page-content textarea, body:has(.sidebar-wrapper) .page-content .form-control, body:has(.sidebar-wrapper) .page-content .form-select, body:has(.sidebar-wrapper) .page-content textarea { min-height:43px; border:1px solid #dce8f5!important; border-radius:12px!important; color:#1b2d4b!important; background:#fff!important; box-shadow:none!important; font-size:.78rem; }.page-content .form-control:focus, .page-content .form-select:focus, .page-content textarea:focus { border-color:#3f8af0!important; box-shadow:0 0 0 4px rgba(44,119,231,.12)!important; }.page-content label { color:#2d4666; font-size:.7rem; font-weight:850; }
body.dp-dashboard-shell .luxury-card, body:has(.sidebar-wrapper) .luxury-card, body.dp-dashboard-shell .service-box, body:has(.sidebar-wrapper) .service-box { width:min(100%,720px); margin:22px auto; padding:28px!important; border:1px solid #dce9f7!important; border-radius:24px!important; background:rgba(255,255,255,.96)!important; box-shadow:0 22px 48px rgba(36,77,132,.12)!important; }
body.dp-dashboard-shell .luxury-card .title, body:has(.sidebar-wrapper) .luxury-card .title { color:#172e60!important; font-size:1.15rem; font-weight:950; }.page-content .back-btn, .page-content a.text-primary { display:inline-flex; align-items:center; gap:6px; border-radius:10px; color:#1764d4!important; font-size:.72rem; font-weight:900; }.page-content .btn-primary, .page-content button.btn-primary { border:0!important; border-radius:12px!important; background:linear-gradient(135deg,#1466e9,#433ee2)!important; box-shadow:0 10px 20px rgba(34,92,213,.2); font-size:.73rem; font-weight:900; }.page-content .btn-success, .page-content button.btn-success { border:0!important; border-radius:12px!important; background:linear-gradient(135deg,#0aa974,#22c77d)!important; box-shadow:0 10px 20px rgba(12,165,113,.18); font-size:.73rem; font-weight:900; }
body.dp-dashboard-shell .support-widget, body:has(.sidebar-wrapper) .support-widget { right:15px; bottom:15px; gap:9px; }.support-link { padding:10px 14px!important; border:1px solid rgba(255,255,255,.5); border-radius:999px!important; color:#fff!important; background:linear-gradient(135deg,#4f46e5,#9333ea)!important; box-shadow:0 14px 28px rgba(76,61,204,.24)!important; font-size:.66rem!important; font-weight:900!important; }.support-link i { width:27px; height:27px; display:grid; place-items:center; padding:0!important; font-size:.8rem!important; }
@media(max-width:991px) { body.dp-dashboard-shell .sidebar-wrapper, body:has(.sidebar-wrapper) .sidebar-wrapper { left:-220px; transition:left .25s ease; }.wrapper.toggled .sidebar-wrapper { left:0!important; }.wrapper.toggled::after { position:fixed; inset:38px 0 0; z-index:1050; content:""; background:rgba(3,17,48,.42); }.wrapper.toggled .sidebar-wrapper { z-index:1100; } body.dp-dashboard-shell > .wrapper > header, body:has(.sidebar-wrapper) > .wrapper > header { left:0; }.page-wrapper, body.dp-dashboard-shell .page-wrapper, body:has(.sidebar-wrapper) .page-wrapper { margin-left:0!important; }.page-content, body.dp-dashboard-shell .page-content, body:has(.sidebar-wrapper) .page-content { padding:18px 14px!important; } body.dp-dashboard-shell .mobile-toggle-menu, body:has(.sidebar-wrapper) .mobile-toggle-menu { display:grid; } }
@media(max-width:600px) { body.dp-dashboard-shell .dp-dashboard-ticker, body:has(.sidebar-wrapper) .dp-dashboard-ticker { justify-content:flex-start; font-size:.62rem; }.topbar { padding-inline:10px!important; }.topbar .top-menu, .topbar #time { display:none!important; }.topbar .user-box .user-info { display:none; }.topbar .btn-light { margin-left:auto; }.page-wrapper, body.dp-dashboard-shell .page-wrapper, body:has(.sidebar-wrapper) .page-wrapper { padding-top:93px!important; }.page-content .row > [class*=col-] { margin-bottom:9px; }.summary-card { min-height:88px!important; }.hand .card { min-height:175px; }.luxury-card, body.dp-dashboard-shell .luxury-card, body:has(.sidebar-wrapper) .luxury-card, body.dp-dashboard-shell .service-box, body:has(.sidebar-wrapper) .service-box { padding:19px!important; border-radius:19px!important; }.page-content .table-responsive { overflow-x:auto; } }
/* Dashboard landing hero and quick actions */
body.dp-dashboard-shell .dp-dashboard-hero, body:has(.sidebar-wrapper) .dp-dashboard-hero { position:relative; display:flex; align-items:center; justify-content:space-between; gap:25px; min-height:250px; margin:0 0 18px; padding:29px 30px; border:1px solid rgba(255,255,255,.26); border-radius:26px; color:#fff; background:linear-gradient(130deg,#071b55 0%,#084bd1 57%,#1481ff 100%); box-shadow:0 22px 55px rgba(37,99,235,.27); overflow:hidden; }
body.dp-dashboard-shell .dp-dashboard-hero::before, body:has(.sidebar-wrapper) .dp-dashboard-hero::before { position:absolute; right:14%; bottom:-130px; width:330px; height:330px; border:1px solid rgba(255,255,255,.18); border-radius:50%; box-shadow:0 0 0 28px rgba(255,255,255,.04),0 0 0 56px rgba(255,255,255,.035); content:""; }
body.dp-dashboard-shell .dp-dashboard-hero-copy, body:has(.sidebar-wrapper) .dp-dashboard-hero-copy { position:relative; z-index:1; }.dp-dashboard-premium { display:inline-flex; padding:8px 12px; border:1px solid rgba(255,255,255,.25); border-radius:999px; color:#fff; background:rgba(255,255,255,.13); font-size:.66rem; font-weight:900; }.dp-dashboard-hero h1 { position:relative; z-index:1; margin:17px 0 7px; color:#fff!important; font-size:clamp(1.5rem,3vw,2.1rem); letter-spacing:-.045em; }.dp-dashboard-hero p { position:relative; z-index:1; margin:0; color:#d9e7ff; font-size:.76rem; }.dp-dashboard-actions { position:relative; z-index:1; display:flex; flex-wrap:wrap; gap:9px; margin-top:22px; }.dp-dashboard-actions a { display:inline-flex; align-items:center; min-height:42px; padding:0 15px; border-radius:13px; color:#123a83!important; background:#fff; box-shadow:0 9px 18px rgba(3,22,72,.15); font-size:.7rem; font-weight:950; transition:transform .18s ease,box-shadow .18s ease; }.dp-dashboard-actions a:hover { transform:translateY(-2px); box-shadow:0 13px 22px rgba(3,22,72,.23); }.dp-dashboard-hero-wallet { position:relative; z-index:1; display:flex; min-width:173px; flex-direction:column; align-items:center; padding:23px 20px; border:1px solid rgba(255,255,255,.25); border-radius:22px; background:rgba(255,255,255,.12); text-align:center; box-shadow:inset 0 1px 0 rgba(255,255,255,.18); }.dp-dashboard-hero-wallet small { color:#dceaff; font-size:.64rem; font-weight:900; }.dp-dashboard-hero-wallet strong { margin:7px 0 4px; color:#fff; font-size:2rem; letter-spacing:-.05em; }.dp-dashboard-hero-wallet span { color:#c6dcff; font-size:.59rem; font-weight:800; }.dp-dashboard-app-banner { display:flex; align-items:center; gap:13px; min-height:70px; margin:0 0 18px; padding:13px 18px; border:1px solid #dce8f7; border-radius:18px; color:#233e6a; background:linear-gradient(100deg,#246be0,#5b3fe4); box-shadow:0 13px 28px rgba(58,73,186,.15); }.dp-dashboard-app-banner > span { display:grid; width:42px; height:42px; place-items:center; border:1px solid rgba(255,255,255,.22); border-radius:13px; background:rgba(255,255,255,.16); font-size:1.2rem; }.dp-dashboard-app-banner small,.dp-dashboard-app-banner strong { display:block; color:#fff; }.dp-dashboard-app-banner small { font-size:.53rem; font-weight:900; letter-spacing:.08em; }.dp-dashboard-app-banner strong { margin-top:4px; font-size:.72rem; }.dp-dashboard-app-banner b { margin-left:auto; padding:9px 13px; border-radius:11px; color:#1d3d84; background:#fff; font-size:.62rem; font-weight:950; white-space:nowrap; }
@media(max-width:650px) { body.dp-dashboard-shell .dp-dashboard-hero, body:has(.sidebar-wrapper) .dp-dashboard-hero { display:block; min-height:0; padding:23px 19px; }.dp-dashboard-hero-wallet { max-width:190px; margin:22px 0 0; }.dp-dashboard-actions a { flex:1 1 calc(50% - 9px); justify-content:center; padding-inline:8px; font-size:.62rem; }.dp-dashboard-app-banner { align-items:flex-start; flex-wrap:wrap; }.dp-dashboard-app-banner b { margin-left:55px; margin-top:-5px; } }
/* Animated reference-style dashboard watermark logo */
.dp-dashboard-hero-logo { position:absolute; z-index:0; top:50%; left:40%; width:190px; height:190px; display:grid; place-items:center; opacity:.25; pointer-events:none; transform:translate(-50%,-50%); animation:dp-dashboard-logo-float 7s ease-in-out infinite; }
.dp-dashboard-hero-logo img { position:relative; width:158px; height:158px; border:2px solid rgba(248,189,40,.72); border-radius:50%; object-fit:contain; background:#061333; filter:saturate(1.08) drop-shadow(0 14px 22px rgba(0,0,0,.22)); }
.dp-dashboard-hero-logo-ring { position:absolute; inset:0; border:4px solid transparent; border-top-color:#f8bd28; border-right-color:#38d2ef; border-bottom-color:rgba(255,255,255,.28); border-radius:50%; animation:dp-dashboard-logo-spin 5s linear infinite; }
.dp-dashboard-hero-logo-ring::after { position:absolute; inset:13px; border:1px solid rgba(255,255,255,.28); border-radius:50%; content:""; }
@keyframes dp-dashboard-logo-spin { to { transform:rotate(360deg); } }
@keyframes dp-dashboard-logo-float { 0%,100% { transform:translate(-50%,-50%) translate3d(-12px,2px,0) rotate(-1deg) scale(1); } 25% { transform:translate(-50%,-50%) translate3d(8px,-5px,0) rotate(1deg) scale(1.018); } 50% { transform:translate(-50%,-50%) translate3d(26px,-10px,0) rotate(2deg) scale(1.04); } 75% { transform:translate(-50%,-50%) translate3d(6px,-5px,0) rotate(1deg) scale(1.018); } }
@media(max-width:650px) { .dp-dashboard-hero-logo { left:72%; top:58%; width:145px; height:145px; opacity:.18; }.dp-dashboard-hero-logo img { width:120px; height:120px; } }
/* Reference spacing: desktop hero starts directly below the ticker */
@media(min-width:992px) { body.dp-dashboard-shell > .wrapper > header, body:has(.sidebar-wrapper) > .wrapper > header { height:0!important; pointer-events:none; } body.dp-dashboard-shell .topbar, body:has(.sidebar-wrapper) .topbar { display:none!important; } body.dp-dashboard-shell .page-wrapper, body:has(.sidebar-wrapper) .page-wrapper { margin-top:0!important; padding-top:38px!important; } }
@media(max-width:991px) { body.dp-dashboard-shell .page-wrapper, body:has(.sidebar-wrapper) .page-wrapper { margin-top:0!important; padding-top:100px!important; } }
/* =========================================================
   GROUPED SERVICE CATALOG + INSTANT SERVICE WINDOW
   Presentation layer only: routes and service APIs stay unchanged.
   ========================================================= */
.dp-service-catalog {
  margin: 28px 0 42px;
}
.dp-service-catalog-intro {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 18px;
  margin: 0 2px 16px;
}
.dp-service-catalog-kicker,
.dp-service-category-kicker {
  display: inline-flex;
  align-items: center;
  color: #1e64d8;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.dp-service-catalog-intro h2 {
  margin: 5px 0 3px;
  color: #0a2860;
  font-size: clamp(25px, 3vw, 34px);
  font-weight: 900;
}
.dp-service-catalog-intro p {
  margin: 0;
  color: #64748b;
  font-size: 14px;
  font-weight: 600;
}
.dp-service-catalog-note {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  padding: 8px 13px;
  border: 1px solid #cfe0fb;
  border-radius: 999px;
  color: #2757a7;
  background: #edf5ff;
  font-size: 11px;
  font-weight: 800;
  white-space: nowrap;
}
.dp-service-category {
  position: relative;
  margin: 18px 0 24px;
  padding: 20px 20px 18px;
  overflow: hidden;
  border: 1px solid #dbe8f8;
  border-top: 4px solid #1e6ee9;
  border-radius: 24px;
  background: rgba(255,255,255,.92);
  box-shadow: 0 16px 42px rgba(17, 58, 117, .08);
}
.dp-service-category::after {
  position: absolute;
  top: -85px;
  right: -70px;
  width: 210px;
  height: 210px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(54,116,241,.14), rgba(54,116,241,0) 70%);
  content: '';
  pointer-events: none;
}
.dp-service-category-head {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 15px;
}
.dp-service-category-title-wrap {
  display: flex;
  align-items: center;
  gap: 13px;
  min-width: 0;
}
.dp-service-category-icon {
  display: grid;
  flex: 0 0 48px;
  width: 48px;
  height: 48px;
  place-items: center;
  border: 1px solid #c9ddfb;
  border-radius: 16px;
  background: linear-gradient(135deg, #eaf3ff, #d7e8ff);
  font-size: 24px;
  box-shadow: 0 8px 18px rgba(28, 99, 213, .12);
}
.dp-service-category-kicker {
  color: #6681a5;
  font-size: 9px;
}
.dp-service-category h2 {
  margin: 3px 0 2px;
  color: #092860;
  font-size: clamp(20px, 2.4vw, 27px);
  font-weight: 900;
}
.dp-service-category p {
  margin: 0;
  color: #71819a;
  font-size: 12px;
  font-weight: 600;
}
.dp-service-category-link {
  position: relative;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  flex: 0 0 auto;
  padding: 10px 14px;
  border-radius: 12px;
  color: #145ac7 !important;
  background: #edf5ff;
  font-size: 12px;
  font-weight: 900;
  text-decoration: none !important;
  transition: transform .2s ease, background .2s ease;
}
.dp-service-category-link:hover {
  transform: translateY(-2px);
  background: #dcecff;
}
.dp-service-category-grid {
  position: relative;
  z-index: 1;
  margin: 0 -8px;
}
.dp-service-card-col {
  display: flex;
  padding: 8px;
  margin-bottom: 0 !important;
}
.dp-service-card {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  min-height: 218px;
  padding: 15px;
  border: 1px solid #e1eaf7 !important;
  border-radius: 19px !important;
  background: #fff !important;
  box-shadow: 0 9px 24px rgba(26, 66, 119, .08) !important;
  transition: transform .22s ease, border-color .22s ease, box-shadow .22s ease;
}
.dp-service-card:hover {
  transform: translateY(-5px);
  border-color: #99c2ff !important;
  box-shadow: 0 18px 32px rgba(27, 101, 218, .16) !important;
}
.dp-service-card-top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 8px;
}
.dp-service-card-icon {
  display: grid;
  width: 70px;
  height: 70px;
  place-items: center;
  overflow: hidden;
  border: 1px solid #e2ecfb;
  border-radius: 17px;
  background: linear-gradient(145deg, #f8fbff, #eaf3ff);
}
.dp-service-card-icon img,
.dp-service-card .service-img {
  width: 58px;
  height: 58px;
  max-height: 58px;
  object-fit: contain;
}
.dp-service-live {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 5px 8px;
  border-radius: 999px;
  color: #087849;
  background: #dbf8e9;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .06em;
}
.dp-service-live i {
  display: inline-block;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #19bb69;
  box-shadow: 0 0 0 3px rgba(25,187,105,.14);
}
.dp-service-card-title {
  display: -webkit-box;
  min-height: 42px;
  margin: 14px 0 7px;
  overflow: hidden;
  color: #102d5e !important;
  font-size: 15px !important;
  font-weight: 900 !important;
  line-height: 1.35;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
.dp-service-card-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-top: auto;
  color: #8190a7;
  font-size: 10px;
  font-weight: 700;
}
.dp-service-card-meta b {
  color: #1e64d8;
  font-size: 11px;
}
.dp-service-card-actions {
  display: flex;
  gap: 8px;
  margin-top: 11px;
}
.dp-service-card-action,
.dp-service-card-list {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 34px;
  padding: 7px 11px;
  border-radius: 10px;
  font-size: 11px;
  font-weight: 900;
  text-decoration: none !important;
  transition: transform .2s ease, background .2s ease;
}
.dp-service-card-action {
  flex: 1 1 auto;
  color: #fff !important;
  background: linear-gradient(135deg, #1259ca, #347ef3);
  box-shadow: 0 7px 14px rgba(24, 96, 211, .18);
}
.dp-service-card-list {
  color: #285b9f !important;
  background: #edf4ff;
  border: 1px solid #cbdffb;
}
.dp-service-card-action:hover,
.dp-service-card-list:hover {
  transform: translateY(-2px);
}
.dp-service-card-action:hover {
  background: linear-gradient(135deg, #0c4cae, #286ee4);
}
.dp-service-card-list:hover {
  background: #dfedff;
}

/* Reference-style branded service modal. The iframe keeps each original PHP form/API route intact. */
.dp-service-modal {
  position: fixed;
  z-index: 100000;
  inset: 0;
  display: grid;
  padding: clamp(10px, 3vw, 32px);
  place-items: center;
  background: rgba(3, 14, 38, .72);
  backdrop-filter: blur(9px);
}
.dp-service-modal[hidden] {
  display: none !important;
}
.dp-service-modal-dialog {
  display: flex;
  flex-direction: column;
  width: min(1080px, 100%);
  height: min(860px, 94vh);
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.38);
  border-radius: 22px;
  background: #edf4ff;
  box-shadow: 0 28px 90px rgba(0,0,0,.45);
  animation: dp-service-modal-in .24s ease-out both;
}
.dp-service-modal-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  min-height: 68px;
  padding: 12px 16px 12px 20px;
  color: #fff;
  background: linear-gradient(110deg, #07265b, #115ad6 60%, #5a3df2);
}
.dp-service-modal-title {
  display: flex;
  flex-direction: column;
  gap: 3px;
  min-width: 0;
}
.dp-service-modal-title strong {
  overflow: hidden;
  font-size: 15px;
  font-weight: 900;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.dp-service-modal-title span {
  color: rgba(255,255,255,.78);
  font-size: 11px;
  font-weight: 600;
}
.dp-service-modal-controls {
  display: flex;
  gap: 8px;
}
.dp-service-modal-controls button {
  display: grid;
  width: 40px;
  height: 40px;
  padding: 0;
  place-items: center;
  border: 1px solid rgba(255,255,255,.34);
  border-radius: 12px;
  color: #fff;
  background: rgba(255,255,255,.16);
  font-size: 24px;
  line-height: 1;
  cursor: pointer;
  transition: background .2s ease, transform .2s ease;
}
.dp-service-modal-controls button:hover {
  transform: translateY(-2px);
  background: rgba(255,255,255,.28);
}
.dp-service-modal-frame {
  display: block;
  width: 100%;
  min-height: 0;
  flex: 1 1 auto;
  border: 0;
  background: #edf4ff;
}
body.dp-service-modal-open {
  overflow: hidden !important;
}
body.dp-embedded-service {
  min-width: 0 !important;
  background: #edf4ff !important;
}
body.dp-embedded-service > .dp-dashboard-ticker,
body.dp-embedded-service > .wrapper > header,
body.dp-embedded-service .sidebar-wrapper,
body.dp-embedded-service .topbar,
body.dp-embedded-service .support-widget,
body.dp-embedded-service .dp-dashboard-ticker {
  display: none !important;
}
body.dp-embedded-service > .wrapper,
body.dp-embedded-service .content-wrap,
body.dp-embedded-service .main,
body.dp-embedded-service .page-wrapper {
  width: 100% !important;
  max-width: none !important;
  min-height: 100vh !important;
  margin: 0 !important;
  padding: 0 !important;
}
body.dp-embedded-service .page-content {
  width: 100% !important;
  min-height: 100vh;
  margin: 0 !important;
  padding: 22px !important;
}
body.dp-embedded-service .page-content > .container-fluid {
  max-width: 860px;
  margin: 0 auto;
}
@keyframes dp-service-modal-in {
  from { opacity: 0; transform: translateY(12px) scale(.985); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

@media (max-width: 991px) {
  .dp-service-category { padding: 17px 14px 14px; border-radius: 20px; }
  .dp-service-category-grid { margin: 0 -6px; }
  .dp-service-card-col { padding: 6px; }
  .dp-service-card { min-height: 204px; padding: 12px; }
  .dp-service-card-icon { width: 60px; height: 60px; }
  .dp-service-card-icon img,
  .dp-service-card .service-img { width: 50px; height: 50px; max-height: 50px; }
  .dp-service-modal { padding: 0; }
  .dp-service-modal-dialog { width: 100%; height: 100%; border-radius: 0; }
  .dp-service-modal-head { border-radius: 0; }
}
@media (max-width: 640px) {
  .dp-service-catalog-intro { align-items: flex-start; flex-direction: column; gap: 10px; }
  .dp-service-catalog-note { align-self: flex-start; }
  .dp-service-category-head { align-items: flex-start; flex-direction: column; gap: 12px; }
  .dp-service-category-link { align-self: flex-start; }
  .dp-service-card-col { width: 50%; }
  .dp-service-card { min-height: 205px; }
  .dp-service-card-title { font-size: 13px !important; }
  body.dp-embedded-service .page-content { padding: 13px !important; }
}
@media (max-width: 390px) {
  .dp-service-card-col { width: 100%; }
}
.dp-service-page-heading {
  flex: 0 0 100%;
  width: 100%;
  margin: 0 0 17px;
  padding: 18px 20px;
  border: 1px solid #dbe8f8;
  border-top: 4px solid #1e6ee9;
  border-radius: 20px;
  background: rgba(255,255,255,.94);
  box-shadow: 0 13px 32px rgba(17, 58, 117, .08);
}
.dp-service-page-heading h1 {
  margin: 3px 0 2px;
  color: #092860;
  font-size: clamp(22px, 2.5vw, 30px);
  font-weight: 900;
}
.dp-service-page-heading p {
  margin: 0;
  color: #71819a;
  font-size: 12px;
  font-weight: 600;
}
.dp-service-page-heading + .dp-service-card-col {
  margin-top: 0;
}
@media (max-width: 640px) {
  .dp-service-page-heading { padding: 15px 13px; border-radius: 17px; }
}
/* Final shell alignment: preserve original menu structure, separate logo and navigation. */
body.dp-dashboard-shell .sidebar-wrapper,
body:has(.sidebar-wrapper) .sidebar-wrapper {
  overflow-x: hidden !important;
  overflow-y: auto !important;
}
body.dp-dashboard-shell .sidebar-header,
body:has(.sidebar-wrapper) .sidebar-header {
  height: 205px !important;
  flex: 0 0 205px !important;
  align-items: center;
  justify-content: flex-start !important;
  gap: 8px !important;
  padding: 14px 10px 12px !important;
  overflow: visible !important;
}
body.dp-dashboard-shell .sidebar-header > div:first-child,
body:has(.sidebar-wrapper) .sidebar-header > div:first-child {
  width: 108px !important;
  height: 108px !important;
  flex: 0 0 108px !important;
  margin: 0 auto !important;
}
body.dp-dashboard-shell .sidebar-header .logo-icon,
body:has(.sidebar-wrapper) .sidebar-header .logo-icon {
  display: block !important;
  width: 108px !important;
  height: 108px !important;
  margin: 0 !important;
  border-radius: 50% !important;
}
body.dp-dashboard-shell .sidebar-header .logo-text,
body:has(.sidebar-wrapper) .sidebar-header .logo-text {
  max-width: 190px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
body.dp-dashboard-shell .sidebar-wrapper .metismenu,
body:has(.sidebar-wrapper) .sidebar-wrapper .metismenu {
  position: relative;
  z-index: 2;
  margin: 0 !important;
  padding: 16px 9px 28px !important;
}

/* The Digital Punjab watermark drifts across the complete dashboard viewport. */
@keyframes dp-dashboard-logo-screen-drift {
  0%, 100% { transform: translate3d(0, -50%, 0) rotate(-2deg) scale(.94); }
  50% { transform: translate3d(calc(100vw - 500px), -50%, 0) rotate(2deg) scale(1.02); }
}
@media (min-width: 992px) {
  body.dp-dashboard-shell .dp-dashboard-hero-logo,
  body:has(.sidebar-wrapper) .dp-dashboard-hero-logo {
    position: fixed !important;
    top: 52% !important;
    left: 228px !important;
    z-index: 0 !important;
    width: 176px !important;
    height: 176px !important;
    opacity: .12 !important;
    animation: dp-dashboard-logo-screen-drift 16s ease-in-out infinite !important;
  }
  body.dp-dashboard-shell .dp-dashboard-hero-logo img,
  body:has(.sidebar-wrapper) .dp-dashboard-hero-logo img {
    width: 146px !important;
    height: 146px !important;
  }
}
@media (max-width: 991px) {
  body.dp-dashboard-shell .dp-dashboard-hero-logo,
  body:has(.sidebar-wrapper) .dp-dashboard-hero-logo {
    position: fixed !important;
    top: 52% !important;
    left: 8px !important;
    z-index: 0 !important;
    width: 140px !important;
    height: 140px !important;
    opacity: .09 !important;
    animation: dp-dashboard-logo-screen-drift 13s ease-in-out infinite !important;
  }
  body.dp-dashboard-shell .dp-dashboard-hero-logo img,
  body:has(.sidebar-wrapper) .dp-dashboard-hero-logo img {
    width: 116px !important;
    height: 116px !important;
  }
}
/* Keep every original sidebar control; only its visual treatment changes. */
body.dp-dashboard-shell .sidebar-header,
body:has(.sidebar-wrapper) .sidebar-header {
  position: relative !important;
}
body.dp-dashboard-shell .sidebar-header .toggle-icon,
body:has(.sidebar-wrapper) .sidebar-header .toggle-icon {
  position: absolute !important;
  top: 14px !important;
  right: 10px !important;
  display: grid !important;
  width: 30px !important;
  height: 30px !important;
  margin: 0 !important;
  place-items: center;
  border: 1px solid rgba(255,255,255,.25);
  border-radius: 9px;
  color: #fff !important;
  background: rgba(255,255,255,.1);
  cursor: pointer;
}
body.dp-dashboard-shell .sidebar-header .toggle-icon:hover,
body:has(.sidebar-wrapper) .sidebar-header .toggle-icon:hover {
  background: rgba(57,145,255,.55);
}
/* New Digital Punjab look: keep the old service-menu structure, animate the watermark in every direction. */
@keyframes dp-dashboard-logo-screen-drift {
  0% { transform: translate3d(0, -50%, 0) rotate(-5deg) scale(.88); }
  25% { transform: translate3d(calc(34vw - 150px), calc(-50% - 45px), 0) rotate(3deg) scale(1.02); }
  50% { transform: translate3d(calc(100vw - 470px), -50%, 0) rotate(6deg) scale(.96); }
  75% { transform: translate3d(calc(55vw - 170px), calc(-50% + 55px), 0) rotate(-3deg) scale(1.04); }
  100% { transform: translate3d(0, -50%, 0) rotate(-5deg) scale(.88); }
}
@media (min-width: 992px) {
  body.dp-dashboard-shell .dp-dashboard-hero-logo,
  body:has(.sidebar-wrapper) .dp-dashboard-hero-logo {
    animation: dp-dashboard-logo-screen-drift 11s ease-in-out infinite !important;
    opacity: .10 !important;
  }
}
@media (max-width: 991px) {
  body.dp-dashboard-shell .dp-dashboard-hero-logo,
  body:has(.sidebar-wrapper) .dp-dashboard-hero-logo {
    animation: dp-dashboard-logo-screen-drift 9s ease-in-out infinite !important;
    opacity: .08 !important;
  }
}
[data-dp-service-page] { cursor: pointer; }

/* Responsive menu and route-page return control. */
.dp-mobile-menu-toggle,
.dp-back-home { display: none; }
@media (max-width: 991px) {
  body.dp-dashboard-shell .sidebar-wrapper,
  body:has(.sidebar-wrapper) .sidebar-wrapper {
    top: 38px !important;
    bottom: 0 !important;
    width: min(292px, 88vw) !important;
    transform: translateX(-105%) !important;
    transition: transform .28s ease, box-shadow .28s ease !important;
    z-index: 1400 !important;
  }
  body.dp-mobile-menu-open .sidebar-wrapper,
  body.dp-mobile-menu-open:has(.sidebar-wrapper) .sidebar-wrapper {
    transform: translateX(0) !important;
    box-shadow: 18px 0 42px rgba(0,0,0,.34) !important;
  }
  .dp-mobile-menu-toggle {
    display: inline-flex !important;
    position: fixed !important;
    top: 52px !important;
    left: 12px !important;
    z-index: 1500 !important;
    align-items: center;
    gap: 6px;
    min-height: 38px;
    padding: 8px 12px;
    border: 1px solid rgba(255,255,255,.35);
    border-radius: 12px;
    color: #fff;
    background: linear-gradient(135deg,#0b3c9f,#167cf4);
    box-shadow: 0 8px 20px rgba(5,28,87,.26);
    font: 800 .72rem/1 system-ui,sans-serif;
  }
  .dp-mobile-menu-toggle i { font-size: 1.12rem; }
  .dp-back-home {
    display: inline-flex !important;
    position: fixed !important;
    top: 52px !important;
    right: 12px !important;
    z-index: 1500 !important;
    align-items: center;
    min-height: 38px;
    padding: 8px 11px;
    border: 1px solid rgba(255,255,255,.35);
    border-radius: 12px;
    color: #0b3c9f !important;
    background: rgba(255,255,255,.96);
    box-shadow: 0 8px 20px rgba(5,28,87,.18);
    font: 850 .68rem/1 system-ui,sans-serif;
    text-decoration: none !important;
  }
  body.dp-mobile-menu-open .dp-mobile-menu-toggle { background: linear-gradient(135deg,#e33652,#fa7c45); }
  body.dp-dashboard-shell .page-wrapper,
  body:has(.sidebar-wrapper) .page-wrapper {
    margin-left: 0 !important;
    width: 100% !important;
  }
}
@media (min-width: 992px) {
  .dp-back-home {
    display: inline-flex;
    position: fixed;
    top: 48px;
    right: 16px;
    z-index: 1200;
    align-items: center;
    min-height: 34px;
    padding: 7px 12px;
    border: 1px solid rgba(255,255,255,.3);
    border-radius: 10px;
    color: #0b3c9f !important;
    background: rgba(255,255,255,.94);
    box-shadow: 0 7px 16px rgba(5,28,87,.16);
    font: 850 .7rem/1 system-ui,sans-serif;
    text-decoration: none !important;
  }
}

/* Sidebar accordions: every original section starts closed and opens on its own click. */
body.dp-dashboard-shell .sidebar-wrapper .metismenu > li > ul,
body:has(.sidebar-wrapper) .sidebar-wrapper .metismenu > li > ul {
  display: none !important;
  visibility: hidden;
  opacity: 0;
  max-height: 0;
  overflow: hidden;
  transition: opacity .18s ease, max-height .22s ease;
}
body.dp-dashboard-shell .sidebar-wrapper .metismenu > li.mm-active > ul,
body:has(.sidebar-wrapper) .sidebar-wrapper .metismenu > li.mm-active > ul {
  display: block !important;
  visibility: visible;
  opacity: 1;
  max-height: 560px;
  overflow: visible;
}
body.dp-dashboard-shell .sidebar-wrapper .metismenu > li > ul,
body:has(.sidebar-wrapper) .sidebar-wrapper .metismenu > li > ul {
  margin: 4px 0 8px !important;
  padding: 5px 7px !important;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 10px;
  background: rgba(2,15,50,.38) !important;
}
body.dp-dashboard-shell .sidebar-wrapper .metismenu > li > ul a,
body:has(.sidebar-wrapper) .sidebar-wrapper .metismenu > li > ul a {
  min-height: 30px;
  padding: 7px 8px !important;
  color: #dbe9ff !important;
  border-radius: 7px;
  font-size: .64rem;
}
body.dp-dashboard-shell .sidebar-wrapper .metismenu > li > ul a:hover,
body:has(.sidebar-wrapper) .sidebar-wrapper .metismenu > li > ul a:hover {
  color: #fff !important;
  background: rgba(39,126,245,.34) !important;
}

/* Mobile hamburger must reveal the complete original sidebar, not a collapsed slice. */
@media (max-width: 991px) {
  body.dp-dashboard-shell .sidebar-wrapper,
  body:has(.sidebar-wrapper) .sidebar-wrapper {
    left: 0 !important;
    right: auto !important;
    margin-left: 0 !important;
  }
}

/* The old wallet/user topbar is removed visually; sidebar and hero wallet remain functional. */
body.dp-dashboard-shell > .wrapper > header,
body:has(.sidebar-wrapper) > .wrapper > header {
  display: none !important;
  height: 0 !important;
  min-height: 0 !important;
}
.dp-dashboard-ticker-empty {
  visibility: hidden !important;
}
@media (max-width: 991px) {
  body.dp-dashboard-shell .page-wrapper,
  body:has(.sidebar-wrapper) .page-wrapper {
    padding-top: 38px !important;
  }
}

/* Collapse the notification row completely when Popup Alert is off/empty. */
.dp-dashboard-ticker-empty { display: none !important; visibility: visible !important; }
body:has(.dp-dashboard-ticker-empty) .sidebar-wrapper { top: 0 !important; }
body:has(.dp-dashboard-ticker-empty) .page-wrapper { padding-top: 0 !important; }
body:has(.dp-dashboard-ticker-empty) .dp-mobile-menu-toggle,
body:has(.dp-dashboard-ticker-empty) .dp-back-home { top: 12px !important; }

/* Reference card palette: dark Digital Punjab instant-services theme. */
body.dp-dashboard-shell,
body:has(.sidebar-wrapper) {
  background: linear-gradient(145deg, #071640 0%, #111a58 47%, #321a72 100%) !important;
}
body.dp-dashboard-shell .page-wrapper,
body:has(.sidebar-wrapper) .page-wrapper,
body.dp-dashboard-shell .page-content,
body:has(.sidebar-wrapper) .page-content {
  background: transparent !important;
}
body.dp-dashboard-shell .dp-service-catalog,
body:has(.sidebar-wrapper) .dp-service-catalog {
  color: #fff;
}
body.dp-dashboard-shell .dp-service-catalog-intro h2,
body:has(.sidebar-wrapper) .dp-service-catalog-intro h2 {
  color: #fff !important;
  text-shadow: 0 3px 18px rgba(0,0,0,.32);
}
body.dp-dashboard-shell .dp-service-catalog-intro p,
body:has(.sidebar-wrapper) .dp-service-catalog-intro p {
  color: #cbd8ff !important;
}
body.dp-dashboard-shell .dp-service-catalog-kicker,
body:has(.sidebar-wrapper) .dp-service-catalog-kicker {
  color: #ffd52f !important;
}
body.dp-dashboard-shell .dp-service-catalog-note,
body:has(.sidebar-wrapper) .dp-service-catalog-note {
  color: #dbe7ff !important;
  border-color: rgba(255,213,47,.45) !important;
  background: rgba(255,255,255,.08) !important;
}
body.dp-dashboard-shell .dp-service-category,
body:has(.sidebar-wrapper) .dp-service-category {
  border: 1px solid rgba(89,132,255,.72) !important;
  border-top: 3px solid #ffd52f !important;
  border-radius: 20px !important;
  background:
    radial-gradient(circle at 92% 2%, rgba(108,95,255,.32), transparent 22%),
    linear-gradient(145deg, rgba(35,53,157,.96), rgba(25,29,96,.98) 58%, rgba(58,27,125,.98)) !important;
  box-shadow: 0 22px 48px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.13) !important;
}
body.dp-dashboard-shell .dp-service-category-kicker,
body:has(.sidebar-wrapper) .dp-service-category-kicker {
  color: #a9bdff !important;
}
body.dp-dashboard-shell .dp-service-category h2,
body:has(.sidebar-wrapper) .dp-service-category h2 {
  color: #fff !important;
  text-shadow: 0 3px 16px rgba(0,0,0,.28);
}
body.dp-dashboard-shell .dp-service-category p,
body:has(.sidebar-wrapper) .dp-service-category p {
  color: #d0dcff !important;
}
body.dp-dashboard-shell .dp-service-category-icon,
body:has(.sidebar-wrapper) .dp-service-category-icon {
  border-color: rgba(255,213,47,.52) !important;
  color: #fff !important;
  background: linear-gradient(145deg, rgba(255,213,47,.22), rgba(28,98,220,.62)) !important;
  box-shadow: 0 9px 20px rgba(0,0,0,.22);
}
body.dp-dashboard-shell .dp-service-category-link,
body:has(.sidebar-wrapper) .dp-service-category-link {
  color: #fff !important;
  border-color: rgba(255,213,47,.58) !important;
  background: rgba(255,255,255,.10) !important;
}
body.dp-dashboard-shell .dp-service-category-link:hover,
body:has(.sidebar-wrapper) .dp-service-category-link:hover {
  color: #10194e !important;
  background: #ffd52f !important;
}
body.dp-dashboard-shell .dp-service-card,
body:has(.sidebar-wrapper) .dp-service-card {
  position: relative;
  min-height: 218px;
  overflow: hidden;
  border: 1px solid rgba(103,151,255,.78) !important;
  border-radius: 18px !important;
  color: #fff !important;
  background:
    radial-gradient(circle at 98% 4%, rgba(116,114,255,.45) 0, rgba(116,114,255,.18) 17%, transparent 18%),
    linear-gradient(145deg, #2843ae 0%, #123483 55%, #182561 100%) !important;
  box-shadow: 0 14px 30px rgba(0,0,0,.25), inset 0 1px 0 rgba(255,255,255,.16) !important;
}
body.dp-dashboard-shell .dp-service-card::after,
body:has(.sidebar-wrapper) .dp-service-card::after {
  position: absolute;
  right: -48px;
  bottom: -70px;
  width: 180px;
  height: 180px;
  content: "";
  border: 1px solid rgba(103,195,255,.16);
  border-radius: 50%;
  box-shadow: 0 0 0 22px rgba(103,195,255,.04), 0 0 0 44px rgba(103,195,255,.03);
  pointer-events: none;
}
body.dp-dashboard-shell .dp-service-card:hover,
body:has(.sidebar-wrapper) .dp-service-card:hover {
  border-color: #ffd52f !important;
  box-shadow: 0 20px 38px rgba(0,0,0,.34), 0 0 0 1px rgba(255,213,47,.32) !important;
}
body.dp-dashboard-shell .dp-service-card-icon,
body:has(.sidebar-wrapper) .dp-service-card-icon {
  border: 1px solid rgba(255,255,255,.28) !important;
  background: linear-gradient(145deg, rgba(255,255,255,.20), rgba(6,24,84,.62)) !important;
  box-shadow: 0 8px 18px rgba(0,0,0,.25);
}
body.dp-dashboard-shell .dp-service-card-title,
body:has(.sidebar-wrapper) .dp-service-card-title {
  color: #fff !important;
  text-shadow: 0 2px 10px rgba(0,0,0,.22);
}
body.dp-dashboard-shell .dp-service-card-meta span,
body:has(.sidebar-wrapper) .dp-service-card-meta span {
  color: #cbd9ff !important;
}
body.dp-dashboard-shell .dp-service-card-meta b,
body:has(.sidebar-wrapper) .dp-service-card-meta b {
  color: #ffd52f !important;
}
body.dp-dashboard-shell .dp-service-live,
body:has(.sidebar-wrapper) .dp-service-live {
  color: #092247 !important;
  background: #54e690 !important;
  box-shadow: 0 0 0 3px rgba(84,230,144,.14);
}
body.dp-dashboard-shell .dp-service-card-action,
body:has(.sidebar-wrapper) .dp-service-card-action {
  color: #ffd52f !important;
  background: transparent !important;
  box-shadow: none !important;
  justify-content: flex-start;
  border: 1px solid rgba(255,213,47,.55) !important;
}
body.dp-dashboard-shell .dp-service-card-action:hover,
body:has(.sidebar-wrapper) .dp-service-card-action:hover {
  color: #10194e !important;
  background: #ffd52f !important;
}
body.dp-dashboard-shell .dp-service-card-list,
body:has(.sidebar-wrapper) .dp-service-card-list {
  color: #e5edff !important;
  border-color: rgba(124,166,255,.7) !important;
  background: rgba(255,255,255,.10) !important;
}
body.dp-dashboard-shell .dp-service-card-list:hover,
body:has(.sidebar-wrapper) .dp-service-card-list:hover {
  color: #10194e !important;
  background: #fff !important;
}

/* DP_REFERENCE_MATCH_FINAL_V2
   Digital Punjab reference dashboard presentation layer.
   Backend, service routes, forms and API calls remain unchanged. */
body.dp-dashboard-shell,
body:has(.sidebar-wrapper) {
  background: #f4f8ff !important;
  color: #111827;
}
body.dp-dashboard-shell .page-wrapper,
body:has(.sidebar-wrapper) .page-wrapper {
  margin-left: 170px !important;
  min-height: 100vh;
  padding-top: 38px !important;
  background: #f4f8ff !important;
}
body.dp-dashboard-shell .page-content,
body:has(.sidebar-wrapper) .page-content {
  width: auto !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 28px 28px !important;
  background: transparent !important;
}
body.dp-dashboard-shell .dp-dashboard-hero,
body:has(.sidebar-wrapper) .dp-dashboard-hero {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 210px !important;
  align-items: stretch !important;
  gap: 24px !important;
  min-height: 402px !important;
  margin: 0 !important;
  padding: 34px !important;
  border: 1px solid rgba(226,232,240,.75) !important;
  border-radius: 26px !important;
  background: linear-gradient(135deg,#061b55 0%,#064ee4 55%,#087bff 100%) !important;
  box-shadow: 0 22px 55px rgba(37,99,235,.27) !important;
}
body.dp-dashboard-shell .dp-dashboard-hero-copy,
body:has(.sidebar-wrapper) .dp-dashboard-hero-copy {
  position: relative;
  z-index: 2;
  min-width: 0;
}
body.dp-dashboard-shell .dp-dashboard-premium,
body:has(.sidebar-wrapper) .dp-dashboard-premium {
  padding: 8px 14px !important;
  border: 1px solid rgba(255,255,255,.28) !important;
  border-radius: 999px !important;
  color: #fff !important;
  background: rgba(255,255,255,.16) !important;
  font-size: .68rem !important;
}
body.dp-dashboard-shell .dp-dashboard-hero h1,
body:has(.sidebar-wrapper) .dp-dashboard-hero h1 {
  margin: 12px 0 7px !important;
  color: #fff !important;
  font-size: clamp(1.65rem, 3vw, 2.15rem) !important;
  line-height: 1.12 !important;
}
body.dp-dashboard-shell .dp-dashboard-hero p,
body:has(.sidebar-wrapper) .dp-dashboard-hero p {
  color: #d9e7ff !important;
  font-size: .78rem !important;
}
body.dp-dashboard-shell .dp-dashboard-actions,
body:has(.sidebar-wrapper) .dp-dashboard-actions {
  display: flex !important;
  max-width: 490px;
  flex-wrap: wrap;
  gap: 22px 20px !important;
  margin-top: 22px !important;
}
body.dp-dashboard-shell .dp-dashboard-actions a,
body:has(.sidebar-wrapper) .dp-dashboard-actions a {
  min-height: 46px !important;
  padding: 12px 20px !important;
  border-radius: 14px !important;
  color: #0b3d91 !important;
  background: #fff !important;
  font-size: .7rem !important;
  box-shadow: 0 9px 18px rgba(3,22,72,.15) !important;
}
body.dp-dashboard-shell .dp-dashboard-hero-wallet,
body:has(.sidebar-wrapper) .dp-dashboard-hero-wallet {
  align-self: center;
  min-width: 190px !important;
  padding: 22px 16px !important;
  border: 1px solid rgba(255,255,255,.3) !important;
  border-radius: 24px !important;
  background: rgba(255,255,255,.14) !important;
}
body.dp-dashboard-shell .dp-dashboard-hero-wallet strong,
body:has(.sidebar-wrapper) .dp-dashboard-hero-wallet strong {
  margin: 7px 0 4px !important;
  color: #fff !important;
  font-size: 2.4rem !important;
}
body.dp-dashboard-shell .dp-dashboard-hero-logo,
body:has(.sidebar-wrapper) .dp-dashboard-hero-logo {
  position: absolute !important;
  z-index: 1 !important;
  top: 55% !important;
  left: 67% !important;
  width: 205px !important;
  height: 205px !important;
  opacity: .28 !important;
  pointer-events: none !important;
  transform: translate(-50%,-50%) !important;
  animation: dp-reference-logo-drift 12s ease-in-out infinite !important;
}
body.dp-dashboard-shell .dp-dashboard-hero-logo img,
body:has(.sidebar-wrapper) .dp-dashboard-hero-logo img {
  width: 170px !important;
  height: 170px !important;
  border: 2px solid rgba(248,189,40,.72) !important;
  border-radius: 50% !important;
  background: #061333 !important;
}
@keyframes dp-reference-logo-drift {
  0%,100% { transform: translate(-50%,-50%) translate3d(-95px,20px,0) rotate(-2deg) scale(.96); }
  25% { transform: translate(-50%,-50%) translate3d(-20px,-20px,0) rotate(1deg) scale(1); }
  50% { transform: translate(-50%,-50%) translate3d(95px,14px,0) rotate(3deg) scale(1.05); }
  75% { transform: translate(-50%,-50%) translate3d(18px,37px,0) rotate(-1deg) scale(1); }
}
body.dp-dashboard-shell .dp-dashboard-app-banner,
body:has(.sidebar-wrapper) .dp-dashboard-app-banner {
  display: flex !important;
  align-items: center;
  gap: 15px !important;
  min-height: 102px !important;
  margin: 14px 0 18px !important;
  padding: 17px 18px !important;
  border: 1px solid rgba(255,255,255,.18) !important;
  border-radius: 22px !important;
  color: #fff !important;
  background: radial-gradient(circle at 90% 10%,rgba(255,255,255,.22),transparent 30%), linear-gradient(135deg,#2563eb,#4338ca 58%,#7c3aed) !important;
  box-shadow: 0 13px 28px rgba(58,73,186,.15) !important;
}
body.dp-dashboard-shell .dp-dashboard-app-banner > span,
body:has(.sidebar-wrapper) .dp-dashboard-app-banner > span {
  display: grid;
  width: 54px !important;
  height: 54px !important;
  flex: 0 0 54px;
  place-items: center;
  border: 1px solid rgba(255,255,255,.22);
  border-radius: 15px;
  background: rgba(255,255,255,.16);
  font-size: 1.35rem;
}
body.dp-dashboard-shell .dp-dashboard-app-banner small,
body.dp-dashboard-shell .dp-dashboard-app-banner strong,
body.dp-dashboard-shell .dp-dashboard-app-banner em,
body:has(.sidebar-wrapper) .dp-dashboard-app-banner small,
body:has(.sidebar-wrapper) .dp-dashboard-app-banner strong,
body:has(.sidebar-wrapper) .dp-dashboard-app-banner em { display: block; color: #fff !important; }
body.dp-dashboard-shell .dp-dashboard-app-banner small,
body:has(.sidebar-wrapper) .dp-dashboard-app-banner small { font-size: .53rem; font-weight: 900; letter-spacing: .08em; }
body.dp-dashboard-shell .dp-dashboard-app-banner strong,
body:has(.sidebar-wrapper) .dp-dashboard-app-banner strong { margin-top: 4px; font-size: .9rem; }
body.dp-dashboard-shell .dp-dashboard-app-banner em,
body:has(.sidebar-wrapper) .dp-dashboard-app-banner em { margin-top: 3px; font-size: .64rem; font-style: normal; font-weight: 700; opacity: .92; }
body.dp-dashboard-shell .dp-dashboard-app-banner b,
body:has(.sidebar-wrapper) .dp-dashboard-app-banner b { margin-left: auto; padding: 12px 15px; border-radius: 13px; color: #1d3d84; background: #fff; font-size: .66rem; font-weight: 950; white-space: nowrap; }
.dp-ultra-stats { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 22px; margin: 22px 0 !important; }
.dp-user-status-flow { position: relative; display: flex; min-height: 130px; flex-direction: column; align-items: center; justify-content: center; overflow: hidden; padding: 18px 10px; border-radius: 26px; color: #fff; box-shadow: 0 16px 30px rgba(37,79,135,.14); }
.dp-user-status-flow::before { position: absolute; inset: 0; content: ''; background: linear-gradient(135deg,#7c3aed 0%,#2563eb 56%,#06b6d4 100%); opacity: .98; }
.dp-user-status-flow.ok::before { background: linear-gradient(135deg,#6d28d9,#2563eb 55%,#06b6d4); }
.dp-user-status-flow.warn::before { background: linear-gradient(135deg,#4f46e5,#2563eb 50%,#0ea5e9); }
.dp-user-status-flow.bad::before { background: linear-gradient(135deg,#7c3aed,#9333ea 55%,#2563eb); }
.dp-user-status-flow > * { position: relative; z-index: 1; }
.dp-user-status-flow b { font-size: 3.1rem; line-height: 1; }
.dp-user-status-flow span { margin-top: 14px; font-size: .78rem; font-weight: 900; }
.dp-dashboard-notice-strip { display: flex; align-items: center; justify-content: space-around; gap: 18px; min-height: 49px; margin: 12px 0 18px; padding: 13px; border: 1px solid #dbeafe; border-radius: 18px; color: #15336f; background: linear-gradient(135deg,#fff,#eef6ff); font-size: .72rem; font-weight: 900; }
.dp-dashboard-notice-strip span { white-space: nowrap; }
.dp-dashboard-legacy-tools { margin: 0 0 12px; color: #25549c; font-size: .75rem; }
.dp-dashboard-legacy-tools summary { width: max-content; cursor: pointer; font-weight: 800; }
.dp-dashboard-legacy-tools[open] { padding: 12px; border: 1px solid #dce8f7; border-radius: 14px; background: #fff; }
body.dp-dashboard-shell .dp-service-catalog-intro h2,
body:has(.sidebar-wrapper) .dp-service-catalog-intro h2 { color: #14223e !important; text-shadow: none !important; }
body.dp-dashboard-shell .dp-service-catalog-intro p,
body:has(.sidebar-wrapper) .dp-service-catalog-intro p { color: #64748b !important; }
body.dp-dashboard-shell .dp-service-catalog-kicker,
body:has(.sidebar-wrapper) .dp-service-catalog-kicker { color: #1e64d8 !important; }
body.dp-dashboard-shell .dp-service-catalog-note,
body:has(.sidebar-wrapper) .dp-service-catalog-note { color: #2757a7 !important; border-color: #cfe0fb !important; background: #edf5ff !important; }
body.dp-dashboard-shell .dp-service-category-grid,
body:has(.sidebar-wrapper) .dp-service-category-grid { display: grid !important; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 16px; margin: 0 !important; }
body.dp-dashboard-shell .dp-service-card-col,
body:has(.sidebar-wrapper) .dp-service-card-col { width: auto !important; max-width: none !important; padding: 0 !important; margin: 0 !important; }
@media (max-width: 991px) {
  body.dp-dashboard-shell .page-wrapper,
  body:has(.sidebar-wrapper) .page-wrapper { margin-left: 0 !important; padding-top: 38px !important; }
  body.dp-dashboard-shell .page-content,
  body:has(.sidebar-wrapper) .page-content { padding: 14px !important; }
  body.dp-dashboard-shell .dp-dashboard-hero,
  body:has(.sidebar-wrapper) .dp-dashboard-hero { display: block !important; min-height: 0 !important; padding: 23px 19px !important; }
  body.dp-dashboard-shell .dp-dashboard-hero-wallet,
  body:has(.sidebar-wrapper) .dp-dashboard-hero-wallet { max-width: 190px; margin: 22px 0 0; }
  body.dp-dashboard-shell .dp-dashboard-hero-logo,
  body:has(.sidebar-wrapper) .dp-dashboard-hero-logo { top: 62% !important; left: 70% !important; width: 160px !important; height: 160px !important; opacity: .19 !important; }
  body.dp-dashboard-shell .dp-dashboard-hero-logo img,
  body:has(.sidebar-wrapper) .dp-dashboard-hero-logo img { width: 132px !important; height: 132px !important; }
  .dp-ultra-stats { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
  .dp-user-status-flow { min-height: 105px; border-radius: 19px; }
  .dp-user-status-flow b { font-size: 2.25rem; }
  .dp-user-status-flow span { margin-top: 8px; font-size: .68rem; }
  .dp-dashboard-notice-strip { justify-content: flex-start; overflow-x: auto; }
  .dp-service-category-grid { grid-template-columns: repeat(2,minmax(0,1fr)) !important; gap: 10px !important; }
}
@media (max-width: 520px) {
  body.dp-dashboard-shell .dp-dashboard-app-banner,
  body:has(.sidebar-wrapper) .dp-dashboard-app-banner { align-items: flex-start; flex-wrap: wrap; }
  body.dp-dashboard-shell .dp-dashboard-app-banner b,
  body:has(.sidebar-wrapper) .dp-dashboard-app-banner b { margin-left: 69px; margin-top: -4px; }
  .dp-service-category-grid { grid-template-columns: repeat(2,minmax(0,1fr)) !important; }
  body.dp-dashboard-shell .dp-service-card,
  body:has(.sidebar-wrapper) .dp-service-card { min-height: 190px; padding: 12px !important; }
  body.dp-dashboard-shell .dp-service-card-icon,
  body:has(.sidebar-wrapper) .dp-service-card-icon { width: 58px; height: 58px; }
  body.dp-dashboard-shell .dp-service-card-icon img,
  body:has(.sidebar-wrapper) .dp-service-card-icon img { width: 48px; height: 48px; }
}
/* DP_REFERENCE_MATCH_FINAL_V3: precedence and exact fold alignment */
body.dp-dashboard-shell:not(:has(.login-container)):not(:has(.register-container)),
body:has(.sidebar-wrapper):not(:has(.login-container)):not(:has(.register-container)) { background: #f4f8ff !important; }
body.dp-dashboard-shell:not(:has(.login-container)):not(:has(.register-container)) .page-wrapper,
body:has(.sidebar-wrapper):not(:has(.login-container)):not(:has(.register-container)) .page-wrapper { padding-top: 0 !important; background: #f4f8ff !important; }
body.dp-dashboard-shell .sidebar-wrapper,
body:has(.sidebar-wrapper) .sidebar-wrapper { top: 0 !important; }
body.dp-dashboard-shell .dp-dashboard-actions,
body:has(.sidebar-wrapper) .dp-dashboard-actions { display: grid !important; grid-template-columns: max-content max-content; width: max-content; max-width: none; }
@media (max-width: 991px) {
  body.dp-dashboard-shell .page-wrapper,
  body:has(.sidebar-wrapper) .page-wrapper { padding-top: 38px !important; }
  body.dp-dashboard-shell .sidebar-wrapper,
  body:has(.sidebar-wrapper) .sidebar-wrapper { top: 38px !important; }
}
/* DP_REFERENCE_MATCH_FINAL_V4: keep catalog content clear of the fixed sidebar */
body.dp-dashboard-shell .dp-service-catalog-intro,
body:has(.sidebar-wrapper) .dp-service-catalog-intro { margin: 28px 0 16px !important; padding: 0 34px !important; }
body.dp-dashboard-shell .dp-service-category,
body:has(.sidebar-wrapper) .dp-service-category { padding: 20px 34px 18px !important; }
/* DP_REFERENCE_MATCH_FINAL_V5: reference ticker rhythm and center-left watermark placement. */
body.dp-dashboard-shell .dp-dashboard-ticker,
body:has(.sidebar-wrapper) .dp-dashboard-ticker {
  height: 38px !important;
  justify-content: flex-start !important;
  font-size: .78rem !important;
  letter-spacing: .01em;
}
body.dp-dashboard-shell .dp-dashboard-ticker span,
body:has(.sidebar-wrapper) .dp-dashboard-ticker span {
  animation-duration: 22s !important;
}
body.dp-dashboard-shell .dp-dashboard-hero-logo,
body:has(.sidebar-wrapper) .dp-dashboard-hero-logo {
  left: 35% !important;
  top: 54% !important;
  opacity: .27 !important;
  animation-name: dp-reference-logo-drift !important;
}
@media (max-width: 991px) {
  body.dp-dashboard-shell .dp-dashboard-ticker,
  body:has(.sidebar-wrapper) .dp-dashboard-ticker { font-size: .68rem !important; }
  body.dp-dashboard-shell .dp-dashboard-hero-logo,
  body:has(.sidebar-wrapper) .dp-dashboard-hero-logo {
    left: 38% !important;
    top: 52% !important;
    opacity: .18 !important;
  }
}
/* DP_REFERENCE_MATCH_FINAL_V6: Digital Punjab announcement container. */
body.dp-dashboard-shell .dp-dashboard-ticker,
body:has(.sidebar-wrapper) .dp-dashboard-ticker {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  z-index: 1200 !important;
  height: 42px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  overflow: hidden !important;
  padding: 0 18px !important;
  border: 1px solid rgba(244, 193, 40, .9) !important;
  border-top: 0 !important;
  border-radius: 0 0 16px 16px !important;
  color: #fff !important;
  background: linear-gradient(105deg, #061735 0%, #08265a 48%, #0b5bdd 100%) !important;
  box-shadow: 0 5px 18px rgba(1, 16, 48, .3), inset 0 -1px 0 rgba(255,255,255,.08) !important;
  font-size: .78rem !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}
body.dp-dashboard-shell .dp-dashboard-ticker::before,
body:has(.sidebar-wrapper) .dp-dashboard-ticker::before {
  position: absolute;
  inset: 0;
  pointer-events: none;
  content: '';
  background: linear-gradient(90deg, rgba(255,255,255,.08), transparent 28%, transparent 72%, rgba(255,255,255,.08));
}
body.dp-dashboard-shell .dp-dashboard-ticker span,
body:has(.sidebar-wrapper) .dp-dashboard-ticker span {
  position: relative;
  z-index: 1;
  display: block;
  min-width: max-content;
  color: #fff !important;
  text-shadow: 0 1px 2px rgba(0,0,0,.25);
  animation: dp-dashboard-ticker 24s linear infinite !important;
}
@media (max-width: 600px) {
  body.dp-dashboard-shell .dp-dashboard-ticker,
  body:has(.sidebar-wrapper) .dp-dashboard-ticker {
    height: 38px !important;
    padding: 0 12px !important;
    border-radius: 0 0 12px 12px !important;
    font-size: .66rem !important;
  }
}
/* DP_REFERENCE_MATCH_FINAL_V7: keep the sidebar logo below the announcement bar. */
@media (min-width: 992px) {
  body.dp-dashboard-shell .sidebar-header,
  body:has(.sidebar-wrapper) .sidebar-header {
    height: 220px !important;
    flex-basis: 220px !important;
    padding: 48px 10px 14px !important;
    gap: 8px !important;
  }
  body.dp-dashboard-shell .sidebar-header > div:first-child,
  body:has(.sidebar-wrapper) .sidebar-header > div:first-child {
    width: 138px !important;
    height: 138px !important;
    flex-basis: 138px !important;
  }
  body.dp-dashboard-shell .sidebar-header .logo-icon,
  body:has(.sidebar-wrapper) .sidebar-header .logo-icon {
    width: 138px !important;
    height: 138px !important;
    border: 3px solid #f8bd28 !important;
    background: #061333 !important;
    box-shadow: 0 0 0 5px rgba(248,189,40,.08), 0 14px 30px rgba(0,0,0,.28) !important;
    object-fit: contain !important;
  }
}
@media (max-width: 991px) {
  body.dp-dashboard-shell .sidebar-header,
  body:has(.sidebar-wrapper) .sidebar-header {
    height: 190px !important;
    flex-basis: 190px !important;
    padding: 12px 10px 12px !important;
  }
  body.dp-dashboard-shell .sidebar-header > div:first-child,
  body:has(.sidebar-wrapper) .sidebar-header > div:first-child {
    width: 116px !important;
    height: 116px !important;
    flex-basis: 116px !important;
  }
  body.dp-dashboard-shell .sidebar-header .logo-icon,
  body:has(.sidebar-wrapper) .sidebar-header .logo-icon {
    width: 116px !important;
    height: 116px !important;
  }
}
/* DP_REFERENCE_MATCH_FINAL_V8: centered brand and original user name. */
body.dp-dashboard-shell .sidebar-header > div:nth-child(2),
body:has(.sidebar-wrapper) .sidebar-header > div:nth-child(2) {
  width: 100% !important;
  text-align: center !important;
}
body.dp-dashboard-shell .sidebar-header .logo-text,
body:has(.sidebar-wrapper) .sidebar-header .logo-text {
  display: block !important;
  width: 100% !important;
  margin: 0 !important;
  text-align: center !important;
}
body.dp-dashboard-shell .sidebar-header .logo-user-name,
body:has(.sidebar-wrapper) .sidebar-header .logo-user-name {
  display: block !important;
  width: 100% !important;
  margin-top: 5px !important;
  overflow: hidden;
  color: #fff !important;
  font-size: .72rem !important;
  font-weight: 950 !important;
  line-height: 1.15 !important;
  text-align: center !important;
  text-overflow: ellipsis;
  text-transform: uppercase;
  white-space: nowrap;
}
/* DP_REFERENCE_MATCH_FINAL_V9: full viewport X/Y logo journey. */
@keyframes dp-dashboard-logo-viewport-drift {
  0%, 100% { translate: 0 5vh; rotate: -6deg; scale: .92; }
  14% { translate: 27vw 0; rotate: 2deg; scale: 1; }
  28% { translate: 60vw 12vh; rotate: 7deg; scale: 1.04; }
  42% { translate: 35vw 43vh; rotate: -2deg; scale: .98; }
  56% { translate: -5vw 27vh; rotate: -8deg; scale: .9; }
  70% { translate: 70vw 58vh; rotate: 4deg; scale: 1.06; }
  84% { translate: 86vw 10vh; rotate: -3deg; scale: .96; }
}
@media (min-width: 992px) {
  body.dp-dashboard-shell .dp-dashboard-hero-logo,
  body:has(.sidebar-wrapper) .dp-dashboard-hero-logo {
    position: fixed !important;
    top: 64px !important;
    left: 96px !important;
    z-index: 1 !important;
    width: 190px !important;
    height: 190px !important;
    opacity: .13 !important;
    pointer-events: none !important;
    translate: 0 0;
    rotate: 0deg;
    scale: 1;
    animation: dp-dashboard-logo-viewport-drift 24s ease-in-out infinite !important;
    will-change: translate, rotate, scale;
  }
  body.dp-dashboard-shell .dp-dashboard-hero-logo img,
  body:has(.sidebar-wrapper) .dp-dashboard-hero-logo img {
    width: 156px !important;
    height: 156px !important;
  }
}
@media (max-width: 991px) {
  body.dp-dashboard-shell .dp-dashboard-hero-logo,
  body:has(.sidebar-wrapper) .dp-dashboard-hero-logo {
    position: fixed !important;
    top: 58px !important;
    left: 54px !important;
    z-index: 1 !important;
    width: 140px !important;
    height: 140px !important;
    opacity: .10 !important;
    translate: 0 0;
    rotate: 0deg;
    scale: 1;
    animation: dp-dashboard-logo-viewport-drift 18s ease-in-out infinite !important;
    will-change: translate, rotate, scale;
  }
  body.dp-dashboard-shell .dp-dashboard-hero-logo img,
  body:has(.sidebar-wrapper) .dp-dashboard-hero-logo img {
    width: 116px !important;
    height: 116px !important;
  }
}
/* DP_REFERENCE_MATCH_FINAL_V10: fixed WhatsApp chat shortcut. */
body.dp-dashboard-shell .support-widget,
body:has(.sidebar-wrapper) .support-widget {
  right: 18px !important;
  bottom: 18px !important;
  z-index: 1250 !important;
  gap: 9px !important;
}
body.dp-dashboard-shell .support-link.dp-whatsapp-chat,
body:has(.sidebar-wrapper) .support-link.dp-whatsapp-chat {
  min-height: 52px !important;
  padding: 7px 16px 7px 8px !important;
  border: 1px solid rgba(255,255,255,.62) !important;
  border-radius: 999px !important;
  color: #fff !important;
  background: linear-gradient(135deg, #16a34a, #25d366 58%, #43e37a) !important;
  box-shadow: 0 13px 28px rgba(13, 119, 56, .34), 0 0 0 4px rgba(37,211,102,.12) !important;
  font-size: .74rem !important;
  font-weight: 950 !important;
}
body.dp-dashboard-shell .support-link.dp-whatsapp-chat i,
body:has(.sidebar-wrapper) .support-link.dp-whatsapp-chat i {
  width: 37px !important;
  height: 37px !important;
  display: grid !important;
  margin-right: 4px;
  place-items: center;
  padding: 0 !important;
  border: 1px solid rgba(255,255,255,.45);
  border-radius: 50%;
  color: #fff !important;
  background: rgba(0, 98, 42, .28) !important;
  font-size: 1.18rem !important;
}
body.dp-dashboard-shell .support-link.dp-whatsapp-chat:hover,
body:has(.sidebar-wrapper) .support-link.dp-whatsapp-chat:hover {
  transform: translateY(-4px) scale(1.02);
  background: linear-gradient(135deg, #12863e, #20c861 58%, #3cde73) !important;
}
@media (max-width: 600px) {
  body.dp-dashboard-shell .support-widget,
  body:has(.sidebar-wrapper) .support-widget {
    right: 10px !important;
    bottom: 12px !important;
  }
  body.dp-dashboard-shell .support-link.dp-whatsapp-chat,
  body:has(.sidebar-wrapper) .support-link.dp-whatsapp-chat {
    min-height: 46px !important;
    padding-right: 12px !important;
    font-size: .66rem !important;
  }
  body.dp-dashboard-shell .support-link.dp-whatsapp-chat i,
  body:has(.sidebar-wrapper) .support-link.dp-whatsapp-chat i {
    width: 33px !important;
    height: 33px !important;
    font-size: 1rem !important;
  }
}

/* DP_STANDALONE_SERVICE_PAGE_V1
   Service forms open directly without the dashboard/sidebar shell.
   This is layout-only; existing form actions, fees, status and API calls remain untouched. */
body.dp-service-page { min-height:100vh !important; background:linear-gradient(145deg,#edf4ff 0%,#f7fbff 52%,#e7efff 100%) !important; overflow-x:hidden; }
body.dp-service-page .dp-dashboard-ticker, body.dp-service-page .sidebar-wrapper, body.dp-service-page > .wrapper > header, body.dp-service-page .topbar, body.dp-service-page .support-widget, body.dp-service-page .dp-mobile-menu-toggle { display:none !important; }
body.dp-service-page > .wrapper, body.dp-service-page .content-wrap, body.dp-service-page .main, body.dp-service-page .page-wrapper { width:100% !important; max-width:none !important; min-height:100vh !important; margin:0 !important; padding:0 !important; background:transparent !important; }
body.dp-service-page .page-content { display:block !important; width:min(100%,980px) !important; max-width:980px !important; min-height:100vh !important; margin:0 auto !important; padding:82px 24px 70px !important; }
body.dp-service-page .container-center { display:block !important; min-height:100vh !important; padding:0 !important; }
body.dp-service-page .container-center > .page-content { display:block !important; width:min(100%,980px) !important; max-width:980px !important; margin:0 auto !important; }
body.dp-service-page .container-center .col-lg-4, body.dp-service-page .container-center .col-md-6, body.dp-service-page .container-center .col-sm-10 { width:100% !important; max-width:860px !important; flex:0 0 100% !important; margin:0 auto !important; padding-left:0 !important; padding-right:0 !important; }
body.dp-service-page .container-center .card-shine, body.dp-service-page .container-center .card, body.dp-service-page .container-center .luxury-card { width:100% !important; min-height:0 !important; border:1px solid #dbe8f8 !important; border-radius:26px !important; background:rgba(255,255,255,.96) !important; box-shadow:0 22px 55px rgba(26,75,145,.14) !important; overflow:hidden; }
body.dp-service-page .container-center .card-body { padding:32px !important; }
body.dp-service-page .container-center h1, body.dp-service-page .container-center h2, body.dp-service-page .container-center h3, body.dp-service-page .container-center h4, body.dp-service-page .container-center h5 { color:#0b2d68 !important; }
body.dp-service-page .container-center .form-control, body.dp-service-page .container-center .form-select, body.dp-service-page .container-center textarea { width:100% !important; min-height:48px !important; border:1px solid #cfe0f5 !important; border-radius:13px !important; background:#fff !important; color:#142b50 !important; box-shadow:none !important; }
body.dp-service-page .container-center .form-control:focus, body.dp-service-page .container-center .form-select:focus, body.dp-service-page .container-center textarea:focus { border-color:#2d78e8 !important; box-shadow:0 0 0 4px rgba(45,120,232,.12) !important; }
body.dp-service-page .dp-back-home { top:18px !important; right:22px !important; color:#145ac7 !important; border-color:#cfe0fb !important; background:rgba(255,255,255,.96) !important; }
@media(max-width:640px) { body.dp-service-page .page-content, body.dp-service-page .container-center > .page-content { padding:70px 13px 38px !important; } body.dp-service-page .container-center .card-body { padding:21px 16px !important; } body.dp-service-page .dp-back-home { top:14px !important; right:13px !important; } }


/* DP_FINAL_POLISH_V1
   Final visual consistency layer. Business logic and existing API routes remain unchanged. */
/* Keep every catalog card on the same visual baseline. */
body.dp-dashboard-shell .dp-service-category-grid,
body:has(.sidebar-wrapper) .dp-service-category-grid { align-items:stretch !important; }
body.dp-dashboard-shell .dp-service-card-col,
body:has(.sidebar-wrapper) .dp-service-card-col { display:flex !important; height:auto !important; align-self:stretch !important; }
body.dp-dashboard-shell .dp-service-card,
body:has(.sidebar-wrapper) .dp-service-card { width:100% !important; height:100% !important; min-height:252px !important; display:flex !important; flex-direction:column !important; }
body.dp-dashboard-shell .dp-service-card-actions,
body:has(.sidebar-wrapper) .dp-service-card-actions { margin-top:auto !important; }
/* Make modal and standalone service windows use the dashboard palette, not plain white. */
body.dp-service-page { background:linear-gradient(135deg,#06163e 0%,#102b78 50%,#3a1b78 100%) !important; }
body.dp-service-page .container-center .card-shine,
body.dp-service-page .container-center .card,
body.dp-service-page .container-center .luxury-card { border-color:rgba(91,164,255,.55) !important; background:linear-gradient(145deg,rgba(8,31,91,.98),rgba(20,55,142,.98) 58%,rgba(61,33,137,.97)) !important; color:#fff !important; box-shadow:0 24px 70px rgba(2,11,43,.38),inset 0 1px 0 rgba(255,255,255,.16) !important; }
body.dp-service-page .container-center h1,
body.dp-service-page .container-center h2,
body.dp-service-page .container-center h3,
body.dp-service-page .container-center h4,
body.dp-service-page .container-center h5,
body.dp-service-page .container-center p,
body.dp-service-page .container-center label,
body.dp-service-page .container-center span { color:#f5f8ff !important; }
body.dp-service-page .container-center .text-muted { color:#c7d8f8 !important; }
body.dp-service-page .container-center .form-control,
body.dp-service-page .container-center .form-select,
body.dp-service-page .container-center textarea { border-color:rgba(151,194,255,.52) !important; color:#fff !important; background:rgba(255,255,255,.10) !important; }
body.dp-service-page .container-center .form-control::placeholder,
body.dp-service-page .container-center textarea::placeholder { color:rgba(232,241,255,.7) !important; }
body.dp-service-page .container-center .single-line { background:linear-gradient(90deg,transparent,rgba(128,190,255,.56),transparent) !important; }
body.dp-service-page .dp-back-home { color:#123d96 !important; background:#fff !important; }
.dp-service-modal-dialog { background:linear-gradient(135deg,#06163e 0%,#102b78 50%,#3a1b78 100%) !important; }
.dp-service-modal-frame { background:transparent !important; }
/* Loader always uses the same branded image and never shows a broken/blank logo. */
#dpPremiumLoader .dp-loader-logo { display:block !important; object-fit:contain !important; background:#061333 !important; }
/* Sidebar must be scrollable and genuinely closed on mobile until Menu is tapped. */
@media (max-width:991px) {
  body.dp-dashboard-shell .sidebar-wrapper,
  body:has(.sidebar-wrapper) .sidebar-wrapper { left:-260px !important; width:260px !important; top:38px !important; bottom:0 !important; height:calc(100vh - 38px) !important; overflow-y:auto !important; overflow-x:hidden !important; transition:left .24s ease !important; z-index:1600 !important; }
  body.dp-mobile-menu-open .sidebar-wrapper { left:0 !important; }
  body.dp-dashboard-shell .sidebar-wrapper .simplebar-wrapper,
  body:has(.sidebar-wrapper) .sidebar-wrapper .simplebar-wrapper,
  body.dp-dashboard-shell .sidebar-wrapper .simplebar-mask,
  body:has(.sidebar-wrapper) .sidebar-wrapper .simplebar-mask,
  body.dp-dashboard-shell .sidebar-wrapper .simplebar-offset,
  body:has(.sidebar-wrapper) .sidebar-wrapper .simplebar-offset { height:100% !important; }
  body.dp-dashboard-shell .sidebar-wrapper .simplebar-content-wrapper,
  body:has(.sidebar-wrapper) .sidebar-wrapper .simplebar-content-wrapper { overflow-y:auto !important; }
  body.dp-mobile-menu-open::after { position:fixed; inset:38px 0 0; z-index:1500; content:""; background:rgba(3,14,42,.56); }
  body.dp-mobile-menu-open .dp-mobile-menu-toggle { z-index:1700 !important; }
  body.dp-dashboard-shell .dp-service-card,
  body:has(.sidebar-wrapper) .dp-service-card { min-height:222px !important; }
}
@media (max-width:520px) {
  body.dp-dashboard-shell .dp-service-card,
  body:has(.sidebar-wrapper) .dp-service-card { min-height:210px !important; }
}


/* DP_CATEGORY_ICON_OVERLAP_FIX_V1: fixed icon geometry and sidebar-safe catalog flow. */
body.dp-dashboard-shell .page-content,
body:has(.sidebar-wrapper) .page-content { overflow-x:hidden !important; }
body.dp-dashboard-shell .dp-service-category,
body:has(.sidebar-wrapper) .dp-service-category { clear:both !important; position:relative !important; isolation:isolate; }
body.dp-dashboard-shell .dp-service-category-head,
body:has(.sidebar-wrapper) .dp-service-category-head { min-width:0 !important; overflow:visible !important; }
body.dp-dashboard-shell .dp-service-category-title-wrap,
body:has(.sidebar-wrapper) .dp-service-category-title-wrap { flex:1 1 auto !important; min-width:0 !important; gap:14px !important; }
body.dp-dashboard-shell .dp-service-category-icon,
body:has(.sidebar-wrapper) .dp-service-category-icon { flex:0 0 52px !important; width:52px !important; height:52px !important; min-width:52px !important; display:grid !important; place-items:center !important; overflow:hidden !important; line-height:1 !important; font-size:24px !important; }
body.dp-dashboard-shell .dp-service-category-icon i,
body:has(.sidebar-wrapper) .dp-service-category-icon i { display:block !important; width:auto !important; height:auto !important; margin:0 !important; color:#1764d4 !important; font-size:25px !important; line-height:1 !important; }
body.dp-dashboard-shell .dp-service-category-title-wrap > div,
body:has(.sidebar-wrapper) .dp-service-category-title-wrap > div { min-width:0 !important; overflow:hidden !important; }
body.dp-dashboard-shell .dp-service-category-kicker,
body:has(.sidebar-wrapper) .dp-service-category-kicker { white-space:nowrap !important; overflow:hidden !important; text-overflow:ellipsis !important; }
@media(max-width:640px) {
  body.dp-dashboard-shell .dp-service-category-icon,
  body:has(.sidebar-wrapper) .dp-service-category-icon { flex-basis:46px !important; width:46px !important; height:46px !important; min-width:46px !important; }
  body.dp-dashboard-shell .dp-service-category-icon i,
  body:has(.sidebar-wrapper) .dp-service-category-icon i { font-size:22px !important; }
}


/* DP_SIDEBAR_BOUNDARY_FIX_V2: dashboard content begins after the 220px sidebar. */
@media (min-width:992px) {
  body.dp-dashboard-shell:not(.dp-service-page) .page-wrapper,
  body:has(.sidebar-wrapper):not(.dp-service-page) .page-wrapper {
    margin-left:220px !important;
    width:calc(100% - 220px) !important;
    max-width:none !important;
    overflow-x:hidden !important;
  }
  body.dp-dashboard-shell:not(.dp-service-page) .page-content,
  body:has(.sidebar-wrapper):not(.dp-service-page) .page-content {
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    padding-left:18px !important;
    padding-right:18px !important;
    overflow-x:hidden !important;
  }
}


/* DP_HERO_TOP_GAP_AND_SERVICE_FORCE_V1: keep the hero below the fixed ticker. */
@media (min-width:992px) { body.dp-dashboard-shell:not(.dp-service-page) .dp-dashboard-hero { margin-top:20px !important; } }
@media (max-width:991px) { body.dp-dashboard-shell:not(.dp-service-page) .dp-dashboard-hero { margin-top:12px !important; } }


/* DP_HERO_TOP_GAP_V2: explicit padding prevents the first hero row collapsing under the ticker. */
@media (min-width:992px) {
  body.dp-dashboard-shell:not(.dp-service-page) .page-content,
  body:has(.sidebar-wrapper):not(.dp-service-page) .page-content { padding-top:20px !important; }
  body.dp-dashboard-shell:not(.dp-service-page) .dp-dashboard-hero { margin-top:0 !important; }
}


/* DP_STANDALONE_SECTION_THEME_LIVE_V1: sidebar destinations use the same full-page Digital Punjab theme. */
body.dp-standalone-section { min-height:100vh !important; color:#eef6ff !important; background:radial-gradient(circle at 84% 8%,rgba(24,126,255,.35),transparent 32%),linear-gradient(135deg,#041439 0%,#082d82 52%,#063a9d 100%) !important; }
body.dp-standalone-section .sidebar-wrapper,
body.dp-standalone-section > .wrapper > header,
body.dp-standalone-section .topbar,
body.dp-standalone-section .dp-mobile-menu-toggle { display:none !important; }
body.dp-standalone-section .page-wrapper { width:100% !important; min-height:100vh !important; margin:0 !important; padding:56px 0 0 !important; background:transparent !important; }
body.dp-standalone-section .page-content { width:min(1240px,100%) !important; margin:0 auto !important; padding:34px 28px 64px !important; background:transparent !important; }
body.dp-standalone-section .page-content .card,
body.dp-standalone-section .page-content .banner-container,
body.dp-standalone-section .page-content .luxury-card,
body.dp-standalone-section .page-content .service-box { border:1px solid rgba(111,188,255,.4) !important; border-top:3px solid #f8bd28 !important; border-radius:24px !important; color:#eef6ff !important; background:linear-gradient(145deg,rgba(8,40,112,.94),rgba(12,82,187,.82)) !important; box-shadow:0 22px 48px rgba(0,8,35,.28) !important; }
body.dp-standalone-section .page-content .card-body,
body.dp-standalone-section .page-content .card-header,
body.dp-standalone-section .page-content .card-footer { color:#eef6ff !important; background:transparent !important; border-color:rgba(255,255,255,.14) !important; }
body.dp-standalone-section .page-content h1,
body.dp-standalone-section .page-content h2,
body.dp-standalone-section .page-content h3,
body.dp-standalone-section .page-content h4,
body.dp-standalone-section .page-content h5,
body.dp-standalone-section .page-content h6,
body.dp-standalone-section .page-content label,
body.dp-standalone-section .page-content b,
body.dp-standalone-section .page-content strong { color:#fff !important; }
body.dp-standalone-section .page-content .text-muted,
body.dp-standalone-section .page-content small,
body.dp-standalone-section .page-content p,
body.dp-standalone-section .page-content .form-text { color:#c8dcfa !important; }
body.dp-standalone-section .page-content .list-group-item,
body.dp-standalone-section .page-content .table,
body.dp-standalone-section .page-content .table td,
body.dp-standalone-section .page-content .table th { color:#eef6ff !important; border-color:rgba(255,255,255,.15) !important; background:rgba(3,24,73,.36) !important; }
body.dp-standalone-section .page-content .form-control,
body.dp-standalone-section .page-content .form-select,
body.dp-standalone-section .page-content textarea { border:1px solid rgba(166,211,255,.42) !important; color:#fff !important; background:rgba(2,25,75,.48) !important; }
body.dp-standalone-section .page-content .form-control::placeholder,
body.dp-standalone-section .page-content textarea::placeholder { color:#b8d0f2 !important; }
body.dp-standalone-section .dp-back-home { display:inline-flex !important; top:48px !important; right:20px !important; }
@media(max-width:991px){ body.dp-standalone-section .page-wrapper{padding-top:52px !important;} body.dp-standalone-section .page-content{padding:28px 14px 48px !important;} body.dp-standalone-section .dp-back-home{top:50px !important;right:12px !important;} }
/* Stable category glyph geometry for the live catalog. */
.dp-service-category-icon i { display:block !important; line-height:1 !important; }


/* DP_UNIFORM_SERVICE_PAGE_LIVE_V2 */
/* One predictable shell for every existing service form; PHP/API markup remains unchanged. */
body.dp-service-page {
  min-width: 0 !important;
  min-height: 100vh !important;
  overflow-x: hidden !important;
  background: radial-gradient(circle at 86% 8%, rgba(42,128,255,.28), transparent 34%), linear-gradient(135deg, #06163e 0%, #0d2f82 52%, #3a1d7e 100%) !important;
}
body.dp-service-page .dp-back-home { display: none !important; }
body.dp-service-page > .wrapper,
body.dp-service-page .content-wrap,
body.dp-service-page .main,
body.dp-service-page .page-wrapper {
  width: 100% !important;
  max-width: none !important;
  min-height: 100vh !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
}
body.dp-service-page .page-content {
  display: block !important;
  width: min(100%, 1160px) !important;
  max-width: 1160px !important;
  min-height: 100vh !important;
  margin: 0 auto !important;
  padding: 42px 28px 68px !important;
  background: transparent !important;
}
body.dp-service-page .page-content > .container,
body.dp-service-page .page-content > .container-fluid,
body.dp-service-page .page-content .container.d-flex,
body.dp-service-page .page-content .container-fluid {
  width: 100% !important;
  max-width: 100% !important;
  margin-right: auto !important;
  margin-left: auto !important;
  padding-right: 0 !important;
  padding-left: 0 !important;
}
body.dp-service-page .page-content > .container > .row,
body.dp-service-page .page-content > .container-fluid > .row,
body.dp-service-page .page-content .container.d-flex > .row {
  width: 100% !important;
  margin-right: 0 !important;
  margin-left: 0 !important;
  justify-content: center !important;
}
body.dp-service-page .page-content .row > [class*="col-"] {
  width: 100% !important;
  max-width: 920px !important;
  flex: 0 0 100% !important;
  margin-right: auto !important;
  margin-left: auto !important;
  padding-right: 10px !important;
  padding-left: 10px !important;
}
body.dp-service-page .page-content .container > .card,
body.dp-service-page .page-content .container > .luxury-card,
body.dp-service-page .page-content .container > .card-shine,
body.dp-service-page .page-content .container-fluid > .card,
body.dp-service-page .page-content .container-fluid > .luxury-card,
body.dp-service-page .page-content .container-fluid > .card-shine,
body.dp-service-page .page-content .row > [class*="col-"] > .card,
body.dp-service-page .page-content .row > [class*="col-"] > .luxury-card,
body.dp-service-page .page-content .row > [class*="col-"] > .card-shine,
body.dp-service-page .page-content .service-box {
  display: flex !important;
  width: 100% !important;
  max-width: 920px !important;
  min-height: 420px !important;
  flex-direction: column !important;
  margin: 0 auto 22px !important;
  padding: clamp(22px, 4vw, 36px) !important;
  border: 1px solid rgba(105,174,255,.55) !important;
  border-radius: 26px !important;
  background: linear-gradient(145deg, rgba(7,31,91,.98), rgba(15,64,157,.98) 58%, rgba(61,31,136,.97)) !important;
  color: #f5f8ff !important;
  box-shadow: 0 26px 72px rgba(0,8,38,.4), inset 0 1px 0 rgba(255,255,255,.16) !important;
  overflow: hidden !important;
}
body.dp-service-page .page-content .card-body {
  width: 100% !important;
  padding: 0 !important;
  background: transparent !important;
}
body.dp-service-page .page-content h1,
body.dp-service-page .page-content h2,
body.dp-service-page .page-content h3,
body.dp-service-page .page-content h4,
body.dp-service-page .page-content h5,
body.dp-service-page .page-content label,
body.dp-service-page .page-content p,
body.dp-service-page .page-content span,
body.dp-service-page .page-content strong,
body.dp-service-page .page-content b { color: #f5f8ff !important; }
body.dp-service-page .page-content h1,
body.dp-service-page .page-content h2,
body.dp-service-page .page-content h3,
body.dp-service-page .page-content h4 { line-height: 1.2 !important; }
body.dp-service-page .page-content form { width: 100% !important; margin: 0 !important; }
body.dp-service-page .page-content .form-control,
body.dp-service-page .page-content .form-select,
body.dp-service-page .page-content textarea {
  width: 100% !important;
  min-height: 48px !important;
  border: 1px solid rgba(168,211,255,.5) !important;
  border-radius: 13px !important;
  color: #fff !important;
  background: rgba(255,255,255,.1) !important;
  box-shadow: none !important;
}
body.dp-service-page .page-content .form-control::placeholder,
body.dp-service-page .page-content textarea::placeholder { color: rgba(232,241,255,.72) !important; }
body.dp-service-page .page-content .btn,
body.dp-service-page .page-content button,
body.dp-service-page .page-content input[type="submit"] {
  min-height: 44px !important;
  border-radius: 12px !important;
  font-weight: 900 !important;
}
body.dp-service-page .page-content .table,
body.dp-service-page .page-content .table-responsive { width: 100% !important; }
body.dp-service-page .page-content img { max-width: 100%; height: auto; object-fit: contain; }
@media (max-width: 700px) {
  body.dp-service-page .page-content { padding: 24px 12px 46px !important; }
  body.dp-service-page .page-content .row > [class*="col-"] { padding-right: 0 !important; padding-left: 0 !important; }
  body.dp-service-page .page-content .container > .card,
  body.dp-service-page .page-content .container > .luxury-card,
  body.dp-service-page .page-content .container > .card-shine,
  body.dp-service-page .page-content .container-fluid > .card,
  body.dp-service-page .page-content .container-fluid > .luxury-card,
  body.dp-service-page .page-content .container-fluid > .card-shine,
  body.dp-service-page .page-content .row > [class*="col-"] > .card,
  body.dp-service-page .page-content .row > [class*="col-"] > .luxury-card,
  body.dp-service-page .page-content .row > [class*="col-"] > .card-shine,
  body.dp-service-page .page-content .service-box {
    min-height: 360px !important;
    padding: 21px 16px !important;
    border-radius: 20px !important;
  }
}


/* DP_STANDALONE_DESTINATION_LAYOUT_LIVE_V1 */
/* Sidebar destinations: full-width dashboard-matched layout without shared ticker/back controls. */
body.dp-standalone-section .dp-dashboard-ticker,
body.dp-standalone-section .dp-dashboard-ticker-empty,
body.dp-standalone-section .dp-back-home { display: none !important; }
body.dp-standalone-section .page-wrapper {
  width: 100% !important;
  min-height: 100vh !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
}
body.dp-standalone-section .page-content {
  width: min(100%, 1440px) !important;
  max-width: 1440px !important;
  min-height: 100vh !important;
  margin: 0 auto !important;
  padding: 34px 28px 64px !important;
  background: transparent !important;
}
body.dp-standalone-section .page-content > .card,
body.dp-standalone-section .page-content > .luxury-card,
body.dp-standalone-section .page-content > .radius-15,
body.dp-standalone-section .page-content > .radius-15.card {
  width: 100% !important;
  max-width: none !important;
  margin-right: auto !important;
  margin-left: auto !important;
}
body.dp-standalone-section .page-content > .row {
  width: 100% !important;
  margin-right: 0 !important;
  margin-left: 0 !important;
}
body.dp-standalone-section .page-content > .row > [class*="col-"] {
  padding-right: 10px !important;
  padding-left: 10px !important;
}
body.dp-standalone-section .page-content > .row > [class*="col-"] > .card,
body.dp-standalone-section .page-content > .row > [class*="col-"] > .luxury-card {
  width: 100% !important;
  max-width: none !important;
  min-height: 220px !important;
  margin-right: auto !important;
  margin-left: auto !important;
}
body.dp-standalone-section .page-content > .card,
body.dp-standalone-section .page-content > .row > [class*="col-"] > .card,
body.dp-standalone-section .page-content > .row > [class*="col-"] > .luxury-card {
  border-radius: 24px !important;
}
body.dp-standalone-section .page-content .table-responsive,
body.dp-standalone-section .page-content .dataTables_wrapper,
body.dp-standalone-section .page-content table { width: 100% !important; max-width: none !important; }
body.dp-standalone-section .page-content a[href^="javascript:history.back"],
body.dp-standalone-section .page-content a[onclick*="history.back"] { display: none !important; }
@media (max-width: 700px) {
  body.dp-standalone-section .page-content { padding: 22px 12px 46px !important; }
  body.dp-standalone-section .page-content > .row > [class*="col-"] { padding-right: 0 !important; padding-left: 0 !important; }
  body.dp-standalone-section .page-content > .row > [class*="col-"] > .card,
  body.dp-standalone-section .page-content > .row > [class*="col-"] > .luxury-card { min-height: 180px !important; }
}


/* DP_BACK_BUTTON_AND_ICON_ENCODING_LIVE_V1 */
/* One history Back control on every non-dashboard page; Back Home is intentionally removed. */
.dp-back-button {
  position: fixed !important;
  top: 18px !important;
  right: 22px !important;
  z-index: 10060 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 42px !important;
  padding: 10px 17px !important;
  border: 1px solid rgba(128,190,255,.5) !important;
  border-radius: 13px !important;
  color: #fff !important;
  background: linear-gradient(135deg,#145bd0,#433be2) !important;
  box-shadow: 0 10px 24px rgba(4,25,75,.28) !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  text-decoration: none !important;
}
.dp-back-button:hover { transform: translateY(-2px); filter: brightness(1.08); }
body.dp-service-page .dp-back-button,
body.dp-standalone-section .dp-back-button { top: 18px !important; right: 22px !important; }
body.dp-dashboard-shell:not(.dp-service-page):not(.dp-standalone-section) .dp-back-button { display: none !important; }
@media (max-width: 700px) {
  .dp-back-button { top: 12px !important; right: 12px !important; min-height: 38px !important; padding: 9px 13px !important; font-size: 11px !important; }
}


/* DP_ICON_FONT_FINAL_FIX_LIVE_V1 */
.dp-service-category-icon i,
.dp-service-category-icon .bx {
  display: inline-block !important;
  width: auto !important;
  height: auto !important;
  font-family: boxicons !important;
  font-style: normal !important;
  font-weight: 400 !important;
  line-height: 1 !important;
  speak: none;
}