/* Praful: Added styleguide.css file in members */
/* ************** New Style Guide ************ */

/* Not for style guide */
.style_guide .bg-gray-100 { background-color: #F0F2F5 !important; }
.selectize-dropdown [data-selectable].option { background-color: #fff !important; cursor: pointer;}
.selectize-input { border-radius: 0.75rem !important; }
#assign-user-popup .modal-dialog { top: 0 !important; }
.style-box {
    background-color: #fff;
    box-shadow: 0px 2px 2px #0000001F;
    border-radius: 15px;
}
.tags-div> div.item {
    cursor: pointer;
    padding: 4px 12px;
    background: #CEF2E1;
    color: #007B59;
    text-transform: capitalize;
    font-size: 13px;
    font-weight: 600;
    border-radius: 5px;
}
.dp-tags-count {
    background-color: #E0E0E0;
    font-weight: 600;
    font-size: 13px;
    color: #696A6C;
    border-radius: 8px;
    padding: 5px 10px;
}

/* Buttons */

/* Common class for every buttons */
.dp-btn {border-radius: 0.75rem !important;font-weight: 600 !important;font-size: 0.875rem !important;height: 42px !important;}

/* Common class for every small buttons */
.dp-btn-sm {border-radius: 11px !important;font-weight: 600 !important;font-size: 0.75rem !important;height: 36px !important;}

/* Class for fill button (blue to black) */
.dp-fill-btn {background: #1d1d1f !important;transition: 0.3s !important; transition-timing-function: ease-out !important;border: 0 !important;}
.dp-fill-btn:hover,
.dp-fill-btn:focus {background: linear-gradient(269deg, #D90097 0%, #2A009D 100%) !important;transition: all 0.3s ease-out !important;}

/* Class for button on top header */
.dp-fill-btn-transform:hover {
    transform: scale(1.04); 
}

/* Class for animated button */
.dp-animated-btn { color: #fff; background: #1D1D1F;border: 0 !important;transition: 0.3s;transition-timing-function: ease-out; z-index: 2;}

.dp-animated-btn:hover,
.dp-animated-btn:focus { background: linear-gradient(45deg, #2A009D, #D90097, #2A009D); background-size: 600% 100%; animation: gradient 1.2s ease infinite; animation-timing-function: linear; animation-direction: alternate-reverse; transform: scale(1.04);  color: #fff; }

@keyframes gradient {
    0% {background-position: 0%}
    100% {background-position: 100%}
}

/* Class for transparent button */
.dp-transparent-btn {color: #414141 !important;background-color: transparent !important;border: 0 !important;transition: all 0.3s ease-out !important;}
.dp-transparent-btn:hover,
.dp-transparent-btn:focus {color: #1d1d1f !important;background-color: #00000012 !important;}

/* Class for Done button */
.dp-done-btn { width: 8rem !important; }



/* Class for black outline button */
.dp-black-outline-btn {color: #1d1d1f !important;background-color: transparent !important;border: 2px solid #1d1d1f !important;transition: all 0.3s ease-out !important;}
.dp-black-outline-btn:hover,
.dp-black-outline-btn:focus {color: #fff !important;background-color: #1D1D1F !important;border: 2px solid transparent !important;}

/* Class for dark outline button */
.dp-outline-btn {border: 1px solid #0000001A !important;background-color: transparent !important;color: #1d1d1f !important;transition: all 0.3s ease-out !important;}
.dp-outline-btn:hover,
.dp-outline-btn:focus {border: 1px solid #00000026 !important;color: #1d1d1f !important;background-color: #0000000D !important;}

/* Class for dark outline small button */
.dp-outline-btn-sm {color: #414141 !important;border: 1px solid #00000017 !important;background-color: #fff !important;transition: all 0.3s ease-out !important; height: 36px !important;font-size: 0.75rem !important;}
.dp-outline-btn-sm:hover,
.dp-outline-btn-sm:focus {border: 1px solid #00000026 !important;color: #1d1d1f !important;background-color: #0000000D !important;}

/* Class for light black outline button */
.dp-outline-btn-light {border: 1px solid #F2F2F2 !important;background-color: transparent !important;color: #5F6368 !important;transition: all 0.3s ease-out !important;}
.dp-outline-btn-light:hover,
.dp-outline-btn-light:focus {border: 1px solid #00000026 !important;color: #1d1d1f !important;background-color: #0000000D !important;}

/* Class for gray button */
.dp-gray-btn {background-color: #0000000D !important;color: #414141 !important;transition: all 0.3s ease-out !important;}
.dp-gray-btn:hover,
.dp-gray-btn:focus {background-color: #00000017 !important;color: #1d1d1f !important;}

/* Class for red delete button */
.dp-del-btn {color: #fff !important;background-color: #CC000B !important;transition: all 0.3s ease-out !important;}
.dp-del-btn:hover,
.dp-del-btn:focus {background-color: #B7000A !important;color: #fff !important;}

/* Class for light red button */
.dp-light-red-btn {color: #E30000 !important;background-color: #E300000D !important;transition: all 0.3s ease-out !important; font-size: 13px !important;}
.dp-light-red-btn:hover,
.dp-light-red-btn:focus {color: #E30000 !important;background-color: rgb(227 0 0 / 15%) !important;}


/* Class for cancel button */
.dp-cancel-btn { color: #7a7a7a !important; }

/* Class for light green button */
.dp-light-green-btn {color: #009F68 !important;background-color: #009F680D !important;transition: all 0.3s ease-out !important; font-size: 0.75rem !important;}
.dp-light-green-btn:hover,
.dp-light-green-btn:focus {color: #009F68 !important;background-color: rgb(0 159 104 / 15%) !important;}

/* Class for light blue button */
.dp-light-blue-btn {color: #0443F2 !important;background-color: #0443F20D !important;border: 0 !important;transition: all 0.3s ease-out !important;font-size: 0.75rem !important;}
.dp-light-blue-btn:hover,
.dp-light-blue-btn:focus {color: #0443F2 !important;background-color: rgb(4 67 242 / 15%) !important;border: 0 !important;}

/* Class for green button */
.dp-green-btn {background-color: #10BF83 !important; color: #fff !important; transition: all 0.3s ease-out !important;}
.dp-green-btn:hover {background-color: #0DD18E !important;}

/* Class for white button */
.dp-white-btn {border: 3px solid transparent !important;background-color: #fff !important;transition: all 0.3s ease-out !important;color: #1d1d1f !important;}
.dp-white-btn:hover,
.dp-white-btn:focus {border: 3px solid #1d1d1f !important;color: #1d1d1f !important;background-color: #fff !important;}

/* Input Fields */

/* Common class for input fields */
.dp-new-field {font-weight: 600 !important;font-size: 0.875rem !important;color: #000; /*padding: 0.75rem 16px !important;*/}
input.dp-new-field { height:auto !important; min-height: 42px !important; }

.dp-new-field-sm { min-height: 38px !important; }

/* textarea.dp-new-field { height: auto !important; } */

/* Class for outline input fields */
.dp-field-outline,
.form-control.dp-field-outline,
.nice-select.form-control.dp-field-outline {border: 1px solid #0000001A !important;background-color: #fff !important;border-radius: 11px !important;transition: all 0.3s !important;}
.dp-field-outline:hover,
.form-control.dp-field-outline:hover,
.nice-select.form-control.dp-field-outline:hover {background-color: #0000000D !important;border: 1px solid #00000033 !important;}
.dp-field-outline:focus,
.form-control.dp-field-outline:focus,
.nice-select.form-control.dp-field-outline:focus {background-color: #fff !important;border: 1px solid #006CFF !important;box-shadow: 0px 0px 8px #205DFA66 !important; outline: none;}

/* Class for gray input fields */
.dp-field-gray,
.form-control.dp-field-gray,
.nice-select.form-control.dp-field-gray {background-color: #0000000D !important;border-radius: 0.75rem !important;transition: all 0.3s !important;border: 2px solid transparent !important; box-shadow: none;}
.dp-field-gray:hover,
.form-control.dp-field-gray:hover,
.nice-select.form-control.dp-field-gray:hover {background-color: #00000017 !important;}
.dp-field-gray:focus,
.form-control.dp-field-gray:focus,
.nice-select.form-control.dp-field-gray:focus {background-color: #fff !important;border: 2px solid #006CFF !important;box-shadow: 0px 0px 8px #205DFA66; outline: none !important;}

/* Class for floating input */
.dp-floating-field { position: relative;}
.dp-floating-field input, .dp-floating-field textarea { background-color: #0000000D !important;border-radius: 0.75rem;transition: all 0.3s !important;border: 0 !important; height: 48px !important; color: #1d1d1f !important; font-weight: 600 !important; font-size: 0.875rem !important; padding-top: 1.5rem !important;padding-inline: 16px !important; }

.dp-floating-field input:hover, .dp-floating-field textarea:hover { background-color: #00000017 !important; }
.dp-floating-field input:focus, .dp-floating-field textarea:focus { background-color: #0000000D !important; outline: none; box-shadow: none; }

.dp-floating-field input + label, .dp-floating-field textarea + label { color: #00000080 !important; font-size: 0.875rem !important; font-weight: 500 !important; position: absolute;left: 16px;top: 15px;transition: transform 200ms ease; pointer-events: none; margin-top: 0 !important; }
.dp-floating-field input:hover + label, .dp-floating-field textarea:hover + label { color: #00000099 !important; }
.dp-floating-field input:focus + label,
.dp-floating-field input + label.freeze,
.dp-floating-field textarea:focus + label,
.dp-floating-field textarea + label.freeze { color: #0000009A !important; font-size: 11px !important; font-weight: 400 !important;margin-left: 3px !important;transform: translateY(-11px);}

.dp-floating-field textarea { height: auto !important; box-shadow: none;}


/* Class for dropdown in addition to above class for input field (dp-new-field & dp-field-gray/dp-field-outline) */
.dp-dropdown-field  { float: none; padding-left: 16px !important;display: flex;align-items: center;}

.dp-dropdown-field.nice-select:after {border-color: #7F8083 !important;border-style: solid !important;border-width: 0 0 2px 2px !important;content: "";display: block;height: 8px !important;position: absolute;width: 8px !important;margin-top: -8px;top: 25%;right: 15px;transition: left 0.1s;transform: rotate(315deg);}

.dp-dropdown-field.nice-select.open:after { transform: rotate(135deg); top: 65% !important; }

.dp-new-field-sm.dp-dropdown-field.nice-select.open:after { transform: rotate(135deg); top: 24px !important; }

/* Class for error input field */
.input-error {border: 1px solid #FF0000 !important;}

/* Class for label style */
.dp-label-style { font-size: 0.875rem !important; color: #1d1d1f !important; font-weight: 600 !important; margin-top: 20px !important;margin-bottom: 10px !important; display: block; }
.dp-label-style2 { font-size: 0.875rem !important; color: #1d1d1f !important; font-weight: 600 !important;margin-bottom: 5px !important; display: block; }

/* Class for main heading text */
.new-heading-style {color: #1d1d1f !important;font-weight: 700 !important;font-size: 1.75rem !important;letter-spacing: -0.025em !important;}

/* Class for sub-heading text */
.dp-sub-heading { color: #1d1d1f !important; font-weight: 700 !important; font-size: 1.5rem !important;}

/* Class for search input field */
.dp-search-field, .customer-search-field .dp-search-field {border: none;border-radius: 0.75rem !important;background-color: #0000000D !important;transition: all 0.3s !important;font-size: 0.875rem !important;font-weight: 600 !important; color: #000 !important; height: 42px !important;}
.dp-search-field:hover, .customer-search-field .dp-search-field:hover {background-color: #00000017 !important;}
.dp-search-field:focus, .customer-search-field .dp-search-field:focus {background-color: #0000000D !important;border: 0 !important;box-shadow: none !important;outline: none !important;}

.customer-search-field1 {width: 255px !important;}

/* Class for input padding */
.dp-input-padding {
    padding: 0.75rem 1rem !important;
}

/* Class for small icon (Gray bg) */
.icon-wrapper-gray {background-color: #0000000D !important;border-radius: 12px !important;width: 42px !important;height: 42px !important;color: #414141 !important;transition: all 0.3s; font-size: 1.375rem !important;}
.icon-wrapper-gray:hover {color: #1d1d1f !important;background-color: #00000017 !important;}

/* Class for small icon transparent */
.icon-wrapper-trans {background-color: transparent !important;border-radius: 12px !important;width: 42px !important;height: 42px !important;color: #414141 !important;transition: all 0.3s; font-size: 1.375rem !important;}
.icon-wrapper-trans:hover {color: #1d1d1f !important;background-color: #00000012 !important;}

/* Extra class for small icon */
.icon-wrapper-sm {width: 36px !important;height: 36px !important; font-size: 1rem !important;}
.icon-wrapper-sm:hover {color: #1d1d1f !important;background-color: #00000017 !important;}

/* Class for custom checkbox */
.dp-custom-checkbox {font-size: 0.875rem !important;line-height: 1.2;}
.dp-custom-checkbox input:checked ~ .checkmark {background-color: #1d1d1f !important;border: 2px solid #1d1d1f !important;}
.dp-custom-checkbox .checkmark {border: 2px solid #606368 !important;border-radius: 4px !important;width: 18px !important;height: 18px !important;}
.dp-custom-checkbox.checkbox-lg .checkmark {width: 20px !important;height: 20px !important;}
.dp-custom-checkbox .checkmark:after {left: 4px !important;top: 0px !important;width: 6px !important;height: 11px !important; border: solid white;border-width: 0 2px 2px 0 !important;}

/* Class for updated checkbox */
.dp-custom-checkbox1 {font-size: 0.875rem !important;line-height: 1.2; transition: all 0.3s; border-radius: 50%;height: 32px;width: 32px; margin-bottom: 0 !important;}
.dp-custom-checkbox1 input:checked ~ .checkmark {background-color: #006cff !important;border: 2px solid #006cff !important;}
.dp-d-multiple-option2.right-border-checkbox .checkbox-container input:checked ~ .checkmark { border: 2px solid #006cff !important; }
.dp-custom-checkbox1 .checkmark {border: 2px solid #606368 !important;border-radius: 4px !important;width: 18px !important;height: 18px !important;top: 50% !important;left: 50% !important;transform: translate(-50%, -50%);}
.dp-custom-checkbox1.checkbox-lg .checkmark {width: 20px !important;height: 20px !important;}
.dp-custom-checkbox1 .checkmark:after {left: 4px !important;top: 0px !important;width: 6px !important;height: 11px !important; border: solid white;border-width: 0 2px 2px 0 !important;}
.dp-custom-checkbox1:hover { background-color: #0000000D; }

/* Black Checkbox */
.dp-custom-checkbox1.checkbox-black input:checked ~ .checkmark {background-color: #1d1d1f !important;border: 2px solid #1d1d1f !important;}

/* Class for custom toggle switch */
.dp-toggle-switch {width: 40px !important;height: 22px !important;position: relative !important;display: inline-block !important;}
.dp-toggle-switch .slider {background-color: #CED0D4 !important;}
.dp-toggle-switch input {
    opacity: 0;
    width: 0;
    height: 0;
}
.dp-toggle-switch .slider { background-color: #CED0D4; }

.dp-toggle-switch input:checked + .slider {background-color: #006CFF !important;}

/* Extra class for blue switch (switch-blue)  */
.dp-toggle-switch.switch-blue input:checked + .slider {background-color: #006CFF !important;}

/* Extra class for blue switch (switch-green)  */
.dp-toggle-switch.switch-green input:checked + .slider {background-color: #10BF83 !important;}

.dp-toggle-switch .slider:before {height: 16px !important;width: 16px !important; left: 4px !important;bottom: 3px !important;box-shadow: 0px 2px 2px #00000029 !important;}

.dp-toggle-switch input:checked + .slider:before {transform: translateX(16px) !important;background-color: #fff !important;}

/* Class for search icon */
.search-icon {color: #7F8083 !important;width: 15px !important;height: 15px !important;}

/* Class for dropdown menu */
.dp-dropdown-wrapper { border-radius: 12px; transition: all 0.3s; }

.dp-dropdown-wrapper:hover,
.dp-dropdown-wrapper.open { background-color: #00000012; }

.dp-dropdown-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 38px;
}
.dp-dropdown-icon > i {
    color: #414141;
    font-size: 1.5rem;
    line-height: normal;
}

.dp-dropdown-menu {border-radius: 12px !important;width: 240px !important;border: 0 !important;box-shadow: 0px 10px 25px #00000027 !important; padding-top: 8px !important;padding-inline: 0.625rem !important;top:70%;}
.dp-dropdown-menu.dp-dropdown-menu-full { padding-inline: 0 !important; }
.dp-dropdown-menu.dp-dropdown-menu-sm{width: 200px !important;}
.dp-dropdown-menu.dp-dropdown-menu-lg{width: 285px !important;}

/* Class for dropdown item */
.dp-dropdown-item {color: #1d1d1f !important;transition: all 0.3s !important; border-radius: 8px !important;padding: 9px 0.625rem !important;font-weight: 500 !important;font-size: 0.875rem !important;}
.dp-dropdown-item:hover {background-color: #0000000D !important;color: #1d1d1f !important;}

.dp-dropdown-menu.dp-dropdown-menu-full .dp-dropdown-item { border-radius: 0 !important; padding-inline: 1.25rem !important; }

.dp-dropdown-menu hr { border-color: #00000012 !important; }

.dp-dropdown-item > i {
    padding-left: 0 !important;
    padding-right: 0.625rem !important;
}

.dp-dropdown-field.nice-select .list {
    border-radius: 12px !important;
    box-shadow: 0px 10px 25px #00000027 !important;
    padding-top: 8px !important;
    padding-bottom: 8px !important;
    max-height: 250px !important;
}

.dp-dropdown-field.nice-select .option {
    border-radius: 0 !important;
    padding-left: 1.25rem !important;
    font-weight: 600 !important;
    font-size: 14px !important;
    color: #1d1d1f !important;
    line-height: 30px !important;
    min-height: 30px !important;
    margin: 0.125rem 0;
}

.dp-dropdown-field.nice-select .option > i {
    margin-right: 0.625rem !important;
}

.dp-dropdown-field.nice-select .option:hover, .dp-dropdown-field.nice-select .option.focus, .dp-dropdown-field.nice-select .option.selected.focus {
    background-color: #0000000D !important;
}

/* Classes for multiple dropdown */
.dp-dropdown-multiple > a {
    border: 1px solid #00000012 !important;
    border-radius: 12px !important;
    height: 48px !important;
    padding: 0.5rem;
}

.dp-d-multiple-option,
.dp-d-multiple-option2 {
    box-shadow: 0px 10px 25px #00000027 !important;
    border-radius: 12px !important;
    border: 0 !important;
    padding: 0 !important;
}

.dp-dropdown-multiple > a .big-circle {
    border: 1px dashed #c6c6c6;
    width: 31px;
    height: 31px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.dp-d-multiple-option .checkbox-container {
    padding-left: 45px !important;
    color: #1d1d1f !important;
    border-radius: 0 !important;
}

.dp-dropdown-multiple .filter_input_title1 .customerimg {
    height: 28px;
    width: 28px;
    outline: 2px solid #fff !important;
    text-transform: uppercase;
}

.dp-dropdown-multiple .filter_input_title1 > div:first-child {
    margin: 0 !important;
}

.dp-dropdown-multiple .filter_input_title1 > div {
    margin: 0 0 0 -10px !important;
}

.dp-dropdown-multiple .filter_input_title1 .cust-avatar-img > img {
    width: 28px;
    height: 28px;
    object-fit: cover;
    object-position: top;
    border-radius: 50%;
    outline: 2px solid #fff !important;
}

.dp-d-multiple-option .cust-avatar-img > img,
.dp-d-multiple-option2 .cust-avatar-img > img {
    width: 28px;
    height: 28px;
    object-fit: cover;
    object-position: top;
    border-radius: 50%;
}

.dp-d-multiple-option .checkbox-container:hover,
.dp-d-multiple-option2 .checkbox-container:hover {
    background-color: #0000000D;
}

.dp-d-multiple-option2 .checkbox-container {
    padding-left: 20px !important;
    color: #1d1d1f !important;
    border-radius: 0 !important;
    transition: all 0.3s;
}

.dp-d-multiple-option .checkbox-container .checkmark {
    left: 15px !important;
}

.dp-d-multiple-option2 .checkbox-container .checkmark {
    left: auto !important;
    border: 0 !important;
    background-color: transparent !important;
}

.dp-d-multiple-option2.right-border-checkbox .checkbox-container .checkmark {
    border: 2px solid #606368 !important;
}

.dp-d-multiple-option .checkbox-container.active-checkbox,
.dp-d-multiple-option2 .checkbox-container.active-checkbox {
    background-color: #006CFF0D;
}

.dp-check-icon.checkbox-container input:checked ~ .checkmark {
    background-color: transparent !important;
}

.dp-check-icon.checkbox-container .checkmark:after {
    border: solid #0443F2;
    border-width: 0 2px 2px 0;
    width: 7px;
    height: 12px;
}

.dropdown-search { width: auto !important }

.dropdown-search .dp-search-field {
    border-radius: 0.75rem 0.75rem 0 0 !important;
    background-color: #fff !important;
}

.dropdown-search .dp-search-field:hover {
    background-color: #0000000D !important;
}

.dp-dropdown-multiple i.fa-xmark,
.dp-dropdown-multiple3 i.fa-xmark {
    color: #696A6C;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #E0E0E0;
    border-radius: 50%;
    width: 26px;
    height: 26px;
    transition: all 0.3s;
}

.dp-dropdown-multiple i.fa-xmark:hover,
.dp-dropdown-multiple3 i.fa-xmark:hover {
    background-color: #1d1d1f;
    color: #fff !important;
}

/* Class for custom tabs */
.dp-tab-link {font-size: 0.875rem !important;font-weight: 600 !important;color: #414141 !important;height: 42px !important;border-radius: 0.75rem !important;transition: all 0.3s !important;}
.dp-tab-link:hover,
.dp-tab-link:focus {background-color: #00000012 !important;color: #1d1d1f !important;}
.dp-tab-link:focus,
.dp-tab-link.dp-tab-active,
.dp-tab-link.dp-tab-active:hover {background-color: #fff !important;color: #1d1d1f !important;}

/* Class for custom tabs - 2nd version */
.dp-tab-link2 {font-size: 0.875rem !important;font-weight: 600 !important;color: #414141 !important;height: 42px !important;border-radius: 0.75rem !important;transition: all 0.3s !important; border: 3px solid transparent !important; background-color: #0000000d !important;}
.dp-tab-link2:hover,
.dp-tab-link2:focus {background-color: #dadadc !important;color: #1d1d1f !important;border: 3px solid transparent !important;}
.dp-tab-link2:focus,
.dp-tab-link2.dp-tab-active,
.dp-tab-link2.dp-tab-active:hover {background-color: #fff !important;color: #1d1d1f !important;border: 3px solid #1d1d1f !important;}

/* Class for custom tabs - 3rd version */
.dp-tab-link3 {font-size: 0.875rem !important;font-weight: 600 !important;color: #414141 !important;height: 42px !important;border-radius: 0.75rem !important;transition: all 0.3s !important; border: 2px solid transparent !important; background-color: ##0000000D !important;}
.dp-tab-link3:hover,
.dp-tab-link3:focus {background-color: #00000012 !important;color: #1d1d1f !important;border: 2px solid transparent !important;}
.dp-tab-link3:focus,
.dp-tab-link3.dp-tab-active,
.dp-tab-link3.dp-tab-active:hover {background-color: #fff !important;color: #1d1d1f !important;border: 2px solid #1d1d1f !important;}

/* Common class for tags (not clickable) */
.dp-tags {min-height: 30px !important;border-radius: 6px !important;font-size: 13px !important;font-weight: 600 !important;}

/* Common class for tags (clickable) */
.dp-tags-link {height: 30px !important;border-radius: 8px !important;font-size: 11px !important;font-weight: 600 !important;border: 1px solid transparent !important;transition: all 0.3s !important;display: flex;align-items: center;}

/* Extra class for different colors of tags */
.dp-tag-green {background-color: #E4FCF0 !important;color: #007B59 !important;}
.dp-tags-link.dp-tag-green:hover,
.dp-tags-link.dp-tag-green:focus {border: 1px solid #007B5940;}

.dp-tag-blue {background-color: #F0F5FF !important;color: #0032E0 !important;}
.dp-tags-link.dp-tag-blue:hover,
.dp-tags-link.dp-tag-blue:focus {border: 1px solid #0032E041;}

.dp-tag-red {background-color: #FFF0F0 !important;color: #D30000 !important;}
.dp-tags-link.dp-tag-red:hover,
.dp-tags-link.dp-tag-red:focus {border: 1px solid #D3000041;}

.dp-tag-purple {background-color: #EDE8FF !important;color: #6A00CC !important;}
.dp-tags-link.dp-tag-purple:hover,
.dp-tags-link.dp-tag-purple:focus {border: 1px solid #6A00CC41;}
/* Yellow tags */
.dp-tag-yellow {background-color: #FBFCE4 !important;color: #E8AA00 !important;}
.dp-tags-link.dp-tag-yellow:hover,
.dp-tags-link.dp-tag-yellow:focus {border: 1px solid #E8AA0041;}

/* Class for the floating label */
.dp-floating-label {color: #0000009A !important;font-size: 11px !important;font-weight: 500 !important;}

/* Class for the default label */
.dp-form-label {color: #1d1d1f !important;font-size: 0.875rem !important;font-weight: 600 !important;margin-top: 20px !important;margin-bottom: 15px !important;}

/* Class for button group */
.dp-btn-group {/*border: 2px solid #0000001A !important;*/color: #7F8083 !important;font-size: 0.875rem !important;font-weight: 600 !important;background-color: #fff !important;height: 42px !important;transition: all 0.3s !important;}

.dp-btn-group button{ transition: all 0.3s; height: 42px !important;}

.dp-btn-group button:first-child { border-radius: 0.75rem 0 0 0.75rem !important; }

.dp-btn-group button:last-child { border-radius: 0 0.75rem 0.75rem 0 !important; }

.dp-btn-group button:hover { border: 1px solid #00000033 !important; background-color: #0000000D !important; color: #7F8083 !important; }

.dp-btn-group button.isselected { border: 3px solid #1D1D1F !important; color: #1D1D1F !important; background-color: #fff !important; }

.dp-btn-group button.btn-grp-active { border: 3px solid #1D1D1F !important; color: #1D1D1F !important; }

.dp-btn-group button.isselected:hover { border: 3px solid #1d1d1f !important; color: #1d1d1f !important; background-color: #fff !important; }

/* Classes for Popups */
.dp-new-popup .modal-content{ box-shadow: 0px 10px 40px #00000038 !important; border-radius: 20px !important; }
.dp-new-popup h1.dp-modal-title { color: #1d1d1f !important; font-weight: 700 !important; font-size: 1.5rem !important;}
.dp-new-popup .modal-content { padding: 30px !important;background: #FFF; }

.dp-new-popup .modal-content .modal-body { padding: 0 !important; }
@media (min-width:768px) {
    .dp-new-popup.popup-wider .modal-dialog { width: 660px !important; }
    .dp-new-popup.popup-wide .modal-dialog { width: 616px !important; }
    .dp-new-popup.popup-medium .modal-dialog { width: 560px !important; }
    .dp-new-popup.popup-small .modal-dialog { width: 460px !important; }
    .dp-new-popup.popup-smaller .modal-dialog { width: 365px !important; }
}

.dp-new-popup .dp-cancel-btn { width: auto !important; }

.dp-description-text { color: #7a7a7a !important; font-weight: 400 !important; font-size: 0.875rem !important; }

.mt-30 { margin-top: 1.875rem !important; }

/* Placeholder */
.dp-new-field::placeholder,
.dp-search-field::placeholder { /* Most modern browsers support this now. */
   color: #00000080 !important;font-weight: 500 !important;transition: all 0.3s;
}

.dp-new-field:hover::placeholder,
.dp-search-field:hover::placeholder { /* Most modern browsers support this now. */
    color: #00000099 !important;
 }

 .dp-search-field::placeholder {
    font-weight: 500 !important;
 }


 /* Mobile responsive */
 @media (max-width: 767px) {
    .new-heading-style { font-size: 1.6rem !important; }
 }

 @media (max-width: 480px) {
    .dp-new-popup .modal-content { padding: 25px 20px !important; }
    .new-heading-style { font-size: 1.5rem !important; }
 }

/* New style for input focus*/
.form-control.new-focus { border: 1px solid transparent !important; }
/* purple border for nice select dropdown */
.form-control.new-focus:focus,
.nice-select.form-control.new-focus:focus {
    border: 1px solid #8000ff !important;
    box-shadow: 0 0 0px 4px #8000FF19 !important;
    background-color: #fff !important;
}