body, html {
    width: 100%;
    height: 100%;
    min-height: -webkit-fill-available;
    height: -webkit-fill-available;
    font-size: 14px;
    line-height: 14px;
    overflow-x: hidden;
}

/* Fonts */

* {
    font-family: 'Poppins', sans-serif !important; 
    font-weight: 500;
    font-size: 14px;
    line-height: 14px;
}

body.js-stop-transition * {
    transition: none !important;
}

@media (max-width: 1600px) {
    body, html {
        font-size: 13px;
        line-height: 13px;
    }
}

a {
    color: black;
    cursor: pointer;
}

a:hover {
    color: #52B787;
}

a.no-color-hover:hover {
    color: inherit;
}

a:focus {
    color: #2C6A4F;
}

h1, h2, h3, h4, h5, h6 {
    color: var(--heading-text-color);
}

.h1 {
    font-family: var(--font-h1-family);
    font-weight: var(--font-h1-weight);
    font-size: var(--font-h1-size);
    line-height: var(--font-h1-line-height);
    letter-spacing: var(--font-h1-letter-spacing);
  }
  
.h2 {
    font-family: var(--font-h2-family);
    font-weight: var(--font-h2-weight);
    font-size: var(--font-h2-size);
    line-height: var(--font-h2-line-height);
    letter-spacing: var(--font-h2-letter-spacing);
}

.h3 {
    font-family: var(--font-h3-family);
    font-weight: var(--font-h3-weight);
    font-size: var(--font-h3-size);
    line-height: var(--font-h3-line-height);
    letter-spacing: var(--font-h3-letter-spacing);
}

.h4 {
    font-family: var(--font-h4-family);
    font-weight: var(--font-h4-weight);
    font-size: var(--font-h4-size);
    line-height: var(--font-h4-line-height);
    letter-spacing: var(--font-h4-letter-spacing);
}

.h5 {
    font-family: var(--font-h5-family);
    font-weight: var(--font-h5-weight);
    font-size: var(--font-h5-size);
    line-height: var(--font-h5-line-height);
    letter-spacing: var(--font-h5-letter-spacing);
}

.p, p {
    font-family: var(--font-p-regular-family);
    font-weight: var(--font-p-regular-weight);
    font-size: var(--font-p-regular-size);
    line-height: var(--font-p-regular-line-height);
    letter-spacing: var(--font-p-regular-letter-spacing);
}

.p-small, .select2-selection__choice, .select2-selection__choice__display, .file-input, .file-input a, .file-input label {
    font-family: var(--font-p-small-family);
    font-weight: var(--font-p-small-weight);
    font-size: var(--font-p-small-size);
    line-height: var(--font-p-small-line-height);
    letter-spacing: var(--font-p-small-letter-spacing);
}

.p-large {
    font-family: var(--font-p-large-family);
    font-weight: var(--font-p-large-weight);
    font-size: var(--font-p-large-size);
    line-height: var(--font-p-large-line-height);
    letter-spacing: var(--font-p-large-letter-spacing);
}

p {
    color: var(--paragraph-text-color);
}

.profile-name {
    color: var(--paragraph-text-color);
    font-size: 0.95236rem;
    font-style: normal;
    font-weight: 500;
    line-height: 150.18%; /* 1.43029rem */
    letter-spacing: -0.04764rem;
}

.company-name {
    color: var(--light-text-color);
    font-size: 0.71429rem;
    font-style: normal;
    font-weight: 300;
    line-height: 150.18%; /* 1.07271rem */
    letter-spacing: -0.03571rem;
}

.light-text-color {
    color: var(--light-text-color);
}

.navbar-item-text-column {
    color: var(--paragraph-text-color);
    font-size: 1.08421rem;
    font-style: normal;
    font-weight: 400;
    line-height: 150.18%; /* 1.62836rem */
    letter-spacing: -0.05421rem;
}

.rte p, .rte span p, .rte p span, .rte ul li, .rte u, .rte a {
    font-family: var(--font-p-regular-family);
    font-weight: var(--font-p-regular-weight);
    font-size: var(--font-p-regular-size);
    line-height: var(--font-p-regular-line-height);
    letter-spacing: var(--font-p-regular-letter-spacing);
}

.rte h3 {
    font-family: var(--font-h3-family);
    font-weight: var(--font-h3-weight);
    font-size: var(--font-h3-size);
    line-height: var(--font-h3-line-height);
    letter-spacing: var(--font-h3-letter-spacing);
}

.rte strong {
    font-size: inherit;
    line-height: inherit;
}

.font-inherit {
    font: inherit;
}

.large-month {
    color: #000;
    font-size: 1.7415rem;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
}

.large-date {
    color: #FFF;
    font-family: Poppins;
    font-size: 52.478px;
    font-style: normal;
    font-weight: 700;
    line-height: 100%;
}

.error-message {
    color: var(--error-message-color) !important;
}

.cta-title {
    font-size: 40px;
    font-weight: 600;
    line-height: 45px; /* 112.5% */
    letter-spacing: -0.8px;
}

@media (max-width: 991px) {
    .cta-title {
        font-size: 30px;
        font-style: normal;
        line-height: 32px;
        letter-spacing: -0.6px;
    }
}

.checkbox-label {
    position: relative;
    top: 2px;
}

/* End Font */

.main-container {
    padding: 40px 41px;
    max-width: 1500px;
    margin: auto;
}

@media (max-width: 1200px) {
    .main-container.full-width-mobile {
        padding: 0px;
    }

    .main-container.full-width-mobile .tile {
        padding-left: 36px !important;
        padding-right: 0px !important;
        border-radius: 0px;

    }
}
.tile.form-tile .form-label.label {
    background-color: #F7F7F7;
}

@media (max-width: 1200px) {
    .main-container {
        padding: 27px 36px;
    }

    .tile.form-tile .form-label.label {
        background-color: white;
    }
}

/* Menu */

.menu-left {
    padding: 20px 25px;
    padding-bottom: 20px;
    padding-bottom: 20px;
    position: fixed;
    height: 100%;
    width: 305px;
    background: var(--navbar-bg);
    overflow: unset !important;
    z-index: 3000;
}

.navbar-item {
    border-radius: 5.833px;
    padding: 5px 12px;
    cursor: pointer;
    margin-bottom: 10.83px; 
}

.navbar-item:hover {
    background: var(--navbar-item-bg-hover);
}

.navbar-item:hover .navbar-item-text-column {
    color: var(--navbar-item-text-color-hover);
}

.menu-left .main-logo {
    padding-left: 12px;
    padding-right: 12px;
    margin-top: 25px;
}

.menu-left.closed .main-logo {
    margin-left: 0px;
}

.menu-left.closed .profile-image-column {
    width: 100%;
}

.menu-left.closed #count-container {
    position: absolute;
    right: 26px;
}

.menu-left.closed:not(.active) .navbar-item:not(.active):hover {
    background: none;
}

.navbar-item.active {
    background: var(--navbar-item-bg-active);
}

.navbar-item.active .navbar-item-text-column {
    color: var(--navbar-item-text-color-active);
}

.navbar-item.active svg {
    fill: var(--navbar-item-text-color-active);
}

.navbar-icon-column svg {
    fill: var(--navbar-item-text-color);
}

.navbar-item:not(.active):hover svg {
    fill: var(--navbar-item-text-color-hover);
}

.navbar-item.active svg.message-icon {
    filter: brightness(0) invert(1);
}

.navbar-item:not(.active):hover svg.message-icon {
    filter: invert(36%) sepia(10%) saturate(1912%) hue-rotate(101deg) brightness(93%) contrast(90%);
}

.profile-section {
    border-top: 0.8px solid #DADADA;
    padding-top: 24.17px;
}

@media (max-width: 1200px) {
    .toggle-sidebar-button {
        display: none;
    }
}

.navbar-toggler {
    border: none !important;
}

.navbar-toggler:focus, .navbar-toggler:active {
    outline: none !important;
    box-shadow: none;
 }

/* End of Menu */

/* Tiles */

.tile {
    background-color: var(--tile-bg);
    border-radius: 12px;
    width: 100%;
    overflow: hidden;
}

.programme-tile.tile {
    min-height: 100%;
}

@media (max-width: 1400px) {
    .programme-tile.tile {
        min-height: none;
    }
}

@media (min-width: 576px) {
    .tile.perk-tile {
        height: 329px; 
    }
}

a:hover .tile {
    transform: translate3D(0,-1px,0) scale(1.03);
    transition: all .4s ease;
    cursor: pointer;
}

@media (max-width: 1200px) {
    .form-tile.tile {
        background-color: white;
        border-radius: 0px;
    }

    .tile.tile-none {
        background-color: white;
    }
}

.border-hover.active {
    background-color: #52B787;
    
}

.border-hover.active * {
    color: #FFF;
}

.border-hover:not(.active):hover {
    outline: 2px solid #52B787;
    color: inherit;
    outline-offset: -2px;
}

.padding {
    padding: 20px;
}

.background-img {
    width: 100%;
    height: 360px;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}

.background-img.portrait {
    height: 180px;
}

.border-bottom-tile {
    border-bottom: 1px solid #E0E3E7;
}

@media (max-width: 1400px) {
    .background-img {
        width: 100%;
        height: 250px;
    }

    .tile {
        width: auto;
    }

    .background-img.border-radius-mobile {
        border-radius: 8px;
    }

    .border-bottom-tile {
        border-bottom: none;
    }
    
}

/* End Tiles */

/* Buttons */

.button {
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 16px;
    text-decoration: underline;
    color: #000;
}

.btn-arrow {
    color: #47494B !important;
    font-size: 0.85714rem !important;
    font-style: normal !important;
    font-weight: 400 !important;
    line-height: normal;
    text-transform: capitalize;
}

.arrow {
    transition: 0.3s;
}

.btn-arrow:hover {
    color: #47494B !important;
}

.btn-arrow:hover .arrow {
    transform: translate(5px);
}

.upload-image-button {
    border-radius: 5px;
    border: 0.8px solid #E0E3E7;
    background-color: transparent;
    padding: 4px 8px;
    color: #191B1E;
}

.btn.btn-primary {
    font-family: var(--font-p-regular-family);
    font-weight: 600;
    font-size: var(--font-p-regular-size);
    line-height: var(--font-p-regular-line-height);
    letter-spacing: var(--font-p-regular-letter-spacing);
    background-color: var(--primary-button-bg-color);
    color: var(--primary-button-text-color);
    padding: 10px 24px;
    width: 100%;
    border-radius: 4px;
	cursor: pointer !important;
	outline: inherit !important;
    border: 2px solid var(--primary-button-bg-color);
}

.btn.btn-danger {
    padding: 10px 24px;
}

.btn.btn-primary.override-programmes-color {
    background-color: #52B787;
    border-color: #52B787;
}

.btn.btn-primary.override-programmes-color:hover {
    border-color: #41916C;
    background-color: #41916C;
}

.btn.btn-primary:hover {
    border-color: var(--primary-button-bg-color-hover);
    background-color: var(--primary-button-bg-color-hover);
    color: var(--primary-button-text-color-hover);
}

.btn.btn-primary:focus {
    background-color: var(--primary-button-bg-color-clicked);
    border-color: var(--primary-button-border-color-clicked);
}

.btn.btn-transparent {
    font-family: var(--font-p-regular-family);
    font-weight: 600;
    font-size: var(--font-p-regular-size);
    line-height: var(--font-p-regular-line-height);
    letter-spacing: var(--font-p-regular-letter-spacing);
    background-color: transparent;
    color: #FFF;
    border-radius: 8px;
    cursor: pointer !important;
	outline: inherit !important;
    border: 1px solid #FFF;
    padding: 12px 21px;
}

.btn.btn-transparent:focus {
    border-color: #FFF;
    color: #FFF;
}

.remove-button-styling {
    background: none;
    color: inherit;
    border: none;
    padding: 0;
    font: inherit;
    cursor: pointer;
    outline: inherit;
}

.remove-button-styling:focus {
    outline: revert;
}

.submit-cta {
    background-color: #F7F7F7;
}

@media (max-width: 1200px) {
    .submit-cta {
        background-color: #FFF;
    }
}

/* End Buttons */

/* Input Field */

input {
    background-color: var(--input-bg);
    border: 0.833px solid var(--input-border-color);
    border-radius: 0.23807rem;
    padding: 6px 5px;
}

input:focus {
    outline: none;
}

input::placeholder {
    font-family: var(--font-p-regular-family);
    font-weight: var(--font-p-regular-weight);
    font-size: var(--font-p-regular-size);
    line-height: var(--font-p-regular-line-height);
    letter-spacing: var(--font-p-regular-letter-spacing);
    color: #47494B;
}
  
::-ms-input-placeholder { /* Edge 12 -18 */
    color: #47494B;
    font-size: 0.95236rem;
    font-style: normal;
    font-weight: 400;
    line-height: 150.18%; /* 1.43029rem */
    letter-spacing: -0.04764rem;
}

input.search {
    padding-left: 33px;
}

input.search.navbar {
    width: 380px;
}

@media (max-width: 1200px) {
    input.search.navbar {
        width: 100%;
    }
}

.search-filter.active {
    background-color: #B7E4C7;
}

.search-filter {
    background-color: #F7F7F7;

}

input.filter-checkbox {
    accent-color: #52B787;
}

.label.form-label {
    background: white;
    position: absolute;
    top: -10px;
    left: 10px;
    padding-right: 4px;
    padding-left: 4px;
    font-weight: 600;
}

.event-input{
    background-color: transparent;
    border-radius: 4px;
    border: 1px solid #777F89;
    padding-left: 16px;
    height: 52px; 
    width: 100%;
    color: var(--light-text-color);
    font-family: var(--font-p-regular-family);
    font-weight: var(--font-p-regular-weight);
    font-size: var(--font-p-regular-size);
    line-height: var(--font-p-regular-line-height);
    letter-spacing: var(--font-p-regular-letter-spacing);
}

select.event-input {
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M12 15.4L6 9.4L7.4 8L12 12.6L16.6 8L18 9.4L12 15.4Z' fill='%23A3A4A5'/%3E%3C/svg%3E") no-repeat 99.5% 50%;
    -moz-appearance: none; 
    -webkit-appearance: none; 
    appearance: none;
}

.select2-container--default .select2-selection--single, .select2-selection.select2-selection--multiple {
    background-color: transparent !important;
    border-radius: 4px !important;
    border: 1px solid #777F89 !important;
    padding-left: 16px !important;
    height: 52px !important; 
    width: 100% !important;
    color: var(--light-text-color);
    font-family: var(--font-p-regular-family);
    font-weight: var(--font-p-regular-weight);
    font-size: var(--font-p-regular-size);
    line-height: var(--font-p-regular-line-height);
    letter-spacing: var(--font-p-regular-letter-spacing);
}

.select2-selection__rendered {
    color: var(--light-text-color);
    font-family: var(--font-p-regular-family);
    font-weight: var(--font-p-regular-weight);
    font-size: var(--font-p-regular-size);
    line-height: var(--font-p-regular-line-height);
    letter-spacing: var(--font-p-regular-letter-spacing);
}

.select2-container--default .select2-selection--single {
    height: 52px !important; 
}

.select2-selection.select2-selection--multiple {
    height: auto !important; 
    min-height: 52px !important;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
    top: 12px !important;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
    padding-top: 11px;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
    color: #777F89 !important;
}

.select2-container .select2-selection--single .select2-selection__rendered {
    padding-left: 0px !important;
}

textarea.event-input {
    height: 219px;
    outline: none;
    padding: 16px;
}

.select2-container--default .select2-selection--multiple .select2-selection__rendered {
    padding: 0px !important;
}

.select2-container--default .select2-selection--multiple .select2-selection__choice {
    background-color: #B7E4C7 !important;
    border: none !important;
    color: #47494B;
    padding-left: 5px !important;
    margin-right: 8px !important;
}

.select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
    color: #47494B;
    padding: 0px !important;
}

.select2-container--default .select2-selection--multiple .select2-selection__choice__remove, .select2-selection__choice__remove {
    font-weight: normal !important;
    color: #47494B !important;
    top: 1px !important;
    position: relative !important;
}

input:-webkit-autofill,
input:-webkit-autofill:hover, 
input:-webkit-autofill:focus, 
input:-webkit-autofill:active{
    -webkit-box-shadow: 0 0 0 30px white inset !important;
    -webkit-text-fill-color: #7A7A7A;
}

input.password-reset:-webkit-autofill,
input.password-reset:-webkit-autofill:hover, 
input.password-reset:-webkit-autofill:focus, 
input.password-reset:-webkit-autofill:active {
    -webkit-box-shadow: 0 0 0 30px #F7F7F7 inset !important;
}

@media (max-width: 991px) {
    .form-tile input.password-reset:-webkit-autofill,
    .form-tile input.password-reset:-webkit-autofill:hover, 
    .form-tile input.password-reset:-webkit-autofill:focus, 
    .form-tile input.password-reset:-webkit-autofill:active {
        -webkit-box-shadow: 0 0 0 30px white inset !important;
    }

}

.custom-checkbox {
    display: inline-block;
    position: relative;
    cursor: pointer;
    user-select: none;
  }
  
  .custom-checkbox input {
    opacity: 0;
    cursor: pointer;
    margin: revert;
  }
  
  .custom-checkbox .checkmark {
    position: absolute;
    top: 0;
    right: 0px;
    height: 20px;
    width: 20px;
    background-color: #fff;
    border: 2px solid black;
    border-radius: 4px;
  }
  
  .custom-checkbox input:checked ~ .checkmark {
    background-color: #4CAF50; /* green background for checked state */
    border-color: #4CAF50;
  }
  
  .custom-checkbox .checkmark:after {
    content: "";
    position: absolute;
    display: none;
  }
  
  .custom-checkbox input:checked ~ .checkmark:after {
    display: block;
  }
  
  .custom-checkbox .checkmark:after {
    left: 5px;
    top: 2px;
    width: 6px;
    height: 10px;
    border: solid white;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
  }

/* End Input Field */

/* Tags */
.tag {
    padding: 4px 14px;
    border: 0.417px solid #000;
    border-radius: 25px;
    font-size: 10px;
    font-style: normal;
    font-weight: 300;
    line-height: 150.18%; /* 15.018px */
    letter-spacing: -0.5px;
}

.primary-tag, .select2-selection__choice__display {
    background-color: var(--primary-tag-bg-color) !important;
    color: var(--primary-tag-text-color) !important;
    border-radius: 3px !important; 
    padding: 2px 8px !important;
    display: inline-block !important;
}

.primary-tag.icon {
    display: flex;
    gap: 4px;
    flex-direction: row;
    align-items: center;
    box-shadow: 0px 1px 4px 0px rgba(12, 12, 13, 0.05);
}

a.primary-tag {
    background-color: #F7F7F7 !important;
}

a.primary-tag.active {
    background-color: var(--primary-tag-bg-color) !important;
}

a.primary-tag:hover {
    transform: translate3D(0,-1px,0) scale(1.03) !important;
    transition: all .4s ease !important;
    cursor: pointer !important;
    color: inherit !important;
}

/* End Tags */

/* Calendar */

.box.day {
    height: 108px;
}

.events-list, .future-events-list {
    display: flex;
    align-items: stretch;
}

.event {
    background-color: var(--navbar-bg);
    border-radius: 3px 0px 0px 3px;
}

.event .tab {
    border-radius: 3px 0px 0px 3px;
}

.events-list .event .tab {
    min-width: 10px;
}

.events-list.large .event .tab {
    width: 13px;
}

.events-list.large .event .text {
    padding-left: 12px;
}

.events-list .event .text {
    padding-left: 4px;
}

.events-list:not(.large) .event .text .p {
    line-height: 0.78686rem; 
    font-size: 0.59014rem;
}

.featured-event {
    background-color: var(--navbar-bg);
    border-radius: 0.85714rem;
}
/* End Calendar */

/* Carousel */
.gallery-cell-3 {
    width: 171px; /* full width */
    height: auto; /* height of carousel */
    margin-right: 16px;
}
/* End Carousel */

.select2-container--default .select2-selection--multiple .select2-selection__choice, .select2-search__field {
    margin-top: 17px !important;
}

.select2-container--default .select2-selection--multiple .select2-selection__choice {
    margin-left: 0px !important;
}

.select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
    border-right: none !important;
}

.select2-selection__clear {
    display: none;
}

.no-button-styling {
	color: inherit !important;
	font: inherit !important;
	cursor: pointer !important;
	outline: inherit !important;
}

.oauth-button {
    border-radius: 10px;
    border: 1px solid #E0E3E7;
    background:#FFF;
    box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.03);
    text-align: center;
    height: 46px;
}

.profile-indent {
    margin-left: 120px;
}

.profile-image-large {
    width: 95px
}

.company-box-indent {
    margin-left: 70px;
}

@media (max-width: 1200px) {
    .profile-indent {
        margin-left: 0px;
    }

    .profile-image-large {
        width: 69px;
    }
    
    .company-box-indent {
        margin-left: 0px;
    }    
}

.sticky-right-boxes {
    margin-top: 118px;
}

@media (max-width: 1200px) {
    .sticky-right-boxes {
        margin-top: 0px;
    }
}

a.kebab-menu-favourite:hover path {
    fill: #52B787;
}

.favourite-star:hover path {
    fill: #52B787;
}

/* Filters */

.filter-form-container {
    background: #F7F7F7; 
    border-radius: 12px; 
    width: 350px; 
    position: absolute; 
    right: 41px; 
    box-shadow: 0px 4px 4px -1px rgba(12, 12, 13, 0.10), 0px 4px 4px -1px rgba(12, 12, 13, 0.05);
    z-index: 900;

}

[aria-expanded="true"] .filter-subtitle {
    font-weight: 600;
}

a.no-focus:focus {
    color: var(--paragraph-text-color) !important;
}

.filter-stack {
    display: flex;
    flex-direction: row;
    align-items: center;
    align-self: stretch;
}

@media (max-width: 1200px) {
    .filter-stack {
        display: flex;
        flex: 1 1 auto;
        flex-direction: column;
        align-self: stretch;
        align-items: start;
    }

    .sub-seach-bar { 
        width: 100%;
    }

    .filter-form-container  {
        width: calc(100% - 76px);
        left: 38px;
        right: 40px;
    }
}

.related-items-border {
    border-bottom: 1px solid #A3A4A5;
}

@media (max-width: 992px) {
    .related-items-border {
        border-bottom: none;
    }
    
}
/* Container for each kebab button and menu */
.kebab-container {
    position: relative;
    display: inline-block; /* Adjust as needed */
  }
  
/* Style for the kebab button */
.kebab-button {
    font-size: 24px;
    background: transparent;
    border: none;
    cursor: pointer;
    z-index: 800;
    position: relative;
}

/* Base style for the menu (hidden by default) */
.kebab-menu-wrapper {
    display: none;
    position: absolute;
    top: 30px; /* Adjust based on your button size */
    right: 0;
    z-index: 900;
    border-radius: 12px;
    box-shadow: 0px 263px 74px 0px rgba(0, 0, 0, 0.00), 0px 168px 67px 0px rgba(0, 0, 0, 0.01), 0px 95px 57px 0px rgba(0, 0, 0, 0.05), 0px 42px 42px 0px rgba(0, 0, 0, 0.09), 0px 11px 23px 0px rgba(0, 0, 0, 0.10);
    min-width: 220px;
}

.message.kebab-menu-wrapper {
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
}

.kebab-menu-wrapper {
    background: #F7F7F7;
}

/* Show the menu when it has the 'show' class */
.kebab-menu-wrapper.show {
    display: block;
}

/* Style the menu list */
.kebab-menu-wrapper ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

/* Style the menu items */
.kebab-menu-wrapper li {
    padding: 8px 16px;
}

/* Hover effect for menu items */
.kebab-menu-wrapper li:hover {
    background-color: #f1f1f1;
}

.kebab-item {
    background: white;
}

.kebab-menu {
    background: white;
    border-radius: 12px;
}

.kebab-menu-wrapper.message {
    position: relative;
    top: unset;
    right: unset;
    left: unset;
    bottom: unset;
    width: unset;
}

.popup {
    z-index: 950;
    background: #F7F7F7;
    width: 462px;
    top: 20px;
    right: 20px;
    left: unset;
}

@media (max-width: 1200px) {
    .popup {
        width: calc(100% - 72px);
        left: 36px;
        right: 36px;
        bottom: 20px;
        top: unset;
    }
}

.no-scrollbar {
    -ms-overflow-style: none;  /* Internet Explorer 10+ */
    scrollbar-width: none;
}

.no-scrollbar::-webkit-scrollbar {
    display: none;  /* Safari and Chrome */
}

.chat__item__container {
    border-radius: 8px;
    background-color: white;
    filter: drop-shadow(0px 1px 4px rgba(12, 12, 13, 0.05));
}

.ql-toolbar, .chat-text-input {
    border-radius: 8px 8px 0px 0px;
    background: white;
    resize: none;
    border: none;
    padding-bottom: 0px;
}

.chat-toolbar-container  {
    border-radius: 0px 0px 8px 8px;
}

.ql-container, .chat-text-input, .chat-toolbar-container {
    background: white;
}

@media (max-width: 1200px) {
    .chat__item__container {
        background-color: #F7F7F7;
        margin-left: -36px;
        margin-right: -36px;
        margin-bottom: -27px;
    }

    .ql-toolbar.ql-snow, .chat-text-input, .chat-toolbar-container {
        background: #F7F7F7 !important;
        border: none !important;
    }
    
    .ql-container {
        background: #F7F7F7;
        border: none !important;
    }
}

.chat-text-input::placeholder {
    color: #A3A4A5;
    font-family: var(--font-p-regular-family);
    font-weight: var(--font-p-regular-weight);
    font-size: var(--font-p-regular-size);
    line-height: var(--font-p-regular-line-height);
    letter-spacing: var(--font-p-regular-letter-spacing);
}

.modal-body {
    padding-top: 0px !important;
}

.modal-header {
    border-bottom: none !important;
}

.modal-footer {
    border-top: none !important;
    padding-top: 0px !important;
}

.pending {
    display:none;
}

.htmx-request .pending {
    display:inline;
}

.htmx-request.pending {
    display:inline;
}

.approve-decline {
    display: flex;
}

.htmx-request.approve-decline {
    display: none;
}

@media (max-width: 1200px) {
    .hidden-chat-mobile {
      display: none !important;
    }
}

.cta-tile {
    background: #52B787; 
    border-radius: 9px; 
    height: 290px; 
    max-width: 860px;
}

@media (max-width: 991px) {
    .cta-tile {
        height: unset; 
    }
}

#modalCrop .modal-body {
    max-height: 500px;
}

/* TinyMCE */

.tox.tox-tinymce {
    border-radius: 4px;
    border-color: #777F89 !important;
}

.tox .tox-toolbar-overlord, .tox .tox-edit-area__iframe, .tox .tox-statusbar, .tox .tox-toolbar__primary { 
    background-color: var(--tile-bg) !important;
}

.mce-content-body {
    color: var(--light-text-color) !important;
}

/* End TinyMCE */

.breadcrumb-link {
    color: #777F89;
    font-family: var(--font-p-small-family);
    font-weight: var(--font-p-small-weight);
    font-size: var(--font-p-small-size);
    line-height: var(--font-p-small-line-height);
    letter-spacing: var(--font-p-small-letter-spacing);
}

.breadcrumb-stack {
    display: flex;
    align-items: center;
}

.breadcrumb-chevron {
    padding: 0px 5px;
}

.unread-notifications-icon {
    position: absolute;
    right: 9px;
    bottom: 1px;
}

.feedback-survey-notification-image {
    width: 100%;
    height: 160px;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}

.choice-box { 
    border: 1px solid #777F89;
    padding: 35px;
    border-radius: 4px;
    cursor: pointer;
    width: 79px;
    text-align: center;
}

.choice-box-container {
    width: 79px;
    margin-right: 8px;
}

@media (max-width: 1400px) {
    .choice-box { 
        padding: 15px;
        width: 41px;
    }
    
    .choice-box-container {
        width: 41px;
    }
}

@media (max-width: 405px) {
    .choice-box { 
        padding: 10px;
        width: 38px;
    }

    .choice-box-container {
        width: 38px;
    }
}

.choice-box:hover {
    transform: translate3D(0,-1px,0) scale(1.03);
}

input[type="radio"]:checked + .choice-box {
    border-color: #52B787;
    color: #52B787;
}

.htmx-request .htmx-disable-pointer-event {
    pointer-events: none;
    opacity: 0.7;
}

.mobile-navbar {
    display: none;
}

@media (max-width: 1200px) {
    .mobile-navbar {
        display: flex;
    }
}