.sponsor-logo {
    object-fit: contain;
}

.sponsor-logo[data-display-size="small"] {
    max-height: 80px;
    max-width: 192px;
}

.sponsor-logo[data-display-size="medium"] {
    max-height: 112px;
    max-width: 256px;
}

.sponsor-logo[data-display-size="large"] {
    max-height: 160px;
    max-width: 320px;
}

.sponsor-logo[data-display-size="original"] {
    height: auto;
    width: auto;
}

.sponsor-logo[data-display-size="fit"] {
    max-height: 100%;
    max-width: 100%;
}

#season-sponsor-formset .season-sponsor-pill,
#season-sponsor-formset .global-sponsor-pill {
    display: flex;
    max-width: 250px;
    width: fit-content;
}

#season-sponsor-formset .global-sponsor-pill {
    font-family: Raleway, Lato, sans-serif;
    font-weight: 700;
    line-height: 1.5;
    color: #333;
    background-color: #fff;
    border: 1px solid #ccc;
    user-select: none;
    white-space: nowrap;
    cursor: pointer;
}

#season-sponsor-formset .season-sponsor-pill .ll-selectpicker-btn > .filter-option {
    padding-right: 0.5rem;
    text-overflow: ellipsis;
}

#season-sponsor-formset .season-sponsor-pill .ll-selectpicker-btn,
#season-sponsor-formset .season-sponsor-pill .collapse-toggle,
#season-sponsor-formset .global-sponsor-pill {
    font-size: 1.2rem;
    border-radius: 1.3rem;
    box-shadow: none;
}

#season-sponsor-formset .season-sponsor-pill .ll-selectpicker-btn,
#season-sponsor-formset .global-sponsor-pill {
    padding: 0.5rem 1.5rem;
    transition-duration: 0.15s;
    transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
}

#season-sponsor-formset .season-sponsor-pill .ll-selectpicker-btn {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    border-right-width: 0;
}

#season-sponsor-formset .season-sponsor-pill .ll-selectpicker-btn:hover,
#season-sponsor-formset .season-sponsor-pill .ll-selectpicker-btn:focus,
#season-sponsor-formset .season-sponsor-pill .ll-selectpicker-btn:active,
#season-sponsor-formset .season-sponsor-pill .collapse-toggle:hover,
#season-sponsor-formset .season-sponsor-pill .collapse-toggle:focus,
#season-sponsor-formset .season-sponsor-pill .collapse-toggle:active {
    box-shadow: inset 0 0 0 .15rem #d5d5d5;
}

#season-sponsor-formset .season-sponsor-pill .collapse-toggle {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    padding: 0.5rem 1rem;
    margin: 0;
    border-left-width: 0;
}

.season-sponsor-form {
    position: relative;
}

.season-sponsor-form .collapse {
    display: block;
    position: absolute;
    top: 100%;
    left: 0;
    background-color: #fff;
    padding: 1.75rem;
    margin-top: 0.5rem;
    border-radius: 1.6rem;
    border: 1px solid #ccc;
    transform: translateY(-1rem);
    opacity: 0;
    visibility: hidden;
    transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    transition-property: visibility, opacity, transform;
    transition-duration: 0.15s;
}

.season-sponsor-form .collapse.in {
    transform: translateY(0);
    opacity: 1;
    visibility: visible;
    z-index: 10;
}

.season-sponsor-form .collapse,
.season-sponsor-form .pretty {
    font-size: 1.2rem;
}

#season-sponsor-formset .season-sponsor-form.inactive .season-sponsor-pill .ll-selectpicker-btn,
#season-sponsor-formset .season-sponsor-form.inactive .season-sponsor-pill .collapse-toggle {
    opacity: 0.5;
    background-color: var(--tw-color-gray-100);
    color: var(--tw-color-gray-500);
    border-color: var(--tw-color-gray-200);
}

#season-sponsor-formset .season-sponsor-form.inactive .season-sponsor-pill .ll-selectpicker-btn:hover,
#season-sponsor-formset .season-sponsor-form.inactive .season-sponsor-pill .ll-selectpicker-btn:focus,
#season-sponsor-formset .season-sponsor-form.inactive .season-sponsor-pill .ll-selectpicker-btn:active,
#season-sponsor-formset .season-sponsor-form.inactive .season-sponsor-pill .collapse-toggle:hover,
#season-sponsor-formset .season-sponsor-form.inactive .season-sponsor-pill .collapse-toggle:focus,
#season-sponsor-formset .season-sponsor-form.inactive .season-sponsor-pill .collapse-toggle:active {
    box-shadow: inset 0 0 0 .15rem var(--tw-color-gray-300);
}

#season-sponsor-formset .season-sponsor-form.to-delete .season-sponsor-pill .ll-selectpicker-btn,
#season-sponsor-formset .season-sponsor-form.to-delete .season-sponsor-pill .collapse-toggle {
    opacity: 0.7;
    background-color: var(--tw-color-red-50);
    color: var(--tw-color-red-700);
    border-color: var(--tw-color-red-200);
}

#season-sponsor-formset .season-sponsor-form.to-delete .season-sponsor-pill .ll-selectpicker-btn:hover,
#season-sponsor-formset .season-sponsor-form.to-delete .season-sponsor-pill .ll-selectpicker-btn:focus,
#season-sponsor-formset .season-sponsor-form.to-delete .season-sponsor-pill .ll-selectpicker-btn:active,
#season-sponsor-formset .season-sponsor-form.to-delete .season-sponsor-pill .collapse-toggle:hover,
#season-sponsor-formset .season-sponsor-form.to-delete .season-sponsor-pill .collapse-toggle:focus,
#season-sponsor-formset .season-sponsor-form.to-delete .season-sponsor-pill .collapse-toggle:active {
    box-shadow: inset 0 0 0 .15rem var(--tw-color-red-300);
}

#season-sponsor-formset .season-sponsor-form.to-delete .collapse {
    border-color: var(--tw-color-red-200);
    background-color: var(--tw-color-red-50);
}

#season-sponsors-admin-content,
#season-sponsors-admin-content p {
    font-family: Raleway, Lato, Arial, sans-serif;
}

#season-sponsors-admin-content p {
    font-size: 1.3rem;
    margin-bottom: 1rem;
}

.messages-container .message p {
    margin-bottom: 0;
}

#add-selected-seasons-form select,
#add-selected-seasons-form .ll-selectpicker-btn {
    width: 350px;
    max-width: 100%;
}

#add-selected-seasons-form .ll-selectpicker-btn > .filter-option {
    padding-right: 0.5rem;
    text-overflow: ellipsis;
}

/* Drag-and-drop styles */

.season-sponsor-form[draggable="true"] {
    transition: all 0.2s ease;
}

.season-sponsor-form.dragging {
    opacity: 0.5;
    transform: scale(1.02);
}

.season-sponsor-form.drag-over {
    transform: translateX(8px);
}

.season-sponsor-form.drag-over .season-sponsor-pill {
    border-left: 3px solid #3b82f6;
}

.season-sponsor-form .drag-handle {
    cursor: grab;
    transition: color 0.2s ease;
}

.season-sponsor-form .dragging,
.season-sponsor-form .dragging .drag-handle {
    cursor: grabbing;
}