.login-card{animation:slideIn 1.5s ease-out;background-color:#fff;border-radius:15px;box-shadow:0 6px 15px #00000026;flex-direction:column;max-width:380px;padding:40px;text-align:center;width:100%}.login-card,.logo-container{align-items:center;display:flex}.logo-container{background-color:#2a1b8a;border-radius:50%;color:#fff;font-size:36px;font-weight:700;height:100px;justify-content:center;letter-spacing:1px;margin-bottom:20px;width:100px}.login-title{color:#333;font-size:30px;font-weight:700;margin-bottom:25px;text-transform:uppercase}.form-group{margin-bottom:18px}.form-group label{font-size:15px;margin-bottom:6px}.login-input{border:1px solid #ccc;border-radius:8px;font-size:15px;padding:14px;transition:border-color .3s ease;width:100%}.login-input:focus{border-color:#2a1b8a;box-shadow:0 0 8px #2a1b8a33;outline:none}.login-button{background:linear-gradient(135deg,#2a1b8a,#357ab8);border:none;border-radius:8px;color:#fff;cursor:pointer;font-size:17px;padding:10px;transition:background-color .3s ease,transform .3s ease;width:80%}.login-button:hover{background-color:#416fa9;transform:translateY(-2px)}.login-button:active{background-color:#1f1f7a;transform:translateY(0)}.login-message{color:#d9534f;font-size:15px;font-weight:700;margin-top:20px}@keyframes slideIn{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}@media (max-width:600px){.login-card{padding:25px}.login-title{font-size:26px}.login-button,.login-input{padding:12px}.logo-container{font-size:28px;height:80px;width:80px}}.home-page{align-items:center;background:linear-gradient(135deg,#fff,#fff);display:flex;flex-direction:column;height:100vh;height:80vh;justify-content:center}.App:not(.sidebar-collapsed) .home-page{padding-left:250px}.home-title{color:#000;font-size:78px;font-weight:700;letter-spacing:1px;margin-bottom:20px;text-align:center;text-shadow:2px 2px 4px #00000080}.home-title-image{animation:fadeIn 2s ease-in-out;height:auto;margin-bottom:10px;max-width:200%}.home-description{color:#47434e;font-size:20px;line-height:1.6;margin-bottom:30px;margin-left:-30%;text-align:center;width:100%}.cta-button{background:linear-gradient(135deg,#2a1b8a,#357ab8);border:none;border-radius:8px;box-shadow:0 5px 10px #00000026;color:#fff;cursor:pointer;font-size:18px;padding:8px 50px;text-align:center;transition:background-color .3s ease,box-shadow .3s ease,transform .3s ease}.cta-button:hover{background-color:#ff1a66;box-shadow:0 7px 15px #0003;transform:translateY(-3px)}.cta-button:active{background-color:#e6005c;transform:translateY(0)}@media (max-width:768px){.home-page{padding-left:20px}.home-title{font-size:36px}.home-description{font-size:18px}.cta-button{padding:12px 0;width:100%}}.user-management-container{align-items:center;animation:fadeIn 1s ease-in-out;background-color:#f4f5fa;display:flex;flex-direction:column;min-height:100vh;min-width:600px;padding:20px;transition:padding-left .4s ease}h1,h2,h3{color:#2a1b8a;font-weight:700;margin-bottom:20px;text-align:center}.password-form,.user-form{background-color:#fff;border-radius:8px;box-shadow:0 4px 12px #0000001a;margin-bottom:25px;max-width:500px;padding:20px;width:100%}label{color:#444;display:block;font-weight:700;margin-bottom:5px}.input-field{border:1px solid #ccc;border-radius:6px;box-sizing:border-box;padding:12px;transition:border-color .3s;width:100%}.input-field:focus{border-color:#2a1b8a;box-shadow:0 0 5px #2a1b8a33;outline:none}.btn{border:none;border-radius:6px;cursor:pointer;font-size:14px;font-weight:700;padding:10px 20px;transition:background-color .3s,transform .2s}.create-btn{background:linear-gradient(135deg,#2a1b8a,#357ab8);color:#fff}.update-btn{background-color:#ffc107;color:#fff}.delete-btn{background-color:#f44336;color:#fff}.btn:hover{opacity:.85;transform:translateY(-1px)}.user-list{list-style-type:none;margin-top:20px;max-width:600px;padding:0;width:100%}.user-list-item{align-items:center;background-color:#fff;border:1px solid #ddd;border-radius:8px;display:flex;justify-content:space-between;margin-bottom:12px;padding:15px;transition:box-shadow .3s ease}.user-list-item:hover{box-shadow:0 4px 10px #00000026}.user-actions{display:flex;gap:10px}.message{color:#d9534f;font-size:16px;font-weight:700;margin-top:20px;text-align:center}.registration-container{align-items:center;display:flex;height:90vh;justify-content:center;min-width:80%}.registration-card{animation:fadeIn 1s ease-in-out;background-color:#fff;border-radius:12px;box-shadow:0 4px 10px #0000001a;max-width:400px;min-width:600px;padding:40px;text-align:center;width:100%}.registration-title{color:#333;font-size:24px;margin-bottom:20px}.registration-input{border:1px solid #ccc;border-radius:4px;font-size:14px;padding:10px;width:100%}.registration-button{background:linear-gradient(135deg,#2a1b8a,#357ab8);border:none;border-radius:4px;color:#fff;cursor:pointer;font-size:16px;padding:10px;transition:background-color .3s ease;width:20%}.registration-button:hover{background-color:#357ab8}.registration-message{color:green;font-size:14px;margin-top:15px}.department-container{align-items:center;animation:fadeIn 1s ease-in-out;background-color:#f1f3f8;display:flex;flex-direction:column;min-height:100vh;padding:20px}.department-card{animation:fadeIn 1s ease-in-out;background-color:#fff;border-radius:12px;box-shadow:0 4px 10px #0000001a;max-width:600px;min-width:600px;padding:40px;text-align:center;width:100%}.department-title{color:#333;font-size:28px;font-weight:700;margin-bottom:20px}.department-input{border:1px solid #ccc;border-radius:4px;font-size:14px;padding:12px;transition:border-color .3s ease;width:100%}.department-input:focus{border-color:#2a1b8a;outline:none}.department-button{background:linear-gradient(135deg,#2a1b8a,#357ab8);border:none;border-radius:4px;color:#fff;cursor:pointer;font-size:16px;margin-top:10px;padding:12px;transition:background-color .3s ease,transform .3s ease;width:25%}.department-button:hover{background-color:#357ab8;transform:translateY(-2px)}.department-button:active{background:linear-gradient(135deg,#2a1b8a,#357ab8);transform:translateY(0)}.department-message{color:green;font-size:14px;margin-top:15px}.department-list-title{color:#333;font-size:24px;font-weight:700;margin-top:20px}.department-table{background-color:#fff;border-collapse:collapse;border-radius:8px;box-shadow:0 4px 10px #0000001a;margin-top:20px;max-width:600px;overflow:hidden;width:100%}.department-table td,.department-table th{border-bottom:1px solid #ddd;font-size:15px;padding:14px;text-align:center}.department-table th{background-color:#4b4b72;color:#fff;font-weight:700}.department-table tr:nth-child(2n){background-color:#f7f7f7}.department-table tr:hover{background-color:#ddd}@media (max-width:768px){.department-card{padding:20px}.department-title{font-size:24px}.department-button,.department-input{padding:10px}.department-list-title{font-size:20px}.department-table td,.department-table th{font-size:13px;padding:10px}}.components-container{align-items:center;display:flex;height:100vh;justify-content:center;min-width:80%}.components-card{animation:fadeIn 1s ease-in-out;background-color:#fff;border-radius:12px;box-shadow:0 4px 10px #0000001a;max-width:600px;min-width:600px;padding:40px;text-align:center;width:100%}.components-title{color:#333;font-size:28px;font-weight:700;margin-bottom:20px}.components-input{border:1px solid #ccc;border-radius:4px;font-size:14px;padding:10px;width:100%}.components-button{background:linear-gradient(135deg,#2a1b8a,#357ab8);border:none;border-radius:4px;color:#fff;cursor:pointer;font-size:16px;padding:10px;transition:background-color .3s ease;width:25%}.components-button:hover{background-color:#357ab8}.components-message{color:green;font-size:14px;margin-top:15px}.components-list-title{color:#333;font-size:20px;margin-top:20px}.components-list{border:1px solid #ccc;border-radius:5px;list-style-type:decimal;margin:0;overflow:hidden;padding:0}.components-list li{border-bottom:1px solid #ccc;padding:10px}.components-list li:last-child{border-bottom:none}#root{overflow-x:hidden}h1{color:#4a4a4a;font-size:2.5rem}.design-number-input,h1{margin-bottom:1.5rem;text-align:center}.design-number-input{display:flex;flex-direction:column;margin-left:40%;width:20%}.design-number-input label{color:#555;font-weight:500;margin-bottom:.5rem}.design-number-input input{border:1px solid #ccc;border-radius:4px;padding:.75rem;transition:border-color .3s}.design-number-input input:focus{border-color:#666;outline:none}.table-container{border-radius:8px;box-shadow:0 2px 10px rgba(0,0,0,.341);margin-bottom:2rem;margin-left:30px;margin-right:50px;max-width:100%;overflow-x:auto}.table-container,table{border-collapse:collapse}table{border-spacing:0;width:100%}td,th{border-bottom:1px solid #ddd;padding:1rem;text-align:center}th{background-color:#657895;color:#fff;font-weight:700}td input{border:1px solid #ccc;border-radius:4px;padding:.7rem;transition:border-color .3s;width:80px}td input:focus{border-color:#007bff;outline:none}.create-button{background:linear-gradient(135deg,#2a1b8a,#357ab8);border:none;border-radius:4px;color:#fff;cursor:pointer;margin-left:50%;padding:1rem 2.5rem;transition:background-color .3s,transform .2s}.create-button:hover{background-color:#357ab8;transform:scale(1.02)}.design-message{background-color:#e2e6ea;border:1px solid #ccc;border-radius:4px;margin-top:1rem;padding:1rem;text-align:center}@media (max-width:768px){#root{padding:1rem}h1{font-size:2rem}.design-number-input{max-width:100%}table{font-size:.9rem}td input{padding:.5rem}.create-button{width:100%}}.production-container{align-items:center;display:flex;flex-direction:column;min-height:100vh;min-width:80%;padding:20px}.production-card{animation:fadeIn 1s ease-in-out;background-color:#fff;border-radius:12px;box-shadow:0 4px 10px #0000001a;margin-bottom:20px;max-width:600px;min-width:600px;padding:40px;text-align:center;width:100%}.production-title{color:#333;font-size:24px;margin-bottom:20px}.production-input{border:1px solid #ccc;border-radius:4px;font-size:14px;margin-bottom:10px;padding:10px;width:100%}.production-button{background:linear-gradient(135deg,#2a1b8a,#357ab8);border:none;border-radius:4px;color:#fff;cursor:pointer;font-size:16px;padding:10px;transition:background-color .3s ease;width:25%}.production-button:hover{background-color:#357ab8}.production-message{color:green;font-size:14px;margin-top:15px}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}input[type=number]{-webkit-appearance:textfield;appearance:textfield;-moz-appearance:textfield}.form-group{margin-bottom:20px}.form-group select{border:1px solid #ccc;border-radius:4px;box-sizing:border-box;font-size:14px;padding:10px;width:100%}.form-group select:focus{border-color:#4b4b72;outline:none}.create-button{margin-top:20px}.employee-section{margin-bottom:40px}.employee-title{color:#333;font-size:24px;font-weight:600;margin-bottom:15px;text-align:left}.report-container{animation:fadeIn 1s ease-in-out;font-family:Roboto,sans-serif}.report-title{font-size:32px;letter-spacing:1px}.report-input{padding:12px;transition:border-color .3s ease}.report-input:focus{border-color:#2a1b8a;outline:none}.report-button{background:linear-gradient(135deg,#2a1b8a,#357ab8);margin-top:10px;padding:12px;transition:background-color .3s ease,transform .3s ease;width:25%}.report-button:hover{background-color:#357ab8;transform:translateY(-3px)}.report-button:active{background-color:#1f1f7a;transform:translateY(0)}.report-table{margin-top:20px}.report-table td,.report-table th{padding:14px}.subtotal-row{background-color:#e0e0e0;font-weight:700}.subtotal-label{padding-right:10px;text-align:right}.subtotal-amount{text-align:center}.total-amount{color:#333}@keyframes fadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@media (max-width:768px){.report-form{padding:15px}.report-title{font-size:28px}.report-button,.report-input{padding:10px}}.production-cost-report-page{align-items:center;background-color:#f1f3f8;flex-direction:column;font-family:Arial,sans-serif;margin-left:50px;min-width:300px;padding:20px;text-align:center}.production-cost-report-title{border-bottom:3px solid #4b4b72;color:#333;font-size:28px;font-weight:700;margin-bottom:25px;padding-bottom:10px;text-align:center}.production-cost-message{color:red;font-size:16px;margin-bottom:20px}.form-group1{margin-bottom:15px;margin-left:35%;text-align:center;width:30%}.production-cost-input{border:1px solid #ccc;border-radius:4px;box-sizing:border-box;font-size:14px;padding:10px;width:100%}.production-cost-button{background:linear-gradient(135deg,#2a1b8a,#357ab8);border:none;border-radius:4px;color:#fff;cursor:pointer;font-size:16px;padding:10px 20px;transition:background-color .3s}.production-cost-button:hover{background-color:#0056b3}.production-cost-table{line-height:25px}.production-cost-table,.production-cost-table-summary{background-color:#fff;border-collapse:collapse;border-radius:8px;box-shadow:0 4px 10px #0000001a;margin-top:30px;max-width:1000px;overflow:hidden;width:100%}.production-cost-table-summary{font-size:15px;line-height:10px}.production-cost-table td,.production-cost-table th{border-bottom:1px solid #ddd;font-size:15px;padding:8px;text-align:center}.production-cost-table th{background-color:#4b4b72;color:#fff;font-weight:700}.production-cost-table tr:nth-child(2n){background-color:#f7f7f7}.production-cost-table tr:hover{background-color:#ddd}.production-cost-report-page h2{color:#333;font-size:24px;margin-bottom:20px}.production-cost-report-page h3{color:#333;font-size:20px;margin-bottom:20px}.quantity-difference-report-page{align-items:center;background-color:#f9f9f9;display:flex;flex-direction:column;min-height:100vh;padding:20px}.quantity-difference-report-page h2{color:#333;font-size:24px;margin-bottom:20px}.form-group{max-width:400px}.quantity-difference-input{border:1px solid #ccc;border-radius:4px;font-size:14px;margin-bottom:10px;padding:10px;width:100%}.quantity-difference-button{background:linear-gradient(135deg,#2a1b8a,#357ab8);border:none;border-radius:4px;color:#fff;cursor:pointer;font-size:16px;padding:10px 20px;transition:background-color .3s ease}.quantity-difference-button:hover{background-color:#357ab8}.quantity-difference-message{color:red;font-size:14px;margin-top:15px}.quantity-difference-table{background-color:#fff;border-collapse:collapse;border-radius:8px;box-shadow:0 2px 5px #0000001a;margin-top:20px;max-width:800px;overflow:hidden;width:100%}.quantity-difference-table td,.quantity-difference-table th{border-bottom:1px solid #ddd;padding:10px;text-align:left}.quantity-difference-table th{background-color:#f2f2f2}.quantity-difference-table tr:hover{background-color:#f5f5f5}.quantity-difference-result{background-color:#fff;border-radius:8px;box-shadow:0 2px 5px #0000001a;color:#333;font-size:18px;margin-top:20px;padding:20px;text-align:center}.sidebar{background:linear-gradient(125deg,#0e063c,#12858954);border-bottom-right-radius:12px;border-top-right-radius:12px;box-shadow:3px 0 10px #00000080;color:#e0e0e0;height:100vh;left:0;overflow-x:hidden;top:0;transition:width .3s ease-in-out;width:260px}.sidebar-content{position:relative;z-index:1}.sidebar-header{align-items:center;border-top-right-radius:12px;display:flex;justify-content:space-between;padding:20px}.sidebar-logo{color:#fff;font-size:22px;font-weight:700;white-space:nowrap}.collapse-btn{background:none;border:none;color:#fff;cursor:pointer;font-size:18px;transition:transform .2s ease,color .3s ease}.collapse-btn:hover{color:#b3b3b3;transform:rotate(90deg)}.sidebar.collapsed{width:80px}.sidebar-menu{list-style:none;padding:15px 0}.nav-item{width:100%}.sidebar-link{align-items:center;border-radius:8px;color:#b3b3b3;display:flex;padding:14px 20px;text-decoration:none;transition:background .3s ease,padding-left .3s ease,color .3s ease}.sidebar-link.active,.sidebar-link:hover{background:#353545;box-shadow:inset 4px 0 0 #00b4d8;color:#fff;padding-left:25px}.sidebar-icon{font-size:20px;margin-right:12px;transition:transform .3s ease,color .3s ease}.sidebar-link.active .sidebar-icon,.sidebar-link:hover .sidebar-icon{color:#00b4d8;transform:scale(1.1)}.sidebar-text{flex:1 1;overflow:hidden;text-overflow:ellipsis;transition:opacity .3s ease;white-space:nowrap}.sidebar.collapsed .sidebar-text{opacity:0}.sidebar-submenu{border-left:2px solid #ffffff1a;list-style:none;margin:5px 0 0 20px;padding:0}.sidebar-submenu .sidebar-link{color:#a1a1a1;font-size:15px;padding:10px 20px}.sidebar-submenu .sidebar-link:hover{background:#2a2a3d;color:#e0e0e0}.sidebar-footer{border-top:1px solid #dee2e6;color:#898d99;padding:40px}.logout-btn{background:none;border:none;color:#b3b3b3;cursor:pointer;padding:14px 0;text-align:left;transition:background-color .3s ease,color .3s ease;width:100%}.logout-btn:hover{background-color:#353545;color:#fff}.permissions-container{align-items:center;display:flex;flex-direction:column;margin:0 auto;max-width:800px;padding:20px}.permissions-title{color:#4b4b72;margin-bottom:20px;text-align:center}.permissions-message{color:red;margin-bottom:20px;text-align:center}.permissions-table-container{overflow-x:auto;width:100%}.permissions-table{border-collapse:collapse;margin-bottom:20px;width:100%}.permissions-table td,.permissions-table th{border:1px solid #ddd;padding:10px;text-align:left}.permissions-table th{background-color:#4b4b72;color:#fff;font-weight:700}.permissions-table tr:nth-child(2n){background-color:#f7f7f7}.permissions-table tr:hover{background-color:#ddd}.permissions-button{background:linear-gradient(135deg,#2a1b8a,#357ab8);border:none;border-radius:4px;color:#fff;cursor:pointer;font-size:14px;padding:10px 20px;transition:background-color .3s ease,transform .3s ease}.permissions-button:hover{background-color:#1a1a6a;transform:scale(1.05)}.printable-report{font-family:Arial,sans-serif;padding:20px}.design-section{margin-bottom:40px}.design-title{color:#333;font-size:24px;font-weight:600;margin-bottom:15px;text-align:left}.report-table td,.report-table th{padding:15px}.total-amount{text-align:right}.report-container{align-items:center;background-color:#f1f3f8;display:flex;flex-direction:column;font-family:Arial,sans-serif;min-width:300px;padding:20px}.report-title{border-bottom:3px solid #4b4b72;color:#333;font-size:28px;font-weight:700;margin-bottom:25px;padding-bottom:10px;text-align:center}.report-message{color:red;font-size:16px;margin-bottom:20px}.report-form{align-items:center;background-color:#fff;border-radius:12px;box-shadow:0 4px 10px #0000001a;display:flex;flex-direction:column;margin-bottom:20px;max-width:600px;padding:20px;width:100%}.form-group{margin-bottom:15px;text-align:left;width:100%}.form-group label{color:#333;display:block;font-size:14px;font-weight:700;margin-bottom:5px}.report-input{border:1px solid #ccc;border-radius:4px;box-sizing:border-box;font-size:14px;padding:10px;width:100%}.report-button{background-color:#007bff;border:none;border-radius:4px;color:#fff;cursor:pointer;font-size:16px;padding:10px 20px;transition:background-color .3s}.report-button:hover{background-color:#0056b3}.report-table{background-color:#fff;border-collapse:collapse;border-radius:8px;box-shadow:0 4px 10px #0000001a;max-width:1000px;overflow:hidden;width:100%}.report-table td,.report-table th{border-bottom:1px solid #ddd;font-size:15px;padding:8px;text-align:center}.report-table th{background-color:#4b4b72;color:#fff;font-weight:700}.report-table tr:nth-child(2n){background-color:#f7f7f7}.report-table tr:hover{background-color:#ddd}.total-amount{font-size:18px;font-weight:700;margin-top:20px}.App,.sidebar{display:flex}.sidebar{background-color:#2c3e50;box-shadow:2px 0 5px #0000001a;color:#ecf0f1;flex-direction:column;height:100%;justify-content:space-between;padding:20px;position:fixed;width:250px}.sidebar-header{margin-bottom:20px;text-align:center}.sidebar-header h2{color:#ecf0f1;font-size:24px;margin:0}.sidebar-menu{flex-grow:1;list-style-type:none;padding:0}.sidebar-menu li{margin:15px 0}.sidebar-menu li a,.sidebar-menu li button{align-items:center;background:none;border:none;border-radius:4px;color:#ecf0f1;cursor:pointer;display:flex;font-size:18px;padding:10px;text-align:left;text-decoration:none;transition:background .3s,color .3s;width:100%}.sidebar-menu li a:hover,.sidebar-menu li button:hover{background-color:#34495e;color:#ecf0f1}.sidebar-icon{margin-right:10px}.sidebar-footer{border-top:1px solid #34495e;color:#bdc3c7;font-size:16px;padding-top:20px;text-align:center}.content{margin-left:250px;padding:20px;width:calc(100% - 250px)}