:root{--primary-color: #4B49AC;--primary-light: #98BDFF;--secondary-color: #7DA0FA;--active-color: #7978E9;--success-color: #28A745;--info-color: #7DA0FA;--warning-color: #FFC107;--danger-color: #F3797E;--sidebar-width: 250px;--sidebar-collapsed-width: 60px;--navbar-height: 60px;--bg-color: #F8F9FC}*{box-sizing:border-box}body{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;font-size:14px;color:#333;background-color:var(--bg-color)}.sidebar{position:absolute;top:var(--navbar-height);left:0;width:var(--sidebar-width);min-height:calc(100vh - var(--navbar-height));background-color:var(--primary-color);color:#ecf0f1;overflow-y:visible;transition:width .3s ease;z-index:1000}.sidebar.collapsed{width:var(--sidebar-collapsed-width)}.sidebar .nav-link{color:#ecf0f1;padding:12px 20px;display:flex;align-items:center;transition:background-color .2s}.sidebar .nav-link:hover,.sidebar .nav-link.active{background-color:var(--primary-light);color:#fff}.sidebar .nav-link i{width:20px;margin-right:10px;text-align:center}.sidebar.collapsed .nav-link span,.sidebar.collapsed .sidebar-section-header{display:none}.sidebar.collapsed .nav-item{margin-top:0!important}.main-content{margin-left:var(--sidebar-width);margin-top:var(--navbar-height);padding:20px;transition:margin-left .3s ease;min-height:calc(100vh - var(--navbar-height))}.main-content.expanded{margin-left:var(--sidebar-collapsed-width)}.navbar-custom{height:var(--navbar-height);background-color:var(--primary-color);border-bottom:1px solid var(--primary-light);position:fixed;top:0;left:0;right:0;z-index:1030}.card{border:none;box-shadow:0 2px 4px #0000001a;margin-bottom:20px}.pagination{margin-bottom:0}.pagination .page-link{color:var(--primary-color);border:1px solid #dee2e6;padding:.5rem .75rem;margin:0 2px;border-radius:6px;transition:all .2s ease}.pagination .page-link:hover{background-color:var(--primary-light);border-color:var(--primary-color);color:#fff}.pagination .page-item.active .page-link{background-color:var(--primary-color);border-color:var(--primary-color);color:#fff;font-weight:600}.pagination .page-item.disabled .page-link{color:#6c757d;pointer-events:none;background-color:#f8f9fa;border-color:#dee2e6}.pagination .page-link:focus{box-shadow:0 0 0 .2rem #4b49ac40;outline:none}.badge-draft{background-color:#6c757d}.badge-submitted{background-color:var(--secondary-color);color:#fff}.badge-approved{background-color:var(--success-color)}.badge-returned{background-color:var(--danger-color)}.btn{padding:8px 16px;font-size:14px}.btn-primary{background-color:var(--primary-color);border-color:var(--primary-color)}.btn-primary:hover{background-color:var(--primary-light);border-color:var(--primary-light)}.btn-secondary{background-color:var(--secondary-color);border-color:var(--secondary-color)}.btn-secondary:hover{background-color:var(--active-color);border-color:var(--active-color)}.btn-danger{background-color:var(--danger-color);border-color:var(--danger-color)}.btn-danger:hover{background-color:#f55f64;border-color:#f55f64}.table{background-color:#fff}.table thead th{background-color:var(--primary-color);color:#fff;border-bottom:2px solid var(--primary-light);font-weight:600}.table tbody tr:hover{background-color:#98bdff1a}.form-label{font-weight:500;margin-bottom:5px}.form-control:focus{border-color:var(--secondary-color);box-shadow:0 0 0 .2rem #7da0fa40}.form-control.is-invalid:focus{border-color:var(--danger-color);box-shadow:0 0 0 .2rem #f3797e40}a{color:var(--active-color);text-decoration:none}a:hover{color:var(--primary-color);text-decoration:underline}@media(max-width:768px){.sidebar{position:fixed;left:-100%;width:var(--sidebar-width);height:calc(100vh - var(--navbar-height));overflow-y:auto;z-index:1040;box-shadow:0 0 15px #0000004d}.sidebar.show{left:0}.main-content,.main-content.expanded{margin-left:0!important}.card{margin-bottom:15px}.table-responsive{border:0}}@media(max-width:576px){.navbar-custom{padding:.5rem!important}.navbar-brand{font-size:14px}.main-content{padding:10px}.card-body{padding:15px}.btn{padding:6px 12px;font-size:13px}h1,.h1{font-size:1.5rem}h2,.h2{font-size:1.3rem}h3,.h3{font-size:1.1rem}}.sidebar-overlay{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background-color:#00000080;z-index:1035}.sidebar-overlay.show{display:block}.workflow-container{display:flex;flex-direction:column;align-items:center;padding:20px 0}.workflow-step{position:relative;width:100%;max-width:500px;margin:10px 0;animation:fadeInUp .5s ease-out;animation-fill-mode:both}.workflow-step[data-step="1"]{animation-delay:.1s}.workflow-step[data-step="2"]{animation-delay:.2s}.workflow-step[data-step="3"]{animation-delay:.3s}.workflow-step[data-step="4"]{animation-delay:.4s}.workflow-step[data-step="5"]{animation-delay:.5s}.workflow-step[data-step="6"]{animation-delay:.6s}.workflow-step[data-step="7"]{animation-delay:.7s}.workflow-step[data-step="8"]{animation-delay:.8s}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.workflow-step .step-number{position:absolute;left:-40px;top:50%;transform:translateY(-50%);width:30px;height:30px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:14px;box-shadow:0 2px 5px #0000001a}.workflow-step .step-content{background:#fff;border:2px solid #e9ecef;border-radius:12px;padding:20px;box-shadow:0 2px 8px #00000014;transition:all .3s ease;display:flex;align-items:center;gap:15px}.workflow-step .step-content:hover{transform:translateY(-3px);box-shadow:0 4px 15px #0000001f;border-color:var(--primary-color)}.workflow-step .step-icon{width:60px;height:60px;border-radius:12px;display:flex;align-items:center;justify-content:center;color:#fff;font-size:24px;flex-shrink:0}.workflow-step .step-title{margin:0 0 5px;color:#2c3e50;font-weight:600;font-size:16px}.workflow-step .step-description{margin:0 0 10px;color:#6c757d;font-size:13px;line-height:1.4}.workflow-arrow{color:#adb5bd;font-size:24px;margin:5px 0;animation:bounce 2s infinite}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-5px)}}.workflow-complete .step-content{background:linear-gradient(135deg,#84fab0,#8fd3f4);border:none;text-align:center;display:block}.workflow-complete .step-icon{margin:0 auto 10px;background:#fff!important;color:var(--success-color)}.workflow-complete .step-title,.workflow-complete .step-description{color:#fff}.workflow-complete .step-title{font-size:20px;font-weight:700}.btn-purple{background-color:#6f42c1;border-color:#6f42c1;color:#fff}.btn-purple:hover{background-color:#5a32a3;border-color:#5a32a3;color:#fff}.btn-orange{background-color:#fd7e14;border-color:#fd7e14;color:#fff}.btn-orange:hover{background-color:#e8590c;border-color:#e8590c;color:#fff}.bg-purple{background-color:#6f42c1!important}.bg-orange{background-color:#fd7e14!important}.bg-gradient-primary{background:linear-gradient(135deg,var(--primary-color) 0%,var(--secondary-color) 100%)}@media(max-width:768px){.workflow-step{max-width:100%}.workflow-step .step-number{left:-35px;width:25px;height:25px;font-size:12px}.workflow-step .step-content{flex-direction:column;text-align:center;padding:15px}.workflow-step .step-icon{width:50px;height:50px;font-size:20px}.workflow-step .step-title{font-size:14px}.workflow-step .step-description{font-size:12px}}.btn-check:checked+.btn-outline-primary{background-color:var(--primary-color);border-color:var(--primary-color)}input:disabled{background-color:#f8f9fa;cursor:not-allowed}.reassign-workflow{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;padding:20px 0}.reassign-step{flex:1;min-width:200px;display:flex;flex-direction:column;align-items:center;text-align:center;padding:15px;animation:fadeInUp .5s ease-out}.reassign-step .step-icon{width:70px;height:70px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-size:28px;margin-bottom:15px;box-shadow:0 4px 10px #00000026}.reassign-step .step-content h6{font-weight:700;margin-bottom:8px;color:#2c3e50}.reassign-step .step-content p{color:#6c757d;font-size:14px;margin-bottom:8px}.workflow-arrow-right{color:#adb5bd;font-size:28px;padding:0 10px}@media(max-width:992px){.reassign-workflow{flex-direction:column}.workflow-arrow-right{transform:rotate(90deg);margin:10px 0}}@media print{.sidebar,.navbar-custom,.no-print{display:none!important}.main-content{margin-left:0!important;margin-top:0!important}}
