/* Shared channel components are scoped to the customer promotion workspace. */
@scope (.promotion-surface, #channel-dialog) {
.cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:17px;margin-bottom:22px}
.stat{border:1px solid var(--line);border-radius:10px;background:white;padding:21px;box-shadow:var(--shadow)}
.stat-icon{background:#e7f6f3;color:#008f80;width:34px;height:34px;display:grid;place-items:center;border-radius:8px;font-size:19px;margin-bottom:15px}
.stat:nth-child(2) .stat-icon{color:#6b64b9;background:#f0eefb}
.stat:nth-child(3) .stat-icon{color:#4a7fba;background:#edf4fc}
.stat:nth-child(4) .stat-icon{color:#bd7056;background:#fff1e9}
.stat-label{color:#65758a;font-size:12px}
.stat-value{font-size:30px;font-weight:700;line-height:1.2;margin-top:9px;color:#18304b}
.panel{background:#fff;border:1px solid var(--line);border-radius:10px;box-shadow:var(--shadow);min-width:0;overflow:hidden}
.panel-head{padding:19px 21px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;gap:10px}
.panel-body{padding:21px}
.panel-body p:first-child{margin-top:0}
.table-wrap{overflow-x:auto;max-width:100%;min-height:180px}
table{width:100%;border-collapse:collapse;text-align:left;font-size:12px;white-space:nowrap}
th{font-size:11px;font-weight:600;color:#667b91;background:#f7f9fc;padding:13px 19px;border-bottom:1px solid var(--line)}
td{padding:16px 19px;border-bottom:1px solid #edf1f6;color:#344860}
tbody tr:hover{background:#fbfdff}
tbody tr:last-child td{border-bottom:0}
.badge{display:inline-flex;align-items:center;gap:5px;border-radius:4px;padding:4px 7px;font-size:10px;line-height:1.1;background:#edf1f6;color:#5c7187}
.badge.good{background:#e5f5ec;color:#248457}
.badge.wait{background:#fff0d8;color:#ad742b}
.badge.bad{background:#fce9ed;color:#b24d5e}
.badge.info{background:#e8f2ff;color:#3a79ba}
.table-foot{border-top:1px solid var(--line);padding:14px 20px;font-size:11px;color:var(--muted);display:flex;justify-content:space-between;align-items:center}
.pagination{display:flex;gap:8px;align-items:center}
.pagination button{min-height:30px;padding:4px 8px}
.empty{min-height:250px;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:35px 22px;text-align:center;color:#8493a5}
.empty-icon{width:48px;height:48px;border-radius:12px;background:#f1f5f9;display:grid;place-items:center;color:#9bafc1;font-size:26px;margin-bottom:15px}
.empty strong{font-size:13px;color:#60758b;font-weight:500}
.empty p{font-size:12px;max-width:400px;line-height:1.7;margin:9px 0 15px}
:scope.dialog{position:fixed;inset:0;z-index:100;display:flex;justify-content:flex-end;background:#081d3459;backdrop-filter:blur(2px)}
.dialog-panel{width:540px;max-width:100%;height:100dvh;background:#fff;box-shadow:-10px 0 35px #12243b20;display:flex;flex-direction:column}
.dialog-panel.small{width:460px}
.dialog-head{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:20px 25px;border-bottom:1px solid var(--line);flex-shrink:0}
.dialog-body{padding:23px 25px;overflow-y:auto;flex:1;min-height:0}
.dialog-footer{display:flex;gap:10px;justify-content:flex-end;padding:17px 25px;border-top:1px solid var(--line);background:#fbfcfe;flex-shrink:0}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:17px 15px}
.field{min-width:0;display:flex;flex-direction:column;gap:7px}
.field.full{grid-column:1/-1}
.field label{font-size:12px;color:#344f68;font-weight:500}
input,select,textarea{width:100%;border:1px solid #ccd8e5;background:#fff;color:#263d55;border-radius:6px;padding:9px 11px;min-height:39px;font-size:12px}
textarea{resize:vertical;min-height:80px;line-height:1.6}
.field small{font-size:10px;color:#8593a3;line-height:1.7}
.field input[type=checkbox]{width:16px;min-height:16px;margin:0;accent-color:var(--teal)}
.form-error{background:#fff0f2;color:#ae4252;border:1px solid #f2d6dc;border-radius:6px;padding:10px 12px;font-size:12px;line-height:1.6;margin-bottom:16px}
.detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:17px;margin-bottom:22px}
.detail-card{border:1px solid var(--line);border-radius:8px;padding:17px;min-width:0}
.detail-row{display:flex;justify-content:space-between;gap:18px;border-bottom:1px solid #edf1f5;padding:11px 0;font-size:12px;line-height:1.6;overflow-wrap:anywhere}
.detail-row:last-child{border:0}
.detail-row dt{color:#8090a2;flex-shrink:0;max-width:50%}
.detail-row dd{margin:0;text-align:right;color:#29425e;white-space:pre-wrap}
.detail-row.long{display:block}
.detail-row.long dd{text-align:left;margin-top:8px}
.detail-row.long dt{max-width:none}
.pre{white-space:pre-wrap;overflow-wrap:anywhere;background:#f6f8fb;padding:13px;border-radius:5px;font-size:11px;color:#5b7187;line-height:1.8}
.login-card .field{margin-bottom:20px}
.muted{color:#8393a5}
.monospace{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:11px}
.wrap{white-space:normal;overflow-wrap:anywhere}
.row-actions{display:flex;gap:4px}
.text-value{white-space:pre-wrap;overflow-wrap:anywhere}
.hint{font-size:11px;line-height:1.8;color:#7a8b9d;margin-top:13px}
.split-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:25px 0 13px}
.no-margin{margin:0}
.field.full,.section-label{grid-column:auto}
.dialog-head,.dialog-footer{padding-left:17px;padding-right:17px}
.field-disabled>input,.field-disabled>select,.field-disabled>textarea{background:#f0f3f7;border-color:#e0e6ed;color:#91a0b1;cursor:not-allowed}
.field-disabled>.help-label{color:#8a99aa}
.field-disabled .required{display:none}
.settings-tabs~[role="tabpanel"] .panel{margin-bottom:20px}
.settings-tabs~[role="tabpanel"] .field>span{display:block;margin-bottom:8px;font-weight:600}
.settings-tabs~[role="tabpanel"] .form-error:empty{display:none}
.settings-tabs~[role="tabpanel"] .table-wrap{min-height:0}
/* Channel management shares the operations console components. */
.channel-tabs{display:flex;gap:8px;flex-wrap:wrap;margin:20px 0}
.channel-tabs [aria-current=page]{background:#102541;color:#fff}
#channel-content .stat-value{font-size:24px}
#channel-dialog .field input[type=checkbox]{width:20px;height:20px}
#channel-dialog .dialog-footer{margin-top:16px}
.channel-tabs button{flex:1 0 28%}
#channel-dialog .form-grid{grid-template-columns:1fr}
#channel-content .cards{grid-template-columns:1fr}
#channel-dialog .form-grid>*{min-width:0;overflow-wrap:anywhere}
#channel-dialog .form-grid>:not(.field){grid-column:1/-1}
.panel{margin-bottom:20px}.channel-tabs{display:flex;gap:8px;flex-wrap:wrap;margin:20px 0}.channel-tabs [aria-current="page"]{background:var(--pale);color:var(--teal)}
}
@media(max-width:767px){.promotion-surface .cards{grid-template-columns:repeat(2,minmax(0,1fr))}.promotion-surface .stat-value{font-size:22px}.promotion-surface .form-grid{grid-template-columns:1fr}}
/* Customer workspace: compact navigation, one functional page at a time. */
.promotion-surface{--line:#dfe7ef;--pale:#e9f6f3;--teal:#008f80}
.promotion-intro{margin-bottom:26px}.promotion-intro h1{font-size:26px;margin:0 0 10px}.promotion-intro p{font-size:13px;line-height:1.8;color:#718399;margin:0;max-width:900px}
.promotion-surface .page-heading{display:none}
.promotion-surface .channel-selector{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:16px 20px;margin-bottom:24px}
.promotion-surface .channel-selector-intro{display:flex;align-items:center;gap:12px}.promotion-surface .channel-selector-icon{display:grid;place-items:center;width:38px;height:38px;background:#e9f6f3;border-radius:10px;color:#008f80}
.promotion-surface .channel-selector-intro p{margin:4px 0 0;color:#8090a3;font-size:12px}.promotion-surface .channel-selector-control{width:min(440px,55%)}
.promotion-surface .promotion-groups{display:flex;gap:28px;border-bottom:1px solid #dfe7ef;margin-bottom:18px}.promotion-surface .promotion-groups button{background:transparent;border:0;border-bottom:3px solid transparent;border-radius:0;padding:12px 0;color:#788ba0;font-size:16px;font-weight:600;box-shadow:none}.promotion-surface .promotion-groups button[aria-pressed=true]{color:#008f80;border-bottom-color:#008f80}
.promotion-surface .channel-workspace-tabs{display:flex;flex-wrap:nowrap;overflow-x:auto;gap:8px;margin:0 0 20px;padding:0 0 4px}
.promotion-surface .channel-workspace-tabs button{flex:0 0 auto;min-height:40px;padding:8px 16px;border:0;border-radius:7px;background:transparent;white-space:nowrap;font-size:13px;box-shadow:none;color:#6d8198}
.promotion-surface .channel-workspace-tabs button[aria-current=page]{background:#e9f6f3;color:#008f80;font-weight:600}
.promotion-surface button:focus-visible{outline:2px solid #008f80;outline-offset:2px}
.promotion-surface .channel-metrics{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));padding:26px 20px;gap:18px}.promotion-surface .channel-metric{min-width:0;border-right:1px solid #e7edf3;padding-right:14px}.promotion-surface .channel-metric:last-child{border:0}.promotion-surface .channel-metric-value{font-size:clamp(20px,1.8vw,28px);font-weight:650;margin:12px 0 5px;overflow-wrap:anywhere;font-variant-numeric:tabular-nums}.promotion-surface .channel-metric small{font-size:11px;color:#8798a9}
.promotion-surface .panel-head h2{font-size:17px;margin:0}.promotion-surface .panel-head p{font-size:12px;margin:8px 0 0}.promotion-surface .permission-badge{font-size:12px;background:#e9f6f3;color:#168577;padding:5px 9px;border-radius:5px}
.promotion-surface .channel-settlement-note{display:flex;gap:12px;padding:18px 20px;background:#f8fafc;border-top:1px solid #e7edf3;font-size:12px;color:#7a8b9e}.promotion-surface .channel-settlement-note p{margin:6px 0;line-height:1.7}
.promotion-surface .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(max-width:1000px){.promotion-surface .channel-metrics{grid-template-columns:repeat(3,minmax(0,1fr))}.promotion-surface .channel-metric{border:0}}
@media(max-width:640px){.promotion-surface .channel-selector{flex-direction:column;align-items:stretch;gap:14px;padding:16px}.promotion-surface .channel-selector-control{width:100%}.promotion-surface .channel-metrics{grid-template-columns:repeat(2,minmax(0,1fr));padding:20px 16px}.promotion-surface .panel-head{flex-wrap:wrap}.promotion-intro h1{font-size:23px}}