.requirement_name{
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 120px !important;
    white-space: nowrap;
}
@font-face {
  font-family: "Poppins";
  src: url("/assets/plugin_assets/redmineflux_testcase_management/Poppins-Regular-9a9b6e54.otf");
}
#requirement_dropdown .select2-container--default .select2-selection--multiple .select2-selection__choice {
    background-color: #d8ebff !important;
    border: 1px solid #d8ebff !important;
    border-radius: 4px;
    box-sizing: border-box;
    display: inline-block !important;
    margin-left: 9px !important;
    margin-top: 5px !important;
    padding: 2px;
    padding-left: 20px;
    position: relative;
    max-width: 285px;
    overflow: hidden;
    text-overflow: ellipsis;
    vertical-align: bottom;
    white-space: nowrap;
}
#requirement_dropdown .select2-container--default .select2-selection--multiple .select2-selection__choice {
    max-width: 80% !important;
    white-space: unset !important;
}
.select2-container .select2-results__option {
    white-space: nowrap;       
    overflow: hidden;          
    text-overflow: ellipsis;  
    max-width: 100%;         
}
#requirement_dropdown .select2-selection--multiple{
    max-height: 150px;
    overflow-y: auto;
    white-space: normal;
    overflow-x: hidden;
    scrollbar-width: thin !important;
    border-radius: 1px !important;
}

.controller-issues.action-show .select2-container{
    width: 100% !important;
}
#report_graph, #report_line_graph{
    display: flex;
    justify-content: center;
  }

.report_parent_div{
    text-align: center;
    width: 50%;
    box-shadow: 0 10px 10px rgba(0, 0, 0, 0.2);
    background-color:#fff;
  }
  #report_graphs{
    display: flex;
    gap: 20px !important;
    margin-top: 15px;
    margin-bottom: 35px;
  }

#report_graph_label,#report_line_graph_label{
    margin-top: 10px;
    margin-bottom: 10px;
    margin-right: 100px;
}
     
.delete-step-heading{
    font-size: 18px;
    color:black;
    font-weight: 600;
  }
  .modal-transition{
  opacity: 1 !important;
  visibility: visible !important;
  display: block !important;
  transition: all 0.3s ease-in; 
  }
  .delete-step-para-content{
    font-size: 17px;
    font-family: "Poppins" !important;
    padding-left: 0px !important;
    text-align: justify;
    line-height: 1.5;
    max-width: 600px;
    padding-top: 0px !important;
    padding-bottom: 0px !important;
  }
  .delete-step-main-content{
    padding: 10px 0px;
  }
  .delete-step-image-folder{
    width: 15px;
    height: 25px;
  }
  .delete-step-cross-folder:hover{
    background-color: #eee;
    border-radius: 2px;
  }
  .delete-step-suite-header-content{
    display: flex;
    justify-content: space-between;
    border-bottom: 1px solid #e0e1e2;
  }
  .delete-step-template{
    font-size: 18px;
    font-family: "Poppins";
    color:black;
    font-weight: 600;
  }
  button.delete-step_button{
    background: #0094FF;
    border: 1px solid #0094FF;
    color: #fff;
    padding: 0 7px;
    width: 110px;
    height: 40px;
    border-radius: 4px;
    font-family: "Poppins";
    font-style: normal;
    font-weight: 400 !important;
    font-size: 15px !important;
    line-height: 21px;
    cursor: pointer;
  }
  input.delete-step_button {
    background: #0094FF;
    border: 1px solid #0094FF;
    color: #fff;
    padding: 0 7px;
    width: 110px !important;
    height: 40px;
    border-radius: 4px;
    font-family: "Poppins";
    font-style: normal;
    font-weight: 400 !important;
    font-size: 15px !important;
    line-height: 21px;
    cursor: pointer;
  }
  button.delete-step_button:hover {
    background-color: #0094ffc7 !important;
    border: 1px solid #0094ffc7 !important;
  }
  
  input.delete-step_button:hover {
    background-color: #0094ffc7 !important;
    border: 1px solid #0094ffc7 !important;
  }
  button.delete-step_cancel-btn {
    width: 120px;
    height: 40px;
    border-radius: 4px;
    font-family: "Poppins";
    font-style: normal;
    font-weight: 400;
    font-size: 15px;
    line-height: 21px;
    cursor: pointer;
    transition: all 0.3s ease-in;
  }
  
  button.delete-step_cancel-btn:hover {
    background-color: #ced3e6a8;
  }
  .overlay-delete-step-template{
    opacity: 1 !important;
    visibility: visible !important;
    display: block !important;
  }
  .delete-step-footer-folder {
    margin-top: 5px;
  }
  .delete-step-overlay{
    font-family: "Poppins" !important;
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    z-index: 1040;
    opacity: 0;
    visibility: hidden;
    transition: all 0.1s ease-in;
    display: none;
  }
  .delete-step-template{
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) scale(0.8);
    background-color: #fff;
    border-radius: 5px;
    z-index: 1060;
    min-width: 386px;
    padding: 20px;
    visibility: hidden;
    opacity: 0.4;
    transition: all 0.1s ease-in;
    display: none;
    width: 430px; 
    font-weight: 100 !important;
  }
  .overlay-delete-email-template{
    opacity: 1 !important;
    visibility: visible !important;
    display: block !important;
  }
  .delete-step-cross-folder:hover{
    background: none;
  }
#requirement_dropdown .select2.select2-container.select2-container--default.select2-container--focus{
  width: 100% !important;
}
#requirement_dropdown .select2-container[style*="width: 91.5px"] {
  width: 100% !important; /* Override the inline width */
}
#requirement_dropdown .select2.select2-container.select2-container--default.select2-container--below{
  width: 100% !important;
}
/* ==========================================================================
   Legacy icon compatibility (Redmine 5 / 6 / 7)
   --------------------------------------------------------------------------
   Redmine 7.0 removed the raster icon sprite together with the `.icon` /
   `.icon-only` geometry rules, and ships no legacy PNGs at all. Markup still
   written as `class="icon icon-del"` therefore renders as bare text, and an
   empty `<a class="icon-only icon-del">` collapses to a 0x0 box that can be
   neither seen nor clicked.

   These rules restore the glyph and the geometry from the plugin's own SVG
   assets, so they behave the same on Redmine 5.x, 6.x and 7.x without
   depending on core's (deprecated) legacy-icons-compat.css.

   Two deliberate constraints:
     * `:not(:has(svg))` limits every rule to legacy markup -- anything already
       rendered through `sprite_icon` contains an inline <svg> and is skipped.
     * Only the icon names this plugin actually renders are listed. There is no
       blanket `.icon` / `.icon-only` rule, because this stylesheet loads on
       every page and such a rule would also re-box unrelated `.icon-only`
       elements belonging to Redmine core and to the other RedmineFlux plugins.
   ========================================================================== */

.icon-del:not(:has(svg)),
.icon-edit:not(:has(svg)),
.icon-add:not(:has(svg)),
.icon-copy:not(:has(svg)),
.icon-download:not(:has(svg)),
.icon-sort-handle:not(:has(svg)) {
  background-repeat: no-repeat;
  background-position: 0% 50%;
  background-size: 16px 16px;
}

.icon-del:not(:has(svg))  { background-image: url("/assets/plugin_assets/redmineflux_testcase_management/icons-delete-354e1836.svg"); }
.icon-edit:not(:has(svg)) { background-image: url("/assets/plugin_assets/redmineflux_testcase_management/pencil-icon-35437099.svg"); }
/* plus_circle.svg (#169), not plus-icon.svg -- the latter is fill="white"
   and is only legible on the blue New Report button. This is the same
   asset #add_steps_button uses in testcase_style.css, which is not loaded
   on the issue new/edit pages. */
.icon-add:not(:has(svg))  { background-image: url("/assets/plugin_assets/redmineflux_testcase_management/plus_circle-0a871327.svg"); background-size: 14px 14px; }
.icon-copy:not(:has(svg)) { background-image: url("/assets/plugin_assets/redmineflux_testcase_management/copy-icon-5a1856ac.svg"); }
.icon-download:not(:has(svg))    { background-image: url("/assets/plugin_assets/redmineflux_testcase_management/download-icon-1a246e6f.svg"); }
.icon-sort-handle:not(:has(svg)) { background-image: url("/assets/plugin_assets/redmineflux_testcase_management/reorder-ce7a62b0.svg"); }

/* Labelled actions: leave room for the glyph before the text.
   padding-top/bottom are reset to 0 here rather than left to whatever the
   current Redmine version's own core CSS still contributes for `.icon`:
   Redmine 5's core stylesheet applies its own asymmetric icon padding
   (2px top / 3px bottom), which shifts this box's height enough that the
   `background-position: 0% 50%` centering above lands the glyph visibly
   low relative to the text baseline. Owning the full box model here keeps
   the glyph vertically centered the same way on 5.x, 6.x and 7.x. */
.icon.icon-del:not(:has(svg)),
.icon.icon-edit:not(:has(svg)),
.icon.icon-add:not(:has(svg)),
.icon.icon-copy:not(:has(svg)),
.icon.icon-download:not(:has(svg)) {
  padding-left: 20px;
  padding-top: 0;
  padding-bottom: 0;
}

/* Icon-only actions: show just the glyph, but keep a real clickable box.
   Mirrors what core's own rules did before 7.0. */
.icon-only.icon-del:not(:has(svg)),
.icon-only.icon-edit:not(:has(svg)),
.icon-only.icon-add:not(:has(svg)),
.icon-only.icon-copy:not(:has(svg)),
.icon-only.icon-download:not(:has(svg)),
.icon-only.icon-sort-handle:not(:has(svg)) {
  display: inline-block;
  width: 0;
  height: 16px;
  padding-left: 16px;
  padding-top: 0;
  padding-bottom: 0;
  overflow: hidden;
  font-size: 0.5rem;
  vertical-align: middle;
}

.icon-only.icon-del:not(:has(svg))::after,
.icon-only.icon-edit:not(:has(svg))::after,
.icon-only.icon-add:not(:has(svg))::after,
.icon-only.icon-copy:not(:has(svg))::after,
.icon-only.icon-download:not(:has(svg))::after {
  content: "0";
}