html,body{margin:0;width:100%;height:100%;min-height:100%;background:#111;color:#1f2937;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;overflow:hidden}
body{width:100%;min-height:100vh;min-height:100dvh;margin:0;display:block;padding:0;box-sizing:border-box;background:#111}
.tia-ipad{width:100vw;height:100vh;height:100dvh;min-height:100vh;background:#0d0f12;border:0;border-radius:0;padding:10px;box-shadow:none;box-sizing:border-box;position:relative;overflow:hidden}
.tia-screen{width:100%;height:100%;border-radius:26px;overflow:hidden;position:relative;display:flex;flex-direction:column;background:
radial-gradient(circle at 20% 20%,rgba(255,214,224,.48),transparent 26%),
radial-gradient(circle at 84% 24%,rgba(255,232,205,.42),transparent 26%),
linear-gradient(145deg,#fffafd 0%,#fff7f7 46%,#fff9ef 100%);
box-shadow:inset 0 0 0 1px rgba(15,23,42,.08)}
.tia-camera{display:none!important}
.tia-status{height:42px;display:flex;align-items:center;justify-content:space-between;padding:0 22px;font-size:12px;font-weight:650;color:#4b5563;flex:none;z-index:4}
.tia-status-clock{font-size:20px;font-weight:800;letter-spacing:.02em;color:#1f2937;line-height:1;font-variant-numeric:tabular-nums}
.tia-topbar{display:none}
.tia-brand-mini{display:none}
.tia-login-spacer{display:none}
.tia-app-grid{width:min(1180px,92%);margin:18px auto 0;display:grid;grid-template-columns:repeat(4,minmax(220px,1fr));gap:22px;align-content:start;flex:1;padding:0 0 118px;box-sizing:border-box;overflow:auto;scrollbar-width:none}
.tia-app-grid::-webkit-scrollbar{display:none}
.tia-app{position:relative;text-decoration:none!important;color:#1f2937!important;background:rgba(255,255,255,.82);border:1px solid rgba(255,255,255,.95);border-radius:26px;padding:28px 22px 22px;min-height:280px;text-align:center;display:flex;flex-direction:column;align-items:center;box-shadow:0 16px 36px rgba(31,41,55,.10);backdrop-filter:blur(16px);transition:transform .18s ease,box-shadow .18s ease}
.tia-app:hover{transform:translateY(-6px);box-shadow:0 20px 42px rgba(31,41,55,.15)}
.tia-app-icon{width:104px;height:104px;border-radius:28px;background:linear-gradient(145deg,#ffe2e8,#ffd1dc);border:1px solid rgba(255,255,255,.92);box-shadow:0 10px 24px rgba(239,71,111,.16),inset 0 0 0 1px rgba(255,255,255,.55);display:grid;place-items:center;font-size:50px;overflow:hidden}.tia-app-icon img{display:block;width:100%;height:100%;object-fit:cover;object-position:center}
.tia-app:nth-child(4n+2) .tia-app-icon{background:linear-gradient(145deg,#dfeaff,#cedeff)}
.tia-app:nth-child(4n+3) .tia-app-icon{background:linear-gradient(145deg,#eadfff,#dbcaf8)}
.tia-app:nth-child(4n+4) .tia-app-icon{background:linear-gradient(145deg,#fff0cf,#ffe0ad)}
.tia-app-name{margin-top:22px;max-width:100%;font-size:22px;font-weight:800;line-height:1.25;color:#16181d}
.tia-app-desc{margin-top:10px;color:#6b7280;font-size:14px;line-height:1.55;min-height:44px}
.tia-app-arrow{margin-top:auto;width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:#fff0f3;color:#ef476f;font-size:22px;font-weight:800;box-shadow:0 6px 14px rgba(31,41,55,.08)}
.tia-app:nth-child(4n+2) .tia-app-arrow{background:#eef4ff;color:#2563eb}
.tia-app:nth-child(4n+3) .tia-app-arrow{background:#f2edff;color:#7c3aed}
.tia-app:nth-child(4n+4) .tia-app-arrow{background:#fff7e6;color:#f59e0b}
.tia-empty{grid-column:1/-1;text-align:center;padding:50px 20px;color:#6b7280}
.tia-dock{position:absolute;left:50%;bottom:24px;transform:translateX(-50%);width:min(680px,76%);height:78px;padding:8px 18px;border-radius:28px;background:rgba(255,255,255,.78);border:1px solid rgba(255,255,255,.92);box-shadow:0 14px 34px rgba(31,41,55,.12);backdrop-filter:blur(24px);display:grid;grid-template-columns:repeat(4,1fr);align-items:center;z-index:4}
.tia-dock-item{display:flex;flex-direction:column;align-items:center;gap:4px;font-size:12px;color:#6b7280!important;font-weight:650;text-decoration:none!important;cursor:pointer;transition:transform .16s ease,color .16s ease}.tia-dock-item:hover{transform:translateY(-2px);color:#ef476f!important}
.tia-dock-item strong{font-size:22px;line-height:1}
.tia-dock-item.active{color:#ef476f}
.tia-home-indicator{position:absolute;bottom:7px;left:50%;transform:translateX(-50%);width:120px;height:4px;border-radius:99px;background:#111827;opacity:.8}
.tia-footer{position:absolute;bottom:4px;left:22px;font-size:11px;color:#9ca3af}
.tia-central-hub{flex:1;overflow:auto;padding:18px 34px 120px;box-sizing:border-box;scrollbar-width:none}
.tia-central-hub::-webkit-scrollbar{display:none}
.tia-central-shell{width:min(1380px,96%);margin:0 auto}
.tia-central-top{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;margin-bottom:20px}
.tia-central-title-wrap h1{margin:0;font-size:clamp(30px,3.2vw,52px);letter-spacing:-.03em;color:#172033}
.tia-central-title-wrap p{margin:7px 0 0;color:#6b7280;font-size:14px}
.tia-central-back{display:inline-flex;align-items:center;gap:8px;padding:11px 16px;border-radius:999px;background:rgba(255,255,255,.84);color:#374151!important;text-decoration:none!important;font-weight:700;box-shadow:0 8px 24px rgba(31,41,55,.08)}
.tia-central-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:20px}
.tia-central-stat{background:rgba(255,255,255,.82);border:1px solid rgba(255,255,255,.95);border-radius:22px;padding:18px 20px;box-shadow:0 12px 30px rgba(31,41,55,.08)}
.tia-central-stat small{display:block;color:#6b7280;font-size:12px;font-weight:700}
.tia-central-stat strong{display:block;margin-top:7px;font-size:28px;color:#111827}
.tia-central-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.tia-central-card{position:relative;display:block;text-decoration:none!important;color:#111827!important;background:rgba(255,255,255,.86);border:1px solid rgba(255,255,255,.95);border-radius:24px;padding:22px 22px 20px;min-height:150px;box-shadow:0 14px 34px rgba(31,41,55,.09);transition:transform .18s ease,box-shadow .18s ease}
.tia-central-card:hover{transform:translateY(-5px);box-shadow:0 20px 44px rgba(31,41,55,.14)}
.tia-central-card-icon{width:52px;height:52px;border-radius:16px;display:grid;place-items:center;background:linear-gradient(145deg,#ffe2e8,#ffd1dc);color:#e83d68;font-size:24px;font-weight:800;margin-bottom:16px}
.tia-central-card:nth-child(3n+2) .tia-central-card-icon{background:linear-gradient(145deg,#e4edff,#d6e3ff);color:#2563eb}
.tia-central-card:nth-child(3n+3) .tia-central-card-icon{background:linear-gradient(145deg,#eee4ff,#dfd2fb);color:#7c3aed}
.tia-central-card h3{margin:0;font-size:18px}
.tia-central-card p{margin:7px 0 0;color:#6b7280;font-size:13px;line-height:1.55}
.tia-central-card-arrow{position:absolute;right:18px;bottom:16px;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:#f7f7f8;color:#6b7280;font-weight:800}
.tia-central-group-head{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:0 0 18px}
.tia-central-group-head h2{margin:0;font-size:28px;color:#172033;letter-spacing:-.02em}
.tia-central-group-head p{margin:6px 0 0;color:#6b7280;font-size:14px}
.tia-central-group-card{min-height:185px}
.tia-central-group-card .tia-central-card-icon{width:58px;height:58px;font-size:27px}
.tia-central-group-count{display:inline-flex;margin-top:12px;padding:5px 9px;border-radius:999px;background:#f8fafc;color:#64748b;font-size:12px;font-weight:750}
.tia-central-module-head{display:flex;justify-content:flex-start;margin:0 0 14px}
.tia-control-module{background:rgba(255,255,255,.68);border:1px solid rgba(255,255,255,.9);border-radius:26px;padding:18px;box-shadow:0 16px 38px rgba(31,41,55,.08)}
.tia-control-module .wrap{margin:0!important;max-width:none!important;width:100%!important}
.tia-control-module .wrap>h1{font-size:28px!important;margin:0 0 18px!important;color:#172033}
.tia-control-module .tia-cards{display:grid!important;grid-template-columns:repeat(4,1fr)!important;gap:12px!important}
.tia-control-module .tia-card,.tia-control-module .tia-panel{border:1px solid rgba(226,232,240,.95)!important;border-radius:18px!important;box-shadow:0 8px 22px rgba(31,41,55,.06)!important;background:rgba(255,255,255,.92)!important}
.tia-control-module .tia-panel{padding:16px!important}
.tia-control-module table.widefat{border:0!important;border-radius:14px!important;overflow:hidden!important;background:#fff!important}
.tia-control-module table.widefat thead th{background:#f8fafc!important;font-weight:750!important;color:#475569!important}
.tia-control-module table.widefat td,.tia-control-module table.widefat th{padding:10px!important;border-bottom:1px solid #eef2f7!important}
.tia-control-module input[type=text],.tia-control-module input[type=password],.tia-control-module input[type=email],.tia-control-module input[type=url],.tia-control-module input[type=number],.tia-control-module input[type=datetime-local],.tia-control-module select,.tia-control-module textarea{border:1px solid #dbe2ea!important;border-radius:10px!important;min-height:38px!important;background:#fff!important;box-shadow:none!important}
.tia-control-module .button{border-radius:10px!important;min-height:36px!important;display:inline-flex!important;align-items:center!important;justify-content:center!important}
.tia-control-module .button-primary{background:#6d5dfc!important;border-color:#6d5dfc!important}
.tia-control-module .tia-settings-page{width:100%!important;margin:0!important}
.tia-control-module .tia-settings{max-width:none!important;width:100%!important}
.tia-control-module .notice{border-radius:12px!important}
.tia-control-module .tia-upload-panel{max-width:none!important}
.tia-control-module .tia-filter{background:rgba(255,255,255,.75);padding:10px;border-radius:14px}
.tia-control-module .tia-tree-node{background:#fff!important;border:1px solid #eef2f7!important}
.tia-control-module,
.tia-control-module *{
text-shadow:none!important;
}
.tia-control-module,
.tia-control-module p,
.tia-control-module span,
.tia-control-module label,
.tia-control-module td,
.tia-control-module th,
.tia-control-module li,
.tia-control-module small,
.tia-control-module strong{
color:#1f2937;
}
.tia-control-module .description,
.tia-control-module small.description{
color:#6b7280!important;
}
.tia-control-module code,
.tia-control-module kbd,
.tia-control-module samp{
display:inline-block;
background:#eef2f7!important;
color:#24324a!important;
border:1px solid #d8e0ea!important;
border-radius:6px!important;
padding:2px 6px!important;
font-family:Consolas,Monaco,"Courier New",monospace!important;
font-size:.92em!important;
line-height:1.35!important;
box-shadow:none!important;
}
.tia-control-module pre{
background:#f7f9fc!important;
color:#24324a!important;
border:1px solid #d8e0ea!important;
border-radius:12px!important;
padding:14px!important;
box-shadow:none!important;
}
.tia-control-module pre code{
display:inline!important;
background:transparent!important;
border:0!important;
padding:0!important;
}
.tia-control-module input[type=text],
.tia-control-module input[type=password],
.tia-control-module input[type=email],
.tia-control-module input[type=url],
.tia-control-module input[type=number],
.tia-control-module input[type=datetime-local],
.tia-control-module input[type=search],
.tia-control-module select,
.tia-control-module textarea{
color:#111827!important;
background:#fff!important;
border-color:#cfd8e3!important;
}
.tia-control-module input::placeholder,
.tia-control-module textarea::placeholder{
color:#8a94a3!important;
opacity:1!important;
}
.tia-control-module input:focus,
.tia-control-module select:focus,
.tia-control-module textarea:focus{
color:#111827!important;
background:#fff!important;
border-color:#7c6cff!important;
box-shadow:0 0 0 1px #7c6cff!important;
outline:none!important;
}
.tia-control-module input::selection,
.tia-control-module textarea::selection,
.tia-control-module code::selection,
.tia-control-module *::selection{
background:#cfd8ff!important;
color:#111827!important;
}
.tia-control-module .tia-status{
color:#334155!important;
background:#eef2f7!important;
}
.tia-control-module .tia-status.active{
color:#166534!important;
background:#dcfce7!important;
}
.tia-control-module .tia-status.inactive{
color:#991b1b!important;
background:#fee2e2!important;
}
.tia-control-module .tia-status.maintenance{
color:#92400e!important;
background:#fef3c7!important;
}
.tia-control-module .button,
.tia-control-module .button-secondary{
color:#334155!important;
background:#fff!important;
border-color:#cbd5e1!important;
text-shadow:none!important;
}
.tia-control-module .button:hover,
.tia-control-module .button-secondary:hover{
color:#111827!important;
background:#f8fafc!important;
border-color:#94a3b8!important;
}
.tia-control-module .button-primary{
color:#fff!important;
background:#6d5dfc!important;
border-color:#6d5dfc!important;
}
.tia-control-module .button-primary:hover{
color:#fff!important;
background:#5b4ce0!important;
border-color:#5b4ce0!important;
}
.tia-control-module .button-link-delete{
color:#b42318!important;
background:#fff!important;
border-color:#fecaca!important;
}
.tia-control-module .button-link-delete:hover{
color:#7f1d1d!important;
background:#fff1f2!important;
border-color:#fca5a5!important;
}
.tia-control-module a{
color:#4f46e5;
}
.tia-control-module a:hover{
color:#3730a3;
}
.tia-control-module table.widefat tbody tr:hover td{
background:#fbfdff!important;
}
.tia-dock.has-admin{width:min(840px,88%);grid-template-columns:repeat(5,1fr)}
.tia-dock-item.admin-only{color:#7c3aed!important}
.tia-dock-item.admin-only.active{color:#7c3aed!important}
.tia-side-banner{position:absolute;z-index:3;display:block;border-radius:24px;overflow:hidden;background:rgba(255,255,255,.72);border:1px solid rgba(255,255,255,.92);box-shadow:0 16px 36px rgba(31,41,55,.12);backdrop-filter:blur(14px);transition:transform .18s ease,box-shadow .18s ease}
.tia-side-banner{
--tia-banner-scale:1;
width:calc(var(--tia-banner-base-w,180px) * var(--tia-banner-scale))!important;
height:calc(var(--tia-banner-base-h,520px) * var(--tia-banner-scale))!important;
max-width:min(500px,26vw)!important;
max-height:min(900px,84vh)!important;
}
.tia-side-banner:hover{transform:translateY(-4px);box-shadow:0 20px 42px rgba(31,41,55,.16)}
.tia-side-banner img{display:block;width:100%;height:100%;object-fit:cover}
.tia-side-banner.left{left:clamp(18px,1.8vw,72px)}
.tia-side-banner.right{right:clamp(18px,1.8vw,72px)}
.tia-side-banner.tia-auto-hidden{display:none!important}
/* Chế độ gọn khi màn hình thấp hoặc khu ứng dụng thiếu chỗ */
.tia-screen.tia-compact-home .tia-status{height:32px}
.tia-screen.tia-compact-home
.tia-screen.tia-compact-home
.tia-screen.tia-compact-home .tia-home-head p,
.tia-screen.tia-compact-home
.tia-screen.tia-compact-home .tia-app-grid{gap:14px;padding-bottom:100px}
.tia-screen.tia-compact-home .tia-app{min-height:215px;padding:18px 16px 15px}
.tia-screen.tia-compact-home .tia-app-icon{width:76px;height:76px;border-radius:21px;font-size:36px}
.tia-screen.tia-compact-home .tia-app-name{font-size:17px;margin-top:13px}
.tia-screen.tia-compact-home .tia-app-desc{font-size:12px;min-height:34px;margin-top:6px}
.tia-screen.tia-compact-home .tia-app-arrow{width:34px;height:34px;font-size:18px}
/* Banner advertising animation effects */
.tia-side-banner.tia-fx-fade{animation:tiaBannerFade .75s ease-out both}
.tia-side-banner.tia-fx-slide.left{animation:tiaBannerSlideLeft .75s cubic-bezier(.2,.8,.2,1) both}
.tia-side-banner.tia-fx-slide.right{animation:tiaBannerSlideRight .75s cubic-bezier(.2,.8,.2,1) both}
.tia-side-banner.tia-fx-zoom{animation:tiaBannerZoom .7s ease-out both}
.tia-side-banner.tia-fx-pulse{animation:tiaBannerPulse .75s ease-in-out 2 both}
.tia-side-banner.tia-fx-bounce{animation:tiaBannerBounce .9s ease-out both}
.tia-side-banner.tia-fx-swing{transform-origin:top center;animation:tiaBannerSwing .9s ease-in-out both}
.tia-side-banner.tia-fx-shake{animation:tiaBannerShake .65s ease-in-out both}
.tia-side-banner.tia-fx-wobble{animation:tiaBannerWobble .9s ease-in-out both}
.tia-side-banner.tia-fx-rubber{animation:tiaBannerRubber .8s ease-in-out both}
.tia-side-banner.tia-fx-flip{backface-visibility:visible;animation:tiaBannerFlip .85s ease-out both}
@keyframes tiaBannerFade{from{opacity:0}to{opacity:1}}
@keyframes tiaBannerSlideLeft{from{opacity:0;transform:translateX(-55px)}to{opacity:1;transform:translateX(0)}}
@keyframes tiaBannerSlideRight{from{opacity:0;transform:translateX(55px)}to{opacity:1;transform:translateX(0)}}
@keyframes tiaBannerZoom{from{opacity:0;transform:scale(.78)}to{opacity:1;transform:scale(1)}}
@keyframes tiaBannerPulse{0%,100%{transform:scale(1)}50%{transform:scale(1.045)}}
@keyframes tiaBannerBounce{0%{opacity:0;transform:translateY(-35px)}45%{opacity:1;transform:translateY(10px)}70%{transform:translateY(-5px)}100%{transform:translateY(0)}}
@keyframes tiaBannerSwing{20%{transform:rotate(3deg)}40%{transform:rotate(-2deg)}60%{transform:rotate(1.5deg)}80%{transform:rotate(-1deg)}100%{transform:rotate(0)}}
@keyframes tiaBannerShake{0%,100%{transform:translateX(0)}20%,60%{transform:translateX(-7px)}40%,80%{transform:translateX(7px)}}
@keyframes tiaBannerWobble{0%,100%{transform:translateX(0) rotate(0)}15%{transform:translateX(-9px) rotate(-2deg)}30%{transform:translateX(7px) rotate(1.5deg)}45%{transform:translateX(-5px) rotate(-1deg)}60%{transform:translateX(3px) rotate(.6deg)}75%{transform:translateX(-1px) rotate(-.3deg)}}
@keyframes tiaBannerRubber{0%,100%{transform:scale(1)}30%{transform:scaleX(1.08) scaleY(.94)}45%{transform:scaleX(.95) scaleY(1.04)}60%{transform:scaleX(1.035) scaleY(.98)}75%{transform:scaleX(.99) scaleY(1.01)}}
@keyframes tiaBannerFlip{0%{opacity:0;transform:perspective(700px) rotateY(-70deg)}55%{opacity:1;transform:perspective(700px) rotateY(12deg)}100%{transform:perspective(700px) rotateY(0)}}
@media (prefers-reduced-motion: reduce){.tia-side-banner[class*="tia-fx-"]{animation:none!important;transition:none!important}}
@media (min-width:851px) and (min-height:721px) and (max-height:900px){
.tia-screen.tia-compact-home
}
@media(max-height:860px){
.tia-home-head p,
}
@media(max-height:720px){
.tia-status{height:30px}
.tia-app{min-height:190px!important}
.tia-app-desc{display:none!important}
}
.tia-side-banner{display:block}@media(max-width:1100px){.tia-app-grid{grid-template-columns:repeat(3,minmax(190px,1fr))}.tia-central-grid{grid-template-columns:repeat(2,1fr)}.tia-central-stats{grid-template-columns:repeat(2,1fr)}}
@media(max-width:850px){.tia-ipad{padding:7px}.tia-screen{border-radius:20px}.tia-app-grid{grid-template-columns:repeat(2,1fr);gap:14px;width:94%;padding-bottom:110px}.tia-app{min-height:240px;padding:20px 16px}.tia-app-icon{width:84px;height:84px;border-radius:22px;font-size:40px}.tia-app-name{font-size:18px}.tia-dock{width:min(560px,88%)}}
@media(max-width:520px){.tia-central-hub{padding:12px 12px 105px}.tia-central-top{align-items:flex-start;flex-direction:column}.tia-central-grid{grid-template-columns:1fr}.tia-central-stats{grid-template-columns:1fr 1fr}.tia-central-stat{padding:14px}.tia-central-stat strong{font-size:22px}.tia-central-card{min-height:130px}.tia-status{padding:0 14px}.tia-app-grid{grid-template-columns:1fr 1fr;gap:10px}.tia-app{min-height:210px;border-radius:20px;padding:16px 10px}.tia-app-icon{width:70px;height:70px;border-radius:18px;font-size:32px}.tia-app-name{font-size:15px;margin-top:14px}.tia-app-desc{font-size:12px;min-height:36px}.tia-dock{height:68px;width:90%;border-radius:22px}.tia-dock-item strong{font-size:19px}.tia-dock-item{font-size:10px}}
.tia-dock,.tia-home-dock,.tia-bottom-dock,.dock{
background:rgba(255,255,255,.98)!important;
border:1px solid rgba(255,92,130,.22)!important;
box-shadow:0 18px 48px rgba(30,35,55,.22),0 5px 16px rgba(255,92,130,.12)!important;
backdrop-filter:blur(20px) saturate(160%)!important;
-webkit-backdrop-filter:blur(20px) saturate(160%)!important;
overflow:hidden!important;
isolation:isolate!important;
z-index:999999!important;
}
.tia-dock:before,.tia-home-dock:before,.tia-bottom-dock:before,.dock:before{
content:"";position:absolute;inset:0;background:#fff;opacity:.96;z-index:-1;border-radius:inherit;
}
.tia-dock a,.tia-home-dock a,.tia-bottom-dock a,.dock a{
position:relative;z-index:2;border-radius:16px!important;transition:.18s ease!important;
}
.tia-dock a:hover,.tia-home-dock a:hover,.tia-bottom-dock a:hover,.dock a:hover{
transform:translateY(-3px);background:#fff3f6!important;
}
.tia-screen{
--tia-ui-scale:1;
--tia-card-h:calc(280px * var(--tia-ui-scale));
--tia-card-pad-y:calc(28px * var(--tia-ui-scale));
--tia-card-pad-x:calc(22px * var(--tia-ui-scale));
--tia-card-radius:calc(26px * var(--tia-ui-scale));
--tia-icon-size:calc(104px * var(--tia-ui-scale));
--tia-icon-radius:calc(28px * var(--tia-ui-scale));
--tia-logo-max-h:calc(190px * var(--tia-ui-scale));
--tia-logo-max-w:calc(520px * var(--tia-ui-scale));
--tia-dock-h:calc(78px * var(--tia-ui-scale));
--tia-dock-w:calc(680px * var(--tia-ui-scale));
--tia-dock-radius:calc(28px * var(--tia-ui-scale));
--tia-grid-gap:calc(22px * var(--tia-ui-scale));
--tia-grid-bottom:calc(118px * var(--tia-ui-scale));
}
.tia-app-grid{
gap:var(--tia-grid-gap)!important;
padding-bottom:var(--tia-grid-bottom)!important;
width:min(calc(1180px * var(--tia-ui-scale)),94%)!important;
}
.tia-app{
min-height:var(--tia-card-h)!important;
padding:var(--tia-card-pad-y) var(--tia-card-pad-x) calc(22px * var(--tia-ui-scale))!important;
border-radius:var(--tia-card-radius)!important;
}
.tia-app-icon{
width:var(--tia-icon-size)!important;
height:var(--tia-icon-size)!important;
border-radius:var(--tia-icon-radius)!important;
font-size:calc(50px * var(--tia-ui-scale))!important;
}
.tia-app-name{
margin-top:calc(22px * var(--tia-ui-scale))!important;
font-size:clamp(13px,calc(22px * var(--tia-ui-scale)),34px)!important;
}
.tia-app-desc{
margin-top:calc(10px * var(--tia-ui-scale))!important;
min-height:calc(44px * var(--tia-ui-scale))!important;
font-size:clamp(10px,calc(14px * var(--tia-ui-scale)),20px)!important;
}
.tia-app-arrow{
width:calc(42px * var(--tia-ui-scale))!important;
height:calc(42px * var(--tia-ui-scale))!important;
font-size:calc(22px * var(--tia-ui-scale))!important;
}
.tia-dock{
width:min(var(--tia-dock-w),88%)!important;
height:var(--tia-dock-h)!important;
padding:calc(8px * var(--tia-ui-scale)) calc(18px * var(--tia-ui-scale))!important;
border-radius:var(--tia-dock-radius)!important;
bottom:max(8px,calc(24px * var(--tia-ui-scale)))!important;
}
.tia-dock.has-admin{
width:min(calc(840px * var(--tia-ui-scale)),92%)!important;
}
.tia-dock-item{
gap:calc(4px * var(--tia-ui-scale))!important;
font-size:clamp(9px,calc(12px * var(--tia-ui-scale)),17px)!important;
}
.tia-dock-item strong{
font-size:clamp(16px,calc(22px * var(--tia-ui-scale)),32px)!important;
}
.tia-home-indicator{
width:calc(120px * var(--tia-ui-scale))!important;
}
@media(max-width:900px){
.tia-app-grid{
grid-template-columns:repeat(3,minmax(0,1fr))!important;
width:94%!important;
}
.tia-app-desc{display:none!important}
}
@media(max-width:650px){
.tia-app-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
/* 800x600: ưu tiên nhìn đủ app, logo và dock nhỏ gọn */
@media(max-width:900px) and (max-height:700px){
.tia-status{height:28px!important}
.tia-home-head p,
.tia-app-grid{align-content:start!important}
.tia-app-name{margin-top:calc(10px * var(--tia-ui-scale))!important}
.tia-dock{bottom:8px!important}
}
/* 2K/4K: mở rộng chiều rộng tối đa và khoảng thở theo scale */
@media(min-width:2200px){
.tia-app-grid{width:min(calc(1500px * var(--tia-ui-scale)),86%)!important}
}
.tia-screen.tia-ad-layout .tia-side-banner{
display:block!important;
max-width:500px!important;
max-height:900px!important;
}
/* Full HD -> dưới 2K */
.tia-screen.tia-ad-fhd .tia-app-grid{
width:52vw!important;
max-width:920px!important;
min-width:700px!important;
grid-template-columns:repeat(4,minmax(0,1fr))!important;
gap:12px!important;
margin:12px auto 0!important;
padding-bottom:92px!important;
}
.tia-screen.tia-ad-fhd .tia-app{
min-height:168px!important;
padding:13px 10px 11px!important;
border-radius:20px!important;
}
.tia-screen.tia-ad-fhd .tia-app-icon{
width:60px!important;height:60px!important;border-radius:17px!important;font-size:29px!important;
}
.tia-screen.tia-ad-fhd .tia-app-name{
font-size:15px!important;line-height:1.2!important;margin-top:9px!important;
}
.tia-screen.tia-ad-fhd .tia-app-desc{
font-size:10px!important;line-height:1.3!important;min-height:25px!important;margin-top:5px!important;
}
.tia-screen.tia-ad-fhd .tia-app-arrow{
width:28px!important;height:28px!important;font-size:14px!important;
}
.tia-screen.tia-ad-fhd .tia-dock{
height:60px!important;width:min(620px,72%)!important;bottom:10px!important;border-radius:22px!important;
}
.tia-screen.tia-ad-fhd .tia-dock.has-admin{width:min(700px,76%)!important}
.tia-screen.tia-ad-fhd .tia-dock-item{font-size:10px!important}
.tia-screen.tia-ad-fhd .tia-dock-item strong{font-size:18px!important}
/* 2K -> 4K: luôn chừa 2 hành lang quảng cáo rõ ràng */
.tia-screen.tia-ad-hires .tia-app-grid{
width:54vw!important;
max-width:1460px!important;
grid-template-columns:repeat(4,minmax(0,1fr))!important;
gap:clamp(14px,1vw,26px)!important;
margin:18px auto 0!important;
padding-bottom:clamp(110px,8vh,160px)!important;
}
.tia-screen.tia-ad-hires .tia-app{
min-height:clamp(190px,19vh,300px)!important;
padding:clamp(16px,1.15vw,28px) clamp(12px,1vw,24px)!important;
border-radius:clamp(20px,1.3vw,30px)!important;
}
.tia-screen.tia-ad-hires .tia-app-icon{
width:clamp(68px,4vw,112px)!important;
height:clamp(68px,4vw,112px)!important;
border-radius:clamp(18px,1.2vw,30px)!important;
font-size:clamp(32px,2.2vw,54px)!important;
}
.tia-screen.tia-ad-hires .tia-app-name{
font-size:clamp(15px,1vw,24px)!important;
margin-top:clamp(10px,.8vw,20px)!important;
}
.tia-screen.tia-ad-hires .tia-app-desc{
font-size:clamp(10px,.62vw,15px)!important;
min-height:clamp(28px,2vh,42px)!important;
}
.tia-screen.tia-ad-hires .tia-app-arrow{
width:clamp(30px,1.8vw,44px)!important;
height:clamp(30px,1.8vw,44px)!important;
font-size:clamp(15px,1vw,22px)!important;
}
/* 4K thật: giữ nội dung giữa khoảng 50% để banner đủ lớn */
@media (min-width:2600px){
.tia-screen.tia-ad-hires .tia-app-grid{
width:50vw!important;
max-width:1800px!important;
}
}
/* Khi Windows scaling làm viewport CSS thấp/hẹp, tiếp tục ưu tiên hành lang banner */
@media (max-width:1650px){
.tia-screen.tia-ad-fhd .tia-app-grid{width:50vw!important;min-width:660px!important}
}
@media (max-width:1500px){
.tia-screen.tia-ad-fhd .tia-app-grid{width:48vw!important;min-width:620px!important}
.tia-screen.tia-ad-fhd .tia-app-desc{display:none!important}
.tia-screen.tia-ad-fhd .tia-app{min-height:150px!important}
}
/* Mặc định an toàn */
.tia-app-grid{
box-sizing:border-box!important;
scrollbar-width:none!important;
}
.tia-app,.tia-dock,.tia-side-banner{box-sizing:border-box!important}
.tia-dock{
padding-bottom:max(8px,env(safe-area-inset-bottom))!important;
}
.tia-floating-actions{
max-width:calc(100vw - 20px);
}
/* Điện thoại nhỏ: 320-479px */
@media (max-width:479px){
.tia-ipad{padding:4px!important}
.tia-screen{border-radius:14px!important}
.tia-status{height:28px!important;padding:0 10px!important}
.tia-status-clock{font-size:15px!important}
.tia-status-right{font-size:9px!important}
.tia-app-grid{
width:96%!important;
margin:8px auto 0!important;
grid-template-columns:repeat(2,minmax(0,1fr))!important;
gap:8px!important;
padding-bottom:82px!important;
}
.tia-app{
min-height:146px!important;
padding:10px 7px 9px!important;
border-radius:16px!important;
}
.tia-app-icon{
width:50px!important;height:50px!important;
border-radius:14px!important;font-size:24px!important;
}
.tia-app-name{
margin-top:8px!important;
font-size:12px!important;
line-height:1.18!important;
}
.tia-app-desc{display:none!important}
.tia-app-arrow{
width:25px!important;height:25px!important;font-size:13px!important;
}
.tia-dock{
width:96%!important;
height:56px!important;
bottom:5px!important;
padding:5px 6px max(5px,env(safe-area-inset-bottom))!important;
border-radius:18px!important;
}
.tia-dock.has-admin{width:96%!important}
.tia-dock-item{font-size:8px!important;gap:1px!important}
.tia-dock-item strong{font-size:15px!important}
.tia-home-indicator{display:none!important}
.tia-side-banner{display:none!important}
.tia-central-hub{padding:8px 8px 76px!important}
.tia-central-shell{width:100%!important}
.tia-central-top{gap:8px!important;margin-bottom:10px!important}
.tia-central-title-wrap h1{font-size:23px!important}
.tia-central-title-wrap p{font-size:11px!important}
.tia-central-stats{grid-template-columns:1fr 1fr!important;gap:7px!important}
.tia-central-stat{padding:10px!important;border-radius:14px!important}
.tia-central-stat strong{font-size:19px!important}
.tia-central-grid{grid-template-columns:1fr!important;gap:8px!important}
.tia-central-card{min-height:112px!important;padding:13px!important;border-radius:16px!important}
.tia-central-card-icon{width:40px!important;height:40px!important;border-radius:12px!important;font-size:19px!important;margin-bottom:9px!important}
.tia-central-card h3{font-size:15px!important}
.tia-central-card p{font-size:11px!important}
.tia-central-back{padding:8px 10px!important;font-size:11px!important}
.tia-floating-actions{right:6px!important;left:auto!important;bottom:68px!important;top:auto!important}
.tia-floating-home,.tia-floating-refresh,.tia-floating-login{padding:7px 9px!important;font-size:10.5px!important}
}
/* Điện thoại lớn / ngang hẹp: 480-767px */
@media (min-width:480px) and (max-width:767px){
.tia-ipad{padding:5px!important}
.tia-screen{border-radius:16px!important}
.tia-status{height:30px!important;padding:0 12px!important}
.tia-status-clock{font-size:16px!important}
.tia-app-grid{
width:95%!important;
margin:10px auto 0!important;
grid-template-columns:repeat(2,minmax(0,1fr))!important;
gap:10px!important;
padding-bottom:88px!important;
}
.tia-app{
min-height:160px!important;
padding:11px 8px 10px!important;
border-radius:17px!important;
}
.tia-app-icon{width:54px!important;height:54px!important;border-radius:15px!important;font-size:26px!important}
.tia-app-name{font-size:13px!important;margin-top:8px!important}
.tia-app-desc{display:none!important}
.tia-app-arrow{width:26px!important;height:26px!important;font-size:13px!important}
.tia-dock{
width:94%!important;height:58px!important;bottom:6px!important;border-radius:19px!important;
padding:5px 8px max(5px,env(safe-area-inset-bottom))!important;
}
.tia-dock.has-admin{width:94%!important}
.tia-dock-item{font-size:8.5px!important;gap:2px!important}
.tia-dock-item strong{font-size:16px!important}
.tia-home-indicator{display:none!important}
.tia-side-banner{display:none!important}
.tia-central-hub{padding:10px 10px 80px!important}
.tia-central-grid{grid-template-columns:1fr!important;gap:9px!important}
.tia-central-stats{grid-template-columns:1fr 1fr!important;gap:8px!important}
}
/* Tablet dọc/ngang nhỏ: 768-1023px */
@media (min-width:768px) and (max-width:1023px){
.tia-app-grid{
width:94%!important;
margin:12px auto 0!important;
grid-template-columns:repeat(3,minmax(0,1fr))!important;
gap:11px!important;
padding-bottom:92px!important;
}
.tia-app{
min-height:170px!important;
padding:12px 9px 10px!important;
border-radius:18px!important;
}
.tia-app-icon{width:58px!important;height:58px!important;border-radius:16px!important;font-size:28px!important}
.tia-app-name{font-size:14px!important;margin-top:9px!important}
.tia-app-desc{font-size:10px!important;min-height:25px!important;margin-top:5px!important}
.tia-app-arrow{width:27px!important;height:27px!important;font-size:14px!important}
.tia-dock{
width:min(680px,90%)!important;height:60px!important;bottom:8px!important;border-radius:20px!important;
}
.tia-dock.has-admin{width:min(760px,92%)!important}
.tia-dock-item{font-size:9px!important}
.tia-dock-item strong{font-size:17px!important}
.tia-side-banner{display:none!important}
.tia-central-hub{padding:12px 14px 88px!important}
.tia-central-grid{grid-template-columns:repeat(2,1fr)!important;gap:10px!important}
}
/* Laptop nhỏ / 1024-1365 */
@media (min-width:1024px) and (max-width:1365px){
.tia-app-grid{
width:92%!important;
margin:14px auto 0!important;
grid-template-columns:repeat(4,minmax(0,1fr))!important;
gap:12px!important;
padding-bottom:96px!important;
}
.tia-app{
min-height:176px!important;
padding:13px 10px 11px!important;
border-radius:19px!important;
}
.tia-app-icon{width:60px!important;height:60px!important;border-radius:17px!important;font-size:29px!important}
.tia-app-name{font-size:14.5px!important;margin-top:9px!important}
.tia-app-desc{font-size:10px!important;min-height:26px!important;margin-top:5px!important}
.tia-app-arrow{width:28px!important;height:28px!important;font-size:14px!important}
.tia-dock{height:62px!important;width:min(720px,82%)!important;bottom:9px!important}
.tia-dock.has-admin{width:min(800px,86%)!important}
.tia-side-banner{display:none!important}
}
/* Desktop HD+ dưới Full HD: 1366-1919 */
@media (min-width:1366px) and (max-width:1919px){
.tia-app-grid{
width:min(1180px,86%)!important;
margin:16px auto 0!important;
grid-template-columns:repeat(4,minmax(0,1fr))!important;
gap:14px!important;
padding-bottom:102px!important;
}
.tia-app{
min-height:188px!important;
padding:14px 11px 12px!important;
border-radius:20px!important;
}
.tia-app-icon{width:64px!important;height:64px!important;border-radius:18px!important;font-size:31px!important}
.tia-app-name{font-size:15.5px!important;margin-top:10px!important}
.tia-app-desc{font-size:10.5px!important;min-height:28px!important;margin-top:6px!important}
.tia-app-arrow{width:29px!important;height:29px!important;font-size:15px!important}
.tia-dock{height:64px!important;width:min(740px,76%)!important;bottom:10px!important}
.tia-dock.has-admin{width:min(820px,80%)!important}
.tia-side-banner{display:none!important}
}
/* Cảnh ngang thấp: tránh app/dock quá cao */
@media (orientation:landscape) and (max-height:650px){
.tia-status{height:26px!important}
.tia-app-grid{margin-top:6px!important;padding-bottom:72px!important}
.tia-app{min-height:132px!important}
.tia-app-desc{display:none!important}
.tia-dock{height:52px!important;bottom:4px!important}
.tia-dock-item strong{font-size:15px!important}
}
/* Không cho rule điện thoại/tablet vô tình ghi đè chế độ banner từ Full HD trở lên.
Khi JS gắn tia-ad-fhd/tia-ad-hires, các rule chuyên dụng v1.10.3 vẫn có ưu tiên cao hơn. */
@media (max-width:767px){
.tia-central-grid{
grid-template-columns:repeat(3,minmax(0,1fr))!important;
gap:6px!important;
}
.tia-central-card{
min-width:0!important;
min-height:118px!important;
padding:9px 6px!important;
border-radius:13px!important;
}
.tia-central-card-icon{
width:34px!important;
height:34px!important;
border-radius:10px!important;
font-size:16px!important;
margin-bottom:6px!important;
}
.tia-central-card h3{
font-size:11px!important;
line-height:1.18!important;
margin:0 0 4px!important;
overflow-wrap:anywhere!important;
}
.tia-central-card p{
font-size:8px!important;
line-height:1.25!important;
display:-webkit-box!important;
-webkit-line-clamp:2!important;
-webkit-box-orient:vertical!important;
overflow:hidden!important;
}
.tia-central-card .tia-central-arrow{
width:22px!important;
height:22px!important;
font-size:10px!important;
right:6px!important;
bottom:6px!important;
}
}
@media (max-width:374px){
.tia-central-grid{gap:4px!important}
.tia-central-card{padding:8px 4px!important;min-height:112px!important}
.tia-central-card h3{font-size:10px!important}
.tia-central-card p{font-size:7.5px!important}
}
.tia-dock,
.tia-screen .tia-dock,
.tia-screen.tia-ad-fhd .tia-dock,
.tia-screen.tia-ad-hires .tia-dock{
position:fixed!important;
left:50%!important;
right:auto!important;
top:auto!important;
bottom:max(8px, env(safe-area-inset-bottom))!important;
transform:translateX(-50%)!important;
margin:0!important;
z-index:2147483000!important;
width:min(840px,calc(100vw - 20px))!important;
max-width:calc(100vw - 20px)!important;
min-width:0!important;
box-sizing:border-box!important;
visibility:visible!important;
opacity:1!important;
clip-path:none!important;
overflow:hidden!important;
}
/* 4 mục thường */
.tia-dock:not(.has-admin){
width:min(680px,calc(100vw - 20px))!important;
}
/* Có nút Hệ Thống */
.tia-dock.has-admin{
width:min(840px,calc(100vw - 20px))!important;
}
/* Chừa không gian dưới cho nội dung để dock không che hàng cuối */
.tia-app-grid{
padding-bottom:max(118px,calc(var(--tia-dock-h,78px) + 44px))!important;
}
.tia-central-hub{
padding-bottom:max(118px,calc(var(--tia-dock-h,78px) + 44px))!important;
}
/* Mobile: dock luôn lọt hoàn toàn trong màn hình, cách mép dưới một khoảng nhỏ */
@media (max-width:767px){
.tia-dock,
.tia-screen .tia-dock,
.tia-screen.tia-ad-fhd .tia-dock,
.tia-screen.tia-ad-hires .tia-dock{
bottom:max(6px, env(safe-area-inset-bottom))!important;
width:calc(100vw - 12px)!important;
max-width:calc(100vw - 12px)!important;
height:58px!important;
padding:5px 6px max(5px,env(safe-area-inset-bottom))!important;
border-radius:18px!important;
}
.tia-dock.has-admin,
.tia-dock:not(.has-admin){
width:calc(100vw - 12px)!important;
max-width:calc(100vw - 12px)!important;
}
.tia-dock-item{
min-width:0!important;
overflow:hidden!important;
}
.tia-dock-item span{
max-width:100%!important;
white-space:nowrap!important;
overflow:hidden!important;
text-overflow:ellipsis!important;
}
.tia-app-grid{
padding-bottom:86px!important;
}
.tia-central-hub{
padding-bottom:86px!important;
}
}
/* Màn hình rất nhỏ */
@media (max-width:374px){
.tia-dock,
.tia-screen .tia-dock{
bottom:max(5px, env(safe-area-inset-bottom))!important;
width:calc(100vw - 10px)!important;
max-width:calc(100vw - 10px)!important;
height:56px!important;
border-radius:17px!important;
}
.tia-dock-item{
font-size:7.5px!important;
gap:1px!important;
}
.tia-dock-item strong{
font-size:14px!important;
}
}
/* Màn ngang thấp: vẫn giữ nguyên dock, không kéo xuống ngoài viewport */
@media (orientation:landscape) and (max-height:650px){
.tia-dock,
.tia-screen .tia-dock{
bottom:max(5px, env(safe-area-inset-bottom))!important;
height:54px!important;
}
.tia-app-grid,
.tia-central-hub{
padding-bottom:78px!important;
}
}
@media (max-width:1023px){
.tia-side-banner,
.tia-screen.tia-ad-layout .tia-side-banner,
.tia-screen.tia-ad-fhd .tia-side-banner,
.tia-screen.tia-ad-hires .tia-side-banner{
display:none!important;
visibility:hidden!important;
opacity:0!important;
pointer-events:none!important;
}
.tia-screen.tia-ad-layout .tia-app-grid,
.tia-screen.tia-ad-fhd .tia-app-grid,
.tia-screen.tia-ad-hires .tia-app-grid,
.tia-app-grid{
width:calc(100vw - 18px)!important;
max-width:calc(100vw - 18px)!important;
min-width:0!important;
margin:8px auto 0!important;
grid-template-columns:repeat(2,minmax(0,1fr))!important;
gap:8px!important;
padding-left:0!important;
padding-right:0!important;
overflow-x:hidden!important;
box-sizing:border-box!important;
}
.tia-screen.tia-ad-layout .tia-app,
.tia-screen.tia-ad-fhd .tia-app,
.tia-screen.tia-ad-hires .tia-app,
.tia-app{
width:100%!important;
max-width:100%!important;
min-width:0!important;
box-sizing:border-box!important;
}
.tia-screen.tia-ad-layout,
.tia-screen.tia-ad-fhd,
.tia-screen.tia-ad-hires{
--tia-ui-scale:.46;
}
}
/* Mobile rất hẹp */
@media (max-width:479px){
.tia-screen.tia-ad-layout .tia-app-grid,
.tia-screen.tia-ad-fhd .tia-app-grid,
.tia-screen.tia-ad-hires .tia-app-grid,
.tia-app-grid{
width:calc(100vw - 12px)!important;
max-width:calc(100vw - 12px)!important;
grid-template-columns:repeat(2,minmax(0,1fr))!important;
gap:7px!important;
}
}
/* Hệ Thống trên mobile vẫn giữ 3 cột như yêu cầu trước */
@media (max-width:767px){
.tia-central-grid{
grid-template-columns:repeat(3,minmax(0,1fr))!important;
}
}
.tia-top-ticker{
flex:none;
width:100%;
height:34px;
overflow:hidden;
position:relative;
z-index:8;
background:rgba(255,255,255,.96);
border-bottom:1px solid rgba(15,23,42,.08);
box-shadow:0 4px 14px rgba(31,41,55,.06);
}
.tia-top-ticker:before,.tia-top-ticker:after{
content:"";position:absolute;top:0;bottom:0;width:38px;z-index:3;pointer-events:none;
}
.tia-top-ticker:before{left:0;background:linear-gradient(90deg,#fff,rgba(255,255,255,0))}
.tia-top-ticker:after{right:0;background:linear-gradient(270deg,#fff,rgba(255,255,255,0))}
.tia-top-ticker-track{
height:100%;display:flex;align-items:center;width:max-content;
animation:tiaTickerMove var(--tia-ticker-speed,38s) linear infinite;
will-change:transform;
}
.tia-top-ticker:hover .tia-top-ticker-track{animation-play-state:paused}
.tia-top-ticker-set{display:flex;align-items:center;height:100%}
.tia-ticker-item{
display:inline-flex;align-items:center;gap:6px;
color:#273142!important;text-decoration:none!important;
white-space:nowrap;font-size:13px;font-weight:650;
padding:0 15px;
}
.tia-ticker-item strong{font-weight:850;color:#111827}
.tia-ticker-sep{color:#cbd5e1;font-weight:400;padding:0 2px}
@keyframes tiaTickerMove{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media(max-width:767px){
.tia-top-ticker{height:29px}
.tia-ticker-item{font-size:11px;padding:0 10px;gap:4px}
.tia-top-ticker:before,.tia-top-ticker:after{width:18px}
}
@media(prefers-reduced-motion:reduce){
.tia-top-ticker{overflow-x:auto}
.tia-top-ticker-track{animation:none!important}
}
/* Nếu JS xác định màn đủ điều kiện quảng cáo thì LUÔN hiện banner,
kể cả Windows scaling làm CSS viewport chỉ còn 1536/1707px. */
.tia-screen.tia-ad-layout .tia-side-banner,
.tia-screen.tia-ad-fhd .tia-side-banner,
.tia-screen.tia-ad-hires .tia-side-banner{
display:block!important;
visibility:visible!important;
opacity:1!important;
pointer-events:auto!important;
}
/* Full HD vật lý: chừa 2 hành lang banner nhưng phần giữa không quá nhỏ */
.tia-screen.tia-ad-fhd .tia-app-grid{
width:min(56vw,1040px)!important;
max-width:calc(100vw - 500px)!important;
min-width:700px!important;
grid-template-columns:repeat(4,minmax(0,1fr))!important;
gap:14px!important;
margin:14px auto 0!important;
padding-bottom:100px!important;
}
.tia-screen.tia-ad-fhd .tia-app{
min-height:185px!important;
padding:14px 11px 12px!important;
border-radius:21px!important;
}
.tia-screen.tia-ad-fhd .tia-app-icon{
width:64px!important;height:64px!important;
border-radius:18px!important;font-size:31px!important;
}
.tia-screen.tia-ad-fhd .tia-app-name{
font-size:15.5px!important;
margin-top:10px!important;
}
.tia-screen.tia-ad-fhd .tia-app-desc{
font-size:10.5px!important;
min-height:27px!important;
margin-top:6px!important;
}
.tia-screen.tia-ad-fhd .tia-app-arrow{
width:29px!important;height:29px!important;font-size:15px!important;
}
/* 2K: tăng rõ kích thước vùng app/card/icon/chữ so với v1.10.9 */
.tia-screen.tia-ad-hires .tia-app-grid{
width:min(60vw,1540px)!important;
max-width:calc(100vw - 760px)!important;
grid-template-columns:repeat(4,minmax(0,1fr))!important;
gap:clamp(16px,1.05vw,24px)!important;
margin:18px auto 0!important;
padding-bottom:120px!important;
}
.tia-screen.tia-ad-hires .tia-app{
min-height:clamp(215px,20vh,300px)!important;
padding:clamp(18px,1.25vw,28px) clamp(14px,1.05vw,24px)!important;
border-radius:clamp(22px,1.35vw,30px)!important;
}
.tia-screen.tia-ad-hires .tia-app-icon{
width:clamp(78px,4.25vw,112px)!important;
height:clamp(78px,4.25vw,112px)!important;
border-radius:clamp(20px,1.25vw,30px)!important;
font-size:clamp(36px,2.25vw,54px)!important;
}
.tia-screen.tia-ad-hires .tia-app-name{
font-size:clamp(17px,1.05vw,24px)!important;
margin-top:clamp(12px,.9vw,20px)!important;
}
.tia-screen.tia-ad-hires .tia-app-desc{
font-size:clamp(11px,.68vw,15px)!important;
min-height:clamp(30px,2vh,42px)!important;
}
.tia-screen.tia-ad-hires .tia-app-arrow{
width:clamp(32px,1.85vw,44px)!important;
height:clamp(32px,1.85vw,44px)!important;
font-size:clamp(16px,1vw,22px)!important;
}
/* 4K: giữ bố cục đã ổn, không phóng nội dung quá mức */
@media (min-width:3000px){
.tia-screen.tia-ad-hires .tia-app-grid{
width:min(52vw,1900px)!important;
max-width:calc(100vw - 1120px)!important;
}
.tia-screen.tia-ad-hires .tia-app{
min-height:clamp(230px,18vh,320px)!important;
}
}
/* Windows scaling ở Full HD: viewport CSS có thể chỉ 1366-1707px.
Khi đã có class ad-fhd, tiếp tục giữ 2 banner và giảm vùng giữa vừa đủ. */
@media (max-width:1750px){
.tia-screen.tia-ad-fhd .tia-app-grid{
width:54vw!important;
max-width:900px!important;
min-width:660px!important;
}
}
@media (max-width:1550px){
.tia-screen.tia-ad-fhd .tia-app-grid{
width:50vw!important;
max-width:780px!important;
min-width:620px!important;
}
.tia-screen.tia-ad-fhd .tia-app-desc{display:none!important}
.tia-screen.tia-ad-fhd .tia-app{min-height:165px!important}
}
/* Mobile/tablet vẫn tuyệt đối không banner */
@media (max-width:1023px){
.tia-side-banner,
.tia-screen.tia-ad-layout .tia-side-banner,
.tia-screen.tia-ad-fhd .tia-side-banner,
.tia-screen.tia-ad-hires .tia-side-banner{
display:none!important;
visibility:hidden!important;
opacity:0!important;
pointer-events:none!important;
}
}
@media (max-width:767px) and (pointer:coarse){
html,body{
background:#111!important;
overscroll-behavior:none!important;
}
.tia-ipad{
padding:4px!important;
}
.tia-screen{
border-radius:16px!important;
-webkit-overflow-scrolling:touch!important;
transform:translateZ(0);
}
/* Grid kiểu màn hình ứng dụng: 4 icon mỗi hàng */
.tia-app-grid,
.tia-screen.tia-ad-layout .tia-app-grid,
.tia-screen.tia-ad-fhd .tia-app-grid,
.tia-screen.tia-ad-hires .tia-app-grid{
width:100%!important;
max-width:100%!important;
min-width:0!important;
margin:6px auto 0!important;
padding:6px 8px 92px!important;
grid-template-columns:repeat(4,minmax(0,1fr))!important;
gap:16px 6px!important;
align-content:start!important;
overflow-y:auto!important;
overflow-x:hidden!important;
-webkit-overflow-scrolling:touch!important;
overscroll-behavior-y:contain!important;
scroll-behavior:auto!important;
touch-action:pan-y!important;
contain:layout paint!important;
}
/* Bỏ toàn bộ khung card: chỉ còn icon + tên */
.tia-app,
.tia-screen.tia-ad-layout .tia-app,
.tia-screen.tia-ad-fhd .tia-app,
.tia-screen.tia-ad-hires .tia-app{
min-width:0!important;
width:100%!important;
max-width:100%!important;
min-height:108px!important;
height:auto!important;
padding:2px 1px!important;
margin:0!important;
border:0!important;
border-radius:0!important;
background:transparent!important;
box-shadow:none!important;
backdrop-filter:none!important;
-webkit-backdrop-filter:none!important;
transform:none!important;
transition:none!important;
display:flex!important;
flex-direction:column!important;
justify-content:flex-start!important;
align-items:center!important;
contain:layout style paint!important;
}
.tia-app:hover,.tia-app:active{
transform:none!important;
box-shadow:none!important;
}
.tia-app-icon,
.tia-screen.tia-ad-fhd .tia-app-icon,
.tia-screen.tia-ad-hires .tia-app-icon{
width:clamp(54px,16vw,70px)!important;
height:clamp(54px,16vw,70px)!important;
border-radius:clamp(15px,4.4vw,20px)!important;
font-size:clamp(27px,8vw,34px)!important;
border:1px solid rgba(255,255,255,.85)!important;
box-shadow:0 4px 10px rgba(31,41,55,.10)!important;
flex:0 0 auto!important;
transform:translateZ(0);
}
.tia-app-icon img{
width:100%!important;
height:100%!important;
object-fit:cover!important;
border-radius:inherit!important;
}
.tia-app-name,
.tia-screen.tia-ad-fhd .tia-app-name,
.tia-screen.tia-ad-hires .tia-app-name{
width:100%!important;
max-width:88px!important;
margin:7px auto 0!important;
color:#1f2937!important;
font-size:clamp(10px,3vw,12px)!important;
font-weight:650!important;
line-height:1.18!important;
text-align:center!important;
display:-webkit-box!important;
-webkit-line-clamp:2!important;
-webkit-box-orient:vertical!important;
overflow:hidden!important;
text-overflow:ellipsis!important;
}
.tia-app-desc,.tia-app-arrow{
display:none!important;
}
/* Banner tuyệt đối không render thị giác trên điện thoại */
.tia-side-banner,
.tia-screen.tia-ad-layout .tia-side-banner,
.tia-screen.tia-ad-fhd .tia-side-banner,
.tia-screen.tia-ad-hires .tia-side-banner{
display:none!important;
visibility:hidden!important;
opacity:0!important;
pointer-events:none!important;
animation:none!important;
}
/* Giảm các hiệu ứng GPU nặng để vuốt mượt */
.tia-dock{
backdrop-filter:none!important;
-webkit-backdrop-filter:none!important;
background:rgba(255,255,255,.97)!important;
box-shadow:0 5px 14px rgba(31,41,55,.10)!important;
transition:none!important;
}
.tia-dock-item{
transition:none!important;
}
.tia-top-ticker{
box-shadow:none!important;
backdrop-filter:none!important;
-webkit-backdrop-filter:none!important;
}
.tia-top-ticker-track{
will-change:transform!important;
}
.tia-central-card,.tia-control-module,.tia-central-stat{
backdrop-filter:none!important;
-webkit-backdrop-filter:none!important;
}
}
/* Điện thoại màn cực nhỏ vẫn giữ 4 cột, icon co nhỏ hơn */
@media (max-width:359px) and (pointer:coarse){
.tia-app-grid,
.tia-screen.tia-ad-layout .tia-app-grid,
.tia-screen.tia-ad-fhd .tia-app-grid,
.tia-screen.tia-ad-hires .tia-app-grid{
padding-left:5px!important;
padding-right:5px!important;
gap:13px 3px!important;
}
.tia-app-icon,
.tia-screen.tia-ad-fhd .tia-app-icon,
.tia-screen.tia-ad-hires .tia-app-icon{
width:50px!important;
height:50px!important;
border-radius:14px!important;
font-size:25px!important;
}
.tia-app-name,
.tia-screen.tia-ad-fhd .tia-app-name,
.tia-screen.tia-ad-hires .tia-app-name{
max-width:72px!important;
font-size:9.5px!important;
}
}
@media (max-width:767px){
.tia-dock,
.tia-screen .tia-dock,
.tia-screen.tia-ad-fhd .tia-dock,
.tia-screen.tia-ad-hires .tia-dock{
position:fixed!important;
left:50%!important;
right:auto!important;
top:auto!important;
transform:translateX(-50%)!important;
bottom:max(6px,env(safe-area-inset-bottom))!important;
width:calc(100vw - 14px)!important;
max-width:calc(100vw - 14px)!important;
min-width:0!important;
height:66px!important;
display:flex!important;
align-items:center!important;
justify-content:space-around!important;
gap:2px!important;
padding:6px 8px max(6px,env(safe-area-inset-bottom))!important;
margin:0!important;
border:1px solid rgba(255,255,255,.88)!important;
border-radius:22px!important;
background:
linear-gradient(180deg,rgba(255,245,249,.98),rgba(255,229,239,.97))!important;
box-shadow:
0 12px 30px rgba(190,70,115,.18),
0 2px 8px rgba(31,41,55,.08),
inset 0 1px 0 rgba(255,255,255,.95)!important;
backdrop-filter:none!important;
-webkit-backdrop-filter:none!important;
overflow:visible!important;
z-index:2147483000!important;
}
.tia-dock.has-admin,
.tia-dock:not(.has-admin){
width:calc(100vw - 14px)!important;
max-width:calc(100vw - 14px)!important;
}
.tia-dock-item{
position:relative!important;
flex:1 1 0!important;
min-width:0!important;
height:52px!important;
display:flex!important;
flex-direction:column!important;
align-items:center!important;
justify-content:center!important;
gap:3px!important;
padding:3px 2px!important;
margin:0!important;
border-radius:16px!important;
color:#7a6670!important;
background:transparent!important;
text-decoration:none!important;
box-shadow:none!important;
font-size:9px!important;
font-weight:700!important;
line-height:1.05!important;
transition:none!important;
transform:none!important;
}
.tia-dock-item strong{
display:flex!important;
align-items:center!important;
justify-content:center!important;
width:30px!important;
height:26px!important;
min-width:30px!important;
min-height:26px!important;
margin:0!important;
padding:0!important;
border-radius:10px!important;
background:transparent!important;
color:#846d78!important;
font-size:18px!important;
line-height:1!important;
box-shadow:none!important;
}
.tia-dock-item span{
display:block!important;
max-width:100%!important;
white-space:nowrap!important;
overflow:hidden!important;
text-overflow:ellipsis!important;
color:inherit!important;
}
.tia-dock-item.active,
.tia-dock-item[aria-current="page"]{
color:#e64980!important;
background:rgba(255,255,255,.58)!important;
}
.tia-dock-item.active strong,
.tia-dock-item[aria-current="page"] strong{
color:#e64980!important;
background:#fff!important;
box-shadow:0 4px 12px rgba(230,73,128,.16)!important;
}
/* nếu chưa có class active thì Hệ Thống vẫn nổi bật với admin */
.tia-dock.has-admin .tia-dock-item:last-child{
color:#d94b80!important;
}
.tia-home-indicator{
display:none!important;
}
/* chừa đủ chỗ cho dock kiểu mới */
.tia-app-grid{
padding-bottom:94px!important;
}
.tia-central-hub{
padding-bottom:94px!important;
}
/* cụm nút nổi không đè dock */
.tia-floating-actions{
bottom:82px!important;
}
/* bộ đếm thời gian không đè dock */
.tia-time-badge{
bottom:82px!important;
}
}
/* Điện thoại rất nhỏ */
@media (max-width:374px){
.tia-dock,
.tia-screen .tia-dock{
width:calc(100vw - 10px)!important;
max-width:calc(100vw - 10px)!important;
height:62px!important;
border-radius:20px!important;
padding-left:5px!important;
padding-right:5px!important;
}
.tia-dock-item{
height:48px!important;
font-size:8px!important;
gap:2px!important;
}
.tia-dock-item strong{
width:27px!important;
height:24px!important;
font-size:16px!important;
}
}
@media (max-width:767px){
.tia-screen{
transform:none!important;
-webkit-transform:none!important;
contain:none!important;
}
.tia-ipad{
transform:none!important;
-webkit-transform:none!important;
contain:none!important;
}
.tia-dock,
.tia-screen .tia-dock{
position:fixed!important;
left:7px!important;
right:7px!important;
bottom:max(6px,env(safe-area-inset-bottom))!important;
top:auto!important;
transform:none!important;
-webkit-transform:none!important;
width:auto!important;
max-width:none!important;
min-width:0!important;
height:66px!important;
display:grid!important;
grid-template-columns:repeat(4,minmax(0,1fr))!important;
align-items:center!important;
margin:0!important;
padding:6px 8px max(6px,env(safe-area-inset-bottom))!important;
border-radius:22px!important;
background:linear-gradient(180deg,#fff8fb 0%,#ffe8f0 100%)!important;
border:1px solid rgba(255,255,255,.96)!important;
box-shadow:0 10px 28px rgba(190,70,115,.20),0 2px 7px rgba(31,41,55,.08)!important;
overflow:hidden!important;
visibility:visible!important;
opacity:1!important;
z-index:2147483640!important;
}
.tia-dock.has-admin{
grid-template-columns:repeat(5,minmax(0,1fr))!important;
}
.tia-dock-item{
width:100%!important;
min-width:0!important;
height:52px!important;
padding:3px 1px!important;
display:flex!important;
flex-direction:column!important;
align-items:center!important;
justify-content:center!important;
gap:3px!important;
border-radius:15px!important;
font-size:9px!important;
line-height:1!important;
}
.tia-dock-item strong{
width:auto!important;
height:auto!important;
min-width:0!important;
min-height:0!important;
font-size:18px!important;
line-height:1!important;
}
.tia-dock-item span{
display:block!important;
width:100%!important;
text-align:center!important;
white-space:nowrap!important;
overflow:hidden!important;
text-overflow:ellipsis!important;
}
.tia-app-grid,
.tia-central-hub{
padding-bottom:98px!important;
}
.tia-floating-actions,
.tia-time-badge{
bottom:84px!important;
}
}
@media (max-width:374px){
.tia-dock,
.tia-screen .tia-dock{
left:5px!important;
right:5px!important;
height:62px!important;
border-radius:19px!important;
}
.tia-dock-item{height:48px!important;font-size:8px!important}
.tia-dock-item strong{font-size:16px!important}
}
/* v1.16.0 - CLEAN APP LAYOUT
Một hệ layout duy nhất cho tablet/desktop.
Mobile và dock giữ nguyên. */
@media (min-width:768px){
.tia-app-pager{
--tia-card-w:170px;
--tia-card-h:170px;
--tia-col-gap:18px;
--tia-row-gap:22px;
--tia-top-gap:18px;
--tia-bottom-gap:18px;
display:block!important;
width:auto!important;
max-width:none!important;
min-width:0!important;
height:auto!important;
margin:var(--tia-top-gap) auto var(--tia-bottom-gap)!important;
padding:0!important;
position:relative!important;
top:auto!important;
left:auto!important;
overflow:hidden!important;
box-sizing:border-box!important;
}
.tia-app-track{
display:flex!important;
width:100%!important;
height:auto!important;
transform:translate3d(0,0,0);
will-change:transform;
}
.tia-app-page{
flex:0 0 100%!important;
width:100%!important;
min-width:100%!important;
display:grid!important;
grid-template-columns:repeat(4,var(--tia-card-w))!important;
grid-auto-rows:var(--tia-card-h)!important;
column-gap:var(--tia-col-gap)!important;
row-gap:var(--tia-row-gap)!important;
justify-content:center!important;
align-content:start!important;
margin:0!important;
padding:0!important;
box-sizing:border-box!important;
}
.tia-app{
width:var(--tia-card-w)!important;
height:var(--tia-card-h)!important;
min-width:0!important;
min-height:0!important;
max-width:none!important;
max-height:none!important;
display:flex!important;
flex-direction:column!important;
align-items:center!important;
justify-content:center!important;
text-align:center!important;
margin:0!important;
padding:14px 12px!important;
border-radius:24px!important;
box-sizing:border-box!important;
background:rgba(255,255,255,.88)!important;
border:1px solid rgba(255,255,255,.82)!important;
box-shadow:0 8px 22px rgba(31,41,55,.07)!important;
backdrop-filter:blur(6px)!important;
-webkit-backdrop-filter:blur(6px)!important;
transition:transform .18s ease,box-shadow .18s ease!important;
overflow:hidden!important;
}
.tia-app:hover{
transform:translateY(-2px)!important;
box-shadow:0 11px 26px rgba(31,41,55,.10)!important;
}
.tia-app-icon{
width:64px!important;
height:64px!important;
flex:0 0 64px!important;
margin:0 auto 9px!important;
border-radius:18px!important;
font-size:30px!important;
align-self:center!important;
}
.tia-app-icon img{
width:100%!important;
height:100%!important;
object-fit:cover!important;
border-radius:inherit!important;
}
.tia-app-name{
width:92%!important;
max-width:92%!important;
margin:0 auto 5px!important;
font-family:"Segoe UI Variable Text","Segoe UI",Arial,sans-serif!important;
font-size:15px!important;
line-height:1.18!important;
font-weight:600!important;
letter-spacing:0!important;
color:#202124!important;
text-align:center!important;
}
.tia-app-desc{
width:92%!important;
max-width:92%!important;
min-height:0!important;
margin:0 auto!important;
font-size:9.5px!important;
line-height:1.25!important;
color:#7b828c!important;
text-align:center!important;
display:-webkit-box!important;
-webkit-line-clamp:2!important;
-webkit-box-orient:vertical!important;
overflow:hidden!important;
}
.tia-app-arrow{
display:none!important;
}
.tia-app-pages{
position:relative!important;
left:auto!important;
bottom:auto!important;
transform:none!important;
margin:10px auto 0!important;
}
}
/* Tablet */
@media (min-width:768px) and (max-width:1199px){
.tia-app-pager{
--tia-card-w:145px;
--tia-card-h:145px;
--tia-col-gap:14px;
--tia-row-gap:18px;
--tia-top-gap:14px;
--tia-bottom-gap:14px;
}
.tia-app-icon{
width:54px!important;
height:54px!important;
flex-basis:54px!important;
}
.tia-app-name{font-size:13px!important}
.tia-app-desc{font-size:8.5px!important}
}
/* Desktop 1200-1919 */
@media (min-width:1200px) and (max-width:1919px){
.tia-app-pager{
--tia-card-w:160px;
--tia-card-h:160px;
--tia-col-gap:16px;
--tia-row-gap:20px;
--tia-top-gap:16px;
--tia-bottom-gap:16px;
}
}
/* Full HD chuẩn */
@media (min-width:1920px) and (max-width:2559px){
.tia-app-pager{
--tia-card-w:178px;
--tia-card-h:178px;
--tia-col-gap:18px;
--tia-row-gap:22px;
--tia-top-gap:18px;
--tia-bottom-gap:18px;
}
}
/* 2K/4K */
@media (min-width:2560px){
.tia-app-pager{
--tia-card-w:200px;
--tia-card-h:200px;
--tia-col-gap:22px;
--tia-row-gap:26px;
--tia-top-gap:22px;
--tia-bottom-gap:22px;
}
.tia-app-icon{
width:72px!important;
height:72px!important;
flex-basis:72px!important;
}
.tia-app-name{font-size:16px!important}
.tia-app-desc{font-size:10px!important}
}
/* Mobile giữ nguyên launcher hiện tại */
@media (max-width:767px){
.tia-app-pager{
width:auto!important;
height:auto!important;
margin:0!important;
padding:0!important;
}
.tia-app-track,
.tia-app-page{
display:contents!important;
}
.tia-app-pages{
display:none!important;
}
}
/* v1.16.1 - Chốt khoảng cách dọc + tăng chiều rộng card */
@media (min-width:768px){
.tia-app-pager .tia-app-page{
display:grid!important;
grid-template-columns:repeat(4,var(--tia-card-w))!important;
grid-auto-rows:var(--tia-card-h)!important;
/* ép dứt điểm khoảng cách thật giữa các hàng/cột */
row-gap:var(--tia-row-gap)!important;
column-gap:var(--tia-col-gap)!important;
gap:var(--tia-row-gap) var(--tia-col-gap)!important;
align-content:start!important;
justify-content:center!important;
padding:0!important;
margin:0!important;
}
.tia-app-pager .tia-app{
width:var(--tia-card-w)!important;
height:var(--tia-card-h)!important;
min-width:var(--tia-card-w)!important;
max-width:var(--tia-card-w)!important;
min-height:var(--tia-card-h)!important;
max-height:var(--tia-card-h)!important;
margin:0!important;
box-sizing:border-box!important;
}
.tia-app-pager .tia-app-desc{
width:94%!important;
max-width:94%!important;
white-space:normal!important;
word-break:normal!important;
overflow-wrap:break-word!important;
}
}
/* Tablet */
@media (min-width:768px) and (max-width:1199px){
.tia-app-pager{
--tia-card-w:158px!important;
--tia-card-h:148px!important;
--tia-col-gap:16px!important;
--tia-row-gap:20px!important;
}
}
/* Desktop nhỏ / laptop */
@media (min-width:1200px) and (max-width:1919px){
.tia-app-pager{
--tia-card-w:178px!important;
--tia-card-h:158px!important;
--tia-col-gap:18px!important;
--tia-row-gap:22px!important;
}
}
/* Full HD 1920x1080 */
@media (min-width:1920px) and (max-width:2559px){
.tia-app-pager{
--tia-card-w:198px!important;
--tia-card-h:168px!important;
--tia-col-gap:20px!important;
--tia-row-gap:24px!important;
}
.tia-app-pager .tia-app-icon{
width:62px!important;
height:62px!important;
flex-basis:62px!important;
}
.tia-app-pager .tia-app-name{
font-size:15px!important;
}
.tia-app-pager .tia-app-desc{
font-size:10px!important;
line-height:1.3!important;
}
}
/* 2K / 4K */
@media (min-width:2560px){
.tia-app-pager{
--tia-card-w:224px!important;
--tia-card-h:188px!important;
--tia-col-gap:24px!important;
--tia-row-gap:28px!important;
}
}
/* Mobile giữ nguyên */
@media (max-width:767px){
.tia-app-pager .tia-app{
min-width:0!important;
max-width:none!important;
min-height:0!important;
max-height:none!important;
}
}
/* v1.16.2 - SỬA TẬN GỐC KHOẢNG CÁCH DỌC
Không dùng row-gap để xếp hàng nữa.
Mỗi track = chiều cao card + khoảng cách dọc, nên card không thể chồng hàng. */
@media (min-width:768px){
.tia-app-pager .tia-app-page{
display:grid!important;
grid-template-columns:repeat(4,var(--tia-card-w))!important;
/* Quan trọng: chiều cao mỗi hàng đã bao gồm khoảng trống phía dưới */
grid-auto-rows:calc(var(--tia-card-h) + var(--tia-row-gap))!important;
grid-template-rows:none!important;
column-gap:var(--tia-col-gap)!important;
row-gap:0!important;
gap:0 var(--tia-col-gap)!important;
align-items:start!important;
align-content:start!important;
justify-content:center!important;
padding:0!important;
margin:0 0 calc(0px - var(--tia-row-gap))!important;
box-sizing:border-box!important;
}
.tia-app-pager .tia-app{
width:var(--tia-card-w)!important;
height:var(--tia-card-h)!important;
min-width:var(--tia-card-w)!important;
max-width:var(--tia-card-w)!important;
min-height:var(--tia-card-h)!important;
max-height:var(--tia-card-h)!important;
align-self:start!important;
justify-self:center!important;
margin:0!important;
box-sizing:border-box!important;
}
.tia-app-pager .tia-app-desc{
width:94%!important;
max-width:94%!important;
line-height:1.3!important;
}
}
/* Tablet */
@media (min-width:768px) and (max-width:1199px){
.tia-app-pager{
--tia-card-w:168px!important;
--tia-card-h:148px!important;
--tia-col-gap:18px!important;
--tia-row-gap:20px!important;
}
}
/* Laptop/Desktop dưới Full HD */
@media (min-width:1200px) and (max-width:1919px){
.tia-app-pager{
--tia-card-w:192px!important;
--tia-card-h:158px!important;
--tia-col-gap:20px!important;
--tia-row-gap:24px!important;
}
}
/* Full HD */
@media (min-width:1920px) and (max-width:2559px){
.tia-app-pager{
--tia-card-w:212px!important;
--tia-card-h:168px!important;
--tia-col-gap:22px!important;
--tia-row-gap:26px!important;
}
.tia-app-pager .tia-app-desc{
font-size:10px!important;
}
}
/* 2K / 4K */
@media (min-width:2560px){
.tia-app-pager{
--tia-card-w:238px!important;
--tia-card-h:188px!important;
--tia-col-gap:26px!important;
--tia-row-gap:30px!important;
}
}
/* Mobile không đổi */
@media (max-width:767px){
.tia-app-pager .tia-app-page{
margin:0!important;
}
}
/* v1.16.3 - FIX DỨT ĐIỂM LAYOUT TABLET/DESKTOP
Pager có đồng thời class tia-app-grid + tia-app-pager.
Reset toàn bộ rule grid cũ và dùng FLEX 4 cột để gap dọc luôn tồn tại. */
@media (min-width:768px){
/* Reset các rule .tia-app-grid cũ có specificity cao */
.tia-screen .tia-app-grid.tia-app-pager,
.tia-screen.tia-ad-layout .tia-app-grid.tia-app-pager,
.tia-screen.tia-ad-fhd .tia-app-grid.tia-app-pager,
.tia-screen.tia-ad-hires .tia-app-grid.tia-app-pager{
display:block!important;
grid-template-columns:none!important;
gap:0!important;
width:auto!important;
max-width:none!important;
min-width:0!important;
padding:0!important;
padding-top:0!important;
padding-right:0!important;
padding-bottom:0!important;
padding-left:0!important;
margin-top:18px!important;
margin-bottom:20px!important;
overflow:hidden!important;
align-content:normal!important;
box-sizing:border-box!important;
}
.tia-app-pager > .tia-app-track{
display:flex!important;
width:100%!important;
height:auto!important;
align-items:flex-start!important;
}
/* FLEX thay Grid: 4 card mỗi hàng, gap thật 100% */
.tia-app-pager > .tia-app-track > .tia-app-page{
flex:0 0 100%!important;
width:100%!important;
min-width:100%!important;
display:flex!important;
flex-direction:row!important;
flex-wrap:wrap!important;
align-items:flex-start!important;
align-content:flex-start!important;
justify-content:center!important;
column-gap:var(--tia-col-gap)!important;
row-gap:var(--tia-row-gap)!important;
gap:var(--tia-row-gap) var(--tia-col-gap)!important;
padding:0!important;
margin:0!important;
box-sizing:border-box!important;
}
.tia-app-pager > .tia-app-track > .tia-app-page > .tia-app{
flex:0 0 var(--tia-card-w)!important;
width:var(--tia-card-w)!important;
height:var(--tia-card-h)!important;
min-width:var(--tia-card-w)!important;
max-width:var(--tia-card-w)!important;
min-height:var(--tia-card-h)!important;
max-height:var(--tia-card-h)!important;
margin:0!important;
align-self:flex-start!important;
box-sizing:border-box!important;
}
.tia-app-pager .tia-app-desc{
width:94%!important;
max-width:94%!important;
min-height:0!important;
line-height:1.3!important;
}
}
/* Tablet */
@media (min-width:768px) and (max-width:1199px){
.tia-app-pager{
--tia-card-w:164px!important;
--tia-card-h:146px!important;
--tia-col-gap:18px!important;
--tia-row-gap:22px!important;
}
}
/* Laptop / desktop có viewport dưới 1920 */
@media (min-width:1200px) and (max-width:1919px){
.tia-app-pager{
--tia-card-w:184px!important;
--tia-card-h:150px!important;
--tia-col-gap:20px!important;
--tia-row-gap:26px!important;
}
}
/* Full HD 1920 */
@media (min-width:1920px) and (max-width:2559px){
.tia-app-pager{
--tia-card-w:210px!important;
--tia-card-h:156px!important;
--tia-col-gap:22px!important;
--tia-row-gap:28px!important;
}
.tia-app-pager .tia-app-name{
font-size:15px!important;
}
.tia-app-pager .tia-app-desc{
font-size:10px!important;
line-height:1.32!important;
}
}
/* 2K / 4K */
@media (min-width:2560px){
.tia-app-pager{
--tia-card-w:236px!important;
--tia-card-h:176px!important;
--tia-col-gap:26px!important;
--tia-row-gap:32px!important;
}
}
/* Mobile hoàn toàn giữ nguyên */
@media (max-width:767px){
.tia-screen .tia-app-grid.tia-app-pager{
display:block!important;
}
.tia-app-pager > .tia-app-track,
.tia-app-pager > .tia-app-track > .tia-app-page{
display:contents!important;
}
}
/* v1.16.4 - tăng chiều dọc card để logo/tên/mô tả hiển thị thoáng hơn */
@media (min-width:768px) and (max-width:1199px){
.tia-app-pager{
--tia-card-h:162px!important;
}
}
@media (min-width:1200px) and (max-width:1919px){
.tia-app-pager{
--tia-card-h:172px!important;
}
}
@media (min-width:1920px) and (max-width:2559px){
.tia-app-pager{
--tia-card-h:184px!important;
}
}
@media (min-width:2560px){
.tia-app-pager{
--tia-card-h:204px!important;
}
}
/* Giữ nội dung cân giữa và cho mô tả đủ không gian */
@media (min-width:768px){
.tia-app-pager > .tia-app-track > .tia-app-page > .tia-app{
justify-content:center!important;
padding-top:14px!important;
padding-bottom:14px!important;
}
.tia-app-pager .tia-app-icon{
flex:0 0 auto!important;
}
.tia-app-pager .tia-app-name{
flex:0 0 auto!important;
}
.tia-app-pager .tia-app-desc{
flex:0 0 auto!important;
overflow:visible!important;
white-space:normal!important;
}
}
/* v1.16.5 - Card cao hơn để tên dài + mô tả không bị cắt */
@media (min-width:768px){
.tia-app-pager > .tia-app-track > .tia-app-page > .tia-app{
padding:16px 14px 15px!important;
overflow:hidden!important;
justify-content:center!important;
}
.tia-app-pager .tia-app-icon{
flex:0 0 auto!important;
margin-bottom:10px!important;
}
/* Dành sẵn 2 dòng cho tên ứng dụng */
.tia-app-pager .tia-app-name{
width:94%!important;
max-width:94%!important;
min-height:2.36em!important;
margin:0 auto 6px!important;
display:flex!important;
align-items:center!important;
justify-content:center!important;
text-align:center!important;
white-space:normal!important;
overflow:visible!important;
}
/* Dành sẵn 2 dòng cho mô tả, không để đáy card che chữ */
.tia-app-pager .tia-app-desc{
width:94%!important;
max-width:94%!important;
min-height:2.6em!important;
max-height:none!important;
margin:0 auto!important;
padding:0 0 2px!important;
display:block!important;
overflow:visible!important;
white-space:normal!important;
text-overflow:clip!important;
-webkit-line-clamp:unset!important;
-webkit-box-orient:initial!important;
line-height:1.3!important;
text-align:center!important;
}
}
/* Tablet */
@media (min-width:768px) and (max-width:1199px){
.tia-app-pager{
--tia-card-h:178px!important;
}
}
/* Laptop / desktop dưới Full HD */
@media (min-width:1200px) and (max-width:1919px){
.tia-app-pager{
--tia-card-h:194px!important;
}
}
/* Full HD chuẩn 1920x1080 */
@media (min-width:1920px) and (max-width:2559px){
.tia-app-pager{
--tia-card-h:212px!important;
}
.tia-app-pager .tia-app-icon{
width:64px!important;
height:64px!important;
flex-basis:64px!important;
}
.tia-app-pager .tia-app-name{
font-size:15px!important;
}
.tia-app-pager .tia-app-desc{
font-size:10px!important;
}
}
/* 2K / 4K */
@media (min-width:2560px){
.tia-app-pager{
--tia-card-h:232px!important;
}
}
/* Mobile giữ nguyên hoàn toàn */
@media (max-width:767px){
.tia-app-pager .tia-app-name,
.tia-app-pager .tia-app-desc{
min-height:0!important;
}
}
/* v1.16.6 - FIX 2K/4K: không cắt logo, tên, mô tả */
@media (min-width:2560px){
.tia-app-pager{
--tia-card-w:244px!important;
--tia-card-h:252px!important;
--tia-col-gap:28px!important;
--tia-row-gap:34px!important;
}
.tia-app-pager > .tia-app-track > .tia-app-page > .tia-app{
height:var(--tia-card-h)!important;
min-height:var(--tia-card-h)!important;
max-height:var(--tia-card-h)!important;
padding:22px 16px 20px!important;
overflow:visible!important;
justify-content:flex-start!important;
box-sizing:border-box!important;
}
/* Icon nhỏ vừa phải để không bị đẩy lên sát mép card */
.tia-app-pager .tia-app-icon{
width:72px!important;
height:72px!important;
flex:0 0 72px!important;
margin:0 auto 14px!important;
align-self:center!important;
}
/* Tên luôn có đủ chỗ cho 2 dòng */
.tia-app-pager .tia-app-name{
width:94%!important;
max-width:94%!important;
min-height:2.45em!important;
max-height:none!important;
margin:0 auto 10px!important;
display:flex!important;
align-items:center!important;
justify-content:center!important;
font-size:17px!important;
line-height:1.22!important;
font-weight:600!important;
white-space:normal!important;
overflow:visible!important;
text-overflow:clip!important;
}
/* Mô tả không cắt đáy, cho phép 2-3 dòng */
.tia-app-pager .tia-app-desc{
width:94%!important;
max-width:94%!important;
min-height:3.8em!important;
max-height:none!important;
margin:0 auto!important;
padding:0 0 4px!important;
display:block!important;
font-size:11px!important;
line-height:1.38!important;
white-space:normal!important;
overflow:visible!important;
text-overflow:clip!important;
-webkit-line-clamp:unset!important;
-webkit-box-orient:initial!important;
}
.tia-app-pager .tia-app-arrow{
display:none!important;
}
}
/* 4K rất rộng: tăng thêm chiều cao nhưng không phóng icon quá lớn */
@media (min-width:3200px){
.tia-app-pager{
--tia-card-w:270px!important;
--tia-card-h:278px!important;
--tia-col-gap:32px!important;
--tia-row-gap:38px!important;
}
.tia-app-pager .tia-app-icon{
width:78px!important;
height:78px!important;
flex-basis:78px!important;
}
.tia-app-pager .tia-app-name{
font-size:18px!important;
}
.tia-app-pager .tia-app-desc{
font-size:11.5px!important;
}
}
/* Full HD vẫn giữ bố cục hiện tại */
@media (min-width:1920px) and (max-width:2559px){
.tia-app-pager > .tia-app-track > .tia-app-page > .tia-app{
overflow:visible!important;
}
}
/* v1.16.7 - Không cắt góc logo/icon ứng dụng */
@media (min-width:768px){
.tia-app-pager .tia-app-icon{
overflow:visible!important;
padding:4px!important;
box-sizing:border-box!important;
}
.tia-app-pager .tia-app-icon img{
width:100%!important;
height:100%!important;
object-fit:contain!important;
object-position:center!important;
/* Không bo góc trực tiếp ảnh logo để tránh lẹm mất góc */
border-radius:0!important;
display:block!important;
margin:auto!important;
}
}
/* Mobile cũng tránh cắt góc ảnh logo, không đổi bố cục */
@media (max-width:767px){
.tia-app-icon{
overflow:visible!important;
}
.tia-app-icon img{
object-fit:contain!important;
object-position:center!important;
border-radius:0!important;
}
}
/* =========================================================
v1.16.8 - Cân lại nội dung card theo mẫu đã chốt
Logo -> tiêu đề -> mô tả gần nhau, nằm gọn trong card.
========================================================= */
@media (min-width: 768px) {
.tia-app-pager .tia-app-card {
box-sizing: border-box !important;
overflow: hidden !important;
padding: 14px 12px 13px !important;
}
/* Gom toàn bộ nội dung thành một cụm cân đối */
.tia-app-pager .tia-app-card,
.tia-app-pager .tia-app-card > a {
align-items: center !important;
justify-content: flex-start !important;
}
.tia-app-pager .tia-app-card > a {
width: 100% !important;
height: 100% !important;
box-sizing: border-box !important;
display: flex !important;
flex-direction: column !important;
text-align: center !important;
padding: 0 !important;
gap: 0 !important;
}
.tia-app-pager .tia-app-icon {
flex: 0 0 auto !important;
margin: 0 auto 9px !important;
}
.tia-app-pager .tia-app-title,
.tia-app-pager .tia-app-name {
flex: 0 0 auto !important;
width: 100% !important;
margin: 0 0 6px !important;
padding: 0 2px !important;
line-height: 1.18 !important;
text-align: center !important;
overflow: visible !important;
white-space: normal !important;
word-break: normal !important;
overflow-wrap: break-word !important;
}
.tia-app-pager .tia-app-desc,
.tia-app-pager .tia-app-description {
flex: 0 0 auto !important;
width: 100% !important;
margin: 0 !important;
padding: 0 3px !important;
line-height: 1.32 !important;
text-align: center !important;
white-space: normal !important;
overflow: visible !important;
word-break: normal !important;
overflow-wrap: break-word !important;
}
/* Không cho các luật cũ đẩy mô tả xuống đáy hoặc dùng space-between */
.tia-app-pager .tia-app-card * {
min-height: 0;
}
}
/* Full HD: giữ chữ thoáng nhưng không tràn card */
@media (min-width: 1600px) and (max-width: 2559px) {
.tia-app-pager .tia-app-card {
padding-top: 15px !important;
padding-bottom: 14px !important;
}
.tia-app-pager .tia-app-icon {
margin-bottom: 8px !important;
}
.tia-app-pager .tia-app-title,
.tia-app-pager .tia-app-name {
margin-bottom: 5px !important;
}
}
/* 2K / 4K: không kéo giãn khoảng cách theo chiều cao màn hình */
@media (min-width: 2560px) {
.tia-app-pager .tia-app-card {
padding: 16px 14px 15px !important;
}
.tia-app-pager .tia-app-icon {
margin-bottom: 9px !important;
}
.tia-app-pager .tia-app-title,
.tia-app-pager .tia-app-name {
margin-bottom: 6px !important;
}
}
/* v1.16.9 - Thu sát logo/icon với tên ứng dụng */
@media (min-width:768px){
.tia-app-pager .tia-app-icon{
margin:0 auto 2px!important;
}
.tia-app-pager .tia-app-title,
.tia-app-pager .tia-app-name{
margin-top:0!important;
margin-bottom:4px!important;
}
}
/* Full HD / 2K / 4K giữ khoảng cách icon -> tên rất gọn */
@media (min-width:1600px){
.tia-app-pager .tia-app-icon{
margin-bottom:1px!important;
}
}
/* Mobile giữ nguyên giao diện hiện tại */
@media (max-width:767px){
.tia-app-pager .tia-app-icon{
margin-bottom:initial;
}
}
/* v1.17.0 - Gom sát logo + tiêu đề + mô tả */
@media (min-width:768px){
.tia-app-pager .tia-app-icon{
margin:0 auto -3px!important;
}
.tia-app-pager .tia-app-title,
.tia-app-pager .tia-app-name{
margin-top:0!important;
margin-bottom:0!important;
line-height:1.12!important;
}
.tia-app-pager .tia-app-desc,
.tia-app-pager .tia-app-description{
margin-top:-1px!important;
margin-bottom:0!important;
line-height:1.22!important;
}
}
/* Full HD / 2K / 4K: không cho breakpoint cũ nới khoảng cách trở lại */
@media (min-width:1600px){
.tia-app-pager .tia-app-icon{
margin-bottom:-4px!important;
}
.tia-app-pager .tia-app-title,
.tia-app-pager .tia-app-name{
margin-bottom:0!important;
}
.tia-app-pager .tia-app-desc,
.tia-app-pager .tia-app-description{
margin-top:-2px!important;
}
}
/* =========================================================
v1.17.2 - MOBILE ONLY: launcher 4 cột
Chỉ áp dụng điện thoại, không ảnh hưởng tablet/desktop.
========================================================= */
@media (max-width:767px){
/* Khôi phục lưới 4 cột thật trên điện thoại */
.tia-screen .tia-app-grid.tia-app-pager{
display:grid!important;
grid-template-columns:repeat(4,minmax(0,1fr))!important;
column-gap:8px!important;
row-gap:20px!important;
gap:20px 8px!important;
width:100%!important;
max-width:100%!important;
min-width:0!important;
margin:0!important;
padding:18px 12px 128px!important;
box-sizing:border-box!important;
overflow:visible!important;
align-items:start!important;
justify-items:center!important;
}
/* Bỏ wrapper phân trang desktop trên mobile */
.tia-app-pager > .tia-app-track,
.tia-app-pager > .tia-app-track > .tia-app-page{
display:contents!important;
}
.tia-app-pager .tia-app-pages{
display:none!important;
}
/* App mobile: chỉ icon + tên, không card trắng */
.tia-app-pager .tia-app,
.tia-app-pager .tia-app-card{
width:100%!important;
min-width:0!important;
max-width:none!important;
height:auto!important;
min-height:0!important;
max-height:none!important;
display:flex!important;
flex-direction:column!important;
align-items:center!important;
justify-content:flex-start!important;
margin:0!important;
padding:0!important;
background:transparent!important;
border:0!important;
border-radius:0!important;
box-shadow:none!important;
backdrop-filter:none!important;
-webkit-backdrop-filter:none!important;
overflow:visible!important;
transform:none!important;
}
.tia-app-pager .tia-app > a,
.tia-app-pager .tia-app-card > a{
width:100%!important;
height:auto!important;
display:flex!important;
flex-direction:column!important;
align-items:center!important;
justify-content:flex-start!important;
padding:0!important;
margin:0!important;
text-align:center!important;
gap:0!important;
}
/* Icon co giãn theo chiều ngang màn hình để 4 cột luôn vừa */
.tia-app-pager .tia-app-icon{
width:clamp(58px,16vw,82px)!important;
height:clamp(58px,16vw,82px)!important;
flex:0 0 auto!important;
margin:0 auto 7px!important;
padding:0!important;
border-radius:22%!important;
overflow:visible!important;
box-sizing:border-box!important;
}
.tia-app-pager .tia-app-icon img{
width:100%!important;
height:100%!important;
object-fit:contain!important;
object-position:center!important;
border-radius:0!important;
}
/* Tên app tối đa 2 dòng, vừa 4 cột */
.tia-app-pager .tia-app-name,
.tia-app-pager .tia-app-title{
width:100%!important;
max-width:100%!important;
min-height:0!important;
margin:0!important;
padding:0 1px!important;
font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif!important;
font-size:clamp(11px,3.1vw,14px)!important;
line-height:1.18!important;
font-weight:500!important;
letter-spacing:0!important;
color:#25262b!important;
text-align:center!important;
white-space:normal!important;
overflow:visible!important;
word-break:normal!important;
overflow-wrap:break-word!important;
}
/* Mobile chỉ giữ icon + tên */
.tia-app-pager .tia-app-desc,
.tia-app-pager .tia-app-description,
.tia-app-pager .tia-app-arrow{
display:none!important;
}
/* Không để luật desktop/2K cũ chen vào mobile */
.tia-app-pager{
--tia-card-w:auto!important;
--tia-card-h:auto!important;
--tia-col-gap:8px!important;
--tia-row-gap:20px!important;
}
}
/* Điện thoại rất hẹp: vẫn giữ 4 cột */
@media (max-width:390px){
.tia-screen .tia-app-grid.tia-app-pager{
column-gap:6px!important;
row-gap:18px!important;
gap:18px 6px!important;
padding-left:8px!important;
padding-right:8px!important;
}
.tia-app-pager .tia-app-icon{
width:clamp(54px,15.5vw,66px)!important;
height:clamp(54px,15.5vw,66px)!important;
}
.tia-app-pager .tia-app-name,
.tia-app-pager .tia-app-title{
font-size:clamp(10px,3vw,12px)!important;
}
}
/* =========================================================
v1.17.3 - Cho phép cuộn ứng dụng khi tràn xuống dưới
Áp dụng mobile + tablet + desktop.
Dock vẫn cố định, app cuối không bị dock che.
========================================================= */
/* Khung chính cho phép nội dung ứng dụng cuộn dọc */
.tia-screen{
overflow-x:hidden!important;
overflow-y:auto!important;
overscroll-behavior-y:contain;
-webkit-overflow-scrolling:touch;
scrollbar-gutter:stable both-edges;
}
/* Khu vực ứng dụng luôn có khoảng đệm phía dưới lớn hơn dock */
.tia-app-grid.tia-app-pager{
box-sizing:border-box!important;
padding-bottom:calc(118px + env(safe-area-inset-bottom, 0px))!important;
}
/* Nếu wrapper bên trong đang chặn scroll thì mở lại */
.tia-app-track,
.tia-app-page{
max-height:none!important;
overflow:visible!important;
}
/* Dock luôn nổi trên nội dung, không chiếm mất phần app cuối */
.tia-dock{
position:fixed!important;
left:50%!important;
transform:translateX(-50%)!important;
bottom:12px!important;
z-index:2147482000!important;
}
/* Desktop / tablet: cuộn mượt bằng chuột, touchpad, bánh xe */
@media (min-width:768px){
.tia-screen{
scroll-behavior:smooth;
}
.tia-app-grid.tia-app-pager{
padding-bottom:130px!important;
}
}
/* Mobile: chừa thêm safe-area và tối ưu vuốt */
@media (max-width:767px){
.tia-screen{
touch-action:pan-y!important;
scroll-behavior:auto!important;
}
.tia-screen .tia-app-grid.tia-app-pager{
padding-bottom:calc(150px + env(safe-area-inset-bottom, 0px))!important;
}
}
/* Màn hình thấp: vẫn đủ khoảng để cuộn app cuối qua khỏi dock */
@media (max-height:720px){
.tia-app-grid.tia-app-pager{
padding-bottom:calc(145px + env(safe-area-inset-bottom, 0px))!important;
}
}
/* =========================================================
v1.18.1 - CROSS-BROWSER APP CARD LAYOUT
Khóa bố cục logo / tên / mô tả theo 3 vùng cố định để
Chrome, Cốc Cốc, Edge không lệch vì font metrics/sub-pixel.
========================================================= */
@media (min-width:768px){
.tia-screen .tia-app-pager .tia-app,
.tia-screen .tia-app-pager .tia-app-card{
box-sizing:border-box!important;
overflow:hidden!important;
padding:0!important;
}
.tia-screen .tia-app-pager .tia-app > a,
.tia-screen .tia-app-pager .tia-app-card > a{
--tia-icon-zone:74px;
--tia-title-zone:38px;
--tia-desc-zone:32px;
--tia-zone-gap:3px;
width:100%!important;
height:100%!important;
min-width:0!important;
min-height:0!important;
display:grid!important;
grid-template-columns:minmax(0,1fr)!important;
grid-template-rows:
var(--tia-icon-zone)
var(--tia-title-zone)
var(--tia-desc-zone)!important;
row-gap:var(--tia-zone-gap)!important;
column-gap:0!important;
align-content:center!important;
align-items:stretch!important;
justify-items:center!important;
margin:0!important;
padding:10px 12px!important;
box-sizing:border-box!important;
text-align:center!important;
}
/* VÙNG 1: LOGO */
.tia-screen .tia-app-pager .tia-app-icon{
grid-row:1!important;
align-self:center!important;
justify-self:center!important;
width:62px!important;
height:62px!important;
min-width:62px!important;
min-height:62px!important;
max-width:62px!important;
max-height:62px!important;
margin:0!important;
padding:3px!important;
display:flex!important;
align-items:center!important;
justify-content:center!important;
box-sizing:border-box!important;
overflow:visible!important;
line-height:1!important;
}
.tia-screen .tia-app-pager .tia-app-icon img{
width:100%!important;
height:100%!important;
display:block!important;
object-fit:contain!important;
object-position:center!important;
border-radius:0!important;
margin:0!important;
padding:0!important;
}
/* VÙNG 2: TÊN ỨNG DỤNG - tối đa 2 dòng */
.tia-screen .tia-app-pager .tia-app-name,
.tia-screen .tia-app-pager .tia-app-title{
grid-row:2!important;
align-self:center!important;
justify-self:stretch!important;
width:100%!important;
height:38px!important;
min-height:38px!important;
max-height:38px!important;
margin:0!important;
padding:0 2px!important;
display:flex!important;
align-items:center!important;
justify-content:center!important;
font-family:"Segoe UI",Arial,sans-serif!important;
font-size:15px!important;
font-weight:600!important;
font-style:normal!important;
font-synthesis:none!important;
line-height:18px!important;
letter-spacing:0!important;
color:#202124!important;
text-align:center!important;
white-space:normal!important;
word-break:normal!important;
overflow-wrap:break-word!important;
overflow:hidden!important;
text-overflow:clip!important;
box-sizing:border-box!important;
}
/* VÙNG 3: MÔ TẢ - tối đa 2 dòng */
.tia-screen .tia-app-pager .tia-app-desc,
.tia-screen .tia-app-pager .tia-app-description{
grid-row:3!important;
align-self:center!important;
justify-self:stretch!important;
width:100%!important;
height:32px!important;
min-height:32px!important;
max-height:32px!important;
margin:0!important;
padding:0 4px!important;
display:flex!important;
align-items:center!important;
justify-content:center!important;
font-family:"Segoe UI",Arial,sans-serif!important;
font-size:10px!important;
font-weight:400!important;
font-style:normal!important;
font-synthesis:none!important;
line-height:13px!important;
letter-spacing:0!important;
color:#7a818d!important;
text-align:center!important;
white-space:normal!important;
word-break:normal!important;
overflow-wrap:break-word!important;
overflow:hidden!important;
text-overflow:clip!important;
-webkit-line-clamp:unset!important;
-webkit-box-orient:initial!important;
box-sizing:border-box!important;
}
/* Loại bỏ hoàn toàn khoảng cách/biến đổi cũ */
.tia-screen .tia-app-pager .tia-app-icon,
.tia-screen .tia-app-pager .tia-app-name,
.tia-screen .tia-app-pager .tia-app-title,
.tia-screen .tia-app-pager .tia-app-desc,
.tia-screen .tia-app-pager .tia-app-description{
transform:none!important;
top:auto!important;
bottom:auto!important;
}
}
/* Tablet */
@media (min-width:768px) and (max-width:1199px){
.tia-screen .tia-app-pager .tia-app > a,
.tia-screen .tia-app-pager .tia-app-card > a{
--tia-icon-zone:64px;
--tia-title-zone:34px;
--tia-desc-zone:28px;
--tia-zone-gap:2px;
padding:8px 9px!important;
}
.tia-screen .tia-app-pager .tia-app-icon{
width:54px!important;
height:54px!important;
min-width:54px!important;
min-height:54px!important;
max-width:54px!important;
max-height:54px!important;
}
.tia-screen .tia-app-pager .tia-app-name,
.tia-screen .tia-app-pager .tia-app-title{
height:34px!important;
min-height:34px!important;
max-height:34px!important;
font-size:13px!important;
line-height:16px!important;
}
.tia-screen .tia-app-pager .tia-app-desc,
.tia-screen .tia-app-pager .tia-app-description{
height:28px!important;
min-height:28px!important;
max-height:28px!important;
font-size:9px!important;
line-height:12px!important;
}
}
/* 2K / 4K: tăng vùng card có kiểm soát, không phóng spacing */
@media (min-width:2560px){
.tia-screen .tia-app-pager .tia-app > a,
.tia-screen .tia-app-pager .tia-app-card > a{
--tia-icon-zone:86px;
--tia-title-zone:44px;
--tia-desc-zone:38px;
--tia-zone-gap:4px;
padding:14px 16px!important;
}
.tia-screen .tia-app-pager .tia-app-icon{
width:72px!important;
height:72px!important;
min-width:72px!important;
min-height:72px!important;
max-width:72px!important;
max-height:72px!important;
}
.tia-screen .tia-app-pager .tia-app-name,
.tia-screen .tia-app-pager .tia-app-title{
height:44px!important;
min-height:44px!important;
max-height:44px!important;
font-size:17px!important;
line-height:20px!important;
}
.tia-screen .tia-app-pager .tia-app-desc,
.tia-screen .tia-app-pager .tia-app-description{
height:38px!important;
min-height:38px!important;
max-height:38px!important;
font-size:11px!important;
line-height:15px!important;
}
}
/* Mobile giữ launcher 4 cột hiện tại, không dùng layout card 3 vùng */
@media (max-width:767px){
.tia-screen .tia-app-pager .tia-app > a,
.tia-screen .tia-app-pager .tia-app-card > a{
display:flex!important;
grid-template-rows:none!important;
}
}
/* =========================================================
v1.18.2 - CÂN LẠI NỘI DUNG CARD
Khắc phục cụm logo/tên/mô tả bị dồn lên trên ở v1.18.1.
========================================================= */
@media (min-width:768px){
.tia-screen .tia-app-pager .tia-app > a,
.tia-screen .tia-app-pager .tia-app-card > a{
/* tăng vùng nội dung và căn cả cụm thật sự vào giữa card */
--tia-icon-zone:78px!important;
--tia-title-zone:42px!important;
--tia-desc-zone:34px!important;
--tia-zone-gap:5px!important;
grid-template-rows:
var(--tia-icon-zone)
var(--tia-title-zone)
var(--tia-desc-zone)!important;
align-content:center!important;
justify-content:center!important;
padding:12px 12px!important;
}
/* LOGO: hạ nhẹ xuống, chừa khoảng thở phía trên */
.tia-screen .tia-app-pager .tia-app-icon{
width:64px!important;
height:64px!important;
min-width:64px!important;
min-height:64px!important;
max-width:64px!important;
max-height:64px!important;
align-self:end!important;
margin:0 0 5px!important;
}
/* TÊN: tăng cỡ chữ, tách khỏi logo */
.tia-screen .tia-app-pager .tia-app-name,
.tia-screen .tia-app-pager .tia-app-title{
height:42px!important;
min-height:42px!important;
max-height:42px!important;
font-size:16px!important;
line-height:19px!important;
font-weight:600!important;
align-self:center!important;
padding:0 4px!important;
}
/* MÔ TẢ: tăng nhẹ, không sát tên */
.tia-screen .tia-app-pager .tia-app-desc,
.tia-screen .tia-app-pager .tia-app-description{
height:34px!important;
min-height:34px!important;
max-height:34px!important;
font-size:10.5px!important;
line-height:14px!important;
align-self:start!important;
padding:2px 5px 0!important;
}
}
/* Tablet: cân riêng, không làm card quá chật */
@media (min-width:768px) and (max-width:1199px){
.tia-screen .tia-app-pager .tia-app > a,
.tia-screen .tia-app-pager .tia-app-card > a{
--tia-icon-zone:68px!important;
--tia-title-zone:38px!important;
--tia-desc-zone:30px!important;
--tia-zone-gap:4px!important;
padding:10px 9px!important;
}
.tia-screen .tia-app-pager .tia-app-icon{
width:56px!important;
height:56px!important;
min-width:56px!important;
min-height:56px!important;
max-width:56px!important;
max-height:56px!important;
margin-bottom:4px!important;
}
.tia-screen .tia-app-pager .tia-app-name,
.tia-screen .tia-app-pager .tia-app-title{
height:38px!important;
min-height:38px!important;
max-height:38px!important;
font-size:14px!important;
line-height:17px!important;
}
.tia-screen .tia-app-pager .tia-app-desc,
.tia-screen .tia-app-pager .tia-app-description{
height:30px!important;
min-height:30px!important;
max-height:30px!important;
font-size:9.5px!important;
line-height:13px!important;
}
}
/* 2K / 4K: tăng tỷ lệ nhưng vẫn giữ cụm ở giữa */
@media (min-width:2560px){
.tia-screen .tia-app-pager .tia-app > a,
.tia-screen .tia-app-pager .tia-app-card > a{
--tia-icon-zone:94px!important;
--tia-title-zone:48px!important;
--tia-desc-zone:42px!important;
--tia-zone-gap:6px!important;
padding:16px!important;
}
.tia-screen .tia-app-pager .tia-app-icon{
width:78px!important;
height:78px!important;
min-width:78px!important;
min-height:78px!important;
max-width:78px!important;
max-height:78px!important;
margin-bottom:6px!important;
}
.tia-screen .tia-app-pager .tia-app-name,
.tia-screen .tia-app-pager .tia-app-title{
height:48px!important;
min-height:48px!important;
max-height:48px!important;
font-size:18px!important;
line-height:21px!important;
}
.tia-screen .tia-app-pager .tia-app-desc,
.tia-screen .tia-app-pager .tia-app-description{
height:42px!important;
min-height:42px!important;
max-height:42px!important;
font-size:11.5px!important;
line-height:15px!important;
}
}
/* Mobile giữ nguyên 4 cột hiện tại */
@media (max-width:767px){
.tia-screen .tia-app-pager .tia-app > a,
.tia-screen .tia-app-pager .tia-app-card > a{
display:flex!important;
}
}
/* =========================================================
v1.18.3 - FIX ĐÚNG DOM THỰC TẾ
.tia-app chính là , không có .tia-app > a.
Khóa trực tiếp card thành 3 vùng: icon / title / desc.
========================================================= */
@media (min-width:768px){
.tia-screen .tia-app-pager .tia-app{
--tia-icon-zone:74px;
--tia-title-zone:44px;
--tia-desc-zone:34px;
--tia-content-gap:5px;
display:grid!important;
grid-template-columns:minmax(0,1fr)!important;
grid-template-rows:
var(--tia-icon-zone)
var(--tia-title-zone)
var(--tia-desc-zone)!important;
row-gap:var(--tia-content-gap)!important;
column-gap:0!important;
align-content:center!important;
align-items:center!important;
justify-items:center!important;
padding:14px 12px!important;
margin:0!important;
box-sizing:border-box!important;
text-align:center!important;
overflow:hidden!important;
}
/* ICON: luôn chính giữa ngang, không còn lệch trái/phải */
.tia-screen .tia-app-pager .tia-app > .tia-app-icon{
grid-column:1!important;
grid-row:1!important;
place-self:center!important;
align-self:center!important;
justify-self:center!important;
width:64px!important;
height:64px!important;
min-width:64px!important;
min-height:64px!important;
max-width:64px!important;
max-height:64px!important;
margin:0!important;
padding:3px!important;
transform:none!important;
display:flex!important;
align-items:center!important;
justify-content:center!important;
box-sizing:border-box!important;
overflow:visible!important;
}
.tia-screen .tia-app-pager .tia-app > .tia-app-icon img{
width:100%!important;
height:100%!important;
margin:0!important;
padding:0!important;
display:block!important;
object-fit:contain!important;
object-position:center!important;
border-radius:0!important;
}
/* TITLE: hạ xuống rõ hơn, giữ tối đa 2 dòng */
.tia-screen .tia-app-pager .tia-app > .tia-app-name{
grid-column:1!important;
grid-row:2!important;
place-self:center stretch!important;
width:100%!important;
height:44px!important;
min-height:44px!important;
max-height:44px!important;
margin:0!important;
padding:4px 4px 0!important;
display:flex!important;
align-items:center!important;
justify-content:center!important;
font-family:"Segoe UI",Arial,sans-serif!important;
font-size:16px!important;
font-weight:600!important;
line-height:19px!important;
letter-spacing:0!important;
color:#202124!important;
text-align:center!important;
white-space:normal!important;
word-break:normal!important;
overflow-wrap:break-word!important;
overflow:hidden!important;
transform:none!important;
box-sizing:border-box!important;
}
/* DESC: nằm dưới title rõ ràng, không bị dồn lên */
.tia-screen .tia-app-pager .tia-app > .tia-app-desc{
grid-column:1!important;
grid-row:3!important;
place-self:start stretch!important;
width:100%!important;
height:34px!important;
min-height:34px!important;
max-height:34px!important;
margin:0!important;
padding:2px 4px 0!important;
display:flex!important;
align-items:flex-start!important;
justify-content:center!important;
font-family:"Segoe UI",Arial,sans-serif!important;
font-size:10.5px!important;
font-weight:400!important;
line-height:14px!important;
letter-spacing:0!important;
color:#7a818d!important;
text-align:center!important;
white-space:normal!important;
word-break:normal!important;
overflow-wrap:break-word!important;
overflow:hidden!important;
transform:none!important;
box-sizing:border-box!important;
}
.tia-screen .tia-app-pager .tia-app > .tia-app-arrow{
display:none!important;
}
}
/* Laptop/desktop trước Full HD */
@media (min-width:1200px) and (max-width:1919px){
.tia-screen .tia-app-pager .tia-app{
--tia-icon-zone:68px;
--tia-title-zone:40px;
--tia-desc-zone:32px;
--tia-content-gap:4px;
}
.tia-screen .tia-app-pager .tia-app > .tia-app-icon{
width:60px!important;
height:60px!important;
min-width:60px!important;
min-height:60px!important;
max-width:60px!important;
max-height:60px!important;
}
.tia-screen .tia-app-pager .tia-app > .tia-app-name{
height:40px!important;
min-height:40px!important;
max-height:40px!important;
font-size:15px!important;
line-height:18px!important;
}
.tia-screen .tia-app-pager .tia-app > .tia-app-desc{
height:32px!important;
min-height:32px!important;
max-height:32px!important;
font-size:10px!important;
line-height:13px!important;
}
}
/* 2K / 4K */
@media (min-width:2560px){
.tia-screen .tia-app-pager .tia-app{
--tia-icon-zone:88px;
--tia-title-zone:50px;
--tia-desc-zone:42px;
--tia-content-gap:6px;
padding:18px 16px!important;
}
.tia-screen .tia-app-pager .tia-app > .tia-app-icon{
width:78px!important;
height:78px!important;
min-width:78px!important;
min-height:78px!important;
max-width:78px!important;
max-height:78px!important;
}
.tia-screen .tia-app-pager .tia-app > .tia-app-name{
height:50px!important;
min-height:50px!important;
max-height:50px!important;
font-size:18px!important;
line-height:21px!important;
padding-top:5px!important;
}
.tia-screen .tia-app-pager .tia-app > .tia-app-desc{
height:42px!important;
min-height:42px!important;
max-height:42px!important;
font-size:11.5px!important;
line-height:15px!important;
}
}
/* Mobile giữ nguyên launcher 4 cột của v1.17.2+ */
@media (max-width:767px){
.tia-screen .tia-app-pager .tia-app{
display:flex!important;
grid-template-rows:none!important;
}
}
/* =========================================================
v1.18.4 - Gom tên + mô tả thành một cụm nội dung
Logo cách cụm chữ rõ hơn; tên và mô tả chỉ cách nhau ~2px.
========================================================= */
@media (min-width:768px){
.tia-screen .tia-app-pager .tia-app{
--tia-icon-zone:76px!important;
--tia-title-zone:38px!important;
--tia-desc-zone:32px!important;
--tia-content-gap:2px!important;
}
/* Logo -> cụm chữ: chừa khoảng thở lớn hơn */
.tia-screen .tia-app-pager .tia-app > .tia-app-icon{
margin-bottom:7px!important;
}
/* Tên -> mô tả: gần sát để đi cùng nhau */
.tia-screen .tia-app-pager .tia-app > .tia-app-name{
height:38px!important;
min-height:38px!important;
max-height:38px!important;
padding:2px 4px 0!important;
margin:0!important;
align-self:end!important;
}
.tia-screen .tia-app-pager .tia-app > .tia-app-desc{
height:32px!important;
min-height:32px!important;
max-height:32px!important;
padding:0 4px!important;
margin:-1px 0 0!important;
align-self:start!important;
}
}
/* Tablet */
@media (min-width:768px) and (max-width:1199px){
.tia-screen .tia-app-pager .tia-app{
--tia-icon-zone:66px!important;
--tia-title-zone:34px!important;
--tia-desc-zone:28px!important;
--tia-content-gap:2px!important;
}
.tia-screen .tia-app-pager .tia-app > .tia-app-icon{
margin-bottom:6px!important;
}
.tia-screen .tia-app-pager .tia-app > .tia-app-name{
height:34px!important;
min-height:34px!important;
max-height:34px!important;
}
.tia-screen .tia-app-pager .tia-app > .tia-app-desc{
height:28px!important;
min-height:28px!important;
max-height:28px!important;
}
}
/* 2K / 4K */
@media (min-width:2560px){
.tia-screen .tia-app-pager .tia-app{
--tia-icon-zone:90px!important;
--tia-title-zone:44px!important;
--tia-desc-zone:38px!important;
--tia-content-gap:2px!important;
}
.tia-screen .tia-app-pager .tia-app > .tia-app-icon{
margin-bottom:8px!important;
}
.tia-screen .tia-app-pager .tia-app > .tia-app-name{
height:44px!important;
min-height:44px!important;
max-height:44px!important;
}
.tia-screen .tia-app-pager .tia-app > .tia-app-desc{
height:38px!important;
min-height:38px!important;
max-height:38px!important;
margin-top:-1px!important;
}
}
/* Mobile giữ nguyên */
@media (max-width:767px){
.tia-screen .tia-app-pager .tia-app > .tia-app-icon{
margin-bottom:7px!important;
}
}
/* =========================================================
v1.18.5 - CENTRAL SYSTEM MODULES: stable full-width layout
Applies only while the admin Central Hub is open.
========================================================= */
body.tia-central-mode,
body.tia-central-mode .tia-ipad,
body.tia-central-mode .tia-screen{
width:100vw!important;
max-width:none!important;
min-width:0!important;
box-sizing:border-box!important;
}
body.tia-central-mode .tia-screen{
overflow:hidden!important;
}
body.tia-central-mode .tia-screen > .tia-status{
width:auto!important;
height:42px!important;
display:flex!important;
align-items:center!important;
justify-content:space-between!important;
padding:0 22px!important;
border-radius:0!important;
background:transparent!important;
color:#4b5563!important;
box-shadow:none!important;
box-sizing:border-box!important;
}
body.tia-central-mode .tia-central-hub{
flex:1 1 auto!important;
width:100%!important;
min-width:0!important;
max-width:none!important;
overflow-x:hidden!important;
overflow-y:auto!important;
padding:16px clamp(16px,3vw,52px) 128px!important;
box-sizing:border-box!important;
-webkit-overflow-scrolling:touch;
}
body.tia-central-mode .tia-central-shell{
width:100%!important;
max-width:1500px!important;
min-width:0!important;
margin:0 auto!important;
box-sizing:border-box!important;
}
body.tia-central-mode .tia-control-module{
display:block!important;
width:100%!important;
max-width:none!important;
min-width:0!important;
margin:0!important;
padding:18px!important;
box-sizing:border-box!important;
overflow:visible!important;
}
body.tia-central-mode .tia-control-module > .wrap,
body.tia-central-mode .tia-control-module .wrap,
body.tia-central-mode .tia-control-module .tia-wrap,
body.tia-central-mode .tia-control-module .tia-settings-page,
body.tia-central-mode .tia-control-module .tia-settings,
body.tia-central-mode .tia-control-module form{
width:100%!important;
max-width:none!important;
min-width:0!important;
margin-left:0!important;
margin-right:0!important;
box-sizing:border-box!important;
}
body.tia-central-mode .tia-control-module .tia-grid{
width:100%!important;
min-width:0!important;
grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
}
body.tia-central-mode .tia-control-module .tia-grid-wide{
grid-template-columns:minmax(0,2fr) minmax(300px,1fr)!important;
}
body.tia-central-mode .tia-control-module .tia-panel,
body.tia-central-mode .tia-control-module .tia-card{
min-width:0!important;
max-width:none!important;
box-sizing:border-box!important;
}
/* Tables scroll inside their panel instead of stretching/shrinking the whole app shell. */
body.tia-central-mode .tia-control-module .tia-panel{
overflow-x:auto!important;
overflow-y:visible!important;
}
body.tia-central-mode .tia-control-module table.widefat{
width:100%!important;
max-width:none!important;
min-width:720px;
table-layout:auto!important;
box-sizing:border-box!important;
}
body.tia-central-mode .tia-control-module-settings table.widefat,
body.tia-central-mode .tia-control-module-health table.widefat{
min-width:600px;
}
body.tia-central-mode .tia-control-module input.regular-text,
body.tia-central-mode .tia-control-module input.large-text,
body.tia-central-mode .tia-control-module textarea.large-text,
body.tia-central-mode .tia-control-module select{
max-width:100%!important;
box-sizing:border-box!important;
}
body.tia-central-mode .tia-module-error{
width:100%;
box-sizing:border-box;
padding:18px 20px;
border:1px solid #fecaca;
border-radius:16px;
background:#fff1f2;
color:#881337;
}
body.tia-central-mode .tia-module-error strong{font-size:16px;color:#881337!important}
body.tia-central-mode .tia-module-error p{margin:6px 0 0;color:#9f1239!important}
@media (max-width:1100px){
body.tia-central-mode .tia-control-module .tia-grid,
body.tia-central-mode .tia-control-module .tia-grid-wide{
grid-template-columns:1fr!important;
}
body.tia-central-mode .tia-control-module .tia-cards{
grid-template-columns:repeat(2,minmax(0,1fr))!important;
}
}
@media (max-width:767px){
body.tia-central-mode .tia-central-hub{
padding:10px 8px 92px!important;
}
body.tia-central-mode .tia-central-shell{
max-width:none!important;
}
body.tia-central-mode .tia-control-module{
padding:10px!important;
border-radius:18px!important;
}
body.tia-central-mode .tia-control-module .tia-cards{
grid-template-columns:1fr 1fr!important;
gap:8px!important;
}
body.tia-central-mode .tia-control-module table.widefat{
min-width:680px;
}
}
/* =========================================================
v1.19.1 - Banner căn giữa vùng hiển thị THỰC TẾ
Vị trí dọc do JS tính từ dưới thanh trạng thái đến trên dock.
========================================================= */
@media (min-width:1024px){
.tia-screen.tia-ad-layout .tia-side-banner,
.tia-screen.tia-ad-fhd .tia-side-banner,
.tia-screen.tia-ad-hires .tia-side-banner,
.tia-side-banner:not(.tia-auto-hidden){
position:fixed!important;
bottom:auto!important;
margin-top:0!important;
margin-bottom:0!important;
}
/* left/right vẫn bám hai hành lang như cũ */
.tia-side-banner.left{left:clamp(18px,1.8vw,72px)!important;right:auto!important}
.tia-side-banner.right{right:clamp(18px,1.8vw,72px)!important;left:auto!important}
}
/* =========================================================
v1.19.2 - Anti-FLASH khi tải trang chủ
App grid chỉ xuất hiện sau khi layout/banner đã tính xong.
Không fade, không animation để tránh cảm giác nháy.
========================================================= */
html:not(.tia-home-layout-ready) .tia-app-grid.tia-app-pager,
html:not(.tia-home-layout-ready) .tia-app-grid{
visibility:hidden!important;
}
html.tia-home-layout-ready .tia-app-grid.tia-app-pager,
html.tia-home-layout-ready .tia-app-grid{
visibility:visible!important;
}
/* Tắt transition ở frame khởi tạo để card không animate từ vị trí cũ sang vị trí mới */
html:not(.tia-home-layout-ready) .tia-app-grid *,
html:not(.tia-home-layout-ready) .tia-app-grid{
transition:none!important;
animation-play-state:paused!important;
}
/* Sau khi sẵn sàng, trả animation lại bình thường nếu có */
html.tia-home-layout-ready .tia-app-grid *{
animation-play-state:running;
}
/* v1.21.0 - compact Central Manager navigation */
body.tia-central-mode .tia-central-commandbar{display:flex;align-items:center;gap:8px;margin:10px 0;white-space:nowrap;overflow-x:auto;padding-bottom:2px}
body.tia-central-mode .tia-spotlight-open{display:flex;align-items:center;gap:8px;min-width:260px;border:1px solid #eadde2;background:#fff;border-radius:12px;padding:9px 12px;color:#4b5563;cursor:pointer;box-shadow:0 4px 14px rgba(75,40,55,.05)}
body.tia-central-mode .tia-spotlight-open span{flex:1;text-align:left} body.tia-central-mode kbd{font:inherit;font-size:10px;background:#f7f3f5;border:1px solid #e9e1e5;border-radius:6px;padding:2px 6px}
body.tia-central-mode .tia-command-group,body.tia-central-mode .tia-central-subnav a{color:#5f6672;text-decoration:none;background:#fff;border:1px solid #eee4e8;border-radius:10px;padding:8px 10px;font-size:11px}
body.tia-central-mode .tia-command-group.active,body.tia-central-mode .tia-central-subnav a.active{background:#f4efff;border-color:#d8c9ff;color:#6d28d9;font-weight:700}
body.tia-central-mode .tia-central-subnav{display:flex;gap:7px;overflow-x:auto;white-space:nowrap;margin:4px 0 10px;padding-bottom:2px;position:sticky;top:0;z-index:8;background:rgba(255,249,249,.92);backdrop-filter:blur(10px)}
.tia-spotlight[hidden]{display:none!important}.tia-spotlight{position:fixed;inset:0;z-index:999999}.tia-spotlight-backdrop{position:absolute;inset:0;background:rgba(20,18,24,.28);backdrop-filter:blur(5px)}
.tia-spotlight-box{position:relative;width:min(680px,calc(100vw - 28px));max-height:min(620px,78vh);margin:12vh auto 0;background:#fff;border-radius:18px;box-shadow:0 28px 90px rgba(30,20,30,.25);overflow:hidden;border:1px solid #eee}
.tia-spotlight-search{display:flex;align-items:center;gap:10px;padding:14px 16px;border-bottom:1px solid #eee}.tia-spotlight-search input{flex:1;border:0!important;outline:0!important;box-shadow:none!important;font-size:16px!important;background:transparent!important}
.tia-spotlight-results{max-height:480px;overflow:auto;padding:7px}.tia-spotlight-item{display:grid;grid-template-columns:30px 1fr;gap:1px 8px;padding:10px 12px;border-radius:10px;text-decoration:none!important;color:#30343b}.tia-spotlight-item span{grid-row:1/3;font-size:18px}.tia-spotlight-item strong{font-size:13px}.tia-spotlight-item small{font-size:10px;color:#818793;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tia-spotlight-item.selected{background:#f5f0ff}.tia-spotlight-foot{padding:8px 14px;border-top:1px solid #eee;font-size:10px;color:#8a8f98}.tia-spotlight-lock{overflow:hidden}
@media(max-width:767px){body.tia-central-mode .tia-spotlight-open{min-width:210px}.tia-spotlight-box{margin:7vh auto 0;max-height:86vh}body.tia-central-mode .tia-command-group{display:none}}
/* Smart autocomplete shared by Central Manager search fields */
.tia-smart-suggest{position:fixed;z-index:1000000;max-height:320px;overflow:auto;padding:6px;background:#fff;border:1px solid #e5dfe3;border-radius:12px;box-shadow:0 16px 45px rgba(30,20,30,.18)}
.tia-smart-suggest-item{display:flex;width:100%;flex-direction:column;align-items:flex-start;gap:2px;border:0;background:transparent;border-radius:9px;padding:9px 10px;cursor:pointer;text-align:left;color:#273043}
.tia-smart-suggest-item:hover,.tia-smart-suggest-item.is-active{background:#f7f1ff}
.tia-smart-suggest-item strong{font-size:12px;line-height:1.3}.tia-smart-suggest-item small{max-width:100%;font-size:10px;color:#8b93a1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* =========================================================
v1.23.0 - CENTRAL APP SHELL
Menu trái gọn, tiêu đề/thống kê cố định, chỉ vùng làm việc cuộn.
========================================================= */
body.tia-central-mode .tia-central-hub{
overflow:hidden!important;
padding:8px clamp(10px,1.5vw,24px) 88px!important;
}
body.tia-central-mode .tia-central-shell{
max-width:1580px!important;
height:100%!important;
min-height:0!important;
display:flex!important;
flex-direction:column!important;
overflow:hidden!important;
}
body.tia-central-mode .tia-central-fixed-head{
flex:0 0 auto;
padding:0 2px 7px;
}
body.tia-central-mode .tia-central-top{
align-items:center!important;
margin:0 0 6px!important;
min-height:38px;
}
body.tia-central-mode .tia-central-title-wrap h1{
margin:0!important;
font-size:clamp(21px,1.55vw,31px)!important;
line-height:1.05!important;
}
body.tia-central-mode .tia-central-title-wrap p{
margin:3px 0 0!important;
font-size:9.5px!important;
line-height:1.2!important;
color:#8b8f98!important;
}
body.tia-central-mode .tia-central-back{
padding:6px 10px!important;
border-radius:10px!important;
font-size:10px!important;
white-space:nowrap;
}
body.tia-central-mode .tia-central-stats{
display:flex!important;
gap:6px!important;
margin:0!important;
}
body.tia-central-mode .tia-central-stat{
flex:1 1 0!important;
min-width:0!important;
min-height:42px!important;
padding:6px 10px!important;
border-radius:11px!important;
display:flex!important;
align-items:center!important;
justify-content:space-between!important;
gap:7px!important;
box-shadow:0 3px 10px rgba(15,23,42,.025)!important;
}
body.tia-central-mode .tia-central-stat small{
font-size:9px!important;
line-height:1.1!important;
white-space:nowrap!important;
}
body.tia-central-mode .tia-central-stat strong{
margin:0!important;
font-size:17px!important;
line-height:1!important;
}
body.tia-central-mode .tia-central-workspace{
flex:1 1 auto!important;
min-height:0!important;
display:grid!important;
grid-template-columns:190px minmax(0,1fr)!important;
gap:8px!important;
overflow:hidden!important;
}
body.tia-central-mode .tia-central-sidebar{
min-width:0!important;
min-height:0!important;
overflow-y:auto!important;
overflow-x:hidden!important;
scrollbar-width:thin;
padding:7px!important;
border:1px solid rgba(232,224,228,.95)!important;
border-radius:14px!important;
background:rgba(255,255,255,.72)!important;
box-shadow:0 5px 18px rgba(15,23,42,.035)!important;
}
body.tia-central-mode .tia-sidebar-search{
width:100%!important;
min-width:0!important;
min-height:34px!important;
padding:7px 8px!important;
margin:0 0 6px!important;
border:1px solid #eadfe4!important;
border-radius:9px!important;
background:#fff!important;
display:flex!important;
align-items:center!important;
gap:6px!important;
color:#566071!important;
cursor:pointer!important;
}
body.tia-central-mode .tia-sidebar-search span{flex:1;text-align:left;font-size:10px;font-weight:700}
body.tia-central-mode .tia-sidebar-search kbd{font-size:8px!important;padding:1px 4px!important}
body.tia-central-mode .tia-sidebar-home{
min-height:34px;
display:flex;
align-items:center;
gap:7px;
padding:6px 8px;
margin-bottom:4px;
border-radius:9px;
color:#424b5b;
text-decoration:none!important;
font-size:10.5px;
}
body.tia-central-mode .tia-sidebar-home.active{background:#f3edff;color:#6d28d9}
body.tia-central-mode .tia-sidebar-home span{width:18px;text-align:center;font-size:13px}
body.tia-central-mode .tia-sidebar-group{border-top:1px solid #f0eaed}
body.tia-central-mode .tia-sidebar-group:first-child{border-top:0}
body.tia-central-mode .tia-sidebar-group summary{
list-style:none;
display:grid;
grid-template-columns:20px minmax(0,1fr) 14px;
align-items:center;
gap:5px;
min-height:35px;
padding:6px 7px;
border-radius:9px;
cursor:pointer;
color:#4b5565;
font-size:10.5px;
user-select:none;
}
body.tia-central-mode .tia-sidebar-group summary::-webkit-details-marker{display:none}
body.tia-central-mode .tia-sidebar-group summary:hover{background:#faf7f9}
body.tia-central-mode .tia-sidebar-group[open] summary{background:#fff5f8;color:#b34d70}
body.tia-central-mode .tia-sidebar-group-icon{width:20px;text-align:center;font-size:12px}
body.tia-central-mode .tia-sidebar-group summary strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
body.tia-central-mode .tia-sidebar-group summary i{font-style:normal;font-size:10px;transition:transform .18s ease}
body.tia-central-mode .tia-sidebar-group[open] summary i{transform:rotate(180deg)}
body.tia-central-mode .tia-sidebar-group nav{padding:1px 0 5px 19px}
body.tia-central-mode .tia-sidebar-group nav a{
display:grid;
grid-template-columns:18px minmax(0,1fr);
align-items:center;
gap:5px;
min-height:29px;
padding:4px 6px;
border-radius:8px;
color:#687080;
text-decoration:none!important;
font-size:9.7px;
}
body.tia-central-mode .tia-sidebar-group nav a:hover{background:#f8f6f7;color:#303744}
body.tia-central-mode .tia-sidebar-group nav a.active{background:#f1ebff;color:#6d28d9;font-weight:750}
body.tia-central-mode .tia-sidebar-group nav a span{width:18px;text-align:center;font-size:10px}
body.tia-central-mode .tia-sidebar-group nav a em{font-style:normal;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
body.tia-central-mode .tia-central-work{
min-width:0!important;
min-height:0!important;
display:flex!important;
flex-direction:column!important;
overflow:hidden!important;
border:1px solid rgba(232,224,228,.95)!important;
border-radius:14px!important;
background:rgba(255,255,255,.72)!important;
box-shadow:0 5px 18px rgba(15,23,42,.035)!important;
}
body.tia-central-mode .tia-central-work-head{
flex:0 0 auto!important;
min-height:44px!important;
display:flex!important;
align-items:center!important;
padding:7px 11px!important;
border-bottom:1px solid #eee7ea!important;
background:rgba(255,255,255,.92)!important;
backdrop-filter:blur(8px)!important;
}
body.tia-central-mode .tia-central-work-head h2{
margin:0!important;
font-size:15px!important;
line-height:1.15!important;
color:#202737!important;
}
body.tia-central-mode .tia-central-work-head p{
margin:2px 0 0!important;
font-size:9px!important;
line-height:1.2!important;
color:#9298a3!important;
}
body.tia-central-mode .tia-central-work-scroll{
flex:1 1 auto!important;
min-height:0!important;
min-width:0!important;
overflow-y:auto!important;
overflow-x:hidden!important;
overscroll-behavior:contain!important;
scrollbar-width:thin!important;
padding:8px!important;
}
body.tia-central-mode .tia-central-work-scroll > .tia-control-module{
padding:0!important;
min-height:0!important;
overflow:visible!important;
}
body.tia-central-mode .tia-central-work-scroll .tia-control-module > .wrap,
body.tia-central-mode .tia-central-work-scroll .tia-control-module .tia-wrap{
margin-top:0!important;
padding-top:0!important;
}
/* Một vùng cuộn dọc chính: không nhốt bảng trong khung cuộn dọc thứ hai. */
body.tia-central-mode .tia-central-work-scroll .tia-control-module .tia-panel:has(table.widefat){
max-height:none!important;
overflow-y:visible!important;
}
body.tia-central-mode .tia-central-work-scroll .tia-plugin-list-panel .tia-table-scroll{
max-height:none!important;
overflow-y:visible!important;
overflow-x:auto!important;
}
body.tia-central-mode .tia-central-work-scroll .tia-plugin-list-panel thead th,
body.tia-central-mode .tia-central-work-scroll .tia-control-module .tia-panel:has(table.widefat) thead th{
position:sticky!important;
top:0!important;
z-index:6!important;
}
body.tia-central-mode .tia-central-overview-grid{margin:0!important}
body.tia-central-mode .tia-central-grid{gap:8px!important}
body.tia-central-mode .tia-central-card{min-height:112px!important;padding:11px!important;border-radius:13px!important}
body.tia-central-mode .tia-central-card-icon{width:35px!important;height:35px!important;margin-bottom:6px!important;border-radius:10px!important;font-size:15px!important}
body.tia-central-mode .tia-central-card h3{font-size:13px!important;margin:0 0 4px!important}
body.tia-central-mode .tia-central-card p{font-size:9.5px!important;line-height:1.3!important}
body.tia-central-mode .tia-central-group-count{font-size:8.5px!important}
@media (max-width:900px){
body.tia-central-mode .tia-central-hub{padding:6px 7px 78px!important}
body.tia-central-mode .tia-central-title-wrap p{display:none!important}
body.tia-central-mode .tia-central-workspace{grid-template-columns:154px minmax(0,1fr)!important;gap:6px!important}
body.tia-central-mode .tia-central-sidebar{padding:5px!important}
body.tia-central-mode .tia-sidebar-search kbd{display:none!important}
body.tia-central-mode .tia-central-stat{padding:5px 7px!important}
body.tia-central-mode .tia-central-stat small{font-size:8px!important}
body.tia-central-mode .tia-central-stat strong{font-size:14px!important}
}
@media (max-width:620px){
body.tia-central-mode .tia-central-fixed-head{padding-bottom:5px!important}
body.tia-central-mode .tia-central-top{min-height:32px!important}
body.tia-central-mode .tia-central-title-wrap h1{font-size:17px!important}
body.tia-central-mode .tia-central-stats{gap:3px!important}
body.tia-central-mode .tia-central-stat{min-height:34px!important;padding:4px 5px!important;display:grid!important;gap:1px!important}
body.tia-central-mode .tia-central-stat small{font-size:7px!important}
body.tia-central-mode .tia-central-stat strong{font-size:13px!important}
body.tia-central-mode .tia-central-workspace{grid-template-columns:48px minmax(0,1fr)!important}
body.tia-central-mode .tia-central-sidebar{padding:4px!important}
body.tia-central-mode .tia-sidebar-search{justify-content:center!important;padding:6px!important}
body.tia-central-mode .tia-sidebar-search span,body.tia-central-mode .tia-sidebar-home strong,body.tia-central-mode .tia-sidebar-group summary strong,body.tia-central-mode .tia-sidebar-group summary i,body.tia-central-mode .tia-sidebar-group nav{display:none!important}
body.tia-central-mode .tia-sidebar-home{justify-content:center!important;padding:5px!important}
body.tia-central-mode .tia-sidebar-group summary{display:flex!important;justify-content:center!important;padding:5px!important}
body.tia-central-mode .tia-central-work-head{min-height:38px!important;padding:5px 8px!important}
body.tia-central-mode .tia-central-work-head h2{font-size:13px!important}
body.tia-central-mode .tia-central-work-head p{display:none!important}
body.tia-central-mode .tia-central-work-scroll{padding:5px!important}
}
/* =========================================================
v1.23.3 - FULL WIDTH WORKSPACE + READABLE TYPE
Mở rộng khu làm việc ra gần toàn màn hình, vẫn chừa vùng dock.
========================================================= */
body.tia-central-mode .tia-central-hub{
width:100%!important;
max-width:none!important;
padding:8px 12px calc(var(--tia-dock-h,78px) + 18px)!important;
box-sizing:border-box!important;
}
body.tia-central-mode .tia-central-shell{
width:100%!important;
max-width:none!important;
margin:0!important;
}
body.tia-central-mode .tia-central-workspace{
width:100%!important;
grid-template-columns:196px minmax(0,1fr)!important;
gap:8px!important;
}
body.tia-central-mode .tia-central-sidebar{
width:196px!important;
}
/* Tăng chữ vừa đủ, không làm mất diện tích làm việc. */
body.tia-central-mode .tia-central-title-wrap h1{font-size:clamp(23px,1.7vw,33px)!important}
body.tia-central-mode .tia-central-title-wrap p{font-size:10.5px!important}
body.tia-central-mode .tia-central-back{font-size:11px!important}
body.tia-central-mode .tia-central-stat small{font-size:10px!important}
body.tia-central-mode .tia-central-stat strong{font-size:18px!important}
body.tia-central-mode .tia-sidebar-search span{font-size:11.5px!important}
body.tia-central-mode .tia-sidebar-home{font-size:11.5px!important}
body.tia-central-mode .tia-sidebar-group summary{font-size:11.5px!important}
body.tia-central-mode .tia-sidebar-group nav a{font-size:10.8px!important}
body.tia-central-mode .tia-central-work-head h2{font-size:17px!important}
body.tia-central-mode .tia-central-work-head p{font-size:10.5px!important}
body.tia-central-mode .tia-central-work-scroll{padding:9px 10px!important}
/* Chuẩn chữ toàn bộ vùng thao tác. */
body.tia-central-mode .tia-control-module,
body.tia-central-mode .tia-control-module .wrap,
body.tia-central-mode .tia-control-module .tia-wrap{font-size:12.5px!important}
body.tia-central-mode .tia-control-module h1{font-size:21px!important;line-height:1.15!important}
body.tia-central-mode .tia-control-module h2{font-size:17px!important;line-height:1.2!important}
body.tia-central-mode .tia-control-module h3{font-size:14px!important;line-height:1.2!important}
body.tia-central-mode .tia-control-module p,
body.tia-central-mode .tia-control-module label,
body.tia-central-mode .tia-control-module .description{font-size:11.5px!important}
body.tia-central-mode .tia-control-module input,
body.tia-central-mode .tia-control-module select,
body.tia-central-mode .tia-control-module textarea,
body.tia-central-mode .tia-control-module button,
body.tia-central-mode .tia-control-module .button{font-size:11.5px!important}
body.tia-central-mode .tia-control-module table.widefat th{font-size:11.5px!important}
body.tia-central-mode .tia-control-module table.widefat td{font-size:11.5px!important}
body.tia-central-mode .tia-central-card h3{font-size:14px!important}
body.tia-central-mode .tia-central-card p{font-size:10.5px!important}
body.tia-central-mode .tia-central-group-count{font-size:9.5px!important}
/* Dock luôn nằm ngoài vùng thao tác, không bị nội dung chạm/che. */
body.tia-central-mode .tia-central-workspace{margin-bottom:2px!important}
body.tia-central-mode .tia-central-work-scroll{scroll-padding-bottom:18px!important}
@media (max-width:900px){
body.tia-central-mode .tia-central-hub{padding:6px 7px calc(var(--tia-dock-h,68px) + 14px)!important}
body.tia-central-mode .tia-central-workspace{grid-template-columns:164px minmax(0,1fr)!important}
body.tia-central-mode .tia-central-sidebar{width:164px!important}
}
@media (max-width:620px){
body.tia-central-mode .tia-central-workspace{grid-template-columns:50px minmax(0,1fr)!important}
body.tia-central-mode .tia-central-sidebar{width:50px!important}
body.tia-central-mode .tia-central-hub{padding-left:4px!important;padding-right:4px!important}
}
/* =========================================================
v1.23.4 - LARGE WORK AREA / READABLE UI / DOCK SAFE ZONE
========================================================= */
body.tia-central-mode .tia-central-hub{
padding:10px 16px 0!important;
}
body.tia-central-mode .tia-central-workspace{
grid-template-columns:240px minmax(0,1fr)!important;
gap:10px!important;
margin-bottom:calc(var(--tia-dock-h,78px) + 26px)!important;
}
body.tia-central-mode .tia-central-sidebar{width:240px!important;padding:9px!important}
body.tia-central-mode .tia-sidebar-search{min-height:40px!important;padding:8px 10px!important}
body.tia-central-mode .tia-sidebar-search span{font-size:13px!important}
body.tia-central-mode .tia-sidebar-home{min-height:40px!important;padding:8px 10px!important;font-size:13px!important}
body.tia-central-mode .tia-sidebar-home span{font-size:15px!important}
body.tia-central-mode .tia-sidebar-group summary{min-height:41px!important;padding:8px 9px!important;font-size:13px!important;grid-template-columns:22px minmax(0,1fr) 16px!important}
body.tia-central-mode .tia-sidebar-group-icon{font-size:14px!important}
body.tia-central-mode .tia-sidebar-group nav{padding:2px 0 7px 22px!important}
body.tia-central-mode .tia-sidebar-group nav a{min-height:34px!important;font-size:12.5px!important;padding:4px 6px!important}
body.tia-central-mode .tia-central-title-wrap h1{font-size:clamp(25px,1.8vw,35px)!important}
body.tia-central-mode .tia-central-title-wrap p{font-size:12px!important}
body.tia-central-mode .tia-central-back{font-size:12px!important}
body.tia-central-mode .tia-central-stat small{font-size:11px!important}
body.tia-central-mode .tia-central-stat strong{font-size:20px!important}
body.tia-central-mode .tia-central-work-head{min-height:48px!important;padding:8px 12px!important}
body.tia-central-mode .tia-central-work-head h2{font-size:19px!important}
body.tia-central-mode .tia-central-work-head p{font-size:12px!important}
body.tia-central-mode .tia-central-work-scroll{padding:10px 12px 18px!important}
body.tia-central-mode .tia-control-module,
body.tia-central-mode .tia-control-module .wrap,
body.tia-central-mode .tia-control-module .tia-wrap{font-size:14px!important}
body.tia-central-mode .tia-control-module h1{font-size:23px!important}
body.tia-central-mode .tia-control-module h2{font-size:19px!important}
body.tia-central-mode .tia-control-module h3{font-size:16px!important}
body.tia-central-mode .tia-control-module p,
body.tia-central-mode .tia-control-module label,
body.tia-central-mode .tia-control-module .description{font-size:13px!important}
body.tia-central-mode .tia-control-module input,
body.tia-central-mode .tia-control-module select,
body.tia-central-mode .tia-control-module textarea,
body.tia-central-mode .tia-control-module button,
body.tia-central-mode .tia-control-module .button{font-size:13px!important}
body.tia-central-mode .tia-control-module table.widefat th,
body.tia-central-mode .tia-control-module table.widefat td{font-size:13px!important}
body.tia-central-mode .tia-central-card h3{font-size:15px!important}
body.tia-central-mode .tia-central-card p{font-size:12px!important}
body.tia-central-mode .tia-central-group-count{font-size:10.5px!important}
@media(max-width:1100px){
body.tia-central-mode .tia-central-workspace{grid-template-columns:210px minmax(0,1fr)!important}
body.tia-central-mode .tia-central-sidebar{width:210px!important}
}
@media(max-width:760px){
body.tia-central-mode .tia-central-hub{padding-left:6px!important;padding-right:6px!important}
body.tia-central-mode .tia-central-workspace{grid-template-columns:56px minmax(0,1fr)!important;margin-bottom:calc(var(--tia-dock-h,68px) + 18px)!important}
body.tia-central-mode .tia-central-sidebar{width:56px!important;padding:5px!important}
}
/* =========================================================
v1.23.6 - DOCK SAFE AREA
Chừa vùng cố định phía trên Dock. Khung làm việc không được chạm Dock.
========================================================= */
body.tia-central-mode .tia-central-hub{
/* Dock là phần tử absolute nên phải trừ/chừa không gian thật trong hub. */
padding-bottom:calc(var(--tia-dock-h,78px) + 42px)!important;
}
body.tia-central-mode .tia-central-workspace{
margin-bottom:0!important;
max-height:100%!important;
}
body.tia-central-mode .tia-central-sidebar,
body.tia-central-mode .tia-central-work{
margin-bottom:0!important;
}
/* Cho vùng cuộn có khoảng thở cuối danh sách nhưng không làm khung chạm Dock. */
body.tia-central-mode .tia-central-work-scroll{
padding-bottom:24px!important;
scroll-padding-bottom:24px!important;
}
@media(max-width:760px){
body.tia-central-mode .tia-central-hub{
padding-bottom:calc(var(--tia-dock-h,68px) + 30px)!important;
}
}
/* =========================================================
v1.27.10 - GO LIVE HOTFIX: cuộn dọc trang chủ luôn hoạt động
- App launcher là vùng cuộn dọc độc lập trong khung màn hình.
- Dock vẫn cố định nhưng không che hàng Kho cuối.
- Không để flex:1 + overflow:hidden của các rule cũ cắt nội dung.
========================================================= */
.tia-screen{
min-height:0!important;
}
.tia-screen .tia-app-grid.tia-app-pager{
flex:1 1 auto!important;
min-height:0!important;
max-height:none!important;
overflow-x:hidden!important;
overflow-y:auto!important;
overscroll-behavior-y:contain!important;
-webkit-overflow-scrolling:touch!important;
touch-action:pan-y!important;
padding-bottom:calc(150px + env(safe-area-inset-bottom, 0px))!important;
scroll-padding-bottom:150px!important;
}
/* Wrapper phân trang không được cắt chiều dọc của các hàng ứng dụng. */
.tia-screen .tia-app-pager > .tia-app-track,
.tia-screen .tia-app-pager > .tia-app-track > .tia-app-page{
max-height:none!important;
overflow:visible!important;
}
/* Tránh thẻ cuối bị dock che khi cuộn tới đáy. */
.tia-screen .tia-app-pager > .tia-app-track{
padding-bottom:24px!important;
box-sizing:border-box!important;
}
@media (max-width:767px){
.tia-screen .tia-app-grid.tia-app-pager{
padding-bottom:calc(130px + env(safe-area-inset-bottom, 0px))!important;
scroll-padding-bottom:130px!important;
}
}
/* =========================================================
v1.27.11 - GO LIVE FIX 2: dùng .tia-screen làm vùng cuộn duy nhất
Nguyên nhân: .tia-app-grid vừa là flex:1 vừa là scroll container,
trong khi track/page phân trang dùng flex/transform. Ở một số
trình duyệt (đặc biệt Cốc Cốc/Chromium) hàng cuối có thể tràn ra
ngoài box nhưng không làm tăng scrollHeight của grid.
Giải pháp: để grid tự cao theo toàn bộ card; .tia-screen cuộn dọc.
Dock vẫn fixed và có khoảng đệm đáy riêng.
========================================================= */
body.tia-ipad-home:not(.tia-central-mode) .tia-screen{
overflow-x:hidden!important;
overflow-y:auto!important;
overscroll-behavior-y:auto!important;
-webkit-overflow-scrolling:touch!important;
touch-action:pan-y!important;
scroll-padding-bottom:170px!important;
}
body.tia-ipad-home:not(.tia-central-mode) .tia-screen .tia-app-grid.tia-app-pager{
flex:0 0 auto!important;
height:auto!important;
min-height:0!important;
max-height:none!important;
overflow:visible!important;
margin-bottom:0!important;
padding-bottom:calc(180px + env(safe-area-inset-bottom, 0px))!important;
scroll-padding-bottom:0!important;
}
body.tia-ipad-home:not(.tia-central-mode) .tia-app-pager > .tia-app-track{
height:auto!important;
min-height:0!important;
max-height:none!important;
overflow:visible!important;
padding-bottom:0!important;
align-items:flex-start!important;
}
body.tia-ipad-home:not(.tia-central-mode) .tia-app-pager > .tia-app-track > .tia-app-page{
height:auto!important;
min-height:0!important;
max-height:none!important;
overflow:visible!important;
align-content:flex-start!important;
}
/* Bảo đảm hàng cuối có thể cuộn vượt hẳn Dock, kể cả màn hình thấp. */
@media (max-height:900px){
body.tia-ipad-home:not(.tia-central-mode) .tia-screen .tia-app-grid.tia-app-pager{
padding-bottom:calc(200px + env(safe-area-inset-bottom, 0px))!important;
}
}
@media (max-width:767px){
body.tia-ipad-home:not(.tia-central-mode) .tia-screen .tia-app-grid.tia-app-pager{
padding-bottom:calc(155px + env(safe-area-inset-bottom, 0px))!important;
}
}
/* =========================================================
v1.27.12 - GO LIVE FIX 3
- Giữ ticker + status (đồng hồ / tieminanh.com) cố định trong
vùng cuộn .tia-screen.
- Ẩn home indicator kiểu iPad vì sau khi chuyển .tia-screen
thành scroll container, thanh này đè lên nội dung hàng cuối.
========================================================= */
body.tia-ipad-home:not(.tia-central-mode) .tia-top-ticker{
position:sticky!important;
top:0!important;
z-index:120!important;
flex:0 0 auto!important;
}
body.tia-ipad-home:not(.tia-central-mode) .tia-status{
position:sticky!important;
top:34px!important;
z-index:119!important;
flex:0 0 auto!important;
background:rgba(255,250,250,.94)!important;
backdrop-filter:blur(12px)!important;
-webkit-backdrop-filter:blur(12px)!important;
border-bottom:1px solid rgba(15,23,42,.04)!important;
}
body.tia-ipad-home:not(.tia-central-mode) .tia-home-indicator{
display:none!important;
}
@media (max-width:767px){
body.tia-ipad-home:not(.tia-central-mode) .tia-status{
top:29px!important;
}
}