*{margin:0;padding:0;box-sizing:border-box}:root{--zoom-factor: 1}html,body,#root{height:100%}body{background-color:#f8fafc;color:#334155;overflow-x:hidden;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif}.auth-container{display:grid;grid-template-columns:40% 60%;min-height:100vh;background-color:#fff}.auth-container .login-section{display:flex;flex-direction:column;justify-content:center;padding:40px;background-color:#fff}.auth-container .logo{display:flex;align-items:center;gap:8px;font-size:1.2rem;font-weight:700;margin-bottom:40px}.auth-container .logo-icon{display:flex;align-items:center;justify-content:center;width:60px;height:30px;background-color:#007bff;color:#fff;border-radius:4px;font-size:1rem}.auth-container .tabs{display:flex;justify-content:center;gap:20px;margin-bottom:20px}.auth-container .tab{font-weight:700;cursor:pointer;padding-bottom:5px;border-bottom:2px solid transparent;transition:.3s}.auth-container .tab.active{border-color:#007bff;color:#007bff}.auth-container .login-form,.auth-container .register-form{max-width:320px;width:100%;margin:0 auto;display:none}.auth-container .login-form.active,.auth-container .register-form.active{display:block}.auth-container h1{font-size:1.75rem;margin-bottom:10px;text-align:center;color:#000}.auth-container p.description{font-size:.9rem;color:#777;text-align:center;margin-bottom:20px}.auth-container .form-group{margin-bottom:15px;position:relative}.auth-container .form-group label{display:block;margin-bottom:5px;font-size:.9rem;color:#000}.auth-container .form-group input{width:100%;padding:8px 35px 8px 10px;border:1px solid #ccc;border-radius:4px;font-size:1rem;color:#000;background:#fff}.auth-container .toggle-password{position:absolute;right:10px;top:35px;cursor:pointer;background:none;border:none}.auth-container .toggle-password svg{width:20px;height:20px;fill:#777}.auth-container .forgot-password{font-size:.8rem;color:#007bff;text-decoration:none;float:right;margin-top:5px}.auth-container .forgot-password:hover{text-decoration:underline}.auth-container .btn{width:100%;padding:10px;background-color:#000;color:#fff;border:none;font-weight:700;cursor:pointer;border-radius:4px;margin-top:10px;transition:background-color .3s,transform .3s}.auth-container .btn:hover{background-color:#333;transform:translateY(-2px)}.auth-container .hero-section{position:relative;display:flex;align-items:center;justify-content:flex-start;padding:0 5vw;overflow:hidden;background-color:#fff}.auth-container .hero-section:before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;z-index:1;background:linear-gradient(90deg,rgba(0,0,0,.1) 1px,transparent 1px) 0 0 / 40px 40px,linear-gradient(rgba(0,0,0,.1) 1px,transparent 1px) 0 0 / 40px 40px;-webkit-mask-image:linear-gradient(to bottom,rgba(0,0,0,1) 30%,rgba(0,0,0,0) 100%);mask-image:linear-gradient(to bottom,#000 30%,#0000);pointer-events:none}.auth-container .hero-content{position:relative;z-index:2;max-width:80%;margin:0;text-align:left}.auth-container .hero-title{font-size:calc(3vw + 12px);font-weight:700;line-height:1.1;text-transform:uppercase;margin:0;text-align:left;color:#000}.auth-container .re-part{color:#007bff;font-weight:700;text-transform:uppercase}.auth-container .dot-part{color:#000}.auth-container .hub-part{color:#007bff;text-transform:lowercase}.auth-container .hero-description-container{margin-top:40px;max-width:600px;text-align:left}.auth-container .hero-description{font-size:16px;line-height:1.3;font-weight:400;color:#000}@media (max-width: 768px){.auth-container{grid-template-columns:1fr}.auth-container .hero-section{min-height:50vh;padding:40px 20px}.auth-container .hero-title{font-size:calc(5vw + 8px)}}@media (max-width: 770px){.auth-container .hero-section{display:none}}.hidden{display:none!important}.app-header{position:fixed;top:0;left:0;width:100%;height:70px;background-color:#fff;border-bottom:1px solid #f0f0f0;display:flex;justify-content:space-between;align-items:center;padding:0 24px;z-index:1000}.header-title-section{display:flex;align-items:center;gap:12px}.header-title-section .logo{width:40px;height:40px;border-radius:50%;background-color:#1e293b;display:flex;align-items:center;justify-content:center;color:#fff;font-size:20px}.header-title-section h1{font-size:20px;font-weight:600;color:#1e293b}.header-title-section small{font-size:14px;color:#64748b;margin-left:8px;font-weight:400}.header-controls{display:flex;align-items:center;gap:20px}.search-input{padding:10px 14px;min-height:44px;width:320px;border-radius:8px;border:1px solid #d1d5db;background:#fff;color:#334155;outline:none;font-size:14px;transition:border-color .2s,box-shadow .2s}.search-input::placeholder{color:#94a3b8}.search-input:focus{border-color:#d1d5db;box-shadow:0 0 0 4px #f8fafc,0 0 0 6px #6b7280}.user-section{position:relative;display:flex;align-items:center;gap:10px;cursor:pointer}.user-avatar{width:36px;height:36px;border-radius:8px;background-color:#333;overflow:hidden}.user-name{font-size:14px;color:#555;font-weight:500}.user-role{font-size:12px;color:#94a3b8}.dropdown-arrow{color:#94a3b8;margin-left:4px}.user-dropdown{position:absolute;top:55px;right:0;background-color:#fff;border:1px solid #e2e8f0;border-radius:8px;box-shadow:0 8px 16px #0000001a;width:240px;z-index:1100;overflow:hidden;opacity:0;visibility:hidden;transform:translateY(-10px);transition:opacity .2s ease,transform .2s ease,visibility .2s}.user-dropdown.show{opacity:1;visibility:visible;transform:translateY(0)}.user-dropdown a,.user-dropdown .dropdown-label{display:flex;align-items:center;gap:12px;padding:12px 16px;font-size:14px;color:#334155;cursor:pointer;text-decoration:none}.user-dropdown a:hover,.user-dropdown .dropdown-label:hover{background-color:#f1f5f9}.user-dropdown .material-icons{color:#64748b}.user-dropdown hr{border:none;border-top:1px solid #e2e8f0;margin:4px 0}.secondary-sidebar{width:320px;height:calc(100vh - 70px);background-color:#fcfcfc;border-right:1px solid #eee;padding-top:25px;overflow-y:auto;overflow-x:hidden;position:fixed;left:0;top:70px;z-index:800;transition:width .3s ease}.secondary-sidebar.collapsed{width:70px}.secondary-sidebar-header{padding:0 20px 20px;border-bottom:1px solid #f0f0f0;background-color:#fcfcfc;margin-bottom:20px;display:flex;align-items:center;justify-content:space-between;min-height:50px}.secondary-sidebar.collapsed .secondary-sidebar-header{padding:0 15px 20px;justify-content:center}.secondary-sidebar-title{font-size:18px;color:#334155;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sidebar-toggle-btn{background:transparent;border:1px solid #e2e8f0;border-radius:6px;width:32px;height:32px;display:flex;align-items:center;justify-content:center;cursor:pointer;color:#64748b;transition:all .2s ease;flex-shrink:0}.sidebar-toggle-btn:hover{background-color:#f1f5f9;border-color:#cbd5e1;color:#1e293b}.sidebar-toggle-btn .material-icons{font-size:20px}.ticket{padding:15px 20px;border-bottom:1px solid #f0f0f0;cursor:pointer;display:flex;align-items:center;gap:15px;transition:background-color .2s;text-decoration:none;position:relative;white-space:nowrap}.secondary-sidebar.collapsed .ticket{padding:15px;justify-content:center}.ticket:last-child{border-bottom:none}.ticket.active{background-color:#fafafa;border-right:4px solid #1e293b}.ticket:hover{background-color:#f9f9f9}.ticket-icon{color:#94a3b8;flex-shrink:0}.ticket.active .ticket-icon{color:#1e293b}.ticket-title{font-size:15px;color:#555;font-weight:500;overflow:hidden;text-overflow:ellipsis}.ticket-badge{margin-left:auto;font-size:12px;padding:3px 10px;background:#e2e8f0;border-radius:999px;color:#334155;flex-shrink:0}.secondary-sidebar.collapsed .ticket[title]:hover:after{content:attr(title);position:absolute;left:100%;top:50%;transform:translateY(-50%);margin-left:12px;padding:8px 12px;background-color:#1e293b;color:#fff;font-size:14px;font-weight:500;border-radius:6px;white-space:nowrap;z-index:1000;box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -2px #0000001a;pointer-events:none;animation:tooltipFadeIn .2s ease-in-out}.secondary-sidebar.collapsed .ticket[title]:hover:before{content:"";position:absolute;left:100%;top:50%;transform:translateY(-50%);margin-left:6px;width:0;height:0;border-top:6px solid transparent;border-bottom:6px solid transparent;border-right:6px solid #1e293b;z-index:1000;pointer-events:none;animation:tooltipFadeIn .2s ease-in-out}@keyframes tooltipFadeIn{0%{opacity:0;transform:translateY(-50%) translate(-5px)}to{opacity:1;transform:translateY(-50%) translate(0)}}.main-content{flex:1;width:calc(100% - 320px);height:100vh;margin-left:320px;padding-top:70px;overflow:hidden;background-color:#f8fafc;display:flex;flex-direction:column;transition:width .3s ease,margin-left .3s ease}.main-content.sidebar-collapsed{width:calc(100% - 70px);margin-left:70px}.main-content-header{height:70px;min-height:70px;padding:0 24px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #f0f0f0;background-color:#fff}.main-content-body{flex:1;padding:24px;overflow-y:auto}.main-content-area-wrapper{display:flex;flex-direction:column;height:calc(100vh - 70px)}.main-content-body{overflow-y:auto;scrollbar-width:thin;scrollbar-color:#cbd5e1 transparent}.main-content-body::-webkit-scrollbar{width:8px}.main-content-body::-webkit-scrollbar-track{background:transparent}.main-content-body::-webkit-scrollbar-thumb{background-color:#cbd5e1;border-radius:8px}.main-content-body::-webkit-scrollbar-thumb:hover{background-color:#626e7e}.stepper-container{display:flex;align-items:center;justify-content:center;width:100%;padding:0 40px;margin-bottom:20px;margin-top:20px}.stepper{display:flex;align-items:center;position:relative;width:100%;max-width:100%}.step-wrapper{display:flex;align-items:center;position:relative;flex:1}.step{width:32px;height:32px;border-radius:50%;background-color:#fff;border:2px solid #e2e8f0;display:flex;justify-content:center;align-items:center;font-weight:500;color:#94a3b8;position:relative;transition:all .3s ease;z-index:2}.step-active{border-color:#1e293b;color:#1e293b;font-weight:700}.step-completed{background-color:#1e293b;border-color:#1e293b;color:#fff}.step i{font-size:16px}.step-connector{flex:1;height:2px;background-color:#e2e8f0;margin:0 8px;transition:background-color .3s ease}.step-connector.completed{background-color:#1e293b}.card{background-color:#fff;border:1px solid #e2e8f0;border-radius:12px;padding:24px;margin-bottom:24px;box-shadow:0 4px 6px -1px #0000000d,0 2px 4px -2px #0000000d}.card h2{margin:0 0 16px;font-size:20px;font-weight:600;color:#1e293b}.grid{display:grid;grid-template-columns:repeat(12,1fr);gap:20px}.field{grid-column:span 6;display:flex;flex-direction:column;gap:8px;min-width:0}.field.full{grid-column:1 / -1}.field.third{grid-column:span 4}label{font-size:14px;color:#475569;font-weight:500}.field .tag{background:#e0e7ff;color:#4338ca;border:1px solid #c7d2fe;padding:2px 8px;border-radius:999px;font-size:12px;font-weight:500;margin-left:8px}.field .help{font-size:12px;color:#94a3b8;margin-top:-4px}input[type=text],input[type=email],input[type=tel],input[type=url],input[type=number],input[type=date],textarea,select{padding:10px 14px;min-height:44px;border-radius:8px;border:1px solid #d1d5db;background:#fff;color:#334155;outline:none;font-size:14px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;transition:border-color .2s,box-shadow .2s}select{padding-right:40px;background-image:url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23666' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6,9 12,15 18,9'%3e%3c/polyline%3e%3c/svg%3e");background-repeat:no-repeat;background-position:right 12px center;background-size:16px;appearance:none;-webkit-appearance:none;-moz-appearance:none;width:100%}.field{position:relative}select option{white-space:normal;word-wrap:break-word}@media screen and (-webkit-min-device-pixel-ratio:0){select{width:100%}}.custom-select-container{position:relative;width:100%}.custom-select-value{padding:10px 40px 10px 14px;min-height:44px;border-radius:8px;border:1px solid #d1d5db;background:#fff;color:#334155;font-size:14px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;cursor:pointer;display:flex;align-items:flex-start;position:relative;white-space:normal;overflow:visible;word-wrap:break-word;line-height:1.5}.custom-select-value:after{content:"";position:absolute;right:12px;top:14px;width:16px;height:16px;background-image:url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23666' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6,9 12,15 18,9'%3e%3c/polyline%3e%3c/svg%3e");background-repeat:no-repeat;background-position:center;background-size:contain}.custom-select-dropdown{display:none;position:absolute;top:100%;left:0;width:100%;max-height:300px;overflow-y:auto;background:#fff;border:1px solid #d1d5db;border-radius:8px;box-shadow:0 4px 6px #0000001a;z-index:1000;margin-top:4px}.custom-select-option{padding:10px 14px;cursor:pointer;white-space:normal;word-wrap:break-word;border-bottom:1px solid #f0f0f0;font-size:14px}.custom-select-option:last-child{border-bottom:none}.custom-select-option:hover{background-color:#f8fafc}body.has-dropdown-open{overflow:hidden}select{width:100%!important;max-width:100%!important;text-overflow:ellipsis;overflow:hidden}option{white-space:normal!important;overflow-wrap:break-word!important;word-break:break-all!important;width:100%!important;max-width:100%!important}@-moz-document url-prefix(){select{text-overflow:ellipsis;width:100%!important}select option{white-space:normal!important;width:100%!important}}textarea{min-height:44px;resize:vertical}textarea[readonly]{resize:none;min-height:44px;height:auto}input::placeholder,textarea::placeholder{color:#94a3b8}input:focus,textarea:focus,select:focus{border-color:#d1d5db;box-shadow:0 0 0 2px #f8fafc,0 0 0 4px #6b7280}.checkbox-row{padding-top:3px;padding-bottom:10px}input[type=checkbox]{width:18px;height:18px;vertical-align:middle;accent-color:#1e293b;cursor:pointer;-webkit-appearance:auto;-moz-appearance:auto;appearance:auto;box-sizing:border-box;padding:0;margin:0}input[type=checkbox]:after{content:none!important}.field input[type=checkbox]+label{margin-left:0;cursor:pointer;display:flex;align-items:flex-start;min-height:44px;font-weight:400;color:#334155;gap:8px}.field input[type=checkbox]{flex-shrink:0;margin-top:2px}.repeatable{border:1px dashed #e2e8f0;border-radius:12px;padding:16px;background:#fafafa}.repeatable .item{display:flex;gap:8px;align-items:center;margin-bottom:8px}.repeatable .item input{flex:1 1 auto}.repeatable .item button{display:inline-flex;align-items:center;justify-content:center;height:44px;padding:0 12px;border-radius:8px;border:1px solid #cbd5e1;background:#fff;color:#ef4444;cursor:pointer;transition:background-color .2s}.repeatable .item button:hover{background-color:#fee2e2}.actions{display:flex;gap:12px;justify-content:flex-end;padding-top:20px;border-top:1px solid #e2e8f0;margin-top:20px}.actions button{border:none;padding:10px 25px;height:44px;border-radius:6px;cursor:pointer;transition:background-color .3s,filter .2s;font-size:16px;font-weight:500}.actions .primary{background-color:#1e293b;color:#fff}.actions .primary:hover{background-color:#0f172a}.actions .primary:active{filter:brightness(.95)}.actions .secondary{background-color:#fff;color:#475569;border:1px solid #cbd5e1}.actions .secondary:hover{background-color:#f1f5f9}.actions .danger{background-color:#fff;color:#ef4444;border:1px solid #fecaca}.actions .danger:hover{background-color:#fee2e2}button.primary{border:none;padding:10px 25px;height:44px;border-radius:6px;cursor:pointer;transition:background-color .3s,filter .2s;font-size:16px;font-weight:500;background-color:#1e293b;color:#fff}button.primary:hover{background-color:#0f172a}button.primary:active{filter:brightness(.95)}button.secondary{border:1px solid #e2e8f0;padding:10px 25px;height:44px;border-radius:8px;cursor:pointer;transition:background-color .3s,border-color .2s,color .2s;font-size:16px;font-weight:500;background-color:#fff;color:#334155}button.secondary:hover{background-color:#f8fafc}button.secondary:active{background-color:#f1f5f9}button.add-button{border-color:#cbd5e1;color:#1e40af}button.add-button:hover{background-color:#dbeafe;border-color:#93c5fd;color:#1e3a8a}button.add-button:active{background-color:#bfdbfe}button.danger{border:none;padding:10px 25px;height:44px;border-radius:6px;cursor:pointer;transition:background-color .3s,filter .2s;font-size:16px;font-weight:500;background-color:#ef4444;color:#fff}button.danger:hover{background-color:#dc2626}button.danger:active{filter:brightness(.95)}button.delete-history{border:none;padding:10px 25px;height:44px;border-radius:6px;cursor:pointer;transition:background-color .3s,filter .2s;font-size:16px;font-weight:500;background-color:#475569;color:#fff}button.delete-history:hover{background-color:#334155}button.delete-history:active{filter:brightness(.95)}.divider{width:100%;height:1px;background-color:#e2e8f0;margin:50px 0}.divider-compact{width:100%;height:1px;background-color:#e2e8f0;margin:25px 0}.divider-half{width:50%;height:1px;background-color:#e2e8f0;margin:25px 0}.searchbar{display:flex;gap:12px;align-items:center;margin-bottom:16px;flex-wrap:wrap}.table-wrap{overflow-x:auto;border-radius:12px;border:1px solid #e2e8f0;background:#fff}table.registry-table{width:100%;min-width:700px;border-collapse:collapse;font-size:14px}.registry-table thead{background-color:#f8fafc}.registry-table th{padding:12px 15px;text-align:left;color:#64748b;font-weight:500;border-bottom:1px solid #e2e8f0;white-space:nowrap}.registry-table td{padding:12px 15px;border-bottom:1px solid #e2e8f0;color:#475569;vertical-align:middle;word-break:break-word}.registry-table tbody tr:last-child td{border-bottom:none}.registry-table tbody tr:hover{background-color:#f1f5f9}.row-actions{white-space:nowrap;text-align:right}.row-actions button{background-color:transparent;border:none;cursor:pointer;color:#94a3b8;padding:4px;display:inline-flex;align-items:center;justify-content:center;border-radius:4px}.row-actions button:hover{background-color:#e2e8f0;color:#1e293b}.row-actions .danger:hover{background-color:#fee2e2;color:#ef4444}body.compact input,body.compact textarea,body.compact select{min-height:38px;padding:6px 12px;border-radius:6px}body.compact .actions button,body.compact .searchbar button{min-height:38px;height:38px}body.compact .grid{gap:16px}body.compact .card{padding:20px}.zoom-control{position:relative;display:flex;align-items:center;cursor:pointer;margin-right:20px}.zoom-control-value{display:flex;align-items:center;gap:8px;padding:8px 12px;border-radius:8px;border:1px solid #d1d5db;background-color:#fff;color:#334155;font-size:14px;font-weight:500;transition:all .2s ease;min-height:44px}.zoom-control-value .material-icons:first-child{color:#64748b;font-size:18px}.zoom-control-value span{min-width:40px;text-align:center}.zoom-control-value .dropdown-arrow{color:#94a3b8;font-size:18px;transition:transform .2s ease}.zoom-control-value.show .dropdown-arrow{transform:rotate(180deg)}.zoom-control-value:hover{border-color:#cbd5e1;background-color:#f8fafc}.zoom-control-dropdown{position:absolute;top:100%;right:0;margin-top:4px;background-color:#fff;border:1px solid #e2e8f0;border-radius:8px;box-shadow:0 4px 12px #0000001a;width:120px;z-index:1100;overflow:hidden}.zoom-control-option{padding:10px 16px;font-size:14px;color:#334155;cursor:pointer;transition:background-color .2s ease;text-align:center}.zoom-control-option:hover{background-color:#f1f5f9}.zoom-control-option.active{background-color:#1e293b;color:#fff;font-weight:500}@media (max-width: 768px){.zoom-control{margin-right:12px}.zoom-control-value{padding:6px 10px;font-size:13px;min-height:40px}.zoom-control-value span{min-width:35px}.zoom-control-dropdown{width:100px}.zoom-control-option{padding:8px 12px;font-size:13px}}
