body{margin:0;padding:0;font-family:Montserrat,Roboto,arial,sans-serif}a{text-decoration:none}.menu{background-color:#003554;max-width:300px;min-height:100vh;position:fixed;margin-left:0;margin-top:0;padding:20px;z-index:10;transform:translate(0);transition:transform .3s ease-in-out}.menu-two-arrow{font-size:24px;font-weight:700;color:#000;cursor:pointer;width:24px;height:24px;position:absolute;z-index:2;margin-left:240px;transition:transform .3s ease-in-out}.menu-header{font-size:24px;font-weight:500;color:#fff;margin-left:auto;margin-right:auto;text-align:center}.menu-body{display:grid;margin-top:20px}.menu-routes-cnt{display:grid;width:fit-content}.route-item-cnt{display:flex;width:200px;height:40px;text-align:center;background-color:#006494;border-radius:8px;margin:5px;justify-content:center;align-items:center;cursor:pointer;gap:10px}.route-item-cnt:hover{background-color:#0582ca}.route-item-cnt img{width:25px;height:25px;cursor:pointer}.route-item-cnt label{min-height:25px;color:#fff;font-size:14px;font-weight:700;line-height:25px;cursor:pointer}.content{margin-left:300px;margin-right:200px;height:100vh;display:grid;row-gap:50px}.text-input-items-cnt{display:grid;row-gap:15px}.pattern-group{display:flex;width:100%;column-gap:40px}.active-config-json,.pattern-json,.new-config-json{max-height:800px;overflow-y:scroll}:root{--color-primary: #2a9d8f;--color-primary-hover: #53c9bb;--color-secondary: #264653;--color-background: #f8f9fa;--color-border: rgb(101, 102, 102);--color-text: #212529;--color-text-light: #6c757d;--shadow: 0 4px 6px -1px rgba(0, 0, 0, .1), 0 2px 4px -1px rgba(0, 0, 0, .06);--shadow-hover: 0 10px 15px -3px rgba(0, 0, 0, .1), 0 4px 6px -2px rgba(0, 0, 0, .05);--radius: 12px}.formarea{min-width:fit-content;height:fit-content;border-radius:var(--radius);color:#d4d4d4;padding:0;background:#505050;position:relative}.formarea-header{display:flex;align-items:center;font-size:1.25rem;font-weight:600;border-bottom:1px solid var(--color-border);padding:1rem 1.5rem;background:#505050}.formarea-header label{margin:0;font-size:1.1rem;font-weight:600}.formarea-body{width:100%;height:fit-content;display:grid;padding:30px;row-gap:10px}.formarea-bottom{display:flex;column-gap:10px;padding:1rem 1.5rem;max-height:50px;border-top:1px gray solid}.button-main-active{border-radius:8px;background-color:#2a9d8f;text-align:center;align-items:center;cursor:pointer;display:grid;border:none;padding:5px;-webkit-user-select:none;user-select:none}.button-title-active{color:#fff;font-size:14px;line-height:14px;font-weight:600}.button-main-active:hover{background-color:#238378}.button-main-active:active{background-color:#818080}.button-main-unactive{border-radius:8px;background-color:#818080;text-align:center;align-items:center;cursor:default;display:grid;border:none;padding:5px;-webkit-user-select:none;user-select:none}.button-title-unactive{color:#fff;font-size:14px;line-height:14px;font-weight:600}.textinput-main{border-style:none;border:none;transition:border-bottom 1s ease-in;padding:2px}.textinput-main input{border-style:none;border:none;outline:none;border-radius:8px;padding:5px;background-color:#797979;color:#fff}.textinput-main input::placeholder{color:#e9e9e9}.textinput-main input:focus{border-bottom:2px black solid}.select{position:relative;display:inline-block}.select-items{max-height:120px;position:absolute;display:grid;background-color:#d88181;box-shadow:0 4px 8px #0000001a;border-radius:4px;z-index:3;width:100%;overflow-y:scroll}.select-item{background-color:#f7f7f7;color:#333;padding:5px 10px;cursor:pointer;font-weight:600;text-align:center;font-size:16px;height:20px}.select-item:hover{background-color:#0582ca}.select-emptity{text-align:center;padding:5px 10px;background-color:#f7f7f7;color:#000;font-weight:600;font-size:14px;line-height:14px;cursor:pointer}:root{--color-primary: #2a9d8f;--color-primary-hover: #53c9bb;--color-secondary: #264653;--color-background: #f8f9fa;--color-border: #e9ecef;--color-text: #212529;--color-text-light: #6c757d;--shadow: 0 4px 6px -1px rgba(0, 0, 0, .1), 0 2px 4px -1px rgba(0, 0, 0, .06);--shadow-hover: 0 10px 15px -3px rgba(0, 0, 0, .1), 0 4px 6px -2px rgba(0, 0, 0, .05);--radius: 12px}.validationbox{width:fit-content;height:fit-content;column-gap:5px;display:flex;padding:8px;text-align:center}.validationbox-valid-text{color:var(--color-primary);font-size:16px;line-height:16px}.validationbox-invalid-text{color:red;font-size:16px;line-height:16px}.error-modal-overlay{min-height:500px;position:fixed;inset:0;background-color:#00000080;display:flex;justify-content:center;align-items:center;z-index:1000;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.error-modal{border:none;border-radius:12px;padding:0;max-width:500px;width:90%;max-height:80vh;overflow:hidden;box-shadow:0 10px 30px #0000004d;animation:modalAppear .3s ease-out}@keyframes modalAppear{0%{opacity:0;transform:scale(.9) translateY(-20px)}to{opacity:1;transform:scale(1) translateY(0)}}.error-modal-cnt{display:flex;flex-direction:column;height:100%}.error-modal-header{display:flex;justify-content:space-between;align-items:center;padding:20px 24px 16px;border-bottom:1px solid #e1e5e9}.error-modal-title{margin:0;font-size:1.5rem;font-weight:600;color:#d93025}.error-modal-close{background:none;border:none;font-size:2rem;cursor:pointer;color:#5f6368;padding:0;width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:50%;transition:background-color .2s}.error-modal-close:hover{background-color:#f1f3f4;color:#000}.error-modal-body{min-height:400px;max-height:400px;padding:24px;flex-grow:1;overflow-y:auto;display:flex;flex-direction:column;gap:20px}.error-icon{font-size:3rem;text-align:center;margin-bottom:10px}.error-list{display:flex;flex-direction:column;gap:16px}.error-item{padding:16px;background-color:#fef7f7;border:1px solid #f5c6c6;border-radius:8px;border-left:4px solid #d93025}.error-message{font-weight:500;color:#d93025;margin-bottom:8px;font-size:1.1rem}.error-path{color:#5f6368;font-size:.9rem;margin-bottom:4px;font-family:monospace;background-color:#f8f9fa;padding:4px 8px;border-radius:4px;display:inline-block}.error-code{color:#5f6368;font-size:.9rem;font-weight:500}.error-modal-bottom{padding:20px 24px;border-top:1px solid #e1e5e9;display:flex;justify-content:flex-end}.error-modal-button{background-color:#d93025;color:#fff;border:none;padding:10px 24px;border-radius:6px;font-size:1rem;font-weight:500;cursor:pointer;transition:background-color .2s}.error-modal-button:hover{background-color:#c5221f}.error-modal-button:focus{outline:2px solid #d93025;outline-offset:2px}@media (max-width: 600px){.error-modal{width:95%;margin:20px}.error-modal-header,.error-modal-body,.error-modal-bottom{padding:16px}.error-modal-title{font-size:1.3rem}.error-modal-bottom{display:flex;align-items:center;text-align:center}}.page{height:100%;width:100%;position:absolute;display:grid;overflow-y:scroll}.content{margin-left:300px;margin-right:200px;height:100vh;display:grid}.iframe{width:1000px;height:400px;margin-top:200px}.page{height:100%;width:100%;position:absolute;overflow-y:scroll;display:grid;padding:30px;background-color:#1e1e1e;color:#d4d4d4}.jq-playground-grid{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:auto auto;height:100vh;gap:40px;padding:10px;column-gap:20px;row-gap:50px}.input-jq-cnt{grid-column:1 / 2;grid-row:1 / 2}.input-jq-content{display:grid;grid-template-rows:60px 1fr;border:1px gray solid;height:100%;padding:20px;border-radius:8px}.input-jq-header{padding:10px;height:40px;grid-row:1 / 2;display:flex;column-gap:20px;width:fit-content}.input-jq-header-name{font-size:24px;font-weight:600}.input-jq-text-cnt{max-height:100%;width:100%;grid-row:2 / 2;display:grid}.input-jq-text-cnt textarea{height:100%;width:100%;font-size:18px;font-weight:700;background-color:#1e1e1e;color:#d4d4d4}.input-json-cnt{grid-column:1 / 2;grid-row:2 / 3}.input-json-content{display:grid;grid-template-rows:60px 1fr;border:1px gray solid;height:100%;padding:20px;border-radius:8px}.input-json-header{padding:10px;height:40px;grid-row:1 / 2}.input-json-header-name{font-size:24px;font-weight:600}.input-json-text-cnt{grid-row:2 / 2;max-height:800px;overflow-y:scroll}.input-json-text-cnt-value{height:100%;overflow-y:scroll}.jq-result-cnt{grid-column:2 / 3;grid-row:1 / 3}.jq-result-content{display:grid;grid-template-rows:60px 1fr;border:1px gray solid;height:100%;padding:20px;border-radius:8px}.jq-result-header{padding:10px;height:40px;grid-row:1 / 2}.jq-result-header-name{font-size:24px;font-weight:600}.jq-result-text-cnt{grid-row:2 / 2;max-height:1050px}.jq-result-text-cnt textarea{height:100%;width:100%;font-size:18px;font-weight:700;background-color:#1e1e1e;color:#d4d4d4}.jq-options-cnt{border:1px rgb(212,212,212) solid;width:600px;height:auto;position:relative;display:grid;cursor:pointer;margin-bottom:7px}.jq-options-selected-list{width:100%;height:35px;display:flex;column-gap:5px;position:relative;margin-bottom:2px}.jq-options-selected-list-item{margin-top:5px;margin-left:5px;width:auto;height:18px;font-size:12px;display:flex;border-radius:16px;background-color:gray;cursor:pointer;column-gap:3px;padding:3px 3px 3px 5px;align-items:center;text-align:center}.jq-options-selected-list-empty{color:#d4d4d4;font-size:18px;margin-left:auto;margin-right:auto;text-align:center;align-items:center;margin-top:5px}.jq-options-selected-list-item-rm{border-radius:50%;color:#d4d4d466;background-color:gray;width:15px;height:15px;margin-left:3px;margin-top:auto;margin-bottom:auto}.jq-options-selected-list-item-rm:hover{background-color:#d4d4d466;color:gray}.jq-options-drop-list{height:auto;width:100%;align-items:flex-start;position:relative;display:grid}.jq-options-drop-list-item{height:30px;width:100%;padding:3px;align-content:center;text-align:center;cursor:pointer;border:1px black solid;text-wrap-mode:nowrap;column-gap:5px;align-items:flex-start;display:flex;background-color:gray}.jq-options-drop-list-item:hover{background-color:#a0a0a0}