.danger{
  color: #a94442;
  font-weight: 600;
}
.success{
  color: #3c763d;
  font-weight: 600;
}
.srt{
  color: #934c6c;
  font-weight: bold;
  font-size: larger;
}
.hd
{
  display: none !important;
}
.dropdown-item.active, .dropdown-item:active {
    color: #fff;
    text-decoration: none;
    background-color: #ecbec7 !important;
}
.actUsedelete
{
  opacity: 1.5 !important;            
  border-color: #eeeeee !important;
  background-color: #fdfdfd !important;
  color: #a2a5a7 !important;
}
.actUsedelete > h6:after
{ 
  content: " " !important;  
}
.info
{
  color: red;
  font-size: 10px;
}
.actUser
{
  opacity: 1.5 !important;            
  border-color: #00800063 !important;
  background-color: #fff  !important;
  color: #000;
}
.actUser > h6:after
{
    font-family: "Font Awesome 5 Free";
    font-style: normal;
    margin-left: .3rem;
    font-variant: normal;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    font-weight: 900;
    color: #87A19B;
    content: "\f058";
    font-family: 'Font Awesome 5 Free';
}
.ply
{
    position: absolute;
    margin: 10px 1px 0 7px;
    color: #ffffffb0;
}

#load_video,#load_image,#load_seond_image
{
    width: 274px;
    position: absolute;
    margin-top: 5%;
    margin-left: 145px;
    display: none;
    opacity: 1 !important;
    z-index: 9999;    
}
.disabled{
  pointer-events: none;
  cursor: default;
}
.info,.infow
{
	color:red;
}
.addCss
{
	display:  none !important;
}
.actUse
{
  opacity: 1 !important;            
  border-color: #ECBEC7;
  background-color: #fff  !important;
  color: #000;
}
.actUse > h6:after
{
    font-family: "Font Awesome 5 Free";
    font-style: normal;
    margin-left: .3rem;
    font-variant: normal;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    font-weight: 900;
    color: #87A19B;
    content: "\f058";
    font-family: 'Font Awesome 5 Free';
}
.costEd {
    position: absolute;
    margin: 44px 8px 8px 72px !important;
    z-index: 9999;
    color: white;
    font-size: 20px;
}
/* Fix Select2: bundled select-2.min.css uses semi-transparent gradients on .select2-dropdown — causes bleed-through */
.select2-dropdown {
  background-color: #fff !important;
  background-image: none !important;
}
.select2-container--default .select2-results > .select2-results__options {
  background-color: #fff !important;
}
.select2-search--dropdown {
  background-color: #fff !important;
}
.select2-container--default .select2-selection--single .select2-selection__rendered {
  background-color: #fff !important;
  background-image: none !important;
}
.select2-container--open .select2-dropdown {
  z-index: 10060;
  box-shadow: 0 0.35rem 1rem rgba(0, 0, 0, 0.12);
  border: 1px solid #ced4da;
}
.select2-container--default.select2-container--open {
  z-index: 10059;
}
.select2-container--default .select2-selection--multiple {
  height: auto !important;
  min-height: calc(1.5em + 1rem + 2px);
  padding-bottom: 4px;
}
.select2-container .select2-selection--multiple .select2-selection__rendered {
  position: static !important;
  display: flex !important;
  flex-wrap: wrap !important;
  top: auto !important;
  padding: 0 8px !important;
}
.select2-container--default .select2-selection--multiple .select2-selection__choice {
  margin-top: 6px !important;
  margin-bottom: 6px !important;
  margin-right: 10px !important;
}
/* 1. Main input background and border */
.select2-container--default .select2-selection--multiple {
    background-color: #f4eee6 !important; /* Matches the light beige container */
    border: 1px solid #d3c9bd !important; 
    border-radius: 8px !important;
    padding: 4px !important;
    min-height: 45px !important;
}

/* 2. The selected tag/chip */
.select2-container--default .select2-selection--multiple .select2-selection__choice {
    background-color: #a4866f !important; /* Warm taupe/brown color */
    border: none !important;
    border-radius: 20px !important; /* Pill shape */
    color: #ffffff !important;
    padding: 5px 12px !important;
    display: flex !important;
    flex-direction: row !important; /* Prepare for ordering */
    align-items: center !important;
    font-size: 14px !important;
    margin: 4px 6px !important;
}

/* 3. The text inside the tag */
.select2-container--default .select2-selection--multiple .select2-selection__choice__display {
    order: 1 !important; /* Move text before the cross */
    padding-left: 0 !important;
    padding-right: 10px !important;
}

/* 4. The remove "x" button (White circle) */
.select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
    order: 2 !important; /* Move cross to the right */
    background-color: #ffffff !important; 
    color: #a4866f !important; /* Brown cross matching the background */
    border-radius: 50% !important;
    width: 16px !important;
    height: 16px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-weight: bold !important;
    font-size: 14px !important;
    border: none !important;
    position: relative !important;
    margin-right: 0 !important;
}

/* Hover state for the remove "x" button */
.select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover {
    background-color: #f0f0f0 !important;
    color: #a4866f !important;
}

/* 5. Dropdown container matching the beige theme */
.select2-dropdown {
    background-color: #f4eee6 !important;
    border: 1px solid #d3c9bd !important;
    border-radius: 8px !important;
    box-shadow: 0 4px 12px rgba(0,0,0,0.05) !important;
}

/* Ensure options container inherits the background */
.select2-container--default .select2-results > .select2-results__options {
    background-color: #f4eee6 !important;
}

/* Individual dropdown item */
.select2-container--default .select2-results__option {
    padding: 10px 16px !important;
    color: #4a4a4a !important;
    font-size: 15px !important;
}

/* Hover and selected states for dropdown items */
.select2-container--default .select2-results__option--highlighted[aria-selected],
.select2-container--default .select2-results__option:hover {
    background-color: #e6ddce !important; /* Slightly darker beige on hover */
    color: #4a4a4a !important;
}

/* Override the previous white background rule for selected items */
.select2-container--default .select2-results__option[aria-selected="true"] {
    background-color: #e6ddce !important;
}