/* Thương mại điện tử services (scripts/ecom-atlas): look-alikes of the Shopee Seller Centre and app, the TikTok Shop
   Seller Center and app, Google Merchant Center, Analytics... drawn in CSS/SVG. Loaded after seo-atlas-lp.css and
   web-atlas-lp.css and uses their base (.sa, .sa-gc, .sa-chip, .sa-dot, sheets, browser/phone frames, .wa-ap windows).
   Own prefix: ea-. Sample data only ("Nhà Thơm (mẫu)"). */

/* ================= shared small parts: product picture, item row, buttons, step strip ================= */
.sa{
.ea-pic{display:inline-grid;place-items:center;flex:none;width:40px;height:40px;border-radius:4px;background:linear-gradient(160deg,#f7ead6,#ecd2a8);overflow:hidden;
& svg{width:62%;height:auto}
&.is-sm{width:32px;height:32px}
&.is-lg{width:56px;height:56px}
}
.ea-it{display:flex;align-items:center;gap:9px;min-width:0}
.ea-it-t{display:grid;gap:1px;flex:1;min-width:0;
& b{overflow:hidden;font-size:12.5px;font-weight:500;line-height:1.3;color:#262626;text-overflow:ellipsis;white-space:nowrap}
& em{overflow:hidden;font-size:11px;font-style:normal;color:#8c8c8c;text-overflow:ellipsis;white-space:nowrap}
}
.ea-it-q{flex:none;font-size:12px;color:#8c8c8c}
.ea-it-p{flex:none;font-size:12.5px;font-weight:500;color:#262626}
.ea-btn{display:inline-flex;align-items:center;justify-content:center;gap:5px;padding:5px 14px;border:1px solid #d0d0d0;border-radius:3px;background:#fff;font-size:12px;line-height:1.4;color:#333;white-space:nowrap;
&.is-p{border-color:var(--ap-acc,#1a73e8);background:var(--ap-acc,#1a73e8);color:#fff}
&.is-o{border-color:var(--ap-acc,#1a73e8);color:var(--ap-acc,#1a73e8)}
&.is-d{border-color:#e5e5e5;background:#f5f5f5;color:#b5b5b5}
.ico{width:12px;height:12px}
}
.ea-stp{display:flex;margin:0;padding:6px 4px 2px;list-style:none;
& li{position:relative;display:grid;flex:1;justify-items:center;gap:2px;min-width:0;text-align:center}
& li + li::before{content:"";position:absolute;top:11px;right:50%;width:100%;height:2px;background:#d9d9d9}
& li.is-done + li::before,& li.is-on::before{background:var(--ap-acc,#1a73e8)}
& li > i{position:relative;z-index:1;display:grid;place-items:center;width:22px;height:22px;border:2px solid #d9d9d9;border-radius:50%;background:#fff;color:#fff}
& li.is-done > i{border-color:var(--ap-acc,#1a73e8);background:var(--ap-acc,#1a73e8)}
& li.is-on > i{border-color:var(--ap-acc,#1a73e8);box-shadow:inset 0 0 0 4px #fff,inset 0 0 0 9px var(--ap-acc,#1a73e8)}
& li > i .ico{width:11px;height:11px}
& b{font-size:11.5px;font-weight:500;color:#262626}
& em{font-size:10.5px;font-style:normal;color:#8c8c8c}
& li:not(.is-done):not(.is-on) b{color:#8c8c8c}
}

/* ================= application windows: Shopee Seller Centre, TikTok Shop Seller Center, Merchant Center ================= */
.wa-ap.is-shp{--ap-top:#fff;--ap-ink:#333;--ap-acc:#ee4d2d;--ap-on:#fff5f1;--ap-onink:#ee4d2d;--ap-nav:#fff;--ap-main:#f6f6f6;--ap-navw:164px}
.wa-ap.is-shp .wa-ap-head h3{font-size:19px;font-weight:500;letter-spacing:0}
.wa-ap.is-shp .wa-ap-top{padding:7px 14px;border-color:#e8e8e8}
.wa-ap.is-shp .wa-ap-brand{font-size:15px;color:#333}
.wa-ap.is-shp .wa-ap-brand b{font-weight:500}
.wa-ap.is-shp .wa-ap-brand i:not(.sa-dot){border-radius:5px;background:#ee4d2d;font-size:12px}
.wa-ap.is-shp .wa-ap-prop{border-radius:3px;border-color:#e8e8e8;color:#555}
.wa-ap.is-shp .wa-ap-search{border-radius:3px;background:#f5f5f5}
.wa-ap.is-shp .wa-ap-av{background:#ee4d2d}
.wa-ap.is-shp .wa-ap-nav{padding:6px 0;border-color:#efefef}
.wa-ap.is-shp .wa-an{padding:8px 14px;border-radius:0;font-size:12.5px}
.wa-ap.is-shp .wa-an.is-on{background:#fff;color:#ee4d2d;font-weight:500}
.wa-ap.is-shp .wa-an.is-on .ico{color:#ee4d2d}
.wa-ap.is-shp .wa-ap-head h3{font-size:18px;font-weight:500;color:#333}
.wa-ap.is-shp .wa-ap-head span{color:#757575}
.wa-ap.is-shp .sa-gc{border-color:#ebebeb;border-radius:4px}
.wa-ap.is-shp .sa-gh{font-size:14px;font-weight:500;color:#333}
.wa-ap.is-shp .sa-gtabs{gap:0}
.wa-ap.is-shp .sa-gtabs > *{padding:11px 16px 10px}
.wa-ap.is-shp .sa-gtabs b{box-shadow:inset 0 -2px #ee4d2d;font-weight:500;color:#ee4d2d}
.wa-ap.is-shp .wa-tb th{background:#fafafa;font-weight:500;color:#757575}
.wa-ap.is-shp .wa-k b{font-size:20px;font-weight:500;color:#333}
.wa-ap.is-shp .wa-k{gap:3px}
.wa-ap.is-shp .wa-k em{color:#757575}
.wa-ap.is-shp .wa-bar u{background:#ee4d2d}
.wa-ap.is-shp .wa-bar.is-g u{background:#26aa99}
.wa-ap.is-shp .wa-bar.is-y u{background:#ffbf00}
.wa-ap.is-shp .wa-bar.is-r u{background:#d0011b}
.wa-ap.is-shp .sa-gf span{border-radius:3px}

.wa-ap.is-ttk{--ap-top:#fff;--ap-ink:#101631;--ap-acc:#fe2c55;--ap-on:#f1f1f2;--ap-onink:#101631;--ap-nav:#fff;--ap-main:#f8f8f8;--ap-navw:172px}
.wa-ap.is-ttk .wa-ap-top{padding:7px 14px;border-color:#ececec}
.wa-ap.is-ttk .wa-ap-brand{font-size:14.5px;color:#101631}
.wa-ap.is-ttk .wa-ap-brand b{font-weight:600}
.wa-ap.is-ttk .wa-ap-brand i:not(.sa-dot){border-radius:6px;background:#000;font-size:12px;text-shadow:-1px -1px 0 #25f4ee,1px 1px 0 #fe2c55}
.wa-ap.is-ttk .wa-ap-prop{border-radius:6px;border-color:#e3e3e4;color:#4d4e55}
.wa-ap.is-ttk .wa-ap-search{border-radius:6px;background:#f1f1f2}
.wa-ap.is-ttk .wa-ap-av{background:#101631}
.wa-ap.is-ttk .wa-ap-nav{padding:6px 8px;border-color:#efefef}
.wa-ap.is-ttk .wa-an{gap:9px;padding:8px 10px;border-radius:6px;font-size:12px}
.wa-ap.is-ttk .wa-an.is-sub{padding-left:24px}
.wa-ap.is-ttk .wa-an.is-on{font-weight:600}
.wa-ap.is-ttk .wa-an.is-on .ico{color:#101631}
.wa-ap.is-ttk .wa-ap-head h3{font-size:18px;font-weight:600;color:#101631}
.wa-ap.is-ttk .wa-ap-head span{color:#73747b}
.wa-ap.is-ttk .sa-gc{border-color:#ececec;border-radius:8px}
.wa-ap.is-ttk .sa-gh{font-size:14px;font-weight:600;color:#101631}
.wa-ap.is-ttk .sa-gtabs b{box-shadow:inset 0 -2px #101631;font-weight:600;color:#101631}
.wa-ap.is-ttk .wa-tb th{background:#fafafa;font-weight:500;color:#73747b}
.wa-ap.is-ttk .wa-k b{font-size:20px;font-weight:600;color:#101631}
.wa-ap.is-ttk .wa-bar u{background:#101631}
.wa-ap.is-ttk .wa-bar.is-g u{background:#25f4ee}
.wa-ap.is-ttk .wa-bar.is-r u{background:#fe2c55}

.wa-ap.is-mc{--ap-navw:164px}
.wa-ap.is-mc .wa-an.is-sub{padding-left:40px}
.wa-ap.is-mc .wa-ap-brand i:not(.sa-dot){border-radius:50%;background:#1a73e8}
}

/* ================= Shopee Seller Centre: forms, dialog, save bar, two-column cards ================= */
.wa-ap.is-shp{position:relative}
.wa-ap.is-shp:has(.ea-dlg) .wa-ap-body{min-height:372px}
.sa{
.ea-sc .sa-gh{padding:12px 16px 4px}
.ea-fr{display:grid;grid-template-columns:112px minmax(0,1fr);gap:0 14px;align-items:start;padding:7px 16px;
& > label{padding-top:7px;font-size:12px;line-height:1.35;color:#555;text-align:right}
& > label > i{margin-right:3px;font-style:normal;color:#ee4d2d}
}
.ea-sc > .ea-fr:last-child{padding-bottom:14px}
.ea-fv{display:grid;gap:4px;min-width:0;
& > small{font-size:11px;line-height:1.4;color:#8c8c8c}
}
.ea-in{display:flex;align-items:center;gap:6px;min-width:0;min-height:30px;padding:4px 10px;border:1px solid #d9d9d9;border-radius:3px;background:#fff;font-size:12.5px;line-height:1.4;color:#333;
& > em{flex:1;min-width:0;overflow:hidden;font-style:normal;text-overflow:ellipsis;white-space:nowrap}
& > small{flex:none;font-size:11px;color:#999}
& > .sa-dot{margin-left:0}
&.is-ph > em{color:#b5b5b5}
&.is-wrap > em{overflow:visible;white-space:normal}
&.is-0{border-color:#ee4d2d;background:#fff5f1}
&.ea-sel > .ico{flex:none;width:11px;height:11px;rotate:90deg;color:#999}
&.ea-ta{align-items:flex-start;min-height:72px;padding:7px 10px}
&.ea-ta > em{display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;white-space:pre-line}
&.ea-ta > small{align-self:flex-end}
}
.ea-two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;align-items:start;min-width:0}
.ea-sv{display:flex;justify-content:flex-end;align-items:center;gap:8px;padding:10px 16px;border:1px solid #ebebeb;border-radius:4px;background:#fff}
.ea-sv-p{display:inline-flex;align-items:center}
.ea-dim{position:absolute;inset:0;z-index:2;background:#000000a6}
.ea-dlg{position:absolute;z-index:3;top:58px;left:50%;width:min(88%,420px);translate:-50% 0;border-radius:4px;background:#fff;box-shadow:0 10px 30px #0006}
.ea-dlg-h{margin:0;padding:12px 16px;border-bottom:1px solid #f0f0f0;font-size:14px;font-weight:500;color:#333}
.ea-dlg-b{display:grid;gap:8px;padding:12px 16px 14px}
.ea-dlg-s{margin:0;font-size:12px;color:#555}
.ea-dlg-k{margin:4px 0 0;font-size:12px;font-weight:500;color:#333}
.ea-dlg-f{display:flex;justify-content:flex-end;gap:8px;padding:10px 16px;border-top:1px solid #f0f0f0}
.ea-rd{display:grid;gap:8px;margin:0;padding:0;list-style:none;
& li{display:flex;align-items:center;gap:8px;font-size:12.5px;color:#333}
& li > i:not(.sa-dot){flex:none;width:14px;height:14px;border:1px solid #bfbfbf;border-radius:50%;background:#fff}
& li.is-on > i:not(.sa-dot){border-color:#ee4d2d;box-shadow:inset 0 0 0 3px #fff,inset 0 0 0 8px #ee4d2d}
}
.ea-ad{display:flex;flex-wrap:wrap;align-items:center;gap:2px 8px;padding:9px 12px;border:1px solid #e5e5e5;border-radius:3px;background:#fafafa;font-size:12px;line-height:1.45;color:#555;
& b{font-weight:500;color:#333}
}
}

/* ================= Shopee Seller Centre: orders, order detail, cancellations, performance ================= */
.sa{
.ea-cnt{margin:0;padding:11px 14px 2px;font-size:12.5px;color:#555;
& b{font-weight:500;color:#333}
}
.ea-ot{table-layout:fixed;width:100%;
& td{padding:10px 6px;vertical-align:top;white-space:normal;max-width:none}
& td:first-child{padding-left:10px;min-width:0}
& td:nth-child(2),& td:last-child{white-space:nowrap}
& .ea-btn{padding:4px 7px;white-space:normal;max-width:70px;text-align:center;line-height:1.25;vertical-align:middle}
}
.ea-oc{display:grid;gap:7px;min-width:0}
.ea-oc-h{display:flex;flex-wrap:wrap;align-items:center;gap:1px 8px;font-size:11.5px;color:#555;
& code{font:10.5px/1.4 Consolas,"Courier New",monospace;color:#999}
}
.ea-oc-i{display:flex;align-items:center;gap:8px;min-width:0;font-size:12px;line-height:1.35;color:#333;
& > span:not(.ea-pic){flex:1;min-width:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
& > em{flex:none;font-style:normal;color:#8c8c8c}
}
.ea-st{display:grid;justify-items:start;gap:5px}
.ea-due{font-size:11px;font-style:normal;line-height:1.4;color:#757575}
.ea-lk{font-size:12px;color:#2673dd}
.ea-bn{margin:10px 4px 4px;padding:9px 12px;border:1px solid #fbd0c4;border-radius:3px;background:#fff5f1;font-size:12px;line-height:1.5;color:#b8341a}
.ea-dl{display:grid;gap:7px;margin:0;padding:6px 14px 10px;
& > div{display:grid;grid-template-columns:minmax(72px,40%) minmax(0,1fr);gap:8px;font-size:12px;line-height:1.45}
& dt{color:#757575}
& dd{margin:0;color:#333;overflow-wrap:anywhere}
}
.ea-two > .sa-gc:first-child .ea-dl dd{text-align:right}
.ea-tt{display:flex;justify-content:space-between;align-items:baseline;margin:0;padding:9px 14px 12px;border-top:1px dashed #e5e5e5;font-size:12px;color:#555;
& b{font-size:16px;font-weight:500;color:#ee4d2d}
}
.ea-cc td:first-child,.ea-hl td{white-space:normal}
.ea-cc .wa-bar{min-width:60px}
.ea-hl td:last-child{white-space:nowrap}
.ea-hl td:nth-child(3){color:#757575}
}

/* ================= Shopee Seller Centre: money (income of one order, balance, weekly report) ================= */
.sa{
.ea-lg{margin:0;padding:0 0 4px;list-style:none;font-size:12.5px;
& li{display:flex;align-items:center;gap:8px;padding:8px 16px;border-bottom:1px solid #f4f4f4;color:#555}
& li > span{flex:1;min-width:0}
& li > b{font-weight:400;color:#333}
& li.is-g{padding:9px 16px 7px;border-bottom:0;background:#fafafa;font-size:12px;font-weight:500;color:#333}
& li.is-t{border-bottom:0;background:#fff5f1;
& > span{font-weight:500;color:#333}
& > b{font-size:15px;font-weight:500;color:#ee4d2d}}
}
.sa-gc.ea-bal{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px;
& em{display:block;font-size:12px;font-style:normal;color:#757575}
& b{font-size:24px;font-weight:500;line-height:1.3;color:#333}
}
.ea-bk{display:flex;align-items:center;gap:8px;margin:0;padding:12px 16px;font-size:12.5px;
& .ico{flex:none;width:16px;height:16px;color:#757575}
& span{color:#757575}
& b{margin-left:auto;font-weight:500;color:#333}
}
.ea-lt td{white-space:normal;max-width:none}
.ea-lt td:last-child{white-space:nowrap}
.ea-pos{color:#26aa99;font-weight:500}
}

/* ================= Shopee Seller Centre: products, variations, vouchers, combo, shop page ================= */
.sa{
.ea-imgs{display:flex;flex-wrap:wrap;gap:8px}
.ea-im{position:relative;display:inline-block;
& u{position:absolute;inset:auto 0 0;padding:1px 0;background:#000a;font-size:9.5px;line-height:1.5;text-align:center;text-decoration:none;color:#fff}
}
.ea-add{display:inline-grid;place-items:center;align-content:center;gap:2px;width:56px;height:56px;border:1px dashed #ee4d2d;border-radius:3px;color:#ee4d2d;
& .ico{width:14px;height:14px}
& em{font-size:10px;font-style:normal;line-height:1.2}
}
.ea-opts{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.ea-opt{display:inline-flex;align-items:center;gap:7px;padding:4px 10px;border:1px solid #d9d9d9;border-radius:3px;background:#fff;font-size:12px;color:#333;
& i{font-style:normal;color:#999}
}
.ea-vt{margin:6px 16px 14px;border:1px solid #ebebeb;border-radius:3px;overflow:hidden}
.ea-vtb{
& td{padding:6px 8px 6px 10px;max-width:none;overflow:visible}
& .ea-in{min-height:26px;padding:2px 8px}
}
.ea-pl,.ea-pt,.ea-cb,.ea-vr{
& td{white-space:normal;max-width:none;vertical-align:middle}
}
.ea-pl td:nth-child(n+2),.ea-pt td:nth-child(n+2){white-space:nowrap}
.ea-pl .ea-it-t b,.ea-pt .ea-it-t b,.ea-cb .ea-it-t b{white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.ea-pl td:first-child,.ea-pt td:first-child,.ea-cb td:nth-child(2){min-width:150px}
.ea-code{display:flex;min-width:0;
& > em{flex:none;display:grid;place-items:center;padding:0 10px;border:1px solid #d9d9d9;border-right:0;border-radius:3px 0 0 3px;background:#fafafa;font-size:12.5px;font-style:normal;color:#555}
& > .ea-in{flex:1;border-radius:0 3px 3px 0}
}
.ea-rule{display:flex;align-items:center;gap:8px;padding:8px 12px;border:1px solid #ee4d2d;border-radius:3px;background:#fff;font-size:12.5px;line-height:1.4;color:#333;
&::before{content:"";flex:none;width:12px;height:12px;border-radius:50%;border:4px solid #ee4d2d;background:#fff}
}
.ea-ck{display:inline-grid;place-items:center;width:15px;height:15px;border:1px solid #bfbfbf;border-radius:2px;background:#fff;
&.is-on{border-color:#ee4d2d;background:#ee4d2d;color:#fff}
& .ico{width:10px;height:10px}
}
.ea-sub{display:block;margin-top:2px;font-size:11px;font-style:normal;color:#8c8c8c}
.ea-vr td:first-child{min-width:130px}
.ea-vr td:nth-child(n+3){white-space:nowrap}
.ea-dc{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:12px}
.ea-dc-l{padding:10px 12px 12px;border:1px solid #ebebeb;border-radius:4px;background:#fff;
& > p{margin:0 0 7px;font-size:12px;font-weight:500;color:#333}
& ul{display:grid;gap:6px;margin:0;padding:0;list-style:none}
& li{display:flex;align-items:center;gap:8px;padding:7px 8px;border:1px solid #ebebeb;border-radius:3px;font-size:12px;color:#333}
& li > i:not(.sa-dot){flex:none;color:#bbb}
& li > i .ico{width:12px;height:12px}
& li > span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
& li > u{position:relative;flex:none;width:26px;height:14px;border-radius:7px;background:#d9d9d9}
& li > u::after{content:"";position:absolute;left:2px;top:2px;width:10px;height:10px;border-radius:50%;background:#fff}
& li.is-on > u{background:#ee4d2d}
& li.is-on > u::after{left:14px}
}
.ea-dc-r{display:grid;justify-items:center;align-content:start;padding:12px;border-radius:4px;background:#ececec}
.ea-dc-pv{display:grid;gap:6px;width:100%;max-width:196px;padding:7px;border-radius:10px;background:#fff;box-shadow:0 2px 8px #0002}
.ea-dc-bn{position:relative;display:flex;align-items:center;justify-content:space-between;padding:9px 10px;border-radius:4px;background:linear-gradient(120deg,#fdebd2,#f6d3a8);
& b{font:700 11px/1.25 Cambria,"Times New Roman",serif;color:#7a4b24}
& > .sa-dot{position:absolute;top:-6px;right:-6px;margin:0}
}
.ea-dc-vc{display:flex;gap:4px;
& u{padding:3px 6px;border:1px solid #ee4d2d;border-radius:2px;background:#fff5f1;font-size:9.5px;text-decoration:none;color:#ee4d2d}
}
.ea-dc-ct{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;margin:0;padding:0;list-style:none;
& li{display:grid;justify-items:center;gap:2px;padding:5px 0;border-radius:3px;background:#f6f6f6;font-size:9.5px;color:#333}
& b{font-weight:400}
}
.ea-ph{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.ea-av2{display:grid;place-items:center;flex:none;width:56px;height:56px;border-radius:50%;background:#ee4d2d;font-size:22px;font-weight:700;color:#fff}
.ea-cv{display:inline-flex;align-items:center;justify-content:center;gap:2px;width:150px;height:56px;border-radius:4px;background:linear-gradient(120deg,#fdebd2,#f6d3a8)}
.wa-ap.is-shp .wa-fn-b u{background:#ee4d2d}
}

@container (max-width:560px){
.sa .ea-fr{grid-template-columns:92px minmax(0,1fr);gap:0 10px;padding:6px 12px}
.sa .ea-dc{grid-template-columns:minmax(0,1fr)}
.sa .ea-sv{padding:9px 12px}
}
@container (max-width:680px){
.sa .ea-ot thead{display:none}
.sa .ea-ot,.sa .ea-ot tbody{display:block}
.sa .ea-ot tr{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:start;border-bottom:1px solid #f1f3f4}
.sa .ea-ot td{display:block;padding:5px 10px;border:0}
.sa .ea-ot td:first-child{grid-column:1/-1;min-width:0;padding-bottom:2px}
.sa .ea-ot td:nth-child(2){text-align:left}
}
@container (max-width:430px){
.sa .ea-fr{grid-template-columns:minmax(0,1fr);gap:3px}
.sa .ea-fr > label{padding-top:0;text-align:left}
.sa .ea-two{grid-template-columns:minmax(0,1fr)}
.sa .wa-tb.ea-stk thead{display:none}
.sa .wa-tb.ea-stk,.sa .wa-tb.ea-stk tbody{display:block}
.sa .wa-tb.ea-stk tr{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px 10px;align-items:start;padding:8px 10px;border-bottom:1px solid #f1f3f4}
.sa .wa-tb.ea-stk td{display:block;min-width:0;max-width:none;padding:0;border:0;overflow:visible;white-space:normal;text-align:left;font-size:12px}
.sa .wa-tb.ea-stk td:first-child{grid-column:1/-1;font-weight:500}
.sa .wa-tb.ea-stk td:last-child:nth-child(even){grid-column:1/-1}
.sa .wa-tb.ea-stk.ea-ed-pk td:nth-child(2){grid-column:1/-1}
.sa .wa-tb.ea-stk td:empty{display:none}
.sa .wa-tb.ea-stk td[data-l]::before{content:attr(data-l);display:block;margin-bottom:1px;font-size:10px;font-weight:400;color:#8a8a8a}
.sa .wa-kp{grid-template-columns:repeat(2,minmax(0,1fr))}
.sa .wa-ap .wa-k{padding:8px 10px}
.sa .wa-ap.is-shp .wa-k b,.sa .wa-ap.is-ttk .wa-k b{font-size:16px}
}
@container (max-width:340px){
.sa .wa-ap .wa-kp{grid-template-columns:minmax(0,1fr)}
.sa .wa-ap .wa-k{grid-template-columns:minmax(0,1fr) auto;align-items:baseline;gap:1px 8px}
.sa .wa-ap .wa-k em{grid-column:1}
.sa .wa-ap .wa-k b{grid-column:2;grid-row:1;white-space:nowrap}
.sa .wa-ap .wa-k i:not(.sa-dot){grid-column:1/-1}
.sa .wa-ap.is-shp .wa-k b,.sa .wa-ap.is-ttk .wa-k b{font-size:17px}
}
@container (max-width:620px){
.sa .wa-fn li{grid-template-columns:22px minmax(0,1fr) auto auto;gap:8px}
.sa .wa-fn em{min-width:0}
}

/* ================= Shopee app (phone): search, suggestions, shop page, product page, choose a variation ================= */
.sa-ph:has(.ea-sh-top) .mk-status{background:#f53d2d;color:#fff}
.sa-ph .mk-scr > .sa.sa-pvw:has(> .ea-sh){flex:1 1 0;min-height:0;overflow:hidden}
.sa-ph .sa.sa-pvw > .ea-sh{min-height:0;min-width:0}
.sa{
.ea-sh{display:flex;flex-direction:column;min-height:100%;background:#f5f5f5;font-family:Roboto,Arial,"Helvetica Neue",sans-serif;color:#222;
& .sa-dot{width:16px;height:16px;margin:0 0 0 3px;font-size:10px;box-shadow:0 0 0 1.5px #fff}
& p,& ul{margin:0}
& ul{padding:0;list-style:none}
}
.ea-sh-top{display:flex;align-items:center;gap:9px;padding:6px 10px 8px;background:linear-gradient(180deg,#f53d2d,#ff6633);color:#fff;
& > .ico{flex:none;width:17px;height:17px}
}
.ea-sh-ic{flex:none;display:grid;
& .ico{width:19px;height:19px}
}
.ea-sh-in{display:flex;flex:1;align-items:center;gap:6px;min-width:0;height:28px;padding:2px 2px 2px 8px;border-radius:2px;background:#fff;font-size:12px;color:#222;
& > em{flex:1;min-width:0;overflow:hidden;font-style:normal;text-overflow:ellipsis;white-space:nowrap}
&.is-ph > em{color:#bdbdbd}
& > .sa-dot{box-shadow:none}
}
.ea-sh-go{display:grid;place-items:center;flex:none;width:34px;height:24px;border-radius:2px;background:#ee4d2d;color:#fff;
& .ico{width:13px;height:13px}
}
.ea-sh-cr{display:inline-block;width:1px;height:13px;margin-left:1px;background:#ee4d2d;vertical-align:-2px}
.ea-sh-st{display:flex;background:#fff;border-bottom:1px solid #eee;
& span{display:flex;flex:1;align-items:center;justify-content:center;gap:2px;padding:9px 0 8px;font-size:11px;color:#555;white-space:nowrap}
& .is-on{box-shadow:inset 0 -2px #ee4d2d;color:#ee4d2d}
& .ico{width:9px;height:9px;rotate:90deg}
}
.ea-sh-g{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:5px;padding:5px}
.ea-sh-c{display:flex;flex-direction:column;gap:4px;min-width:0;padding-bottom:7px;border-radius:2px;background:#fff;overflow:hidden}
.ea-sh-im{display:grid;place-items:center;height:96px;background:linear-gradient(160deg,#f7ead6,#ecd2a8);
&.is-alt{background:linear-gradient(160deg,#eef3ec,#d9e4d4)}
}
.ea-sh-nr{display:flex;align-items:flex-start;padding:0 6px}
.ea-sh-n{flex:1;min-width:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:10.5px;line-height:1.35;color:#222}
.ea-sh-tg{display:flex;flex-wrap:wrap;align-items:center;gap:3px;padding:0 6px;
& span{padding:0 3px;border:1px solid #ee4d2d;font-size:8.5px;line-height:1.5;color:#ee4d2d}
}
.ea-sh-pr{display:flex;flex-wrap:wrap;align-items:center;gap:1px 3px;padding:0 6px;
& b{font-size:11.5px;font-weight:500;color:#ee4d2d}
& em{margin-left:auto;font-size:8.5px;font-style:normal;color:#757575;white-space:nowrap}
}
.ea-sh-lc{display:flex;align-items:center;gap:3px;padding:0 6px;font-size:8.5px;color:#757575;
& .ico{flex:none;width:9px;height:9px}
}
.ea-sh-sg{background:#fff;
& li{display:flex;align-items:center;gap:9px;padding:10px 12px;border-bottom:1px solid #f1f1f1;font-size:12px;color:#222}
& li > .ico{flex:none;width:13px;height:13px;color:#bdbdbd}
& li > span{flex:1;min-width:0}
& b{font-weight:700}
}
.ea-sh-fill{flex:1;background:#fff}
.ea-sh-id{display:flex;align-items:center;gap:9px;padding:2px 10px 10px;background:linear-gradient(180deg,#ff6633,#ee4d2d);color:#fff}
.ea-sh-av{display:grid;place-items:center;flex:none;width:38px;height:38px;border:2px solid #fff;border-radius:50%;background:#fbe9d2;font-size:16px;font-weight:700;color:#8a4b12}
.ea-sh-nm{display:grid;flex:1;min-width:0;
& b{font-size:12.5px;font-weight:500;line-height:1.3}
& em{font-size:10px;font-style:normal;opacity:.85}
}
.ea-sh-fl{flex:none;padding:3px 8px;border:1px solid #ffffffd9;border-radius:2px;font-size:10px;white-space:nowrap}
.ea-sh-tb{display:flex;background:#fff;border-bottom:1px solid #eee;
& span{flex:1;padding:9px 0 8px;font-size:11px;text-align:center;color:#555}
& .is-on{box-shadow:inset 0 -2px #ee4d2d;font-weight:500;color:#ee4d2d}
}
.ea-sh-bn{position:relative;display:flex;align-items:center;justify-content:space-between;margin:6px 6px 0;padding:12px 14px;border-radius:3px;background:linear-gradient(120deg,#fdebd2,#f6d3a8);
& > .sa-dot{position:absolute;top:5px;right:5px;margin:0}
}
.ea-sh-bt{font:700 15px/1.2 Cambria,"Times New Roman",serif;color:#7a4b24}
.ea-sh-bc{display:flex;align-items:flex-end}
.ea-sh-vs{position:relative;display:flex;align-items:stretch;gap:6px;margin-top:6px;padding:8px 6px;background:#fff;
& > .sa-dot{position:absolute;top:2px;right:4px;margin:0}
}
.ea-sh-v{display:grid;flex:1;grid-template-columns:minmax(0,1fr) auto;column-gap:4px;padding:5px 6px;border:1px solid #f6b9a9;border-left:3px solid #ee4d2d;border-radius:2px;background:#fff5f1;
& b{grid-column:1;font-size:10.5px;font-weight:500;color:#ee4d2d}
& em{grid-column:1;font-size:8.5px;font-style:normal;line-height:1.3;color:#757575}
& u{grid-column:2;grid-row:1/3;align-self:center;padding:2px 6px;border-radius:2px;background:#ee4d2d;font-size:9.5px;text-decoration:none;color:#fff}
}
.ea-sh-h{margin:6px 0 0;padding:9px 10px 5px;background:#fff;font-size:12px;font-weight:500;color:#222}
.ea-sh-ct{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;padding:4px 10px 12px;background:#fff;
& li{display:grid;justify-items:center;gap:4px}
& .ea-sh-im{width:100%;height:50px;border-radius:3px}
& b{font-size:10.5px;font-weight:400;color:#222}
&.is-p b{font-weight:500;color:#ee4d2d}
&.is-p .ea-sh-im{height:42px}
}
.ea-pd-im{position:relative;display:grid;place-items:center;height:124px;background:linear-gradient(160deg,#f7ead6,#ecd2a8);
&.is-dim{height:90px}
& > em{position:absolute;right:8px;bottom:8px;padding:1px 8px;border-radius:10px;background:#0006;font-size:10px;font-style:normal;color:#fff}
}
.ea-pd-nav{position:absolute;inset:8px 8px auto;display:flex;align-items:center;gap:6px;
& > i{flex:1}
& .ico{box-sizing:content-box;width:14px;height:14px;padding:6px;border-radius:50%;background:#0006;color:#fff}
& b{display:flex}
}
.ea-pd-pr{display:flex;align-items:center;gap:8px;padding:9px 10px 5px;background:#fff;
& b{font-size:16px;font-weight:500;color:#ee4d2d}
& span{padding:0 4px;border:1px solid #ee4d2d;font-size:9px;line-height:1.5;color:#ee4d2d}
}
.ea-pd-n{padding:0 10px 4px;background:#fff;font-size:12px;line-height:1.4;color:#222;
& i{margin-right:5px;padding:0 4px;border-radius:2px;background:#ee4d2d;font-size:9px;font-style:normal;line-height:1.6;color:#fff}
}
.ea-pd-sold{padding:0 10px 9px;background:#fff;font-size:10px;color:#757575}
.ea-pd-row{display:flex;align-items:center;gap:8px;margin-top:6px;padding:10px;background:#fff;font-size:11px;
& > .ico{flex:none;width:11px;height:11px;color:#bdbdbd}
}
.ea-pd-k{flex:none;width:84px;font-size:11px;color:#757575}
.ea-pd-v{display:flex;flex:1;flex-wrap:wrap;gap:4px;min-width:0;color:#222;
& u{padding:1px 5px;border:1px solid #ee4d2d;background:#fff5f1;font-size:9px;text-decoration:none;color:#ee4d2d}
& u.is-c{border-color:#26aa99;background:#e8f7f4;color:#26aa99}
}
.ea-pd-fill{flex:1}
.ea-pd-bar{display:flex;align-items:stretch;height:44px;border-top:1px solid #eee;background:#fff;
& > span{display:flex;align-items:center;justify-content:center;gap:4px;font-size:10.5px;white-space:nowrap}
& .ico{width:15px;height:15px}
}
.ea-pd-b1{flex:none;width:44px;border-right:1px solid #eee;color:#ee4d2d}
.ea-pd-b2{flex:1;background:#eefaf8;color:#26aa99}
.ea-pd-bar > .ea-pd-b2{flex-direction:column;gap:1px;font-size:10px;line-height:1.15;white-space:normal;text-align:center}
.ea-pd-b3{flex:1;background:#ee4d2d;color:#fff}
.ea-vs-bg{position:relative;flex:1;min-height:0;overflow:hidden;background:#fff;
&::after{content:"";position:absolute;inset:0;background:#00000080}
}
.ea-vs{position:relative;z-index:1;display:grid;gap:10px;padding:10px 12px 12px;border-radius:10px 10px 0 0;background:#fff}
.ea-vs-h{display:flex;align-items:flex-end;gap:10px;
& .ea-sh-im{flex:none;width:64px;height:64px;margin-top:-30px;border:2px solid #fff;border-radius:3px;box-shadow:0 1px 5px #0003}
& > div{display:grid;flex:1;gap:1px;min-width:0}
& b{font-size:16px;font-weight:500;color:#ee4d2d}
& em{font-size:10.5px;font-style:normal;color:#757575}
& > i:not(.sa-dot){flex:none;align-self:flex-start}
& > i .ico{width:14px;height:14px;color:#9a9a9a}
}
.ea-vs-t{margin:0;font-size:12px;font-weight:500;color:#222}
.ea-vs-o{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:0;padding:0;list-style:none;
& li{padding:5px 12px;border:1px solid #e0e0e0;border-radius:2px;background:#fff;font-size:11.5px;color:#222}
& li.is-on{border-color:#ee4d2d;background:#fff5f1;color:#ee4d2d}
& li.is-off{border-color:#eee;background:#f5f5f5;color:#bdbdbd}
}
.ea-vs-q{display:flex;align-items:center;justify-content:space-between;font-size:12px;color:#222}
.ea-q{display:inline-flex;align-items:center;border:1px solid #e0e0e0;
& i,& b{display:grid;place-items:center;width:26px;height:24px;font-size:13px;font-style:normal;font-weight:400}
& b{border-inline:1px solid #e0e0e0}
}
.ea-vs-b{display:grid;place-items:center;height:38px;border-radius:2px;background:#ee4d2d;font-size:12.5px;color:#fff}
}

/* recap cards: keep text at the top when a description is shorter than its neighbours */
#recap .rc{align-content:start}

/* ================= TikTok Shop Seller Center: red accent, to-do counters, creator cell, toggle ================= */
.wa-ap.is-ttk{position:relative}
.wa-ap.is-ttk:has(.ea-dlg) .wa-ap-body{min-height:430px}
.sa{
.wa-ap.is-ttk{
.ea-fr > label > i{color:#fe2c55}
.ea-in.is-0{border-color:#fe2c55;background:#fff1f4}
.ea-rd li.is-on > i:not(.sa-dot){border-color:#fe2c55;box-shadow:inset 0 0 0 3px #fff,inset 0 0 0 8px #fe2c55}
.ea-bn{border-color:#ffc7d2;background:#fff1f4;color:#b0153a}
.ea-tt b{color:#fe2c55}
.ea-lg li.is-t{background:#fff1f4;
& > b{color:#fe2c55}}
.ea-add{border-color:#fe2c55;color:#fe2c55}
.ea-rule{border-color:#fe2c55;
&::before{border-color:#fe2c55}}
.ea-ck.is-on{border-color:#fe2c55;background:#fe2c55}
.ea-av2{background:#fe2c55}
.wa-fn-b u{background:#fe2c55}
.ea-dlg{border-radius:8px}
.ea-in,.ea-opt{border-radius:6px;border-color:#e3e3e4}
.ea-sv{border-color:#ececec;border-radius:8px}
}
.ea-td{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;margin:0;padding:0;list-style:none;background:#f1f1f2;
& li{position:relative;display:grid;align-content:start;justify-items:start;gap:3px;padding:12px 14px;background:#fff}
& b{font-size:22px;font-weight:600;line-height:1.1;color:#161823}
& span{font-size:11.5px;line-height:1.3;color:#73747b}
& li > .sa-dot{position:absolute;top:9px;right:9px;margin:0}
}
.ea-cr{display:inline-flex;align-items:center;gap:8px;min-width:0;
& > i{display:grid;place-items:center;flex:none;width:28px;height:28px;border-radius:50%;font-size:12px;font-style:normal;font-weight:600;color:#fff}
& > span{display:grid;min-width:0;line-height:1.25}
& b{overflow:hidden;font-size:12.5px;font-weight:500;color:#161823;text-overflow:ellipsis;white-space:nowrap}
& em{overflow:hidden;font-size:10.5px;font-style:normal;color:#73747b;text-overflow:ellipsis;white-space:nowrap}
}
.ea-tgr{display:flex;align-items:center;gap:8px;font-size:12.5px;color:#333;
& em{font-style:normal}
}
.ea-tg{position:relative;flex:none;width:32px;height:18px;border-radius:9px;background:#c9cacf;
& u{position:absolute;left:2px;top:2px;width:14px;height:14px;border-radius:50%;background:#fff;box-shadow:0 1px 2px #0003}
&.is-on{background:#fe2c55}
&.is-on u{left:16px}
}
}
@container (max-width:430px){
.sa .ea-td{grid-template-columns:repeat(2,minmax(0,1fr))}
}

/* ================= TikTok app (phone): a video with a product link, add a product, shop page, product page ================= */
.sa-ph:has(.ea-tk.is-dk) .mk-status{background:#000;color:#fff}
.sa-ph .mk-scr > .sa.sa-pvw:has(> .ea-tk){flex:1 1 0;min-height:0;overflow:hidden}
.sa-ph .sa.sa-pvw > .ea-tk{min-height:0}
.sa{
.ea-tk{position:relative;display:flex;flex-direction:column;min-height:100%;overflow:hidden;background:#fff;font-family:"Helvetica Neue",Arial,sans-serif;color:#161823;
& .sa-dot{width:16px;height:16px;margin:0 0 0 3px;font-size:10px;box-shadow:0 0 0 1.5px #fff}
& p,& ul{margin:0}
& ul{padding:0;list-style:none}
&.is-dk{background:#0b0907;color:#fff}
}
.ea-tk-gl{flex:none;width:22px;height:22px;fill:currentColor;
& .k{fill:#2a1a0e}
}
.ea-tk-vd{position:absolute;inset:0;display:grid;place-items:center;padding-bottom:70px;background:radial-gradient(circle at 50% 46%,#6a4526 0,#33200f 42%,#0d0805 100%)}
.ea-tk-tx{position:absolute;left:14px;top:92px;z-index:1;font-size:21px;font-weight:800;line-height:1.15;text-shadow:0 1px 8px #0009}
.ea-tk-tabs{position:absolute;inset:6px 0 auto;z-index:2;display:flex;align-items:center;justify-content:center;gap:16px;font-size:12.5px;font-weight:600;color:#ffffffb3;
& .is-on{position:relative;color:#fff}
& .is-on::after{content:"";position:absolute;left:25%;right:25%;bottom:-5px;height:2px;border-radius:1px;background:#fff}
& .ico{position:absolute;right:12px;width:16px;height:16px;color:#fff}
}
.ea-tk-rail{position:absolute;right:7px;bottom:168px;z-index:2;display:grid;justify-items:center;gap:13px;
& > span{display:grid;justify-items:center;gap:1px}
& b{font-size:10px;font-weight:600;text-shadow:0 1px 3px #0008}
& .ea-tk-gl{width:28px;height:28px;filter:drop-shadow(0 1px 2px #0006)}
}
.ea-tk-av{position:relative;display:grid;place-items:center;width:38px;height:38px;margin-bottom:10px;border:2px solid #fff;border-radius:50%;background:linear-gradient(160deg,#f7ead6,#ecd2a8);font-size:16px;font-weight:700;color:#8a4b12;
& u{position:absolute;bottom:-9px;display:grid;place-items:center;width:16px;height:16px;border-radius:50%;background:#fe2c55;font-size:12px;font-weight:700;line-height:1;text-decoration:none;color:#fff}
}
.ea-tk-bt{position:absolute;inset:auto 0 44px;z-index:2;display:grid;gap:8px;padding:30px 54px 8px 10px;background:linear-gradient(180deg,#0000,#000a 40%)}
.ea-tk-cap{display:grid;gap:3px;
& b{font-size:13px;font-weight:700}
& p{font-size:11.5px;line-height:1.35;text-shadow:0 1px 3px #0008}
& u{font-weight:700;text-decoration:none}
}
.ea-tk-mu{display:flex;align-items:center;gap:5px;font-size:10.5px;
& .ea-tk-gl{width:12px;height:12px}
& span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
}
.ea-tk-pl{display:flex;align-items:center;gap:8px;padding:5px 9px 5px 5px;border-radius:6px;background:#fffffff0;color:#161823;
& > div{display:grid;flex:1;min-width:0;line-height:1.3}
& b{overflow:hidden;font-size:11px;font-weight:600;text-overflow:ellipsis;white-space:nowrap}
& em{overflow:hidden;font-size:10px;font-style:normal;color:#73747b;text-overflow:ellipsis;white-space:nowrap}
& em strong{font-weight:700;color:#fe2c55}
& > .ico{flex:none;width:12px;height:12px;color:#73747b}
}
.ea-tk-pi{display:grid;place-items:center;flex:none;width:34px;height:34px;border-radius:4px;background:linear-gradient(160deg,#f7ead6,#ecd2a8)}
.ea-tk-nav{position:absolute;inset:auto 0 0;z-index:3;display:flex;align-items:center;height:44px;padding:0 8px;background:#000;
& > span{display:grid;flex:1;justify-items:center;gap:1px;color:#ffffff99}
& > span.is-on{color:#fff}
& em{font-size:9px;font-style:normal;font-weight:600}
& .ea-tk-gl{width:20px;height:20px}
}
.ea-tk-mk{display:grid;flex:1;place-items:center;
& b{display:grid;place-items:center;width:36px;height:24px;border-radius:7px;background:#fff;box-shadow:-3px 0 0 #25f4ee,3px 0 0 #fe2c55;font-size:19px;font-weight:700;line-height:1;color:#000}
}
.ea-tk-dm{display:grid;flex:1;min-height:0;place-items:center;background:radial-gradient(circle at 50% 46%,#6a4526 0,#33200f 42%,#0d0805 100%);opacity:.55}
.ea-tk-sh{display:grid;flex:none;gap:7px;padding:11px 12px 12px;border-radius:12px 12px 0 0;background:#fff;color:#161823}
.ea-tk-sh-h{display:flex;align-items:center;justify-content:space-between;
& b{font-size:13.5px;font-weight:700}
& .ico{width:15px;height:15px;color:#73747b}
}
.ea-tk-sl{display:grid;
& li{display:flex;align-items:center;gap:8px;padding:7px 0;border-bottom:1px solid #f1f1f2}
& li > div{display:grid;flex:1;min-width:0;line-height:1.3}
& p{display:-webkit-box;overflow:hidden;font-size:11.5px;-webkit-line-clamp:2;-webkit-box-orient:vertical}
& b{font-size:11.5px;font-weight:700;color:#fe2c55}
}
.ea-tk-rd{flex:none;width:16px;height:16px;border:1.5px solid #c9cacf;border-radius:50%;background:#fff}
.ea-tk-sl .is-on .ea-tk-rd{border-color:#fe2c55;box-shadow:inset 0 0 0 3px #fff,inset 0 0 0 8px #fe2c55}
.ea-tk-th{display:grid;place-items:center;flex:none;width:36px;height:36px;border-radius:4px;background:linear-gradient(160deg,#f7ead6,#ecd2a8)}
.ea-tk-lb{margin-top:3px;font-size:11px;color:#73747b}
.ea-tk-fd{display:flex;align-items:center;gap:6px;padding:8px 10px;border:1px solid #e3e3e4;border-radius:6px;font-size:12px;
& em{flex:1;min-width:0;overflow:hidden;font-style:normal;text-overflow:ellipsis;white-space:nowrap}
& small{flex:none;font-size:10px;color:#a0a1a8}
}
.ea-tk-bn{position:relative;display:grid;place-items:center;height:38px;border-radius:4px;background:#fe2c55;font-size:12.5px;font-weight:700;color:#fff;
& .sa-dot{position:absolute;top:-6px;right:-4px;margin:0}
}
.ea-tk-hd{display:flex;align-items:center;gap:11px;padding:8px 12px;
& > .ico{flex:none;width:17px;height:17px}
}
.ea-tk-sb{display:flex;flex:1;align-items:center;gap:6px;min-width:0;padding:6px 10px;border-radius:16px;background:#f1f1f2;
& .ico{flex:none;width:13px;height:13px;color:#73747b}
& em{font-size:11px;font-style:normal;color:#a0a1a8}
}
.ea-tk-id{display:flex;align-items:center;gap:10px;padding:6px 12px 10px}
.ea-tk-sa{display:grid;place-items:center;flex:none;width:40px;height:40px;border-radius:50%;background:linear-gradient(160deg,#f7ead6,#ecd2a8);font-size:18px;font-weight:700;color:#8a4b12}
.ea-tk-sn{display:grid;flex:1;min-width:0;gap:1px;
& b{font-size:13px;font-weight:700;line-height:1.3;white-space:nowrap}
& em{font-size:10.5px;font-style:normal;color:#73747b}
}
.ea-tk-fl{flex:none;padding:5px 10px;border-radius:3px;background:#fe2c55;font-size:11px;font-weight:600;color:#fff;
&.is-o{border:1px solid #161823;background:#fff;color:#161823}
}
.ea-tk-rw.ea-tk-st{align-items:center;
& .ea-tk-sa{width:34px;height:34px;font-size:14px}
& .ea-tk-sn b{font-size:12px}
}
.ea-tk-tb{display:flex;border-bottom:1px solid #f1f1f2;
& span{flex:1;padding:8px 0;font-size:11.5px;text-align:center;color:#73747b}
& .is-on{box-shadow:inset 0 -2px #161823;font-weight:700;color:#161823}
}
.ea-tk-vs{position:relative;display:flex;gap:6px;padding:9px 10px;
& > .sa-dot{position:absolute;top:3px;right:5px;margin:0}
}
.ea-tk-v{display:grid;flex:1;grid-template-columns:minmax(0,1fr) auto;column-gap:4px;padding:5px 7px;border:1px solid #ffc7d2;border-radius:4px;background:#fff1f4;
& b{grid-column:1;font-size:11px;font-weight:700;color:#fe2c55}
& em{grid-column:1;font-size:9px;font-style:normal;line-height:1.3;color:#73747b}
& u{grid-column:2;grid-row:1/3;align-self:center;padding:2px 7px;border-radius:3px;background:#fe2c55;font-size:9.5px;font-weight:600;text-decoration:none;color:#fff}
}
.ea-tk-h{padding:7px 12px 3px;font-size:13px;font-weight:700}
.ea-tk .ea-tk-gd{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 6px;padding:4px 10px 10px}
.ea-tk-c{display:flex;flex-direction:column;gap:3px;min-width:0;overflow:hidden;border-radius:4px;background:#fff}
.ea-tk-im{display:grid;place-items:center;height:86px;border-radius:4px;background:linear-gradient(160deg,#f7ead6,#ecd2a8);
&.is-rose{background:linear-gradient(160deg,#f8e4e8,#efc9d1)}
&.is-sage{background:linear-gradient(160deg,#eef3ec,#d9e4d4)}
&.is-sand{background:linear-gradient(160deg,#f3ecdf,#e3d3b6)}
}
.ea-tk-n{display:-webkit-box;overflow:hidden;padding:0 3px;font-size:10.5px;line-height:1.35;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.ea-tk-pr{display:flex;flex-wrap:wrap;align-items:center;gap:1px 3px;padding:0 3px;
& b{font-size:12px;font-weight:700;color:#fe2c55}
& em{margin-left:auto;font-size:9px;font-style:normal;color:#73747b;white-space:nowrap}
}
.ea-tk-pg{position:relative;display:grid;place-items:center;height:150px;background:linear-gradient(160deg,#f7ead6,#ecd2a8);
& > em{position:absolute;right:8px;bottom:8px;padding:1px 8px;border-radius:10px;background:#0006;font-size:10px;font-style:normal;color:#fff}
}
.ea-tk-pn{position:absolute;inset:8px 8px auto;display:flex;align-items:center;gap:7px;
& > i{flex:1}
& .ico{box-sizing:content-box;width:14px;height:14px;padding:6px;border-radius:50%;background:#0006;color:#fff}
}
.ea-tk-pp{display:flex;align-items:baseline;gap:8px;padding:9px 12px 2px;
& b{font-size:19px;font-weight:700;color:#fe2c55}
& em{font-size:10px;font-style:normal;color:#73747b}
}
.ea-tk-nm{padding:2px 12px 9px;font-size:12px;font-weight:500;line-height:1.4}
.ea-tk-rw{display:flex;align-items:flex-start;gap:8px;padding:9px 12px;border-top:6px solid #f1f1f2;font-size:11px}
.ea-tk-k{flex:none;width:62px;padding-top:3px;font-size:11px;color:#73747b}
.ea-tk-ch{display:flex;flex:1;flex-wrap:wrap;gap:5px;min-width:0;
& li{padding:3px 10px;border:1px solid #e3e3e4;border-radius:3px;font-size:11px}
& li.is-on{border-color:#fe2c55;background:#fff1f4;color:#fe2c55}
& li.is-off{border-color:#f1f1f2;background:#f8f8f8;color:#c9cacf}
}
.ea-tk-sp{display:grid;flex:1;min-width:0;gap:1px;
& b{font-size:11.5px;font-weight:600}
& em{font-size:10px;font-style:normal;color:#73747b}
}
.ea-tk-fill{flex:1;border-top:6px solid #f1f1f2;background:#f8f8f8}
.ea-tk-bb{display:flex;align-items:center;height:46px;border-top:1px solid #f1f1f2;background:#fff;
& .ico{width:15px;height:15px}
}
.ea-tk-b1{display:grid;flex:none;justify-items:center;gap:1px;width:42px;
& em{font-size:8.5px;font-style:normal;color:#73747b}
}
.ea-tk-b2,.ea-tk-b3{display:grid;flex:1;place-items:center;height:34px;margin-left:4px;padding:0 4px;border-radius:3px;font-size:10px;font-weight:700;line-height:1.15;text-align:center}
.ea-tk-b2{flex:1.25;border:1px solid #161823}
.ea-tk-b3{margin-right:8px;background:#fe2c55;color:#fff}
}

/* ================= TikTok Seller Center: table layouts (videos, creators, samples, orders, returns, violations) ================= */
.sa{
.wa-ap.is-ttk{
.ea-vd .ea-it-t b,.ea-sr .ea-it-t b{white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.ea-fc .ea-cr b,.ea-sr .ea-cr b{white-space:normal}
.ea-ot td{overflow:visible}
.ea-ot .ea-btn{max-width:82px}
.ea-btn + .sa-dot{vertical-align:top;margin:-6px 0 0 -11px}
.ea-bd{position:relative;display:inline-block;max-width:100%;vertical-align:top}
.ea-bd > .sa-dot{position:absolute;right:-9px;top:-7px;margin:0}
.ea-bd.is-l > .sa-dot{right:auto;left:19px}
}
}
@container (min-width:561px){
.sa .wa-ap.is-ttk{
.ea-vd,.ea-fc,.ea-sr,.ea-rt,.ea-vn{table-layout:fixed;width:100%;
& th{padding-left:8px;padding-right:8px;white-space:normal;line-height:1.3;vertical-align:middle}
& td{padding:9px 8px;white-space:normal;max-width:none;overflow:visible;vertical-align:middle}
& th:first-child,& td:first-child{padding-left:12px}
}
.ea-sr td:last-child,.ea-fc td:last-child{white-space:nowrap}
.ea-rt td:nth-child(3),.ea-vn td:first-child{white-space:nowrap}
}
}
@container (max-width:560px){
.sa .ea-sr.ea-stk td:nth-child(2){grid-column:1/-1}
}
@container (max-width:430px){
.sa .wa-ap.is-ttk:has(.ea-dlg) .wa-ap-body{min-height:590px}
}

/* ================= Website bán hàng: product data (Woo import, Shopee bulk update, Merchant Center source) ================= */
.sa{
.ea-fl{display:flex;align-items:center;gap:8px;margin:0;padding:10px 14px 6px;font-size:12.5px;color:#3c4043;
& .ico{flex:none;width:15px;height:15px;color:#5f6368}
& b{min-width:0;overflow:hidden;font-weight:500;text-overflow:ellipsis;white-space:nowrap}
& em{margin-left:auto;font-size:11.5px;font-style:normal;color:#757575;white-space:nowrap}
}
.ea-mpt td{padding:7px 8px 7px 10px;vertical-align:middle;white-space:normal;max-width:none}
.ea-mpt .ea-in{min-height:28px;padding:2px 9px}
.ea-mp-c{display:block;font:600 12px/1.4 Consolas,"Courier New",monospace;color:#1d2327}
.ea-mp-s{display:block;max-width:260px;overflow:hidden;font-size:11px;font-style:normal;color:#757575;text-overflow:ellipsis;white-space:nowrap;
& code{font:11px Consolas,"Courier New",monospace;color:#50575e}
}
.wa-ap.is-wp .ea-in{border-color:#8c8f94;border-radius:3px}
.wa-ap.is-wp .ea-btn{border-radius:3px}
.wa-ap.is-wp .ea-stp{padding-top:4px}
.ea-src{display:flex;align-items:center;gap:12px;padding:12px 14px 10px}
.ea-src-t{display:grid;flex:1;min-width:0;gap:1px;
& b{overflow:hidden;font-size:13px;font-weight:500;color:#202124;text-overflow:ellipsis;white-space:nowrap}
& em{font-size:11.5px;color:#5f6368}
}
.ea-gs{position:relative;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(3,minmax(0,1fr));gap:2px;flex:none;width:26px;height:34px;padding:11px 5px 5px;background:#0f9d58;clip-path:polygon(0 0,68% 0,100% 20%,100% 100%,0 100%);
& i{border-radius:1px;background:#fff}
&::before{content:"";position:absolute;top:0;right:0;width:32%;height:20%;background:#0b7a43}
}
.ea-er td{max-width:none;vertical-align:top;white-space:normal}
.ea-wk td:first-child{white-space:nowrap}
.ea-bar{margin-top:4px}
.ea-neg{color:#d93025;font-weight:500}
}

/* ================= Website bán hàng: carrier portal (GHN look-alike), label, bank ================= */
.sa{
.wa-ap.is-ghn{--ap-top:#fff;--ap-ink:#2a335c;--ap-acc:#f26522;--ap-on:#fff1e9;--ap-onink:#d9500d;--ap-nav:#fff;--ap-main:#f4f5f7;--ap-navw:158px}
.wa-ap.is-ghn .wa-ap-top{padding:7px 14px;border-color:#ececec}
.wa-ap.is-ghn .wa-ap-brand{font-size:14.5px}
.wa-ap.is-ghn .wa-ap-brand b{font-weight:800;letter-spacing:.3px;color:#f26522}
.wa-ap.is-ghn .wa-ap-brand i:not(.sa-dot){border-radius:5px;background:#f26522;font-size:12px}
.wa-ap.is-ghn .wa-ap-prop{border-radius:6px;border-color:#e3e5e8;color:#46527e}
.wa-ap.is-ghn .wa-ap-search{border-radius:6px;background:#f4f5f7}
.wa-ap.is-ghn .wa-ap-av{background:#f26522}
.wa-ap.is-ghn .wa-ap-nav{padding:6px 0;border-color:#efefef}
.wa-ap.is-ghn .wa-an{padding:9px 14px;border-radius:0;font-size:12.5px}
.wa-ap.is-ghn .wa-an.is-on{box-shadow:inset 3px 0 #f26522;font-weight:600}
.wa-ap.is-ghn .wa-ap-head h3{font-size:18px;font-weight:600;color:#2a335c}
.wa-ap.is-ghn .wa-ap-head span{color:#718096}
.wa-ap.is-ghn .sa-gc{border-color:#e4e7eb;border-radius:6px}
.wa-ap.is-ghn .sa-gh{font-size:13.5px;font-weight:600;color:#2a335c}
.wa-ap.is-ghn .sa-gtabs b{box-shadow:inset 0 -2px #f26522;font-weight:600;color:#d9500d}
.wa-ap.is-ghn .wa-tb th{background:#fafafa;font-weight:600;color:#718096}
.wa-ap.is-ghn .wa-k b{font-size:19px;font-weight:600;color:#2a335c}
.wa-ap.is-ghn .wa-k.is-g b{color:#2f855a}
.wa-ap.is-ghn .wa-k.is-y b{color:#b7791f}
.wa-ap.is-ghn .ea-fr{grid-template-columns:minmax(0,1fr);gap:3px;padding:6px 14px}
.wa-ap.is-ghn .ea-fr > label{padding-top:0;font-size:11.5px;text-align:left;color:#718096}
.wa-ap.is-ghn .ea-in{border-radius:4px;border-color:#d7dbe0}
.wa-ap.is-ghn .ea-in > em{overflow:visible;white-space:normal}
.wa-ap.is-ghn .ea-btn{border-radius:4px}
.wa-ap.is-ghn .ea-tt b{color:#d9500d}
.ea-gh{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:12px;align-items:start}
.ea-gh-s .ea-dl > div{display:flex;justify-content:space-between;gap:8px}
.ea-gh-s .ea-dl dd{text-align:right}
.ea-gh-m,.ea-gh-s{display:grid;gap:10px;min-width:0}
.ea-gh-b{display:flex;gap:8px;
& > *{flex:1}
}
.ea-2c{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
& .ea-fr:first-child{padding-right:6px}
& .ea-fr:last-child{padding-left:6px}
}

.wa-ap.is-bank{--ap-top:#fff;--ap-ink:#26332f;--ap-acc:#0b6b4f;--ap-on:#e4f2ec;--ap-onink:#0b6b4f;--ap-nav:#fff;--ap-main:#f3f6f5;--ap-navw:138px}
.wa-ap.is-bank .wa-ap-top{padding:7px 14px;border-color:#e3e9e6}
.wa-ap.is-bank .wa-ap-brand{font-size:14.5px;color:#0b6b4f}
.wa-ap.is-bank .wa-ap-brand b{font-weight:700}
.wa-ap.is-bank .wa-ap-brand i:not(.sa-dot){border-radius:50%;background:#0b6b4f}
.wa-ap.is-bank .wa-ap-prop{border-radius:6px;border-color:#d6e0dc;color:#3d4f48}
.wa-ap.is-bank .wa-ap-av{background:#0b6b4f}
.wa-ap.is-bank .wa-ap-nav{padding:6px 0;border-color:#e3e9e6}
.wa-ap.is-bank .wa-an{padding:9px 14px;border-radius:0}
.wa-ap.is-bank .wa-an.is-on{box-shadow:inset 3px 0 #0b6b4f;font-weight:600}
.wa-ap.is-bank .wa-ap-head h3{font-size:18px;font-weight:600;color:#1d2b26}
.wa-ap.is-bank .wa-ap-head span{color:#5c6f68}
.wa-ap.is-bank .sa-gc{border-color:#dfe7e3;border-radius:6px}
.wa-ap.is-bank .sa-gh{font-size:13.5px;font-weight:600;color:#1d2b26}
.wa-ap.is-bank .wa-tb th{background:#f5f8f7;font-weight:600;color:#5c6f68}
.wa-ap.is-bank .wa-k b{font-size:17px;font-weight:600;color:#1d2b26}
.ea-bk-t{font:11px/1.45 Consolas,"Courier New",monospace;color:#26332f}
.ea-bkt td:nth-child(2){white-space:normal;max-width:none}
.ea-bkt td:nth-child(3){color:#c0392b}
.ea-bkt td:nth-child(4){font-weight:600;color:#0b6b4f}
.ea-bkt td:nth-child(5){font-weight:500}

.ea-pdf{display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:auto 1fr;min-height:390px;background:#525659}
.ea-pdf-bar{display:flex;align-items:center;gap:14px;padding:8px 14px;background:#323639;font-size:12px;color:#e8eaed}
.ea-pdf-n{display:flex;align-items:center;flex:1;gap:8px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
& .ico{flex:none;width:14px;height:14px;color:#bdc1c6}
}
.ea-pdf-p,.ea-pdf-z{flex:none;padding:2px 9px;border-radius:3px;background:#0000002e;white-space:nowrap}
.ea-pdf-pg{display:grid;place-items:start center;padding:16px 12px 20px}
.ea-lb{position:relative;width:min(100%,300px);padding:12px 14px 14px;overflow:hidden;background:#fff;box-shadow:0 2px 12px #0007;font-size:11px;line-height:1.4;color:#111;
&::after{content:"MẪU";position:absolute;inset:0;display:grid;place-items:center;font-size:96px;font-weight:800;letter-spacing:6px;rotate:-24deg;color:#0000000d;pointer-events:none}
}
.ea-lb-h{display:flex;align-items:baseline;gap:8px;padding-bottom:7px;border-bottom:2px solid #111;
& b{font-size:21px;font-weight:800;letter-spacing:.5px;color:#f26522}
& span{font-size:11px;font-weight:600}
& em{margin-left:auto;font-size:10.5px;color:#555}
}
.ea-lb-w{display:grid;justify-items:center;gap:5px;padding:10px 0 8px;border-bottom:1px solid #111;
& b{font:700 17px/1.2 Consolas,"Courier New",monospace;letter-spacing:3px}
}
.ea-lb-bc{display:block;width:100%;height:46px;fill:#111}
.ea-lb-a,.ea-lb-g{border-bottom:1px solid #111}
.ea-lb-r{display:grid;grid-template-columns:70px minmax(0,1fr);gap:6px;margin:0;padding:6px 0;
& em{padding-top:1px;font-size:9.5px;font-weight:700;text-transform:uppercase;color:#555}
& span{font-size:11px;line-height:1.45;overflow-wrap:anywhere}
& b{font-weight:700}
}
.ea-lb-a .ea-lb-r + .ea-lb-r{border-top:1px dashed #999}
.ea-lb-c{display:flex;align-items:center;gap:10px;padding-top:9px;
& span{display:grid;flex:1;min-width:0;gap:2px}
& em{font-size:9.5px;font-weight:700;text-transform:uppercase;color:#555}
& b{font-size:19px;font-weight:800;line-height:1.15}
& i{font-size:10px;color:#555}
}
.ea-lb-qr{flex:none;width:70px;height:70px;fill:#111}
}
@container (max-width:560px){
.sa .ea-gh{grid-template-columns:minmax(0,1fr)}
.sa .wa-kp>.wa-k:last-child:nth-child(odd){grid-column:1/-1}
}
@container (max-width:639px){
.sa .wa-kp.ea-kw,.sa .wa-kp.ea-kl{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@container (max-width:340px){
.sa .wa-ap .wa-kp.ea-kw,.sa .wa-ap .wa-kp.ea-kl{grid-template-columns:minmax(0,1fr)}
}
@container (min-width:640px){
.sa .wa-kp.ea-kw{grid-template-columns:minmax(0,.8fr) minmax(0,.8fr) minmax(0,1.5fr) minmax(0,.8fr)}
.sa .wa-kp.ea-kl{grid-template-columns:minmax(0,.45fr) minmax(0,1.2fr) minmax(0,1fr) minmax(0,1.2fr)}
.sa .wa-kp.ea-kl.ea-kv{grid-template-columns:repeat(4,minmax(0,1fr))}
}
.sa .sa-sh-grid td.nw{white-space:nowrap}
@container (max-width:430px){
.sa .sa-sh-grid table{font-size:11px}
.sa .sa-sh-grid :is(th,td){padding:4px 3px}
.sa .sa-sh-grid td .sa-chip{padding:0 5px;font-size:10px}
.sa .sa-sh-grid td .sa-dot{width:15px;height:15px;margin-left:3px}
}
@container (max-width:430px){
.sa .ea-2c{grid-template-columns:minmax(0,1fr)}
.sa .ea-2c .ea-fr:first-child{padding-right:12px}
.sa .ea-2c .ea-fr:last-child{padding-left:12px}
.sa .ea-fl em{display:none}
.sa .wa-tb.ea-mpt thead{display:none}
.sa .wa-tb.ea-mpt,.sa .wa-tb.ea-mpt tbody{display:block}
.sa .wa-tb.ea-mpt tr{display:block;padding:8px 10px 9px;border-bottom:1px solid #f1f3f4}
.sa .wa-tb.ea-mpt td{display:block;padding:2px 0;border:0;max-width:none}
.sa .ea-mp-s{max-width:100%}
}

/* ================= Website bán hàng: the three-channel report (Looker Studio look-alike) ================= */
.sa{
.wa-ap.is-lk{--ap-top:#fff;--ap-ink:#3c4043;--ap-acc:#4285f4;--ap-on:#e8f0fe;--ap-onink:#1967d2;--ap-nav:#fff;--ap-main:#eef1f6;--ap-navw:146px}
.wa-ap.is-lk .wa-ap-top{padding:7px 14px}
.wa-ap.is-lk .wa-ap-brand{font-size:14.5px;color:#202124}
.wa-ap.is-lk .wa-ap-brand i:not(.sa-dot){border-radius:0;background:linear-gradient(#8ab4f8,#8ab4f8) 2px 100%/4px 8px no-repeat,linear-gradient(#4285f4,#4285f4) 8px 100%/4px 13px no-repeat,linear-gradient(#1a73e8,#1a73e8) 14px 100%/4px 18px no-repeat}
.wa-ap.is-lk .wa-ap-av{background:#1a73e8}
.wa-ap.is-lk .wa-an{padding:9px 14px}
.wa-ap.is-lk .wa-ap-head h3{font-size:18px;font-weight:400;color:#202124}
.wa-ap.is-lk .wa-ap-head span{color:#5f6368}
.wa-ap.is-lk .sa-gc{border-color:#e3e6ea;border-radius:4px;box-shadow:0 1px 2px #3c40431a}
.wa-ap.is-lk .sa-gh{font-size:13px;font-weight:500;color:#202124}
.wa-ap.is-lk .wa-k b{font-size:19px;font-weight:400;color:#202124}
.wa-ap.is-lk .wa-k.is-r b{color:#d93025}
.wa-ap.is-lk .wa-tb th{background:#fff;font-weight:500;color:#5f6368}
.wa-ap.is-lk .wa-tb td code{white-space:nowrap}
.wa-ap.is-lk .ea-pos{color:#188038}
.ea-ls-fn{position:relative;margin:0;padding:0 2px;font-size:11px;line-height:1.55;color:#5f6368}
.ea-ls-sq{display:inline-block;width:9px;height:9px;margin-right:7px;border-radius:2px;vertical-align:baseline}
.ea-ls-cols{display:flex;align-items:stretch;gap:16px;height:214px;padding:14px 18px 6px}
.ea-ls-col{display:grid;grid-template-rows:minmax(0,1fr) auto auto;justify-items:center;flex:1;min-width:0;gap:4px;
& b{font-size:11.5px;font-weight:600;color:#202124;white-space:nowrap}
& em{font-size:11px;color:#5f6368;white-space:nowrap}
}
.ea-ls-st{display:flex;flex-direction:column;align-self:end;gap:1px;width:min(68%,78px);overflow:hidden;border-radius:3px 3px 0 0;
& u{display:block;min-height:2px;text-decoration:none}
}
.ea-ls-lg{display:flex;flex-wrap:wrap;align-items:center;gap:4px 16px;padding:6px 16px 12px;font-size:11.5px;color:#5f6368}
.ea-ls-ld{margin-left:auto}
.ea-ls-tb tbody tr:last-child td{border-top:1px solid #bdc1c6;background:#f8f9fa}
.ea-ls-q td:nth-child(2){white-space:normal}
}

@container (max-width:430px){
.sa .ea-src{flex-wrap:wrap}
.sa .ea-src-t{flex:1 1 150px}
.sa .ea-src-t b{white-space:normal}
.sa .ea-ls-cols{gap:6px;padding:12px 10px 6px}
.sa .ea-ls-col b{font-size:9.5px;letter-spacing:-.2px}
.sa .ea-ls-col em{font-size:9.5px;text-align:center;white-space:normal}
.sa .wa-ap.is-wp .wa-tb.is-keep :is(th,td){white-space:normal}
}
/* ================= Thiết lập gian hàng: sign-up, verification, people, categories ================= */
.sa{
.wa-ap.is-shp.is-nonav .wa-ap-body,.wa-ap.is-ttk.is-nonav .wa-ap-body{grid-template-columns:minmax(0,1fr);min-height:0}
.wa-ap.is-nonav .wa-ap-nav{display:none}
.wa-ap.is-shp .ea-tg.is-on{background:#ee4d2d}
.ea-es-bar{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 14px 6px;font-size:12.5px;color:#333;
& b{font-weight:500}
}
.ea-es-vf td:nth-child(3),.ea-es-nt td:first-child{color:#757575}
.ea-es-nt td:first-child{white-space:nowrap}
.ea-es-sb td:first-child{min-width:150px}
.ea-es-sb td:nth-child(3){color:#555}
.ea-es-sc td:first-child,.ea-es-ql td:first-child{font-weight:500;color:#262626}
.ea-es-nb{margin:4px 16px 14px}
.ea-es-rec{gap:9px;
& li{align-items:flex-start;line-height:1.4}
& li > i:not(.sa-dot){margin-top:2px}
& li > span{min-width:0}
}
.ea-es-wide{width:min(94%,540px)}
.ea-es-cats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));overflow:hidden;border:1px solid #e5e5e5;border-radius:3px}
.ea-es-cl{margin:0;padding:4px 0;list-style:none;border-right:1px solid #ededed;
&:last-child{border-right:0}
& li{display:flex;align-items:center;gap:6px;padding:7px 10px;font-size:12px;line-height:1.35;color:#333}
& li > span{flex:1;min-width:0}
& li .ico{flex:none;width:10px;height:10px;color:#b5b5b5}
& li.is-on{background:#fff5f1;font-weight:500;color:#ee4d2d}
& li.is-on .ico{color:#ee4d2d}
}
.ea-es-path{display:flex;flex-wrap:wrap;align-items:center;gap:3px 6px;margin:2px 0 0;font-size:12px;line-height:1.4;color:#757575;
& b{font-weight:500;color:#333}
& .ico{flex:none;width:9px;height:9px;color:#b5b5b5}
}
}

@container (max-width:430px){
.sa .ea-es-cl li{gap:3px;padding:6px 6px;font-size:10.5px}
.sa .ea-es-cl li .ico{width:8px;height:8px}
.sa .ea-es-bar{padding:8px 10px 4px}
}
/* ================= Thiết lập gian hàng: warehouse, carriers, bank, tax, text, launch ================= */
.wa-ap.is-shp:has(.ea-es-lf) .wa-ap-body{min-height:440px}
.sa{
.ea-es-sw{margin:0;padding:0;list-style:none;
& li{display:flex;align-items:center;gap:10px;padding:11px 16px;border-top:1px solid #f1f1f1}
& li:first-child{border-top:0}
& li > span:first-child{display:grid;flex:1;min-width:0;gap:2px}
& b{font-size:12.5px;font-weight:500;color:#262626}
& em{font-size:11px;font-style:normal;line-height:1.4;color:#757575}
}
.ea-es-pad{padding:6px 16px 14px}
.ea-es-lf{display:grid;gap:4px;min-width:0;
& > em{font-size:11.5px;font-style:normal;color:#757575}
}
.ea-es-ckl{display:flex;align-items:center;gap:8px;margin:0;font-size:12px;color:#333}
.ea-es-wh td:first-child,.ea-es-fee td:first-child,.ea-es-ad td:first-child{font-weight:500;color:#262626}
.ea-es-fee td:nth-child(2),.ea-es-fee td:nth-child(4){color:#757575}
.ea-es-fee td:nth-child(3){font-weight:500;color:#262626}
.ea-es-ad td:nth-child(2){color:#555}
}
/* ================= Thiết lập gian hàng: bank, chat, policy phone, onboarding, checkout ================= */
.sa{
.ea-in.is-lock{border-color:#e5e5e5;background:#f5f5f5;color:#8c8c8c}
.ea-rd.ea-es-rdh{display:flex;flex-wrap:wrap;gap:8px 18px}
.ea-es-bk td:first-child b{font-weight:500;color:#262626}
.ea-es-bk td:nth-child(2){color:#555}
.ea-es-bk td,.ea-es-wh td{max-width:none;white-space:normal}
.ea-es-wh .ea-sub{font-weight:400}
.ea-es-cb{display:grid;gap:8px;padding:6px 16px 14px;
&:has(.ea-es-hr){padding-bottom:4px}
}
.ea-es-cbh{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:12px;color:#757575;
& em{font-style:normal}
}
.ea-es-hr{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px;font-size:12.5px;color:#333;
& > span:first-child{margin-right:4px;color:#757575}
& .ea-in{width:70px;min-height:28px;justify-content:center;padding:2px 8px}
& > i:not(.sa-dot){font-style:normal;color:#999}
}
.ea-es-qr td:first-child{font-weight:500;color:#262626;white-space:nowrap}
.ea-es-qr td:nth-child(2){line-height:1.45;color:#555}
.ea-es-ph{display:flex;align-items:center;gap:8px;padding:8px 10px;border-bottom:1px solid #eee;background:#fff;color:#ee4d2d;
&.is-t{padding:10px 12px;border-bottom:0}
&.is-t > b{flex:1;font-size:14px;font-weight:500;color:#222}
}
.ea-es-pb{flex:none;display:grid;
& .ico{width:17px;height:17px}
}
.ea-es-pt{display:flex;flex:1;justify-content:space-around;gap:2px;margin:0;padding:0;list-style:none;
& li{padding:5px 3px 6px;font-size:11px;color:#555;white-space:nowrap}
& li.is-on{box-shadow:inset 0 -2px #ee4d2d;color:#ee4d2d}
}
.ea-es-ds{margin-top:6px;padding:10px 12px 8px;background:#fff;font-size:11px;line-height:1.5;color:#222;
& h4{margin:0 0 5px;font-size:12px;font-weight:500;color:#222}
}
.ea-es-dn{margin:0 0 5px;font-weight:500}
.ea-es-dl{margin:0 0 8px;padding:0;list-style:none;
& li{margin-top:2px;color:#444}
& b{font-weight:500;color:#222}
}
.ea-es-dp{margin:10px 0 5px;padding-top:8px;border-top:1px solid #f0f0f0;font-size:11.5px;font-weight:700;letter-spacing:.02em;color:#ee4d2d}
.ea-es-pg{display:grid;gap:8px;padding:12px 16px 14px;font-size:12.5px;color:#333;
& b{font-size:15px;font-weight:600;color:#101631}
}
.ea-es-pgb{display:block;height:6px;border-radius:3px;background:#f1f1f2;
& u{display:block;height:100%;border-radius:3px;background:#fe2c55}
}
.ea-es-tk{margin:0;padding:0;list-style:none;
& li{display:flex;align-items:center;gap:10px;padding:11px 16px;border-top:1px solid #f1f1f2}
& li:first-child{border-top:0}
& li.is-todo{background:#fffafb}
& li > i:not(.sa-dot){flex:none;display:grid;place-items:center;width:18px;height:18px;border:1.5px solid #c9c9cc;border-radius:50%;background:#fff;color:#fff}
& li.is-ok > i:not(.sa-dot){border-color:#1f9d55;background:#1f9d55}
& li > i:not(.sa-dot) .ico{width:10px;height:10px}
& li > span{display:grid;flex:1;min-width:0;gap:2px}
& b{font-size:12.5px;font-weight:500;color:#101631}
& em{font-size:11px;font-style:normal;line-height:1.4;color:#757575}
& u{flex:none;font-size:12px;font-weight:500;text-decoration:none;white-space:nowrap;color:#fe2c55}
}
.ea-es-ca{position:relative;display:flex;gap:8px;padding:10px 12px 12px;background:#fff;
&::after{content:"";position:absolute;inset:auto 0 0;height:3px;background:repeating-linear-gradient(135deg,#6fa6d6 0 22px,#fff 0 28px,#f18d9b 0 50px,#fff 0 56px)}
& b{display:inline-flex;align-items:center;font-size:12px;font-weight:500;color:#222}
& p{margin:2px 0 0;font-size:11px;line-height:1.4;color:#555}
}
.ea-es-pn{flex:none;display:grid;color:#ee4d2d;
& .ico{width:15px;height:15px}
}
.ea-es-cs{margin-top:6px;padding-bottom:10px;background:#fff}
.ea-es-sn{display:flex;align-items:center;gap:6px;margin:0;padding:9px 12px 6px;font-size:12px;font-weight:500;color:#222;
& i{padding:0 4px;border-radius:2px;background:#ee4d2d;font-size:8.5px;font-style:normal;font-weight:400;line-height:1.6;color:#fff}
}
.ea-es-it{display:flex;gap:8px;padding:6px 12px;background:#fafafa;
& .ea-sh-im{flex:none;width:56px;height:56px}
& > div{display:grid;flex:1;align-content:start;gap:2px;min-width:0}
& p{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:11px;line-height:1.35;color:#222}
& em{font-size:10px;font-style:normal;color:#757575}
& b{display:flex;justify-content:space-between;font-size:11.5px;font-weight:400;color:#222}
& u{text-decoration:none;color:#757575}
}
.ea-es-rw{display:flex;align-items:flex-start;justify-content:space-between;gap:8px;margin:8px 12px 0;padding:8px 10px;border:1px solid #cfeee8;background:#f0fbf9;
& b{display:inline-flex;align-items:center;font-size:11.5px;font-weight:500;color:#222}
& em{display:block;margin-top:1px;font-size:10px;font-style:normal;color:#26aa99}
& > span{flex:none;font-size:11.5px;color:#222}
}
.ea-es-ob{display:flex;align-items:center;justify-content:flex-end;gap:10px;height:44px;padding-left:12px;border-top:1px solid #eee;background:#fff;
& > span:first-child{font-size:10.5px;color:#555}
& > span:first-child b{font-size:13px;font-weight:500;color:#ee4d2d}
}
.ea-es-btn{display:flex;align-items:center;align-self:stretch;gap:4px;padding:0 18px;background:#ee4d2d;font-size:12px;font-weight:500;color:#fff}
}
/* ================= Tối ưu sản phẩm (screens eo*): product photographs drawn as tiles, picture sets, options, reviews ================= */
.sa-ph:has(.ea-eo-vw) .mk-status{background:#111;color:#fff}
.sa{
.ea-bd{position:relative;display:inline-block;max-width:100%;vertical-align:top}
.ea-bd > .sa-dot{position:absolute;right:-9px;top:-7px;margin:0}
.ea-bd.is-l > .sa-dot{right:auto;left:19px}
.ea-eo-sh{--t:40px;position:relative;display:grid;place-items:center;flex:none;width:var(--t);height:var(--t);border-radius:3px;background:linear-gradient(160deg,#f7ead6,#ecd2a8);overflow:hidden;font-size:calc(var(--t) / 8);line-height:1;
& svg{display:block;width:calc(var(--s,1) * 56%);height:auto}
&.is-lg{--t:64px}
&.is-fit{width:100%;height:100%;border-radius:0;font-size:12px}
&.is-bad{outline:2px solid #fe2c55;outline-offset:-2px}
&.is-text svg{width:50%}
&.is-macro svg{width:150%;translate:0 -18%}
&.is-lit{background:radial-gradient(circle at 50% 38%,#ffd98c 0,#d49a4a 20%,#5a3d27 58%,#2a1d14 100%)}
&.is-lit svg{width:50%}
&.is-box svg{width:96%}
&.is-set{display:flex;align-items:flex-end;justify-content:center;gap:4%;padding-bottom:18%}
&.is-set svg{width:27%}
&.is-video{background:linear-gradient(160deg,#4d3d2f,#1d1611)}
}
.ea-eo-sh .ea-eo-bn{position:absolute;inset:16% -8% auto -8%;padding:.28em 0;background:#e0301e;font:700 1.05em/1.3 Arial,sans-serif;letter-spacing:.04em;text-align:center;text-decoration:none;color:#fff;rotate:-9deg;box-shadow:0 1px 2px #0004}
.ea-eo-sh .ea-eo-sc{display:flex;flex-direction:column;align-items:center;gap:.6em;width:100%;
& > svg{width:46%}
}
.ea-eo-sh .ea-eo-sz{display:flex;align-items:flex-end;justify-content:center;gap:6%;width:64%;
& svg{width:56%}
}
.ea-eo-sh .ea-eo-rl{position:relative;flex:none;width:12%;aspect-ratio:1/8.5;border:1px solid #a98a55;border-radius:1px;background:#fbf3df;
&::before{content:"";position:absolute;inset:0 0 0 auto;width:52%;background:linear-gradient(180deg,#7a5a2a 0 1px,transparent 1px) 0 0/100% 10% repeat-y}
}
.ea-eo-sh .ea-eo-pl{position:static;inset:auto;padding:.28em .7em;border-radius:1em;background:#fff;box-shadow:0 1px 2px #0003;font:600 .95em/1.3 Arial,sans-serif;white-space:nowrap;text-decoration:none;color:#5a4328}
.ea-eo-sh .ea-eo-pb{display:grid;place-items:center;width:3em;height:3em;border-radius:50%;background:#fffe;font-style:normal;color:#222;
& .ico{width:1.4em;height:1.4em;margin-left:.15em}
}
.ea-eo-sh .ea-eo-tm{position:absolute;inset:auto .5em .5em auto;padding:.2em .55em;border-radius:2px;background:#0009;font:500 .95em/1.3 Arial,sans-serif;text-decoration:none;color:#fff}
.ea-eo-ims{gap:9px;
& .ea-im{display:block;line-height:0;border:1px solid #e3e3e3;border-radius:3px;overflow:hidden}
& .ea-add{width:64px;height:64px}
}
.ea-add.is-lg{width:64px;height:64px}
.ea-eo-rt{display:flex;align-items:center;gap:8px;min-width:92px;
& .wa-bar{flex:1;min-width:38px}
& b{flex:none;min-width:38px;font-size:12px;font-weight:500;text-align:right;color:#222}
}
.ea-fv > .ea-eo-er{display:block;margin-top:0;font-size:11.5px;line-height:1.4;color:#fe2c55}
.ea-eo-ops{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;min-width:0}
.ea-eo-op{display:grid;justify-items:start;align-content:start;gap:7px;min-width:0;padding:8px;border:1px solid #ebebeb;border-radius:3px;background:#fafafa;
& .ea-im{display:block;line-height:0;border:1px solid #e3e3e3;border-radius:3px;overflow:hidden}
& .ea-in{position:relative;width:100%;min-height:26px;padding:2px 8px}
& .ea-in > .sa-dot{position:absolute;right:-6px;top:-8px;margin:0}
}

/* ----- the gallery of a product in the app ----- */
.ea-eo-vw{flex:1;display:flex;flex-direction:column;min-height:0;background:#111;color:#fff}
.ea-eo-vt{display:flex;align-items:center;justify-content:space-between;padding:8px 12px;
& > i{display:grid;place-items:center;width:24px;height:24px;font-style:normal}
& .ico{width:16px;height:16px}
& > b{font-size:13px;font-weight:500}
& .sa-dot{margin-left:7px;box-shadow:none}
}
.ea-eo-vi{flex:1;min-height:0;display:grid;
& > .ea-bd{display:block;width:100%;height:100%;min-height:0}
& > .ea-bd.is-l > .sa-dot{left:10px;top:10px}
}
.ea-eo-tw{position:relative;padding:9px 10px 13px;background:#111;
& > .sa-dot{position:absolute;right:4px;top:-1px;margin:0}
}
.ea-eo-tn{display:flex;gap:5px;
& li{flex:1;min-width:0;aspect-ratio:1;border:2px solid transparent;border-radius:3px;opacity:.55;overflow:hidden}
& li.is-on{border-color:#ee4d2d;opacity:1}
& li .ea-eo-sh{width:100%;height:100%;border-radius:0}
}

/* ----- the gift set seen by the buyer ----- */
.ea-eo-3{position:relative;display:flex;align-items:flex-end;gap:4px;padding:0 16px 10px;
&::before{content:"";position:absolute;inset:auto 0 0;height:30px;border-radius:3px;background:linear-gradient(180deg,#c98a3f,#b0722a);box-shadow:0 1px 3px #0003}
& svg{position:relative;display:block;width:60px;height:auto;margin-bottom:6px}
}
.ea-eo-ds{margin-top:6px;padding:10px 12px 14px;background:#fff;
& h4{display:flex;align-items:center;margin:0 0 6px;font-size:12px;font-weight:500;color:#222}
& p{margin:0 0 3px;font-size:11px;line-height:1.5;color:#444}
& ul{margin:0;padding:0 0 0 15px;list-style:disc;font-size:11px;line-height:1.55;color:#444}
}

/* ----- reviews ----- */
.ea-eo-st{display:inline-flex;font-size:12px;line-height:1;letter-spacing:.5px;white-space:nowrap;
& b,& s{font-weight:400;text-decoration:none}
& b{color:#ffb400}
& s{color:#d9d9d9}
}
.ea-pt.ea-eo-rl3 td:nth-child(n+2){white-space:normal}
.ea-pt.ea-eo-rl3 td:nth-child(2){min-width:170px}
.ea-eo-rv{display:grid;gap:3px;min-width:0;font-size:12px;line-height:1.45;color:#333;white-space:normal}
.ea-eo-rh{display:flex;align-items:center;flex-wrap:wrap;gap:2px 7px;
& > b{font-size:11.5px;font-weight:500;color:#222}
& > em{margin-left:auto;font-size:11px;font-style:normal;color:#999}
}
.ea-eo-rp{display:block;margin-top:3px;padding:6px 9px;border-left:3px solid #d9d9d9;background:#f7f7f7;font-size:11.5px;line-height:1.45;color:#555;
& > i{display:block;margin-bottom:1px;font-size:10.5px;font-style:normal;color:#8a8a8a}
}
.ea-eo-bs{display:block}
.ea-eo-ah{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px 10px;border-bottom:1px solid #eee;background:#fff;color:#ee4d2d;
& > b{flex:1;font-size:13px;font-weight:500;color:#222}
& > span{display:grid}
& .ico{width:17px;height:17px}
}
.ea-eo-as{display:flex;align-items:center;flex-wrap:wrap;gap:3px 6px;padding:10px 12px 8px;background:#fff;
& > b{font-size:24px;font-weight:500;line-height:1;color:#ee4d2d}
& > span:not(.ea-eo-st){font-size:11px;color:#757575}
& > em{margin-left:auto;font-size:11px;font-style:normal;color:#757575}
}
.ea-eo-ch{display:flex;flex-wrap:wrap;gap:5px;padding:2px 12px 10px;background:#fff;
& li{padding:3px 8px;border:1px solid #e5e5e5;border-radius:2px;font-size:10px;line-height:1.5;color:#555;white-space:nowrap}
& li.is-on{border-color:#ee4d2d;background:#fff5f1;color:#ee4d2d}
}
.ea-eo-al{margin-top:6px;background:#fff}
.ea-eo-ac{display:flex;gap:8px;padding:10px 12px;border-bottom:1px solid #f1f1f1;
& > div{display:grid;gap:3px;flex:1;min-width:0}
& > div > b{font-size:11px;font-weight:500;color:#222}
& p{margin:0;font-size:11.5px;line-height:1.45;color:#222}
& small{font-size:10px;color:#9a9a9a}
}
.ea-eo-av{display:grid;place-items:center;flex:none;width:26px;height:26px;border-radius:50%;background:#fbe9d2;font-size:12px;font-weight:700;color:#8a4b12}
.ea-eo-vr{font-size:10px;font-style:normal;color:#999}
.ea-eo-ac p.ea-eo-ar{margin-top:3px;padding:6px 8px;background:#f5f5f5;font-size:10.5px;color:#555;
& > b{display:flex;align-items:center;margin-bottom:1px;font-size:10.5px;font-weight:500;color:#222}
}
}
@container (max-width:430px){
.sa .wa-tb.ea-eo-rl3 td:nth-child(2){grid-column:1/-1}
.sa .wa-tb.ea-eo-rl3 td[data-l]::before{display:none}
.sa .ea-eo-ops{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
.sa .ea-eo-op{padding:6px}
}

/* ================= Quảng cáo sàn: sponsored cards in the Shopee app, Shopee Ads, GMV Max, funnel, Looker waterfall ================= */
.sa{
.ea-sh-im{position:relative}
.ea-sh-im > .sa-dot{position:absolute;top:4px;right:4px;margin:0}
.ea-ed-ad{position:absolute;left:0;bottom:0;padding:1px 5px;border-radius:0 3px 0 0;background:#0000008c;font-size:8.5px;line-height:1.5;text-decoration:none;color:#fff}
.ea-ed-disc{display:flex;align-items:center;justify-content:center;gap:8px;margin:6px 0 0;padding:11px 10px 7px;background:#fff;font-size:11.5px;font-weight:500;text-transform:uppercase;color:#ee4d2d;
&::before,&::after{content:"";flex:1;height:1px;background:#ee4d2d40}
}
.ea-ed-sp{display:flex;align-items:center;gap:9px;margin-top:6px;padding:9px 10px;background:#fff;
& .ea-sh-av{width:32px;height:32px;border-color:#f0f0f0;font-size:13px}
& > div{display:grid;flex:1;min-width:0}
& b{font-size:11.5px;font-weight:500;color:#222}
& em{font-size:9.5px;font-style:normal;color:#757575}
& u{flex:none;padding:3px 9px;border:1px solid #ee4d2d;border-radius:2px;font-size:10px;text-decoration:none;color:#ee4d2d}
}
.ea-pd-v.ea-ed-rt{color:#222;
&::before{content:"★";color:#ffb400}
}
.ea-ed-sel{margin-right:auto;font-size:12.5px;color:#555}
.ea-ed-it{margin:0}
.ea-ed-es{display:inline-flex;align-items:center;gap:4px;font-size:12px;color:#757575;
& b{font-size:16px;font-weight:500;color:#333}
}
.ea-ed-cm{margin-left:10px;font-size:12px;color:#757575}
.ea-ed-lo{color:#d93025}
.ea-ed-fn{display:flex;flex-direction:column;align-items:center;margin:0;padding:6px 14px 10px;list-style:none;
& > li{box-sizing:border-box}
}
.ea-ed-st{display:flex;align-items:center;justify-content:space-between;gap:10px;width:calc(42% + var(--w) * .58);padding:9px 14px;border-radius:3px;font-size:12.5px;color:#333;
& b{font-size:14px;font-weight:500}
&:nth-child(1){background:#fde4dd}
&:nth-child(3){background:#fac3b5}
&:nth-child(5){background:#f69377}
&:nth-child(7){background:#ee4d2d;color:#fff}
}
.ea-ed-fn > .ea-ed-rt{display:flex;align-items:center;padding:3px 0;font-size:11.5px;color:#757575;
& span{display:inline-flex;align-items:center;gap:4px}
& .ico{width:11px;height:11px;rotate:90deg}
}
.ea-ed-wf{display:flex;gap:6px;height:204px;padding-top:16px;box-sizing:border-box}
.ea-ed-wy{display:flex;flex:none;flex-direction:column;justify-content:space-between;width:30px;height:150px;
& em{display:block;height:0;font-size:10px;font-style:normal;line-height:0;text-align:right;color:#5f6368}
}
.ea-ed-wp{position:relative;display:flex;flex:1;min-width:0;background:repeating-linear-gradient(to bottom,#e6e8eb 0 1px,transparent 1px 37.5px)}
.ea-ed-wc{position:relative;flex:1;min-width:0;
& > em{position:absolute;inset:auto 0 0;display:flex;flex-direction:column;align-items:center;gap:2px;height:38px;padding-top:5px;box-sizing:border-box;font-size:10px;font-style:normal;color:#5f6368}
}
.ea-ed-wb{position:absolute;left:16%;right:16%;bottom:calc(38px + 150px * var(--s));height:max(2px,calc(150px * var(--w)));
&.is-g{background:#188038}
&.is-r{background:#d93025}
&.is-b{background:#1a73e8}
& > b{position:absolute;bottom:100%;left:50%;translate:-50% -2px;font-size:10px;font-weight:400;white-space:nowrap;color:#3c4043}
}
.ea-ed-wl{display:flex;justify-content:center;gap:16px;margin:8px 0 0;padding:0;list-style:none;font-size:11px;color:#5f6368;
& li{display:flex;align-items:center;gap:5px}
& i{width:10px;height:10px;border-radius:2px}
& i.is-g{background:#188038}
& i.is-r{background:#d93025}
& i.is-b{background:#1a73e8}
}
.ea-ed-ls,.ea-ed-dc,.ea-ed-ty,.ea-ed-bs{
& th{white-space:nowrap}
& td{white-space:normal;max-width:none;vertical-align:middle}
& td:nth-child(n+2){white-space:nowrap}
& td:first-child{min-width:150px}
}
.ea-ed-ls .ea-it-t b,.ea-ed-bs .ea-it-t b{white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.ea-ed-ls{
& th,& td{padding-inline:8px}
& th:first-child,& td:first-child{padding-left:16px}
& th:last-child,& td:last-child{padding-right:16px}
}
.ea-ed-rw > .ea-pd-k{width:auto;white-space:nowrap}
.ea-ed-rw > .ea-pd-v{justify-content:flex-end}
}
@container (max-width:430px){
.sa .ea-ed-wy{width:26px}
.sa .ea-ed-wb{left:10%;right:10%}
}
/* ================= Vận hành gian hàng: queue of new orders, parcel label, chat, return request, stock, weekly report ================= */
.sa{
.ea-ev-pk{display:flex;align-items:center;gap:9px;min-width:0;
& > .ea-ck{flex:none}
& > .ea-oc,& > .ea-it{flex:1;min-width:0}
}
.ea-ev-pk:has(> .ea-oc) > .ea-ck{align-self:flex-start;margin-top:1px}
.ea-ev-dl{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;padding:10px 12px;
& > span{position:relative;display:grid;gap:2px;padding:9px 12px;border:1px solid #ececec;border-radius:8px;background:#fff}
& > span.is-on{border-color:#101631;background:#f8f8f8}
& > span.is-r b{color:#fe2c55}
& em{font-size:11.5px;font-style:normal;line-height:1.3;color:#73747b}
& b{font-size:20px;font-weight:600;line-height:1.2;color:#101631}
& .sa-dot{position:absolute;top:8px;right:8px;margin:0}
}
.ea-ev-bulk{display:flex;align-items:center;gap:10px;padding:9px 12px;border-bottom:1px solid #f0f0f0;background:#fafafa;font-size:12.5px;color:#333;
& > b{font-weight:500}
& > .ea-ck{flex:none}
}
.ea-ev-bulk-a{display:inline-flex;align-items:center;margin-left:auto}
.ea-ev-ot td:nth-child(2),.ea-ev-ot td:last-child{white-space:normal}
.ea-ev-cd{display:grid;gap:2px;
& b{font-size:12.5px;font-weight:600;color:#101631}
& em{font-size:11px;font-style:normal;line-height:1.4;color:#73747b}
}
.ea-lb.is-spx .ea-lb-h b{color:#ee4d2d}
.ea-ev-lbi{display:grid;gap:3px;margin:0;padding:0;list-style:none;
& li{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:baseline;gap:6px;font-size:10.5px;line-height:1.35}
& b{font:700 9.5px/1.3 Consolas,"Courier New",monospace;color:#555}
& span{font-size:10.5px;line-height:1.35}
& i{font-style:normal;font-weight:700}
}
.ea-ev-chat{display:grid;grid-template-columns:minmax(0,44%) minmax(0,1fr);min-height:372px;border:1px solid #ebebeb;border-radius:4px;background:#fff;overflow:hidden}
.ea-ev-cl{display:flex;flex-direction:column;min-width:0;border-right:1px solid #f0f0f0}
.ea-ev-ct{display:flex;margin:0;padding:0 4px;list-style:none;border-bottom:1px solid #f0f0f0;font-size:10.5px;color:#757575;
& li{position:relative;padding:9px 5px 8px;white-space:nowrap}
& li.is-on{box-shadow:inset 0 -2px #ee4d2d;font-weight:500;color:#ee4d2d}
& .sa-dot{position:absolute;top:2px;right:-10px;margin:0}
}
.ea-ev-ci{display:block;margin:0;padding:0;list-style:none;
& li{position:relative;display:flex;align-items:center;gap:8px;min-width:0;padding:9px 10px;border-bottom:1px solid #f5f5f5}
& li.is-on{background:#fff5f1}
& li > span{display:grid;flex:1;gap:1px;min-width:0}
& b{overflow:hidden;font-size:12px;font-weight:500;line-height:1.3;color:#262626;text-overflow:ellipsis;white-space:nowrap}
& em{overflow:hidden;font-size:11px;font-style:normal;line-height:1.35;color:#8c8c8c;text-overflow:ellipsis;white-space:nowrap}
& u{position:relative;display:grid;flex:none;justify-items:end;gap:3px;font-size:10.5px;text-decoration:none;color:#9a9a9a}
& s{display:inline-grid;place-items:center;min-width:15px;height:15px;padding:0 4px;border-radius:8px;background:#ee4d2d;font-size:9.5px;font-weight:600;line-height:1;text-decoration:none;color:#fff}
& u > .sa-dot{position:absolute;top:50%;right:calc(100% + 3px);margin:0;translate:0 -50%}
}
.ea-ev-av{display:grid;place-items:center;flex:none;width:30px;height:30px;border-radius:50%;font-size:12.5px;font-style:normal;font-weight:600;color:#fff}
.ea-ev-th{display:flex;flex-direction:column;min-width:0}
.ea-ev-th-h{display:flex;align-items:center;gap:8px;padding:9px 12px;border-bottom:1px solid #f0f0f0;
& b{flex:none;font-size:12.5px;font-weight:500;color:#262626}
& em{flex:1;min-width:0;overflow:hidden;font-size:10.5px;font-style:normal;text-align:right;text-overflow:ellipsis;white-space:nowrap;color:#8c8c8c}
}
.ea-ev-ord{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:5px 9px;padding:8px 12px;border-bottom:1px solid #f0f0f0;background:#fafafa;
& > .ea-pic{grid-row:1/3}
& > span:not(.ea-pic):not(.sa-chip){display:grid;grid-column:2;gap:1px;min-width:0}
& > .sa-chip{grid-column:2;justify-self:start}
& > .sa-dot{grid-column:3;grid-row:1/3;margin:0}
& b{font-size:12px;font-weight:500;color:#262626}
& em{overflow:hidden;font-size:11px;font-style:normal;color:#757575;text-overflow:ellipsis;white-space:nowrap}
}
.ea-ev-ms{display:flex;flex:1;flex-direction:column;gap:6px;padding:10px 12px;background:#f7f7f7}
.ea-ev-day{align-self:center;margin:0;padding:1px 9px;border-radius:9px;background:#0000000d;font-size:10.5px;color:#8c8c8c}
.ea-ev-m{display:grid;justify-items:start;gap:2px;max-width:84%;margin:0;
& > span:not(.ea-ev-oc){padding:7px 10px;border:1px solid #ececec;border-radius:10px;background:#fff;font-size:12px;line-height:1.4;color:#333}
& > time{font-size:10px;color:#9a9a9a}
&.is-me{justify-self:end;justify-items:end}
&.is-card{justify-items:stretch;max-width:94%}
}
.ea-ev-oc{position:relative;display:grid;gap:6px;min-width:0;padding:8px 10px;border:1px solid #ececec;border-radius:8px;background:#fff;
& > b{padding-right:22px;font-size:12px;font-weight:600;color:#101631}
& > .sa-dot{position:absolute;top:7px;right:8px;margin:0}
& > em{display:flex;flex-wrap:wrap;align-items:center;gap:4px 6px;font-size:11.5px;font-style:normal;color:#101631}
}
.ea-ev-oi{display:flex;align-items:center;gap:7px;min-width:0;font-size:11.5px;line-height:1.35;color:#333;
& > span:not(.ea-pic){flex:1;min-width:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
& > i{flex:none;font-style:normal;color:#8c8c8c}
}
.ea-ev-qrp{border-top:1px solid #f0f0f0;background:#fff;
& ul{display:grid;margin:0;padding:0;list-style:none}
& li{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:0 8px;padding:6px 12px;border-top:1px solid #f7f7f7}
& li.is-on{background:#fff5f1}
& li > b{grid-column:1;font-size:12px;font-weight:500;color:#262626}
& li > span{grid-column:1;overflow:hidden;font-size:11px;color:#8c8c8c;text-overflow:ellipsis;white-space:nowrap}
& li > .sa-dot{grid-column:2;grid-row:1/3;margin:0}
}
.ea-ev-qh{margin:0;padding:6px 12px 4px;font-size:10.5px;font-weight:500;color:#8c8c8c}
.ea-ev-qrc{display:flex;flex-wrap:wrap;align-items:center;gap:5px 6px;padding:8px 12px;border-top:1px solid #f0f0f0;background:#fff;
& > em{margin-right:2px;font-size:10.5px;font-style:normal;color:#73747b}
& > span{position:relative;display:inline-flex;align-items:center;padding:3px 10px;border:1px solid #e3e3e4;border-radius:14px;font-size:11.5px;color:#101631}
& > span.is-on{border-color:#101631;background:#f1f1f2}
& > span > .sa-dot{position:absolute;top:-9px;right:-7px;margin:0}
}
.ea-ev-in{display:flex;align-items:center;gap:9px;padding:8px 12px;border-top:1px solid #f0f0f0;background:#fff;
& > em{flex:1;min-width:0;overflow:hidden;font-size:12px;font-style:normal;color:#b5b5b5;text-overflow:ellipsis;white-space:nowrap}
}
.ea-ev-ib{display:inline-flex;flex:none;gap:7px;color:#8c8c8c;
& .ico{width:16px;height:16px}
}
.ea-ev-send{flex:none;color:#ee4d2d;
& .ico{width:16px;height:16px}
}
.ea-ev-pf{display:flex;flex-wrap:wrap;gap:10px 12px;margin:0;padding:4px 14px 14px;list-style:none;
& li{position:relative;display:grid;justify-items:start;gap:4px;width:96px}
& li > span{position:relative;display:grid;place-items:center;width:96px;height:74px;overflow:hidden;border:1px solid #ebebeb;border-radius:4px;background:#f1ece4}
& svg{width:66px;height:auto}
& s{position:absolute;inset:0;display:grid;place-items:center;width:26px;height:26px;margin:auto;border-radius:50%;background:#000a;text-decoration:none;color:#fff}
& s .ico{width:12px;height:12px}
& u{position:absolute;right:4px;bottom:3px;padding:0 4px;border-radius:2px;background:#000b;font-size:9.5px;line-height:1.5;text-decoration:none;color:#fff}
& em{font-size:11px;font-style:normal;color:#757575}
& li > .sa-dot{position:absolute;top:-7px;right:-6px;margin:0}
}
.ea-ev-act{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:2px 0 0}
.ea-ev-pr{padding:2px 14px 12px}
.ea-ev-rh{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:6px 12px;padding:12px 14px;
& > span{display:inline-flex;align-items:center;gap:9px}
& b{font-size:14px;font-weight:600;color:#101631}
& em{font-size:12px;font-style:normal;color:#73747b}
}
.ea-ev-k{margin:2px 0 6px;padding:0 14px;font-size:12px;font-weight:500;color:#101631}
.ea-ev-tl{display:grid;margin:0;padding:8px 14px 12px 20px;list-style:none;
& li{position:relative;display:grid;gap:1px;padding:0 0 14px 16px;border-left:2px solid #e3e3e4}
& li:last-child{padding-bottom:0;border-left-color:transparent}
& li::before{content:"";position:absolute;left:-6px;top:1px;width:10px;height:10px;border:2px solid #b8b8bd;border-radius:50%;background:#fff}
& li:first-child::before{border-color:#101631;background:#101631}
& li.is-due::before{border-color:#fe2c55}
& em{font-size:11px;font-style:normal;color:#73747b}
& span{font-size:12px;line-height:1.4;color:#101631}
& li.is-due em{color:#fe2c55}
}
.ea-ev-skh{display:grid;grid-template-columns:32px minmax(0,1fr) 52px 14px 72px;gap:8px;padding:2px 0 4px;border-bottom:1px solid #f0f0f0;
& em{font-size:11px;font-style:normal;color:#8c8c8c}
& em:first-child{grid-column:1/3}
& em:nth-child(2){text-align:right}
}
.ea-ev-sk{display:grid;margin:0;padding:0;list-style:none;
& li{display:grid;grid-template-columns:32px minmax(0,1fr) 52px 14px 72px;align-items:center;gap:8px;padding:8px 0;border-bottom:1px solid #f5f5f5}
& li > span:nth-child(2){display:grid;gap:1px;min-width:0}
& b{font-size:12px;font-weight:500;line-height:1.3;color:#262626}
& em{font-size:11px;font-style:normal;color:#8c8c8c}
& s{font-size:12.5px;text-align:right;text-decoration:none;color:#757575}
& li > i:not(.sa-dot){display:grid;place-items:center;color:#bbb}
& li > i .ico{width:12px;height:12px}
& .ea-in{min-height:28px;padding:2px 8px}
}
.ea-ev-z{font-weight:600;color:#fe2c55}
.ea-ev-ed{position:relative;display:inline-flex;align-items:center;justify-content:flex-end;gap:4px;
& .ea-in{width:54px;min-height:26px;padding:1px 8px;border-color:#101631}
& > i:not(.sa-dot){display:grid;place-items:center;width:22px;height:22px;border:1px solid #e3e3e4;border-radius:6px;background:#fff;color:#73747b}
& > i.is-ok{border-color:#101631;background:#101631;color:#fff}
& > i .ico{width:11px;height:11px}
& > .sa-dot{position:absolute;top:-9px;right:-9px;margin:0}
}
.ea-ev-sl td:nth-child(2),.ea-ev-sl td:nth-child(4){white-space:normal}
.ea-ev-sl td:nth-child(2){min-width:82px}
.wa-ap.is-ttk{
.ea-ev-chat{border-color:#ececec;border-radius:8px}
.ea-ev-ct li.is-on{box-shadow:inset 0 -2px #101631;color:#101631}
.ea-ev-ci li.is-on{background:#f6f6f7}
.ea-ev-ci s{background:#fe2c55}
.ea-ev-send{color:#fe2c55}
.ea-ev-bulk{background:#f8f8f8}
}
}
@container (max-width:560px){
.sa .ea-ev-chat{grid-template-columns:minmax(0,1fr);min-height:0}
.sa .ea-ev-cl{border-right:0;border-bottom:1px solid #f0f0f0}
.sa .ea-ev-ci{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
.sa .ea-ev-ci li:nth-child(odd){border-right:1px solid #f5f5f5}
.sa .ea-ev-ms{min-height:112px}
}
@container (max-width:430px){
.sa .ea-ev-dl{gap:6px;padding:8px}
.sa .ea-ev-dl > span{padding:7px 9px}
.sa .ea-ev-bulk{flex-wrap:wrap;padding:8px 10px}
.sa .ea-ev-ct li{padding-inline:4px}
.sa .ea-ev-ci li{display:grid;grid-template-columns:auto minmax(0,1fr);grid-template-areas:"a n" "a t";gap:0 7px;padding:7px 9px}
.sa .ea-ev-ci li > .ea-ev-av{grid-area:a}
.sa .ea-ev-ci li > span{grid-area:n}
.sa .ea-ev-ci li > span em{display:none}
.sa .ea-ev-ci u{grid-area:t;display:flex;align-items:center;gap:5px}
.sa .ea-ev-ci u > .sa-dot{position:static;translate:none}
.sa .ea-ev-pf{padding-inline:10px}
.sa .ea-ev-tl{padding-inline:10px}
.sa .ea-ev-skh{display:none}
.sa .ea-ev-sk li{grid-template-columns:28px minmax(0,1fr) auto auto 52px;gap:6px}
.sa .ea-ev-sk s{text-decoration:line-through}
.sa .ea-dlg:has(.ea-ev-sk){width:calc(100% - 12px)}
.sa .ea-dlg:has(.ea-ev-sk) .ea-dlg-b{padding:10px 12px 12px}
.sa .ea-ev-tb span:nth-child(2){display:none}
}
/* ================= Content thương mại điện tử: documents, product text and pictures, photo folder, calendar, board (prefix ea-ec-) ================= */
.sa{
/* ---- documents (word processor look, built on .wa-cu-dp) ---- */
.ea-ec-dp{
& .ea-ec-dt td:first-child{white-space:nowrap}
& .ea-ec-dt{width:100%;border-collapse:collapse;font-size:12px;line-height:1.4}
& .ea-ec-dt th{padding:5px 8px;border:1px solid #dadce0;background:#f1f3f4;font-weight:600;text-align:left;color:#3c4043}
& .ea-ec-dt td{padding:5px 8px;border:1px solid #dadce0;vertical-align:top;color:#202124}
& .ea-ec-ql li{line-height:1.5}
& .ea-ec-ql em{margin-left:4px;padding:1px 7px;border-radius:9px;background:#e8f0fe;font-size:11px;color:#1967d2;white-space:nowrap}
}
.ea-ec-fd{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:0;
& > div{display:grid;gap:3px;align-content:start;min-width:0;padding:7px 9px;border:1px solid #dadce0;border-radius:4px}
& dt{display:flex;align-items:center;font-size:11px;color:#5f6368}
& dd{margin:0;font-size:12.5px;font-weight:600;color:#202124}
}
.ea-ec-dp .ea-ec-cl{display:grid;gap:7px;padding-left:0;list-style:none}
.ea-ec-ck{display:flex;align-items:center;gap:8px;font-size:12.5px;line-height:1.4;color:#202124;
& > i:not(.sa-dot){flex:none;display:grid;place-items:center;width:16px;height:16px;border:1.5px solid #80868b;border-radius:3px;background:#fff;color:#fff}
& > i:not(.sa-dot) .ico{width:11px;height:11px}
&.is-on > i:not(.sa-dot){border-color:#1a73e8;background:#1a73e8}
&.is-on > span{color:#5f6368}
}
/* the supplier's spec sheet (PDF page) */
.ea-lb.ea-ec-sp{width:min(100%,380px);padding:14px 16px 16px}
.ea-ec-sph{display:flex;align-items:baseline;flex-wrap:wrap;gap:2px 8px;padding-bottom:7px;border-bottom:2px solid #7a4a1c;
& b{font-size:15px;font-weight:800;color:#7a4a1c}
& span{font-size:11px;font-weight:600}
& em{margin-left:auto;font-size:10.5px;color:#555}
}
.ea-ec-spt{width:100%;margin:6px 0 0;border-collapse:collapse;
& th{width:44%;padding:4px 6px 4px 0;border-bottom:1px solid #ddd;font-size:10.5px;font-weight:600;text-align:left;color:#555}
& td{padding:4px 0;border-bottom:1px solid #ddd;font-size:11.5px;font-weight:700;color:#111}
}
.ea-ec-spk{margin:12px 0 0;font-size:11px;font-weight:700;color:#111}
.ea-ec-spn{margin:16px 0 0;padding-top:8px;border-top:1px dashed #999;font-size:10.5px;color:#444}

/* ---- the size-reference photo: jar beside a ruler, 8 cm and 7,5 cm marked ---- */
.ea-ec-sz{position:relative;display:block;width:100%;max-width:170px;aspect-ratio:1;overflow:hidden;border-radius:4px;container-type:inline-size;
& svg{display:block;width:100%;height:100%}
& b{position:absolute;padding:0 3px;border-radius:3px;background:#fffffff0;font-size:clamp(8px,7.4cqw,11px);font-weight:700;line-height:1.5;color:#d93025;white-space:nowrap}
& .h{left:78%;top:56%;translate:0 -50%}
& .w{left:46%;top:92%;translate:-50% -50%}
&.is-in{max-width:160px}
&.is-th{max-width:none}
&.is-sm{width:56px}
&.is-nolbl b{display:none}
}

/* ---- Shopee: description box, picture slots, video ---- */
.ea-in.ea-ec-ta{flex-direction:column;align-items:stretch;gap:3px;padding:8px 10px 6px}
.ea-in.ea-ec-ta > small{align-self:flex-end;margin-top:2px}
.ea-ec-tx{display:grid;flex:1;gap:3px;align-self:stretch;min-width:0}
.ea-ec-ln{display:block;font-size:12px;line-height:1.5;color:#333}
.ea-ec-ln .sa-dot{margin-left:5px;vertical-align:middle}
.ea-ec-im{display:block;line-height:0;
& u{font-size:10px}
& > .sa-dot{position:absolute;top:-7px;right:-7px;margin:0}
}
.ea-ec-vt{position:relative;
& > i{position:absolute;inset:0;display:grid;place-items:center}
& > i .ico{width:22px;height:22px;padding:6px;border-radius:50%;background:#0008;color:#fff}
}
.ea-ec-vd{display:flex;align-items:flex-start;gap:16px;padding:2px 0 4px}
.ea-ec-vp{position:relative;flex:none;display:grid;place-items:center;width:84px;aspect-ratio:9/16;overflow:hidden;border-radius:6px;background:linear-gradient(160deg,#f7ead6,#ecd2a8);
& > i:not(.sa-dot){position:absolute;inset:0;display:grid;place-items:center}
& > i:not(.sa-dot) .ico{width:28px;height:28px;padding:7px;border-radius:50%;background:#0008;color:#fff}
& > u{position:absolute;right:4px;bottom:4px;padding:0 5px;border-radius:3px;background:#000b;font-size:10px;line-height:1.5;text-decoration:none;color:#fff}
& > .sa-dot{position:absolute;top:4px;left:4px;margin:0}
}
.ea-ec-vf{display:grid;place-items:center;width:100%;height:100%;
& svg{width:62%;height:auto}
}
.ea-ec-vi{display:grid;flex:1;gap:8px;align-content:start;min-width:0;
& ul{display:grid;gap:3px}
& li{display:flex;gap:10px;font-size:12px}
& li em{width:78px;color:#8c8c8c}
& li b{font-weight:500;color:#333}
}
.ea-ec-vn{display:flex;align-items:center;font-size:13px;font-weight:500;line-height:1.35;color:#333;overflow-wrap:anywhere}
.ea-ec-vl{display:flex;align-items:center;gap:16px;font-size:12px;color:#8c8c8c;
& span:first-child{display:inline-flex;align-items:center;color:#2673dd}
}

/* ---- TikTok Shop: description editor with a picture inside ---- */
.ea-ec-ed{position:relative;overflow:hidden;border:1px solid #e3e3e4;border-radius:6px;background:#fff}
.ea-ec-tb{display:flex;align-items:center;gap:14px;padding:6px 12px;border-bottom:1px solid #ececec;background:#fafafa;font-size:13px;color:#101631;
& b{font-weight:800}
& > i{font-family:Georgia,serif;font-style:italic}
& u{text-decoration:underline}
& .ico{width:14px;height:14px}
}
.ea-ec-sep{width:1px;height:14px;background:#d9d9da}
.ea-ec-tbi{position:relative;display:inline-flex;
& > .sa-dot{position:absolute;top:50%;left:calc(100% + 5px);translate:0 -50%;margin:0}
}
.ea-ec-bd{padding:10px 12px 8px;font-size:12px;line-height:1.55;color:#101631;
& p{margin:0 0 4px}
}
.ea-ec-inl{position:relative;display:block;width:150px;max-width:100%;margin:6px 0 8px;
& > .sa-dot{position:absolute;top:-8px;right:-8px;margin:0}
}
.ea-ec-ct{display:block;padding:5px 12px;border-top:1px solid #f0f0f1;font-size:11px;text-align:right;color:#8a8b91}

/* ---- shared photo folder (Drive look-alike) ---- */
.ea-ec-dr{background:#f8fafd;color:#1f1f1f;font-size:12px}
.ea-ec-drt{display:flex;align-items:center;gap:14px;padding:8px 12px}
.ea-ec-drb{display:flex;align-items:center;gap:7px;
& svg{width:22px;height:auto}
& b{font-size:17px;font-weight:400;color:#5f6368}
}
.ea-ec-drs{display:flex;flex:1;align-items:center;gap:8px;max-width:340px;min-width:0;padding:7px 14px;border-radius:22px;background:#e9eef6;color:#444746;
& .ico{width:14px;height:14px}
& em{overflow:hidden;font-size:12.5px;text-overflow:ellipsis;white-space:nowrap}
}
.ea-ec-dra{display:grid;place-items:center;flex:none;width:26px;height:26px;margin-left:auto;border-radius:50%;background:#1a73e8;font-size:12px;font-weight:600;color:#fff}
.ea-ec-drw{display:grid;grid-template-columns:112px minmax(0,1fr)}
.ea-ec-drn{display:grid;align-content:start;gap:2px;padding:6px 6px 10px 10px;
& span{padding:6px 10px;border-radius:16px;font-size:11.5px;line-height:1.3;color:#1f1f1f}
& span.is-on{background:#c2e7ff;font-weight:600}
}
.ea-ec-drnew{display:flex !important;align-items:center;gap:8px;margin:0 0 8px;padding:9px 16px !important;border-radius:14px !important;background:#fff;box-shadow:0 1px 3px #0000004d;font-weight:500;
& .ico{width:14px;height:14px}
}
.ea-ec-drm{min-width:0;margin:0 8px 8px 0;padding:10px 12px 14px;border-radius:14px;background:#fff}
.ea-ec-dbc{display:flex;align-items:center;flex-wrap:wrap;gap:2px 4px;margin:0 0 8px;font-size:14px;color:#444746;
& span{white-space:nowrap}
& span.is-far::after{content:"›";margin-left:6px;color:#80868b}
& b{display:inline-flex;align-items:center;gap:3px;padding:2px 8px;border-radius:14px;font-weight:500;color:#1f1f1f}
}
.ea-ec-dfl{display:flex;gap:8px;margin:0 0 10px;
& span{display:inline-flex;align-items:center;gap:4px;padding:4px 10px;border:1px solid #747775;border-radius:8px;font-size:12px;white-space:nowrap}
}
.ea-ec-cr{display:inline-block;flex:none;width:0;height:0;margin-left:2px;border-top:5px solid currentColor;border-right:4px solid transparent;border-left:4px solid transparent}
.ea-ec-drm h6{margin:0 0 8px;font-size:12px;font-weight:500;color:#444746}
.ea-ec-dg{display:grid;grid-template-columns:repeat(auto-fill,minmax(148px,1fr));gap:10px}
.ea-ec-fc{position:relative;display:grid;gap:6px;align-content:start;min-width:0;padding:8px;border-radius:12px;background:#f0f4f9;
& p{display:flex;align-items:center;gap:6px;min-width:0;margin:0;font-size:11px}
& p > i:first-child{flex:none;display:grid;place-items:center;color:#d93025}
& p > i:first-child .ico{width:14px;height:14px}
& p b{min-width:0;overflow:hidden;font-weight:500;text-overflow:ellipsis;white-space:nowrap}
& > .sa-dot{position:absolute;top:-8px;right:-6px;z-index:2;margin:0}
}
.ea-ec-fth{position:relative;display:block;aspect-ratio:1;overflow:hidden;border-radius:8px;background:#fff;
& > .sa-dot{position:absolute;top:5px;right:5px;margin:0}
}
.ea-ec-ph{display:grid;place-items:center;width:100%;height:100%;
& svg{width:auto;height:74%}
&.is-warm{background:linear-gradient(160deg,#f7ead6,#ecd2a8)}
&.is-rose{background:linear-gradient(160deg,#fbe6e1,#f0c3bb)}
&.is-sage{background:linear-gradient(160deg,#e9eede,#cfdab9)}
&.is-sand{background:linear-gradient(160deg,#f5ecda,#e4d2ae)}
}

/* ---- month calendar (Calendar look-alike) ---- */
.ea-ec-cal{background:#fff;color:#3c4043;font-size:12px}
.ea-ec-ctb{display:flex;align-items:center;gap:10px;padding:8px 12px;border-bottom:1px solid #dadce0}
.ea-ec-cb{display:flex;align-items:center;gap:7px;
& i{display:grid;place-items:center;width:22px;height:22px;border:2px solid #4285f4;border-radius:4px;font-size:11px;font-weight:700;line-height:1;color:#4285f4}
& b{font-size:17px;font-weight:400;color:#5f6368}
}
.ea-ec-ctd{padding:5px 12px;border:1px solid #dadce0;border-radius:4px;font-size:12px;font-weight:500;white-space:nowrap;color:#3c4043}
.ea-ec-cn{display:inline-flex;gap:2px;
& i{display:grid;place-items:center;width:24px;height:24px;border-radius:50%;font-size:18px;line-height:1;color:#5f6368}
}
.ea-ec-cm{font-size:17px;font-weight:400;white-space:nowrap;color:#3c4043}
.ea-ec-cv{display:inline-flex;align-items:center;gap:6px;margin-left:auto;padding:5px 10px;border:1px solid #dadce0;border-radius:4px;font-size:12px;white-space:nowrap;
}
.ea-ec-cw{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));border-bottom:1px solid #dadce0;
& span{padding:5px 0 4px;font-size:10.5px;font-weight:500;letter-spacing:.04em;text-align:center;color:#70757a}
}
.ea-ec-cg{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));
& > div{min-width:0;min-height:72px;padding:3px 3px 4px;border-right:1px solid #dadce0;border-bottom:1px solid #dadce0}
& > div:nth-child(7n){border-right:0}
& > div > b{display:block;margin:0 0 2px;font-size:11px;font-weight:500;text-align:center;color:#3c4043}
& > div > small{display:none;font-size:10.5px;color:#70757a}
& > div.is-out > b{color:#70757a}
& > div.is-today > b{display:grid;place-items:center;width:20px;height:20px;margin:0 auto 2px;border-radius:50%;background:#1a73e8;color:#fff}
}
.ea-ec-evs{display:grid;gap:3px}
.ea-ec-ev{position:relative;display:block;padding:2px 4px;border-radius:3px;background:var(--e,#039be5);font-size:10px;line-height:1.3;color:#fff;
& em{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
& em .ico{width:10px;height:10px;margin:0 2px -1px 0}
& > .sa-dot{position:absolute;top:-8px;right:-6px;z-index:2;margin:0}
&.k-w{--e:#039be5}
&.k-a{--e:#e67c73}
&.k-s{--e:#33b679}
&.k-p{--e:#8e24aa}
&.k-r{--e:#616161}
&.is-done{background:#e8eaed;color:#3c4043}
&.is-done em .ico{color:#188038}
}

/* ---- content board (plain task board) ---- */
.ea-ec-bw{background:#f6f7f9;color:#1b223f;font-size:12px}
.ea-ec-bt{display:flex;align-items:center;flex-wrap:wrap;gap:4px 10px;padding:10px 14px;border-bottom:1px solid #e3e6ea;background:#fff;
& b{font-size:15px;font-weight:700}
& span{font-size:12px;color:#6b7280}
& .sa-chip{margin-left:auto}
}
.ea-ec-kb{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;align-items:start;padding:12px 12px 14px;
& > section{min-width:0;padding-bottom:8px;border-top:3px solid var(--c,#9aa3af);border-radius:8px;background:#eceff3}
& > section.is-todo{--c:#9aa3af}
& > section.is-doing{--c:#2563eb}
& > section.is-wait{--c:#d97706}
& > section.is-done{--c:#16a34a}
& > section > p{display:flex;align-items:center;gap:6px;padding:8px 10px 6px;font-size:12px;font-weight:700;color:#343e65}
& > section > p > i:not(.sa-dot){display:inline-grid;place-items:center;min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:#fff;font-size:11px;font-weight:600;color:#6b7280}
& > section > ul{display:grid;gap:7px;padding:0 8px}
& li{position:relative;display:grid;gap:6px;padding:8px 9px 8px 13px;border-radius:6px;background:#fff;box-shadow:0 1px 2px #0002}
& li::before{content:"";position:absolute;left:0;top:6px;bottom:6px;width:3px;border-radius:2px;background:var(--k,#6b7280)}
& li > b{font-size:11.5px;font-weight:600;line-height:1.3;color:#1b223f}
& li.k-w{--k:#2563eb}
& li.k-a{--k:#d97706}
& li.k-s{--k:#16a34a}
& li.k-p{--k:#9333ea}
& li.k-r{--k:#6b7280}
& li .m{display:flex;align-items:center;justify-content:space-between;gap:6px}
& li .m em{font-size:11px;color:#6b7280}
& li.is-more{padding:2px 4px;background:none;box-shadow:none;font-size:11px;text-align:center;color:#6b7280}
& li.is-more::before{display:none}
}
.ea-ec-av{position:relative;display:inline-grid;place-items:center;flex:none;width:20px;height:20px;border-radius:50%;font-size:11px;font-weight:700;color:#fff;
&.p-a{background:#2563eb}
&.p-b{background:#d97706}
&.p-c{background:#16a34a}
&.p-d{background:#9333ea}
& > .sa-dot{position:absolute;top:-9px;right:-9px;margin:0}
}
}
@container (min-width:640px){
.sa .ea-ec-kb{grid-template-columns:repeat(4,minmax(0,1fr))}
}
@container (max-width:430px){
.sa .ea-ec-fd{grid-template-columns:minmax(0,1fr);gap:5px}
.sa .ea-ec-fd > div{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:6px 9px}
.sa .ea-ec-vd{gap:12px}
.sa .ea-ec-vp{width:68px}
.sa .ea-ec-vi li em{width:70px}
.sa .ea-ec-drw{grid-template-columns:minmax(0,1fr)}
.sa .ea-ec-drn{display:none}
.sa .ea-ec-drm{margin:0 8px 8px}
.sa .ea-ec-drs{display:none}
.sa .ea-ec-dg{grid-template-columns:repeat(2,minmax(0,1fr))}
.sa .ea-ec-cb b,.sa .ea-ec-cv,.sa .ea-ec-ctd{display:none}
.sa .ea-ec-fc{gap:5px;padding:7px}
.sa .ea-ec-fc p > i:first-child{display:none}
.sa .ea-ec-cm{font-size:15px}
.sa .ea-ec-cw{display:none}
.sa .ea-ec-cg{display:block}
.sa .ea-ec-cg > div{display:none;min-height:0;border:0}
.sa .ea-ec-cg > div.has-ev,.sa .ea-ec-cg > div.is-today{display:grid;grid-template-columns:42px minmax(0,1fr);align-items:center;gap:0 10px;padding:7px 12px;border-bottom:1px solid #e8eaed}
.sa .ea-ec-cg > div > b{grid-column:1;grid-row:1;margin:0;font-size:15px}
.sa .ea-ec-cg > div > small{display:block;grid-column:1;grid-row:2;text-align:center}
.sa .ea-ec-cg > div > .ea-ec-evs{grid-column:2;grid-row:1/3}
.sa .ea-ec-cg > div.is-today > b{width:26px;height:26px;margin:0 auto;font-size:13px}
.sa .ea-ec-cg > div.is-today > .ea-ec-evs:empty::before{content:"Hôm nay";font-size:11.5px;color:#1a73e8}
.sa .ea-ec-ev{padding:4px 8px;font-size:11.5px}
.sa .ea-ec-ev > .sa-dot{top:-7px;right:-4px}
}
@container (max-width:330px){
.sa .ea-ec-kb{grid-template-columns:minmax(0,1fr)}
}
/* ---------- group hub (scripts/ecom-atlas/hub.mjs) ---------- */
.ea-hub-def{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:28px 48px;align-items:center;padding:30px 34px;border:1px solid var(--edge);border-radius:20px;background:linear-gradient(160deg,#ffffff0e,#ffffff05)}
.ea-hub-def h2{margin:8px 0 12px;font-size:clamp(26px,3vw,36px);line-height:1.15;letter-spacing:-.4px}
.ea-hub-def p{margin:0;font-size:16px;line-height:1.65;color:var(--text-2)}
.ea-hub-def dl{display:grid;gap:10px;margin:0}
.ea-hub-def dl>div{display:grid;grid-template-columns:92px minmax(0,1fr);gap:12px;align-items:baseline;padding:12px 14px;border-radius:12px;background:#ffffff0a;box-shadow:inset 0 0 0 1px var(--edge)}
.ea-hub-def dt{font-size:12px;font-weight:700;letter-spacing:1.2px;text-transform:uppercase;color:var(--accent)}
.ea-hub-def dd{margin:0;font-size:14.5px;line-height:1.5;color:var(--text)}
.ea-hub-route{padding:16px 22px 22px;border-radius:18px;background:linear-gradient(180deg,#f7f9fc,#e9eff6);box-shadow:0 26px 60px #0008;color:#192045}
.ea-hub-bar{display:flex;gap:6px;margin-bottom:12px}
.ea-hub-bar i{width:10px;height:10px;border-radius:50%;background:#c4cfdc}
.ea-hub-rt{display:flex;align-items:center;gap:8px;margin-bottom:14px;font-size:15px}
.ea-hub-rt .ico{width:18px;height:18px;padding:3px;border-radius:6px;background:#c0472a;color:#fff}
.ea-hub-route ul{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 18px;margin:0;padding:0;list-style:none}
.ea-hub-route li{display:grid;grid-template-columns:minmax(0,1fr) minmax(12px,32px) auto;align-items:center;gap:8px;padding:9px 10px;border-radius:12px;background:#fff;box-shadow:0 1px 3px #1920451a}
.ea-hub-pb{display:flex;align-items:center;gap:10px;font-size:14px;line-height:1.35}
.ea-hub-pb i{display:grid;place-items:center;flex:none;width:32px;height:32px;border-radius:9px;background:#eef3f8;color:#c0472a}
.ea-hub-pb .ico{width:16px;height:16px}
.ea-hub-ln{height:2px;background:repeating-linear-gradient(90deg,#b9c6d4 0 4px,#0000 4px 8px)}
.ea-hub-route a{display:inline-flex;align-items:center;gap:6px;padding:7px 12px;border-radius:999px;background:color-mix(in srgb,var(--c) 34%,#fff);color:#131a4a;font-size:13px;font-weight:650;text-decoration:none;white-space:nowrap;box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--c) 80%,#131a4a);transition:transform .2s ease}
.ea-hub-route a .ico{width:14px;height:14px}
.ea-hub-route a:hover{transform:translateX(3px)}
.ea-hub-group{margin-top:40px}
.ea-hub-group:first-child{margin-top:6px}
.ea-hub .ea-hub-gh{display:flex;align-items:center;gap:10px;margin:0 0 16px;font-size:13px;font-weight:600;letter-spacing:1.6px;text-transform:uppercase;color:var(--accent)}
.ea-hub-gh .ico{width:18px;height:18px}
.ea-hub-gh em{flex:none;margin-left:auto;white-space:nowrap;font-size:12px;font-style:normal;letter-spacing:.4px;text-transform:none;color:var(--text-3)}
.ea-hub-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:18px}
.ea-hub-card{grid-column:span 2;position:relative;display:grid;grid-template-rows:auto 1fr;min-width:0;overflow:hidden;border:1px solid var(--edge);border-radius:18px;background:var(--surface);transition:transform .35s ease,border-color .35s ease,box-shadow .35s ease}
.ea-hub-card:nth-child(3n+1):nth-last-child(2),.ea-hub-card:nth-child(3n+2):last-child{grid-column:span 3}
.ea-hub-card:hover{transform:translateY(-5px);border-color:color-mix(in srgb,var(--c) 55%,transparent);box-shadow:0 24px 50px #0009,0 0 0 1px color-mix(in srgb,var(--c) 22%,transparent)}
.ea-hub-art{position:relative;display:block;height:232px;overflow:hidden;padding:18px 18px 0;border-bottom:1px solid var(--edge);background:radial-gradient(120% 110% at 0 0,color-mix(in srgb,var(--c) 34%,#0e1340),#0b1038 72%)}
.ea-hub-art::after{content:"";position:absolute;inset:auto 0 0;height:48px;background:linear-gradient(#0b103800,#0b1038cc);pointer-events:none}
.ea-hub-art .sa-th{transition:transform .7s cubic-bezier(.2,.7,.2,1)}
.ea-hub-card:hover .ea-hub-art .sa-th{transform:translateY(-10px)}
.ea-hub-body{display:grid;align-content:start;gap:9px;padding:16px 22px 22px}
.ea-hub-meta{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:12px;letter-spacing:1px;color:var(--c)}
.ea-hub-meta em{font-style:normal;letter-spacing:.3px;color:var(--text-3)}
.ea-hub .ea-hub-body h3{margin:0;font-size:19px;line-height:1.3;letter-spacing:-.2px}
.ea-hub-body h3 a{color:var(--text);text-decoration:none}
.ea-hub-body h3 a::after{content:"";position:absolute;inset:0;z-index:2}
.ea-hub-body h3 a:focus-visible{outline:none}
.ea-hub-body h3 a:focus-visible::after{border-radius:18px;box-shadow:inset 0 0 0 2px var(--c)}
.ea-hub-body p{margin:0;font-size:14px;line-height:1.55;color:var(--text-3)}
.ea-hub-tags{display:flex;flex-wrap:wrap;gap:6px}
.ea-hub-tags i{padding:3px 9px;border-radius:999px;background:#ffffff0d;box-shadow:inset 0 0 0 1px var(--edge);font-size:12px;font-style:normal;color:var(--text-2)}
.ea-hub-tags i.is-more{color:var(--c)}
.ea-hub-go{display:inline-flex;align-items:center;gap:6px;margin-top:4px;font-size:13.5px;font-weight:600;color:var(--c)}
.ea-hub-go .ico{width:16px;height:16px;transition:transform .25s ease}
.ea-hub-card:hover .ea-hub-go .ico{transform:translateX(4px)}
@media(max-width:1000px){
.ea-hub-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.ea-hub-card,.ea-hub-card:nth-child(3n+1):nth-last-child(2),.ea-hub-card:nth-child(3n+2):last-child{grid-column:auto}
.ea-hub-card:last-child:nth-child(odd){grid-column:1/-1}
.ea-hub-route ul{grid-template-columns:minmax(0,1fr)}
}
@media(max-width:860px){.ea-hub-def{grid-template-columns:minmax(0,1fr);padding:22px 20px}}
@media(max-width:620px){
.ea-hub-grid{grid-template-columns:minmax(0,1fr)}
.ea-hub-card:last-child:nth-child(odd){grid-column:auto}
.ea-hub-art{height:208px;padding:14px 14px 0}
.ea-hub-body{padding:14px 18px 20px}
.ea-hub-route{padding:14px 14px 16px}
.ea-hub-route li{grid-template-columns:minmax(0,1fr)}
.ea-hub-ln{display:none}
.ea-hub-route a{justify-self:start}
.ea-hub-def dl>div{grid-template-columns:minmax(0,1fr);gap:4px}
}
/*@@next*/