.dynamictextbox {
    width: 100%;
      -moz-border-radius: 8px;
      border-radius: 8px;
      padding: 2px;
      display: table;
      background-color: #ffffff;
      border: 1px solid #e9ecef;
      transition: all 0.2s ease;
  }
  
      .dynamictextbox:focus-within > .prefix, .dynamictextbox:hover > .prefix {
          display: block !important;
      }
  
      .dynamictextbox .prefix {
        background: linear-gradient(135deg, #385168 0%, #2a3d4f 100%);
      color: #ffffff;
      margin-top: 6px;
      font-weight: 500;
      padding: 8px 12px;
      width: 100%;
      border-radius: 6px 6px 0 0;
      font-size: 12px;
      text-transform: uppercase;
      letter-spacing: 0.5px;
      box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  }
      
          .dynamictextbox .dynamictextboxInput[type='text'] {
            color: #666666;
            outline: none;
            display: table-cell;
            width: inherit;
            padding: 5px;
            background-color: #f9f9f9;
            margin-top: 3px;
      }
  
      .dynamictextbox .dynamictextboxInput[type='checkbox'] {
          width: auto;
          margin-left: 10px;
      }
  
      .dynamictextbox .dynamictextboxInput[type='color'] {
          width: auto;
          min-width: 60px;
          margin-left: 10px;
      }
  
  
      .dynamictextbox textarea.dynamictextboxInput {
      width: 99%;
      min-height: 120px;
      resize: vertical;
      font-family: 'Consolas', 'Monaco', 'Courier New', monospace;
      }
  
      .dynamictextbox .prefix .dropdown-toggle {
        padding: 2px 10px 2px 10px;
        background-color: #263868;
        color: #fcfdfd;
        font-weight: 600;
        margin-right: 20px;
      }
  
          .dynamictextbox .prefix .dropdown-toggle:hover {
          }
  
      .dynamictextbox .codemember select, .gateitem select {
          border: solid 1px;
          margin-top: 1px;
      }
  
      .dynamictextbox .expc .dynamictextboxInput {
          padding: 5px;
          margin-left: 5%;
          width: 90%;
      }
  
      .expc .expUp, .dynamictextbox .expc .expDown {    
        color: black;
      }
  
  .expc .dynamictextboxInput {
      height: 250px;
      border: 0;
      overflow: scroll;
  }
  
  .expc div b {
      color: blue;
  }
  
  .dynamictextbox .expjs .dynamictextboxInput {
      padding: 5px;
      margin-left: 5%;
      width: 90%;
  }
  
  .expjs .expUp, .dynamictextbox .expjs .expDown {
  }
  
  .expjs .dynamictextboxInput {
      height: 250px;
      border: 0;
      overflow: scroll;
  }
  
  .expjs div b {
      color: blue;
  }
  
  
  .dynamictextbox .dynamictextboxInput {
      color: #666666;
      outline: none;
      display: table-cell;
      width: inherit;
      padding: 5px;
      background-color:#f9f9f9;
  }
  
  .dynamictextbox .dynamicBoxDefault span {
      margin-right: 6px;
      color: #292828;
  }
  
  .dynamictextbox .dynamicBoxDefault a {
      font-weight: bold;
  }
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  .query-builder .r-container,
  .query-builder .rule-placeholder,
  .query-builder .rg-container {
      position: relative;
      margin: 4px 0;
      border: 1px solid #434343;
  }
  
      .query-builder .drag-handle,
      .query-builder .error-container,
      .query-builder .r-container .rf-container,
      .query-builder .r-container .ro-container,
      .query-builder .r-container .rule-value-container {
          display: inline-block;
          margin: 0 5px 0 0;
          vertical-align: middle;
      }
  
  .query-builder .rg-container {
      padding: 10px;
      padding-bottom: 6px;
  }
  
  .query-builder .rg-header {
      margin-bottom: 10px
  }
  
      .query-builder .rg-header .group-conditions .btn.readonly:not(.active),
      .query-builder .rg-header .group-conditions input[name$='_cond'] {
          border: 0;
          clip: rect(0 0 0 0);
          height: 1px;
          margin: -1px;
          overflow: hidden;
          padding: 0;
          position: absolute;
          width: 1px;
          white-space: nowrap
      }
  
  
  .query-builder .rules-list {
      padding: 0 0 0 15px;
      margin: 0;
  }
  
  .query-builder .rule-value-container {
      border-left: 1px solid #ddd;
      padding-left: 5px;
  }
  
  
  
  
  
  .query-builder .error-container {
      display: none;
      cursor: help;
      color: red
  }
  
  
  
  
  .query-builder .rules-list > ::after,
  .query-builder .rules-list > ::before {
      content: '';
      position: absolute;
      left: -10px;
      width: 10px;
      height: calc(50% + 4px);
      border-color: #ccc;
      border-style: solid;
  }
  
  .query-builder .rules-list > ::before {
      top: -4px;
      border-width: 0 0 2px 2px;
  }
  
  .query-builder .rules-list > ::after {
      top: 50%;
      border-width: 0 0 0 2px
  }
  
  .query-builder .rules-list > :first-child::before {
      top: -12px;
      height: calc(50% + 14px);
  }
  
  .query-builder .rules-list > :last-child::before {
      border-radius: 0 0 0 4px;
  }
  
  .query-builder .rules-list > :last-child::after {
      display: none
  }
  
  .dynamictextbox iframe.dynamictextboxInput {
      min-height: 450px !important;
  }
  
  .dropdown-menu {
      background-color: #292c34 !important;
  }
  
      .dropdown-menu > li > a {
          color: white !important;
      }
  
  
  .rf-container {
      display: inline-flex !important;
  }
  
      .rf-container .dynamicBoxDefault a, .rule-value-container .dynamicBoxDefault a {
        color: #337ab7;
      }
  
  
  
  .rule-value-container {
      display: inline-flex !important;
  }
  
  .rule-value-container .target-type,.rf-container .target-type
  {
      padding-left: 3px;
      padding-right: 10px;
      color: green;
  }