/* KIRA user-side premium style pack: app-like dashboard, mobile UX, cards, forms, statuses, receipts and smooth transitions. */
:root{--kira-navy:#071a35;--kira-navy-2:#10233f;--kira-blue:var(--theme,#0d6efd);--kira-soft:#f5f8ff;--kira-line:#dfe8f7;--kira-good:#0e7a43;--kira-warn:#9b5d00;--kira-bad:#b42318;--kira-shadow:0 22px 55px rgba(6,26,52,.12);--kira-shadow-strong:0 34px 90px rgba(6,26,52,.22)}
html{scroll-behavior:smooth}body{background:radial-gradient(circle at 12% 0%,rgba(13,110,253,.10),transparent 31%),radial-gradient(circle at 90% 4%,rgba(76,201,240,.10),transparent 28%),linear-gradient(180deg,#edf4ff 0%,#f9fbff 48%,#eef5ff 100%)!important;transition:background .25s ease,color .25s ease}body.page-ready main,body.page-ready .container{animation:kiraPageIn .32s ease both}@keyframes kiraPageIn{from{opacity:.25;transform:translateY(8px)}to{opacity:1;transform:none}}
.container.py-4{max-width:1240px}.hero-soft{border:1px solid rgba(255,255,255,.23)!important;box-shadow:0 32px 90px rgba(7,26,53,.22)!important}.hero-soft:before{content:'';position:absolute;inset:0;background:linear-gradient(120deg,rgba(255,255,255,.10),transparent 42%,rgba(255,255,255,.08));pointer-events:none}.hero-soft h1{letter-spacing:-.035em}.gradient-chip{display:inline-flex;align-items:center;gap:8px;border:1px solid rgba(255,255,255,.26);background:rgba(255,255,255,.13);color:#fff;border-radius:999px;padding:8px 13px;font-weight:900;box-shadow:inset 0 1px 0 rgba(255,255,255,.2)}
.card,.premium-card,.stat-card,.auth-card,.feature-card,.service-card,.detail-box,.outline-stat,.order-card{border:1px solid rgba(223,232,247,.94)!important;box-shadow:var(--kira-shadow)!important;background:rgba(255,255,255,.92)!important;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}.premium-card,.stat-card,.card{position:relative;overflow:hidden}.premium-card:before,.stat-card:before,.card:before{content:'';position:absolute;left:18px;right:18px;top:0;height:3px;border-radius:0 0 999px 999px;background:linear-gradient(90deg,var(--kira-blue),#4cc9f0,transparent);opacity:.72}.stat-card{transition:transform .2s ease,box-shadow .2s ease}.stat-card:hover{transform:translateY(-3px);box-shadow:var(--kira-shadow-strong)!important}.stat-card .icon{background:linear-gradient(135deg,rgba(13,110,253,.15),rgba(76,201,240,.18))!important;border:1px solid rgba(13,110,253,.14)}
.user-quick-actions{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px;margin:-8px 0 24px}.user-quick-action{position:relative;display:flex;align-items:center;gap:10px;text-decoration:none;color:#13243d;background:rgba(255,255,255,.94);border:1px solid rgba(223,232,247,.95);border-radius:22px;padding:14px 13px;font-weight:900;box-shadow:0 16px 36px rgba(6,26,52,.10);overflow:hidden;transition:.2s}.user-quick-action:before{content:'';position:absolute;width:80px;height:80px;border-radius:50%;background:rgba(13,110,253,.08);right:-30px;top:-30px}.user-quick-action:hover{transform:translateY(-3px);box-shadow:0 25px 52px rgba(6,26,52,.16);color:var(--kira-blue)}.user-quick-action i{width:40px;height:40px;border-radius:16px;display:grid;place-items:center;color:#fff;background:linear-gradient(135deg,var(--kira-navy),var(--kira-blue));box-shadow:0 12px 25px rgba(13,110,253,.22);flex:0 0 40px}.user-quick-action span{position:relative;z-index:1}
.badge-soft,.copy-chip,.status-pill,.id-chip,.trust-badge,.countdown-chip{box-shadow:0 10px 22px rgba(6,26,52,.08);border:1px solid rgba(255,255,255,.55)}.status-pill{display:inline-flex!important;align-items:center;gap:6px;border-radius:999px!important;font-weight:900!important;padding:8px 11px!important;line-height:1!important}.status-pill:before{content:'';width:7px;height:7px;border-radius:50%;background:currentColor;box-shadow:0 0 0 4px rgba(255,255,255,.52)}.status-completed,.status-approved,.status-payment-paid,.status-payment-free{background:#dff8ea!important;color:#0e7a43!important}.status-pending,.status-submitted,.status-processing,.status-payment-pending{background:#fff4d8!important;color:#9b5d00!important}.status-rejected,.status-cancelled,.status-declined,.status-payment-failed{background:#ffe9e7!important;color:#b42318!important}.status-corrections{background:#eef4ff!important;color:#0d4ea6!important}.status-draft,.status-payment-unpaid{background:#eef2f8!important;color:#4b5f7d!important}
.orders-mobile{display:none}.order-card{border-radius:24px!important;padding:16px;margin-bottom:14px}.order-card-row{display:flex;justify-content:space-between;gap:13px;padding:10px 0;border-bottom:1px dashed rgba(177,194,220,.72)}.order-card-row:last-child{border-bottom:0}.order-card-label{font-size:.77rem;text-transform:uppercase;letter-spacing:.05em;color:#73819a;font-weight:900}.order-card-value{text-align:right;font-weight:800;min-width:0}.order-title{font-weight:950;color:#13243d}.amount-strong{font-weight:950;color:#0e7a43}.code-note{font-size:.76rem;color:#61708a;background:#f3f7ff;border:1px solid #e2ebf8;border-radius:999px;padding:5px 8px;max-width:130px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:inline-block}.btn,.copy-chip,.pay-link-btn,.delete-request-btn,.wa-track-btn{border-radius:999px!important;font-weight:850!important}.btn-primary,.btn-success,.btn-danger{box-shadow:0 14px 28px rgba(13,110,253,.14)}
.premium-empty-state{background:radial-gradient(circle at 10% 0%,rgba(13,110,253,.10),transparent 35%),linear-gradient(180deg,#fff,#f8fbff)!important;border:1px dashed #cbdcf4!important;border-radius:26px!important;box-shadow:0 16px 38px rgba(6,26,52,.08);padding:30px!important}.premium-empty-state i{background:linear-gradient(135deg,var(--kira-navy),var(--kira-blue))!important;color:#fff!important}.skeleton-card{border-radius:24px!important;min-height:105px!important;position:relative;overflow:hidden}.skeleton-card:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.62),transparent);transform:translateX(-100%);animation:kiraShine 1.4s infinite}@keyframes kiraShine{to{transform:translateX(100%)}}
.form-control,.form-select,textarea,input[type=text],input[type=email],input[type=password],input[type=number],input[type=tel],input[type=url]{border-radius:18px!important;border:1px solid #dbe7f7!important;box-shadow:0 10px 22px rgba(16,35,70,.05)!important;min-height:46px}.form-control:focus,.form-select:focus,textarea:focus{border-color:rgba(13,110,253,.45)!important;box-shadow:0 0 0 .22rem rgba(13,110,253,.10),0 12px 28px rgba(16,35,70,.08)!important}.form-label{font-weight:850;color:#20324e}.auth-card{box-shadow:0 32px 80px rgba(6,26,52,.16)!important}.auth-card:before{content:'';display:block;height:5px;border-radius:999px;background:linear-gradient(90deg,var(--kira-blue),#4cc9f0,#7c3aed);margin:-10px 0 18px}
.mobile-bottom-nav{left:12px!important;right:12px!important;bottom:max(10px,env(safe-area-inset-bottom))!important;border-radius:26px!important;background:rgba(255,255,255,.88)!important;border:1px solid rgba(255,255,255,.76)!important;box-shadow:0 24px 55px rgba(6,26,52,.22)!important}.mobile-bottom-nav a{position:relative}.mobile-bottom-nav a.active:after{content:'';position:absolute;left:30%;right:30%;bottom:3px;height:3px;border-radius:999px;background:var(--kira-blue)}.sidebar{box-shadow:25px 0 80px rgba(0,0,0,.32)!important}.sidebar a{border:1px solid rgba(255,255,255,.05)}.sidebar a:hover{transform:translateX(3px)}.floating-help-main{border-radius:24px!important;animation:kiraFloat 3s ease-in-out infinite}.floating-help-main:after{content:'';position:absolute;inset:-8px;border-radius:30px;border:1px solid rgba(13,110,253,.26);animation:kiraPulse 2.2s infinite}.floating-help-panel{box-shadow:0 26px 70px rgba(6,26,52,.22)!important}@keyframes kiraFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}@keyframes kiraPulse{0%{opacity:.9;transform:scale(.95)}100%{opacity:0;transform:scale(1.12)}}
.user-notify-fab{position:fixed;right:16px;bottom:160px;z-index:1034;width:52px;height:52px;border-radius:20px;border:0;background:linear-gradient(135deg,#fff,#edf5ff);color:var(--kira-blue);box-shadow:0 18px 38px rgba(6,26,52,.16);display:grid;place-items:center;font-size:20px}.user-notify-fab .notification-dot{position:absolute;right:-4px;top:-6px}.user-notify-drawer{position:fixed;top:0;right:0;height:100dvh;width:min(92vw,390px);background:rgba(255,255,255,.96);backdrop-filter:blur(18px);border-left:1px solid rgba(223,232,247,.9);box-shadow:-25px 0 80px rgba(6,26,52,.24);z-index:6600;transform:translateX(106%);transition:.28s ease;display:flex;flex-direction:column}.user-notify-drawer.show{transform:none}.user-notify-head{padding:18px 18px 12px;border-bottom:1px solid #e7eef9;display:flex;justify-content:space-between;align-items:center}.user-notify-list{padding:14px;overflow:auto}.user-notify-item{display:block;text-decoration:none;color:#20324e;background:#f7faff;border:1px solid #e2ebf8;border-radius:20px;padding:13px;margin-bottom:10px}.user-notify-item strong{display:block;color:#10233f}.user-notify-item small{color:#6b7a92}.user-notify-backdrop{position:fixed;inset:0;background:rgba(5,16,35,.42);backdrop-filter:blur(5px);z-index:6590;display:none}.user-notify-backdrop.show{display:block}
.payment-method-card,.pay-method,.payment-card{border:1px solid #dfe8f7!important;border-radius:26px!important;background:linear-gradient(180deg,#fff,#f8fbff)!important;box-shadow:var(--kira-shadow)!important;padding:18px!important}.receipt-preparing{position:fixed;inset:0;background:rgba(5,16,35,.62);backdrop-filter:blur(12px);z-index:6800;display:none;align-items:center;justify-content:center;padding:18px}.receipt-preparing.show{display:flex}.receipt-preparing-card{width:min(92vw,380px);border-radius:30px;background:linear-gradient(145deg,#fff,#f3f8ff);box-shadow:0 35px 90px rgba(0,0,0,.32);padding:28px;text-align:center}.receipt-preparing-card i{width:70px;height:70px;border-radius:25px;display:grid;place-items:center;margin:0 auto 14px;color:#fff;background:linear-gradient(135deg,var(--kira-navy),var(--kira-blue));font-size:28px;animation:kiraFloat 1.8s infinite}
.copy-chip[data-copy-text],button[data-copy-text]{position:relative;overflow:hidden}.copy-chip[data-copy-text]:active,button[data-copy-text]:active{transform:scale(.98)}.kira-copied-pop{position:fixed;left:50%;bottom:110px;transform:translateX(-50%) translateY(14px);opacity:0;background:#061a34;color:#fff;border-radius:999px;padding:11px 16px;box-shadow:0 18px 45px rgba(6,26,52,.28);z-index:6900;font-weight:900;transition:.22s}.kira-copied-pop.show{opacity:1;transform:translateX(-50%) translateY(0)}
.site-theme-dark body,.site-theme-dark{background:radial-gradient(circle at 12% 0%,rgba(13,110,253,.14),transparent 30%),linear-gradient(180deg,#07111f,#0c1726 55%,#08111d)!important;color:#eaf1fb!important}.site-theme-dark .card,.site-theme-dark .premium-card,.site-theme-dark .stat-card,.site-theme-dark .auth-card,.site-theme-dark .feature-card,.site-theme-dark .service-card,.site-theme-dark .detail-box,.site-theme-dark .outline-stat,.site-theme-dark .order-card,.site-theme-dark .mobile-bottom-nav,.site-theme-dark .user-notify-drawer{background:rgba(17,29,45,.92)!important;color:#eaf1fb!important;border-color:#25364f!important}.site-theme-dark .text-muted,.site-theme-dark .small-muted{color:#a9b7cc!important}.site-theme-dark .order-title,.site-theme-dark .user-notify-item strong{color:#eef6ff!important}.site-theme-dark .user-quick-action,.site-theme-dark .user-notify-item,.site-theme-dark .floating-help-panel{background:#111d2d!important;color:#eaf1fb!important;border-color:#25364f!important}.site-theme-dark .form-control,.site-theme-dark .form-select,.site-theme-dark textarea{background:#0f1b2b!important;color:#eef6ff!important;border-color:#2a3c56!important}.site-theme-dark .table{color:#eaf1fb!important}.site-theme-dark .table thead th{background:#142238!important;color:#dce8f7!important}
@media(max-width:992px){.user-quick-actions{grid-template-columns:repeat(3,minmax(0,1fr))}.hero-soft .bg-white{background:rgba(255,255,255,.96)!important}}@media(max-width:767px){body{padding-bottom:102px!important}.container.py-4{padding-left:13px!important;padding-right:13px!important}.user-quick-actions{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.user-quick-action{border-radius:20px;padding:12px 10px;font-size:.88rem}.user-quick-action i{width:36px;height:36px;border-radius:14px}.table-responsive.user-table-switch{display:none!important}.orders-mobile{display:block!important}.hero-soft{padding:24px!important;border-radius:28px!important}.hero-soft h1{font-size:1.58rem}.display-6{font-size:1.75rem}.stat-card,.premium-card,.card{border-radius:24px!important}.floating-help{bottom:108px!important}.user-notify-fab{bottom:176px;right:14px;width:48px;height:48px}.btn{width:auto}.d-flex.justify-content-end.gap-2.flex-wrap .btn,.d-flex.justify-content-end.gap-2.flex-wrap button{flex:1 1 auto}.order-card-value{font-size:.92rem}.mobile-bottom-nav a{font-size:.68rem;padding:7px 2px}.mobile-bottom-nav a i{font-size:16px}}@media(max-width:420px){.user-quick-actions{grid-template-columns:1fr}.hero-soft .btn-lg{width:100%}.stat-card .display-6{font-size:1.55rem}.user-notify-drawer{width:100vw}.mobile-bottom-nav{left:8px!important;right:8px!important}.mobile-bottom-nav a{font-size:.62rem}.mobile-bottom-nav a i{font-size:15px}.floating-help-main{width:54px;height:54px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* ==========================================================
   KIRA handcrafted user-side polish layer - 30 extra styles
   Focus: real product feel, mobile touch comfort, no generic AI look
   ========================================================== */
:root{
  --kira-ink:#102033;
  --kira-ink-2:#283a55;
  --kira-muted:#6c7a90;
  --kira-line:#e3ecf7;
  --kira-panel:#ffffff;
  --kira-soft-blue:#f2f7ff;
  --kira-success:#0e7a43;
  --kira-warn:#9b5d00;
  --kira-danger:#b42318;
  --kira-radius-lg:30px;
  --kira-radius-md:22px;
  --kira-radius-sm:16px;
  --kira-touch:48px;
  --kira-fast:.18s cubic-bezier(.2,.7,.3,1);
  --kira-smooth:.32s cubic-bezier(.2,.7,.3,1);
  --kira-elev-1:0 10px 28px rgba(16,35,70,.07);
  --kira-elev-2:0 18px 52px rgba(16,35,70,.12);
  --kira-elev-3:0 28px 80px rgba(6,26,52,.18);
}

/* 1. Handcrafted soft grain background so pages feel designed, not plain */
body:before{content:'';position:fixed;inset:0;pointer-events:none;z-index:-1;background:radial-gradient(circle at 12% 8%,rgba(13,110,253,.10),transparent 28%),radial-gradient(circle at 92% 22%,rgba(76,201,240,.10),transparent 24%),linear-gradient(rgba(255,255,255,.38),rgba(255,255,255,.38));opacity:.9;}
body:after{content:'';position:fixed;inset:0;pointer-events:none;z-index:-1;background-image:linear-gradient(rgba(13,110,253,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(13,110,253,.035) 1px,transparent 1px);background-size:34px 34px;mask-image:linear-gradient(to bottom,rgba(0,0,0,.22),transparent 72%);}

/* 2. Premium page container breathing room */
.container.py-4{max-width:1180px;}
main.container, .container{scroll-margin-top:18px;}

/* 3. Human-made card edge detail */
.card,.premium-card,.stat-card,.service-card,.feature-card,.auth-card,.payment-method-card,.pay-method,.payment-card,.order-card{position:relative;isolation:isolate;}
.card:where(:not(.no-card-line)):before,.premium-card:before,.stat-card:before,.auth-card:before,.payment-card:before,.order-card:before{content:'';position:absolute;inset:0;border-radius:inherit;padding:1px;background:linear-gradient(135deg,rgba(255,255,255,.85),rgba(13,110,253,.18),rgba(255,255,255,.35));-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none;z-index:-1;}

/* 4. Product-like hover: subtle lift only on precise devices */
@media (hover:hover){
  .card,.premium-card,.stat-card,.service-card,.feature-card,.order-card,.payment-card{transition:transform var(--kira-smooth),box-shadow var(--kira-smooth),border-color var(--kira-smooth);}
  .card:hover,.premium-card:hover,.stat-card:hover,.service-card:hover,.feature-card:hover,.order-card:hover,.payment-card:hover{transform:translateY(-3px);box-shadow:var(--kira-elev-2)!important;border-color:rgba(13,110,253,.18)!important;}
}

/* 5. Real button tactile feel */
.btn{min-height:42px;display:inline-flex;align-items:center;justify-content:center;gap:8px;letter-spacing:.01em;transition:transform var(--kira-fast),box-shadow var(--kira-fast),filter var(--kira-fast)!important;}
.btn:active{transform:translateY(1px) scale(.985)!important;filter:saturate(.94);}
.btn-primary{background:linear-gradient(135deg,#0d6efd,#0b56d0)!important;border-color:transparent!important;box-shadow:0 14px 30px rgba(13,110,253,.22)!important;}
.btn-success{background:linear-gradient(135deg,#12a061,#0d7d49)!important;border-color:transparent!important;box-shadow:0 14px 30px rgba(18,160,97,.18)!important;}
.btn-warning{background:linear-gradient(135deg,#ffd166,#f7a600)!important;border-color:transparent!important;color:#3b2a00!important;box-shadow:0 14px 30px rgba(247,166,0,.18)!important;}
.btn-danger{background:linear-gradient(135deg,#ef4444,#c81e1e)!important;border-color:transparent!important;box-shadow:0 14px 30px rgba(239,68,68,.18)!important;}
.btn-outline-primary,.btn-outline-secondary,.btn-light{border-width:1.5px!important;box-shadow:0 10px 22px rgba(16,35,70,.06)!important;}

/* 6. Cleaner icon chips */
.icon,.stat-card .icon,.user-quick-action i,.quick-icon,.net-icon{box-shadow:inset 0 1px 0 rgba(255,255,255,.72),0 12px 24px rgba(13,110,253,.13);}

/* 7. Headings look custom, not generated */
h1,h2,h3,h4,.fw-bold{letter-spacing:-.025em;}
h1 .text-muted,h2 .text-muted,h3 .text-muted{letter-spacing:0;}
.display-6{letter-spacing:-.04em;line-height:.98;}

/* 8. Refined muted text and descriptions */
.text-muted,.small-muted,.form-text{color:#667891!important;line-height:1.55;}
p{line-height:1.65;}

/* 9. Premium section labels */
.section-eyebrow,.eyebrow,.badge-soft{font-size:.76rem;text-transform:uppercase;letter-spacing:.09em;font-weight:950;}
.badge-soft{box-shadow:inset 0 0 0 1px rgba(13,110,253,.08);}

/* 10. Form fields with inside glow */
.form-control,.form-select,textarea{background:linear-gradient(180deg,#fff,#fbfdff)!important;transition:border-color var(--kira-fast),box-shadow var(--kira-fast),background var(--kira-fast)!important;}
.form-control:hover,.form-select:hover,textarea:hover{border-color:#c8d9f0!important;}
.input-group-text{border-radius:18px!important;border-color:#dbe7f7!important;background:#f7faff!important;color:#466181!important;font-weight:800;}
::placeholder{color:#9aa8bb!important;opacity:1;}

/* 11. File upload visual polish */
input[type=file].form-control{padding:10px!important;background:#f8fbff!important;}
input[type=file]::file-selector-button{border:0;border-radius:999px;background:linear-gradient(135deg,#0d6efd,#0b56d0);color:#fff;font-weight:900;padding:9px 14px;margin-right:12px;box-shadow:0 10px 20px rgba(13,110,253,.16);}

/* 12. Tables feel like modern data cards */
.table-responsive{border-radius:24px;border:1px solid var(--kira-line);box-shadow:var(--kira-elev-1);background:#fff;overflow:hidden;}
.table{margin-bottom:0!important;vertical-align:middle;}
.table thead th{font-size:.73rem;text-transform:uppercase;letter-spacing:.075em;color:#566881!important;font-weight:950!important;padding:14px 16px!important;}
.table tbody td{padding:15px 16px!important;border-color:#eef3fb!important;}
.table tbody tr{transition:background var(--kira-fast);}
.table tbody tr:hover{background:#f8fbff;}

/* 13. Status badges get a real dot pulse only for waiting states */
.status-pending:before,.status-processing:before,.status-submitted:before,.status-payment-pending:before{animation:kiraStatusPulse 1.6s infinite;}
@keyframes kiraStatusPulse{0%,100%{box-shadow:0 0 0 3px rgba(247,166,0,.10)}50%{box-shadow:0 0 0 7px rgba(247,166,0,.18)}}

/* 14. Mobile order cards with receipt-like top strip */
.order-card{overflow:hidden;background:linear-gradient(180deg,#fff,#f9fbff)!important;}
.order-card:after{content:'';position:absolute;left:0;right:0;top:0;height:5px;background:linear-gradient(90deg,#0d6efd,#4cc9f0,#12a061);}
.order-card .btn{min-height:38px;}

/* 15. Empty states with unique illustration feel */
.premium-empty-state{text-align:center;overflow:hidden;position:relative;}
.premium-empty-state:after{content:'';position:absolute;width:180px;height:180px;right:-75px;bottom:-90px;background:radial-gradient(circle,rgba(13,110,253,.10),transparent 62%);border-radius:50%;}
.premium-empty-state strong{display:block;color:#12253e;font-size:1.05rem;margin-top:10px;}

/* 16. Dashboard hero inner shine */
.hero-soft,.hero{box-shadow:0 35px 90px rgba(6,26,52,.22)!important;}
.hero-soft:before,.hero:before{content:'';position:absolute;inset:0;background:linear-gradient(120deg,rgba(255,255,255,.18),transparent 34%,rgba(255,255,255,.10) 72%,transparent);pointer-events:none;}
.hero-soft>*{position:relative;z-index:1;}

/* 17. User quick actions feel tappable */
.user-quick-action{min-height:92px;align-content:center;box-shadow:0 14px 32px rgba(16,35,70,.08)!important;}
.user-quick-action:hover i{transform:rotate(-4deg) scale(1.04);}
.user-quick-action i{transition:transform var(--kira-smooth);}

/* 18. Better mobile nav affordance */
.mobile-bottom-nav{padding:7px 8px calc(7px + env(safe-area-inset-bottom));}
.mobile-bottom-nav a{border-radius:18px;transition:background var(--kira-fast),color var(--kira-fast),transform var(--kira-fast);}
.mobile-bottom-nav a:active{transform:scale(.96);}
.mobile-bottom-nav a.active{background:linear-gradient(180deg,#eef6ff,#fff);color:#0d6efd!important;font-weight:950;}
.mobile-bottom-nav a.active i{transform:translateY(-1px);}

/* 19. Sidebar premium active/hover bar */
.sidebar a{position:relative;overflow:hidden;}
.sidebar a:before{content:'';position:absolute;left:0;top:10px;bottom:10px;width:3px;border-radius:999px;background:#4cc9f0;opacity:0;transition:opacity var(--kira-fast);}
.sidebar a:hover:before,.sidebar a.active:before{opacity:1;}

/* 20. Floating support stays premium without covering content */
.floating-help-panel{border:1px solid rgba(223,232,247,.9);backdrop-filter:blur(16px);}
.help-action{border-radius:16px!important;transition:transform var(--kira-fast),background var(--kira-fast)!important;}
.help-action:hover{transform:translateX(3px);background:#eef6ff!important;}

/* 21. Notification drawer list is easier to read */
.user-notify-item{transition:transform var(--kira-fast),background var(--kira-fast),border-color var(--kira-fast);}
.user-notify-item:hover{transform:translateX(-3px);background:#fff!important;border-color:#cbdcf4!important;}
.user-notify-item span{display:block;line-height:1.45;margin:5px 0 3px;color:#4f6078;}

/* 22. Premium SweetAlert modals */
.premium-universal-popup,.premium-response-popup{border-radius:30px!important;box-shadow:0 34px 95px rgba(6,26,52,.26)!important;border:1px solid rgba(255,255,255,.85)!important;}
.premium-swal-confirm,.swal2-confirm{border-radius:999px!important;font-weight:950!important;box-shadow:0 16px 36px rgba(13,110,253,.20)!important;}
.premium-swal-cancel,.swal2-cancel{border-radius:999px!important;font-weight:900!important;}
.swal2-title{letter-spacing:-.035em!important;}
.swal2-html-container{line-height:1.55!important;}

/* 23. Network warning more app-like */
.network-warning{border:1px solid rgba(255,255,255,.3);backdrop-filter:blur(14px);box-shadow:0 24px 58px rgba(6,26,52,.23);}

/* 24. Receipt preparing card polish */
.receipt-preparing-card{border:1px solid rgba(255,255,255,.78);}
.receipt-preparing-card h3{letter-spacing:-.04em;}
.receipt-preparing.show .receipt-preparing-card{animation:kiraPopIn .28s cubic-bezier(.2,.8,.2,1) both;}
@keyframes kiraPopIn{from{transform:translateY(14px) scale(.96);opacity:0}to{transform:none;opacity:1}}

/* 25. Inline code/reference chips */
.code-note,code,.reference-chip,.copy-chip{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;letter-spacing:-.02em;}
code{background:#edf5ff;color:#0d4ea6;border-radius:10px;padding:3px 6px;}

/* 26. Service cards with image depth */
.service-card img,.premium-image,img.rounded{box-shadow:0 16px 36px rgba(6,26,52,.12);}
.service-card{overflow:hidden;}
.service-card .btn{width:100%;}

/* 27. Wallet/payment amount typography */
.amount-strong,.display-6,.price-text,.wallet-balance{font-variant-numeric:tabular-nums;}
.amount-strong{font-size:1.02em;}

/* 28. Better alerts that do not look Bootstrap-default */
.alert{border:0!important;border-radius:22px!important;box-shadow:0 14px 35px rgba(16,35,70,.07);}
.alert-info{background:linear-gradient(180deg,#eef7ff,#f9fcff)!important;color:#0d4ea6!important;}
.alert-success{background:linear-gradient(180deg,#e8fbf0,#f7fffa)!important;color:#0e7a43!important;}
.alert-warning{background:linear-gradient(180deg,#fff6dc,#fffdfa)!important;color:#805300!important;}
.alert-danger{background:linear-gradient(180deg,#ffeceb,#fffafa)!important;color:#b42318!important;}

/* 29. Touch targets and mobile spacing */
@media(max-width:767px){
  .btn,.form-control,.form-select,.input-group-text{min-height:var(--kira-touch)!important;}
  .card,.premium-card,.stat-card,.auth-card,.payment-card{box-shadow:0 14px 36px rgba(16,35,70,.09)!important;}
  .table-responsive{border-radius:20px;}
  .table thead{display:none;}
  .floating-quick-actions{bottom:174px!important;}
  .floating-help{right:14px!important;}
  footer{padding-bottom:118px!important;}
}

/* 30. Dark mode handcrafted fixes */
.site-theme-dark body:before{background:radial-gradient(circle at 12% 8%,rgba(13,110,253,.18),transparent 28%),radial-gradient(circle at 90% 24%,rgba(76,201,240,.12),transparent 23%);}
.site-theme-dark body:after{background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);}
.site-theme-dark .card:where(:not(.no-card-line)):before,.site-theme-dark .premium-card:before,.site-theme-dark .stat-card:before,.site-theme-dark .auth-card:before,.site-theme-dark .payment-card:before,.site-theme-dark .order-card:before{background:linear-gradient(135deg,rgba(255,255,255,.16),rgba(13,110,253,.22),rgba(255,255,255,.08));}
.site-theme-dark .table-responsive{background:#111d2d!important;border-color:#25364f!important;}
.site-theme-dark .table tbody tr:hover{background:#142238!important;}
.site-theme-dark .premium-empty-state{background:linear-gradient(180deg,#111d2d,#0d1828)!important;border-color:#25364f!important;}
.site-theme-dark .premium-empty-state strong{color:#eef6ff!important;}
.site-theme-dark .alert-info{background:#10233a!important;color:#b8dcff!important;}
.site-theme-dark .alert-success{background:#0d2d23!important;color:#aef2ca!important;}
.site-theme-dark .alert-warning{background:#332711!important;color:#ffe0a3!important;}
.site-theme-dark .alert-danger{background:#361817!important;color:#ffc2bd!important;}
.site-theme-dark .input-group-text{background:#142238!important;color:#cfe0f6!important;border-color:#2a3c56!important;}
.site-theme-dark code{background:#172944;color:#b8dcff;}
.icon-only-btn{width:44px;min-width:44px;padding-inline:0!important}.is-pressed{transform:scale(.985)!important}.form-touched{position:relative}.form-touched:after{content:'Changes ready';position:absolute;right:12px;top:-10px;background:#eef7ff;color:#0d4ea6;border:1px solid #cfe3ff;border-radius:999px;padding:4px 9px;font-size:.68rem;font-weight:950;box-shadow:0 10px 22px rgba(16,35,70,.07);pointer-events:none}.external-cue{font-size:.8em;opacity:.7}.sidebar a.active{background:rgba(255,255,255,.14)!important;color:#fff!important}.sidebar a.active:before{opacity:1}.site-theme-dark .form-touched:after{background:#10233a;color:#b8dcff;border-color:#25364f}@media(max-width:767px){.table-responsive table tbody td[data-label]{display:grid;grid-template-columns:42% 58%;gap:10px;align-items:center}.table-responsive table tbody td[data-label]:before{content:attr(data-label);font-size:.72rem;text-transform:uppercase;letter-spacing:.06em;color:#73819a;font-weight:950}.table-responsive table tbody tr{display:block;border-bottom:1px solid #eef3fb;padding:8px 0}.table-responsive table tbody td{display:block!important;border:0!important;padding:10px 14px!important}.site-theme-dark .table-responsive table tbody tr{border-color:#25364f}}

/* =========================================================
   Final handcrafted premium style layer: admin + auth + user pages
   Focus: visual polish only, no core logic changes.
   ========================================================= */
:root{
  --craft-ink:#102033;
  --craft-muted:#60718a;
  --craft-line:#e5edf7;
  --craft-soft:#f7faff;
  --craft-blue:#0d6efd;
  --craft-cyan:#35bdf6;
  --craft-success:#14b86a;
  --craft-warn:#f4a51c;
  --craft-danger:#ef4444;
  --craft-radius:26px;
  --craft-shadow:0 22px 60px rgba(16,35,70,.10);
  --craft-shadow-sm:0 12px 32px rgba(16,35,70,.075);
}
body{background-attachment:fixed!important;}
body:before{opacity:.72!important;}
.container.py-4{max-width:1240px;}

/* Admin side premium polish */
body:has(.sidebar) .container.py-4 > .card,
body:has(.sidebar) .container.py-4 > .premium-card,
.admin-shell-card{border-radius:28px!important;border:1px solid rgba(223,232,247,.92)!important;box-shadow:var(--craft-shadow-sm)!important;}
.sidebar{box-shadow:24px 0 70px rgba(6,18,38,.24);border-right:1px solid rgba(255,255,255,.08);}
.sidebar .logo-text{font-size:1.18rem;}
.sidebar a{min-height:46px;font-weight:850;letter-spacing:-.01em;}
.sidebar a span:first-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.sidebar a .notification-dot{box-shadow:0 0 0 4px rgba(255,255,255,.07);}
body:has(.sidebar) .table{vertical-align:middle;}
body:has(.sidebar) .table tbody tr{transition:transform .16s ease,box-shadow .16s ease,background .16s ease;}
body:has(.sidebar) .table tbody tr:hover{transform:translateY(-1px);box-shadow:0 14px 28px rgba(16,35,70,.055);}
body:has(.sidebar) .btn{letter-spacing:-.01em;}
body:has(.sidebar) .btn-primary,
body:has(.sidebar) .btn-dark{background:linear-gradient(135deg,#071a35,#0d6efd)!important;border:0!important;box-shadow:0 12px 28px rgba(13,110,253,.18)!important;}
body:has(.sidebar) .btn-outline-primary{border-color:#b9d5ff!important;background:#f7fbff!important;font-weight:900!important;}
body:has(.sidebar) .badge,
body:has(.sidebar) .badge-soft{font-weight:950;letter-spacing:.01em;}
body:has(.sidebar) h1,
body:has(.sidebar) h2,
body:has(.sidebar) h3,
body:has(.sidebar) h4{letter-spacing:-.045em;}
body:has(.sidebar) .form-control,
body:has(.sidebar) .form-select,
body:has(.sidebar) textarea{border-radius:16px!important;background:#fbfdff;border-color:#dbe7f7;}
body:has(.sidebar) .form-control:focus,
body:has(.sidebar) .form-select:focus{background:#fff;box-shadow:0 0 0 4px rgba(13,110,253,.10)!important;}

/* Auth pages: login/register/reset */
.auth-wrap{background:radial-gradient(circle at 15% 12%,rgba(53,189,246,.22),transparent 28%),radial-gradient(circle at 86% 20%,rgba(13,110,253,.22),transparent 26%),linear-gradient(180deg,#f5f9ff,#eef5ff)!important;}
.auth-card{position:relative;overflow:hidden;border:1px solid rgba(255,255,255,.82)!important;box-shadow:0 34px 90px rgba(6,26,52,.16)!important;}
.auth-card:before{content:'';position:absolute;inset:0 0 auto 0;height:7px;background:linear-gradient(90deg,#071a35,#0d6efd,#35bdf6);}
.auth-card:after{content:'';position:absolute;width:220px;height:220px;right:-90px;top:-90px;border-radius:999px;background:rgba(13,110,253,.08);pointer-events:none;}
.auth-card h1,.auth-card h2,.auth-card h3{letter-spacing:-.055em;}
.auth-card .form-label{font-weight:900;color:#2d3c52;}
.auth-card .form-control,.auth-card .form-select{min-height:52px;border-radius:18px!important;background:#f9fcff!important;border-color:#dce8f8!important;}
.auth-card .btn{min-height:50px;border-radius:18px!important;font-weight:950;}
.auth-card .btn-primary,.auth-card .btn-dark{background:linear-gradient(135deg,#071a35,#0d6efd)!important;border:0!important;}

/* Dashboard cleanup and no-repeat polish */
.dashboard-clean-hero{padding:42px!important;border-radius:34px!important;}
.dashboard-snapshot-card{background:rgba(255,255,255,.96);color:#102033;border-radius:28px;padding:24px;box-shadow:0 24px 58px rgba(6,26,52,.13);border:1px solid rgba(255,255,255,.85);}
.snapshot-main,.snapshot-ref{display:flex;justify-content:space-between;gap:14px;align-items:center;padding:14px 16px;border-radius:20px;background:linear-gradient(180deg,#f7fbff,#fff);border:1px solid #e3edf9;}
.snapshot-main span,.snapshot-ref span{font-size:.78rem;text-transform:uppercase;letter-spacing:.06em;color:#60718a;font-weight:950;}
.snapshot-main strong{font-size:1.35rem;font-weight:950;color:#071a35;}
.snapshot-ref code{font-size:1rem;font-weight:950;}
.dashboard-actions-clean{margin-bottom:24px;}
.dashboard-actions-clean .user-quick-action span{font-weight:950;}
.dashboard-stats-clean .stat-card{min-height:130px;}
.dashboard-focus-card,.dashboard-panel{position:relative;overflow:hidden;}
.dashboard-focus-card:after,.dashboard-panel:after{content:'';position:absolute;right:-48px;bottom:-56px;width:140px;height:140px;border-radius:999px;background:rgba(13,110,253,.055);pointer-events:none;}
.payment-action-row{display:flex;gap:14px;text-decoration:none;color:#102033;padding:14px;border-radius:20px;background:#f8fbff;border:1px solid #e3edf9;margin-bottom:12px;transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease;}
.payment-action-row:hover{transform:translateY(-2px);box-shadow:0 14px 32px rgba(16,35,70,.08);border-color:#cfe1fb;color:#071a35;}
.payment-action-row i{width:42px;height:42px;border-radius:16px;background:linear-gradient(135deg,#071a35,#0d6efd);color:#fff;display:grid;place-items:center;flex:0 0 42px;}
.payment-action-row small{display:block;color:#60718a;font-weight:750;margin-top:2px;}

/* Order form and service pages */
.service-card,.service-order-card,.upload-card,.order-form-card{border-radius:28px!important;border:1px solid rgba(223,232,247,.94)!important;box-shadow:var(--craft-shadow-sm)!important;}
.service-card .card-body,.service-order-card .card-body{padding:22px!important;}
.service-card .btn,.service-order-card .btn{border-radius:16px!important;font-weight:950;}
input[type=file].form-control{padding:14px!important;background:linear-gradient(180deg,#f8fbff,#fff)!important;border-style:dashed!important;border-width:2px!important;}
textarea.message-box,textarea.form-control{line-height:1.55;}

/* Payment pages */
.payment-card,.alert-pay,.mpesa-card,.manual-payment-card{border-radius:28px!important;border:1px solid rgba(223,232,247,.95)!important;box-shadow:var(--craft-shadow-sm)!important;position:relative;overflow:hidden;}
.payment-card:before,.mpesa-card:before,.manual-payment-card:before{content:'';position:absolute;left:0;top:0;bottom:0;width:5px;background:linear-gradient(180deg,#0d6efd,#35bdf6);}
.payment-method-card{border-radius:24px!important;background:linear-gradient(180deg,#fff,#f8fbff)!important;border:1px solid #e3edf9!important;transition:transform .16s ease,box-shadow .16s ease;}
.payment-method-card:hover{transform:translateY(-2px);box-shadow:0 18px 42px rgba(16,35,70,.09);}

/* Chat/messages page */
.chat-window,.message-thread,.ticket-thread{border-radius:30px!important;border:1px solid #e3edf9!important;background:linear-gradient(180deg,#ffffff,#f8fbff)!important;box-shadow:var(--craft-shadow-sm)!important;}
.chat-bubble,.message-bubble{border-radius:22px!important;box-shadow:0 10px 24px rgba(16,35,70,.055);}
.chat-bubble.admin,.message-bubble.admin{background:linear-gradient(135deg,#071a35,#0d6efd)!important;color:#fff!important;}
.chat-bubble.user,.message-bubble.user{background:#fff!important;border:1px solid #e3edf9!important;}
.message-box{border-radius:20px!important;}

/* Profile, security and account pages */
.profile-card,.security-card,.account-card{border-radius:30px!important;border:1px solid #e3edf9!important;box-shadow:var(--craft-shadow-sm)!important;}
.profile-avatar,.avatar-circle{box-shadow:0 16px 36px rgba(13,110,253,.18);border:4px solid rgba(255,255,255,.88);}
.security-row{border-radius:18px!important;padding:12px 14px!important;background:#f8fbff;margin-bottom:8px;border:1px solid #e6eef9;}

/* Receipt and notification pages */
.receipt-card,.invoice-card,.notification-card,.user-notify-item{border-radius:24px!important;}
.receipt-card,.invoice-card{border:1px solid #e3edf9!important;box-shadow:var(--craft-shadow-sm)!important;background:#fff;}
.receipt-card .btn,.invoice-card .btn{border-radius:999px!important;font-weight:950;}
.notification-card,.notification-item{border:1px solid #e3edf9!important;background:linear-gradient(180deg,#fff,#f9fcff)!important;box-shadow:0 10px 26px rgba(16,35,70,.055);}
.notification-item.unread,.user-notify-item.unread{border-color:#b8d7ff!important;background:#f0f7ff!important;}

/* Error and empty-state style */
.error-page,.not-found-page,.offline-page{min-height:70vh;display:grid;place-items:center;padding:24px;}
.error-card{width:min(94vw,620px);background:rgba(255,255,255,.96);border:1px solid rgba(255,255,255,.86);border-radius:34px;padding:34px;text-align:center;box-shadow:0 34px 90px rgba(6,26,52,.16);}
.error-card .error-icon{width:78px;height:78px;border-radius:26px;margin:0 auto 18px;display:grid;place-items:center;color:#fff;background:linear-gradient(135deg,#071a35,#0d6efd);font-size:30px;box-shadow:0 18px 42px rgba(13,110,253,.24);}
.premium-empty-state{border-radius:28px!important;}

/* Extra micro animations */
.btn,.copy-chip,.badge-soft,.stat-card,.premium-card,.card,.user-quick-action{transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease,background .18s ease;}
.btn:hover,.copy-chip:hover{transform:translateY(-1px);}
.stat-card:hover,.premium-card:hover,.card:hover{border-color:#cfe1fb!important;}
.form-control::placeholder,textarea::placeholder{color:#91a0b5!important;}
.form-label{font-weight:900!important;letter-spacing:-.01em;}
.dropdown-menu{border:1px solid #e2ebf7!important;border-radius:20px!important;box-shadow:0 20px 54px rgba(16,35,70,.13)!important;padding:8px!important;}
.dropdown-item{border-radius:14px!important;font-weight:800;}

/* Responsive finish */
@media(max-width:767px){
  .dashboard-clean-hero{padding:28px 20px!important;border-radius:28px!important;}
  .dashboard-clean-hero h1{font-size:1.85rem;}
  .snapshot-main,.snapshot-ref{display:block;}
  .snapshot-main strong,.snapshot-ref code{display:block;margin-top:6px;}
  .dashboard-snapshot-card{padding:18px;border-radius:24px;}
  .payment-action-row{padding:13px;}
  body:has(.sidebar) .container.py-4{padding-left:14px!important;padding-right:14px!important;}
  .auth-card{padding:22px!important;border-radius:28px!important;}
  .card,.premium-card,.stat-card{border-radius:24px!important;}
}

/* Dark mode finish */
.site-theme-dark .dashboard-snapshot-card,
.site-theme-dark .snapshot-main,
.site-theme-dark .snapshot-ref,
.site-theme-dark .payment-action-row,
.site-theme-dark .security-row,
.site-theme-dark .receipt-card,
.site-theme-dark .invoice-card,
.site-theme-dark .notification-card,
.site-theme-dark .notification-item{background:#111d2d!important;border-color:#25364f!important;color:#e9f2ff!important;}
.site-theme-dark .snapshot-main strong,.site-theme-dark .payment-action-row{color:#e9f2ff!important;}
.site-theme-dark .payment-action-row small{color:#9fb0c8!important;}
.site-theme-dark .auth-wrap{background:radial-gradient(circle at 15% 12%,rgba(53,189,246,.12),transparent 28%),radial-gradient(circle at 86% 20%,rgba(13,110,253,.14),transparent 26%),linear-gradient(180deg,#091421,#0c1624)!important;}
.site-theme-dark .auth-card{background:#111d2d!important;border-color:#25364f!important;}
.site-theme-dark .auth-card .form-control,.site-theme-dark .auth-card .form-select{background:#142238!important;border-color:#2a3c56!important;color:#e9f2ff!important;}
.site-theme-dark .error-card{background:#111d2d;color:#e9f2ff;border-color:#25364f;}
