/* Toast */

.progress-bar {
    transition: width 100ms linear;
}

.toast-list .toast {
    max-width: calc(100vw - 1.5rem);
}

.toast-list .toast-body {
    overflow-wrap: anywhere;
}

/* Zurück-Navigation */

.go-back:active {
    background-color: var(--bs-gray-100) !important;

}

/* Registrierung */

.stepper-item {
    flex: 1 1 0;
    min-width: 0;
}

.stepper-item:not(:last-child)::after {
    position: absolute;
    top: 0.9375rem;
    right: calc(-50% + 1.25rem);
    left: calc(50% + 1.25rem);
    height: 0.125rem;
    background-color: var(--bs-border-color);
    content: "";
}

.stepper-item-complete:not(:last-child)::after {
    background-color: var(--bs-primary);
}

.stepper-indicator {
    width: 2rem;
    height: 2rem;
    border: 0.125rem solid var(--bs-border-color);
    background-color: var(--bs-body-bg);
    color: var(--bs-secondary-color);
    font-size: 0.8125rem;
}

.stepper-indicator svg {
    width: 1rem;
    height: 1rem;
    stroke-width: 3;
}

.stepper-item-complete .stepper-indicator,
.stepper-item-active .stepper-indicator {
    border-color: var(--bs-primary);
    background-color: var(--bs-primary);
    color: var(--bs-white);
}

.stepper-item-active .stepper-indicator {
    box-shadow: 0 0 0 0.25rem var(--bs-focus-ring-color);
}

.stepper-label {
    color: var(--bs-secondary-color);
    font-size: 0.75rem;
    font-weight: 500;
    overflow-wrap: anywhere;
}

.stepper-item-complete .stepper-label,
.stepper-item-active .stepper-label {
    color: var(--bs-body-color);
    font-weight: 600;
}

.stepper-item-complete .stepper-label,
.stepper-item-complete .stepper-indicator {
    cursor: pointer;
}

.stepper-item-complete:has(.stepper-label:hover) .stepper-indicator,
.stepper-item-complete .stepper-indicator:hover {
    background-color: var(--bs-link-hover-color);
    border-color: var(--bs-link-hover-color);
}

/* Login */

.collapse-toggle-content {
    min-height: 0;
}

.collapse-toggle-container {
    grid-template-rows: 1fr;
}

.collapse-toggle-container[aria-expanded="true"] {
    grid-template-rows: 0fr;
}

.form-check-input:not(:checked) {
    background-color: var(--bs-secondary-bg) !important;
}

.admin-nav-item:hover {
    background-color: var(--bs-gray-100);
}

/* Admin-Inseratstabellen */
.listing-admin-table {
    max-height: min(70vh, calc(100dvh - 14rem));
}

.listing-admin-table thead th {
    font-size: 0.75rem;
    letter-spacing: 0.04em;
}

.listing-admin-table .form-control,
.listing-admin-table .form-select {
    min-width: 7rem;
    border-color: transparent;
    background-color: transparent;
    box-shadow: none;
}

.listing-admin-table .form-control:focus,
.listing-admin-table .form-select:focus {
    border-color: var(--bs-primary);
    background-color: var(--bs-body-bg);
    box-shadow: 0 0 0 0.2rem var(--bs-focus-ring-color);
}

.create-landlord-rules-toggle svg {
    transition: transform 0.15s ease-in-out;
}

.create-landlord-rules-toggle[aria-expanded="true"] svg {
    transform: rotate(180deg);
}

.listing-admin-table .editable-control--dirty {
    border-color: var(--bs-warning) !important;
    background-color: var(--bs-warning-bg-subtle);
}

.listing-admin-table .editable-control--dirty.is-invalid {
    border-color: var(--bs-danger) !important;
    background-color: var(--bs-danger-bg-subtle);
}

.listing-admin-table .editable-table {
    border-collapse: separate;
    border-spacing: 0;
    table-layout: fixed;
    width: max-content !important;
    min-width: 100%;
}

.listing-admin-table .editable-table__header {
    cursor: grab;
}

.editable-table__sort-icon {
    right: 0.5rem;
    width: 1.5em;
    height: 1.5em;
    stroke: currentColor;
}

.editable-table__header--sorted {
    padding-right: 2.75em !important;
}

.editable-table[data-interactions-locked="true"] tbody {
    filter: grayscale(1);
    opacity: 0.55;
}

.listing-admin-table .editable-table__header--dragging {
    opacity: 0.45;
}

.listing-admin-table .editable-table__header--drop-target {
    box-shadow: inset 3px 0 var(--bs-primary);
}



.listing-admin-table .editable-table .form-control,
.listing-admin-table .editable-table .form-select {
    min-width: 0;
}

.listing-admin-table .editable-table__cell--resizable {
    cursor: col-resize;
}

/* Lucide */

.thin-lines {
    stroke-width: 1.5;
}

/* Inseratserstellung */
#room_count_wrapper {
    display: none;
}

.create-listing-form:has(#listing_type_flat:checked) #room_count_wrapper {
    display: block;
}

.selection-status {
    opacity: 0;
    transition: opacity .15s ease;
}

.listing-type-section .btn-check:not(:checked)+.btn {
    background-color: var(--bs-white);
}

.btn-check:checked+.btn .selection-hint {
    color: rgba(255, 255, 255, .82);
}

.btn-check:checked+.btn .selection-status {
    opacity: 1;
}

#listing_description {
    min-height: 12rem;
}

#listing_description .pell {
    border: 1px solid var(--bs-border-color);
    border-radius: var(--bs-border-radius);
    overflow: hidden;
}

#listing_description.is-invalid .pell {
    border-color: var(--bs-danger);
}

#listing_description .pell-actionbar {
    background: var(--bs-tertiary-bg);
    border-bottom: 1px solid var(--bs-border-color);
    padding: .25rem;
}

#listing_description .pell-button {
    background: transparent;
    border: 0;
    border-radius: var(--bs-border-radius-sm);
    cursor: pointer;
    min-height: 2rem;
    min-width: 2rem;
}

#listing_description .pell-button:hover,
#listing_description .pell-button-selected {
    background: var(--bs-secondary-bg);
}

#listing_description .pell-content {
    min-height: 10rem;
    outline: 0;
    overflow-y: auto;
    padding: .75rem;
}

.pell-content:empty::before {
    content: "Beschreibung hier einfügen...";
    color: #888;
    pointer-events: none;
}

.popover-extra-wide {
    width: 25rem !important;
    max-width: 25rem !important;
}

/* Schülerbereich */

.student-hero {
    background:
        radial-gradient(circle at 88% 18%, rgba(0, 169, 255, .18), transparent 25rem),
        linear-gradient(135deg, #f8fcff 0%, #eff8ff 60%, #e3f4ff 100%);
}

.student-hero::before {
    position: absolute;
    inset: auto 0 0;
    height: 4rem;
    background: linear-gradient(to top, rgba(255, 255, 255, .6), transparent);
    content: "";
}

.student-hero__glow {
    top: -13rem;
    left: -10rem;
    width: 30rem;
    height: 30rem;
    filter: blur(2px);
}

.student-hero h1 {
    letter-spacing: -.04em;
}

.student-hero__copy {
    max-width: 41rem;
}

.student-search {
    max-width: 43rem;
}

.student-search:focus-within {
    border-color: var(--bs-primary);
    box-shadow: 0 0 0 .25rem var(--bs-focus-ring-color) !important;
}

.student-hero-illustration {
    max-width: 32rem;
}

.student-hero-illustration::before {
    position: absolute;
    inset: 12% 5% 4%;
    z-index: -1;
    border-radius: 50%;
    background: rgba(var(--bs-primary-rgb), .08);
    content: "";
    filter: blur(2rem);
}

.student-hero-illustration img {
    max-height: 29rem;
}

.student-benefit-icon svg {
    width: 1.35rem;
    height: 1.35rem;
}

.student-page-header {
    background: linear-gradient(135deg, #f8fcff, #edf8ff);
}

.student-page-header h1 {
    letter-spacing: -.035em;
}

.student-inline-search {
    width: min(100%, 28rem);
}

.student-listing-card {
    cursor: pointer;
}

.student-listing-card__image {
    height: 13.5rem;
}

.student-listing-card__fallback svg {
    width: 4.5rem;
    height: 4.5rem;
    stroke-width: 1.15;
}

.student-listing-location svg,
.student-listing-meta svg {
    width: .95rem;
    height: .95rem;
}

.student-state {
    min-height: 22rem;
    border-style: dashed !important;
}

.student-filter-panel {
    --bs-offcanvas-width: min(100vw, 31rem);
}

.student-filter-panel .input-group-text svg {
    width: 1rem;
    height: 1rem;
}

.student-filter-panel .form-switch svg {
    width: 1.05rem;
    height: 1.05rem;
}

.student-detail-loading {
    min-height: 28rem;
}

.student-detail-gallery__image-button {
    cursor: zoom-in;
}

.student-gallery-modal__carousel {
    height: min(85vh, 56rem);
}

.student-detail-gallery--empty svg {
    width: 4rem;
    height: 4rem;
    stroke-width: 1.1;
}

#detailFacts svg {
    width: 1.35rem;
    height: 1.35rem;
}

.student-detail-description {
    max-width: 47rem;
    white-space: pre-line;
}

#detailAmenities svg {
    width: 1rem;
    height: 1rem;
}

.student-avatar svg {
    width: 1.35rem;
}

/* Öffentliche Startseite */

.landlord-hero {
    background:
        radial-gradient(circle at 86% 15%, rgba(0, 169, 255, .2), transparent 26rem),
        linear-gradient(135deg, #f9fcff 0%, #eff8ff 58%, #dff2ff 100%);
}

.landlord-hero::after {
    position: absolute;
    right: -8rem;
    bottom: -12rem;
    width: 30rem;
    height: 30rem;
    border: 1px solid rgba(var(--bs-primary-rgb), .13);
    border-radius: 50%;
    content: "";
}

.landlord-hero__glow {
    top: -15rem;
    left: -12rem;
    width: 34rem;
    height: 34rem;
}

.landlord-hero h1 {
    max-width: 49rem;
    letter-spacing: -.045em;
}

.landlord-hero__copy {
    max-width: 46rem;
}

.landlord-hero .btn svg,
.landlord-process .btn svg,
.student-login-nav .btn svg {
    width: 1.1rem;
    height: 1.1rem;
}

.landlord-hero__highlights svg {
    width: 1.05rem;
    height: 1.05rem;
}

.landlord-hero__visual {
    max-width: 31rem;
    backdrop-filter: blur(.75rem);
}

.landlord-hero__visual>img {
    max-height: 25rem;
}

.landlord-benefit__icon svg {
    width: 1.4rem;
    height: 1.4rem;
}

.landlord-process {
    background-image: radial-gradient(circle at 10% 0, rgba(var(--bs-primary-rgb), .38), transparent 24rem);
}

.landlord-process::after {
    position: absolute;
    top: 5rem;
    right: -8rem;
    width: 22rem;
    height: 22rem;
    border: 1px solid rgba(255, 255, 255, .08);
    border-radius: 50%;
    content: "";
}

.landlord-process__step>svg {
    width: 1.75rem;
    height: 1.75rem;
}

.landlord-process__number {
    top: 1.25rem;
    right: 1.5rem;
    font-family: Montserrat, sans-serif;
    font-size: 3rem;
}
