/* Buchungsmanager v4.7 — native/mobile UI layer
   Loaded after component styles so every admin form shares one control system. */

:root {
    --bm-surface: #ffffff;
    --bm-page: #f7f7f6;
    --bm-text: #3e4241;
    --bm-muted: #7b817e;
    --bm-line: #d7dbd8;
    --bm-line-strong: #bfc5c1;
    --bm-accent: #444946;
    --bm-active: #f1f2f1;
    --bm-control-height: 48px;
    --bm-radius: 8px;
}

html {
    -webkit-text-size-adjust: 100%;
}

body {
    background: var(--bm-page);
}

button,
a,
input,
textarea,
select {
    -webkit-tap-highlight-color: transparent;
}

button,
a {
    touch-action: manipulation;
}

/* ---------- Shared admin form language ---------- */

.admin-content input:not([type="checkbox"]):not([type="radio"]):not(.money-input),
.admin-content select,
.admin-content .ui-field {
    box-sizing: border-box !important;
    width: 100% !important;
    height: var(--bm-control-height) !important;
    min-height: var(--bm-control-height) !important;
    display: flex !important;
    align-items: center !important;
    padding: 0 14px !important;
    border: 1px solid var(--bm-line) !important;
    border-radius: var(--bm-radius) !important;
    background: var(--bm-surface) !important;
    color: #333735 !important;
    font-family: inherit !important;
    font-size: 1rem !important;
    font-weight: 400 !important;
    line-height: 1.2 !important;
    outline: 0 !important;
    box-shadow: none !important;
}

.admin-content input[type="date"],
.admin-content input[type="time"],
.admin-content input[type="datetime-local"] {
    display: block !important;
    -webkit-appearance: none !important;
    appearance: none !important;
    color-scheme: light;
    text-align: left !important;
}

.admin-content input[type="date"]::-webkit-date-and-time-value,
.admin-content input[type="time"]::-webkit-date-and-time-value,
.admin-content input[type="datetime-local"]::-webkit-date-and-time-value {
    min-height: 1.2em;
    padding: 0;
    text-align: left;
}

.admin-content input[type="date"]::-webkit-datetime-edit,
.admin-content input[type="time"]::-webkit-datetime-edit,
.admin-content input[type="datetime-local"]::-webkit-datetime-edit {
    padding: 0;
}

.admin-content input[type="date"]::-webkit-calendar-picker-indicator,
.admin-content input[type="time"]::-webkit-calendar-picker-indicator,
.admin-content input[type="datetime-local"]::-webkit-calendar-picker-indicator {
    margin-left: auto;
    opacity: .65;
}

.admin-content textarea {
    box-sizing: border-box !important;
    width: 100% !important;
    min-height: 112px !important;
    padding: 12px 14px !important;
    border: 1px solid var(--bm-line) !important;
    border-radius: var(--bm-radius) !important;
    background: var(--bm-surface) !important;
    color: #333735 !important;
    font-family: inherit !important;
    font-size: 1rem !important;
    font-weight: 400 !important;
    line-height: 1.45 !important;
    outline: 0 !important;
    box-shadow: none !important;
    resize: vertical;
}

.admin-content .large-textarea textarea {
    min-height: 300px !important;
}

.admin-content input:not([type="checkbox"]):not([type="radio"]):focus,
.admin-content select:focus,
.admin-content textarea:focus,
.admin-content .ui-field:focus,
.admin-content .ui-field:focus-within {
    border-color: #717874 !important;
    box-shadow: 0 0 0 1px #717874 !important;
}

.admin-content .money-control {
    display: flex !important;
    justify-content: space-between !important;
    gap: .55rem !important;
}

.admin-content .money-control .money-input {
    width: auto !important;
    flex: 1 1 auto !important;
}

.admin-content .select-trigger {
    display: flex !important;
    justify-content: space-between !important;
    cursor: pointer;
}

.admin-content input[type="checkbox"] {
    accent-color: var(--bm-accent);
}

.admin-content .admin-form,
.admin-content .user-create {
    gap: 18px !important;
}

.admin-content .two-columns,
.admin-content .three-columns {
    gap: 16px !important;
}

.admin-content label {
    gap: 8px !important;
    color: #717775;
}

.admin-content .admin-form label,
.admin-content .user-create label {
    font-size: .92rem !important;
}

/* ---------- Actions ---------- */

.admin-content .admin-primary,
.admin-content .admin-secondary,
.admin-content .admin-danger,
.admin-content .action-button {
    min-height: 46px !important;
    border-radius: 8px !important;
}

.admin-content .action-link {
    min-height: 40px;
    padding: .45rem .65rem !important;
    border: 1px solid #d8dcda !important;
    border-radius: 8px !important;
    background: #fff !important;
}

.admin-content .action-link:hover {
    background: #f4f5f4 !important;
}

/* ---------- Mobile ---------- */

@media (max-width: 760px) {
    :root {
        --bm-control-height: 52px;
        --bm-radius: 10px;
    }

    .admin-content {
        overflow-x: hidden;
    }

    .admin-page-header {
        margin-bottom: 1.35rem !important;
        gap: .85rem !important;
    }

    .admin-kicker {
        margin-bottom: .55rem !important;
        font-size: .65rem !important;
        letter-spacing: .26em !important;
    }

    .admin-title {
        font-size: clamp(2rem, 10vw, 2.7rem) !important;
        line-height: 1.02 !important;
    }

    .admin-card {
        padding: 1rem !important;
        border-color: #dfe2e0 !important;
    }

    .admin-card h2 {
        font-size: clamp(1.45rem, 7.3vw, 2rem) !important;
        line-height: 1.1 !important;
    }

    .admin-content .two-columns,
    .admin-content .three-columns {
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 18px !important;
    }

    .admin-content input:not([type="checkbox"]):not([type="radio"]):not(.money-input),
    .admin-content select,
    .admin-content textarea,
    .admin-content .ui-field {
        font-size: 16px !important; /* prevents iOS focus zoom */
    }

    .admin-content .admin-form,
    .admin-content .user-create {
        gap: 20px !important;
    }

    .admin-content .admin-form label,
    .admin-content .user-create label {
        font-size: .95rem !important;
    }

    .admin-content .admin-actions {
        gap: .55rem !important;
    }

    .admin-content .admin-actions > a,
    .admin-content .admin-actions > button,
    .admin-content .admin-form > .admin-primary,
    .admin-content .admin-form > .admin-secondary,
    .admin-content .admin-form > .admin-danger {
        width: 100% !important;
        min-height: 50px !important;
    }

    .metric {
        font-size: 2.5rem !important;
    }

    .admin-grid > .admin-card {
        min-height: 118px !important;
    }

    /* list/table -> touch-friendly cards */
    .list-card,
    .users-table-wrap {
        overflow: visible !important;
    }

    .admin-table {
        min-width: 0 !important;
        width: 100% !important;
        display: block;
        background: transparent !important;
    }

    .admin-table thead {
        display: none;
    }

    .admin-table tbody {
        display: grid;
        gap: .7rem;
    }

    .admin-table tr {
        display: block;
        padding: .8rem .9rem;
        border: 1px solid #e0e3e1;
        border-radius: 11px;
        background: #fff;
    }

    .admin-table td {
        display: grid;
        grid-template-columns: minmax(92px, 34%) minmax(0, 1fr);
        align-items: start;
        gap: .7rem;
        padding: .48rem 0 !important;
        border: 0 !important;
        overflow-wrap: anywhere;
    }

    .admin-table td::before {
        content: attr(data-label);
        color: #969c99;
        font-size: .67rem;
        font-weight: 600;
        letter-spacing: .09em;
        line-height: 1.4;
        text-transform: uppercase;
    }

    .admin-table td[data-label="Aktionen"] {
        display: block;
        padding-top: .7rem !important;
    }

    .admin-table td[data-label="Aktionen"]::before {
        display: none;
    }

    .admin-table .action-list {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: .45rem !important;
    }

    .admin-table .action-link {
        min-height: 44px;
        justify-content: center;
        padding: .55rem .65rem !important;
    }

    .status-pill {
        width: fit-content;
    }
}

@media (max-width: 390px) {
    .admin-content {
        padding-left: .8rem !important;
        padding-right: .8rem !important;
    }

    .admin-card {
        padding: .9rem !important;
    }

    .admin-table .action-list {
        grid-template-columns: 1fr;
    }
}

/* ---------- Installed-app polish ---------- */

@media (display-mode: standalone) {
    body {
        min-height: 100dvh;
    }

    .admin-sidebar {
        padding-top: max(.8rem, env(safe-area-inset-top)) !important;
    }

    .mobile-admin-footer {
        padding-bottom: max(1rem, env(safe-area-inset-bottom)) !important;
    }
}

/* ---------- Booking-Manager v4.8 correction layer ---------- */

.admin-content .select-control,
.admin-content .money-control {
    width: 100% !important;
}

/* One visual language for every form control, including iOS Safari. */
.admin-content input:not([type="checkbox"]):not([type="radio"]):not(.money-input),
.admin-content select,
.admin-content .ui-field {
    height: var(--bm-control-height) !important;
    min-height: var(--bm-control-height) !important;
    padding: 0 14px !important;
    border: 1px solid var(--bm-line) !important;
    border-radius: var(--bm-radius) !important;
    background: #fff !important;
    font-size: 16px !important;
    line-height: normal !important;
}

.admin-content .money-control {
    height: var(--bm-control-height) !important;
    min-height: var(--bm-control-height) !important;
    padding: 0 14px !important;
}

.admin-content .money-control .money-input {
    box-sizing: border-box !important;
    height: calc(var(--bm-control-height) - 2px) !important;
    min-height: calc(var(--bm-control-height) - 2px) !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: #333735 !important;
    font: inherit !important;
    font-size: 16px !important;
    line-height: normal !important;
    -webkit-appearance: none !important;
    appearance: none !important;
}

.admin-content .money-control .currency {
    flex: 0 0 auto !important;
    padding: 0 !important;
    color: #555b58 !important;
    font-size: 16px !important;
    line-height: 1 !important;
}

.admin-content .select-trigger {
    height: var(--bm-control-height) !important;
    min-height: var(--bm-control-height) !important;
    padding: 0 14px !important;
}

.admin-content input[type="date"],
.admin-content input[type="time"],
.admin-content input[type="datetime-local"] {
    -webkit-appearance: none !important;
    appearance: none !important;
    display: block !important;
    border-radius: var(--bm-radius) !important;
    background-color: #fff !important;
    color: #333735 !important;
    text-align: left !important;
}

.admin-content input[type="date"]::-webkit-date-and-time-value,
.admin-content input[type="time"]::-webkit-date-and-time-value,
.admin-content input[type="datetime-local"]::-webkit-date-and-time-value {
    min-height: 20px !important;
    margin: 0 !important;
    padding: 0 !important;
    text-align: left !important;
}

.admin-content textarea {
    border: 1px solid var(--bm-line) !important;
    border-radius: var(--bm-radius) !important;
    background: #fff !important;
    font-size: 16px !important;
}

.booking-date-time {
    display: inline-block;
    white-space: nowrap;
}

.customer-summary-cell strong {
    display: block;
    color: #3e4241;
}

.customer-contact-lines {
    display: grid;
    gap: .18rem;
    margin-top: .28rem;
    color: #7b817e;
    font-size: .9rem;
    overflow-wrap: anywhere;
}

.admin-content .admin-secondary .ui-icon,
.admin-content a.admin-secondary .ui-icon {
    width: 20px !important;
    height: 20px !important;
    flex: 0 0 20px !important;
}

.settings-intro {
    margin: -.25rem 0 1.2rem;
    color: #858b88;
    font-size: .88rem;
    line-height: 1.55;
}

.field-hint {
    display: block;
    margin-top: .12rem;
    color: #969c99;
    font-size: .76rem;
    line-height: 1.45;
}

.standalone-hint {
    margin: -.55rem 0 .15rem 30px;
}

.mail-template-overview {
    display: grid;
    gap: .55rem;
    padding: .9rem 1rem;
    border: 1px solid #e0e3e1;
    border-radius: var(--bm-radius);
    background: #fafafa;
}

.mail-template-overview > div {
    display: grid;
    gap: .15rem;
}

.mail-template-overview strong {
    color: #4a504d;
    font-size: .78rem;
}

.mail-template-overview span {
    color: #7d8380;
    font-size: .82rem;
}

@media (max-width: 760px) {
    html,
    body {
        overscroll-behavior-y: none;
    }

    .admin-content .admin-card {
        border-radius: 12px !important;
    }

    .admin-table td[data-label="Termin"] {
        grid-template-columns: 72px minmax(0, 1fr) !important;
    }

    .customer-summary-cell {
        display: block !important;
        padding-bottom: .7rem !important;
    }

    .customer-summary-cell::before {
        display: none !important;
    }

    .customer-summary-cell strong {
        font-size: 1rem;
    }

    .customer-contact-lines {
        font-size: .9rem;
    }

    .standalone-hint {
        margin-left: 0;
    }
}

.login-page {
    position: relative;
    padding-bottom: 4.5rem !important;
}

.login-page::after {
    content: "Booking-Manager v4.9.2";
    position: absolute;
    left: 1rem;
    right: 1rem;
    bottom: max(1.15rem, env(safe-area-inset-bottom));
    color: #9a9f9c;
    font-size: .7rem;
    letter-spacing: .035em;
    text-align: center;
}

@media (max-width: 760px) {
    .upcoming-row > div:last-child {
        white-space: nowrap;
    }
}

.email-settings-card {
    grid-column: 1 / -1;
}


/* ---------- Booking-Manager v4.8.1 corrections ---------- */

.booking-date-time {
    white-space: normal;
}

.booking-date,
.booking-time {
    white-space: nowrap;
}

.booking-time::before {
    content: " · ";
}

.recipient-picker {
    display: grid;
    gap: .5rem;
}

.recipient-picker-title {
    color: #717775;
    font-size: .82rem;
}

.recipient-options {
    display: grid;
    gap: .42rem;
}

.admin-content .recipient-choice {
    min-height: 46px;
    display: flex !important;
    grid-template-columns: none !important;
    flex-direction: row;
    align-items: center;
    gap: .7rem !important;
    padding: .65rem .8rem;
    border: 1px solid #e0e3e1;
    border-radius: var(--bm-radius);
    background: #fff;
    color: #565c59;
    font-size: .9rem !important;
}

.admin-content .recipient-choice input[type="checkbox"] {
    flex: 0 0 auto;
}

.email-copy-row {
    margin-top: -.15rem;
}

@media (max-width: 760px) {
    .booking-date-time {
        display: grid;
        gap: .12rem;
        justify-items: start;
    }

    .booking-time::before {
        content: "";
    }

    .admin-table td.customer-summary-cell {
        display: block;
    }

    .admin-table td.customer-summary-cell::before {
        display: none;
    }

    .customer-summary-cell strong {
        font-size: 1rem;
    }

    .customer-contact-lines {
        width: 100%;
        margin-top: .3rem;
        font-size: .86rem;
        line-height: 1.45;
        overflow-wrap: anywhere;
    }
}


/* ---------- Booking-Manager v4.8.2 corrections ---------- */

html {
    scroll-behavior: smooth;
}

@media (max-width: 760px) {
    /*
       Keep date and time on separate rows, but align both with the same value
       column as customer, package, price and status.
    */
    .admin-table td[data-label="Termin"] {
        grid-template-columns: minmax(92px, 34%) minmax(0, 1fr) !important;
    }

    .booking-date-time {
        width: 100%;
        display: grid;
        gap: .12rem;
        justify-items: start;
        align-items: start;
    }

    .booking-date,
    .booking-time {
        display: block;
        width: 100%;
        margin: 0;
        padding: 0;
        text-align: left;
        white-space: nowrap;
    }

    /*
       Users are a dedicated mobile list rather than a desktop table squeezed
       into the generic table-card pattern.
    */
    .users-table-wrap .admin-table tbody {
        gap: .7rem;
    }

    .users-table-wrap .admin-table .user-row {
        display: grid;
        gap: .65rem;
        padding: 1rem;
    }

    .users-table-wrap .admin-table .user-identity-cell,
    .users-table-wrap .admin-table .user-status-cell,
    .users-table-wrap .admin-table .user-actions-cell {
        display: block !important;
        padding: 0 !important;
    }

    .users-table-wrap .admin-table .user-identity-cell::before,
    .users-table-wrap .admin-table .user-status-cell::before,
    .users-table-wrap .admin-table .user-actions-cell::before {
        display: none !important;
    }

    .user-identity {
        min-width: 0;
        display: flex;
        align-items: center;
        gap: .55rem;
        flex-wrap: wrap;
    }

    .user-identity strong {
        min-width: 0;
        color: #3e4241;
        font-size: .94rem;
        line-height: 1.35;
        overflow-wrap: anywhere;
    }

    .self-label {
        flex: 0 0 auto;
        display: inline-flex;
        align-items: center;
        min-height: 24px;
        padding: .15rem .55rem;
        border-radius: 999px;
        background: #f1f2f1;
        color: #777d79;
        font-size: .7rem;
        line-height: 1;
    }

    .users-table-wrap .user-status-cell {
        margin-top: .05rem;
    }

    .users-table-wrap .user-actions-cell:empty {
        display: none !important;
    }

    .users-table-wrap .user-actions-cell .action-list {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        margin-top: .15rem;
    }

    .users-table-wrap .user-actions-cell .action-link {
        min-width: 0;
        width: 100%;
        min-height: 46px;
        justify-content: center;
    }
}

@media (max-width: 390px) {
    .users-table-wrap .user-actions-cell .action-list {
        grid-template-columns: 1fr !important;
    }
}


/* ---------- Booking-Manager v4.8.4 corrections ---------- */

.create-after-list {
    margin-top: 1rem;
}

.create-after-list > h2 {
    margin: 0 0 1.2rem;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 1.7rem;
    font-weight: 400;
}

.mobile-users-list {
    display: none;
}

@media (max-width: 760px) {
    .desktop-users-table {
        display: none !important;
    }

    .mobile-users-list {
        display: grid;
        gap: .75rem;
        margin-top: 1rem;
    }

    .mobile-user-card {
        min-width: 0;
        display: grid;
        gap: .75rem;
        padding: 1rem;
        border: 1px solid #dfe2e1;
        border-radius: var(--bm-radius);
        background: #fff;
    }

    .mobile-user-heading {
        min-width: 0;
        display: flex;
        align-items: center;
        gap: .55rem;
        flex-wrap: wrap;
    }

    .mobile-user-heading strong {
        min-width: 0;
        font-size: 1rem;
        line-height: 1.35;
        color: #343936;
        overflow-wrap: anywhere;
        word-break: break-word;
    }

    .mobile-user-card > .status-pill {
        width: fit-content;
    }

    .mobile-user-actions {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: .55rem;
    }

    .mobile-user-actions .action-link {
        width: 100%;
        min-height: 46px;
        justify-content: center;
        border: 1px solid #d7dbd8;
        border-radius: var(--bm-radius);
        background: #fff;
        padding: .7rem .75rem;
    }
}

@media (max-width: 390px) {
    .mobile-user-actions {
        grid-template-columns: 1fr;
    }
}


/* ---------- Booking-Manager v4.8.4 mail diagnostics ---------- */

.mail-test-panel {
    display: grid;
    gap: .55rem;
    padding: .9rem 1rem;
    border: 1px solid #e0e3e1;
    border-radius: var(--bm-radius);
    background: #fafafa;
}

.mail-test-actions {
    display: flex;
    gap: .65rem;
    flex-wrap: wrap;
}

.mail-test-actions .admin-secondary {
    min-width: 180px;
}

.mail-test-result {
    padding: .7rem .8rem;
    border-radius: var(--bm-radius);
    font-size: .82rem;
    line-height: 1.45;
}

.mail-test-result.success {
    border: 1px solid #bfd3c4;
    background: #f0f6f1;
    color: #506a55;
}

.mail-test-result.error {
    border: 1px solid #dfc5c5;
    background: #fbf3f3;
    color: #8b5555;
}

@media (max-width: 760px) {
    .mail-test-actions {
        display: grid;
        grid-template-columns: 1fr;
    }

    .mail-test-actions .admin-secondary {
        width: 100%;
        min-width: 0;
    }
}


/* ---------- Booking-Manager v4.8.4 iOS system-area refinement ---------- */
html,
body {
    background-color: #ffffff;
}

.admin-shell,
.admin-main,
.admin-content {
    background-color: #f7f7f6;
}

@media (max-width: 760px) {
    html {
        background: #ffffff !important;
    }

    body {
        min-height: 100dvh;
        background:
            linear-gradient(
                to bottom,
                #ffffff 0,
                #ffffff max(env(safe-area-inset-top), 0px),
                #f7f7f6 max(env(safe-area-inset-top), 0px),
                #f7f7f6 100%
            ) !important;
    }

    .admin-sidebar {
        background: #ffffff !important;
    }
}


/* ---------- Booking-Manager v4.9 interaction + mobile refinements ---------- */

/* One central action-icon box for every admin action.
   UiIcon itself normalizes arbitrary SVG viewBox aspect ratios to this box. */
.admin-content .admin-primary .ui-icon,
.admin-content .admin-secondary .ui-icon,
.admin-content .admin-danger .ui-icon,
.admin-content .action-button .ui-icon,
.admin-content .action-link .ui-icon {
    width: 17px !important;
    height: 17px !important;
    flex: 0 0 17px !important;
    margin: 0 !important;
    vertical-align: middle;
}

.admin-content .admin-primary,
.admin-content .admin-secondary,
.admin-content .admin-danger,
.admin-content .action-button,
.admin-content .action-link {
    column-gap: .55rem !important;
}

/* Dashboard KPI cards are full-card navigation targets. */
.admin-content .metric-card {
    display: block;
    color: inherit;
    text-decoration: none;
    cursor: pointer;
    transition: transform .12s ease, border-color .12s ease, background-color .12s ease, box-shadow .12s ease;
}

.admin-content .metric-card:hover {
    color: inherit;
    text-decoration: none;
    border-color: #c5cac7;
    background: #fcfcfb;
    box-shadow: 0 2px 10px rgba(48, 54, 51, .04);
}

.admin-content .metric-card:active {
    transform: translateY(1px);
    background: #f7f8f7;
}

.admin-content .metric-card:focus-visible {
    outline: 2px solid #747a77;
    outline-offset: 2px;
}

@media (max-width: 760px) {
    /* Creation actions stay thumb-reachable on the right without changing desktop. */
    .admin-content .create-action {
        width: auto !important;
        max-width: 100%;
        align-self: flex-end !important;
        justify-self: end !important;
    }

    .admin-content .admin-page-header > .create-action {
        margin-left: auto;
    }

    /* Mobile dashboard: two booking KPIs in row one, customers full width below. */
    .admin-content .dashboard-kpi-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: .75rem !important;
    }

    .admin-content .dashboard-kpi-grid > .metric-card {
        min-width: 0;
        min-height: 112px !important;
        padding: .95rem !important;
    }

    .admin-content .dashboard-kpi-grid > .metric-card-customers {
        grid-column: 1 / -1;
        min-height: 104px !important;
    }

    .admin-content .dashboard-kpi-grid .admin-muted {
        font-size: .82rem;
        line-height: 1.25;
    }

    .admin-content .dashboard-kpi-grid .metric {
        margin-top: .5rem;
        font-size: 2.35rem !important;
        line-height: 1;
    }
}

@media (max-width: 760px) {
    .admin-content .admin-actions > .create-action,
    .admin-content .admin-form > .create-action,
    .admin-content .user-create > .create-action {
        width: auto !important;
        max-width: 100%;
        margin-left: auto;
        align-self: flex-end !important;
        justify-self: end !important;
    }
}


/* ---------- Booking-Manager v4.9 nav icon softening ---------- */

/* Only navigation icons/buttons are softened. Content/action icons stay untouched. */
.admin-sidebar .primary-nav a img,
.admin-sidebar .settings-link img,
.admin-sidebar form button img,
.mobile-admin-footer .mobile-footer-action img {
    opacity: .48;
    transform: scale(.92);
    transform-origin: center;
}

.admin-sidebar .primary-nav a.active img,
.admin-sidebar .settings-link.active img,
.mobile-admin-footer .mobile-footer-action.active img {
    opacity: .68;
}

@media (max-width: 760px) {
    /* Give all mobile nav targets a very light outline like the active chip,
       but keep inactive items without fill. */
    .admin-sidebar .primary-nav a,
    .mobile-admin-footer .mobile-footer-action {
        border: 1px solid #ecefed !important;
        border-radius: 14px !important;
        background: transparent !important;
        box-shadow: none !important;
    }

    .admin-sidebar .primary-nav a img,
    .mobile-admin-footer .mobile-footer-action img,
    .admin-sidebar .settings-link img,
    .admin-sidebar form button img {
        opacity: .38;
        transform: scale(.9);
    }

    .admin-sidebar .primary-nav a.active,
    .mobile-admin-footer .mobile-footer-action.active {
        border-color: #e3e7e4 !important;
        background: #f7f8f7 !important;
    }

    .admin-sidebar .primary-nav a.active img,
    .mobile-admin-footer .mobile-footer-action.active img {
        opacity: .58;
    }
}


/* ---------- Booking-Manager v4.9 nav icon outline correction ---------- */

@media (max-width: 760px) {
    /* Remove the extra outer outline introduced in v2.1.
       Keep the existing active-element styling only. */
    .admin-sidebar .primary-nav a,
    .mobile-admin-footer .mobile-footer-action {
        border: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
    }

    /* Keep the icons soft, but do not draw a second frame around the whole item. */
    .admin-sidebar .primary-nav a img,
    .mobile-admin-footer .mobile-footer-action img,
    .admin-sidebar .settings-link img,
    .admin-sidebar form button img {
        opacity: .40;
        transform: scale(.9);
    }

    .admin-sidebar .primary-nav a.active img,
    .mobile-admin-footer .mobile-footer-action.active img {
        opacity: .58;
    }
}


/* ---------- Booking-Manager v4.9 nav icon tile correction v2.3 ---------- */

@media (max-width: 760px) {
    /* The 48px navigation target itself stays completely invisible. */
    .admin-sidebar .primary-nav a {
        border: 0 !important;
        border-radius: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
    }

    /* Every navigation icon gets exactly the same small tile outline. */
    .admin-sidebar .primary-nav a img {
        box-sizing: border-box !important;
        width: 36px !important;
        height: 36px !important;
        flex: 0 0 36px !important;
        padding: 6px !important;
        border: 1px solid #e0e3e1 !important;
        border-radius: 9px !important;
        background: transparent !important;
        opacity: .48 !important;
        transform: none !important;
    }

    /* Active item keeps the established v4.8.x fill; no second frame/fill. */
    .admin-sidebar .primary-nav a.active img {
        border-color: #e0e3e1 !important;
        background: #f1f2f1 !important;
        opacity: .68 !important;
    }
}


/* ---------- Booking-Manager v4.9 nav final mobile correction v2.4 ---------- */

@media (max-width: 760px) {
    /* Remove any active outer tile/background completely. */
    .admin-sidebar .primary-nav a,
    .admin-sidebar .primary-nav a.active,
    .admin-sidebar .primary-nav a:focus,
    .admin-sidebar .primary-nav a:hover {
        background: transparent !important;
        border: 0 !important;
        box-shadow: none !important;
        outline: 0 !important;
    }

    /* Pull mobile nav items a bit closer together and free more space left/right. */
    .admin-sidebar .primary-nav {
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        gap: .55rem !important;
        padding-left: .35rem !important;
        padding-right: .35rem !important;
    }

    .admin-sidebar .primary-nav a {
        min-width: 0 !important;
        width: auto !important;
        flex: 0 0 auto !important;
        padding: 0 !important;
    }

    /* The small inner icon tile is the only visible shape. */
    .admin-sidebar .primary-nav a img {
        box-sizing: border-box !important;
        width: 36px !important;
        height: 36px !important;
        flex: 0 0 36px !important;
        display: block !important;
        padding: 6px !important;
        border: 1px solid #e0e3e1 !important;
        border-radius: 9px !important;
        background: transparent !important;
        box-shadow: none !important;
        opacity: .48 !important;
        transform: none !important;
    }

    /* Active item keeps exactly the same tile size + outline, only with fill. */
    .admin-sidebar .primary-nav a.active img {
        border-color: #e0e3e1 !important;
        background: #f1f2f1 !important;
        opacity: .68 !important;
    }
}


/* ---------- Booking-Manager v4.9 mobile nav spacing correction v2.5 ---------- */

@media (max-width: 760px) {
    /* Six compact, centered navigation slots.
       Do not spread them across the full width. */
    .admin-sidebar .primary-nav {
        width: auto !important;
        max-width: none !important;
        margin-left: auto !important;
        margin-right: auto !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        display: grid !important;
        grid-template-columns: repeat(6, 40px) !important;
        justify-content: center !important;
        align-items: center !important;
        column-gap: clamp(12px, 3.2vw, 20px) !important;
        row-gap: 0 !important;
    }

    .admin-sidebar .primary-nav a,
    .admin-sidebar .primary-nav a.active,
    .admin-sidebar .primary-nav a:hover,
    .admin-sidebar .primary-nav a:focus {
        width: 40px !important;
        min-width: 40px !important;
        max-width: 40px !important;
        height: 40px !important;
        min-height: 40px !important;
        padding: 2px !important;
        margin: 0 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        background: transparent !important;
        border: 0 !important;
        box-shadow: none !important;
        outline: 0 !important;
    }
}


/* ---------- Booking-Manager v4.9 navigation icon set v3 ---------- */

/* v3 uses a uniform 24x24 SVG viewBox. Keep the visible glyph area centered
   and identical for every main-navigation icon. */
.admin-sidebar .primary-nav img[src^="/icons/v3/"] {
    object-fit: contain !important;
    object-position: 50% 50% !important;
    vertical-align: middle !important;
}

@media (max-width: 760px) {
    /* Preserve the v2.5 mobile navigation geometry exactly. Only normalize the
       v3 glyph inside the existing 36px outlined tile. */
    .admin-sidebar .primary-nav img[src^="/icons/v3/"] {
        box-sizing: border-box !important;
        width: 36px !important;
        height: 36px !important;
        flex: 0 0 36px !important;
        display: block !important;
        padding: 6px !important;
        margin: 0 !important;
        object-fit: contain !important;
        object-position: center center !important;
        transform: none !important;
    }
}


/* ---------- Booking-Manager v4.9.1 reservation actions ---------- */
.reservation-status {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: .85rem 1rem;
    border: 1px solid #e0e3e1;
    border-radius: var(--bm-radius);
    background: #fafafa;
    color: #737976;
    font-size: .86rem;
}

.reservation-status span {
    color: #969c99;
    font-size: .72rem;
    font-weight: 600;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.reservation-status strong {
    color: #555b58;
    font-weight: 600;
    text-align: right;
}

.reservation-status.is-expired {
    border-color: #e6d7bd;
    background: #fffaf1;
}

.reservation-status.is-expired strong {
    color: #8a6b32;
}

@media (max-width: 760px) {
    .reservation-status {
        align-items: flex-start;
        flex-direction: column;
        gap: .3rem;
    }

    .reservation-status strong {
        text-align: left;
    }
}

/* ---------- Booking-Manager v4.9.1 booking-detail action icon/layout refinement ---------- */

.admin-content .booking-detail-actions {
    gap: .75rem !important;
}

.admin-content .booking-detail-actions > a,
.admin-content .booking-detail-actions > button {
    justify-content: flex-start !important;
    text-align: left !important;
    padding-left: 1.15rem !important;
    padding-right: 1.15rem !important;
}

.admin-content .booking-detail-actions .ui-icon,
.admin-content .booking-detail-actions .detail-action-icon {
    width: 19px !important;
    height: 19px !important;
    min-width: 19px !important;
    max-width: 19px !important;
    flex: 0 0 19px !important;
    display: block !important;
    margin: 0 !important;
    opacity: 1 !important;
}

.admin-content .booking-detail-actions > a,
.admin-content .booking-detail-actions > button,
.admin-content .booking-detail-actions .copy-link-button,
.admin-content .booking-detail-actions .copy-link-button > button {
    column-gap: .8rem !important;
}

@media (max-width: 760px) {
    .admin-content .booking-detail-actions > a,
    .admin-content .booking-detail-actions > button,
    .admin-content .booking-detail-actions .copy-link-button > button {
        justify-content: flex-start !important;
        padding-left: 1rem !important;
        padding-right: 1rem !important;
    }
}

/* ---------- Booking-Manager v4.9.1 action layout correction 02 ---------- */

/* Save is intentionally a light outlined action in the booking detail. */
.admin-content .booking-detail-actions .booking-detail-save {
    background: #fff !important;
    color: #3e4241 !important;
    border-color: #bfc5c1 !important;
    box-shadow: none !important;
}

.admin-content .booking-detail-actions .booking-detail-save:hover {
    background: #f7f8f7 !important;
}

@media (max-width: 760px) {
    /* Customers: edit full width, archive/delete below. */
    .admin-table .customer-list-actions {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: .55rem !important;
    }

    .admin-table .customer-list-actions > :first-child {
        grid-column: 1 / -1;
    }

    .admin-table .customer-list-actions > a,
    .admin-table .customer-list-actions > button {
        width: 100% !important;
        min-width: 0 !important;
        min-height: 46px !important;
        justify-content: center !important;
    }

    /* Bookings: edit full width, copy/complete below. */
    .admin-table .booking-list-actions {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: .55rem !important;
    }

    .admin-table .booking-list-actions > :first-child {
        grid-column: 1 / -1;
    }

    .admin-table .booking-list-actions > a,
    .admin-table .booking-list-actions > button {
        width: 100% !important;
        min-width: 0 !important;
        min-height: 46px !important;
        justify-content: center !important;
    }

    /* If no 'Abschließen' action exists, Link kopieren spans the full second row. */
    .admin-table .booking-list-actions > :nth-child(2):last-child {
        grid-column: 1 / -1;
    }
}

/* ---------- Booking-Manager v4.9.1 action layout correction 03 ---------- */

@media (max-width: 760px) {
    /* Two booking actions: both buttons share one row. */
    .admin-table .booking-list-actions.two-actions {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    .admin-table .booking-list-actions.two-actions > :first-child,
    .admin-table .booking-list-actions.two-actions > :nth-child(2):last-child {
        grid-column: auto !important;
    }

    /* Confirmed booking: edit full width, copy + complete below. */
    .admin-table .booking-list-actions.has-complete-action > :first-child {
        grid-column: 1 / -1 !important;
    }
}

/* ---------- Booking-Manager v4.9.1 action layout correction 04 ---------- */

@media (max-width: 760px) {
    /* Final booking card rule:
       always show Bearbeiten + Link kopieren side by side,
       and if available place Abschließen full width below. */
    .admin-table .booking-list-actions.has-complete-action {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    .admin-table .booking-list-actions.has-complete-action > :first-child,
    .admin-table .booking-list-actions.has-complete-action > :nth-child(2) {
        grid-column: auto !important;
    }

    .admin-table .booking-list-actions.has-complete-action > :nth-child(3):last-child {
        grid-column: 1 / -1 !important;
    }

    /* Normalize the visible frames of all neutral booking action buttons. */
    .admin-table .booking-list-actions > a,
    .admin-table .booking-list-actions > button,
    .admin-table .booking-list-actions .copy-link-button > button {
        border: 1px solid #bfc5c1 !important;
        border-radius: 14px !important;
        box-shadow: none !important;
    }
}


/* ---------- Booking-Manager v4.9.1 settings/mail preview + navigation v4 ---------- */
.settings-confirmation-preview {
    width: fit-content;
    text-decoration: none;
}
.mail-template-section {
    display: grid;
    gap: .8rem;
    padding: 1rem;
    border: 1px solid #e0e3e1;
    border-radius: var(--bm-radius);
    background: #fafafa;
}
.mail-template-actions {
    display: flex;
    align-items: center;
    gap: .75rem;
    flex-wrap: wrap;
}
.mail-template-actions .admin-secondary { min-width: 190px; }
.admin-sidebar img[src^="/icons/v4/"] {
    object-fit: contain !important;
    object-position: 50% 50% !important;
    vertical-align: middle !important;
}
@media (max-width: 760px) {
    .settings-confirmation-preview { width: 100% !important; justify-content: center !important; }
    .mail-template-actions { display:grid; grid-template-columns:1fr; }
    .mail-template-actions .admin-secondary { width:100%; min-width:0; }
    .admin-sidebar .primary-nav img[src^="/icons/v4/"] {
        box-sizing: border-box !important; width:36px !important; height:36px !important; flex:0 0 36px !important; display:block !important; padding:6px !important; margin:0 !important; object-fit:contain !important; object-position:center center !important; transform:none !important;
    }
}

/* ---------- Booking-Manager v4.9.1 correction round 05 ---------- */

/* E-mail settings: three clearly separated functional groups. */
.email-settings-form {
    gap: 1rem !important;
}

.email-settings-group {
    display: grid;
    gap: 1rem;
    padding: 1.15rem;
    border: 1px solid #dfe2e1;
    border-radius: var(--bm-radius);
    background: #fafafa;
}

.email-settings-group-header {
    display: grid;
    gap: .28rem;
    padding-bottom: .85rem;
    border-bottom: 1px solid #e3e6e4;
}

.email-settings-group-header h3 {
    margin: 0;
    color: #444a47;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 1.28rem;
    font-weight: 400;
    line-height: 1.2;
}

.email-settings-group-header p {
    margin: 0;
    color: #8a908d;
    font-size: .8rem;
    line-height: 1.5;
}

.email-settings-group .mail-test-panel,
.email-settings-group .recipient-picker {
    margin: 0;
}

.email-settings-group .mail-template-actions {
    margin: 0;
}

.email-settings-group .email-copy-row {
    margin-top: 0;
}

.email-settings-save {
    width: 100%;
}

/* Booking list: one shared geometry for edit/copy/complete.
   The CopyLinkButton explicitly receives the same class as the other actions. */
.admin-content .admin-table .booking-list-actions {
    display: grid !important;
    grid-template-columns: repeat(2, 140px) !important;
    align-items: center !important;
    justify-content: start !important;
    gap: .55rem !important;
}

.admin-content .admin-table .booking-list-actions > .booking-list-action {
    box-sizing: border-box !important;
    width: 140px !important;
    min-width: 140px !important;
    max-width: 140px !important;
    height: 42px !important;
    min-height: 42px !important;
    padding: 0 .72rem !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: .42rem !important;
    border: 1px solid #bfc5c1 !important;
    border-radius: var(--bm-radius) !important;
    background: #fff !important;
    box-shadow: none !important;
    color: #4f5552 !important;
    font: inherit !important;
    font-size: .87rem !important;
    line-height: 1 !important;
    text-align: center !important;
    text-decoration: none !important;
    white-space: nowrap !important;
}

.admin-content .admin-table .booking-list-actions > .booking-list-action:hover {
    border-color: #909692 !important;
    background: #f6f7f6 !important;
    color: #333835 !important;
}

.admin-content .admin-table .booking-list-actions > .booking-list-action .ui-icon {
    width: 14px !important;
    height: 14px !important;
    min-width: 14px !important;
    max-width: 14px !important;
    flex: 0 0 14px !important;
    margin: 0 !important;
}

/* Main navigation v4: keep the supplied SVG files untouched and normalize
   geometry centrally. Optical opacity compensates for different path density. */
.admin-sidebar img[src^="/icons/v4/"],
.mobile-admin-footer img[src^="/icons/v4/"] {
    --bm-nav-optical-opacity: .50;
    object-fit: contain !important;
    object-position: 50% 50% !important;
    transform: none !important;
}

.admin-sidebar img[src$="/v4/dashboard.svg"] { --bm-nav-optical-opacity: .62; }
.admin-sidebar img[src$="/v4/anfragen.svg"] { --bm-nav-optical-opacity: .54; }
.admin-sidebar img[src$="/v4/buchungen.svg"] { --bm-nav-optical-opacity: .46; }
.admin-sidebar img[src$="/v4/kunden.svg"] { --bm-nav-optical-opacity: .39; }
.admin-sidebar img[src$="/v4/pakete.svg"] { --bm-nav-optical-opacity: .37; }
.admin-sidebar img[src$="/v4/buchungsinfos.svg"] { --bm-nav-optical-opacity: .47; }
.admin-sidebar img[src$="/v4/settings.svg"],
.mobile-admin-footer img[src$="/v4/settings.svg"] { --bm-nav-optical-opacity: .47; }
.admin-sidebar img[src$="/v4/logout.svg"],
.mobile-admin-footer img[src$="/v4/logout.svg"] { --bm-nav-optical-opacity: .70; }

.admin-sidebar .primary-nav a img[src^="/icons/v4/"],
.admin-sidebar .settings-link img[src^="/icons/v4/"],
.admin-sidebar form button img[src^="/icons/v4/"],
.mobile-admin-footer .mobile-footer-action img[src^="/icons/v4/"] {
    opacity: var(--bm-nav-optical-opacity) !important;
}

.admin-sidebar .primary-nav a.active img[src^="/icons/v4/"],
.admin-sidebar .settings-link.active img[src^="/icons/v4/"],
.mobile-admin-footer .mobile-footer-action.active img[src^="/icons/v4/"] {
    opacity: calc(var(--bm-nav-optical-opacity) + .12) !important;
}

@media (max-width: 760px) {
    /* Dashboard and bookings use exactly one KPI-column width for the create CTA. */
    .admin-content .admin-page-header > .mobile-kpi-width-action {
        box-sizing: border-box !important;
        width: calc((100% - .75rem) / 2) !important;
        min-width: 0 !important;
        max-width: none !important;
        margin-left: auto !important;
        align-self: flex-end !important;
        justify-self: end !important;
    }

    /* Booking list retains the required two-column mobile arrangement. */
    .admin-content .admin-table .booking-list-actions {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: .55rem !important;
    }

    .admin-content .admin-table .booking-list-actions > .booking-list-action {
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;
        height: 46px !important;
        min-height: 46px !important;
        border-radius: var(--bm-radius) !important;
    }

    .admin-content .admin-table .booking-list-actions.has-complete-action > :nth-child(3):last-child {
        grid-column: 1 / -1 !important;
    }

    /* Draw one identical tile independently from the SVG itself, so optical
       icon balancing never changes the frame strength. */
    .admin-sidebar .primary-nav a {
        position: relative !important;
    }

    .admin-sidebar .primary-nav a::before {
        content: "";
        position: absolute;
        inset: 2px;
        z-index: 0;
        box-sizing: border-box;
        border: 1px solid #e0e3e1;
        border-radius: 9px;
        background: transparent;
        pointer-events: none;
    }

    .admin-sidebar .primary-nav a.active::before {
        background: #f1f2f1;
    }

    .admin-sidebar .primary-nav a img[src^="/icons/v4/"] {
        position: relative !important;
        z-index: 1 !important;
        box-sizing: border-box !important;
        width: 24px !important;
        height: 24px !important;
        flex: 0 0 24px !important;
        padding: 0 !important;
        margin: 0 !important;
        border: 0 !important;
        border-radius: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
    }

    .mobile-admin-footer .mobile-footer-action img[src^="/icons/v4/"] {
        width: 19px !important;
        height: 19px !important;
        flex: 0 0 19px !important;
    }

    .email-settings-group {
        padding: .95rem;
    }

    .email-settings-group-header h3 {
        font-size: 1.2rem;
    }
}


/* ---------- Booking-Manager v4.9.1 navigation refinement 06 ---------- */

/* All v4 navigation files share the same 24x24 viewBox. Their filled path
   density differs, so optical opacity is normalized centrally instead of
   altering the supplied SVG files. The alternative booking-info icon is a
   denser glyph and therefore receives its own balancing value. */
.admin-sidebar img[src$="/v4/buchungsinfos-alternativ.svg"] {
    --bm-nav-optical-opacity: .41;
}

@media (max-width: 760px) {
    /* Keep the existing 40x40 touch target, make the visible tile slightly
       larger (38x38 instead of 36x36) and the glyph minimally smaller. */
    .admin-sidebar .primary-nav a::before {
        inset: 1px !important;
        border-radius: 10px !important;
    }

    .admin-sidebar .primary-nav a img[src^="/icons/v4/"] {
        width: 22px !important;
        height: 22px !important;
        flex: 0 0 22px !important;
    }
}

@media (min-width: 761px) {
    /* Calm sidebar hover state for mouse/trackpad use. Active entries keep
       their established selected state. */
    .admin-sidebar .primary-nav a,
    .admin-sidebar .settings-link,
    .admin-sidebar form button {
        transition:
            background-color 140ms ease,
            color 140ms ease,
            border-color 140ms ease;
    }

    .admin-sidebar .primary-nav a img[src^="/icons/v4/"],
    .admin-sidebar .settings-link img[src^="/icons/v4/"],
    .admin-sidebar form button img[src^="/icons/v4/"] {
        transition: opacity 140ms ease;
    }

    .admin-sidebar .primary-nav a:hover:not(.active),
    .admin-sidebar .settings-link:hover:not(.active),
    .admin-sidebar form button:hover {
        background: #f6f7f6 !important;
        color: #3f4542 !important;
    }

    .admin-sidebar .primary-nav a:hover:not(.active),
    .admin-sidebar .settings-link:hover:not(.active) {
        border-left-color: #c8cdca !important;
    }

    .admin-sidebar .primary-nav a:hover:not(.active) img[src^="/icons/v4/"],
    .admin-sidebar .settings-link:hover:not(.active) img[src^="/icons/v4/"],
    .admin-sidebar form button:hover img[src^="/icons/v4/"] {
        opacity: calc(var(--bm-nav-optical-opacity) + .08) !important;
    }
}


/* ---------- Booking-Manager v4.9.1 per-user mobile navigation 07 ---------- */

/* Personal display preference in Settings. The preference is stored per
   Identity user; no global AppSettings value is changed. */
.mobile-navigation-setting {
    display: grid;
    gap: 1rem;
}

.mobile-navigation-setting-header {
    display: grid;
    gap: .28rem;
}

.mobile-navigation-setting-header h3 {
    margin: 0;
    color: #444a47;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 1.22rem;
    font-weight: 400;
    line-height: 1.2;
}

.mobile-navigation-setting-header p {
    margin: 0;
    color: #8a908d;
    font-size: .8rem;
    line-height: 1.5;
}

.mobile-navigation-choice {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .65rem;
}

.mobile-navigation-option {
    position: relative;
    min-width: 0;
    min-height: 86px;
    display: grid !important;
    align-content: center;
    gap: .26rem !important;
    padding: .85rem .9rem;
    border: 1px solid #d8dcda;
    border-radius: 10px;
    background: #fff;
    color: #606663 !important;
    cursor: pointer;
    transition: border-color 140ms ease, background-color 140ms ease, box-shadow 140ms ease;
}

.mobile-navigation-option:hover {
    border-color: #bec4c0;
    background: #fafbfa;
}

.mobile-navigation-option:focus-within {
    outline: 2px solid #747a77;
    outline-offset: 2px;
}

.mobile-navigation-option.is-selected {
    border-color: #aeb5b1;
    background: #f4f5f4;
    box-shadow: inset 0 0 0 1px rgba(83, 91, 87, .06);
}

.mobile-navigation-option input[type="radio"] {
    position: absolute;
    width: 1px !important;
    height: 1px !important;
    margin: -1px !important;
    padding: 0 !important;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.mobile-navigation-option-title {
    color: #3f4542;
    font-size: .95rem;
    font-weight: 600;
    line-height: 1.25;
}

.mobile-navigation-option-copy {
    color: #8a908d;
    font-size: .76rem;
    line-height: 1.42;
}

.mobile-navigation-save {
    width: 100%;
}

@media (max-width: 760px) {
    /* The settings selector itself stays single-column on small screens. */
    .mobile-navigation-choice {
        grid-template-columns: 1fr;
    }
}

/* ---------- Booking-Manager v4.9.1 mobile text navigation redesign 07 ---------- */

/* One authoritative definition for the mobile text-navigation mode.
   All previous text-navigation experiments were removed rather than overridden.
   The result is a compact segmented navigation surface: no separators, no
   underlines, no legacy link styling, and no main-navigation icons. */
.mobile-text-more {
    display: none;
}

@media (max-width: 760px) {
    .admin-sidebar .primary-nav.mobile-text-navigation {
        box-sizing: border-box !important;
        width: fit-content !important;
        max-width: calc(100% - 1.25rem) !important;
        margin: 0 auto !important;
        padding: 4px !important;
        display: flex !important;
        flex-wrap: nowrap !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 3px !important;
        overflow: visible !important;
        border: 1px solid #e7eae8 !important;
        border-radius: 15px !important;
        background: #f4f5f4 !important;
        box-shadow: none !important;
    }

    .admin-sidebar .primary-nav.mobile-text-navigation > a:nth-child(5),
    .admin-sidebar .primary-nav.mobile-text-navigation > a:nth-child(6) {
        display: none !important;
    }

    .admin-sidebar .primary-nav.mobile-text-navigation > a:nth-child(-n+4) {
        box-sizing: border-box !important;
        position: relative !important;
        width: auto !important;
        min-width: 0 !important;
        max-width: none !important;
        height: 38px !important;
        min-height: 38px !important;
        margin: 0 !important;
        padding: 0 .72rem !important;
        display: inline-flex !important;
        flex: 0 0 auto !important;
        align-items: center !important;
        justify-content: center !important;
        border: 0 !important;
        border-radius: 10px !important;
        background: transparent !important;
        color: #747a77 !important;
        box-shadow: none !important;
        outline: 0 !important;
        text-align: center !important;
        text-decoration: none !important;
        white-space: nowrap !important;
        font-size: .82rem !important;
        font-weight: 500 !important;
        line-height: 1 !important;
        letter-spacing: 0 !important;
        transition: background-color .14s ease, color .14s ease, box-shadow .14s ease !important;
    }

    /* Completely suppress every pseudo-element inherited from historical nav layers. */
    .admin-sidebar .primary-nav.mobile-text-navigation > a:nth-child(-n+4)::before,
    .admin-sidebar .primary-nav.mobile-text-navigation > a:nth-child(-n+4)::after,
    .admin-sidebar .primary-nav.mobile-text-navigation > .mobile-text-more > summary::before,
    .admin-sidebar .primary-nav.mobile-text-navigation > .mobile-text-more > summary::after {
        content: none !important;
        display: none !important;
        position: static !important;
        width: 0 !important;
        height: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        border: 0 !important;
        background: transparent !important;
    }

    .admin-sidebar .primary-nav.mobile-text-navigation > a:nth-child(-n+4) img {
        display: none !important;
    }

    .admin-sidebar .primary-nav.mobile-text-navigation > a:nth-child(-n+4) .nav-label,
    .admin-sidebar .primary-nav.mobile-text-navigation > a:nth-child(-n+4).active .nav-label {
        position: static !important;
        width: auto !important;
        height: auto !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: visible !important;
        clip: auto !important;
        clip-path: none !important;
        border: 0 !important;
        color: inherit !important;
        font: inherit !important;
        line-height: 1 !important;
        text-decoration: none !important;
        box-shadow: none !important;
        white-space: nowrap !important;
    }

    .admin-sidebar .primary-nav.mobile-text-navigation > a:nth-child(-n+4):hover,
    .admin-sidebar .primary-nav.mobile-text-navigation > a:nth-child(-n+4):focus-visible {
        background: rgba(255, 255, 255, .68) !important;
        color: #4d5350 !important;
        box-shadow: none !important;
        outline: 0 !important;
        text-decoration: none !important;
    }

    .admin-sidebar .primary-nav.mobile-text-navigation > a:nth-child(-n+4).active {
        background: #ffffff !important;
        color: #303532 !important;
        font-weight: 600 !important;
        box-shadow: 0 1px 3px rgba(45, 52, 48, .10) !important;
        text-decoration: none !important;
    }

    .admin-sidebar .primary-nav.mobile-text-navigation > .mobile-text-more {
        display: block !important;
        position: relative !important;
        flex: 0 0 auto !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    .admin-sidebar .primary-nav.mobile-text-navigation > .mobile-text-more > summary {
        box-sizing: border-box !important;
        width: 38px !important;
        min-width: 38px !important;
        height: 38px !important;
        min-height: 38px !important;
        margin: 0 !important;
        padding: 0 !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        border: 0 !important;
        border-radius: 10px !important;
        background: transparent !important;
        box-shadow: none !important;
        outline: 0 !important;
        list-style: none !important;
        cursor: pointer !important;
        transition: background-color .14s ease, box-shadow .14s ease !important;
    }

    .admin-sidebar .primary-nav.mobile-text-navigation > .mobile-text-more > summary::-webkit-details-marker {
        display: none !important;
    }

    .admin-sidebar .primary-nav.mobile-text-navigation > .mobile-text-more > summary img {
        box-sizing: content-box !important;
        width: 17px !important;
        height: 17px !important;
        min-width: 17px !important;
        min-height: 17px !important;
        margin: 0 !important;
        padding: 0 !important;
        display: block !important;
        border: 0 !important;
        border-radius: 0 !important;
        background: transparent !important;
        opacity: .56 !important;
        transform: none !important;
    }

    .admin-sidebar .primary-nav.mobile-text-navigation > .mobile-text-more > summary:hover,
    .admin-sidebar .primary-nav.mobile-text-navigation > .mobile-text-more > summary:focus-visible {
        background: rgba(255, 255, 255, .68) !important;
        box-shadow: none !important;
        outline: 0 !important;
    }

    .admin-sidebar .primary-nav.mobile-text-navigation > .mobile-text-more[open] > summary,
    .admin-sidebar .primary-nav.mobile-text-navigation > .mobile-text-more:has(.mobile-text-more-menu a.active) > summary {
        background: #ffffff !important;
        box-shadow: 0 1px 3px rgba(45, 52, 48, .10) !important;
    }

    .admin-sidebar .primary-nav.mobile-text-navigation > .mobile-text-more[open] > summary img,
    .admin-sidebar .primary-nav.mobile-text-navigation > .mobile-text-more:has(.mobile-text-more-menu a.active) > summary img {
        opacity: .74 !important;
    }

    .admin-sidebar .primary-nav.mobile-text-navigation .mobile-text-more-menu {
        position: absolute !important;
        right: 0 !important;
        top: calc(100% + .55rem) !important;
        min-width: 184px !important;
        padding: .42rem !important;
        display: flex !important;
        flex-direction: column !important;
        gap: 2px !important;
        border: 1px solid #e5e9e6 !important;
        border-radius: 14px !important;
        background: #ffffff !important;
        box-shadow: 0 14px 34px rgba(43, 50, 46, .10) !important;
        z-index: 80 !important;
    }

    .admin-sidebar .primary-nav.mobile-text-navigation .mobile-text-more-menu a,
    .admin-sidebar .primary-nav.mobile-text-navigation .mobile-text-more-menu a:hover,
    .admin-sidebar .primary-nav.mobile-text-navigation .mobile-text-more-menu a:focus-visible,
    .admin-sidebar .primary-nav.mobile-text-navigation .mobile-text-more-menu a.active {
        box-sizing: border-box !important;
        width: 100% !important;
        min-width: 0 !important;
        height: 42px !important;
        min-height: 42px !important;
        margin: 0 !important;
        padding: 0 .9rem !important;
        display: flex !important;
        align-items: center !important;
        justify-content: flex-start !important;
        border: 0 !important;
        border-radius: 9px !important;
        background: transparent !important;
        box-shadow: none !important;
        color: #5b615e !important;
        text-align: left !important;
        text-decoration: none !important;
    }

    .admin-sidebar .primary-nav.mobile-text-navigation .mobile-text-more-menu a:hover,
    .admin-sidebar .primary-nav.mobile-text-navigation .mobile-text-more-menu a:focus-visible {
        background: #f5f6f5 !important;
        color: #404642 !important;
        outline: 0 !important;
    }

    .admin-sidebar .primary-nav.mobile-text-navigation .mobile-text-more-menu a.active {
        background: #f1f3f1 !important;
        color: #303532 !important;
        font-weight: 600 !important;
    }

    .admin-sidebar .primary-nav.mobile-text-navigation .mobile-text-more-menu a img {
        display: none !important;
    }

    .admin-sidebar .primary-nav.mobile-text-navigation .mobile-text-more-menu .nav-label {
        position: static !important;
        width: auto !important;
        height: auto !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: visible !important;
        clip: auto !important;
        clip-path: none !important;
        border: 0 !important;
        color: inherit !important;
        font-size: .88rem !important;
        font-weight: inherit !important;
        line-height: 1.2 !important;
        text-decoration: none !important;
        white-space: nowrap !important;
    }
}

@media (max-width: 430px) {
    .admin-sidebar .primary-nav.mobile-text-navigation {
        max-width: calc(100% - .65rem) !important;
        padding: 3px !important;
        gap: 2px !important;
        border-radius: 13px !important;
    }

    .admin-sidebar .primary-nav.mobile-text-navigation > a:nth-child(-n+4) {
        height: 36px !important;
        min-height: 36px !important;
        padding: 0 .52rem !important;
        border-radius: 9px !important;
        font-size: .74rem !important;
    }

    .admin-sidebar .primary-nav.mobile-text-navigation > .mobile-text-more > summary {
        width: 36px !important;
        min-width: 36px !important;
        height: 36px !important;
        min-height: 36px !important;
        border-radius: 9px !important;
    }

    .admin-sidebar .primary-nav.mobile-text-navigation > .mobile-text-more > summary img {
        width: 16px !important;
        height: 16px !important;
        min-width: 16px !important;
        min-height: 16px !important;
    }
}

@media (max-width: 370px) {
    .admin-sidebar .primary-nav.mobile-text-navigation > a:nth-child(-n+4) {
        padding-left: .4rem !important;
        padding-right: .4rem !important;
        font-size: .7rem !important;
    }
}


/* ---------- Booking-Manager v4.9.1 mobile text dropdown redesign 08 ---------- */

/* Dropdown only. The already approved segmented main navigation remains untouched. */
@media (max-width: 760px) {
    .admin-sidebar .primary-nav.mobile-text-navigation > .mobile-text-more {
        overflow: visible !important;
    }

    .admin-sidebar .primary-nav.mobile-text-navigation > .mobile-text-more .mobile-text-more-menu {
        box-sizing: border-box !important;
        position: absolute !important;
        right: -4px !important;
        top: calc(100% + 8px) !important;
        width: 196px !important;
        min-width: 196px !important;
        max-width: min(196px, calc(100vw - 28px)) !important;
        margin: 0 !important;
        padding: 4px !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 3px !important;
        overflow: hidden !important;
        border: 1px solid #e7eae8 !important;
        border-radius: 15px !important;
        background: #f4f5f4 !important;
        box-shadow: 0 10px 28px rgba(43, 50, 46, .11) !important;
        z-index: 120 !important;
    }

    .admin-sidebar .primary-nav.mobile-text-navigation > .mobile-text-more .mobile-text-more-menu::before,
    .admin-sidebar .primary-nav.mobile-text-navigation > .mobile-text-more .mobile-text-more-menu::after,
    .admin-sidebar .primary-nav.mobile-text-navigation > .mobile-text-more .mobile-text-more-menu a::before,
    .admin-sidebar .primary-nav.mobile-text-navigation > .mobile-text-more .mobile-text-more-menu a::after,
    .admin-sidebar .primary-nav.mobile-text-navigation > .mobile-text-more .mobile-text-more-menu .nav-label::before,
    .admin-sidebar .primary-nav.mobile-text-navigation > .mobile-text-more .mobile-text-more-menu .nav-label::after {
        content: none !important;
        display: none !important;
        width: 0 !important;
        height: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        border: 0 !important;
        background: transparent !important;
    }

    .admin-sidebar .primary-nav.mobile-text-navigation > .mobile-text-more .mobile-text-more-menu a,
    .admin-sidebar .primary-nav.mobile-text-navigation > .mobile-text-more .mobile-text-more-menu a:link,
    .admin-sidebar .primary-nav.mobile-text-navigation > .mobile-text-more .mobile-text-more-menu a:visited {
        box-sizing: border-box !important;
        position: relative !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;
        height: 40px !important;
        min-height: 40px !important;
        margin: 0 !important;
        padding: 0 .82rem !important;
        display: flex !important;
        align-items: center !important;
        justify-content: flex-start !important;
        gap: 0 !important;
        border: 0 !important;
        border-radius: 10px !important;
        background: transparent !important;
        color: #747a77 !important;
        box-shadow: none !important;
        outline: 0 !important;
        text-align: left !important;
        text-decoration: none !important;
        white-space: nowrap !important;
        font-size: .82rem !important;
        font-weight: 500 !important;
        line-height: 1 !important;
        letter-spacing: 0 !important;
        transform: none !important;
        transition: background-color .14s ease, color .14s ease, box-shadow .14s ease !important;
    }

    .admin-sidebar .primary-nav.mobile-text-navigation > .mobile-text-more .mobile-text-more-menu a:hover,
    .admin-sidebar .primary-nav.mobile-text-navigation > .mobile-text-more .mobile-text-more-menu a:focus-visible {
        background: rgba(255, 255, 255, .72) !important;
        color: #4d5350 !important;
        box-shadow: none !important;
        outline: 0 !important;
        text-decoration: none !important;
    }

    .admin-sidebar .primary-nav.mobile-text-navigation > .mobile-text-more .mobile-text-more-menu a.active {
        background: #ffffff !important;
        color: #303532 !important;
        font-weight: 600 !important;
        box-shadow: 0 1px 3px rgba(45, 52, 48, .10) !important;
        text-decoration: none !important;
    }

    .admin-sidebar .primary-nav.mobile-text-navigation > .mobile-text-more .mobile-text-more-menu a img {
        display: none !important;
    }

    .admin-sidebar .primary-nav.mobile-text-navigation > .mobile-text-more .mobile-text-more-menu a .nav-label,
    .admin-sidebar .primary-nav.mobile-text-navigation > .mobile-text-more .mobile-text-more-menu a.active .nav-label {
        position: static !important;
        inset: auto !important;
        width: auto !important;
        height: auto !important;
        min-width: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        display: block !important;
        overflow: visible !important;
        clip: auto !important;
        clip-path: none !important;
        border: 0 !important;
        border-radius: 0 !important;
        background: transparent !important;
        color: inherit !important;
        box-shadow: none !important;
        font: inherit !important;
        line-height: 1 !important;
        text-decoration: none !important;
        white-space: nowrap !important;
        transform: none !important;
    }
}


/* ---------- Booking-Manager v4.9.1 dropdown sizing + terms alignment 09 ---------- */

@media (max-width: 760px) {
    /* Dropdown entries use exactly the same control height and typography as
       the approved main mobile text navigation. */
    .admin-sidebar .primary-nav.mobile-text-navigation > .mobile-text-more .mobile-text-more-menu a,
    .admin-sidebar .primary-nav.mobile-text-navigation > .mobile-text-more .mobile-text-more-menu a:link,
    .admin-sidebar .primary-nav.mobile-text-navigation > .mobile-text-more .mobile-text-more-menu a:visited,
    .admin-sidebar .primary-nav.mobile-text-navigation > .mobile-text-more .mobile-text-more-menu a:hover,
    .admin-sidebar .primary-nav.mobile-text-navigation > .mobile-text-more .mobile-text-more-menu a:focus-visible,
    .admin-sidebar .primary-nav.mobile-text-navigation > .mobile-text-more .mobile-text-more-menu a.active {
        height: 38px !important;
        min-height: 38px !important;
        padding-left: .72rem !important;
        padding-right: .72rem !important;
        font-size: .82rem !important;
        line-height: 1 !important;
    }

    .admin-sidebar .primary-nav.mobile-text-navigation > .mobile-text-more .mobile-text-more-menu a .nav-label,
    .admin-sidebar .primary-nav.mobile-text-navigation > .mobile-text-more .mobile-text-more-menu a.active .nav-label {
        font-size: .82rem !important;
        line-height: 1 !important;
    }

    /* Mobile Buchungsinfos cards: align label/value pairs on one horizontal axis. */
    .admin-content .admin-table td[data-label="Version"],
    .admin-content .admin-table td[data-label="Gültig ab"] {
        align-items: center !important;
    }

    .admin-content .admin-table td[data-label="Version"]::before,
    .admin-content .admin-table td[data-label="Gültig ab"]::before {
        align-self: center !important;
        line-height: 1.2 !important;
    }
}

/* ---------- Booking-Manager v4.9.1 desktop navigation + overview actions 10 ---------- */

/* Desktop navigation only: slightly smaller glyphs/text and a viewport-locked
   sidebar so Settings/Logout stay available while the page content scrolls. */
@media (min-width: 761px) {
    .admin-sidebar {
        position: sticky !important;
        top: 0 !important;
        align-self: start !important;
        box-sizing: border-box !important;
        height: 100vh !important;
        min-height: 100vh !important;
        max-height: 100vh !important;
        overflow: hidden !important;
    }

    .admin-sidebar .admin-brand {
        flex: 0 0 auto !important;
    }

    .admin-sidebar .primary-nav {
        min-height: 0 !important;
        overflow-y: auto !important;
        overscroll-behavior: contain;
        scrollbar-width: none;
    }

    .admin-sidebar .primary-nav::-webkit-scrollbar {
        display: none;
    }

    .admin-sidebar .sidebar-bottom {
        flex: 0 0 auto !important;
        margin-top: auto !important;
        padding-top: .65rem !important;
        background: #fff !important;
        position: relative !important;
        z-index: 2 !important;
    }

    .admin-sidebar .primary-nav a,
    .admin-sidebar .settings-link,
    .admin-sidebar form button {
        gap: .62rem !important;
        font-size: .94rem !important;
    }

    .admin-sidebar .primary-nav a img,
    .admin-sidebar .settings-link img,
    .admin-sidebar form button img {
        width: 15px !important;
        height: 15px !important;
        min-width: 15px !important;
        max-width: 15px !important;
        flex: 0 0 15px !important;
        transform: none !important;
    }

    /* Overview pages: actions become icon-only controls on desktop.
       Mobile keeps the existing labels and layouts unchanged. */
    .admin-table .desktop-icon-actions {
        display: flex !important;
        align-items: center !important;
        flex-wrap: nowrap !important;
        gap: .4rem !important;
        overflow: visible !important;
    }

    .admin-table td:has(.desktop-icon-actions),
    .admin-table .desktop-icon-actions {
        overflow: visible !important;
    }

    .admin-table .desktop-icon-actions .desktop-icon-action {
        box-sizing: border-box !important;
        position: relative !important;
        width: 38px !important;
        min-width: 38px !important;
        max-width: 38px !important;
        height: 38px !important;
        min-height: 38px !important;
        max-height: 38px !important;
        margin: 0 !important;
        padding: 0 !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 0 !important;
        border: 1px solid #d6dad7 !important;
        border-radius: 9px !important;
        background: #fff !important;
        color: #58605c !important;
        box-shadow: none !important;
        text-decoration: none !important;
        overflow: visible !important;
    }

    .admin-table .desktop-icon-actions .desktop-icon-action:hover,
    .admin-table .desktop-icon-actions .desktop-icon-action:focus-visible {
        border-color: #c4cac6 !important;
        background: #f4f5f4 !important;
        color: #353b38 !important;
        outline: 0 !important;
        box-shadow: none !important;
    }

    .admin-table .desktop-icon-actions .desktop-icon-action.danger {
        border-color: #e3c4c4 !important;
        color: #a65c5c !important;
    }

    .admin-table .desktop-icon-actions .desktop-icon-action.danger:hover,
    .admin-table .desktop-icon-actions .desktop-icon-action.danger:focus-visible {
        border-color: #d9aeae !important;
        background: #fff8f8 !important;
        color: #984f4f !important;
    }

    .admin-table .desktop-icon-actions .desktop-icon-action .ui-icon {
        width: 15px !important;
        height: 15px !important;
        min-width: 15px !important;
        max-width: 15px !important;
        flex: 0 0 15px !important;
        margin: 0 !important;
        opacity: .72 !important;
    }

    .admin-table .desktop-icon-actions .desktop-icon-action > .desktop-action-label,
    .admin-table .desktop-icon-actions .desktop-icon-action > span:not(.ui-icon) {
        display: none !important;
    }

    /* Custom instant tooltip; no native title attribute is used. */
    .admin-table .desktop-icon-actions .desktop-icon-action[data-ui-tooltip]::after {
        content: attr(data-ui-tooltip) !important;
        position: absolute !important;
        left: 50% !important;
        top: calc(100% + 8px) !important;
        z-index: 500 !important;
        width: max-content !important;
        max-width: 190px !important;
        padding: .42rem .58rem !important;
        border: 1px solid #dfe3e0 !important;
        border-radius: 8px !important;
        background: rgba(255, 255, 255, .98) !important;
        color: #4a504d !important;
        box-shadow: 0 8px 22px rgba(44, 51, 47, .12) !important;
        font-size: .74rem !important;
        font-weight: 500 !important;
        line-height: 1.2 !important;
        letter-spacing: 0 !important;
        white-space: nowrap !important;
        pointer-events: none !important;
        opacity: 0 !important;
        visibility: hidden !important;
        transform: translate(-50%, -2px) !important;
        transition: opacity .06s ease, transform .06s ease !important;
    }

    .admin-table .desktop-icon-actions .desktop-icon-action[data-ui-tooltip]::before {
        content: "" !important;
        position: absolute !important;
        left: 50% !important;
        top: calc(100% + 4px) !important;
        z-index: 501 !important;
        width: 8px !important;
        height: 8px !important;
        border: 1px solid #dfe3e0 !important;
        border-right: 0 !important;
        border-bottom: 0 !important;
        background: #fff !important;
        pointer-events: none !important;
        opacity: 0 !important;
        visibility: hidden !important;
        transform: translateX(-50%) rotate(45deg) !important;
        transition: opacity .06s ease !important;
    }

    .admin-table .desktop-icon-actions .desktop-icon-action[data-ui-tooltip]:hover::after,
    .admin-table .desktop-icon-actions .desktop-icon-action[data-ui-tooltip]:focus-visible::after,
    .admin-table .desktop-icon-actions .desktop-icon-action[data-ui-tooltip]:hover::before,
    .admin-table .desktop-icon-actions .desktop-icon-action[data-ui-tooltip]:focus-visible::before {
        opacity: 1 !important;
        visibility: visible !important;
    }

    .admin-table .desktop-icon-actions .desktop-icon-action[data-ui-tooltip]:hover::after,
    .admin-table .desktop-icon-actions .desktop-icon-action[data-ui-tooltip]:focus-visible::after {
        transform: translate(-50%, 0) !important;
    }

    /* Booking detail: customer detail is the fill master; keep every neutral
       outline button at one border/color weight and soften all neutral glyphs. */
    .admin-content .booking-detail-actions .booking-detail-save {
        background: #444946 !important;
        color: #fff !important;
        border-color: #444946 !important;
        box-shadow: none !important;
    }

    .admin-content .booking-detail-actions .booking-detail-save:hover,
    .admin-content .booking-detail-actions .booking-detail-save:focus-visible {
        background: #3c413e !important;
        border-color: #3c413e !important;
        color: #fff !important;
    }

    .admin-content .booking-detail-actions > .admin-secondary,
    .admin-content .booking-detail-actions > .action-button {
        border: 1px solid #bfc5c1 !important;
        background: #fff !important;
        color: #3e4241 !important;
        box-shadow: none !important;
    }

    .admin-content .booking-detail-actions > .admin-secondary:hover,
    .admin-content .booking-detail-actions > .action-button:hover {
        border-color: #adb4b0 !important;
        background: #f7f8f7 !important;
    }

    .admin-content .booking-detail-actions > .admin-secondary .ui-icon,
    .admin-content .booking-detail-actions > .admin-secondary .detail-action-icon,
    .admin-content .booking-detail-actions > .action-button .ui-icon {
        width: 17px !important;
        height: 17px !important;
        min-width: 17px !important;
        max-width: 17px !important;
        flex: 0 0 17px !important;
        opacity: .64 !important;
    }

    .admin-content .booking-detail-actions .booking-detail-save .detail-action-icon {
        width: 17px !important;
        height: 17px !important;
        min-width: 17px !important;
        max-width: 17px !important;
        flex: 0 0 17px !important;
        opacity: .94 !important;
        filter: brightness(0) invert(1) !important;
    }
}

/* Shared save icon. Button colors stay with the existing page-specific master
   styles; only the glyph is standardized to the booking-detail save icon. */
.admin-content .detail-save-standard .detail-action-icon {
    width: 17px !important;
    height: 17px !important;
    min-width: 17px !important;
    max-width: 17px !important;
    flex: 0 0 17px !important;
    margin: 0 !important;
    display: block !important;
}

.admin-content .admin-primary.detail-save-standard .detail-action-icon {
    opacity: .94 !important;
    filter: brightness(0) invert(1) !important;
}

/* ---------- Booking-Manager v4.9.1 desktop neutral buttons + booking action width 11 ---------- */

@media (min-width: 761px) {
    /* All previously white admin action buttons get one subtle neutral surface.
       Dark primary/save buttons remain untouched. */
    .admin-content .admin-secondary:not(.booking-detail-save),
    .admin-content .action-link,
    .admin-content .admin-danger {
        background: #f6f7f6 !important;
    }

    .admin-content .admin-secondary:not(.booking-detail-save):hover,
    .admin-content .admin-secondary:not(.booking-detail-save):focus-visible,
    .admin-content .action-link:hover,
    .admin-content .action-link:focus-visible,
    .admin-content .admin-danger:hover,
    .admin-content .admin-danger:focus-visible {
        background: #eff1ef !important;
    }

    /* Customers are the desktop master: booking overview actions use the exact
       same compact 38x38 icon geometry rather than the historical 140px grid. */
    .admin-content .admin-table .booking-list-actions.desktop-icon-actions {
        display: inline-flex !important;
        grid-template-columns: none !important;
        width: auto !important;
        min-width: 0 !important;
        max-width: none !important;
        align-items: center !important;
        justify-content: flex-start !important;
        flex-wrap: nowrap !important;
        gap: .4rem !important;
    }

    .admin-content .admin-table .booking-list-actions.desktop-icon-actions > .booking-list-action.desktop-icon-action {
        box-sizing: border-box !important;
        width: 38px !important;
        min-width: 38px !important;
        max-width: 38px !important;
        height: 38px !important;
        min-height: 38px !important;
        max-height: 38px !important;
        margin: 0 !important;
        padding: 0 !important;
        display: inline-flex !important;
        flex: 0 0 38px !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 0 !important;
        grid-column: auto !important;
    }

    .admin-content .admin-table .booking-list-actions.desktop-icon-actions.has-complete-action > :nth-child(3):last-child {
        grid-column: auto !important;
    }
}

/* Keep mobile text-navigation typography genuinely identical between the
   main bar and its dropdown at the extra-narrow breakpoint too. */
@media (max-width: 370px) {
    .admin-sidebar .primary-nav.mobile-text-navigation > .mobile-text-more .mobile-text-more-menu a,
    .admin-sidebar .primary-nav.mobile-text-navigation > .mobile-text-more .mobile-text-more-menu a:link,
    .admin-sidebar .primary-nav.mobile-text-navigation > .mobile-text-more .mobile-text-more-menu a:visited,
    .admin-sidebar .primary-nav.mobile-text-navigation > .mobile-text-more .mobile-text-more-menu a:hover,
    .admin-sidebar .primary-nav.mobile-text-navigation > .mobile-text-more .mobile-text-more-menu a:focus-visible,
    .admin-sidebar .primary-nav.mobile-text-navigation > .mobile-text-more .mobile-text-more-menu a.active,
    .admin-sidebar .primary-nav.mobile-text-navigation > .mobile-text-more .mobile-text-more-menu a .nav-label,
    .admin-sidebar .primary-nav.mobile-text-navigation > .mobile-text-more .mobile-text-more-menu a.active .nav-label {
        font-size: .7rem !important;
    }
}

/* ---------- Booking-Manager v4.9.1 visible neutral buttons + mobile nav typography 12 ---------- */

/* Make neutral/previously-white admin buttons visibly, but still subtly, gray.
   Dark primary/save buttons remain untouched. */
@media (min-width: 761px) {
    .admin-content .admin-secondary:not(.booking-detail-save),
    .admin-content .action-link,
    .admin-content .desktop-icon-action,
    .admin-content .admin-danger {
        background: #f0f1f0 !important;
    }

    .admin-content .admin-secondary:not(.booking-detail-save):hover,
    .admin-content .admin-secondary:not(.booking-detail-save):focus-visible,
    .admin-content .action-link:hover,
    .admin-content .action-link:focus-visible,
    .admin-content .desktop-icon-action:hover,
    .admin-content .desktop-icon-action:focus-visible,
    .admin-content .admin-danger:hover,
    .admin-content .admin-danger:focus-visible {
        background: #e8ebe9 !important;
    }
}

/* One shared typography source for the mobile segmented navigation and its dropdown.
   This closes the <=430px mismatch where the main row was .74rem while the dropdown
   remained .82rem. */
@media (max-width: 760px) {
    .admin-sidebar .primary-nav.mobile-text-navigation {
        --bm-mobile-nav-font-size: .82rem;
        font-family: inherit !important;
    }

    .admin-sidebar .primary-nav.mobile-text-navigation > a:nth-child(-n+4),
    .admin-sidebar .primary-nav.mobile-text-navigation > a:nth-child(-n+4) .nav-label,
    .admin-sidebar .primary-nav.mobile-text-navigation > .mobile-text-more .mobile-text-more-menu a,
    .admin-sidebar .primary-nav.mobile-text-navigation > .mobile-text-more .mobile-text-more-menu a:link,
    .admin-sidebar .primary-nav.mobile-text-navigation > .mobile-text-more .mobile-text-more-menu a:visited,
    .admin-sidebar .primary-nav.mobile-text-navigation > .mobile-text-more .mobile-text-more-menu a:hover,
    .admin-sidebar .primary-nav.mobile-text-navigation > .mobile-text-more .mobile-text-more-menu a:focus-visible,
    .admin-sidebar .primary-nav.mobile-text-navigation > .mobile-text-more .mobile-text-more-menu a.active,
    .admin-sidebar .primary-nav.mobile-text-navigation > .mobile-text-more .mobile-text-more-menu a .nav-label,
    .admin-sidebar .primary-nav.mobile-text-navigation > .mobile-text-more .mobile-text-more-menu a.active .nav-label {
        font-family: inherit !important;
        font-size: var(--bm-mobile-nav-font-size) !important;
        line-height: 1 !important;
        letter-spacing: 0 !important;
    }

    .admin-sidebar .primary-nav.mobile-text-navigation > a:nth-child(-n+4),
    .admin-sidebar .primary-nav.mobile-text-navigation > .mobile-text-more .mobile-text-more-menu a {
        font-weight: 500 !important;
    }

    .admin-sidebar .primary-nav.mobile-text-navigation > a:nth-child(-n+4).active,
    .admin-sidebar .primary-nav.mobile-text-navigation > .mobile-text-more .mobile-text-more-menu a.active {
        font-weight: 600 !important;
    }
}

@media (max-width: 430px) {
    .admin-sidebar .primary-nav.mobile-text-navigation {
        --bm-mobile-nav-font-size: .74rem;
    }
}

@media (max-width: 370px) {
    .admin-sidebar .primary-nav.mobile-text-navigation {
        --bm-mobile-nav-font-size: .7rem;
    }
}

/* ---------- Booking-Manager v4.9.1 uniform neutral actions + responsive Customers KPI 13 ---------- */

@media (min-width: 761px) {
    /*
       One neutral desktop button surface.
       Important: these selectors intentionally match the higher-specificity
       historic rules so overview icon controls and detail actions really use
       the same light gray instead of falling back to white.
    */
    .admin-content .admin-secondary,
    .admin-content .action-button,
    .admin-content .action-link,
    .admin-content .admin-danger,
    .admin-content .agenda-actions .action-link,
    .admin-content .admin-table .desktop-icon-actions .desktop-icon-action,
    .admin-content .booking-detail-actions > a.admin-secondary,
    .admin-content .booking-detail-actions > button.admin-secondary,
    .admin-content .booking-detail-actions > button.action-button,
    .admin-content .booking-detail-actions > button.admin-danger {
        background: #f7f8f7 !important;
    }

    .admin-content .admin-secondary:hover,
    .admin-content .admin-secondary:focus-visible,
    .admin-content .action-button:hover,
    .admin-content .action-button:focus-visible,
    .admin-content .action-link:hover,
    .admin-content .action-link:focus-visible,
    .admin-content .admin-danger:hover,
    .admin-content .admin-danger:focus-visible,
    .admin-content .agenda-actions .action-link:hover,
    .admin-content .agenda-actions .action-link:focus-visible,
    .admin-content .admin-table .desktop-icon-actions .desktop-icon-action:hover,
    .admin-content .admin-table .desktop-icon-actions .desktop-icon-action:focus-visible,
    .admin-content .booking-detail-actions > a.admin-secondary:hover,
    .admin-content .booking-detail-actions > a.admin-secondary:focus-visible,
    .admin-content .booking-detail-actions > button.admin-secondary:hover,
    .admin-content .booking-detail-actions > button.admin-secondary:focus-visible,
    .admin-content .booking-detail-actions > button.action-button:hover,
    .admin-content .booking-detail-actions > button.action-button:focus-visible,
    .admin-content .booking-detail-actions > button.admin-danger:hover,
    .admin-content .booking-detail-actions > button.admin-danger:focus-visible {
        background: #f0f2f0 !important;
    }

    /*
       Booking-detail save follows the Customer-detail master:
       dark filled primary appearance + the already-approved save glyph.
    */
    .admin-content .booking-detail-actions .booking-detail-save {
        background: var(--bm-accent) !important;
        border-color: var(--bm-accent) !important;
        color: #ffffff !important;
        box-shadow: none !important;
    }

    .admin-content .booking-detail-actions .booking-detail-save:hover,
    .admin-content .booking-detail-actions .booking-detail-save:focus-visible {
        background: #3d423f !important;
        border-color: #3d423f !important;
        color: #ffffff !important;
    }

    .admin-content .booking-detail-actions .booking-detail-save .detail-action-icon {
        opacity: .94 !important;
        filter: brightness(0) invert(1) !important;
    }
}

/* Desktop: Customers KPI is restored as the third/right-hand tile.
   Mobile: hide the complete Customers tile, exactly as requested. */
@media (max-width: 760px) {
    .admin-content .dashboard-kpi-grid > .metric-card-customers {
        display: none !important;
    }
}

/* ---------- Booking-Manager v4.9.1 mobile neutral actions + white agenda rows 14 ---------- */

/* Mobile now uses the same subtle neutral button surface as desktop.
   Dark primary/save buttons intentionally remain untouched. */
@media (max-width: 760px) {
    .admin-content .admin-secondary,
    .admin-content .action-button,
    .admin-content .action-link,
    .admin-content .admin-danger,
    .admin-content .booking-list-action,
    .admin-content .customer-mobile-actions a,
    .admin-content .customer-mobile-actions button,
    .admin-content .booking-detail-actions > a.admin-secondary,
    .admin-content .booking-detail-actions > button.admin-secondary,
    .admin-content .booking-detail-actions > button.action-button,
    .admin-content .booking-detail-actions > button.admin-danger {
        background: #f7f8f7 !important;
    }

    .admin-content .admin-secondary:hover,
    .admin-content .admin-secondary:focus-visible,
    .admin-content .action-button:hover,
    .admin-content .action-button:focus-visible,
    .admin-content .action-link:hover,
    .admin-content .action-link:focus-visible,
    .admin-content .admin-danger:hover,
    .admin-content .admin-danger:focus-visible,
    .admin-content .booking-list-action:hover,
    .admin-content .booking-list-action:focus-visible,
    .admin-content .customer-mobile-actions a:hover,
    .admin-content .customer-mobile-actions a:focus-visible,
    .admin-content .customer-mobile-actions button:hover,
    .admin-content .customer-mobile-actions button:focus-visible {
        background: #f0f2f0 !important;
    }
}

/* "Nächste Termine": inquiry rows should no longer be shaded.
   Keep every agenda row on the same white card surface. */
.admin-content .agenda-row.inquiry {
    background: #ffffff !important;
}

/* ---------- Booking-Manager v4.9.1 mobile booking button surface correction 15 ---------- */

/* The booking overview cards on mobile still used an earlier, more specific white background.
   Override that exact selector so the neutral actions match the approved light-gray button surface. */
@media (max-width: 760px) {
    .admin-content .admin-table .booking-list-actions > .booking-list-action,
    .admin-content .admin-table .booking-list-actions .copy-link-button > button,
    .admin-content .admin-table .booking-list-actions > a.booking-list-action,
    .admin-content .admin-table .booking-list-actions > button.booking-list-action {
        background: #f7f8f7 !important;
    }

    .admin-content .admin-table .booking-list-actions > .booking-list-action:hover,
    .admin-content .admin-table .booking-list-actions > .booking-list-action:focus-visible,
    .admin-content .admin-table .booking-list-actions .copy-link-button > button:hover,
    .admin-content .admin-table .booking-list-actions .copy-link-button > button:focus-visible,
    .admin-content .admin-table .booking-list-actions > a.booking-list-action:hover,
    .admin-content .admin-table .booking-list-actions > a.booking-list-action:focus-visible,
    .admin-content .admin-table .booking-list-actions > button.booking-list-action:hover,
    .admin-content .admin-table .booking-list-actions > button.booking-list-action:focus-visible {
        background: #f0f2f0 !important;
    }
}