@import "https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&display=swap";
@import "https://fonts.googleapis.com/css2?family=Noto+Nastaliq+Urdu:wght@400;700&display=swap";
:root{--primary:#06f;--primary-light:#3385ff;--primary-dark:#0047b3;--primary-50:#ebf3ff;--primary-100:#cce0ff;--primary-200:#99c2ff;--primary-900:#001a4d;--accent:#ffb800;--accent-light:#ffd54f;--accent-dark:#cc9200;--success:#00c853;--success-light:#e8f5e9;--success-dark:#009624;--warning:#ff9100;--warning-light:#fff3e0;--warning-dark:#e65100;--danger:#ff1744;--danger-light:#ffebee;--danger-dark:#d50000;--info:#2979ff;--info-light:#e3f2fd;--info-dark:#0d47a1;--dark:#0f172a;--dark-700:#1e293b;--dark-600:#334155;--dark-500:#475569;--dark-400:#64748b;--dark-300:#94a3b8;--dark-200:#cbd5e1;--dark-100:#e2e8f0;--dark-50:#f1f5f9;--white:#fff;--light:#f8fafc;--bg:#f1f5f9;--font-family:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;--font-size-xs:.75rem;--font-size-sm:.875rem;--font-size-base:1rem;--font-size-lg:1.125rem;--font-size-xl:1.25rem;--font-size-2xl:1.5rem;--font-size-3xl:1.875rem;--font-size-4xl:2.25rem;--font-size-5xl:3rem;--space-1:.25rem;--space-2:.5rem;--space-3:.75rem;--space-4:1rem;--space-5:1.25rem;--space-6:1.5rem;--space-8:2rem;--space-10:2.5rem;--space-12:3rem;--space-16:4rem;--space-20:5rem;--space-24:6rem;--radius-sm:.375rem;--radius:.5rem;--radius-md:.75rem;--radius-lg:1rem;--radius-xl:1.5rem;--radius-full:9999px;--shadow-xs:0 1px 2px #0000000d;--shadow-sm:0 1px 3px #0000001a,0 1px 2px #0000000f;--shadow:0 4px 6px -1px #0000001a,0 2px 4px -2px #0000001a;--shadow-md:0 10px 15px -3px #0000001a,0 4px 6px -4px #0000001a;--shadow-lg:0 20px 25px -5px #0000001a,0 8px 10px -6px #0000001a;--shadow-xl:0 25px 50px -12px #00000040;--transition-fast:.15s ease;--transition:.2s ease;--transition-slow:.3s ease;--z-dropdown:100;--z-sticky:200;--z-overlay:300;--z-modal:400;--z-toast:500;--container-max:1280px;--container-padding:1.5rem;--header-height:72px;--sidebar-width:280px;--sidebar-collapsed:80px}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;font-size:16px}body{font-family:var(--font-family);font-size:var(--font-size-base);color:var(--dark);background-color:var(--light);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;line-height:1.6;overflow-x:hidden}a{color:var(--primary);transition:color var(--transition);text-decoration:none}a:hover{color:var(--primary-dark)}img{max-width:100%;height:auto;display:block}button{cursor:pointer;font-family:inherit;font-size:inherit;background:0 0;border:none;outline:none}input,textarea,select{font-family:inherit;font-size:inherit;outline:none}ul,ol{list-style:none}h1,h2,h3,h4,h5,h6{color:var(--dark);font-weight:700;line-height:1.2}.container{width:100%;max-width:var(--container-max);padding:0 var(--container-padding);margin:0 auto}.container-fluid{width:100%;padding:0 var(--container-padding)}.btn{justify-content:center;align-items:center;gap:var(--space-2);padding:var(--space-3)var(--space-6);border-radius:var(--radius);font-weight:600;font-size:var(--font-size-sm);transition:all var(--transition);white-space:nowrap;-webkit-user-select:none;user-select:none;line-height:1.5;display:inline-flex;position:relative;overflow:hidden}.btn:after{content:"";opacity:0;transition:opacity var(--transition);background:#ffffff1a;position:absolute;inset:0}.btn:hover:after{opacity:1}.btn:active{transform:scale(.97)}.btn-primary{background:var(--primary);color:var(--white);box-shadow:0 2px 8px #0066ff4d}.btn-primary:hover{background:var(--primary-dark);color:var(--white);box-shadow:0 4px 12px #06f6}.btn-accent{background:var(--accent);color:var(--dark);box-shadow:0 2px 8px #ffb8004d}.btn-accent:hover{background:var(--accent-dark);box-shadow:0 4px 12px #ffb80066}.btn-success{background:var(--success);color:var(--white)}.btn-success:hover{background:var(--success-dark)}.btn-danger{background:var(--danger);color:var(--white)}.btn-danger:hover{background:var(--danger-dark)}.btn-outline{color:var(--primary);border:2px solid var(--primary);background:0 0}.btn-outline:hover{background:var(--primary);color:var(--white)}.btn-ghost{color:var(--dark-500);background:0 0}.btn-ghost:hover{background:var(--dark-50);color:var(--dark)}.btn-sm{padding:var(--space-2)var(--space-4);font-size:var(--font-size-xs)}.btn-lg{padding:var(--space-4)var(--space-8);font-size:var(--font-size-lg)}.btn-icon{padding:var(--space-3);border-radius:var(--radius)}.btn-icon.btn-sm{padding:var(--space-2)}.btn:disabled,.btn.disabled{opacity:.5;cursor:not-allowed;pointer-events:none}.btn-loading{position:relative;color:#0000!important}.btn-loading:before{content:"";border:2px solid #ffffff4d;border-top-color:#fff;border-radius:50%;width:18px;height:18px;animation:.6s linear infinite spin;position:absolute}.form-group{margin-bottom:var(--space-5)}.form-label{font-size:var(--font-size-sm);color:var(--dark-600);margin-bottom:var(--space-2);font-weight:600;display:block}.form-label .required{color:var(--danger);margin-left:2px}.form-input,.form-select,.form-textarea{width:100%;padding:var(--space-3)var(--space-4);border:2px solid var(--dark-200);border-radius:var(--radius);font-size:var(--font-size-base);color:var(--dark);background:var(--white);transition:all var(--transition)}.form-input:focus,.form-select:focus,.form-textarea:focus{border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-100)}.form-input::placeholder{color:var(--dark-300)}.form-input.error{border-color:var(--danger)}.form-input.error:focus{box-shadow:0 0 0 3px var(--danger-light)}.form-error{font-size:var(--font-size-xs);color:var(--danger);margin-top:var(--space-1)}.form-hint{font-size:var(--font-size-xs);color:var(--dark-400);margin-top:var(--space-1)}.form-textarea{resize:vertical;min-height:120px}.form-select{appearance:none;background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3e%3c/svg%3e");background-position:right 12px center;background-repeat:no-repeat;background-size:20px;padding-right:40px}.form-checkbox{align-items:center;gap:var(--space-3);cursor:pointer;display:flex}.form-checkbox input[type=checkbox]{width:18px;height:18px;accent-color:var(--primary);cursor:pointer}.card{background:var(--white);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);transition:all var(--transition-slow);overflow:hidden}.card:hover{box-shadow:var(--shadow-md)}.card-body{padding:var(--space-6)}.card-header{padding:var(--space-6);border-bottom:1px solid var(--dark-100);justify-content:space-between;align-items:center;display:flex}.card-title{font-size:var(--font-size-lg);color:var(--dark);font-weight:700}.card-footer{padding:var(--space-4)var(--space-6);border-top:1px solid var(--dark-100);background:var(--dark-50)}.card-glass{-webkit-backdrop-filter:blur(20px);background:#ffffffb3;border:1px solid #ffffff4d}.badge{align-items:center;gap:var(--space-1);padding:var(--space-1)var(--space-3);border-radius:var(--radius-full);font-size:var(--font-size-xs);text-transform:uppercase;letter-spacing:.5px;font-weight:600;display:inline-flex}.badge-primary{background:var(--primary-50);color:var(--primary-dark)}.badge-success{background:var(--success-light);color:var(--success-dark)}.badge-warning{background:var(--warning-light);color:var(--warning-dark)}.badge-danger{background:var(--danger-light);color:var(--danger-dark)}.badge-info{background:var(--info-light);color:var(--info-dark)}.badge-neutral{background:var(--dark-100);color:var(--dark-500)}.badge-accent{color:var(--accent-dark);background:#ffb80026}.data-table{border-collapse:separate;border-spacing:0;width:100%}.data-table th{padding:var(--space-3)var(--space-4);text-align:left;font-size:var(--font-size-xs);text-transform:uppercase;letter-spacing:.5px;color:var(--dark-400);background:var(--dark-50);border-bottom:2px solid var(--dark-100);white-space:nowrap;font-weight:700}.data-table td{padding:var(--space-4);border-bottom:1px solid var(--dark-100);font-size:var(--font-size-sm);color:var(--dark-600);vertical-align:middle}.data-table tbody tr{transition:background var(--transition)}.data-table tbody tr:hover{background:var(--primary-50)}.data-table tbody tr:last-child td{border-bottom:none}.pagination{align-items:center;gap:var(--space-2);display:flex}.pagination-btn{border-radius:var(--radius);width:36px;height:36px;font-size:var(--font-size-sm);color:var(--dark-500);background:var(--white);border:1px solid var(--dark-200);transition:all var(--transition);justify-content:center;align-items:center;font-weight:500;display:flex}.pagination-btn:hover{background:var(--primary-50);border-color:var(--primary);color:var(--primary)}.pagination-btn.active{background:var(--primary);border-color:var(--primary);color:var(--white)}.pagination-btn:disabled{opacity:.4;cursor:not-allowed}.modal-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:var(--z-modal);padding:var(--space-4);background:#0f172a99;justify-content:center;align-items:center;animation:.2s fadeIn;display:flex;position:fixed;inset:0}.modal{background:var(--white);border-radius:var(--radius-xl);box-shadow:var(--shadow-xl);width:100%;max-width:520px;max-height:90vh;animation:.3s slideUp;overflow-y:auto}.modal-lg{max-width:720px}.modal-header{padding:var(--space-6);border-bottom:1px solid var(--dark-100);justify-content:space-between;align-items:center;display:flex}.modal-title{font-size:var(--font-size-xl);font-weight:700}.modal-body{padding:var(--space-6)}.modal-footer{justify-content:flex-end;align-items:center;gap:var(--space-3);padding:var(--space-4)var(--space-6);border-top:1px solid var(--dark-100);display:flex}.toast-container{top:var(--space-6);right:var(--space-6);z-index:var(--z-toast);gap:var(--space-3);flex-direction:column;display:flex;position:fixed}.toast{align-items:center;gap:var(--space-3);padding:var(--space-4)var(--space-5);border-radius:var(--radius-md);background:var(--white);box-shadow:var(--shadow-lg);border-left:4px solid;min-width:320px;max-width:420px;animation:.3s slideInRight;display:flex}.toast-success{border-color:var(--success)}.toast-error{border-color:var(--danger)}.toast-warning{border-color:var(--warning)}.toast-info{border-color:var(--info)}.toast-message{font-size:var(--font-size-sm);flex:1;font-weight:500}.toast-close{padding:var(--space-1);border-radius:var(--radius-sm);color:var(--dark-400);transition:all var(--transition)}.toast-close:hover{background:var(--dark-100);color:var(--dark)}.skeleton{background:linear-gradient(90deg,var(--dark-100)25%,var(--dark-50)50%,var(--dark-100)75%);border-radius:var(--radius);background-size:200% 100%;animation:1.5s ease-in-out infinite skeleton}.skeleton-text{height:14px;margin-bottom:var(--space-2)}.skeleton-title{width:60%;height:24px;margin-bottom:var(--space-3)}.skeleton-image{aspect-ratio:1;width:100%}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes fadeOut{0%{opacity:1}to{opacity:0}}@keyframes slideUp{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes slideDown{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}@keyframes slideInRight{0%{opacity:0;transform:translate(20px)}to{opacity:1;transform:translate(0)}}@keyframes slideInLeft{0%{opacity:0;transform:translate(-100px)}to{opacity:1;transform:translate(0)}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes skeleton{0%{background-position:-200% 0}to{background-position:200% 0}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-4px)}}@keyframes scaleIn{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}.animate-fade-in{animation:.3s fadeIn}.animate-slide-up{animation:.3s slideUp}.animate-slide-down{animation:.3s slideDown}.animate-scale-in{animation:.2s scaleIn}.animate-pulse{animation:2s ease-in-out infinite pulse}.animate-bounce{animation:1s ease-in-out infinite bounce}.flex{display:flex}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.items-center{align-items:center}.items-start{align-items:flex-start}.items-end{align-items:flex-end}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.justify-end{justify-content:flex-end}.gap-1{gap:var(--space-1)}.gap-2{gap:var(--space-2)}.gap-3{gap:var(--space-3)}.gap-4{gap:var(--space-4)}.gap-5{gap:var(--space-5)}.gap-6{gap:var(--space-6)}.gap-8{gap:var(--space-8)}.flex-1{flex:1}.grid{display:grid}.grid-2{grid-template-columns:repeat(2,1fr)}.grid-3{grid-template-columns:repeat(3,1fr)}.grid-4{grid-template-columns:repeat(4,1fr)}.text-xs{font-size:var(--font-size-xs)}.text-sm{font-size:var(--font-size-sm)}.text-base{font-size:var(--font-size-base)}.text-lg{font-size:var(--font-size-lg)}.text-xl{font-size:var(--font-size-xl)}.text-2xl{font-size:var(--font-size-2xl)}.text-3xl{font-size:var(--font-size-3xl)}.text-4xl{font-size:var(--font-size-4xl)}.text-center{text-align:center}.text-right{text-align:right}.font-light{font-weight:300}.font-medium{font-weight:500}.font-semibold{font-weight:600}.font-bold{font-weight:700}.font-extrabold{font-weight:800}.text-primary{color:var(--primary)}.text-accent{color:var(--accent)}.text-success{color:var(--success)}.text-warning{color:var(--warning)}.text-danger{color:var(--danger)}.text-muted{color:var(--dark-400)}.text-light{color:var(--dark-300)}.m-0{margin:0}.mt-1{margin-top:var(--space-1)}.mt-2{margin-top:var(--space-2)}.mt-3{margin-top:var(--space-3)}.mt-4{margin-top:var(--space-4)}.mt-6{margin-top:var(--space-6)}.mt-8{margin-top:var(--space-8)}.mb-1{margin-bottom:var(--space-1)}.mb-2{margin-bottom:var(--space-2)}.mb-3{margin-bottom:var(--space-3)}.mb-4{margin-bottom:var(--space-4)}.mb-6{margin-bottom:var(--space-6)}.mb-8{margin-bottom:var(--space-8)}.p-2{padding:var(--space-2)}.p-3{padding:var(--space-3)}.p-4{padding:var(--space-4)}.p-6{padding:var(--space-6)}.p-8{padding:var(--space-8)}.hidden{display:none}.block{display:block}.inline{display:inline}.inline-block{display:inline-block}.relative{position:relative}.absolute{position:absolute}.fixed{position:fixed}.sticky{position:sticky}.w-full{width:100%}.w-auto{width:auto}.overflow-hidden{overflow:hidden}.overflow-auto{overflow:auto}.overflow-x-auto{overflow-x:auto}.cursor-pointer{cursor:pointer}.truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.line-clamp-2{-webkit-line-clamp:2;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.line-clamp-3{-webkit-line-clamp:3;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--dark-300);border-radius:3px}::-webkit-scrollbar-thumb:hover{background:var(--dark-400)}@media (max-width:768px){:root{--container-padding:1rem;--header-height:60px}.grid-2,.grid-3,.grid-4{grid-template-columns:repeat(2,1fr)}.hide-mobile{display:none!important}.modal{margin:var(--space-4);max-height:85vh}.toast-container{top:auto;bottom:var(--space-4);right:var(--space-4);left:var(--space-4)}.toast{width:100%;min-width:auto}}@media (max-width:480px){.grid-2,.grid-3,.grid-4{grid-template-columns:1fr}.hide-sm{display:none!important}}@media (min-width:769px){.hide-desktop{display:none!important}}::selection{background:var(--primary-200);color:var(--primary-900)}@keyframes routeBarPulse{0%,to{opacity:.4}50%{opacity:1}}.page-loader-overlay{z-index:99998;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);background:#ffffffb3;justify-content:center;align-items:center;animation:.2s fadeIn;display:flex;position:fixed;inset:0}.page-loader-spinner{flex-direction:column;align-items:center;gap:16px;display:flex}.loader-text{color:var(--dark-400);letter-spacing:.5px;font-size:13px;font-weight:600;animation:1.5s ease-in-out infinite loaderTextPulse}.loader-ring{width:48px;height:48px;position:relative}.loader-ring div{border:3px solid #0000;border-top-color:var(--primary);border-radius:50%;width:38px;height:38px;margin:5px;animation:1.2s cubic-bezier(.5,0,.5,1) infinite loaderRingSpin;position:absolute}.loader-ring div:first-child{border-top-color:var(--primary);animation-delay:-.45s}.loader-ring div:nth-child(2){border-top-color:var(--primary-light);animation-delay:-.3s}.loader-ring div:nth-child(3){border-top-color:var(--primary-200);animation-delay:-.15s}.loader-ring div:nth-child(4){border-top-color:var(--primary-100)}@keyframes loaderRingSpin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes loaderTextPulse{0%,to{opacity:.5}50%{opacity:1}}.skeleton{background:linear-gradient(90deg,var(--dark-50)0%,var(--dark-100)40%,var(--dark-50)60%,var(--dark-50)100%);background-size:300% 100%;animation:1.8s ease-in-out infinite skeletonShimmer}.skeleton-card{background:var(--white);box-shadow:var(--shadow-xs);border-radius:12px;overflow:hidden}@keyframes skeletonShimmer{0%{background-position:100% 0}to{background-position:-100% 0}}.btn-spinner{flex-shrink:0;animation:.8s linear infinite spin}.spinner{border:3px solid var(--dark-100);border-top-color:var(--primary);border-radius:50%;width:32px;height:32px;animation:.7s linear infinite spin}.spinner-sm{border-width:2px;width:18px;height:18px}.spinner-lg{border-width:4px;width:48px;height:48px}.btn-loading{pointer-events:none;opacity:.7;position:relative}.btn-loading:after{content:"";border:2px solid #ffffff4d;border-top-color:#fff;border-radius:50%;width:16px;height:16px;margin-top:-8px;animation:.7s linear infinite spin;position:absolute;top:50%;right:12px}.fade-in{animation:.4s fadeIn}.slide-up{animation:.4s slideUp}.font-urdu{font-family:Noto Nastaliq Urdu,Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif!important;line-height:2!important}.font-urdu h1,.font-urdu h2,.font-urdu h3,.font-urdu h4,.font-urdu h5,.font-urdu h6,.font-urdu .hero-title{font-weight:700;line-height:1.8}[dir=rtl] .header-logo{margin-left:auto;margin-right:0}[dir=rtl] .hero-buttons{flex-direction:row}[dir=rtl] .header-actions{margin-left:0;margin-right:auto}[dir=rtl] .header-search-icon{left:auto;right:14px}[dir=rtl] .header-search input{padding-left:100px;padding-right:42px}[dir=rtl] .header-search-btn{left:6px;right:auto}[dir=rtl] .chevron-right{transform:scaleX(-1)}[dir=rtl] .hero-inner{flex-direction:row-reverse}[dir=rtl] .feature-item{text-align:right}[dir=rtl] .feature-text{margin-left:0;margin-right:16px}[dir=rtl] .product-card-info{text-align:right}[dir=rtl] .header-cat-arrow{margin-left:0;margin-right:6px}[dir=rtl] .header-logo-text{direction:ltr}[dir=rtl] .header-badge{left:-6px;right:auto}