/*
Copyright: Illya Beverung für Morada Hotels & Resorts
Datei: assets/css/admin.css
Beschreibung: Professionelles Admin-Design für den Hotel-Kiosk
Version: 1.0
*/

:root {
    --admin-sidebar-breite: 282px;
    --admin-bg: #f3f6f8;
    --admin-panel: #ffffff;
    --admin-border: #cfd8e3;
    --admin-border-dark: #9aa8b8;
    --admin-text: #1f2933;
    --admin-muted: #5d6b7a;
    --admin-primary: #0f5b78;
    --admin-primary-dark: #0a4055;
    --admin-primary-soft: #e5f3f8;
    --admin-sidebar: #102331;
    --admin-sidebar-2: #18374a;
    --admin-warning: #8a5b00;
    --admin-danger: #9d1c2b;
    --admin-success: #1f7a4d;
}

html {
    min-height: 100%;
}

body.admin-body {
    min-height: 100vh;
    background: var(--admin-bg);
    color: var(--admin-text);
    font-size: 15px;
}

.admin-shell {
    background: var(--admin-bg);
}

.admin-main {
    min-width: 0;
    display: flex;
    flex-direction: column;
}

.admin-sidebar {
    width: var(--admin-sidebar-breite);
    min-height: 100vh;
    flex: 0 0 var(--admin-sidebar-breite);
    background: linear-gradient(180deg, var(--admin-sidebar), var(--admin-sidebar-2));
    color: #fff;
    border-right: 1px solid rgba(255, 255, 255, .08);
}

.admin-marke {
    display: flex;
    align-items: center;
    gap: .85rem;
    min-height: 86px;
    padding: 1.25rem;
    border-bottom: 1px solid rgba(255, 255, 255, .12);
}

.admin-marke-symbol {
    width: 44px;
    height: 44px;
    display: grid;
    place-items: center;
    border-radius: .5rem;
    background: #d7b46a;
    color: #14212b;
    font-weight: 800;
    letter-spacing: .04em;
}

.admin-marke-name {
    font-weight: 800;
    font-size: 1.05rem;
}

.admin-marke-sub {
    color: rgba(255, 255, 255, .68);
    font-size: .84rem;
}

.admin-nav {
    padding: 1rem;
}

.admin-nav-gruppe {
    margin-bottom: 1.1rem;
}

.admin-nav-gruppe-titel {
    padding: 0 .75rem .35rem;
    color: rgba(255, 255, 255, .56);
    font-size: .72rem;
    font-weight: 700;
    text-transform: uppercase;
}

.admin-nav-link {
    display: flex;
    align-items: center;
    min-height: 42px;
    margin-bottom: .2rem;
    padding: .65rem .8rem;
    border-radius: .45rem;
    color: rgba(255, 255, 255, .82);
    text-decoration: none;
    border: 1px solid transparent;
}

.admin-nav-link:hover,
.admin-nav-link:focus {
    color: #fff;
    background: rgba(255, 255, 255, .1);
    border-color: rgba(255, 255, 255, .12);
}

.admin-nav-link.active {
    color: #102331;
    background: #ffffff;
    font-weight: 700;
    box-shadow: 0 8px 22px rgba(0, 0, 0, .18);
}

.admin-kopf {
    position: sticky;
    top: 0;
    z-index: 20;
    background: rgba(255, 255, 255, .96);
    border-bottom: 1px solid var(--admin-border);
    box-shadow: 0 4px 18px rgba(31, 41, 51, .06);
}

.admin-breadcrumb {
    color: var(--admin-muted);
    font-size: .8rem;
    font-weight: 700;
    text-transform: uppercase;
}

.admin-kopf h1 {
    color: #14212b;
    font-weight: 800;
}

.admin-kopf-rechts {
    display: flex;
    align-items: center;
    gap: .75rem;
}

.admin-kontext,
.admin-benutzer,
.admin-monitoring-link {
    min-height: 44px;
    display: flex;
    align-items: center;
    border: 1px solid var(--admin-border);
    border-radius: .5rem;
    background: #fff;
}

.admin-kontext {
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    padding: .35rem .75rem;
}

.admin-kontext-label {
    color: var(--admin-muted);
    font-size: .72rem;
    font-weight: 700;
    text-transform: uppercase;
}

.admin-kontext strong {
    color: var(--admin-text);
    font-size: .88rem;
}

.admin-monitoring-link,
.admin-benutzer a {
    padding: .55rem .8rem;
    color: var(--admin-primary);
    font-weight: 700;
    text-decoration: none;
}

.admin-monitoring-link:hover,
.admin-benutzer a:hover {
    color: var(--admin-primary-dark);
    background: var(--admin-primary-soft);
}

.admin-benutzer {
    overflow: hidden;
}

.admin-benutzer span {
    padding: .55rem .8rem;
    font-weight: 700;
    border-right: 1px solid var(--admin-border);
}

.admin-inhalt {
    flex: 1 0 auto;
}

.admin-footer {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.5rem;
    color: var(--admin-muted);
    border-top: 1px solid var(--admin-border);
    background: #fff;
    font-size: .84rem;
}

.card {
    border: 1px solid var(--admin-border) !important;
    border-radius: .6rem;
    background: var(--admin-panel);
}

.shadow-sm {
    box-shadow: 0 6px 20px rgba(31, 41, 51, .08) !important;
}

.card-header,
.card-footer {
    border-color: var(--admin-border);
}

.table {
    color: var(--admin-text);
}

.table thead.table-light th,
.table thead th {
    background: #e9eef3 !important;
    color: #24313d;
    border-bottom: 1px solid var(--admin-border-dark);
    font-size: .78rem;
    text-transform: uppercase;
    vertical-align: middle;
}

.table tbody td {
    border-color: #dde4ec;
    vertical-align: middle;
}

.table-hover tbody tr:hover {
    background: #f5f9fc;
}

.form-label {
    color: #24313d;
    font-weight: 700;
}

.form-control,
.form-select,
textarea.form-control {
    color: var(--admin-text);
    background-color: #fff;
    border: 1px solid var(--admin-border-dark);
    border-radius: .45rem;
}

.form-control:focus,
.form-select:focus,
textarea.form-control:focus {
    border-color: var(--admin-primary);
    box-shadow: 0 0 0 .2rem rgba(15, 91, 120, .18);
}

.form-text,
.text-secondary {
    color: var(--admin-muted) !important;
}

.btn {
    border-radius: .45rem;
    font-weight: 700;
}

.btn-group > form {
    display: inline-flex;
}

.btn-group > form:not(:last-child) > .btn {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.btn-group > form:not(:first-child) > .btn {
    margin-left: -1px;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

.btn-primary {
    background: var(--admin-primary);
    border-color: var(--admin-primary);
}

.btn-primary:hover,
.btn-primary:focus {
    background: var(--admin-primary-dark);
    border-color: var(--admin-primary-dark);
}

.btn-outline-primary {
    color: var(--admin-primary);
    border-color: var(--admin-primary);
}

.btn-outline-primary:hover,
.btn-outline-primary:focus {
    background: var(--admin-primary);
    border-color: var(--admin-primary);
}

.btn-outline-secondary {
    color: #344454;
    border-color: var(--admin-border-dark);
    background: #fff;
}

.btn-outline-secondary:hover,
.btn-outline-secondary:focus {
    color: #14212b;
    background: #e9eef3;
    border-color: #7d8b9a;
}

.alert.admin-alert,
.alert {
    border: 1px solid transparent;
    border-radius: .55rem;
    font-weight: 600;
}

.alert-info {
    color: #17485a;
    background: #e5f3f8;
    border-color: #b9ddeb;
}

.alert-warning {
    color: var(--admin-warning);
    background: #fff3cd;
    border-color: #f2d98d;
}

.alert-danger {
    color: var(--admin-danger);
    background: #f8d7da;
    border-color: #ef9aa5;
}

.alert-success {
    color: var(--admin-success);
    background: #dff3e7;
    border-color: #a9d9bd;
}

.badge {
    border-radius: .4rem;
    font-weight: 800;
}

.border-dashed {
    border-style: dashed !important;
}

.upload-dropzone {
    background: #fff;
    border-color: var(--admin-border-dark) !important;
    transition: border-color .15s ease, background-color .15s ease;
}

.upload-dropzone.border-primary {
    background: #e5f3f8 !important;
    border-color: var(--admin-primary) !important;
}

.medien-grid {
    overflow: hidden;
}

.medien-karte {
    overflow: hidden;
    transition: border-color .15s ease, box-shadow .15s ease;
}

.medien-karte:hover,
.medien-karte:focus-within {
    border-color: var(--admin-primary) !important;
    box-shadow: 0 10px 26px rgba(31, 41, 51, .14) !important;
}

.medien-vorschau {
    position: relative;
    height: 240px;
    display: grid;
    place-items: center;
    padding: .5rem;
    background:
        linear-gradient(45deg, #eef3f6 25%, transparent 25%),
        linear-gradient(-45deg, #eef3f6 25%, transparent 25%),
        linear-gradient(45deg, transparent 75%, #eef3f6 75%),
        linear-gradient(-45deg, transparent 75%, #eef3f6 75%);
    background-color: #f8fafc;
    background-position: 0 0, 0 8px, 8px -8px, -8px 0;
    background-size: 16px 16px;
}

.medien-vorschau img,
.medien-vorschau video {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    object-position: center center;
    border-radius: .35rem;
}

.medien-vorschau video {
    background: #101820;
}

.mediathek-vorschau {
    position: relative;
    height: 260px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: .5rem;
    overflow: hidden;
    background:
        linear-gradient(45deg, #eef3f6 25%, transparent 25%),
        linear-gradient(-45deg, #eef3f6 25%, transparent 25%),
        linear-gradient(45deg, transparent 75%, #eef3f6 75%),
        linear-gradient(-45deg, transparent 75%, #eef3f6 75%);
    background-color: #f8fafc;
    background-position: 0 0, 0 8px, 8px -8px, -8px 0;
    background-size: 16px 16px;
}

.mediathek-medium {
    display: block !important;
    flex: 0 0 auto !important;
    width: auto !important;
    height: auto !important;
    min-width: 0 !important;
    min-height: 0 !important;
    max-width: 100% !important;
    max-height: 100% !important;
    object-fit: contain !important;
    object-position: center center !important;
    border-radius: .35rem;
}

.mediathek-video {
    width: 100% !important;
    height: 100% !important;
    background: #101820;
}

.medien-typ-badge {
    position: absolute;
    top: .5rem;
    left: .5rem;
    z-index: 2;
    padding: .18rem .45rem;
    border-radius: .35rem;
    color: #fff;
    font-size: .75rem;
    font-weight: 800;
    line-height: 1.2;
    pointer-events: none;
}

.medien-typ-bild {
    background: rgba(15, 91, 120, .92);
}

.medien-typ-video {
    background: rgba(157, 28, 43, .94);
}

.medien-titel {
    max-width: 100%;
    color: #172534;
    font-size: .9rem;
    font-weight: 800;
    line-height: 1.22;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.medien-meta,
.medien-format-text {
    line-height: 1.25;
}

.medien-groesse {
    align-self: flex-start;
    white-space: nowrap;
    font-size: .72rem;
}

.medien-beschreibung {
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.medien-modal {
    overflow: hidden;
}

.medien-modal-body {
    min-height: 72vh;
    display: grid;
    place-items: center;
    padding: .75rem;
    background: #101820;
}

.medien-modal-bild,
.medien-modal-video {
    width: auto;
    height: auto;
    max-width: 100%;
    max-height: 72vh;
    object-fit: contain;
}

.medien-modal-video {
    width: 100%;
    background: #000;
}

.slideshow-element-karte {
    display: grid;
    grid-template-columns: 36px minmax(180px, 300px) minmax(0, 1fr);
    gap: 1rem;
    padding: 1rem 0;
    border-top: 1px solid var(--admin-border);
}

.slideshow-element-karte.wird-gezogen {
    opacity: .55;
}

.slideshow-sortierspalte {
    width: 42px;
    display: grid;
    justify-items: center;
    align-content: start;
    gap: .35rem;
}

.slideshow-sortierspalte .btn {
    width: 36px;
    height: 30px;
    display: grid;
    place-items: center;
    padding: 0;
    font-weight: 800;
}

.slideshow-drag-griff {
    width: 36px;
    height: 36px;
    display: grid;
    place-items: center;
    margin-top: .25rem;
    border: 1px solid var(--admin-border-dark);
    border-radius: .45rem;
    background: #fff;
    color: var(--admin-muted);
    cursor: grab;
    font-weight: 800;
}

.slideshow-sort-zahl {
    width: 42px;
    padding-left: .25rem;
    padding-right: .25rem;
    text-align: center;
}

.slideshow-medium-vorschau,
.slideshow-medium-leer {
    width: 100%;
    min-height: 150px;
    max-height: 260px;
    display: grid;
    place-items: center;
    overflow: hidden;
    border: 1px solid var(--admin-border);
    border-radius: .5rem;
    background: #17212b;
}

.slideshow-medium-vorschau img,
.slideshow-medium-vorschau video {
    width: 100%;
    max-height: 260px;
    object-fit: contain;
    background: #17212b;
}

.slideshow-medium-vorschau.klein,
.slideshow-medium-leer.klein {
    min-height: 96px;
    max-height: 150px;
}

.slideshow-medium-vorschau.klein img,
.slideshow-medium-vorschau.klein video {
    max-height: 150px;
}

.medium-auswahl-preview:empty {
    display: none;
}

.video-dauer-option .form-check-input:disabled + .form-check-label {
    color: var(--admin-muted);
}

.slideshow-medium-leer {
    color: #fff;
    font-weight: 700;
}

.slideshow-medien-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
    gap: 1rem;
}

.slideshow-medium-card {
    display: flex;
    flex-direction: column;
    gap: .55rem;
    padding: .75rem;
    border: 2px solid var(--admin-border);
    border-radius: .55rem;
    background: #fff;
    text-align: left;
}

.slideshow-medium-card:hover,
.slideshow-medium-card.aktiv {
    border-color: var(--admin-primary);
    box-shadow: 0 0 0 .2rem rgba(15, 91, 120, .12);
}

.slideshow-medium-thumb {
    height: 128px;
    display: grid;
    place-items: center;
    overflow: hidden;
    border-radius: .4rem;
    background: #17212b;
}

.slideshow-medium-thumb img,
.slideshow-medium-thumb video {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.slideshow-medium-title {
    font-weight: 800;
    color: var(--admin-text);
}

.slideshow-medium-meta {
    color: var(--admin-muted);
    font-size: .82rem;
}

.nextcloud-breadcrumb {
    display: flex;
    flex-wrap: wrap;
    gap: .45rem;
    align-items: center;
    color: var(--admin-muted);
    font-weight: 700;
}

.nextcloud-breadcrumb a,
.nextcloud-zurueck {
    color: var(--admin-primary);
    text-decoration: none;
}

.nextcloud-zurueck {
    display: inline-flex;
    margin-bottom: .5rem;
    font-weight: 800;
}

.nextcloud-ordner-grid,
.nextcloud-medien-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(210px, 1fr));
    gap: 1rem;
}

.nextcloud-ordner-karte,
.nextcloud-datei-karte {
    border: 2px solid var(--admin-border);
    border-radius: .55rem;
    background: #fff;
    box-shadow: 0 8px 20px rgba(31, 41, 51, .06);
}

.nextcloud-ordner-karte {
    min-height: 82px;
    padding: 1rem;
    display: flex;
    gap: .75rem;
    align-items: center;
    color: var(--admin-text);
    font-weight: 800;
    text-decoration: none;
}

.nextcloud-ordner-karte:hover,
.nextcloud-datei-karte:hover {
    border-color: var(--admin-primary);
    box-shadow: 0 0 0 .2rem rgba(15, 91, 120, .12);
}

.nextcloud-ordner-icon {
    width: 36px;
    height: 36px;
    border-radius: .45rem;
    display: grid;
    place-items: center;
    background: #e7f4f8;
    color: var(--admin-primary);
}

.nextcloud-datei-karte {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: .55rem;
    padding: .75rem;
    cursor: pointer;
}

.nextcloud-datei-karte .form-check-input {
    position: absolute;
    top: .65rem;
    left: .65rem;
    z-index: 2;
    width: 1.2rem;
    height: 1.2rem;
}

.nextcloud-vorschau {
    height: 140px;
    display: grid;
    place-items: center;
    overflow: hidden;
    border-radius: .4rem;
    background: #17212b;
}

.nextcloud-vorschau img,
.nextcloud-vorschau video {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.nextcloud-dateiname {
    font-weight: 800;
    color: var(--admin-text);
    overflow-wrap: anywhere;
}

.nextcloud-meta {
    color: var(--admin-muted);
    font-size: .82rem;
}

.nextcloud-modal-browser {
    display: none;
}

.nextcloud-modal-browser.aktiv {
    display: block;
}

.nextcloud-modal-toolbar {
    display: flex;
    flex-wrap: wrap;
    gap: .75rem;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 1rem;
}

.nextcloud-modal-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(170px, 1fr));
    gap: .85rem;
}

.nextcloud-modal-card {
    display: flex;
    flex-direction: column;
    gap: .5rem;
    width: 100%;
    border: 2px solid var(--admin-border);
    border-radius: .55rem;
    background: #fff;
    padding: .65rem;
    text-align: left;
}

.nextcloud-modal-card:hover {
    border-color: var(--admin-primary);
}

.nextcloud-modal-card.aktiv {
    border-color: var(--admin-primary);
    box-shadow: 0 0 0 .2rem rgba(15, 91, 120, .12);
}

.slideshow-panel {
    overflow: hidden;
    border: 1px solid var(--admin-border);
}

.slideshow-panel-kopf,
.slideshow-element-kopf {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    border: 0 !important;
    background: #fff;
    color: var(--admin-text);
    text-align: left;
    cursor: pointer;
}

.slideshow-panel-kopf {
    min-height: 72px;
    padding: 1.1rem 1.5rem;
    border-bottom: 1px solid transparent !important;
}

.slideshow-panel.ist-offen > .slideshow-panel-kopf {
    border-bottom-color: var(--admin-border) !important;
    background: #fbfdff;
}

.slideshow-panel-titel {
    display: block;
    font-weight: 800;
}

.slideshow-panel-text {
    display: block;
    margin-top: .15rem;
    color: var(--admin-muted);
    font-size: .9rem;
    font-weight: 500;
}

.slideshow-panel-pfeil {
    width: 1.2rem;
    height: 1.2rem;
    flex: 0 0 auto;
    display: grid;
    place-items: center;
    color: var(--admin-primary);
    font-size: 1.55rem;
    font-weight: 800;
    line-height: 1;
    transform: rotate(0deg);
    transition: transform .16s ease;
}

[aria-expanded="true"] > .slideshow-panel-pfeil,
[aria-expanded="true"] .slideshow-panel-pfeil {
    transform: rotate(90deg);
}

.medium-dropzone {
    padding: .75rem;
    border: 1px dashed var(--admin-border-dark);
    border-radius: .55rem;
    background: #fbfdff;
    outline: none;
}

.medium-dropzone:focus,
.medium-dropzone.ist-dragover {
    border-color: var(--admin-primary);
    box-shadow: 0 0 0 .2rem rgba(15, 91, 120, .12);
}

.medium-dropzone.wird-hochgeladen {
    opacity: .75;
}

.medium-dropzone-hinweis {
    margin-top: .55rem;
    color: var(--admin-muted);
    font-size: .82rem;
    text-align: center;
}

.slideshow-element-karte {
    grid-template-columns: 44px 132px minmax(0, 1fr);
    align-items: start;
    gap: .85rem;
    margin-bottom: .8rem;
    padding: .8rem;
    border: 1px solid var(--admin-border);
    border-radius: .65rem;
    background: #fff;
    box-shadow: 0 6px 18px rgba(31, 41, 51, .04);
}

.slideshow-element-karte:first-child {
    border-top: 1px solid var(--admin-border);
}

.slideshow-element-karte.ist-offen {
    border-color: var(--admin-primary);
    box-shadow: 0 10px 28px rgba(31, 41, 51, .08);
}

.slideshow-element-karte.slideshow-element-neu {
    border-color: #d89000;
    background: #fff9e8;
    box-shadow: 0 0 0 .18rem rgba(216, 144, 0, .16), 0 10px 28px rgba(31, 41, 51, .08);
    transition: background-color .45s ease, border-color .45s ease, box-shadow .45s ease;
}

.slideshow-element-miniatur .slideshow-medium-vorschau,
.slideshow-element-miniatur .slideshow-medium-leer {
    min-height: 118px;
    max-height: 118px;
    border-radius: .55rem;
}

.slideshow-element-miniatur .slideshow-medium-vorschau img,
.slideshow-element-miniatur .slideshow-medium-vorschau video {
    height: 118px;
    max-height: 118px;
}

.slideshow-element-kopf {
    min-height: 118px;
    padding: .3rem .35rem .3rem 0;
    border-radius: .5rem;
    cursor: pointer;
}

.slideshow-element-kopf:hover {
    background: #f8fbfd;
}

.slideshow-element-aktionen {
    display: flex;
    align-items: center;
    gap: .5rem;
    flex: 0 0 auto;
}

.slideshow-element-toggle {
    width: 2rem;
    min-width: 2rem;
    height: 2rem;
    display: grid;
    place-items: center;
    padding: 0;
    border: 0;
    background: transparent;
}

.slideshow-element-summary {
    flex: 1 1 auto;
    min-width: 0;
}

.slideshow-element-summary-title {
    display: flex;
    align-items: center;
    gap: .45rem;
    margin-bottom: .45rem;
    font-weight: 800;
    overflow-wrap: anywhere;
}

.slideshow-statuspunkt {
    width: .72rem;
    height: .72rem;
    flex: 0 0 auto;
    border-radius: 999px;
    box-shadow: 0 0 0 3px rgba(100, 116, 139, .12);
}

.slideshow-status-laeuft {
    background: #198754;
}

.slideshow-status-geplant {
    background: #f0ad00;
}

.slideshow-status-abgelaufen {
    background: #dc3545;
}

.slideshow-status-inaktiv {
    background: #8a98a8;
}

.slideshow-status-fehler {
    background: #dc3545;
}

.slideshow-status-label {
    display: inline-flex;
    align-items: center;
    min-height: 1.45rem;
    padding: .1rem .45rem;
    border-radius: 999px;
    font-size: .78rem;
    font-weight: 700;
}

.slideshow-status-label-laeuft {
    background: #e9f8ee;
    color: #17512b;
}

.slideshow-status-label-geplant {
    background: #fff6d9;
    color: #7a5600;
}

.slideshow-status-label-abgelaufen {
    background: #fdecef;
    color: #9f1f32;
}

.slideshow-status-label-inaktiv {
    background: #eef2f5;
    color: #516170;
}

.slideshow-status-label-fehler {
    background: #fdecef;
    color: #9f1f32;
}

.slideshow-element-summary-meta {
    display: flex;
    flex-wrap: wrap;
    gap: .35rem .55rem;
    color: var(--admin-muted);
    font-size: .84rem;
}

.slideshow-element-summary-meta span {
    display: inline-flex;
    align-items: center;
    min-height: 1.5rem;
    padding: .12rem .45rem;
    border: 1px solid var(--admin-border);
    border-radius: 999px;
    background: #f7fafc;
}

.slideshow-element-details {
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 1px solid var(--admin-border);
}

.slideshow-element-detail-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: .5rem;
    margin-bottom: 1rem;
}

.slideshow-original-link {
    width: auto !important;
    margin-top: 0 !important;
}

.slideshow-floating-update {
    position: fixed;
    right: 1.5rem;
    bottom: 1.5rem;
    z-index: 30;
    min-height: 54px;
    padding-inline: 1.25rem;
    box-shadow: 0 12px 28px rgba(31, 41, 51, .24);
}

.slideshow-floating-actions {
    position: fixed;
    right: 1.5rem;
    bottom: 1.5rem;
    z-index: 30;
    display: flex;
    gap: .75rem;
    align-items: center;
}

.slideshow-floating-actions .btn {
    min-height: 54px;
    padding-inline: 1.25rem;
    font-weight: 800;
    box-shadow: 0 12px 28px rgba(31, 41, 51, .24);
}

.slideshow-freigabe-status {
    max-width: 260px;
    padding: .45rem .65rem;
    border: 1px solid var(--admin-border);
    border-radius: .45rem;
    background: rgba(255, 255, 255, .96);
    color: var(--admin-muted);
    font-size: .82rem;
    line-height: 1.25;
    box-shadow: 0 10px 24px rgba(31, 41, 51, .12);
}

.slideshow-toast {
    position: fixed;
    right: 1.5rem;
    bottom: 6rem;
    z-index: 50;
    max-width: min(420px, calc(100vw - 2rem));
    padding: .85rem 1rem;
    border-radius: .55rem;
    border: 1px solid #b7dcc2;
    background: #e9f8ee;
    color: #17512b;
    font-weight: 800;
    box-shadow: 0 12px 28px rgba(31, 41, 51, .18);
}

.slideshow-toast-fehler {
    border-color: #f0b8c0;
    background: #fdecef;
    color: #9f1f32;
}

.admin-warte-overlay {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: grid;
    place-items: center;
    padding: 2rem;
    background: rgba(10, 21, 31, .58);
    backdrop-filter: blur(2px);
}

.admin-warte-box {
    min-width: min(420px, 92vw);
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1.35rem 1.5rem;
    border-radius: .65rem;
    background: #fff;
    border: 1px solid var(--admin-border);
    box-shadow: 0 18px 60px rgba(0, 0, 0, .28);
}

.admin-spinner {
    width: 42px;
    height: 42px;
    flex: 0 0 42px;
    border-radius: 50%;
    border: 5px solid #d7e7ee;
    border-top-color: var(--admin-primary);
    animation: admin-drehen .8s linear infinite;
}

.admin-warte-titel {
    color: #14212b;
    font-size: 1.05rem;
    font-weight: 800;
}

.admin-warte-text {
    color: var(--admin-muted);
    font-size: .92rem;
}

@keyframes admin-drehen {
    to {
        transform: rotate(360deg);
    }
}

code {
    color: #8a3b12;
    background: #fff4ec;
    padding: .1rem .28rem;
    border-radius: .25rem;
}

.dashboard-kopf {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1rem;
}

.dashboard-kopf-aktionen,
.stele-wizard-aktionen {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: .75rem;
}

.dashboard-stele-aktion {
    border-color: #d89000;
    background: #f2a900;
    color: #172534;
    font-weight: 900;
    box-shadow: 0 10px 24px rgba(242, 169, 0, .24);
}

.dashboard-stele-aktion:hover,
.dashboard-stele-aktion:focus {
    border-color: #b87500;
    background: #e49b00;
    color: #111827;
}

.dashboard-kachel {
    display: block;
    min-height: 136px;
    padding: 1.25rem;
    border: 1px solid var(--admin-border);
    border-radius: .5rem;
    background: #fff;
    color: #172534;
    box-shadow: 0 10px 26px rgba(31, 41, 51, .08);
    text-decoration: none;
}

.dashboard-kachel-link:hover {
    border-color: #8ab7cf;
    color: #0c5f8f;
    transform: translateY(-1px);
}

.dashboard-kachel-label {
    display: block;
    margin-bottom: .4rem;
    color: var(--admin-muted);
    font-size: .82rem;
    font-weight: 800;
    text-transform: uppercase;
}

.dashboard-kachel strong {
    display: block;
    margin-bottom: .15rem;
    font-size: clamp(2rem, 4vw, 2.7rem);
    line-height: 1;
}

.dashboard-kombi-liste {
    display: grid;
    gap: .85rem;
}

.dashboard-kombi {
    display: grid;
    grid-template-columns: 112px minmax(0, 1fr) auto;
    gap: 1rem;
    align-items: stretch;
    padding: 1rem;
    border: 1px solid var(--admin-border);
    border-radius: .55rem;
    background: #fbfdff;
}

.dashboard-kombi-status {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: .35rem;
    border-radius: .45rem;
    background: #fff;
    color: #1d2f3f;
    font-weight: 800;
}

.dashboard-statuspunkt {
    width: .8rem;
    height: .8rem;
    display: inline-block;
    border-radius: 50%;
}

.dashboard-statuspunkt-online {
    background: #13a35b;
    box-shadow: 0 0 0 4px rgba(19, 163, 91, .12);
}

.dashboard-statuspunkt-warnung {
    background: #f2a900;
    box-shadow: 0 0 0 4px rgba(242, 169, 0, .16);
}

.dashboard-statuspunkt-offline {
    background: #d83a4b;
    box-shadow: 0 0 0 4px rgba(216, 58, 75, .12);
}

.dashboard-kombi-titel {
    display: flex;
    flex-wrap: wrap;
    gap: .4rem .75rem;
    align-items: baseline;
    margin-bottom: .45rem;
}

.dashboard-kombi-titel strong {
    font-size: 1.05rem;
}

.dashboard-kombi-titel span {
    color: var(--admin-muted);
    font-weight: 700;
}

.dashboard-kombi-meta {
    display: flex;
    flex-wrap: wrap;
    gap: .4rem .6rem;
    color: var(--admin-muted);
    font-size: .88rem;
}

.dashboard-kombi-meta span,
.dashboard-kombi-slideshow {
    padding: .28rem .55rem;
    border: 1px solid #d9e5ec;
    border-radius: 999px;
    background: #fff;
}

.dashboard-kombi-meta .dashboard-version-pill {
    font-weight: 800;
}

.dashboard-pill-mit-abbruch {
    display: inline-flex !important;
    align-items: center;
    gap: .45rem;
    padding-right: .35rem !important;
}

.dashboard-pill-mit-abbruch form {
    display: inline-flex;
    margin: 0;
}

.dashboard-abbruch-button {
    width: 1.15rem;
    height: 1.15rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 0;
    border-radius: 50%;
    background: #c1121f;
    color: #fff;
    font-size: .9rem;
    font-weight: 900;
    line-height: 1;
    box-shadow: 0 2px 6px rgba(157, 28, 43, .24);
}

.dashboard-abbruch-button:hover,
.dashboard-abbruch-button:focus {
    background: #930d17;
    color: #fff;
}

.dashboard-ota-pill {
    color: #713f12;
    border-color: #f0bd55 !important;
    background: #fff7df !important;
}

.dashboard-version-neutral {
    color: var(--admin-muted);
    background: #fff;
}

.dashboard-version-aktuell {
    color: #17512b;
    border-color: #9bd0ad !important;
    background: #e9f8ee !important;
}

.dashboard-version-bereit,
.dashboard-version-wartet {
    color: #725000;
    border-color: #e6bd45 !important;
    background: #fff4c7 !important;
}

.dashboard-version-veraltet {
    color: #9f1f32;
    border-color: #f0a5af !important;
    background: #fdecef !important;
}

.dashboard-kombi-slideshow {
    display: inline-flex;
    flex-wrap: wrap;
    gap: .35rem;
    margin: .55rem 0;
    color: #274255;
    font-size: .9rem;
}

.dashboard-warnungen {
    margin-top: .6rem;
    padding: .55rem .7rem;
    border-left: 4px solid #f2a900;
    border-radius: .35rem;
    background: #fff8df;
    color: #725000;
    font-weight: 700;
}

.dashboard-hinweis {
    margin-top: .55rem;
    color: var(--admin-muted);
    font-size: .88rem;
}

.pi-interne-daten {
    padding: 1rem;
    border: 1px solid #f0d78a;
    border-radius: .5rem;
    background: #fff9e8;
}

.slideshow-hotel-freigaben {
    padding: 1rem;
    border: 1px solid #c9d8e3;
    border-radius: .5rem;
    background: #f6f9fb;
}

.slideshow-tabellen-sort {
    color: inherit;
    text-decoration: none;
}

.slideshow-tabellen-sort:hover {
    color: var(--admin-primary);
}

.slideshow-aktionen {
    display: flex;
    flex-wrap: nowrap;
    justify-content: flex-end;
    gap: .35rem;
}

.slideshow-aktion {
    min-width: 6.25rem;
    white-space: nowrap;
    border: 0;
    font-weight: 700;
}

.slideshow-aktion-icon {
    width: 2.25rem;
    min-width: 2.25rem;
    height: 2rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: .25rem;
}

.slideshow-aktion-icon svg {
    width: 1rem;
    height: 1rem;
    fill: currentColor;
}

.slideshow-aktion-vorschau {
    background: #eef6fb;
    color: #075985;
}

.slideshow-aktion-vorschau:hover {
    background: #d8edf8;
    color: #064b70;
}

.slideshow-aktion-bearbeiten {
    background: #e9f7ef;
    color: #146c43;
}

.slideshow-aktion-bearbeiten:hover {
    background: #d7f0e2;
    color: #0f5132;
}

.slideshow-aktion-kopieren {
    background: #fff5dd;
    color: #8a5a00;
}

.slideshow-aktion-kopieren:hover {
    background: #ffe9b5;
    color: #6f4700;
}

.slideshow-aktion-loeschen {
    background: #fff0f3;
    color: #c1121f;
}

.slideshow-aktion-loeschen:hover {
    background: #ffd9df;
    color: #9f0712;
}

.slideshow-tabellen-datum {
    white-space: nowrap;
}

.slideshow-tabellen-uhrzeit {
    display: block;
    color: var(--admin-muted);
    font-size: .82rem;
}

.slideshow-nutzung-zelle {
    min-width: 260px;
}

.slideshow-nutzungen {
    display: grid;
    gap: .35rem;
}

.slideshow-nutzung-eintrag {
    display: block;
    padding: .4rem .5rem;
    border: 1px solid #d7e2ea;
    border-radius: .45rem;
    background: #f7fafc;
    color: var(--admin-text);
    text-decoration: none;
}

.slideshow-nutzung-eintrag:hover {
    border-color: var(--admin-primary);
    background: var(--admin-primary-soft);
    color: var(--admin-primary-dark);
}

.slideshow-nutzung-typ {
    display: inline-flex;
    margin-bottom: .15rem;
    padding: .08rem .4rem;
    border-radius: 999px;
    background: #e6f2ed;
    color: var(--admin-success);
    font-size: .72rem;
    font-weight: 800;
    text-transform: uppercase;
}

.slideshow-nutzung-ziel,
.slideshow-nutzung-zusatz {
    display: block;
    font-size: .82rem;
}

.slideshow-nutzung-zusatz {
    color: var(--admin-muted);
}

.dashboard-kombi-links {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: .45rem;
    min-width: 120px;
}

.dashboard-kombi-links a,
.dashboard-kombi-button,
.dashboard-schnellzugriff a {
    display: block;
    padding: .55rem .7rem;
    border: 1px solid var(--admin-border);
    border-radius: .4rem;
    background: #fff;
    color: #0f668e;
    font-weight: 800;
    text-decoration: none;
    text-align: left;
}

.dashboard-kombi-button {
    width: 100%;
}

.dashboard-kombi-links a:hover,
.dashboard-kombi-button:hover,
.dashboard-schnellzugriff a:hover {
    border-color: #8ab7cf;
    background: #f4fbff;
}

.dashboard-installationswerte {
    display: grid;
    gap: .65rem;
}

.dashboard-installationswert {
    display: grid;
    grid-template-columns: minmax(150px, 210px) minmax(0, 1fr) auto;
    gap: .5rem;
    align-items: center;
}

.dashboard-installationswert label {
    margin: 0;
    color: var(--admin-muted);
    font-weight: 700;
}

.dashboard-installationswert code {
    min-width: 0;
    padding: .5rem .65rem;
    border: 1px solid var(--admin-border);
    border-radius: .35rem;
    background: #f8fafc;
    color: #1f2d3d;
    white-space: normal;
    overflow-wrap: anywhere;
}

.dashboard-schnellzugriff .dashboard-stele-link {
    border-color: #e6b94c;
    background: #fff7df;
    color: #6f4a00;
}

.dashboard-schnellzugriff .dashboard-stele-link:hover {
    border-color: #d89000;
    background: #ffefbd;
}

.dashboard-ampel {
    display: grid;
    gap: .7rem;
}

.dashboard-ampel > div {
    display: grid;
    grid-template-columns: auto 42px 1fr;
    align-items: center;
    gap: .75rem;
    padding: .8rem;
    border: 1px solid var(--admin-border);
    border-radius: .5rem;
    background: #fbfdff;
}

.dashboard-ampel strong {
    font-size: 1.35rem;
}

.dashboard-schnellzugriff {
    display: grid;
    gap: .65rem;
}

.stele-wizard-schritte {
    display: grid;
    gap: 1rem;
}

.stele-schritt-label {
    width: 34px;
    height: 34px;
    display: inline-grid;
    place-items: center;
    margin-bottom: .75rem;
    border-radius: 50%;
    background: #0f668e;
    color: #fff;
    font-weight: 900;
}

.stele-codeblock {
    display: block;
    width: 100%;
    padding: .8rem .95rem;
    overflow-wrap: anywhere;
    border: 1px solid #d7e3eb;
    border-radius: .45rem;
    background: #f7fafc;
    color: #172534;
    font-family: Consolas, Monaco, monospace;
    font-size: .92rem;
}

.stele-druckblatt {
    max-width: 960px;
    padding: 2rem;
    border: 1px solid var(--admin-border);
    border-radius: .6rem;
    background: #fff;
    box-shadow: 0 12px 32px rgba(31, 41, 51, .12);
}

.stele-druckkopf {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    padding-bottom: 1rem;
    margin-bottom: 1.25rem;
    border-bottom: 2px solid #173245;
}

.stele-druckkopf h2 {
    margin: 0;
}

.stele-druckgrid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
    margin-bottom: 1.5rem;
}

.stele-druckgrid > div {
    padding: 1rem;
    border: 1px solid var(--admin-border);
    border-radius: .45rem;
    background: #fbfdff;
}

.stele-druckblatt h3 {
    margin: 1.2rem 0 .55rem;
    font-size: 1rem;
}

.stele-api-link {
    display: grid;
    gap: .25rem;
    padding: .65rem 0;
    border-bottom: 1px solid #e3ebf0;
}

.stele-api-link span {
    overflow-wrap: anywhere;
    color: #2d4658;
    font-family: Consolas, Monaco, monospace;
    font-size: .86rem;
}

@media (max-width: 991.98px) {
    .admin-shell {
        display: block !important;
    }

    .admin-sidebar {
        width: 100%;
        min-height: auto;
        flex-basis: auto;
    }

    .admin-marke {
        min-height: auto;
        padding: 1rem;
    }

    .admin-nav {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: .75rem;
    }

    .admin-nav-gruppe {
        margin-bottom: 0;
    }

    .admin-kopf {
        position: static;
    }

    .admin-kopf-rechts {
        width: 100%;
        align-items: stretch;
        flex-direction: column;
    }

    .admin-kontext,
    .admin-benutzer,
    .admin-monitoring-link {
        width: 100%;
    }

    .admin-inhalt {
        padding: 1rem !important;
    }

    .admin-footer {
        flex-direction: column;
    }

    .slideshow-element-karte {
        grid-template-columns: 1fr;
    }

    .slideshow-element-kopf {
        min-height: auto;
    }

    .slideshow-element-miniatur .slideshow-medium-vorschau,
    .slideshow-element-miniatur .slideshow-medium-leer,
    .slideshow-element-miniatur .slideshow-medium-vorschau img,
    .slideshow-element-miniatur .slideshow-medium-vorschau video {
        max-height: 180px;
        height: auto;
    }

    .slideshow-drag-griff {
        width: 100%;
    }

    .slideshow-sortierspalte {
        width: 100%;
        grid-template-columns: repeat(4, minmax(36px, auto));
        justify-content: start;
        align-items: center;
    }

    .slideshow-floating-update {
        right: 1rem;
        left: 1rem;
        bottom: 1rem;
    }

    .slideshow-floating-actions {
        right: 1rem;
        left: 1rem;
        bottom: 1rem;
        flex-direction: column;
    }

    .slideshow-toast {
        right: 1rem;
        left: 1rem;
        bottom: 8.5rem;
    }

    .dashboard-kopf {
        flex-direction: column;
    }

    .dashboard-kopf-aktionen,
    .stele-wizard-aktionen {
        width: 100%;
        justify-content: stretch;
    }

    .dashboard-kopf-aktionen .btn,
    .stele-wizard-aktionen .btn {
        flex: 1 1 180px;
    }

    .dashboard-kombi {
        grid-template-columns: 1fr;
    }

    .dashboard-kombi-status {
        flex-direction: row;
        justify-content: flex-start;
        padding: .7rem;
    }

    .dashboard-kombi-links {
        min-width: 0;
        flex-direction: row;
        flex-wrap: wrap;
    }

    .dashboard-kombi-links a {
        flex: 1 1 140px;
    }

    .stele-druckgrid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 575.98px) {
    .medien-vorschau {
        height: 220px;
    }

    .admin-nav {
        grid-template-columns: 1fr;
    }

    .table-responsive {
        border: 1px solid var(--admin-border);
        border-radius: .5rem;
    }
}

@media print {
    .admin-sidebar,
    .admin-kopf,
    .admin-footer,
    .admin-alert,
    .stele-wizard-aktionen {
        display: none !important;
    }

    .admin-shell,
    .admin-main,
    .admin-inhalt {
        display: block !important;
        width: 100% !important;
        padding: 0 !important;
        margin: 0 !important;
        background: #fff !important;
    }

    .stele-druckblatt {
        max-width: none;
        padding: 0;
        border: 0;
        box-shadow: none;
    }

    a,
    code,
    .stele-codeblock {
        color: #000 !important;
        background: #fff !important;
    }
}