/* AEM Work production shell: the shared navigation stays the single app header. */
body[data-aem-page=suite] #aem-overview .aem-follow-actor,
body[data-aem-page=suite] #aem-overview .aem-local-presence{display:none!important}
body[data-aem-page=suite] #aem-overview .aem-standard-drawer{max-height:calc(100dvh - var(--aem-header) - 24px);overflow:auto}
body[data-aem-page=suite] #aem-overview a{overflow-wrap:anywhere}
@media(max-width:760px){body[data-aem-page=suite] #aem-overview .aem-standard-drawer{max-width:calc(100vw - 16px);max-height:calc(100dvh - var(--aem-header) - 16px)}}
@media(max-width:760px){
 body[data-aem-page=suite] #aem-overview.aem-shell #ao-sidebar .aem-task-layout{display:flex!important;flex-direction:column!important;min-width:0!important;height:auto!important;overflow:visible!important}
 body[data-aem-page=suite] #aem-overview.aem-shell #ao-sidebar :is(.aem-task-primary,.aem-task-secondary){width:100%!important;min-width:0!important;height:auto!important;max-height:none!important;overflow:visible!important;padding:12px!important;box-sizing:border-box}
 body[data-aem-page=suite] #aem-overview.aem-shell #ao-sidebar .aem-task-context .aem-task-control-row{grid-template-columns:repeat(2,minmax(0,1fr))!important}
 body[data-aem-page=suite] #aem-overview.aem-shell #ao-sidebar>.aem-drawer-tools{display:flex!important;flex-wrap:wrap!important;gap:10px!important;position:sticky;top:0;z-index:5}
 body[data-aem-page=suite] #aem-overview.aem-shell #ao-sidebar>.aem-drawer-tools>span{flex:1 1 100%!important;min-width:0!important}
 body[data-aem-page=suite] #aem-overview.aem-shell #ao-sidebar .aem-title-meta{display:flex;flex-wrap:wrap;gap:6px}
 body[data-aem-page=suite] #aem-overview.aem-shell #ao-sidebar :is(input,textarea,select){font-size:16px!important}
 body[data-aem-page=suite] #aem-overview.aem-shell #aem-chat-share.aem-standard-drawer{inset:calc(var(--aem-header) + 8px) 8px auto!important;transform:none!important;width:auto!important;max-height:calc(100dvh - var(--aem-header) - 16px)!important}
}

/* Keep the production sidebar free of duplicate workspace identity. */
#aem-overview .aem-sidebar-footer{display:none!important}

#aem-overview #aem-sidebar .aem-profile{display:none!important}

/* Overview toolbar as in the demo: 10px inner padding (aem-design.css set 12px 0, so controls touched
   the border). The search box starts at 150px, like the demo, and only grows into spare room: a larger
   starting size pushed the last control (Giai đoạn) onto a second row on wide screens. */
html body #aem-overview#aem-overview.aem-shell #ao-overview-panel .ao-tools.ao-tools{padding:10px!important;gap:7px!important}
html body #aem-overview#aem-overview.aem-shell #ao-overview-panel .ao-tools.ao-tools>.aem-search-control{flex:1 1 150px!important;width:auto!important;min-width:0!important;max-width:none!important}

/* Work keeps the demo's system font stack. aem-design.css sets Arial on every page with an !important rule, so this one is more specific. */
body[data-aem-page=suite] #aem-overview#aem-overview,body[data-aem-page=suite] #aem-overview#aem-overview :is(button,input,select,textarea,table,th,td,a,p,span,div,label,li,h1,h2,h3,h4,h5,strong,small,em,summary,dialog,section,header,nav){font-family:system-ui,-apple-system,"Segoe UI",Roboto,Arial,"Segoe UI Emoji","Apple Color Emoji","Noto Color Emoji","Segoe UI Symbol","Noto Sans Symbols 2",sans-serif!important}

/* Trợ lý AEM chưa bật (cờ ASST_FEATURE trong work-app.js): ẩn mọi lối vào ✦. */
html:not(.aem-assistant-on) [data-acm-assistant]{display:none!important}
/* Trợ lý AEM: nút ✦ trên thanh đầu trang, cùng cỡ với nút đổi giao diện. */
#aem-global-header #aem-assistant-button{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;flex:0 0 40px;padding:9px;border:1px solid transparent;border-radius:8px;background:transparent;color:var(--aem-ink);cursor:pointer}
#aem-global-header #aem-assistant-button:hover{background:var(--aem-soft)}
#aem-global-header #aem-assistant-button svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
@media(max-width:760px){#aem-global-header #aem-assistant-button{width:36px;flex-basis:36px;padding:8px}}

/* Thanh công cụ Tổng quan. Từ 1650px: một hàng, các ô lọc tự co lại cho vừa (ô ngày giữ nguyên). Dưới 1650px: hai hàng gọn (bộ lọc + Giai đoạn / các nút kỳ và thao tác), không để nút lẻ rớt xuống hàng. */
@media(min-width:1650px){
 html body #aem-overview#aem-overview.aem-shell #ao-overview-panel .ao-tools.ao-tools{flex-wrap:nowrap!important}
 html body #aem-overview#aem-overview.aem-shell #ao-overview-panel .ao-tools.ao-tools>button{flex:0 0 auto!important;padding-left:9px!important;padding-right:9px!important}
 html body #aem-overview#aem-overview.aem-shell #ao-overview-panel .ao-tools.ao-tools>:is(select,input){flex:0 1 auto!important;min-width:0!important}
 html body #aem-overview#aem-overview.aem-shell #ao-overview-panel .ao-tools.ao-tools>#ao-filter{min-width:74px!important}
 html body #aem-overview#aem-overview.aem-shell #ao-overview-panel .ao-tools.ao-tools>#ao-clientfilter{min-width:84px!important}
 html body #aem-overview#aem-overview.aem-shell #ao-overview-panel .ao-tools.ao-tools>#ao-statusfilter{min-width:98px!important}
 html body #aem-overview#aem-overview.aem-shell #ao-overview-panel .ao-tools.ao-tools>#ao-period{min-width:84px!important}
 html body #aem-overview#aem-overview.aem-shell #ao-overview-panel .ao-tools.ao-tools>#ao-depth{min-width:98px!important}
 html body #aem-overview#aem-overview.aem-shell #ao-overview-panel .ao-tools.ao-tools>#ao-anchor{min-width:118px!important}
 html body #aem-overview#aem-overview.aem-shell #ao-overview-panel .ao-tools.ao-tools>.aem-search-control{flex:1 1 112px!important;min-width:112px!important;max-width:none!important}
}
@media(max-width:1649px){
 html body #aem-overview#aem-overview.aem-shell #ao-overview-panel .ao-tools.ao-tools>#ao-depth{order:1!important}
 html body #aem-overview#aem-overview.aem-shell #ao-overview-panel .ao-tools.ao-tools::after{content:"";order:2;flex:0 0 100%;height:0}
 html body #aem-overview#aem-overview.aem-shell #ao-overview-panel .ao-tools.ao-tools>button{order:3!important}
}

/* Tin nhắn trên điện thoại: cỡ chữ, ảnh đại diện và khoảng cách nhỏ lại như app nhắn tin (tiêu đề 20px, tên 15,5px, xem trước 13px, ảnh 46px, ô tìm nền bo tròn). */
@media(max-width:700px){
 html body #aem-overview#aem-overview #aem-messages-panel .acm-left>header{padding-top:10px!important;padding-bottom:4px!important}
 html body #aem-overview#aem-overview #aem-messages-panel .acm-left>header h2{font-size:20px!important;font-weight:700!important;line-height:1.2!important}
 html body #aem-overview#aem-overview #aem-messages-panel .acm-left>header .acm-ib{width:36px!important;height:36px!important}
 html body #aem-overview#aem-overview #aem-messages-panel .acm-left>header .acm-ib svg{width:20px!important;height:20px!important}
 html body #aem-overview#aem-overview #aem-messages-panel .acm-left>header .acm-me .acm-av{width:30px!important;height:30px!important;font-size:12px!important}
 html body #aem-overview#aem-overview #aem-messages-panel .acm-left .acm-search{margin:6px 14px 8px!important;padding:0 12px!important;border:0!important;border-radius:10px!important;background:rgba(127,127,127,.13)!important;height:38px!important}
 html body #aem-overview#aem-overview #aem-messages-panel .acm-left .acm-search input{font-size:16px!important;height:38px!important;background:transparent!important}
 html body #aem-overview#aem-overview #aem-messages-panel .acm-left .acm-ch{grid-template-columns:46px minmax(0,1fr) auto!important;column-gap:11px!important;padding:8px 14px!important;min-height:60px!important}
 html body #aem-overview#aem-overview #aem-messages-panel .acm-left .acm-ch>.acm-av,html body #aem-overview#aem-overview #aem-messages-panel .acm-left .acm-ch>[class*=acm-av]{width:46px!important;height:46px!important;font-size:14px!important}
 html body #aem-overview#aem-overview #aem-messages-panel .acm-left .acm-ch .acm-nm{font-size:15.5px!important}
 html body #aem-overview#aem-overview #aem-messages-panel .acm-left .acm-ch .acm-pv{font-size:13px!important}
 html body #aem-overview#aem-overview #aem-messages-panel .acm-left .acm-ch .acm-tm{font-size:12px!important}
 html body #aem-overview#aem-overview #aem-messages-panel .acm-left .acm-btabs button svg{width:20px!important;height:20px!important}
 html body #aem-overview#aem-overview #aem-messages-panel .acm-left .acm-btabs button{min-height:48px!important}
}

/* Ô tìm trong Tin nhắn (máy tính): hiện gợi ý phím tắt Ctrl K; ẩn khi đang gõ/đang chọn ô và trên điện thoại. */
#aem-messages-panel .acm-left .acm-search{position:relative}
#aem-messages-panel .acm-left .acm-search input{padding-right:62px}
#aem-messages-panel .acm-left .acm-search .acm-kbd{position:absolute;right:8px;top:50%;transform:translateY(-50%);font:inherit;font-size:11px;line-height:16px;color:#8a8a8a;border:1px solid rgba(127,127,127,.35);border-radius:5px;padding:0 6px;background:rgba(127,127,127,.08);pointer-events:none;white-space:nowrap}
#aem-messages-panel .acm-left .acm-search input:focus~.acm-kbd,#aem-messages-panel .acm-left .acm-search input:not(:placeholder-shown)~.acm-kbd{display:none}
@media(max-width:700px),(hover:none){#aem-messages-panel .acm-left .acm-search .acm-kbd{display:none}#aem-messages-panel .acm-left .acm-search input{padding-right:0}}

/* Điện thoại: mọi ô nhập trong Tin nhắn tối thiểu 16px (iPhone tự phóng to khi chữ nhỏ hơn); chặn chạm đúp/kéo hai ngón phóng to trong vùng Tin nhắn. */
@media(max-width:700px){
 html body #aem-overview#aem-overview #aem-messages-panel :is(input,textarea,select,[contenteditable=true]),#acm-pop :is(input,textarea,select,[contenteditable=true]){font-size:16px!important}
 #aem-messages-panel,#acm-pop{touch-action:pan-x pan-y}
}
/* Tin nhắn trên điện thoại: trang không cuộn/kéo lệch (trước đây thân trang dài hơn màn 112px nên kéo được, để lại khoảng trống phía trên);
   khi mở một cuộc trò chuyện thì toàn màn hình như app nhắn tin (ẩn thanh đầu trang, nút ‹ để quay lại). */
@media(max-width:700px){
 html:has(#aem-overview.aem-messages-mode),html:has(#aem-overview.aem-messages-mode) body{overflow:hidden!important;height:100%!important;overscroll-behavior:none}
 html.acm-phone-chat #aem-global-header{display:none!important}
 html.acm-phone-chat{--suite-bar-h:0px!important}
 html.acm-phone-chat #aem-messages-panel{top:0!important;height:100dvh!important}
}
