/* ═══════════════════════════════════════════════════════════
   Mr. White Ads Studio · studio.css (minimal)

   Fast alles kommt vom whitetheme (.auth-page-layout, .auth-box,
   .auth-form, .form-group, .account-layout, .account-sidebar,
   .account-nav, .account-stats, .account-stat-card, .card,
   .btn, .page-hero …). Hier nur die paar Studio-eigenen
   Sachen, die das Theme nicht hat:
     - Multi-Step-Indikator
     - Plan-Auswahl (Cards mit Selected-State)
   ═══════════════════════════════════════════════════════════ */

/* ─── Multi-Step Indikator (Register) ─── */
.mwat-steps {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
    margin-bottom: 32px;
    flex-wrap: wrap;
}
.mwat-step {
    display: flex;
    align-items: center;
    gap: 10px;
    color: #94A3B8;
    font-family: var(--font-mono, monospace);
    font-size: 0.78rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}
.mwat-step:not(:last-child)::after {
    content: '';
    width: 28px;
    height: 1px;
    background: #CBD5E1;
    margin-left: 10px;
}
.mwat-step__num {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: #EEF1F4;
    border: 1px solid #CBD5E1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    color: #64748B;
}
.mwat-step.is-active { color: #0F172A; }
.mwat-step.is-active .mwat-step__num {
    background: var(--color-accent, #1B3740);
    border-color: var(--color-accent, #1B3740);
    color: #fff;
}
.mwat-step.is-done .mwat-step__num {
    background: #16A34A;
    border-color: #16A34A;
    color: #fff;
}

/* ─── Plan-Auswahl ─── */
.mwat-plans {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 24px;
    max-width: 1100px;
    margin: 0 auto;
    padding-top: 16px; /* Platz für die schwebende "Empfohlen"-Pille */
    align-items: stretch;
}

.mwat-plan {
    position: relative;
    display: flex;
    flex-direction: column;
    padding: 36px 28px 28px;
    cursor: pointer;
    background: #fff;
    border: 1px solid var(--color-border, #E2E8F0);
    border-radius: 14px;
    transition: transform 0.25s cubic-bezier(0.2, 0.8, 0.2, 1),
                box-shadow 0.25s ease,
                border-color 0.2s ease;
    /* overflow: visible damit die Badge oben rausragen darf */
    overflow: visible;
}

.mwat-plan::before {
    /* Akzentstreifen oben — nur für selected sichtbar (featured kriegt die Pille) */
    content: '';
    position: absolute;
    inset: 0 0 auto 0;
    height: 4px;
    background: var(--color-accent, #1B3740);
    border-radius: 14px 14px 0 0;
    transform: scaleX(0);
    transform-origin: left center;
    transition: transform 0.3s ease;
}

.mwat-plan:hover {
    transform: translateY(-4px);
    border-color: #94A3B8;
    box-shadow: 0 12px 32px rgba(15, 23, 42, 0.08);
}

/* ─── FEATURED ─── */
.mwat-plan.is-featured {
    border-color: var(--color-accent, #1B3740);
    border-width: 2px;
    padding: 35px 27px 27px; /* -1px wegen Border-Width */
    background: linear-gradient(180deg, rgba(27, 55, 64, 0.03) 0%, #fff 50%);
    transform: translateY(-8px);
    box-shadow: 0 18px 40px rgba(15, 23, 42, 0.1);
}
.mwat-plan.is-featured:hover {
    transform: translateY(-12px);
    box-shadow: 0 24px 48px rgba(15, 23, 42, 0.14);
}

/* ─── SELECTED ─── */
.mwat-plan.is-selected {
    border-color: var(--color-accent, #1B3740);
    box-shadow: 0 0 0 3px var(--color-accent, #1B3740),
                0 18px 40px rgba(15, 23, 42, 0.12);
}
.mwat-plan.is-selected::before { transform: scaleX(1); }
.mwat-plan.is-selected:hover {
    box-shadow: 0 0 0 3px var(--color-accent, #1B3740),
                0 24px 48px rgba(15, 23, 42, 0.16);
}

/* ─── BADGE: freischwebende Pille über der Card ─── */
.mwat-plan__badge {
    position: absolute;
    top: -14px;
    left: 50%;
    transform: translateX(-50%);
    background: var(--color-accent, #1B3740);
    color: #fff;
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    padding: 8px 18px;
    border-radius: 99px;
    box-shadow: 0 8px 20px rgba(15, 23, 42, 0.22);
    white-space: nowrap;
    z-index: 2;
}

/* ─── HEAD (Tier + Tagline) ─── */
.mwat-plan__head {
    margin-bottom: 24px;
}
.mwat-plan__tier {
    display: block;
    font-family: var(--font-mono, monospace);
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.22em;
    color: var(--color-accent, #1B3740);
    margin-bottom: 8px;
}
.mwat-plan__tagline {
    font-size: 0.92rem;
    color: var(--color-text-muted, #64748B);
    line-height: 1.45;
    margin: 0;
    min-height: 2.6em; /* Cards alle gleich hoch */
}

/* ─── PREIS ─── */
.mwat-plan__price-wrap {
    display: flex;
    align-items: baseline;
    gap: 6px;
    margin-bottom: 4px;
}
.mwat-plan__price {
    font-family: var(--font-heading, sans-serif);
    font-size: 3rem;
    font-weight: 900;
    color: var(--color-text-heading, #0F172A);
    letter-spacing: -0.04em;
    line-height: 1;
}
.mwat-plan__period {
    font-size: 0.9rem;
    color: var(--color-text-muted, #64748B);
    font-weight: 500;
}
.mwat-plan__mwst {
    font-size: 0.72rem;
    color: var(--color-text-muted, #64748B);
    margin-bottom: 24px;
    font-family: var(--font-mono, monospace);
    letter-spacing: 0.02em;
}

/* ─── DIVIDER ─── */
.mwat-plan__divider {
    height: 1px;
    background: var(--color-border, #E2E8F0);
    margin: 0 -28px 24px;
}

/* ─── FEATURES ─── */
.mwat-plan__features {
    list-style: none;
    padding: 0;
    margin: 0 0 28px;
    flex: 1;
}
.mwat-plan__features li {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 8px 0;
    font-size: 0.92rem;
    color: var(--color-text-body, #334155);
    line-height: 1.5;
}
.mwat-plan__features li svg {
    width: 18px;
    height: 18px;
    flex-shrink: 0;
    color: #16A34A;
    margin-top: 1px;
    stroke-width: 2.5;
}

/* ─── CTA-Hint am Card-Fuß ─── */
.mwat-plan__cta {
    padding: 12px 16px;
    text-align: center;
    border: 1px dashed var(--color-border, #E2E8F0);
    border-radius: 8px;
    font-size: 0.82rem;
    font-weight: 600;
    color: var(--color-text-muted, #64748B);
    text-transform: uppercase;
    letter-spacing: 0.1em;
    transition: all 0.2s ease;
}
.mwat-plan:hover .mwat-plan__cta {
    border-color: var(--color-accent, #1B3740);
    color: var(--color-accent, #1B3740);
    border-style: solid;
}
.mwat-plan__cta-picked { display: none; }
.mwat-plan.is-selected .mwat-plan__cta {
    background: var(--color-accent, #1B3740);
    color: #fff;
    border-color: var(--color-accent, #1B3740);
    border-style: solid;
}
.mwat-plan.is-selected .mwat-plan__cta-pick { display: none; }
.mwat-plan.is-selected .mwat-plan__cta-picked { display: inline; }

/* ─── Selected-Checkmark in der Ecke ─── */
.mwat-plan__select-mark {
    display: none;
    position: absolute;
    top: 16px;
    right: 16px;
    width: 30px;
    height: 30px;
    background: var(--color-accent, #1B3740);
    color: #fff;
    border-radius: 50%;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 12px rgba(27, 55, 64, 0.3);
}
.mwat-plan__select-mark svg {
    width: 16px;
    height: 16px;
    stroke-width: 3;
}
.mwat-plan.is-selected .mwat-plan__select-mark {
    display: inline-flex;
}

/* ─── Mobile-Tweaks ─── */
@media (max-width: 640px) {
    .mwat-plans { gap: 16px; }
    .mwat-plan { padding: 28px 22px 22px; }
    .mwat-plan.is-featured { transform: none; }
    .mwat-plan__price { font-size: 2.4rem; }
    .mwat-plan__tagline { min-height: 0; }
}

/* ─── Register Step 1: zusätzliche Hilfselemente ─── */
.mwat-help {
    display: block;
    margin-top: 6px;
    font-size: 0.78rem;
    color: var(--color-text-muted, #94A3B8);
    line-height: 1.5;
}

/* Form-Input Error-State (falls Theme das noch nicht hat) */
.form-input.error {
    border-color: #DC2626 !important;
    background-color: rgba(239, 68, 68, 0.04);
}

.form-checkbox.has-error span {
    color: #DC2626;
}

/* Passwort-Wrap mit Toggle-Button */
.mwat-pw-wrap {
    position: relative;
}
.mwat-pw-wrap .form-input {
    padding-right: 44px;
}
.mwat-pw-toggle {
    position: absolute;
    top: 50%;
    right: 8px;
    transform: translateY(-50%);
    background: transparent;
    border: 0;
    padding: 8px;
    cursor: pointer;
    color: var(--color-text-muted, #94A3B8);
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 4px;
}
.mwat-pw-toggle:hover {
    color: var(--color-text-body, #334155);
    background: rgba(255, 255, 255, 0.06);
}

/* Passwort-Stärke-Meter */
.mwat-pw-meter {
    margin-top: 8px;
    height: 4px;
    background: var(--color-gray-dark, #E2E8F0);
    border-radius: 2px;
    overflow: hidden;
}
.mwat-pw-meter__bar {
    height: 100%;
    width: 0;
    background: #DC2626;
    transition: width 0.25s ease, background 0.25s ease;
}
.mwat-pw-meter__bar[data-strength="1"] { width: 25%; background: #DC2626; }
.mwat-pw-meter__bar[data-strength="2"] { width: 50%; background: #F59E0B; }
.mwat-pw-meter__bar[data-strength="3"] { width: 75%; background: #10B981; }
.mwat-pw-meter__bar[data-strength="4"] { width: 100%; background: #059669; }

/* ════════════════════════════════════════════════════════
   CHECKOUT (Schritt 3 + payment-pending)
   ════════════════════════════════════════════════════════ */
.mwat-checkout {
    max-width: 640px;
    margin: 0 auto;
}
.mwat-checkout__inner {
    background: #fff;
    border: 1px solid var(--color-border, #E2E8F0);
    border-radius: 16px;
    box-shadow: 0 20px 50px rgba(15, 23, 42, 0.08);
    overflow: hidden;
}

/* Header */
.mwat-checkout__head {
    padding: 36px 36px 24px;
    text-align: center;
    border-bottom: 1px solid var(--color-border, #E2E8F0);
}
.mwat-checkout__title {
    font-family: var(--font-heading, sans-serif);
    font-size: 1.6rem;
    font-weight: 900;
    margin: 0 0 8px;
    letter-spacing: -0.02em;
    color: var(--color-text-heading, #0F172A);
}
.mwat-checkout__subtitle {
    margin: 0;
    color: var(--color-text-muted, #64748B);
    font-size: 0.95rem;
    line-height: 1.5;
    max-width: 440px;
    margin-left: auto;
    margin-right: auto;
}

/* Error-Block */
.mwat-checkout__error {
    margin: 20px 28px 0;
    padding: 14px 16px;
    background: #FEF2F2;
    border: 1px solid #FECACA;
    color: #991B1B;
    border-radius: 10px;
    display: flex;
    gap: 12px;
    align-items: flex-start;
    font-size: 0.92rem;
    line-height: 1.5;
}
.mwat-checkout__error svg {
    width: 20px;
    height: 20px;
    flex-shrink: 0;
    color: #DC2626;
}
.mwat-checkout__error strong {
    color: #7F1D1D;
}

/* Order-Card */
.mwat-order {
    margin: 28px;
    background: linear-gradient(180deg, rgba(27, 55, 64, 0.04) 0%, #F8FAFC 100%);
    border: 1px solid var(--color-border, #E2E8F0);
    border-radius: 12px;
    padding: 26px 28px;
}

.mwat-order__plan {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 20px;
    margin-bottom: 22px;
}
.mwat-order__tier {
    display: block;
    font-family: var(--font-mono, monospace);
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.22em;
    color: var(--color-accent, #1B3740);
    margin-bottom: 6px;
}
.mwat-order__tagline {
    margin: 0;
    color: var(--color-text-muted, #64748B);
    font-size: 0.9rem;
    line-height: 1.4;
    max-width: 280px;
}
.mwat-order__price {
    display: flex;
    align-items: baseline;
    gap: 4px;
    white-space: nowrap;
}
.mwat-order__price-num {
    font-family: var(--font-heading, sans-serif);
    font-size: 2rem;
    font-weight: 900;
    color: var(--color-text-heading, #0F172A);
    letter-spacing: -0.04em;
    line-height: 1;
}
.mwat-order__price-period {
    font-size: 0.85rem;
    color: var(--color-text-muted, #64748B);
    font-weight: 500;
}

/* Feature-Liste */
.mwat-order__features {
    list-style: none;
    padding: 0;
    margin: 0 0 22px;
}
.mwat-order__features li {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 6px 0;
    font-size: 0.9rem;
    color: var(--color-text-body, #334155);
    line-height: 1.5;
}
.mwat-order__features li svg {
    width: 16px;
    height: 16px;
    flex-shrink: 0;
    color: #16A34A;
    margin-top: 2px;
    stroke-width: 2.5;
}

.mwat-order__divider {
    height: 1px;
    background: var(--color-border, #E2E8F0);
    margin: 0 -28px 22px;
}

.mwat-order__total {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 16px;
}
.mwat-order__total-label {
    font-size: 1rem;
    font-weight: 700;
    color: var(--color-text-heading, #0F172A);
    margin-bottom: 4px;
}
.mwat-order__total-note {
    font-size: 0.8rem;
    color: var(--color-text-muted, #64748B);
    line-height: 1.4;
}
.mwat-order__total-sum {
    font-family: var(--font-heading, sans-serif);
    font-size: 2.2rem;
    font-weight: 900;
    color: var(--color-accent, #1B3740);
    letter-spacing: -0.04em;
    line-height: 1;
    white-space: nowrap;
}

/* Trust-Bereich */
.mwat-trust {
    padding: 0 28px 24px;
}
.mwat-trust__badges {
    display: flex;
    justify-content: center;
    gap: 16px;
    flex-wrap: wrap;
    margin-bottom: 14px;
    font-size: 0.78rem;
    color: var(--color-text-muted, #64748B);
}
.mwat-trust__badge {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-weight: 500;
}
.mwat-trust__methods {
    display: flex;
    justify-content: center;
    gap: 8px;
    flex-wrap: wrap;
}
.mwat-trust__methods span {
    display: inline-block;
    padding: 4px 10px;
    background: #F1F5F9;
    border: 1px solid var(--color-border, #E2E8F0);
    border-radius: 4px;
    font-size: 0.7rem;
    font-weight: 600;
    color: #475569;
    letter-spacing: 0.02em;
}

/* CTA */
.mwat-checkout__cta {
    padding: 0 28px 24px;
    margin: 0;
}
.mwat-checkout__btn {
    width: 100%;
    padding: 16px 24px;
    font-size: 1rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border-radius: 10px;
    box-shadow: 0 8px 20px rgba(27, 55, 64, 0.25);
    transition: transform 0.15s ease, box-shadow 0.2s ease;
}
.mwat-checkout__btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 28px rgba(27, 55, 64, 0.32);
}
.mwat-checkout__btn svg {
    width: 16px;
    height: 16px;
}
.mwat-checkout__disclaimer {
    margin: 12px 0 0;
    font-size: 0.78rem;
    color: var(--color-text-muted, #64748B);
    line-height: 1.5;
    text-align: center;
}

.mwat-checkout__back {
    padding: 0 28px 28px;
    text-align: center;
    font-size: 0.9rem;
}

/* Mobile */
@media (max-width: 560px) {
    .mwat-checkout__head { padding: 24px 20px 18px; }
    .mwat-order { margin: 20px; padding: 20px; }
    .mwat-order__divider { margin: 0 -20px 18px; }
    .mwat-order__plan { flex-direction: column; gap: 12px; }
    .mwat-order__total { flex-direction: column; gap: 8px; }
    .mwat-order__total-sum { font-size: 1.8rem; }
    .mwat-trust { padding: 0 20px 20px; }
    .mwat-checkout__cta { padding: 0 20px 20px; }
    .mwat-checkout__back { padding: 0 20px 24px; }
}

/* ════════════════════════════════════════════════════════
   FIELD-LEVEL ERRORS + LIVE-EMAIL-CHECK
   ════════════════════════════════════════════════════════ */
.mwat-field-error {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    margin-top: 6px;
    padding: 8px 12px;
    background: #FEF2F2;
    border: 1px solid #FECACA;
    border-radius: 6px;
    color: #991B1B;
    font-size: 0.85rem;
    line-height: 1.4;
}
.mwat-field-error svg {
    width: 16px;
    height: 16px;
    color: #DC2626;
    flex-shrink: 0;
    margin-top: 1px;
}
.mwat-field-error .auth-link {
    color: #991B1B;
    text-decoration: underline;
    font-weight: 600;
}

.mwat-email-live {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-top: 6px;
    padding: 6px 10px;
    border-radius: 6px;
    font-size: 0.82rem;
    line-height: 1.4;
}
.mwat-email-live__icon {
    font-weight: 700;
    flex-shrink: 0;
}
.mwat-email-live.is-checking {
    background: #F1F5F9;
    color: #64748B;
}
.mwat-email-live.is-ok {
    background: #ECFDF5;
    color: #166534;
    border: 1px solid #BBF7D0;
}
.mwat-email-live.is-taken {
    background: #FEF2F2;
    color: #991B1B;
    border: 1px solid #FECACA;
}
.mwat-email-live.is-invalid {
    background: #FFFBEB;
    color: #92400E;
    border: 1px solid #FDE68A;
}
.mwat-email-live .auth-link {
    color: inherit;
    text-decoration: underline;
    font-weight: 600;
    margin-left: 4px;
}

/* E-Mail-Input: grüner Rahmen bei Verfügbar */
.form-input.success {
    border-color: #16A34A !important;
    box-shadow: 0 0 0 3px rgba(22, 163, 74, 0.1);
}

/* Inline-Help-Text ausblenden wenn Live-Check aktiv ist */
.mwat-email-live:not([hidden]) ~ .mwat-help,
.form-group:has(.mwat-email-live:not([hidden])) .mwat-email-help {
    display: none;
}

/* ════════════════════════════════════════════════════════
   STUDIO-BRANDING — Brand-Teal (#1B3740) sichtbar machen
   Override für die generischen account-stat-card Styles aus dem Theme,
   damit Zahlen + Icons in der Brand-Farbe leuchten statt im neutralen Slate.
   ════════════════════════════════════════════════════════ */
.mwat .account-stat-card__num {
    color: var(--color-accent, #1B3740) !important;
    font-weight: 900;
    letter-spacing: -0.02em;
}
.mwat .account-stat-card__icon {
    background: rgba(27, 55, 64, 0.08);
    border: 1px solid rgba(27, 55, 64, 0.18);
    color: var(--color-accent, #1B3740);
}
.mwat .account-stat-card__icon svg {
    color: var(--color-accent, #1B3740);
    stroke: var(--color-accent, #1B3740);
}
.mwat .account-stat-card {
    border-color: var(--color-border, #E2E8F0);
    transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}
.mwat .account-stat-card:hover {
    border-color: var(--color-accent, #1B3740);
    box-shadow: 0 8px 20px rgba(27, 55, 64, 0.08);
    transform: translateY(-2px);
}

/* Sidebar-aktiver Link in Brand-Teal statt schwarz */
.mwat .account-nav__link.is-active {
    background: var(--color-accent, #1B3740) !important;
    color: #fff !important;
}
.mwat .account-nav__link.is-active svg {
    stroke: #fff !important;
    color: #fff !important;
}
.mwat .account-nav__link:hover {
    background: rgba(27, 55, 64, 0.06);
    color: var(--color-accent, #1B3740);
}

/* Section-Titles: Akzent-Untertitel-Linie in Brand-Teal */
.mwat .account-section__title {
    position: relative;
    padding-bottom: 12px;
    margin-bottom: 20px;
    border-bottom: 2px solid var(--color-accent, #1B3740);
    display: inline-block;
}

/* "Letzte Analysen"-Tabelle: Status-Badge "completed" als Brand-Teal */
.mwat .account-table .status-badge--paid,
.mwat .account-table td:has(> .status-badge) {
    color: var(--color-accent, #1B3740);
}

/* Buttons in der Studio: outline-style mit Brand-Teal als Hover */
.mwat .btn-outline:hover {
    background: var(--color-accent, #1B3740) !important;
    border-color: var(--color-accent, #1B3740) !important;
    color: #fff !important;
}

/* Karten-Hover-State über die ganze Studio: Brand-Border */
.mwat .card:hover {
    border-color: var(--color-border-strong, #CBD5E1);
}

/* ════════════════════════════════════════════════════════
   DASHBOARD-TABLES: URL-Spalte, Failed-Badge, Polish
   ════════════════════════════════════════════════════════ */
.mwat .account-table-wrap {
    display: block;
    width: 100%;
    overflow: visible;
}
.mwat .account-table,
.mwat .account-table-wrap > table,
.mwat .mwat-recent-analyses table.account-table {
    display: table !important;
    table-layout: fixed !important;
    width: 100% !important;
    min-width: 100% !important;
    max-width: 100% !important;
}
.mwat .mwat-cell-url {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: var(--color-text-body, #334155);
}
.mwat .account-table .text-right {
    text-align: right;
}
.mwat .account-table tbody tr {
    transition: background-color 0.15s ease;
}
.mwat .account-table tbody tr:hover {
    background: rgba(27, 55, 64, 0.03);
}

/* Status-Badges in der Studio: failed + queued + ergänzungen */
.mwat .status-badge--failed {
    background: rgba(220, 38, 38, 0.12);
    color: #B91C1C;
}
.mwat .status-badge--pending {
    background: rgba(217, 119, 6, 0.12);
    color: #B45309;
}

/* Recent-Analyses-Wrapper: Card-Shadow, zur Stat-Card-Ästhetik passend */
.mwat .mwat-recent-analyses {
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
    border-color: var(--color-border, #E2E8F0);
}

/* ════════════════════════════════════════════════════════
   MWAT-LIST — CSS Grid statt Table, immun gegen Theme-CSS
   ════════════════════════════════════════════════════════ */
.mwat-list {
    background: var(--color-bg, #FFFFFF);
    border: 1px solid var(--color-border, #E2E8F0);
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
    margin-bottom: 16px;
}
.mwat-list__head,
.mwat-list__row {
    display: grid;
    grid-template-columns: 140px 1fr 140px 130px;
    align-items: center;
    gap: 16px;
    padding: 14px 20px;
}
.mwat-list__head {
    background: var(--color-surface-muted, #F1F5F9);
    font-size: 0.72rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--color-text-muted, #64748B);
    border-bottom: 1px solid var(--color-border, #E2E8F0);
}
.mwat-list__row {
    border-top: 1px solid var(--color-border, #E2E8F0);
    font-size: 0.9rem;
    color: var(--color-text-body, #334155);
    transition: background-color 0.15s ease;
}
.mwat-list__row:first-child {
    border-top: none;
}
.mwat-list__row:hover {
    background: rgba(27, 55, 64, 0.03);
}
.mwat-list .mwat-cell-url {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    min-width: 0;
}
@media (max-width: 768px) {
    .mwat-list__head { display: none; }
    .mwat-list__row {
        grid-template-columns: 1fr;
        gap: 6px;
        padding: 16px 20px;
    }
}

/* ════════════════════════════════════════════════════════
   FIX: Theme-Override `table { display: block }`
   In main.min.css gibt es eine globale Regel die alle Tabellen
   auf display:block zwingt — das bricht jedes Table-Layout.
   Hier brachial für alle Studio-Tabellen rückgängig machen.
   ════════════════════════════════════════════════════════ */
.mwat table,
.mwat .account-table,
.mwat .account-table-wrap > table {
    display: table !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow: visible !important;
    table-layout: auto;
    border-collapse: collapse;
}
.mwat thead { display: table-header-group !important; }
.mwat tbody { display: table-row-group !important; }
.mwat tr    { display: table-row !important; }
.mwat th, .mwat td { display: table-cell !important; }

/* Tabellen die wir explizit auf fixed Layout wollen (Dashboard-Recent etc.) */
.mwat .account-table.is-fixed,
.mwat .mwat-fixed-table {
    table-layout: fixed !important;
}