/* =====================================================================
   ZR PAY · VIP THEME  v2.0
   Drop-in override for Blithe (user + admin) and the landing page.
   Loaded AFTER all other stylesheets. Dark by default, light optional.
   ===================================================================== */
@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800&family=Hind+Siliguri:wght@400;500;600;700&display=swap');

:root{
  --zr-h: 22;                       /* accent hue (admin can change in Control Center) */
  --zr-a:  hsl(var(--zr-h) 96% 56%);
  --zr-a2: hsl(calc(var(--zr-h) + 38) 96% 60%);
  --zr-a3: hsl(calc(var(--zr-h) - 14) 98% 52%);
  --zr-grad: linear-gradient(135deg,var(--zr-a3),var(--zr-a) 45%,var(--zr-a2));
  --zr-glow: 0 0 0 1px hsl(var(--zr-h) 96% 56% / .35), 0 10px 40px -8px hsl(var(--zr-h) 96% 56% / .45);
  --zr-r: 18px;
  --zr-font: 'Plus Jakarta Sans','Hind Siliguri',system-ui,-apple-system,'Segoe UI',sans-serif;
  --zr-ok:#22c55e; --zr-warn:#f59e0b; --zr-bad:#ef4444; --zr-info:#38bdf8;
}
html[data-zr="dark"]{
  --zr-bg:#0a0912; --zr-bg2:#100e1c; --zr-card:rgba(255,255,255,.045); --zr-card2:rgba(255,255,255,.075);
  --zr-line:rgba(255,255,255,.09); --zr-tx:#f4f3fb; --zr-mut:#9b98b4; --zr-inp:rgba(255,255,255,.06);
  --zr-shadow:0 20px 50px -20px rgba(0,0,0,.7); color-scheme:dark;
}
html[data-zr="light"]{
  --zr-bg:#f6f4fb; --zr-bg2:#ffffff; --zr-card:#ffffff; --zr-card2:#fbf9ff;
  --zr-line:rgba(30,20,60,.10); --zr-tx:#17142a; --zr-mut:#6d6a85; --zr-inp:#f3f1fa;
  --zr-shadow:0 20px 50px -24px rgba(60,30,120,.25); color-scheme:light;
}

/* ---------- base ---------- */
html body{font-family:var(--zr-font)!important;background:var(--zr-bg)!important;color:var(--zr-tx)!important;-webkit-font-smoothing:antialiased}
html body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:
   radial-gradient(900px 500px at 8% -10%,hsl(var(--zr-h) 96% 56% / .20),transparent 60%),
   radial-gradient(800px 480px at 105% 0%,hsl(calc(var(--zr-h) + 200) 90% 60% / .14),transparent 60%),
   radial-gradient(700px 500px at 50% 115%,hsl(calc(var(--zr-h) + 300) 90% 55% / .12),transparent 60%);}
html[data-zr="light"] body::before{opacity:.55}
h1,h2,h3,h4,h5,h6{font-family:var(--zr-font)!important;color:var(--zr-tx);letter-spacing:-.01em}
a{color:var(--zr-a)} a:hover{color:var(--zr-a2)}
.text-muted,small,.text-secondary{color:var(--zr-mut)!important}
::selection{background:hsl(var(--zr-h) 96% 56% / .35)}
::-webkit-scrollbar{width:9px;height:9px}::-webkit-scrollbar-thumb{background:hsl(var(--zr-h) 40% 50% / .35);border-radius:9px}

/* ---------- shell (Blithe) ---------- */
body .navbar-bg{background:transparent!important;height:0!important}
body .main-wrapper{background:transparent}
body .main-content{background:transparent!important;padding-top:96px}
body .navbar,body .main-navbar{background:color-mix(in srgb,var(--zr-bg2) 78%,transparent)!important;backdrop-filter:blur(18px) saturate(160%);-webkit-backdrop-filter:blur(18px) saturate(160%);border-bottom:1px solid var(--zr-line)!important;box-shadow:none!important}
body .navbar .nav-link,body .navbar a{color:var(--zr-tx)}
body .navbar .nav-link:hover{color:var(--zr-a)}
body .main-sidebar,body .main-sidebar .sidebar-brand{background:color-mix(in srgb,var(--zr-bg2) 88%,transparent)!important;box-shadow:none!important}
body .main-sidebar{border-right:1px solid var(--zr-line);backdrop-filter:blur(20px)}
body .main-sidebar .sidebar-brand a{color:var(--zr-tx)!important}
body .main-sidebar .sidebar-brand img{max-height:42px;filter:drop-shadow(0 4px 14px hsl(var(--zr-h) 96% 56% / .45))}
body .sidebar-menu .menu-header{color:var(--zr-mut)!important;font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;padding:18px 22px 6px}
body .sidebar-menu li a,body .sidebar-menu li.dropdown>a{color:var(--zr-tx)!important;border-radius:12px;margin:3px 12px;padding:10px 14px;font-weight:600;transition:.25s;position:relative}
body .sidebar-menu li a i,body .sidebar-menu li a svg{color:var(--zr-mut);transition:.25s}
body .sidebar-menu li a:hover{background:var(--zr-card2)!important;transform:translateX(3px)}
body .sidebar-menu li a:hover i,body .sidebar-menu li a:hover svg{color:var(--zr-a)}
body .sidebar-menu li.active>a,body .sidebar-menu li a.active{background:var(--zr-grad)!important;color:#fff!important;box-shadow:var(--zr-glow)}
body .sidebar-menu li.active>a i,body .sidebar-menu li.active>a svg{color:#fff}
body .sidebar-menu li ul.dropdown-menu{background:transparent!important;box-shadow:none!important;border:0}
body .sidebar-menu li ul.dropdown-menu li a{font-weight:500;color:var(--zr-mut)!important}
body .sidebar-menu li ul.dropdown-menu li.active a,body .sidebar-menu li ul.dropdown-menu li a:hover{color:var(--zr-a)!important;background:var(--zr-card)!important;box-shadow:none}

/* ---------- cards ---------- */
body .card{background:var(--zr-card)!important;border:1px solid var(--zr-line)!important;border-radius:var(--zr-r)!important;box-shadow:var(--zr-shadow)!important;color:var(--zr-tx);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);transition:transform .3s,box-shadow .3s,border-color .3s}
body .card .card-header{background:transparent!important;border-bottom:1px solid var(--zr-line)!important;border-radius:var(--zr-r) var(--zr-r) 0 0}
body .card .card-header h4,body .card .card-header h3,.card-title{color:var(--zr-tx)!important;font-weight:700}
body .card .card-footer{background:transparent;border-top:1px solid var(--zr-line)}
body .section-title{color:var(--zr-tx)}
body .l-bg-style1,body [class*="l-bg-"]{background:var(--zr-card)!important;border:1px solid var(--zr-line)!important;position:relative;overflow:hidden}
body [class*="l-bg-"]::after{content:"";position:absolute;right:-40px;top:-40px;width:140px;height:140px;border-radius:50%;background:var(--zr-grad);opacity:.18;filter:blur(6px)}
body [class*="l-bg-"] *{color:var(--zr-tx)!important}

/* ---------- buttons ---------- */
body .btn{border-radius:12px!important;font-weight:700;letter-spacing:.01em;transition:.25s;border-width:1px}
body .btn-primary,body .btn-success.zr-cta{background:var(--zr-grad)!important;border:0!important;color:#fff!important;box-shadow:0 10px 26px -10px hsl(var(--zr-h) 96% 56% / .75)}
body .btn-primary:hover{transform:translateY(-2px);box-shadow:0 16px 34px -10px hsl(var(--zr-h) 96% 56% / .9);filter:brightness(1.07)}
body .btn-secondary,body .btn-light,body .btn-outline-primary{background:var(--zr-card2)!important;color:var(--zr-tx)!important;border:1px solid var(--zr-line)!important}
body .btn-outline-primary:hover,body .btn-light:hover{border-color:var(--zr-a)!important;color:var(--zr-a)!important}
body .btn-success{background:linear-gradient(135deg,#16a34a,#22c55e)!important;border:0!important;color:#fff!important}
body .btn-danger{background:linear-gradient(135deg,#dc2626,#f43f5e)!important;border:0!important}
body .btn-warning{background:linear-gradient(135deg,#f59e0b,#fbbf24)!important;border:0!important;color:#2a1700!important}
body .btn-info{background:linear-gradient(135deg,#0ea5e9,#38bdf8)!important;border:0!important;color:#fff!important}

/* ---------- forms ---------- */
body .form-control,body .custom-select,body .form-select,body select.form-control,body textarea,body .select2-container--default .select2-selection--single,body .select2-container--default .select2-selection--multiple,body .input-group-text{background:var(--zr-inp)!important;border:1px solid var(--zr-line)!important;color:var(--zr-tx)!important;border-radius:12px!important;min-height:44px}
body .form-control:focus,body .form-select:focus{border-color:var(--zr-a)!important;box-shadow:0 0 0 4px hsl(var(--zr-h) 96% 56% / .18)!important;background:var(--zr-inp)!important}
body .form-control::placeholder{color:var(--zr-mut)}
body label,body .form-label{color:var(--zr-tx);font-weight:600;font-size:13px}
body .select2-container--default .select2-selection--single .select2-selection__rendered{color:var(--zr-tx);line-height:42px}
body .select2-dropdown{background:var(--zr-bg2);border:1px solid var(--zr-line);color:var(--zr-tx)}

/* ---------- tables ---------- */
body .table{color:var(--zr-tx)!important;border-color:var(--zr-line)!important}
body .table thead th{background:var(--zr-card2)!important;color:var(--zr-mut)!important;font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;border-color:var(--zr-line)!important;border-bottom-width:1px}
body .table td,body .table th{border-color:var(--zr-line)!important;vertical-align:middle}
body .table-hover tbody tr:hover{background:var(--zr-card2)!important}
body .table-bordered{border:1px solid var(--zr-line)!important;border-radius:14px;overflow:hidden}

/* ---------- modal / dropdown / misc ---------- */
body .modal-content{background:var(--zr-bg2)!important;border:1px solid var(--zr-line)!important;border-radius:22px!important;color:var(--zr-tx);box-shadow:0 40px 90px -20px rgba(0,0,0,.75)}
body .modal-header,body .modal-footer{border-color:var(--zr-line)!important}
body .modal-title{color:var(--zr-tx)}
body .close,body .btn-close{color:var(--zr-tx);opacity:.8;text-shadow:none}
.modal-backdrop.show{opacity:.65;backdrop-filter:blur(4px)}
body .dropdown-menu{background:var(--zr-bg2)!important;border:1px solid var(--zr-line)!important;border-radius:14px!important;box-shadow:var(--zr-shadow)!important}
body .dropdown-item,body .dropdown-title{color:var(--zr-tx)!important}
body .dropdown-item:hover{background:var(--zr-card2)!important;color:var(--zr-a)!important}
body .badge{border-radius:999px;font-weight:700;padding:.45em .8em}
body .badge-success,body .bg-success{background:rgba(34,197,94,.16)!important;color:#4ade80!important}
body .badge-danger,body .bg-danger{background:rgba(239,68,68,.16)!important;color:#f87171!important}
body .badge-warning,body .bg-warning{background:rgba(245,158,11,.16)!important;color:#fbbf24!important}
body .badge-info,body .bg-info{background:rgba(56,189,248,.16)!important;color:#7dd3fc!important}
body .badge-primary,body .bg-primary,body .bg-label-primary{background:hsl(var(--zr-h) 96% 56% / .16)!important;color:var(--zr-a)!important}
body .page-link{background:var(--zr-card);border-color:var(--zr-line);color:var(--zr-tx);border-radius:10px!important;margin:0 2px}
body .page-item.active .page-link{background:var(--zr-grad);border-color:transparent;color:#fff}
body .alert{border-radius:14px;border:1px solid var(--zr-line);background:var(--zr-card)}
body .nav-pills .nav-link.active,body .nav-tabs .nav-link.active{background:var(--zr-grad)!important;color:#fff!important;border:0}
body .nav-tabs{border-color:var(--zr-line)}
body .nav-tabs .nav-link{color:var(--zr-mut)}
body .progress{background:var(--zr-card2);border-radius:99px}
body .progress-bar{background:var(--zr-grad)}
body .page-overlay,body #page-overlay{background:var(--zr-bg)!important}
.lds-double-ring div{border-color:var(--zr-a) transparent var(--zr-a) transparent!important}
.jq-toast-single{border-radius:14px!important;font-family:var(--zr-font)!important}

/* ===================================================================
   ZR COMPONENTS
   =================================================================== */
.zr-wrap{max-width:1240px;margin:0 auto;padding:0 6px}
.zr-eyebrow{display:inline-flex;gap:8px;align-items:center;padding:6px 14px;border-radius:999px;background:hsl(var(--zr-h) 96% 56% / .12);border:1px solid hsl(var(--zr-h) 96% 56% / .3);color:var(--zr-a);font-weight:700;font-size:12px;letter-spacing:.12em;text-transform:uppercase}
.zr-eyebrow i{width:7px;height:7px;border-radius:50%;background:var(--zr-a);box-shadow:0 0 12px var(--zr-a);animation:zrPulse 1.8s infinite}
@keyframes zrPulse{50%{transform:scale(1.6);opacity:.4}}
.zr-head{text-align:center;margin:8px auto 34px;max-width:720px}
.zr-head h2{font-size:clamp(28px,4.6vw,46px);font-weight:800;margin:14px 0 10px;line-height:1.1}
.zr-head h2 b{background:var(--zr-grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.zr-head p{color:var(--zr-mut);font-size:16px;margin:0}

/* ticker / announcement */
.zr-ticker{position:relative;margin:0 0 22px;border-radius:14px;overflow:hidden;border:1px solid hsl(var(--zr-h) 96% 56% / .35);background:linear-gradient(90deg,hsl(var(--zr-h) 96% 56% / .16),hsl(var(--zr-h) 96% 56% / .04))}
.zr-ticker-track{display:inline-flex;gap:60px;padding:11px 0;white-space:nowrap;animation:zrTick 28s linear infinite;font-weight:600;font-size:14px;color:var(--zr-tx)}
.zr-ticker:hover .zr-ticker-track{animation-play-state:paused}
@keyframes zrTick{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* billing filter */
.zr-seg{display:inline-flex;padding:5px;border-radius:16px;background:var(--zr-card);border:1px solid var(--zr-line);gap:4px;flex-wrap:wrap;justify-content:center}
.zr-seg button{border:0;background:transparent;color:var(--zr-mut);font-weight:700;padding:9px 20px;border-radius:12px;transition:.25s;font-family:inherit;cursor:pointer}
.zr-seg button.on{background:var(--zr-grad);color:#fff;box-shadow:var(--zr-glow)}

/* ----- pricing grid ----- */
.zr-pricing{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:22px;align-items:stretch;padding:14px 0 10px}
.zr-plan{--ac:var(--zr-a);position:relative;border-radius:26px;padding:1px;background:linear-gradient(160deg,var(--zr-line),transparent 45%);transition:transform .35s cubic-bezier(.2,.8,.2,1),filter .3s}
.zr-plan>.in{position:relative;height:100%;display:flex;flex-direction:column;border-radius:25px;padding:28px 24px 24px;background:var(--zr-bg2);overflow:hidden;isolation:isolate}
html[data-zr="dark"] .zr-plan>.in{background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.02)),var(--zr-bg2)}
.zr-plan>.in::before{content:"";position:absolute;inset:0;z-index:-1;opacity:0;transition:.4s;background:radial-gradient(420px circle at var(--mx,50%) var(--my,0%),color-mix(in srgb,var(--ac) 28%,transparent),transparent 55%)}
.zr-plan:hover{transform:translateY(-8px)}
.zr-plan:hover>.in::before{opacity:1}
.zr-plan:hover{background:linear-gradient(160deg,var(--ac),transparent 60%)}
.zr-plan.is-popular{background:linear-gradient(160deg,var(--ac),color-mix(in srgb,var(--ac) 10%,transparent) 70%);box-shadow:0 30px 70px -24px color-mix(in srgb,var(--ac) 70%,transparent)}
@media(min-width:992px){.zr-plan.is-popular{transform:translateY(-10px)}.zr-plan.is-popular:hover{transform:translateY(-18px)}}
.zr-plan.is-current{outline:2px solid var(--zr-ok);outline-offset:3px}
.zr-ribbon{position:absolute;top:16px;right:-38px;transform:rotate(38deg);width:150px;text-align:center;padding:5px 0;background:var(--ac);color:#fff;font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;box-shadow:0 6px 16px -6px var(--ac)}
.zr-icon{width:54px;height:54px;border-radius:16px;display:grid;place-items:center;font-size:24px;color:#fff;background:linear-gradient(135deg,var(--ac),color-mix(in srgb,var(--ac) 55%,#000));box-shadow:0 12px 26px -10px var(--ac);margin-bottom:16px}
.zr-plan h3{font-size:22px;font-weight:800;margin:0 0 4px;text-transform:capitalize}
.zr-plan .desc{color:var(--zr-mut);font-size:14px;min-height:42px;margin:0 0 18px}
.zr-price{display:flex;align-items:flex-end;gap:6px;flex-wrap:wrap;margin-bottom:4px}
.zr-price .cur{font-size:22px;font-weight:700;color:var(--ac);align-self:flex-start;margin-top:8px}
.zr-price .amt{font-size:clamp(40px,5vw,54px);font-weight:800;line-height:1;letter-spacing:-.03em;background:linear-gradient(180deg,var(--zr-tx),color-mix(in srgb,var(--zr-tx) 62%,var(--ac)));-webkit-background-clip:text;background-clip:text;color:transparent}
.zr-price .per{color:var(--zr-mut);font-weight:600;font-size:14px;margin-bottom:7px}
.zr-was{display:flex;gap:10px;align-items:center;min-height:26px;margin-bottom:18px}
.zr-was s{color:var(--zr-mut);font-weight:600}
.zr-save{background:rgba(34,197,94,.15);color:#4ade80;font-weight:800;font-size:12px;padding:3px 10px;border-radius:99px}
.zr-line{height:1px;background:var(--zr-line);margin:6px 0 18px}
.zr-feats{list-style:none;margin:0 0 24px;padding:0;display:grid;gap:11px;flex:1}
.zr-feats li{display:flex;gap:11px;align-items:flex-start;font-size:14.5px;font-weight:500;color:var(--zr-tx)}
.zr-feats li::before{content:"";flex:none;width:20px;height:20px;border-radius:50%;background:var(--ac) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E") center/11px no-repeat;margin-top:1px;box-shadow:0 4px 10px -3px var(--ac)}
.zr-feats li.off{opacity:.45;text-decoration:line-through}
.zr-feats li.off::before{background:var(--zr-line) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239b98b4' stroke-width='3.5' stroke-linecap='round'%3E%3Cpath d='M18 6 6 18M6 6l12 12'/%3E%3C/svg%3E") center/10px no-repeat;box-shadow:none}
.zr-feats li small{display:block;color:var(--zr-mut);font-size:12px}
.zr-plan .zr-btn,.zr-plan .btn{width:100%;display:flex;justify-content:center;align-items:center;gap:8px;padding:14px 18px;border-radius:15px!important;font-weight:800;font-size:15px;text-decoration:none!important;border:0;color:#fff!important;background:linear-gradient(135deg,var(--ac),color-mix(in srgb,var(--ac) 60%,#000))!important;box-shadow:0 14px 28px -12px var(--ac);transition:.25s;position:relative;overflow:hidden}
.zr-plan .zr-btn::after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.35) 50%,transparent 70%);transform:translateX(-120%);transition:.7s}
.zr-plan .zr-btn:hover::after{transform:translateX(120%)}
.zr-plan .zr-btn:hover{transform:translateY(-2px);filter:brightness(1.08)}
.zr-plan .zr-btn.ghost{background:var(--zr-card2)!important;color:var(--zr-tx)!important;box-shadow:none;border:1px solid var(--zr-line)}
.zr-plan .btn-success{background:linear-gradient(135deg,#16a34a,#22c55e)!important}
.zr-foot{display:flex;justify-content:center;gap:26px;flex-wrap:wrap;margin:34px 0 8px;color:var(--zr-mut);font-weight:600;font-size:13.5px}

.zr-timer{display:inline-flex;gap:6px;font-weight:800;font-variant-numeric:tabular-nums}
.zr-timer span{background:var(--zr-card2);border:1px solid var(--zr-line);border-radius:8px;padding:3px 8px}

/* ----- admin: plan studio ----- */
.zr-bar{display:flex;gap:12px;flex-wrap:wrap;align-items:center;justify-content:space-between;margin-bottom:20px}
.zr-bar h2{margin:0;font-size:26px;font-weight:800}
.zr-bar .sub{color:var(--zr-mut);font-size:14px}
.zr-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:14px;margin-bottom:22px}
.zr-stat{padding:18px;border-radius:18px;background:var(--zr-card);border:1px solid var(--zr-line);position:relative;overflow:hidden}
.zr-stat::after{content:"";position:absolute;right:-30px;top:-30px;width:100px;height:100px;border-radius:50%;background:var(--zr-grad);opacity:.16}
.zr-stat small{display:block;font-weight:700;letter-spacing:.08em;text-transform:uppercase;font-size:11px}
.zr-stat b{display:block;font-size:28px;font-weight:800;margin-top:6px}
.zr-panel{background:var(--zr-card);border:1px solid var(--zr-line);border-radius:20px;padding:22px;margin-bottom:22px}
.zr-panel h5{font-weight:800;margin:0 0 4px}
.zr-panel .hint{color:var(--zr-mut);font-size:13px;margin-bottom:16px}
.zr-studio{display:grid;grid-template-columns:repeat(auto-fill,minmax(330px,1fr));gap:18px}
.zr-pc{--ac:var(--zr-a);border-radius:22px;background:var(--zr-card);border:1px solid var(--zr-line);padding:20px;position:relative;transition:.3s;overflow:hidden}
.zr-pc::before{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:var(--ac)}
.zr-pc:hover{border-color:var(--ac);transform:translateY(-4px);box-shadow:0 24px 50px -26px var(--ac)}
.zr-pc.off{opacity:.55;filter:grayscale(.6)}
.zr-pc .top{display:flex;gap:12px;align-items:center;margin-bottom:14px}
.zr-pc .top .zr-icon{margin:0;width:44px;height:44px;font-size:19px;border-radius:13px}
.zr-pc .top h4{margin:0;font-size:18px;font-weight:800}
.zr-pc .top small{color:var(--zr-mut)}
.zr-pc .grip{margin-left:auto;cursor:grab;color:var(--zr-mut);font-size:20px}
.zr-grid2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.zr-field{display:block}
.zr-field span{display:block;font-size:11px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--zr-mut);margin-bottom:5px}
.zr-inline{width:100%;background:var(--zr-inp);border:1px solid var(--zr-line);color:var(--zr-tx);border-radius:11px;padding:10px 12px;font-weight:700;font-family:inherit;transition:.2s;outline:0}
.zr-inline:focus{border-color:var(--ac);box-shadow:0 0 0 4px color-mix(in srgb,var(--ac) 22%,transparent)}
.zr-inline.saved{border-color:var(--zr-ok);box-shadow:0 0 0 4px rgba(34,197,94,.2)}
.zr-inline.err{border-color:var(--zr-bad)}
.zr-pc .acts{display:flex;gap:8px;margin-top:14px;flex-wrap:wrap;align-items:center}
.zr-chip{display:inline-flex;gap:6px;align-items:center;padding:7px 12px;border-radius:10px;background:var(--zr-card2);border:1px solid var(--zr-line);color:var(--zr-tx)!important;font-weight:700;font-size:12.5px;cursor:pointer;text-decoration:none!important;transition:.2s}
.zr-chip:hover{border-color:var(--zr-a);color:var(--zr-a)!important}
.zr-chip.danger:hover{border-color:var(--zr-bad);color:var(--zr-bad)!important}
.zr-switch{position:relative;display:inline-block;width:46px;height:26px;flex:none}
.zr-switch input{opacity:0;width:0;height:0}
.zr-switch i{position:absolute;inset:0;border-radius:99px;background:var(--zr-line);transition:.3s;cursor:pointer}
.zr-switch i::before{content:"";position:absolute;width:20px;height:20px;left:3px;top:3px;border-radius:50%;background:#fff;transition:.3s;box-shadow:0 2px 6px rgba(0,0,0,.35)}
.zr-switch input:checked+i{background:var(--zr-grad)}
.zr-switch input:checked+i::before{transform:translateX(20px)}
.zr-meta{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px}
.zr-meta span{font-size:12px;font-weight:700;padding:4px 10px;border-radius:99px;background:var(--zr-card2);border:1px solid var(--zr-line);color:var(--zr-mut)}
.zr-swatches{display:flex;gap:8px;flex-wrap:wrap}
.zr-swatches label{cursor:pointer;margin:0}
.zr-swatches input{display:none}
.zr-swatches i{display:block;width:30px;height:30px;border-radius:10px;background:var(--c);border:2px solid transparent;transition:.2s}
.zr-swatches input:checked+i{border-color:var(--zr-tx);transform:scale(1.15);box-shadow:0 6px 16px -4px var(--c)}
/* control center */
.zr-cc{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:18px}
.zr-row{display:flex;gap:14px;align-items:center;justify-content:space-between;padding:14px 0;border-bottom:1px dashed var(--zr-line)}
.zr-row:last-child{border:0}
.zr-row b{display:block;font-weight:700}.zr-row small{color:var(--zr-mut)}
.zr-hue{-webkit-appearance:none;appearance:none;width:100%;height:12px;border-radius:99px;background:linear-gradient(90deg,hsl(0 90% 55%),hsl(60 90% 55%),hsl(120 90% 45%),hsl(180 90% 45%),hsl(240 90% 60%),hsl(300 90% 55%),hsl(360 90% 55%));outline:0}
.zr-hue::-webkit-slider-thumb{-webkit-appearance:none;width:26px;height:26px;border-radius:50%;background:#fff;border:4px solid var(--zr-a);box-shadow:0 4px 12px rgba(0,0,0,.4);cursor:pointer}
/* theme toggle */
.zr-toggle{position:fixed;left:16px;bottom:16px;z-index:9998;width:46px;height:46px;border-radius:15px;border:1px solid var(--zr-line);background:var(--zr-bg2);color:var(--zr-tx);font-size:20px;cursor:pointer;display:grid;place-items:center;box-shadow:var(--zr-shadow);transition:.25s}
.zr-toggle:hover{transform:rotate(20deg) scale(1.08);border-color:var(--zr-a)}
/* reveal animation */
.zr-rv{opacity:0;transform:translateY(22px);transition:opacity .7s,transform .7s cubic-bezier(.2,.8,.2,1)}
.zr-rv.in{opacity:1;transform:none}



@media (max-width:575px){
  .zr-grid2{grid-template-columns:1fr 1fr}
  .zr-studio{grid-template-columns:1fr}
  body .main-content{padding-top:84px}
  .zr-plan>.in{padding:24px 20px 20px}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.zr-rv{opacity:1;transform:none}}


/* ===================================================================
   v2.1  POLISH – balanced sizes, sidebar fixes, icon alignment
   =================================================================== */
:root{--zr-a2:hsl(calc(var(--zr-h) + 16) 96% 58%)}
.zr-i{flex:none;vertical-align:-3px}
html body{font-size:14.5px;line-height:1.55}
body .main-content{padding-left:20px;padding-right:20px}
body .section .section-header h1,body .section-title{font-size:18px}
body .card .card-header{padding:16px 22px;min-height:0}
body .card .card-header h4,body .card .card-header h3{font-size:16px;line-height:1.3}
body .card .card-body{padding:20px 22px}
body .btn{font-size:13.5px;padding:9px 16px;line-height:1.35;display:inline-flex;align-items:center;justify-content:center;gap:7px}
body .btn-sm{padding:6px 12px;font-size:12.5px}
body .form-control,body .form-select{font-size:14px;padding:8px 14px}
body .table{font-size:13.5px}
body .table td,body .table th{padding:12px 14px}
body .badge{font-size:11.5px}
body label,body .form-label{font-size:12.5px}

/* sidebar */
body .main-sidebar{overflow-x:hidden}
body .main-sidebar .sidebar-menu{padding:6px 0 90px}
body .sidebar-menu li a,body .sidebar-menu li.dropdown>a{display:flex!important;align-items:center;gap:12px;font-size:14px;line-height:1.3;height:auto;width:auto;margin:2px 14px;padding:10px 14px;overflow:hidden;white-space:nowrap}
body .sidebar-menu li a i,body .sidebar-menu li a svg,body .sidebar-menu li a .feather{width:18px!important;height:18px!important;font-size:18px;margin:0!important;flex:none;stroke-width:2}
body .sidebar-menu li a span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis}
body .sidebar-menu li a.has-dropdown::after,body .sidebar-menu li a.has-dropdown:after{position:static!important;margin-left:auto;font-size:13px;transform:none}
body .sidebar-menu li.active>a,body .sidebar-menu li a.active{background:linear-gradient(135deg,var(--zr-a3),var(--zr-a))!important;box-shadow:0 8px 22px -10px hsl(var(--zr-h) 96% 56% / .7)}
body .sidebar-menu .menu-header{padding:16px 24px 6px;font-size:10.5px}
body .navbar .nav-link-lg{padding:8px 10px}
body .navbar svg,body .navbar .feather{width:19px;height:19px}
.zr-themebtn{display:flex;align-items:center;justify-content:center}

/* headings / hero */
.zr-head{margin:4px auto 28px}
.zr-head h2{font-size:clamp(24px,3.6vw,36px);margin:12px 0 8px}
.zr-head p{font-size:14.5px;max-width:560px;margin:0 auto}
.zr-eyebrow{font-size:11px;padding:5px 12px}
.zr-bar h2{font-size:22px}
.zr-bar .sub{font-size:13.5px}
.zr-stat b{font-size:24px}
.zr-panel h5{font-size:15.5px;display:flex;align-items:center;gap:8px}
.zr-panel h5 .zr-i{color:var(--zr-a)}

/* plan cards */
.zr-pricing{grid-template-columns:repeat(auto-fit,minmax(min(100%,270px),1fr));gap:20px}
.zr-plan>.in{padding:26px 22px 22px}
.zr-icon{width:48px;height:48px;border-radius:14px;margin-bottom:14px}
.zr-icon .zr-i{width:24px;height:24px}
.zr-plan h3{font-size:19px}
.zr-plan .desc{font-size:13.5px;min-height:38px;margin-bottom:14px}
.zr-price .cur{font-size:19px;margin-top:6px}
.zr-price .amt{font-size:clamp(34px,4vw,42px)}
.zr-price .per{font-size:13px;margin-bottom:6px}
.zr-feats{gap:10px}
.zr-feats li{font-size:13.5px}
.zr-plan .zr-btn,.zr-plan .btn{padding:12px 16px;font-size:14px}
.zr-ribbon{font-size:10px;top:15px;right:-40px}
.zr-save{font-size:11px}
.zr-foot{font-size:13px;gap:12px 26px}
.zr-foot span{display:inline-flex;align-items:center;gap:8px}
.zr-foot .zr-i{color:var(--zr-a)}
.zr-tk{display:inline-flex;align-items:center;gap:9px}
.zr-tk .zr-i{color:var(--zr-a)}
.zr-ticker-track{font-size:13.5px}

/* studio */
.zr-studio{grid-template-columns:repeat(auto-fill,minmax(min(100%,320px),1fr))}
.zr-pc .top .zr-icon{width:40px;height:40px;margin:0}
.zr-pc .top .zr-icon .zr-i{width:20px;height:20px}
.zr-pc .top h4{font-size:16px}
.zr-pc .grip{display:flex;color:var(--zr-mut)}
.zr-pc .zr-sel{width:16px;height:16px;accent-color:var(--zr-a)}
.zr-chip{font-size:12px;padding:7px 11px}
select.zr-inline{appearance:auto}
.zr-toggle{left:auto;right:16px;bottom:16px}

@media (max-width:991px){.zr-plan.is-popular,.zr-plan.is-popular:hover{transform:none}}
@media (max-width:575px){
  body .main-content{padding-left:12px;padding-right:12px}
}