/* ==========================================================================
   ESC My Bookings – Kundenbuchungsübersicht
   Phase 30: CSS-Variablen, Touch-Targets, vereinheitlichte Badges
   ========================================================================== */

:root {
    --esc-orange:        #e67e22;
    --esc-orange-dark:   #d35400;
    --esc-green-bg:      #edfaee;
    --esc-green-text:    #2a6a2e;
    --esc-green-border:  #b2dfb4;
    --esc-red-bg:        #fce8e6;
    --esc-red-text:      #c0392b;
    --esc-red-border:    #f5c6c2;
    --esc-amber-bg:      #fef9c3;
    --esc-amber-text:    #856404;
    --esc-amber-border:  #f0d080;
    --esc-grey-bg:       #f6f7f7;
    --esc-grey-text:     #646970;
    --esc-grey-border:   #dcdcde;
    --esc-dark:          #23282d;
    --esc-radius:        4px;
    --esc-ctrl-h:        44px;
}

/* Container */
.esc-my-bookings {
    font-family: inherit;
    color: inherit;
    margin: 1.5rem 0;
}

.esc-my-bookings__title {
    margin-bottom: 1.25rem;
}

/* ── Sidebar-Layout ─────────────────────────────────────────────────────── */

.esc-my-bookings--layout {
    display: grid;
    grid-template-columns: 220px 1fr;
    gap: 1.5rem;
    align-items: start;
}

.esc-my-bookings__main {
    min-width: 0;
}

@media ( max-width: 680px ) {
    .esc-my-bookings--layout {
        grid-template-columns: 1fr;
    }
}

/* Hinweise (Login, Fehler, Leer) */
.esc-my-bookings--notice {
    padding: 1.25rem;
    background: #f8f8f8;
    border-left: 4px solid #ccc;
    border-radius: 3px;
}

.esc-my-bookings__empty {
    color: #666;
    font-style: italic;
}

/* Read-only Hinweis über der Tabelle */
.esc-my-bookings__readonly-hint {
    margin: 0 0 1.1rem;
    font-size: 0.875rem;
    color: #666;
}

/* Button */
.esc-my-bookings__btn {
    display: inline-block;
    margin-top: 0.75rem;
    padding: 0.5rem 1.25rem;
    background: #333;
    color: #fff;
    text-decoration: none;
    border-radius: 3px;
    font-size: 0.9rem;
}

.esc-my-bookings__btn:hover,
.esc-my-bookings__btn:focus {
    background: #555;
    color: #fff;
}

/* ── Buchungsliste ──────────────────────────────────────────────────────── */

.esc-my-bookings__table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.95rem;
}

.esc-my-bookings__table th,
.esc-my-bookings__table td {
    padding: 0.6rem 0.75rem;
    text-align: left;
    border-bottom: 1px solid #e0e0e0;
    vertical-align: middle;
}

.esc-my-bookings__table thead th {
    background: #f4f4f4;
    font-weight: 600;
    white-space: nowrap;
}

.esc-my-bookings__table tbody tr:last-child td {
    border-bottom: none;
}

/* ── Tab-Navigation ─────────────────────────────────────────────────────── */

.esc-my-bookings__nav {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    margin-bottom: 1.5rem;
}

.esc-my-bookings__nav-btn {
    display: inline-flex;
    align-items: center;
    min-height: var(--esc-ctrl-h);
    padding: 0 1rem;
    background: transparent;
    color: #444;
    border: 1px solid #bbb;
    border-radius: 3px;
    font-size: 0.9rem;
    text-decoration: none;
}

.esc-my-bookings__nav-btn:hover,
.esc-my-bookings__nav-btn:focus {
    background: #f5f5f5;
    border-color: #777;
    color: #222;
    text-decoration: none !important;
}

.esc-my-bookings__nav-btn--active {
    font-weight: 600;
    border-color: #333;
    color: #111;
}

.esc-my-bookings__nav-btn--active:hover,
.esc-my-bookings__nav-btn--active:focus {
    background: #f0f0f0;
    border-color: #333;
    color: #111;
}

/* ── Einheitliche Aktions-Button-Gruppe ─────────────────────────────────── */

.esc-my-bookings__action-group {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    align-items: center;
}

.esc-my-bookings__action-btn {
    display: inline-flex;
    align-items: center;
    min-height: var(--esc-ctrl-h);
    padding: 0 0.875rem;
    background: transparent;
    color: #333;
    border: 1px solid #bbb;
    border-radius: 3px;
    font-size: 0.8rem;
    font-family: inherit;
    cursor: pointer;
    text-decoration: none;
    white-space: nowrap;
    transition: background 0.15s, color 0.15s, border-color 0.15s;
}

.esc-my-bookings__action-btn:hover,
.esc-my-bookings__action-btn:focus {
    background: #f5f5f5;
    border-color: #777;
    color: #222;
    text-decoration: none !important;
}

.esc-my-bookings__action-btn:disabled,
.esc-my-bookings__action-btn[disabled] {
    opacity: 0.55;
    cursor: not-allowed;
}

.esc-my-bookings__action-btn--download {
    color: #333;
    border-color: #bbb;
}

.esc-my-bookings__action-btn--request {
    color: #333;
    border-color: #bbb;
}

.esc-my-bookings__action-btn--requested {
    color: #2e6b21;
    border-color: #4caf50;
    background: #f0f7ee;
    cursor: default;
    opacity: 1;
}

.esc-my-bookings__action-btn--requested:hover,
.esc-my-bookings__action-btn--requested:focus {
    background: #f0f7ee;
    color: #2e6b21;
    border-color: #4caf50;
}

.esc-my-bookings__action-btn--requested:disabled,
.esc-my-bookings__action-btn--requested[disabled] {
    opacity: 1;
    cursor: default;
}

.esc-my-bookings__action-btn--cancel {
    background: transparent;
    color: #c0392b;
    border-color: #c0392b;
}

.esc-my-bookings__action-btn--cancel:hover,
.esc-my-bookings__action-btn--cancel:focus {
    background: #c0392b;
    color: #fff;
    border-color: #c0392b;
}

/* Rechnungen-Ansicht: Status-Badges */
.esc-my-bookings__invoice-status {
    display: inline-block;
    padding: 0.2rem 0.55rem;
    border-radius: 3px;
    font-size: 0.8rem;
    font-weight: 600;
    white-space: nowrap;
    border: 1px solid transparent;
}

.esc-my-bookings__invoice-status--final {
    background: var(--esc-green-bg);
    color: var(--esc-green-text);
    border-color: var(--esc-green-border);
}

.esc-my-bookings__invoice-status--pending {
    background: var(--esc-amber-bg);
    color: var(--esc-amber-text);
    border-color: var(--esc-amber-border);
}

.esc-my-bookings__invoice-pending-label {
    font-size: 0.875rem;
    color: #888;
    font-style: italic;
}

/* ── Status-Badge ───────────────────────────────────────────────────────── */

.esc-my-bookings__status {
    display: inline-block;
    padding: 0.2rem 0.6rem;
    border-radius: 3px;
    font-size: 0.8rem;
    font-weight: 600;
    white-space: nowrap;
    border: 1px solid transparent;
}

.esc-my-bookings__status--reserved {
    background: var(--esc-grey-bg);
    color: var(--esc-dark);
    border-color: var(--esc-grey-border);
}

.esc-my-bookings__status--completed {
    background: var(--esc-green-bg);
    color: var(--esc-green-text);
    border-color: var(--esc-green-border);
}

.esc-my-bookings__status--cancelled {
    background: var(--esc-grey-bg);
    color: var(--esc-grey-text);
    border-color: var(--esc-grey-border);
    text-decoration: line-through;
}

/* Fallback: alle anderen Status */
.esc-my-bookings__status:not([class*="--reserved"]):not([class*="--completed"]):not([class*="--cancelled"]) {
    background: var(--esc-amber-bg);
    color: var(--esc-amber-text);
    border-color: var(--esc-amber-border);
}

/* Status-Erklärung in der Detailansicht (nach dem Badge) */
.esc-my-bookings__status-desc {
    display: block;
    margin-top: 0.35rem;
    font-size: 0.875rem;
    color: #555;
    font-weight: normal;
}

/* ── Hinweis-Meldungen (Erfolg / Fehler) ────────────────────────────────── */

.esc-my-bookings__notice {
    padding: 0.75rem 1rem;
    margin-bottom: 1.25rem;
    border-radius: 3px;
    font-size: 0.95rem;
}

.esc-my-bookings__notice--success {
    background: #e6f4ea;
    color: #1e7e34;
    border-left: 4px solid #1e7e34;
}

.esc-my-bookings__notice--error {
    background: #fce8e6;
    color: #c0392b;
    border-left: 4px solid #c0392b;
}

.esc-my-bookings__notice--info {
    background: #f4f4f4;
    color: #444;
    border-left: 4px solid #aaa;
}

/* ── Detailansicht ──────────────────────────────────────────────────────── */

.esc-my-bookings__back {
    display: inline-block;
    margin-bottom: 1.25rem;
    font-size: 0.9rem;
    text-decoration: none;
    color: #444;
}

.esc-my-bookings__back:hover,
.esc-my-bookings__back:focus {
    text-decoration: underline;
    color: #111;
}

.esc-my-bookings__section {
    margin-bottom: 1.75rem;
}

.esc-my-bookings__section h3 {
    margin-bottom: 0.75rem;
    font-size: 1rem;
    font-weight: 600;
    border-bottom: 1px solid #e0e0e0;
    padding-bottom: 0.4rem;
}

/* Karten-Abschnitte (Buchungsdetails, Zahlungsdetails, Kontaktdaten) */
.esc-my-bookings__section--card {
    padding: 1rem 1.25rem;
    background: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 5px;
}

.esc-my-bookings__section--card h3 {
    margin-top: 0;
    border-bottom-color: #e8e8e8;
}

/* Definition list */
.esc-my-bookings__dl {
    display: grid;
    grid-template-columns: 9rem 1fr;
    gap: 0.35rem 1rem;
    margin: 0;
}

.esc-my-bookings__dl dt {
    font-weight: 600;
    color: #555;
}

.esc-my-bookings__dl dd {
    margin: 0;
}

/* Raumliste */
.esc-my-bookings__rooms {
    list-style: none;
    margin: 0;
    padding: 0;
}

.esc-my-bookings__rooms li {
    padding: 0.4rem 0;
    border-bottom: 1px solid #f0f0f0;
}

.esc-my-bookings__rooms li:last-child {
    border-bottom: none;
}

/* ── Storno-Button ──────────────────────────────────────────────────────── */

.esc-my-bookings__actions {
    vertical-align: middle;
}

.esc-my-bookings__cancel-form {
    display: inline-flex;
    margin: 0;
    padding: 0;
}

.esc-my-bookings__cancel-btn {
    display: inline-block;
    margin-left: 0.5rem;
    padding: 0.3rem 0.75rem;
    background: transparent;
    color: #c0392b;
    border: 1px solid #c0392b;
    border-radius: 3px;
    font-size: 0.8rem;
    cursor: pointer;
    white-space: nowrap;
    line-height: 1.4;
}

.esc-my-bookings__cancel-btn:hover,
.esc-my-bookings__cancel-btn:focus {
    background: #c0392b;
    color: #fff;
}

/* ── Deposit-Status-Badge (Phase 4) ────────────────────────────────────── */

.esc-my-bookings__deposit-status {
    display: inline-block;
    padding: 0.2rem 0.6rem;
    border-radius: 3px;
    font-size: 0.8rem;
    font-weight: 600;
    white-space: nowrap;
    border: 1px solid transparent;
}

.esc-my-bookings__deposit-status--pending {
    background: var(--esc-amber-bg);
    color: var(--esc-amber-text);
    border-color: var(--esc-amber-border);
}

.esc-my-bookings__deposit-status--retained {
    background: var(--esc-red-bg);
    color: var(--esc-red-text);
    border-color: var(--esc-red-border);
}

.esc-my-bookings__deposit-status--refunded {
    background: var(--esc-green-bg);
    color: var(--esc-green-text);
    border-color: var(--esc-green-border);
}

.esc-my-bookings__deposit-status--voucher {
    background: var(--esc-grey-bg);
    color: var(--esc-dark);
    border-color: var(--esc-grey-border);
}

.esc-my-bookings__deposit-hint {
    margin-left: 0.4rem;
    font-size: 0.85rem;
    color: #666;
}

/* ── Zusammenfassungskarte (Detail-Ansicht) ─────────────────────────────── */

.esc-my-bookings__summary {
    margin-bottom: 1.75rem;
    padding: 1rem 1.25rem;
    background: #f5f5f5;
    border: 1px solid #e0e0e0;
    border-radius: 5px;
}

.esc-my-bookings__summary-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem 2rem;
}

.esc-my-bookings__summary-item {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    min-width: 8rem;
}

.esc-my-bookings__summary-label {
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: #7a8a9b;
}

.esc-my-bookings__summary-value {
    font-size: 0.95rem;
    color: #222;
    font-weight: 500;
}

/* ── Buchung ändern (Phase: Buchung ändern, Schritt 3) ──────────────────── */

.esc-my-bookings__section--change {
    border-top: 2px solid var(--esc-amber-text);
    padding-top: 1.25rem;
    margin-top: 0.5rem;
}

.esc-my-bookings__change-deadline {
    margin: 0 0 1rem;
    font-size: 0.9rem;
    color: #555;
}

.esc-my-bookings__change-btn {
    display: inline-block;
    padding: 0.45rem 1.1rem;
    border: 1px solid #c47a1e;
    background: transparent;
    color: #c47a1e;
    border-radius: 4px;
    font-size: 0.9rem;
    font-family: inherit;
    cursor: pointer;
    line-height: 1.4;
    transition: background 0.15s, color 0.15s;
}

.esc-my-bookings__change-btn:hover,
.esc-my-bookings__change-btn:focus {
    background: #c47a1e;
    color: #fff;
}

.esc-my-bookings__change-hint {
    margin-top: 0.5rem;
    font-size: 0.85rem;
    color: #666;
    font-style: italic;
}

.esc-my-bookings__change-hint--blocked {
    margin: 0;
    padding: 0.6rem 0.9rem;
    background: #fef9e7;
    color: #856404;
    border-left: 3px solid #e5a000;
    border-radius: 2px;
    font-size: 0.9rem;
}

/* Change form */
.esc-my-bookings__change-form {
    margin-top: 0.9rem;
    padding: 1rem 1.1rem;
    background: #fdf9f4;
    border: 1px solid #e8d5a0;
    border-radius: 6px;
}

.esc-my-bookings__change-row {
    display: flex;
    gap: 1rem;
    flex-wrap: wrap;
    align-items: flex-end;
}

.esc-my-bookings__change-field {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.esc-my-bookings__change-label {
    font-size: 0.875rem;
    font-weight: 600;
    color: #555;
}

.esc-my-bookings__change-input {
    padding: 0.4rem 0.6rem;
    border: 1px solid #ccc;
    border-radius: 3px;
    font-size: 0.9rem;
    font-family: inherit;
    background: #fff;
}

.esc-my-bookings__change-input--narrow {
    width: 5rem;
}

.esc-my-bookings__change-actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-top: 1rem;
}

.esc-my-bookings__change-error {
    margin: 0.75rem 0 0;
    padding: 0.6rem 0.9rem;
    background: #fce8e6;
    color: #c0392b;
    border-left: 3px solid #c0392b;
    border-radius: 2px;
    font-size: 0.9rem;
}

/* Change submit / neutral buttons */
.esc-my-bookings__change-submit {
    display: inline-block;
    padding: 0.5rem 1.25rem;
    border: 1.5px solid #c47a1e;
    background: #c47a1e;
    color: #fff;
    border-radius: 4px;
    font-size: 0.9rem;
    font-family: inherit;
    font-weight: 600;
    cursor: pointer;
    line-height: 1.5;
    transition: background 0.15s, border-color 0.15s, color 0.15s;
}

.esc-my-bookings__change-submit:hover,
.esc-my-bookings__change-submit:focus {
    background: #a8681a;
    border-color: #a8681a;
    color: #fff;
}

.esc-my-bookings__change-submit:disabled {
    opacity: 0.55;
    cursor: not-allowed;
}

/* Vorschau-Button — outlined, kein Fill */
.esc-my-bookings__change-submit--secondary {
    background: transparent;
    color: #c47a1e;
}

.esc-my-bookings__change-submit--secondary:hover,
.esc-my-bookings__change-submit--secondary:focus {
    background: #c47a1e;
    color: #fff;
}

/* Bestätigen-Button — größer, stärkere Betonung */
.esc-my-bookings__change-submit--primary {
    padding: 0.55rem 1.5rem;
    font-size: 0.95rem;
}

.esc-my-bookings__change-neutral {
    display: inline-block;
    padding: 0.5rem 1.1rem;
    border: 1.5px solid #bbb;
    background: transparent;
    color: #555;
    border-radius: 4px;
    font-size: 0.9rem;
    font-family: inherit;
    cursor: pointer;
    line-height: 1.5;
    transition: background 0.15s, border-color 0.15s, color 0.15s;
}

.esc-my-bookings__change-neutral:hover,
.esc-my-bookings__change-neutral:focus {
    background: #f5f5f5;
    border-color: #777;
    color: #222;
    text-decoration: none !important;
}

.esc-my-bookings__change-neutral:disabled {
    opacity: 0.55;
    cursor: not-allowed;
}

/* Change preview / compare table */
.esc-my-bookings__change-preview {
    margin-top: 0.9rem;
}

.esc-my-bookings__change-preview-title {
    font-size: 0.95rem;
    font-weight: 600;
    margin: 0 0 0.75rem;
    color: #333;
}

.esc-my-bookings__change-compare {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9rem;
    margin-bottom: 0.5rem;
}

.esc-my-bookings__change-compare th,
.esc-my-bookings__change-compare td {
    padding: 0.4rem 0.6rem;
    border-bottom: 1px solid #e0e0e0;
    text-align: left;
    vertical-align: middle;
}

.esc-my-bookings__change-compare thead th {
    font-weight: 600;
    background: #f4f4f4;
}

.esc-my-bookings__change-compare-label {
    font-weight: 600;
    color: #555;
    white-space: nowrap;
}

.esc-my-bookings__change-diff {
    font-size: 0.875rem;
    font-weight: 600;
    margin: 0.4rem 0 0;
    padding: 0.3rem 0.6rem;
    border-radius: 3px;
    display: inline-block;
}

.esc-my-bookings__change-diff--plus {
    background: #fef9e7;
    color: #856404;
}

.esc-my-bookings__change-diff--minus {
    background: #e6f4ea;
    color: #1e7e34;
}

/* ── Self-Service Storno (Phase 5) ──────────────────────────────────────── */

.esc-my-bookings__section--cancel {
    border-top: 2px solid var(--esc-red-text);
    padding-top: 1.25rem;
    margin-top: 0.5rem;
}

.esc-my-bookings__cancel-deadline {
    margin: 0 0 1rem;
    font-size: 0.9rem;
    color: #555;
}

.esc-my-bookings__cancel-btn-detail {
    display: inline-block;
    padding: 0.45rem 1.1rem;
    border: 1px solid #c0392b;
    background: transparent;
    color: #c0392b;
    border-radius: 3px;
    font-size: 0.9rem;
    font-family: inherit;
    cursor: pointer;
    line-height: 1.4;
    transition: background 0.15s, color 0.15s, border-color 0.15s;
}

.esc-my-bookings__cancel-btn-detail:hover,
.esc-my-bookings__cancel-btn-detail:focus {
    background: #c0392b;
    color: #fff;
}

.esc-my-bookings__cancel-btn-detail:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

.esc-my-bookings__cancel-btn-detail--confirm {
    background: #c0392b;
    color: #fff;
    margin-right: 0.5rem;
}

.esc-my-bookings__cancel-btn-detail--confirm:hover,
.esc-my-bookings__cancel-btn-detail--confirm:focus {
    background: #a93226;
    border-color: #a93226;
    color: #fff;
}

.esc-my-bookings__cancel-btn-detail--neutral {
    border-color: #aaa;
    color: #555;
}

.esc-my-bookings__cancel-btn-detail--neutral:hover,
.esc-my-bookings__cancel-btn-detail--neutral:focus {
    background: #555;
    border-color: #555;
    color: #fff;
}

.esc-my-bookings__cancel-confirm {
    margin-top: 1rem;
}

.esc-my-bookings__cancel-confirm-text {
    margin: 0 0 0.75rem;
    font-size: 0.95rem;
    color: #333;
}

.esc-my-bookings__cancel-error {
    margin-top: 0.75rem;
    padding: 0.6rem 0.9rem;
    background: #fce8e6;
    color: #c0392b;
    border-left: 3px solid #c0392b;
    border-radius: 2px;
    font-size: 0.9rem;
}

.esc-my-bookings__cancel-deadline-passed {
    margin: 0;
    padding: 0.6rem 0.9rem;
    background: #fef9e7;
    color: #856404;
    border-left: 3px solid #e5a000;
    border-radius: 2px;
    font-size: 0.9rem;
}

/* ── Ändern: Intro-Text ─────────────────────────────────────────────────── */

.esc-my-bookings__change-intro {
    margin: 0 0 1rem;
    font-size: 0.9rem;
    color: #444;
}

/* ── Ändern: Preview-Blöcke (Aktueller / Neuer Termin) ─────────────────── */

.esc-my-bookings__change-preview-blocks {
    display: flex;
    gap: 1rem;
    flex-wrap: wrap;
    margin-bottom: 0.75rem;
}

.esc-my-bookings__change-preview-block {
    flex: 1 1 13rem;
    padding: 0.9rem 1.1rem;
    border: 1px solid #e0e0e0;
    border-left: 4px solid #ccc;
    border-radius: 4px;
    background: #fafafa;
    box-shadow: 0 1px 3px rgba(0,0,0,.06);
}

.esc-my-bookings__change-preview-block--current {
    border-left-color: #bbb;
    background: #f7f7f7;
}

.esc-my-bookings__change-preview-block--new {
    border-left-color: #c47a1e;
    background: #fdf8f0;
}

.esc-my-bookings__change-preview-block-title {
    font-size: 0.8rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #666;
    margin-bottom: 0.6rem;
}

.esc-my-bookings__change-preview-block--current .esc-my-bookings__change-preview-block-title {
    color: #777;
}

.esc-my-bookings__change-preview-block--new .esc-my-bookings__change-preview-block-title {
    color: #9a5e12;
}

.esc-my-bookings__change-preview-dl {
    display: grid;
    grid-template-columns: 5.5rem 1fr;
    gap: 0.25rem 0.75rem;
    margin: 0;
    font-size: 0.875rem;
}

.esc-my-bookings__change-preview-dl dt {
    font-weight: 600;
    color: #555;
}

.esc-my-bookings__change-preview-dl dd {
    margin: 0;
}

.esc-my-bookings__change-preview-rooms {
    list-style: none;
    margin: 0;
    padding: 0;
}

.esc-my-bookings__change-preview-rooms li {
    line-height: 1.5;
}

.esc-my-bookings__change-preview-hint {
    margin: 0.75rem 0;
    padding: 0.55rem 0.85rem;
    font-size: 0.85rem;
    color: #7a5010;
    font-style: normal;
    background: #fef6e4;
    border-left: 3px solid #c47a1e;
    border-radius: 3px;
}

/* Price comparison within preview blocks */
.esc-my-bookings__change-preview-price {
    margin-top: 0.6rem;
    padding-top: 0.5rem;
    border-top: 1px dashed #e0d0b0;
    display: grid;
    grid-template-columns: 5.5rem 1fr;
    gap: 0.25rem 0.75rem;
    font-size: 0.875rem;
}

.esc-my-bookings__change-preview-price dt {
    font-weight: 600;
    color: #555;
}

.esc-my-bookings__change-preview-price dd {
    margin: 0;
}

.esc-my-bookings__change-price-old {
    text-decoration: line-through;
    color: #999;
}

.esc-my-bookings__change-price-new--plus {
    color: #7a5010;
    font-weight: 600;
}

.esc-my-bookings__change-price-new--minus {
    color: #1e7e34;
    font-weight: 600;
}

.esc-my-bookings__change-price-diff--plus {
    display: inline-block;
    padding: 0.15rem 0.45rem;
    background: #fef6e4;
    color: #7a5010;
    border-radius: 3px;
    font-size: 0.8rem;
    font-weight: 600;
}

.esc-my-bookings__change-price-diff--minus {
    display: inline-block;
    padding: 0.15rem 0.45rem;
    background: #e6f4ea;
    color: #1e7e34;
    border-radius: 3px;
    font-size: 0.8rem;
    font-weight: 600;
}

/* ── Storno: Warn-Text + warn-Button ────────────────────────────────────── */

.esc-my-bookings__cancel-warning-text {
    margin: 0 0 0.85rem;
    font-size: 0.9rem;
    color: #7a3a2a;
    background: #fff5f3;
    border-left: 3px solid #c0392b;
    padding: 0.5rem 0.8rem;
    border-radius: 2px;
}

.esc-my-bookings__cancel-btn-detail--warn {
    background: #c0392b;
    color: #fff;
    border-color: #c0392b;
}

.esc-my-bookings__cancel-btn-detail--warn:hover,
.esc-my-bookings__cancel-btn-detail--warn:focus {
    background: #a93226;
    border-color: #a93226;
    color: #fff;
}

/* ── Rechnungsdownload (Phase 14 Schritt 6) ─────────────────────────────── */

/* Inline-Link in der Buchungsliste */
.esc-my-bookings__invoice-link {
    display: inline-block;
    margin-left: 0.5rem;
    padding: 0.3rem 0.75rem;
    background: transparent;
    color: #333;
    border: 1px solid #bbb;
    border-radius: 3px;
    font-size: 0.8rem;
    text-decoration: none !important;
    white-space: nowrap;
    line-height: 1.4;
}

.esc-my-bookings__invoice-link:hover,
.esc-my-bookings__invoice-link:focus {
    background: #f5f5f5;
    border-color: #777;
    color: #222;
    text-decoration: none !important;
}

/* Karten-Abschnitt in der Detailansicht */
.esc-my-bookings__section--invoice {
    border-left: 4px solid #bbb;
}

.esc-my-bookings__invoice-info {
    margin: 0 0 0.85rem;
    font-size: 0.9rem;
    color: #444;
}

/* Download-Button (Detailansicht) */
.esc-my-bookings__invoice-download-btn {
    display: inline-block;
    padding: 0.45rem 1.1rem;
    background: transparent;
    color: #333;
    border: 1px solid #bbb;
    text-decoration: none !important;
    border-radius: 3px;
    font-size: 0.9rem;
    font-family: inherit;
    line-height: 1.4;
    transition: background 0.15s, color 0.15s, border-color 0.15s;
}

.esc-my-bookings__invoice-download-btn:hover,
.esc-my-bookings__invoice-download-btn:focus {
    background: #f5f5f5;
    border-color: #777;
    color: #222;
    text-decoration: none !important;
}

/* Zustand: angefordert */
.esc-my-bookings__invoice-requested {
    margin: 0;
    padding: 0.55rem 0.85rem;
    background: #f0f7ee;
    color: #2e6b21;
    border-left: 3px solid #4caf50;
    border-radius: 3px;
    font-size: 0.9rem;
}

/* Zustand: anfordern (Intro-Text + Button) */
.esc-my-bookings__invoice-request-intro {
    margin: 0 0 0.85rem;
    font-size: 0.9rem;
    color: #444;
}

.esc-my-bookings__invoice-request-btn {
    display: inline-block;
    padding: 0.45rem 1.1rem;
    background: transparent;
    color: #333;
    border: 1px solid #bbb;
    border-radius: 3px;
    font-size: 0.9rem;
    font-family: inherit;
    cursor: pointer;
    line-height: 1.4;
    text-decoration: none !important;
    transition: background 0.15s, color 0.15s, border-color 0.15s;
}

.esc-my-bookings__invoice-request-btn:hover,
.esc-my-bookings__invoice-request-btn:focus {
    background: #f5f5f5;
    border-color: #777;
    color: #222;
    text-decoration: none !important;
}

.esc-my-bookings__invoice-request-btn:disabled {
    opacity: 0.55;
    cursor: not-allowed;
}

.esc-my-bookings__invoice-request-btn--sent {
    background: #f0f7ee;
    color: #2e6b21;
    border-color: #4caf50;
    opacity: 1;
    cursor: default;
}

.esc-my-bookings__invoice-request-error {
    margin-top: 0.75rem;
    padding: 0.55rem 0.85rem;
    background: #fce8e6;
    color: #c0392b;
    border-left: 3px solid #c0392b;
    border-radius: 3px;
    font-size: 0.9rem;
}

/* ── Teilstorno Zusatzraum (Phase 18.4) ─────────────────────────────────── */

/* Flex-Zeile: Rauminfo wächst, Button bleibt rechts */
.esc-my-bookings__room-item {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.5rem 0.75rem;
}

.esc-my-bookings__room-info {
    flex: 1 1 auto;
}

.esc-my-bookings__room-primary-label {
    font-size: 0.8em;
    color: #888;
    font-weight: normal;
    margin-left: 0.2rem;
}

.esc-my-bookings__partial-cancel-btn {
    display: inline-flex;
    align-items: center;
    flex-shrink: 0;
    min-height: var(--esc-ctrl-h);
    padding: 0 0.875rem;
    border: 1px solid var(--esc-red-text);
    background: transparent;
    color: var(--esc-red-text);
    border-radius: 3px;
    font-size: 0.85rem;
    font-family: inherit;
    cursor: pointer;
    white-space: nowrap;
    transition: background 0.15s, color 0.15s;
}

.esc-my-bookings__partial-cancel-btn:hover,
.esc-my-bookings__partial-cancel-btn:focus {
    background: var(--esc-red-text);
    color: #fff;
}

.esc-my-bookings__partial-cancel-btn:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

.esc-my-bookings__partial-cancel-error {
    color: var(--esc-red-text);
    font-size: 0.875em;
    margin-top: 4px;
}

/* ── Tabellen-Wrapper (Card-Optik) ──────────────────────────────────────── */

.esc-my-bookings__table-wrap {
    border: 1px solid var(--esc-grey-border);
    border-radius: var(--esc-radius);
    overflow: hidden;
    margin-top: 0.75rem;
}

.esc-my-bookings__table-wrap .esc-my-bookings__table {
    margin: 0;
}

.esc-my-bookings__table-wrap .esc-my-bookings__table th,
.esc-my-bookings__table-wrap .esc-my-bookings__table td {
    border-bottom-color: var(--esc-grey-border);
}

.esc-my-bookings__table-wrap .esc-my-bookings__table tbody tr:last-child td {
    border-bottom: none;
}

.esc-my-bookings__table thead th {
    background: var(--esc-grey-bg);
    color: var(--esc-grey-text);
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.esc-my-bookings__table tbody tr {
    transition: background 0.1s;
}

.esc-my-bookings__table tbody tr:hover {
    background: #fafafa;
}

/* Detail-Link: visuell klar als Haupt-Aktion */
.esc-my-bookings__action-btn--detail {
    color: var(--esc-dark);
    border-color: var(--esc-grey-border);
    font-weight: 500;
}

.esc-my-bookings__action-btn--detail:hover,
.esc-my-bookings__action-btn--detail:focus {
    background: var(--esc-dark);
    color: #fff;
    border-color: var(--esc-dark);
}

/* Aktiver Nav-Button erhält orangen Unterstrich */
.esc-my-bookings__nav-btn--active {
    border-color: var(--esc-orange);
    color: var(--esc-dark);
    font-weight: 600;
}

.esc-my-bookings__nav-btn--active:hover,
.esc-my-bookings__nav-btn--active:focus {
    background: rgba(230, 126, 34, .06);
    border-color: var(--esc-orange);
    color: var(--esc-dark);
}

/* Meine Nachrichten (Phase 34.3) ────────────────────────────────────────── */

.esc-my-bookings__messages {
    margin-bottom: 1.5rem;
}

.esc-my-bookings__messages-title {
    margin: 0 0 0.75rem;
    font-size: 1rem;
    font-weight: 600;
}

.esc-my-bookings__messages-list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.esc-my-bookings__message-item {
    padding: 0.75rem 0;
    border-bottom: 1px solid var(--esc-grey-border);
}

.esc-my-bookings__message-item:last-child {
    border-bottom: none;
    padding-bottom: 0;
}

.esc-my-bookings__message-item:first-child {
    padding-top: 0;
}

.esc-my-bookings__message-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    align-items: baseline;
    margin-bottom: 0.35rem;
    font-size: 0.8125rem;
    color: var(--esc-grey-text);
}

.esc-my-bookings__message-date {
    white-space: nowrap;
}

.esc-my-bookings__message-booking-link {
    color: inherit;
    text-decoration: underline;
    text-decoration-color: var(--esc-grey-border);
}

.esc-my-bookings__message-booking-link:hover {
    color: var(--esc-orange);
    text-decoration-color: var(--esc-orange);
    text-decoration: underline !important;
}

.esc-my-bookings__message-bdate {
    color: var(--esc-grey-text);
    font-size: 0.8125rem;
}

.esc-my-bookings__message-text {
    margin: 0;
    font-size: 0.9375rem;
    line-height: 1.5;
    white-space: pre-line;
}

@media ( max-width: 600px ) {
    .esc-my-bookings__message-meta {
        flex-direction: column;
        gap: 0.15rem;
    }
}

/* Verlauf zur Buchung (Phase 34.1) ──────────────────────────────────────── */

.esc-my-bookings__section--history {
    padding: 0;
    overflow: hidden;
}

.esc-history__summary {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    padding: 1rem 1.25rem;
    font-size: 1rem;
    font-weight: 600;
    color: inherit;
    cursor: pointer;
    list-style: none;
    user-select: none;
}

.esc-history__summary::-webkit-details-marker { display: none; }
.esc-history__summary::marker               { display: none; }

.esc-history__summary::after {
    content: '▸';
    font-size: 0.7rem;
    color: #888;
}

details[open] .esc-history__summary::after {
    content: '▾';
}

.esc-history__list {
    list-style: none;
    margin: 0;
    padding: 0 1.25rem 0.75rem;
    border-top: 1px solid #ebebeb;
}

.esc-history__entry {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 0.2rem 0.75rem;
    padding: 0.55rem 0;
    border-bottom: 1px solid #f3f3f3;
    font-size: 0.875rem;
}

.esc-history__entry:last-child {
    border-bottom: none;
}

.esc-history__time {
    flex-shrink: 0;
    min-width: 115px;
    color: #999;
    font-size: 0.8rem;
}

.esc-history__label {
    font-weight: 500;
    color: #222;
}

.esc-history__detail {
    color: #555;
}

/* Responsive (mobile) ────────────────────────────────────────────────────── */

@media ( max-width: 768px ) {
    .esc-my-bookings__summary-grid {
        grid-template-columns: 1fr 1fr;
    }

    .esc-my-bookings__dl {
        grid-template-columns: 7rem 1fr;
    }
}

@media ( max-width: 640px ) {

    /* Tabelle → gestapelte Karten */
    .esc-my-bookings__table thead {
        display: none;
    }

    .esc-my-bookings__table tbody tr {
        display: block;
        margin-bottom: 1rem;
        border: 1px solid #e0e0e0;
        border-radius: 4px;
        padding: 0.5rem;
    }

    .esc-my-bookings__table td {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 0.4rem 0.5rem;
        border-bottom: 1px solid #f0f0f0;
        font-size: 0.9rem;
    }

    .esc-my-bookings__table td:last-child {
        border-bottom: none;
    }

    .esc-my-bookings__table td::before {
        content: attr(data-label);
        font-weight: 600;
        color: #555;
        flex-shrink: 0;
        margin-right: 0.5rem;
    }

    /* Aktionsspalte hat kein data-label → kein Pseudo-Element, links ausrichten */
    .esc-my-bookings__table .esc-my-bookings__actions {
        justify-content: flex-start;
        flex-wrap: wrap;
        gap: 0.4rem 0;
    }

    .esc-my-bookings__table .esc-my-bookings__actions::before {
        display: none;
    }

    /* Detail: Definition list einspaltig */
    .esc-my-bookings__dl {
        grid-template-columns: 1fr;
        gap: 0;
    }

    .esc-my-bookings__dl dt {
        margin-top: 0.5rem;
    }

    /* Zusammenfassung: einspaltig */
    .esc-my-bookings__summary-grid {
        gap: 0.6rem 0;
    }

    .esc-my-bookings__summary-item {
        min-width: 100%;
    }

    /* Preview-Blöcke: gestapelt */
    .esc-my-bookings__change-preview-blocks {
        flex-direction: column;
    }

    .esc-my-bookings__change-preview-block {
        border-left-width: 3px;
    }

    .esc-my-bookings__change-preview-dl {
        grid-template-columns: 1fr;
        gap: 0;
    }

    .esc-my-bookings__change-preview-dl dt {
        margin-top: 0.4rem;
        font-size: 0.75rem;
        text-transform: uppercase;
        color: #888;
    }

    .esc-my-bookings__change-preview-price {
        grid-template-columns: 1fr;
        gap: 0;
    }

    .esc-my-bookings__change-preview-price dt {
        margin-top: 0.4rem;
        font-size: 0.75rem;
        text-transform: uppercase;
        color: #888;
    }

    /* Verlauf: einspaltig auf kleinen Screens */
    .esc-history__entry {
        flex-direction: column;
        gap: 0.05rem;
    }

    .esc-history__time {
        font-size: 0.75rem;
    }

}