
/* DataLisans Customer Panel V7 Smart UX */
.dl7-page-title{font-size:clamp(1.55rem,2.2vw,2.35rem);font-weight:950;color:#fff;letter-spacing:-.035em;margin:0}
.dl7-sub{color:#9fb1ca;max-width:820px;margin:.45rem 0 0}
.dl7-shell{display:grid;grid-template-columns:repeat(12,1fr);gap:16px}
.dl7-card{background:linear-gradient(180deg,rgba(17,30,49,.96),rgba(10,18,31,.96));border:1px solid rgba(148,163,184,.16);border-radius:24px;color:#e5edf8;box-shadow:0 14px 40px rgba(0,0,0,.18);overflow:hidden}
.dl7-card-head{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:18px 20px;border-bottom:1px solid rgba(148,163,184,.14)}
.dl7-card-head h3{margin:0;color:#fff;font-size:1.08rem;font-weight:900}
.dl7-card-body{padding:20px}
.dl7-stepper{display:grid;gap:12px}
.dl7-step{display:grid;grid-template-columns:44px 1fr auto;gap:14px;align-items:center;padding:14px;border:1px solid rgba(148,163,184,.16);border-radius:18px;background:rgba(255,255,255,.035)}
.dl7-step .num{width:44px;height:44px;border-radius:15px;background:linear-gradient(135deg,#f59e0b,#38bdf8);display:flex;align-items:center;justify-content:center;color:#07101c;font-weight:950}
.dl7-step strong{color:#fff}.dl7-step small{color:#9fb1ca;display:block;margin-top:2px}
.dl7-command{position:relative;background:#08111f;border:1px solid rgba(148,163,184,.18);border-radius:18px;padding:16px 16px 56px;overflow:auto}
.dl7-command pre{margin:0;white-space:pre-wrap;word-break:break-word;color:#e5edf8;background:transparent;border:0}
.dl7-command .btn{position:absolute;right:12px;bottom:12px;border-radius:12px}
.dl7-tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:16px}
.dl7-tab{border:1px solid rgba(148,163,184,.18);background:rgba(255,255,255,.04);color:#dbeafe;border-radius:999px;padding:.58rem .85rem;font-weight:850;text-decoration:none}
.dl7-tab.active,.dl7-tab:hover{background:#f59e0b;color:#111827;border-color:#f59e0b}
.dl7-status{display:inline-flex;align-items:center;gap:6px;padding:.38rem .68rem;border-radius:999px;font-size:.78rem;font-weight:900;border:1px solid rgba(148,163,184,.18)}
.dl7-status.ok{background:rgba(34,197,94,.12);color:#86efac;border-color:rgba(34,197,94,.24)}
.dl7-status.warn{background:rgba(245,158,11,.13);color:#fcd34d;border-color:rgba(245,158,11,.24)}
.dl7-status.danger{background:rgba(239,68,68,.13);color:#fecaca;border-color:rgba(239,68,68,.24)}
.dl7-status.info{background:rgba(56,189,248,.12);color:#bae6fd;border-color:rgba(56,189,248,.24)}
.dl7-product-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px}
.dl7-product{position:relative;padding:18px;border:1px solid rgba(148,163,184,.16);border-radius:22px;background:rgba(255,255,255,.035);min-height:260px}
.dl7-product:hover{border-color:rgba(245,158,11,.38);transform:translateY(-1px);background:rgba(255,255,255,.055)}
.dl7-product-icon{width:56px;height:56px;border-radius:18px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#fbbf24,#38bdf8);color:#07101c;font-weight:950;font-size:1.05rem}
.dl7-price-row{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:14px 0}
.dl7-price{border:1px solid rgba(148,163,184,.16);border-radius:14px;padding:10px 8px;text-align:center;background:rgba(255,255,255,.03)}
.dl7-price strong{display:block;color:#fff}.dl7-price span{color:#9fb1ca;font-size:.76rem}
.dl7-notification{display:grid;grid-template-columns:44px 1fr auto;gap:12px;align-items:start;padding:14px;border:1px solid rgba(148,163,184,.16);border-radius:18px;background:rgba(255,255,255,.03);margin-bottom:10px}
.dl7-notification.unread{border-color:rgba(245,158,11,.32);background:rgba(245,158,11,.06)}
.dl7-notification .ico{width:44px;height:44px;border-radius:15px;background:rgba(56,189,248,.12);display:flex;align-items:center;justify-content:center;color:#67e8f9}
.dl7-sec-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px}
.dl7-sec-item{padding:16px;border:1px solid rgba(148,163,184,.16);border-radius:18px;background:rgba(255,255,255,.035)}
.dl7-sec-item i{font-size:1.4rem;color:#38bdf8}
.dl7-renew-row{display:grid;grid-template-columns:1fr 160px 140px auto;gap:12px;align-items:center;padding:14px;border:1px solid rgba(148,163,184,.16);border-radius:18px;background:rgba(255,255,255,.03);margin-bottom:10px}
.dl7-filterbar{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.dl7-filterbar input,.dl7-filterbar select{max-width:260px}
.dl7-hero-mini{border:1px solid rgba(148,163,184,.16);border-radius:26px;background:linear-gradient(135deg,rgba(17,32,55,.98),rgba(19,37,70,.92));padding:24px;margin-bottom:18px}
@media(max-width:991.98px){.dl7-renew-row{grid-template-columns:1fr}.dl7-step{grid-template-columns:44px 1fr}.dl7-step .dl7-step-action{grid-column:2}.dl7-price-row{grid-template-columns:repeat(2,1fr)}}
