:root{--primary-color: #007bff;--secondary-color: #6c757d;--success-color: #28a745;--danger-color: #dc3545;--warning-color: #ffc107;--info-color: #17a2b8;--light-color: #f8f9fa;--dark-color: #343a40;--text-color: #363434;--font-family: "Poppins", sans-serif;--font-size-base: 1rem;--bg-header: #f8f9fa;--bg-header-secondary: #e9ecef;--bg-header-tertiary: #e9ecef}*{padding:0;margin:0;box-sizing:border-box}body{font-family:Trebuchet MS,Lucida Sans Unicode,Lucida Grande,Lucida Sans,Arial,sans-serif;background-color:#b9bcbc}header,footer{background-color:var(--bg-header);display:flex;align-items:center}header{position:sticky;min-height:50px;top:0;z-index:99;padding:0 .5rem}footer{display:flex;position:fixed;bottom:0;width:100%;justify-content:space-between;padding:.5rem;margin:0;font-size:.6rem;border-top:1px solid rgba(0,0,0,.2)}header h1{font-size:1rem;color:var(--text-color);padding:.5rem}.active{background:#e3e3ea}.main{display:flex;height:100%;gap:.5rem}.main aside{background-color:var(--bg-header);box-shadow:0 0 10px #0000001a;height:92dvh}.main aside ul{list-style:none;padding:0;margin:0;width:200px}.main aside ul a{color:var(--text-color);text-decoration:none}.main aside ul li{display:flex;align-items:center;gap:.5rem;padding:.6rem .5rem;transition:all .3s ease}.main aside ul li:hover{background:#e3e3ea}.main .container{flex:1;background-color:#fff;box-shadow:0 0 10px #0000001a;overflow:auto;height:88dvh;margin-top:.5rem}.main .container .header,.main .container .sub-header{display:flex;position:sticky;top:0;z-index:99;justify-content:space-between;align-items:center;padding:.5rem;background:var(--bg-header-secondary);width:100%}.main .container .header h2,.main .container .sub-header h2{font-size:1rem;color:var(--text-color)}.main .container .header .actions,.main .container .sub-header .actions{display:flex;gap:.3rem}.main .container .sub-header{background-color:var(--bg-header-secondary)}.main .container .content table,.main .container .content form{margin:1rem .5rem;width:-webkit-fill-available}button{background:var(--primary-color);margin:0 auto;padding:.3rem .6rem;border:none;border-radius:4px;color:#fff;cursor:pointer;box-shadow:1px 1px 3px #0003;transition:all .5s ease}button:hover{box-shadow:1px 2px 8px #00000080}.table{overflow:auto}.table table{width:100%;border-collapse:collapse}.table th,.table td{font-size:.9rem;border-bottom:2px solid #f5f3f3}.table th{background-color:var(--bg-header-tertiary);text-align:left;padding:.3rem .5rem;border:none;z-index:98}.table td{font-size:.75rem;padding:.2rem}.table .actions{display:flex;gap:.8rem}.table .actions span{cursor:pointer;font-size:1rem}.form{padding:.5rem 0;text-align:left}.form-row{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:1rem;margin-bottom:1rem}.form-group{margin-bottom:.5rem}.form-group label{font-size:.75rem;font-weight:500;color:var(--text-color);margin-bottom:2px}.form-group .form-label{display:block}.form-group input,.form-group select,.form-group textarea{padding:.2rem 0;width:100%;border:none;border-bottom:2px solid #667eea;color:var(--text-color);font-size:.75rem;outline:none;transition:all .3s ease}.form-group input:focus,.form-group select:focus,.form-group textarea:focus{outline:none;border-color:#667eea}.form-group input:disabled,.form-group select:disabled,.form-group textarea:disabled{filter:grayscale(100%);background-color:#ebebeb;cursor:not-allowed}.form-group input[type=checkbox]{width:auto;margin-left:10px;display:inline-block}.form-actions{display:flex;gap:.5rem;justify-content:flex-end}.form-group .feature-item{display:flex}.form-group .feature-item input{margin-bottom:5px;margin-right:5px}.validation-error{color:#dc3545;font-size:12px;margin-top:5px}input.ng-invalid.ng-touched,select.ng-invalid.ng-touched,textarea.ng-invalid.ng-touched{border-color:#dc3545}.modal-overlay{position:fixed;inset:0;margin:auto;padding:1rem;width:100%;height:100%;background:rgba(0,0,0,.9);transition:all .3s ease;overflow:auto;z-index:100}.modal{background:white;max-width:780px;margin:1rem auto;transition:transform .3s ease;box-shadow:0 20px 40px #0003;overflow:hidden;z-index:99}.modal-header{display:flex;justify-content:space-between;align-items:center;background:var(--bg-header);padding:.3rem .5rem;color:var(--text-color);font-weight:700}.modal-body{color:var(--text-color);padding:10px}.modal-footer{color:var(--text-color);display:flex;justify-content:right}.modal-icon{font-size:1rem;margin-bottom:.5rem}.modal-icon.success{color:#28a745}.modal-icon.error{color:#dc3545}.modal-icon.warning{color:#ffc107}.modal-icon.info{color:#17a2b8}.modal h3{margin-bottom:1rem;color:#333}.modal p{margin-bottom:1rem;color:#666;line-height:1.5}.modal-buttons{display:flex;gap:1rem;justify-content:center}.modal-btn{padding:.75rem 1.5rem;border:none;border-radius:25px;cursor:pointer;font-weight:600;transition:all .3s ease;min-width:100px}.modal-btn.primary{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}.modal-btn.primary:hover{transform:translateY(-2px);box-shadow:0 5px 15px #667eea66}.modal-btn.secondary{background:#f8f9fa;color:#333;border:2px solid #e9ecef}.modal-btn.secondary:hover{background:#e9ecef}.btn-close{height:20px;width:20px;box-shadow:-1px 1px 5px #aaa;border-radius:50%;color:red;font-size:.5rem;background:#fff;display:flex;justify-content:center;align-items:center;border:none;cursor:pointer}.stats{display:flex;margin:1rem .5rem;gap:1rem}.stats .card{flex:1;padding:.5rem;font-size:.8rem;background:rgb(235,234,231)}.stats .card:nth-child(odd){border-left:5px solid #ff9500;background-color:#ff950020}.stats .card:nth-child(even){border-left:5px solid #026cde;background-color:#026cde20}.stats .card p{margin-bottom:.4rem}@media (max-width: 480px){header{margin:0}.main{display:block}aside{margin:10px 0;overflow:auto;height:fit-content!important}aside ul{display:inline-flex;align-items:center;gap:.3rem;border:none}aside ul li{border:none!important}.container{margin:.5rem 1rem}}.alert-box{position:absolute;top:.5rem;right:.5rem;padding:.5rem 2rem .5rem .5rem;z-index:9999}.alert-box .alert-btn{position:absolute;top:5px;right:5px}.error,.success,.info{word-wrap:break-word;min-width:min-content;max-width:380px;border-radius:.5rem;font-size:.8rem;height:fit-content}.success{background-color:#43aa8b;color:#fff}.error{background:#f95738;color:#fff}.info{background:#f9844a;color:#fff}
