/*
 * Thewiworks web interface system.
 * Loaded last on authenticated and public surfaces so legacy utility classes
 * cannot reintroduce unreadable type, cramped controls, or broken wrapping.
 */
:root {
    --tww-ui-font: "Segoe UI Variable Text", "Aptos", "Inter", "SF Pro Text", "Roboto", "Helvetica Neue", Arial, sans-serif;
    --tww-ui-font-mono: "Cascadia Code", "SFMono-Regular", Consolas, monospace;
    --tww-ui-text-xs: .78rem;
    --tww-ui-text-sm: .875rem;
    --tww-ui-text-md: .95rem;
    --tww-ui-text-lg: 1.125rem;
    --tww-ui-text-xl: clamp(1.45rem, 1.15rem + .8vw, 2rem);
    --tww-ui-line: 1.5;
    --tww-ui-radius-sm: .625rem;
    --tww-ui-radius-md: .875rem;
    --tww-ui-radius-lg: 1.125rem;
    --tww-ui-control-height: 2.75rem;
    --tww-ui-focus: 0 0 0 3px color-mix(in srgb, var(--color-primary, var(--tww-primary, #4f46e5)) 24%, transparent);
}

html { text-size-adjust: 100%; }
body,
body[data-tww-interface-contract],
body[data-tww-public-ui-contract] {
    font-family: var(--tww-font-family, var(--tww-ui-font));
    font-size: var(--font-size-base, 15px);
    font-weight: 400;
    line-height: var(--tww-ui-line);
    letter-spacing: 0;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    overflow-wrap: anywhere;
}

:where(button, input, select, textarea, optgroup, option) { font: inherit; }
:where(h1, h2, h3, h4, h5, h6) {
    font-family: inherit;
    font-weight: 700;
    letter-spacing: -.025em;
    line-height: 1.22;
    text-transform: none;
    text-wrap: balance;
    overflow-wrap: anywhere;
}
:where(p, li, dd, dt, td, th, label, a, button, span) { overflow-wrap: anywhere; }
:where(strong, b) { font-weight: 650; }

/* Normalize legacy ultra-heavy and tiny utility typography everywhere. */
:where(.font-black, .font-extrabold) { font-weight: 700 !important; }
:where(.font-bold, .font-semibold) { font-weight: 600 !important; }
:where(.font-medium) { font-weight: 500 !important; }
:where(.text-\[8px\], .text-\[9px\], .text-\[10px\], .text-\[11px\], .text-xs) {
    font-size: var(--tww-ui-text-xs) !important;
    line-height: 1.4 !important;
}
:where(.tracking-wide, .tracking-wider, .tracking-widest, .tracking-\[0\.1em\], .tracking-\[0\.12em\], .tracking-\[0\.14em\], .tracking-\[0\.16em\], .tracking-\[0\.2em\], .tracking-\[0\.22em\], .tracking-\[0\.25em\], .tracking-\[0\.28em\], .tracking-\[0\.3em\]) {
    letter-spacing: .025em !important;
}
:where(.uppercase):not(.tww-kicker):not(.tww-eyebrow):not(.tww-smallcaps) { text-transform: none !important; }

/* Shared hierarchy. */
:where(.tww-page-title, .tww-form-shell-title, .tww-show-title) {
    font-size: var(--tww-ui-text-xl) !important;
    font-weight: 700 !important;
    line-height: 1.18 !important;
    letter-spacing: -.025em !important;
    text-transform: none !important;
}
:where(.tww-section-title, .tww-card-title, .tww-detail-card-title, .tww-detail-title) {
    font-size: var(--tww-ui-text-lg) !important;
    font-weight: 650 !important;
    line-height: 1.3 !important;
    letter-spacing: -.012em !important;
    text-transform: none !important;
}
:where(.tww-page-subtitle, .tww-form-shell-description, .tww-show-description, .tww-muted, .tww-help, .tww-detail-card-subtitle) {
    font-size: var(--tww-ui-text-sm) !important;
    font-weight: 400 !important;
    line-height: 1.55 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
}
:where(.tww-kicker, .tww-eyebrow, .tww-smallcaps) {
    font-size: var(--tww-ui-text-xs) !important;
    font-weight: 650 !important;
    line-height: 1.35 !important;
    letter-spacing: .07em !important;
    text-transform: uppercase !important;
}

/* Forms and controls. */
:where(.tww-label, .tww-form-label, .tww-detail-field-label) {
    display: block;
    margin-bottom: .4rem;
    color: var(--color-text-secondary, #475569);
    font-size: var(--tww-ui-text-sm) !important;
    font-weight: 600 !important;
    line-height: 1.35 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
}
:where(.tww-input, .tww-select, .tww-textarea, .tww-form-input, input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]), select, textarea) {
    min-height: var(--tww-ui-control-height);
    border-radius: var(--tww-ui-radius-sm);
    font-size: var(--tww-ui-text-md) !important;
    font-weight: 400 !important;
    line-height: 1.4;
}
textarea, .tww-textarea { min-height: 7rem; resize: vertical; }
:where(.tww-input, .tww-select, .tww-textarea, .tww-form-input, input, select, textarea):focus-visible {
    outline: 2px solid transparent;
    box-shadow: var(--tww-ui-focus) !important;
}
:where([aria-invalid="true"], .is-invalid) { border-color: #dc2626 !important; }
:where(.tww-error, .tww-form-error) {
    margin-top: .4rem;
    color: #b91c1c;
    font-size: var(--tww-ui-text-xs) !important;
    font-weight: 500 !important;
    line-height: 1.4;
}
.tww-required-mark { color: #dc2626; font-weight: 700; }
.tww-required-text { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }

/* Responsive multi-column forms when space permits. */
:where(.tww-form-grid, [data-tww-form-grid]:not([data-tww-form-grid="stacked"]), .tww-filter-grid) {
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    gap: clamp(.75rem, 1.4vw, 1rem);
    align-items: start;
}
:where(.tww-form-grid, [data-tww-form-grid]) > * { grid-column: span 12; min-width: 0; }
@media (min-width: 700px) {
    :where(.tww-form-grid, [data-tww-form-grid]) > * { grid-column: span 6; }
    :where(.tww-form-grid, [data-tww-form-grid]) > .tww-field-full,
    :where(.tww-form-grid, [data-tww-form-grid]) > [data-tww-field-span="full"] { grid-column: 1 / -1; }
}
@media (min-width: 1180px) {
    :where(.tww-form-grid, [data-tww-form-grid="compact"]) > * { grid-column: span 4; }
    :where(.tww-form-grid, [data-tww-form-grid]) > .tww-field-half { grid-column: span 6; }
    :where(.tww-form-grid, [data-tww-form-grid]) > .tww-field-third { grid-column: span 4; }
}

/* Actions and tabs must not look the same. */
:where(.tww-btn, .tww-action-primary, .tww-action-secondary, .tww-action-danger, .tww-show-action, button[class*="tww-action-"]) {
    min-height: 2.5rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .5rem;
    border-radius: var(--tww-ui-radius-sm) !important;
    padding: .625rem .9rem !important;
    font-size: var(--tww-ui-text-sm) !important;
    font-weight: 600 !important;
    line-height: 1.2 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
    white-space: normal;
    text-align: center;
}
:where(.tww-tabs, [role="tablist"], .tww-show-tabs) {
    display: flex;
    gap: .25rem;
    align-items: end;
    overflow-x: auto;
    border-bottom: 1px solid var(--color-border, #d8e2ee);
    scrollbar-width: thin;
}
:where(.tww-tab, [role="tab"], .tww-show-tab) {
    min-height: 2.5rem;
    border: 1px solid transparent;
    border-bottom: 0;
    border-radius: .75rem .75rem 0 0;
    padding: .625rem .85rem;
    color: var(--color-text-secondary, #475569);
    font-size: var(--tww-ui-text-sm) !important;
    font-weight: 550 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
    white-space: nowrap;
}
:where(.tww-tab.is-active, [role="tab"][aria-selected="true"], .tww-show-tab.is-active) {
    border-color: var(--color-border, #d8e2ee);
    background: var(--color-surface, #fff);
    color: var(--color-primary, #2563eb);
    font-weight: 650 !important;
}

/* Cards, panels, modals and data. */
:where(.tww-form-card, .tww-detail-card, .tww-filter-card, .tww-index-body, .tww-show-panel, .tww-modal-card) {
    border-radius: var(--tww-ui-radius-lg) !important;
}
:where(.tww-page-actions, .tww-show-actions, .tww-form-shell-actions, .tww-detail-card-actions, .tww-form-actions) {
    display: flex;
    flex-wrap: wrap;
    gap: .625rem;
    align-items: center;
}
:where(.tww-table, table) { width: 100%; border-collapse: separate; border-spacing: 0; }
:where(.tww-table th, table th) {
    padding: .75rem .875rem;
    font-size: var(--tww-ui-text-xs) !important;
    font-weight: 650 !important;
    line-height: 1.35 !important;
    letter-spacing: .025em !important;
    text-transform: none !important;
    vertical-align: bottom;
    white-space: normal;
}
:where(.tww-table td, table td) {
    padding: .8rem .875rem;
    font-size: var(--tww-ui-text-sm) !important;
    font-weight: 400 !important;
    line-height: 1.45;
    vertical-align: top;
    white-space: normal;
}
:where(.tww-row-title, .tww-table strong) { font-weight: 600 !important; }
:where(.tww-status-pill, .tww-badge, .badge, .tww-relation-pill, .tww-count-pill) {
    max-width: 100%;
    font-size: var(--tww-ui-text-xs) !important;
    font-weight: 600 !important;
    line-height: 1.3 !important;
    letter-spacing: .02em !important;
    text-transform: none !important;
    white-space: normal !important;
}
[data-tww-table-region] { overflow-x: auto; overscroll-behavior-inline: contain; }
[data-tww-table-region]:focus-visible { outline: 2px solid var(--color-primary, #2563eb); outline-offset: 2px; }

/* Public and authentication surfaces. */
body[data-tww-public-ui-contract] .tww-public-nav,
body[data-tww-public-ui-contract] .tww-nav-inner { font-family: var(--tww-ui-font); }
body[data-tww-public-ui-contract] :where(.tww-menu a, .tww-nav-link, .tww-footer a) {
    font-size: var(--tww-ui-text-sm) !important;
    font-weight: 600 !important;
    letter-spacing: .025em !important;
    text-transform: none !important;
}
.tww-auth-readable { min-height: 100svh; padding: clamp(6.5rem, 10vw, 8rem) 1rem 2rem; }
.tww-auth-readable .tww-auth-grid {
    width: min(1160px, 100%);
    grid-template-columns: minmax(0, 1.1fr) minmax(350px, .78fr);
    gap: clamp(2rem, 5vw, 5rem);
    align-items: center;
}
.tww-auth-readable .tww-auth-copy { min-width: 0; }
.tww-auth-readable .tww-auth-copy h1 {
    max-width: 13ch;
    margin: 1.1rem 0 0;
    font-size: clamp(2.35rem, 4vw, 4rem) !important;
    line-height: 1.03 !important;
    letter-spacing: -.045em !important;
    text-transform: none !important;
}
.tww-auth-readable .tww-auth-copy > p { max-width: 56ch; font-size: 1rem !important; font-weight: 400 !important; }
.tww-auth-readable .tww-auth-features { grid-template-columns: repeat(2, minmax(0,1fr)); gap: .75rem; }
.tww-auth-readable .tww-auth-card { min-width: 0; padding: 1rem; }
.tww-auth-readable .tww-auth-card .tww-smallcaps { display: block; white-space: normal; }
.tww-auth-readable .tww-login-card { width: min(440px, 100%); border-radius: 1.25rem; padding: .75rem; }
.tww-auth-readable .tww-login-inner { border-radius: 1rem; padding: clamp(1.25rem, 3vw, 2rem); }
.tww-auth-readable .tww-login-inner h2 { font-size: clamp(1.65rem, 3vw, 2.1rem) !important; line-height: 1.2 !important; }
.tww-auth-readable .tww-smallcaps,
.tww-auth-readable .tww-label,
.tww-auth-readable .tww-check,
.tww-auth-readable .tww-recovery,
.tww-auth-readable .tww-register-box { letter-spacing: 0 !important; text-transform: none !important; }
.tww-auth-readable .tww-auth-card-label { margin-top: .7rem; color: #334155; font-size: var(--tww-ui-text-sm); font-weight: 600; line-height: 1.35; }
.tww-auth-readable .tww-auth-form { margin-top: 1.25rem; }
.tww-auth-readable .tww-field-row { align-items: flex-start; flex-wrap: wrap; }

@media (max-width: 900px) {
    .tww-auth-readable .tww-auth-grid { grid-template-columns: 1fr; max-width: 560px; }
    .tww-auth-readable .tww-auth-copy { display: block; }
    .tww-auth-readable .tww-auth-copy h1 { max-width: 100%; font-size: clamp(2rem, 8vw, 3.1rem) !important; }
}
@media (max-width: 640px) {
    .tww-auth-readable { padding-top: 5.75rem; }
    .tww-auth-readable .tww-auth-copy { display: none; }
    .tww-auth-readable .tww-login-card { width: 100%; }
    :where(.tww-page-actions, .tww-show-actions, .tww-form-shell-actions, .tww-form-actions) > * { flex: 1 1 100%; }
    :where(.tww-table th, table th, .tww-table td, table td) { padding-inline: .7rem; }
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}

/* Public-navigation and filter-layout integrity contract. */
.tww-bug-index {
    width: 100% !important;
    max-width: none !important;
}

form.tww-bug-filter-grid[data-tww-filter-layout="bug-reports"] {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    align-items: end !important;
    gap: .875rem !important;
    width: 100% !important;
}

form.tww-bug-filter-grid[data-tww-filter-layout="bug-reports"] > * {
    grid-column: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    width: 100% !important;
}

form.tww-bug-filter-grid[data-tww-filter-layout="bug-reports"] :where(.tww-field, .tww-field > span) {
    min-width: 0;
}

form.tww-bug-filter-grid[data-tww-filter-layout="bug-reports"] :where(.tww-input, .tww-select) {
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
}

form.tww-bug-filter-grid[data-tww-filter-layout="bug-reports"] .tww-bug-filter-actions {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .625rem !important;
    align-self: end;
}

form.tww-bug-filter-grid[data-tww-filter-layout="bug-reports"] .tww-bug-filter-actions > * {
    width: 100%;
    min-width: 0;
}

@media (min-width: 700px) {
    form.tww-bug-filter-grid[data-tww-filter-layout="bug-reports"] {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    form.tww-bug-filter-grid[data-tww-filter-layout="bug-reports"] > [data-tww-filter-span="wide"],
    form.tww-bug-filter-grid[data-tww-filter-layout="bug-reports"] > [data-tww-filter-span="actions"] {
        grid-column: span 2 !important;
    }
}

@media (min-width: 1180px) {
    form.tww-bug-filter-grid[data-tww-filter-layout="bug-reports"] {
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    }

    form.tww-bug-filter-grid[data-tww-filter-layout="bug-reports"] > [data-tww-filter-span="wide"],
    form.tww-bug-filter-grid[data-tww-filter-layout="bug-reports"] > [data-tww-filter-span="actions"] {
        grid-column: span 2 !important;
    }
}

@media (min-width: 1600px) {
    form.tww-bug-filter-grid[data-tww-filter-layout="bug-reports"] {
        grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
    }
}

/* Keep generic filter surfaces compact without overriding explicit page grids. */
:where(.tww-filter-card, [data-tww-index-filters="true"]) :where(.tww-field, label) > :where(span, .tww-label):first-child {
    display: block;
    margin-bottom: .4rem;
    color: var(--color-text-secondary, #475569);
    font-size: var(--tww-ui-text-xs) !important;
    font-weight: 600 !important;
    line-height: 1.35;
    letter-spacing: 0 !important;
    text-transform: none !important;
}

:where(.tww-filter-card, [data-tww-index-filters="true"]) :where(.tww-action-primary, .tww-action-secondary) {
    min-height: 2.75rem;
}

.tww-summary-card {
    min-width: 0;
    overflow: hidden;
}

.tww-summary-card :where(.tww-summary-card-label, .tww-summary-card-value) {
    overflow-wrap: anywhere;
}

/* Shared authoring controls: searchable selects, optional rich text, and native temporal pickers. */
.tww-help {
    margin: .35rem 0 0;
    color: var(--color-text-secondary, #64748b);
    font-size: .78rem;
    font-weight: 500;
    line-height: 1.45;
    overflow-wrap: anywhere;
}

.tww-temporal-input {
    min-width: 0;
    font-variant-numeric: tabular-nums;
}

@media (min-width: 64rem) {
    [data-tww-livewire-form="billing-invoice"] .tww-invoice-field-quarter {
        grid-column: span 3 / span 3 !important;
    }
}

@media (max-width: 63.999rem) {
    [data-tww-livewire-form="billing-invoice"] .tww-invoice-field-quarter {
        grid-column: span 6 / span 6 !important;
    }
}

@media (max-width: 47.999rem) {
    [data-tww-livewire-form="billing-invoice"] .tww-invoice-field-quarter {
        grid-column: 1 / -1 !important;
    }
}

.tww-session-recovery-banner {
    position: fixed;
    inset: auto 1rem 1rem auto;
    z-index: 10000;
    display: flex;
    width: min(34rem, calc(100vw - 2rem));
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    border: 1px solid color-mix(in srgb, #d97706 42%, transparent);
    border-radius: 1rem;
    background: #fff7ed;
    padding: 1rem;
    color: #7c2d12;
    box-shadow: 0 18px 45px rgba(15, 23, 42, .18);
}

.tww-session-recovery-copy {
    display: grid;
    min-width: 0;
    gap: .2rem;
}

.tww-session-recovery-copy strong {
    font-size: .95rem;
    font-weight: 700;
    line-height: 1.35;
}

.tww-session-recovery-copy span {
    font-size: .82rem;
    font-weight: 500;
    line-height: 1.5;
}

.tww-session-recovery-action {
    flex: 0 0 auto;
    min-height: 2.5rem;
    border: 0;
    border-radius: .75rem;
    background: #9a3412;
    padding: .65rem .9rem;
    color: #fff;
    font: inherit;
    font-size: .82rem;
    font-weight: 700;
    cursor: pointer;
}

.tww-session-recovery-action:focus-visible {
    outline: 3px solid color-mix(in srgb, #ea580c 35%, transparent);
    outline-offset: 2px;
}

@media (max-width: 40rem) {
    .tww-session-recovery-banner {
        inset: auto 1rem 1rem;
        flex-direction: column;
        align-items: stretch;
    }

    .tww-session-recovery-action {
        width: 100%;
    }
}

.tww-portable-select {
    position: relative;
    width: 100%;
    min-width: 0;
}

.tww-portable-select-trigger {
    display: flex;
    width: 100%;
    min-height: 2.75rem;
    align-items: center;
    justify-content: space-between;
    border: 1px solid var(--color-border, #cbd5e1);
    border-radius: .85rem;
    background: var(--color-surface, #fff);
    padding: .7rem .85rem;
    color: var(--color-text-primary, #1e293b);
    font: inherit;
    font-size: .9rem;
    font-weight: 600;
    text-align: left;
    cursor: pointer;
}

.tww-portable-select-trigger::after {
    content: '⌄';
    margin-left: .75rem;
    color: var(--color-text-secondary, #64748b);
}

.tww-portable-select-trigger:focus-visible {
    outline: 3px solid color-mix(in srgb, var(--color-primary, #2563eb) 24%, transparent);
    outline-offset: 2px;
}

.tww-portable-select-value {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.tww-portable-select-panel {
    position: absolute;
    z-index: 1200;
    top: calc(100% + .35rem);
    left: 0;
    width: 100%;
    border: 1px solid var(--color-border, #cbd5e1);
    border-radius: .9rem;
    background: var(--color-surface, #fff);
    padding: .5rem;
    box-shadow: 0 18px 45px rgba(15, 23, 42, .16);
}

.tww-portable-select-search {
    width: 100%;
    min-height: 2.6rem;
    border: 1px solid var(--color-border, #cbd5e1);
    border-radius: .7rem;
    padding: .6rem .75rem;
    font: inherit;
}

.tww-portable-select-options {
    display: grid;
    max-height: 17rem;
    gap: .2rem;
    margin-top: .4rem;
    overflow-y: auto;
}

.tww-portable-select-option {
    width: 100%;
    border: 0;
    border-radius: .65rem;
    background: transparent;
    padding: .65rem .75rem;
    color: inherit;
    font: inherit;
    font-size: .86rem;
    font-weight: 550;
    text-align: left;
    cursor: pointer;
}

.tww-portable-select-option:hover,
.tww-portable-select-option:focus-visible,
.tww-portable-select-option[aria-selected="true"] {
    background: color-mix(in srgb, var(--color-primary, #2563eb) 10%, transparent);
    outline: none;
}

.tww-portable-select-pills {
    display: flex;
    flex-wrap: wrap;
    gap: .35rem;
    margin-top: .45rem;
}

.tww-portable-select-pill {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    border-radius: 999px;
    background: color-mix(in srgb, var(--color-primary, #2563eb) 12%, transparent);
    padding: .3rem .55rem;
    color: var(--color-primary, #1d4ed8);
    font-size: .75rem;
    font-weight: 650;
}

.tww-portable-select-pill button {
    border: 0;
    background: transparent;
    color: inherit;
    font: inherit;
    cursor: pointer;
}

.tww-portable-select-empty {
    margin: 0;
    padding: .75rem;
    color: var(--color-text-secondary, #64748b);
    font-size: .82rem;
    text-align: center;
}

.tww-public-body .tww-richtext-shell {
    overflow: hidden;
    border: 1px solid rgba(148, 163, 184, .45);
    border-radius: .9rem;
    background: rgba(255, 255, 255, .96);
}

.tww-public-body .tww-richtext-toolbar {
    display: flex;
    flex-wrap: wrap;
    gap: .3rem;
    border-bottom: 1px solid rgba(148, 163, 184, .35);
    padding: .45rem;
}

.tww-public-body .tww-richtext-toolbar-button {
    min-width: 2rem;
    min-height: 2rem;
    border: 0;
    border-radius: .55rem;
    background: #eef2ff;
    color: #3730a3;
    font: inherit;
    font-size: .78rem;
    font-weight: 700;
    cursor: pointer;
}

.tww-public-body .tww-richtext-shell > textarea.tww-richtext-source {
    width: 100%;
    min-height: 8rem;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    padding: .8rem !important;
    color: #172033 !important;
    outline: none;
}

.tww-public-body .tww-richtext-preview {
    padding: .8rem;
    color: #172033;
}

/* Web CRUD accessibility and layout integrity */
:where(.tww-admin-body, .tww-public-body) :where(.tww-field, [data-tww-field], .form-group) {
    min-width: 0;
}

:where(.tww-admin-body, .tww-public-body) :where(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]), select, textarea) {
    max-width: 100%;
}

:where(.tww-admin-body, .tww-public-body) .tww-validation-summary {
    display: grid;
    gap: .45rem;
    margin: 0 0 1rem;
    border: 1px solid color-mix(in srgb, #dc2626 36%, transparent);
    border-left-width: .3rem;
    border-radius: .9rem;
    background: color-mix(in srgb, #fef2f2 92%, transparent);
    padding: .9rem 1rem;
    color: #991b1b;
}

:where(.tww-admin-body, .tww-public-body) .tww-validation-summary-title {
    font-size: .94rem;
    font-weight: 700;
    line-height: 1.35;
}

:where(.tww-admin-body, .tww-public-body) .tww-validation-summary-help {
    margin: 0;
    font-size: .82rem;
    font-weight: 500;
    line-height: 1.5;
}

:where(.tww-admin-body, .tww-public-body) .tww-validation-summary-list {
    display: grid;
    gap: .3rem;
    margin: .2rem 0 0;
    padding-left: 1.15rem;
    font-size: .82rem;
    font-weight: 600;
}

:where(.tww-admin-body, .tww-public-body) .tww-validation-summary-list a {
    color: inherit;
    text-decoration: underline;
    text-underline-offset: .18em;
}

:where(.tww-admin-body, .tww-public-body) .tww-validation-summary:focus-visible {
    outline: 3px solid color-mix(in srgb, #dc2626 28%, transparent);
    outline-offset: 3px;
}

.tww-admin-content :where(.tww-form-grid, [data-tww-form-grid], .tww-filter-grid) {
    align-items: start;
    min-width: 0;
}

.tww-admin-content :where(.tww-form-grid, [data-tww-form-grid]) > :where(.tww-field, [data-tww-field], .form-group):not([class*="col-span"]):not([class*="tww-invoice-field-"]) {
    grid-column: 1 / -1;
}

@media (min-width: 48rem) {
    .tww-admin-content :where(.tww-form-grid, [data-tww-form-grid]) > :where(.tww-field, [data-tww-field], .form-group):not([class*="col-span"]):not([class*="tww-invoice-field-"]) {
        grid-column: span 6 / span 6;
    }
}

@media (min-width: 80rem) {
    .tww-admin-content :where(.tww-form-grid, [data-tww-form-grid]) > :where(.tww-field, [data-tww-field], .form-group):not([class*="col-span"]):not([class*="tww-invoice-field-"]) {
        grid-column: span 4 / span 4;
    }
}

.tww-admin-content :where(.tww-form-actions, [data-tww-form-actions]) {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: .65rem;
}

.tww-admin-content :where(.tww-form-actions, [data-tww-form-actions]) > :where(button, a) {
    min-height: 2.7rem;
}

.tww-table-wrap table :where(th, td) {
    vertical-align: top;
    overflow-wrap: anywhere;
}

.tww-table-wrap table th[aria-label="Actions"],
.tww-table-wrap table th[aria-label="Aksi"] {
    width: 1%;
    white-space: nowrap;
}

@media (max-width: 47.999rem) {
    .tww-admin-content :where(.tww-form-actions, [data-tww-form-actions]) > :where(button, a) {
        flex: 1 1 100%;
        justify-content: center;
        text-align: center;
    }
}