/* App launcher — trích từ 1Office */
:root {
  --platform-app-orange:#F0500A;
  --platform-app-orange-hover:#DD4A09;
  --platform-app-orange-outline:#F7A784;
  --platform-app-orange-text:#C54208;
  --platform-app-orange-border:#FCD8C9;
  --platform-app-orange-background:#FEF1EC;
  --platform-app-green:#13CE74;
  --platform-app-green-hover:#14BC6B;
  --platform-app-green-outline:#8AE3B8;
  --platform-app-green-text:#11A45D;
  --platform-app-green-border:#C5F1DC;
  --platform-app-green-background:#EDFBF4;
  --platform-app-yellow:#FFB014;
  --platform-app-yellow-hover:#ECA518;
  --platform-app-yellow-outline:#FDD78C;
  --platform-app-yellow-text:#F5A304;
  --platform-app-yellow-border:#FFEBC5;
  --platform-app-yellow-background:#FFF9ED;
  --platform-app-blue:#2F7DFF;
  --platform-app-blue-hover:#3279F0;
  --platform-app-blue-outline:#9AC0FF;
  --platform-app-blue-text:#2B6AD1;
  --platform-app-blue-border:#CDE0FF;
  --platform-app-blue-background:#EFF5FF;
  --platform-app-red:#FF2D2D;
  --platform-app-red-hover:#E42828;
  --platform-app-red-outline:#F89595;
  --platform-app-red-text:#C62323;
  --platform-app-red-border:#FCD5D5;
  --platform-app-red-background:#FEEEEE;
  --platform-app-purple:#9A5CFF;
  --platform-app-purple-hover:#904BFF;
  --platform-app-purple-outline:#C5B0FF;
  --platform-app-purple-text:#7250D1;
  --platform-app-purple-border:#E2D8FF;
  --platform-app-purple-background:#F6F3FF;
}

.appmenu-panel{display:flex;flex-direction:column;height:100vh!important;max-height:100vh!important;width:468px!important;border-radius:0!important;justify-content:stretch;align-items:stretch}

.appmenu-panel-header{padding:var(--padding) 20px;display:flex;gap:var(--padding-sm);justify-content:space-between;border-bottom:var(--border);flex-shrink:0;align-self:stretch}

.appmenu-panel-header img{height:26px;width:auto;flex-shrink:0}

.appmenu-panel-body{display:flex;flex-direction:column;flex-grow:1;overflow:auto;padding:var(--padding)}

.appmenu-group{padding:var(--padding-lg)}

.appmenu-group{display:flex;flex-direction:column}

.appmenu-group-title{flex-grow:1;font-weight:var(--font-weight-bold);font-size:var(--font-size-lg);text-transform:uppercase;display:flex;margin-bottom:var(--padding-lg);align-items:center}

.appmenu-group-body{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:4px}

.appmenu-item{align-items:center;justify-content:center;flex-direction:column;padding:var(--padding-lg) 4px;text-align:center;border-radius:var(--padding);transition:background .2s;position:relative}

.appmenu-item:hover{background:var(--color-bg-btn-hover)}

.appmenu-item.disabled{cursor:not-allowed;opacity:50%;pointer-events:none}

.appmenu-item-icon{width:52px;height:52px;display:flex;justify-content:center;align-items:center;font-size:1.3em;border-radius:12px;margin:auto;color:var(--appmenu-color);border:1px solid var(--appmenu-border);background:var(--appmenu-background)}

.appmenu-item-icon>i:before{font-family:"1OfficeBold",serif!important}

.appmenu-item-title{color:var(--color-text);white-space:nowrap;margin-top:var(--padding);overflow:hidden;text-overflow:ellipsis;width:90px;align-items:center}

.appmenu-search{display:flex;width:100%;align-items:center;justify-content:flex-end;gap:var(--padding-sm)}

.appmenu-search>input{border:0!important;height:28px!important;padding:0!important;width:auto!important;flex-grow:1;flex-shrink:1;opacity:0;transform:translateX(60px);transition:opacity 1.5s ease .3s,transform 1.5s ease .3s}

.appmenu-search-btn{width:28px;height:28px;align-items:center;justify-content:center;border-radius:6px;transition:background .2s;flex-shrink:0;cursor:pointer;user-select:none}

.pop-box{box-sizing:border-box}

.loader.pop-box:after,.loader:after{border-radius:50%;width:3em;height:3em;box-shadow:0 0 3px #ccc}

.pop-box{width:var(--pop-width, auto);height:var(--pop-height, auto);max-width:var(--pop-max-width, none);border-radius:var(--border-radius);overflow:overlay;background:var(--bg-color);box-shadow:var(--box-shadow-pop, 0 8px 24px rgba(0,0,0,.12));flex-direction:column}

.pop-overlay{background:rgba(0,0,0,.2);cursor:pointer;inset:0;position:fixed;z-index:999}

.appmenu-search.active>input.hidden{display:block!important;opacity:1!important;transform:none!important;width:100%!important}

.appmenu-search.active>input{border:1px solid var(--border-color,#e3e6e7)!important;padding:4px 8px!important;height:28px!important;border-radius:6px!important}
