.act-save-template{background:linear-gradient(135deg,#2687ff,#0f6fe8)!important}

.act-scope-card{display:flex;justify-content:space-between;align-items:end;gap:22px;border:1px solid var(--admin-border);background:color-mix(in srgb,var(--admin-surface) 95%,transparent);border-radius:14px;padding:14px 18px;margin-bottom:16px}.act-scope-card label{min-width:430px;display:grid;gap:7px}.act-scope-card label>span{font-size:10px;text-transform:uppercase;font-weight:850;letter-spacing:.08em;color:var(--admin-text-muted)}.act-scope-card select,.act-form-grid input,.act-form-grid textarea,.act-color-field input{width:100%;border:1px solid var(--admin-border);background:var(--admin-input-bg,var(--admin-page-bg));color:var(--admin-text);border-radius:9px;padding:10px 12px;font:inherit}.act-scope-summary{display:flex;align-items:center;gap:12px}.act-scope-summary small{color:var(--admin-text-muted);font-size:11px}
.act-workspace{display:grid;grid-template-columns:minmax(430px,.78fr) minmax(670px,1.45fr);gap:16px;align-items:start}.act-editor-column{display:grid;gap:12px}.act-appearance-card,.act-settings-panel{border:1px solid var(--admin-border);border-radius:14px;background:color-mix(in srgb,var(--admin-surface) 96%,transparent);overflow:hidden}.act-appearance-card{padding:16px;border-left:3px solid #20d483}.act-card-heading{display:flex;gap:11px;align-items:flex-start}.act-card-heading>span,.act-settings-panel summary>span{width:38px;height:38px;border-radius:10px;background:linear-gradient(135deg,#2687ff,#1677ff);display:grid;place-items:center;color:white;flex:0 0 auto}.act-card-heading h2{font-size:16px;margin:1px 0 3px}.act-card-heading p{font-size:11px;color:var(--admin-text-muted);margin:0}.act-master-switch{margin-top:14px;border:1px solid var(--admin-border);border-radius:10px;padding:12px;display:flex;justify-content:space-between;align-items:center;gap:12px}.act-master-switch div{display:grid}.act-master-switch b{font-size:12px}.act-master-switch small{font-size:10px;color:var(--admin-text-muted)}.act-master-switch input,.act-block-switch input{appearance:none;width:38px;height:22px;background:#64748b;border-radius:999px;position:relative;cursor:pointer;flex:0 0 auto}.act-master-switch input:before,.act-block-switch input:before{content:"";position:absolute;width:16px;height:16px;left:3px;top:3px;background:#fff;border-radius:50%;transition:.18s}.act-master-switch input:checked,.act-block-switch input:checked{background:#1677ff}.act-master-switch input:checked:before,.act-block-switch input:checked:before{transform:translateX(16px)}.act-success-strip{margin-top:12px;border-radius:9px;padding:10px 12px;display:flex;gap:9px;align-items:center;background:rgba(32,212,131,.09);color:#42e69d;font-size:11px;font-weight:700}.act-success-strip .mud-icon-root{font-size:20px}
.act-settings-panel summary{list-style:none;cursor:pointer;padding:14px 16px;display:grid;grid-template-columns:38px 1fr 22px;align-items:center;gap:11px}.act-settings-panel summary::-webkit-details-marker{display:none}.act-settings-panel summary div{display:grid}.act-settings-panel summary b{font-size:14px}.act-settings-panel summary small{font-size:10px;color:var(--admin-text-muted)}.act-settings-panel summary>.mud-icon-root:last-child{font-size:20px;color:var(--admin-text-muted);transition:.18s}.act-settings-panel[open] summary>.mud-icon-root:last-child{transform:rotate(90deg)}.act-settings-panel[open] summary{border-bottom:1px solid var(--admin-border)}.act-panel-body{padding:14px 16px}.act-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.act-form-grid label,.act-color-field{font-size:11px;font-weight:700;display:grid;gap:6px;color:var(--admin-text-muted)}.act-form-grid .wide{grid-column:1/-1}.act-form-grid textarea{resize:vertical;min-height:72px}.act-color-input{display:grid;grid-template-columns:46px 1fr;gap:8px}.act-color-input input[type=color]{padding:4px}.act-coming-soon{font-size:11px;color:var(--admin-text-muted);line-height:1.5}.act-block-list{display:grid;gap:4px}.act-block-switch{display:grid;grid-template-columns:18px 1fr 40px;align-items:center;gap:9px;padding:8px 3px;border-radius:8px}.act-block-switch:hover{background:rgba(22,119,255,.05)}.act-block-switch>div{display:grid}.act-block-switch b{font-size:12px}.act-block-switch small{font-size:10px;color:var(--admin-text-muted)}.act-drag-handle{color:var(--admin-text-muted);font-size:11px;letter-spacing:-2px}.act-chip-row{display:flex;flex-wrap:wrap;gap:6px}.act-chip-row code{padding:6px 8px;border-radius:7px;background:rgba(22,119,255,.08);border:1px solid rgba(22,119,255,.25);color:#62adff;font-size:10px}
.act-preview-column{position:sticky;top:10px;min-width:0}.act-preview-head{display:flex;justify-content:space-between;align-items:flex-end;margin:0 2px 8px}.act-preview-head>div:first-child>span{font-size:10px;letter-spacing:.13em;font-weight:850;color:#62adff}.act-preview-head h2{margin:2px 0 0;font-size:17px}.act-preview-head h2 small{font-size:10px;font-weight:400;color:var(--admin-text-muted);margin-left:5px}.act-device-switch{display:flex;border:1px solid var(--admin-border);border-radius:10px;padding:3px;background:var(--admin-surface)}.act-device-switch button{min-width:84px;height:31px;padding:0 10px;border:0;background:transparent;border-radius:7px;color:var(--admin-text-muted);display:flex;align-items:center;justify-content:center;gap:6px;font-size:11px}.act-device-switch button .mud-icon-root{font-size:17px}.act-device-switch button.active{background:linear-gradient(135deg,#2687ff,#1677ff);color:white;box-shadow:0 5px 14px rgba(22,119,255,.28)}.act-preview-stage{background:linear-gradient(145deg,#17243a,#0d1729);border:1px solid var(--admin-border);border-radius:14px;padding:16px;min-height:690px;display:flex;align-items:flex-start;justify-content:center;overflow:auto;box-shadow:inset 0 1px rgba(255,255,255,.03)}.act-preview-stage.mobile>*{width:390px!important;max-width:390px!important}.act-preview-note{margin-top:8px;display:flex;gap:7px;color:var(--admin-text-muted);font-size:10px}.act-preview-note .mud-icon-root{font-size:16px;color:#1677ff}
.act-mail-window,.act-document,.act-portal{width:100%;background:white;color:#122033;border-radius:10px;box-shadow:0 16px 38px rgba(0,0,0,.28);overflow:hidden}.act-mail-toolbar{height:42px;background:#f2f5fa;display:flex;align-items:center;gap:42px;padding:0 16px;border-bottom:1px solid #dfe6ef;font-size:11px}.act-mail-toolbar span{flex:1;background:#e5ebf4;border-radius:16px;padding:7px 12px;color:#69768a}.act-mail-subject{padding:12px 16px 8px}.act-mail-subject h3{margin:0 0 3px;font-size:14px}.act-mail-subject small{color:#67758a;font-size:10px}.act-email-body{margin:0 16px 16px;border:1px solid #dfe6ef}.act-email-body>header{background:#061c35;color:white;display:flex;align-items:center;padding:12px 15px;gap:7px}.act-email-body>header b{font-size:18px}.act-email-body>header small{letter-spacing:.2em;font-size:6px}.act-email-body>header em{margin-left:auto;font-style:normal;font-size:8px}.act-email-hero{display:grid;grid-template-columns:.85fr 1.15fr;align-items:center;min-height:190px;padding:18px 20px;background:linear-gradient(110deg,#fff,#eef3f8)}.act-email-hero h2{font-size:21px;line-height:1.15;margin:0 0 8px}.act-email-hero p{font-size:11px;line-height:1.45;color:#56657a}.act-email-hero a,.act-document>button{display:inline-block;background:var(--act-accent);color:white;padding:9px 13px;border-radius:6px;font-weight:800;font-size:10px}.act-email-hero img,.act-doc-image img,.act-portal-model img{width:100%;max-height:220px;object-fit:contain}.act-product-placeholder{height:165px;border-radius:9px;background:linear-gradient(135deg,#dfe7ef,#f7f9fc);display:grid;place-items:center;align-content:center;color:#526174}.act-product-placeholder span{font-size:45px;font-weight:900;opacity:.18}.act-product-placeholder b{font-size:10px}.act-email-facts{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid #e3e9f0;border-bottom:1px solid #e3e9f0}.act-email-facts span{padding:10px 6px;text-align:center;font-size:9px}.act-email-facts b{display:block;color:#142237;margin-bottom:3px}.act-summary-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;padding:11px}.act-summary-card{border:1px solid #e0e7ef;border-radius:7px;padding:9px}.act-summary-card h4{margin:0 0 7px;color:var(--act-accent);font-size:9px}.act-summary-card div{display:flex;justify-content:space-between;gap:10px;font-size:9px;padding:4px 0;border-bottom:1px solid #edf1f5}.act-summary-card div.total{margin-top:4px;border:0;font-size:11px;color:var(--act-accent)}.act-email-body footer{background:#061c35;color:white;padding:11px 14px;display:grid;gap:2px;font-size:9px}.act-document{padding:19px}.act-document>header{display:flex;justify-content:space-between;border-bottom:3px solid var(--act-accent);padding-bottom:11px}.act-document>header div{display:grid}.act-document>header small{color:#738095}.act-document>header strong{font-size:18px}.act-doc-meta{display:flex;justify-content:space-between;padding:14px 0}.act-doc-meta div{display:grid;gap:3px}.act-doc-meta small{color:#738095}.act-doc-image{height:210px;display:grid;place-items:center;background:#f3f6fa;border-radius:8px}.act-doc-image .act-product-placeholder{width:100%}.act-doc-terms{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;padding:11px}.act-doc-terms span{background:#f4f7fb;border-radius:7px;padding:8px;font-size:9px}.act-doc-terms b{display:block}.act-document>button{border:0;float:right;margin:9px 11px 0}.act-portal>header{height:48px;background:#071d35;color:white;display:flex;align-items:center;padding:0 14px;gap:22px;font-size:10px}.act-portal>header nav{margin-left:auto}.act-portal>header button{border:0;background:var(--act-accent);color:white;border-radius:6px;padding:7px 11px}.act-portal-title{display:flex;justify-content:space-between;padding:17px}.act-portal-title h2{margin:2px 0}.act-portal-title>div{display:grid;gap:3px}.act-portal-grid{display:grid;grid-template-columns:1.35fr .65fr;gap:9px;padding:0 15px 15px}.act-portal-model{background:#f1f5f9;border-radius:8px;min-height:315px;display:grid;place-items:center}.act-portal-model .act-product-placeholder{width:80%}.act-portal-grid .act-summary-grid{grid-template-columns:1fr;padding:0}.act-portal-grid .act-summary-card{background:#fff}
@media(max-width:1280px){.act-workspace{grid-template-columns:minmax(390px,.82fr) minmax(560px,1.18fr)}.act-device-switch button{min-width:36px}.act-device-switch button span{display:none}.act-scope-card label{min-width:360px}}
@media(max-width:1100px){.act-workspace{grid-template-columns:1fr}.act-preview-column{position:static}.act-scope-card{align-items:flex-start;flex-direction:column}.act-scope-card label{min-width:0;width:100%}}

/* v819q — Templates shared design-system migration. Scoped to this page only. */
.admin-portal-shell.act-design-system {
    --act-page-gap: var(--ap-space-5, 20px);
    background: var(--ap-page-bg, var(--admin-bg));
    color: var(--ap-text-primary, var(--admin-text));
}


.admin-portal-shell.act-design-system .act-shared-page-header .ap-page-header__actions {
    align-items: center;
}

.admin-portal-shell.act-design-system .act-status-message {
    margin: 0 0 var(--act-page-gap);
    border-radius: var(--ap-radius-md, 12px);
}

.admin-portal-shell.act-design-system .act-shared-toolbar {
    margin-bottom: 14px;
    padding: 8px;
    border: 1px solid var(--ap-border, var(--admin-border));
    border-radius: var(--ap-radius-lg, 16px);
    background: var(--ap-surface, var(--admin-surface));
    box-shadow: var(--ap-shadow-sm, none);
}

.admin-portal-shell.act-design-system .act-shared-toolbar .ap-toolbar__start,
.admin-portal-shell.act-design-system .act-shared-toolbar .ap-toolbar__content {
    width: 100%;
}

.admin-portal-shell.act-design-system .act-shared-scope-card {
    margin-bottom: var(--act-page-gap);
    border-color: var(--ap-border, var(--admin-border));
    border-radius: var(--ap-radius-lg, 16px);
    background: var(--ap-surface, var(--admin-surface));
    box-shadow: var(--ap-shadow-sm, none);
}

.admin-portal-shell.act-design-system .act-shared-scope-card > .ap-card__body {
    padding: 14px 16px;
}

.admin-portal-shell.act-design-system .act-scope-layout {
    display: grid;
    grid-template-columns: minmax(320px, 480px) minmax(0, 1fr);
    gap: 20px;
    align-items: end;
}

.admin-portal-shell.act-design-system .act-scope-summary {
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    padding-bottom: 3px;
}

.admin-portal-shell.act-design-system .act-scope-summary small {
    min-width: 0;
    color: var(--ap-text-muted, var(--admin-text-muted));
    font-size: 12px;
    line-height: 1.4;
}

.admin-portal-shell.act-design-system .act-binding-badge {
    flex: 0 0 auto;
    max-width: min(100%, 300px);
}

.admin-portal-shell.act-design-system .act-binding-badge .ap-badge__label {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.admin-portal-shell.act-design-system .act-workspace {
    display: grid;
    grid-template-columns: minmax(390px, .78fr) minmax(600px, 1.22fr);
    gap: 18px;
    align-items: start;
}

.admin-portal-shell.act-design-system .act-editor-column {
    min-width: 0;
    display: grid;
    gap: 12px;
}

.admin-portal-shell.act-design-system .act-shared-card,
.admin-portal-shell.act-design-system .act-settings-panel,
.admin-portal-shell.act-design-system .act-preview-card {
    border: 1px solid var(--ap-border, var(--admin-border));
    border-radius: var(--ap-radius-lg, 16px);
    background: var(--ap-surface, var(--admin-surface));
    box-shadow: var(--ap-shadow-sm, none);
}

.admin-portal-shell.act-design-system .act-appearance-card {
    border-left: 3px solid var(--ap-success, #20c997);
}

.admin-portal-shell.act-design-system .act-appearance-card > .ap-card__header {
    padding-bottom: 0;
    border-bottom: 0;
}

.admin-portal-shell.act-design-system .act-card-heading > span,
.admin-portal-shell.act-design-system .act-settings-panel summary > span {
    background: var(--ap-primary-soft, rgba(22, 119, 255, .14));
    color: var(--ap-primary, #3d91ff);
    box-shadow: none;
}

.admin-portal-shell.act-design-system .act-card-heading h2,
.admin-portal-shell.act-design-system .act-settings-panel summary b,
.admin-portal-shell.act-design-system .act-preview-head h2 {
    color: var(--ap-text-primary, var(--admin-text));
}

.admin-portal-shell.act-design-system .act-card-heading p,
.admin-portal-shell.act-design-system .act-settings-panel summary small,
.admin-portal-shell.act-design-system .act-preview-head h2 small {
    color: var(--ap-text-muted, var(--admin-text-muted));
}

.admin-portal-shell.act-design-system .act-master-switch {
    border-color: var(--ap-border, var(--admin-border));
    border-radius: var(--ap-radius-md, 12px);
    background: var(--ap-surface-muted, transparent);
}

.admin-portal-shell.act-design-system .act-master-switch input,
.admin-portal-shell.act-design-system .act-block-switch input {
    background: var(--ap-control-disabled-bg, #64748b);
}

.admin-portal-shell.act-design-system .act-master-switch input:checked,
.admin-portal-shell.act-design-system .act-block-switch input:checked {
    background: var(--ap-primary, #1677ff);
}

.admin-portal-shell.act-design-system .act-success-strip {
    border: 1px solid color-mix(in srgb, var(--ap-success, #20c997) 25%, transparent);
    background: var(--ap-success-soft, rgba(32, 201, 151, .1));
    color: var(--ap-success, #20c997);
}

.admin-portal-shell.act-design-system .act-settings-panel {
    overflow: hidden;
}

.admin-portal-shell.act-design-system .act-settings-panel summary {
    min-height: 68px;
    padding: 14px 16px;
}

.admin-portal-shell.act-design-system .act-settings-panel summary:hover {
    background: var(--ap-surface-muted, transparent);
}

.admin-portal-shell.act-design-system .act-settings-panel[open] summary {
    border-bottom-color: var(--ap-divider, var(--admin-border));
}

.admin-portal-shell.act-design-system .act-panel-body {
    padding: 16px;
}

.admin-portal-shell.act-design-system .act-form-grid {
    gap: 14px;
}

.admin-portal-shell.act-design-system .act-form-grid label,
.admin-portal-shell.act-design-system .act-color-field {
    gap: 7px;
    color: var(--ap-text-secondary, var(--admin-text-muted));
    font-size: 12px;
    font-weight: 650;
}

.admin-portal-shell.act-design-system .act-form-grid input,
.admin-portal-shell.act-design-system .act-form-grid textarea,
.admin-portal-shell.act-design-system .act-color-input input:not([type="color"]) {
    width: 100%;
    min-height: var(--ap-control-height, 42px);
    padding: 9px 12px;
    border: 1px solid var(--ap-border, var(--admin-border));
    border-radius: var(--ap-radius-md, 12px);
    background: var(--ap-surface-raised, var(--admin-surface));
    color: var(--ap-text-primary, var(--admin-text));
    font: inherit;
    outline: none;
    transition: border-color var(--ap-transition-fast, 160ms), box-shadow var(--ap-transition-fast, 160ms), background var(--ap-transition-fast, 160ms);
}

.admin-portal-shell.act-design-system .act-form-grid input:hover,
.admin-portal-shell.act-design-system .act-form-grid textarea:hover,
.admin-portal-shell.act-design-system .act-color-input input:not([type="color"]):hover {
    border-color: var(--ap-border-strong, var(--admin-border));
}

.admin-portal-shell.act-design-system .act-form-grid input:focus,
.admin-portal-shell.act-design-system .act-form-grid textarea:focus,
.admin-portal-shell.act-design-system .act-color-input input:not([type="color"]):focus {
    border-color: var(--ap-primary, #1677ff);
    box-shadow: var(--ap-focus-ring, 0 0 0 3px rgba(22, 119, 255, .16));
}

.admin-portal-shell.act-design-system .act-form-grid textarea {
    min-height: 92px;
    resize: vertical;
}

.admin-portal-shell.act-design-system .act-color-input input[type="color"] {
    width: 46px;
    min-height: var(--ap-control-height, 42px);
    padding: 4px;
    border: 1px solid var(--ap-border, var(--admin-border));
    border-radius: var(--ap-radius-md, 12px);
    background: var(--ap-surface-raised, var(--admin-surface));
}

.admin-portal-shell.act-design-system .act-block-switch {
    min-height: 56px;
    padding: 9px 10px;
    border: 1px solid transparent;
    border-radius: var(--ap-radius-md, 12px);
}

.admin-portal-shell.act-design-system .act-block-switch:hover {
    border-color: var(--ap-border, var(--admin-border));
    background: var(--ap-surface-muted, transparent);
}

.admin-portal-shell.act-design-system .act-variable-badge {
    max-width: 100%;
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}

.admin-portal-shell.act-design-system .act-preview-column {
    position: sticky;
    top: 80px;
    min-width: 0;
}

.admin-portal-shell.act-design-system .act-preview-card {
    overflow: hidden;
}

.admin-portal-shell.act-design-system .act-preview-card > .ap-card__header {
    padding: 14px 16px;
    border-bottom: 1px solid var(--ap-divider, var(--admin-border));
}

.admin-portal-shell.act-design-system .act-preview-card > .ap-card__body {
    padding: 0;
}

.admin-portal-shell.act-design-system .act-preview-card > .ap-card__footer {
    padding: 11px 16px;
    border-top: 1px solid var(--ap-divider, var(--admin-border));
    background: var(--ap-surface-muted, transparent);
}

.admin-portal-shell.act-design-system .act-preview-head {
    width: 100%;
    margin: 0;
    align-items: center;
    gap: 14px;
}

.admin-portal-shell.act-design-system .act-preview-head > div:first-child > span {
    color: var(--ap-primary, #3d91ff);
}

.admin-portal-shell.act-design-system .act-device-switch {
    flex: 0 0 auto;
    border: 1px solid var(--ap-border, var(--admin-border));
    border-radius: var(--ap-radius-md, 12px);
    padding: 3px;
    background: var(--ap-surface-muted, transparent);
}

.admin-portal-shell.act-design-system .act-device-switch .ap-button {
    min-width: 88px;
    border: 0;
    box-shadow: none;
}

.admin-portal-shell.act-design-system .act-device-switch .ap-button.is-selected {
    background: var(--ap-primary, #1677ff);
    color: var(--ap-text-inverse, #fff);
}

.admin-portal-shell.act-design-system .act-preview-stage {
    min-height: 690px;
    padding: 20px;
    border: 0;
    border-radius: 0;
    background:
        radial-gradient(circle at 50% 16%, color-mix(in srgb, var(--ap-primary, #1677ff) 8%, transparent), transparent 42%),
        var(--ap-surface-muted, #eef3f8);
    box-shadow: none;
    scrollbar-gutter: stable;
}

.admin-portal-shell.act-design-system .act-preview-stage > * {
    max-width: 100%;
}

.admin-portal-shell.act-design-system .act-preview-stage.mobile > * {
    width: min(390px, 100%);
    max-width: 390px;
}

.admin-portal-shell.act-design-system .act-preview-note {
    margin: 0;
    align-items: center;
    color: var(--ap-text-muted, var(--admin-text-muted));
    font-size: 11px;
    line-height: 1.4;
}

.admin-portal-shell.act-design-system .act-preview-note .mud-icon-root {
    color: var(--ap-primary, #3d91ff);
}

@media (max-width: 1500px) {
    .admin-portal-shell.act-design-system .act-workspace {
        grid-template-columns: minmax(360px, .82fr) minmax(520px, 1.18fr);
    }

    }

@media (max-width: 1180px) {
    .admin-portal-shell.act-design-system .act-workspace {
        grid-template-columns: 1fr;
    }

    .admin-portal-shell.act-design-system .act-preview-column {
        position: static;
    }

    }

@media (max-width: 820px) {

    .admin-portal-shell.act-design-system .act-scope-layout {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .admin-portal-shell.act-design-system .act-scope-summary {
        justify-content: flex-start;
        align-items: flex-start;
        flex-wrap: wrap;
    }

    .admin-portal-shell.act-design-system .act-form-grid {
        grid-template-columns: 1fr;
    }

    .admin-portal-shell.act-design-system .act-form-grid .wide {
        grid-column: auto;
    }

    .admin-portal-shell.act-design-system .act-preview-head {
        align-items: flex-start;
        flex-direction: column;
    }
}

@media (max-width: 560px) {
    .admin-portal-shell.act-design-system .act-device-switch {
        width: 100%;
    }

    .admin-portal-shell.act-design-system .act-device-switch .ap-button {
        flex: 1 1 0;
        min-width: 0;
    }

    .admin-portal-shell.act-design-system .act-preview-stage {
        min-height: 520px;
        padding: 12px;
    }
}
