/* TimaLink visual enhancement layer — additive only. No route, API, or navigation changes. */
body[data-product="timalink"]{--tl-polish-shadow:0 18px 50px rgba(27,49,79,.10);--tl-polish-line:#dbe5f0;--tl-polish-soft:#f7f9fd;--tl-polish-accent:#7357e6}
body[data-product="timalink"] .card{transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}
body[data-product="timalink"] .card:hover{box-shadow:var(--tl-polish-shadow);border-color:#cad8e8}
body[data-product="timalink"] .view>.card,
body[data-product="timalink"] .view>.two>.card,
body[data-product="timalink"] .view>.video-layout>.card{position:relative;overflow:hidden}
body[data-product="timalink"] .view>.card:before,
body[data-product="timalink"] .view>.two>.card:before{content:"";position:absolute;inset:0 auto 0 0;width:4px;background:linear-gradient(180deg,#7357e6,#2878e8);opacity:.78}
body[data-product="timalink"] [data-view="sites"]>.card:after,
body[data-product="timalink"] [data-view="devices"]>.card:first-child:after,
body[data-product="timalink"] [data-view="controls"]>.card:after,
body[data-product="timalink"] [data-view="events"]>.card:after{content:"";position:absolute;right:-28px;top:-32px;width:150px;height:150px;border-radius:50%;background:radial-gradient(circle,rgba(115,87,230,.13),rgba(115,87,230,0) 70%);pointer-events:none}
body[data-product="timalink"] .section-title h2{letter-spacing:-.02em}
body[data-product="timalink"] .section-title .badge{box-shadow:inset 0 0 0 1px rgba(115,87,230,.10)}
body[data-product="timalink"] .list{display:grid;gap:9px}
body[data-product="timalink"] .list>div,
body[data-product="timalink"] .list>button{border-radius:13px!important;transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease}
body[data-product="timalink"] .list>div:hover,
body[data-product="timalink"] .list>button:hover{transform:translateY(-1px);box-shadow:0 10px 24px rgba(29,52,82,.08)}
body[data-product="timalink"] .notice{border-radius:14px!important;background:linear-gradient(135deg,#f9fbff,#f4f1ff)!important;border:1px solid #dfe4f2!important;color:#53677d!important}
body[data-product="timalink"] .notice:empty{display:none}
body[data-product="timalink"] .tl-empty-polish{display:grid;place-items:center;text-align:center;min-height:170px;padding:26px;border:1px dashed #ced9e7;border-radius:16px;background:linear-gradient(145deg,#fff,#f7f8fd)}
body[data-product="timalink"] .tl-empty-polish i{width:54px;height:54px;display:grid;place-items:center;border-radius:16px;background:#f0edff;color:#5b43cb;font-style:normal;font-size:1.35rem;font-weight:900;margin-bottom:10px}
body[data-product="timalink"] .tl-empty-polish strong{font-size:.95rem;color:#162b47}
body[data-product="timalink"] .tl-empty-polish small{max-width:46ch;margin-top:6px;color:#718096;line-height:1.5}
body[data-product="timalink"] .tl-empty-polish button{margin-top:13px;min-height:40px;padding:0 14px;border:0;border-radius:10px;background:linear-gradient(135deg,#7357e6,#2878e8);color:#fff;font-weight:850;cursor:pointer}
body[data-product="timalink"] .kpi{background:linear-gradient(145deg,#fff,#f8f7ff)!important}
body[data-product="timalink"] .kpi strong{background:linear-gradient(135deg,#142f50,#7357e6);-webkit-background-clip:text;background-clip:text;color:transparent}
body[data-product="timalink"] [data-view="sites"] .section-title:before,
body[data-product="timalink"] [data-view="devices"]>.card:first-child .section-title:before,
body[data-product="timalink"] [data-view="controls"] .section-title:before,
body[data-product="timalink"] [data-view="events"] .section-title:before{display:grid;place-items:center;width:34px;height:34px;border-radius:11px;background:#f0edff;color:#5b43cb;font-weight:900;margin-right:8px}
body[data-product="timalink"] [data-view="sites"] .section-title:before{content:"⌂"}
body[data-product="timalink"] [data-view="devices"]>.card:first-child .section-title:before{content:"◉"}
body[data-product="timalink"] [data-view="controls"] .section-title:before{content:"⚡"}
body[data-product="timalink"] [data-view="events"] .section-title:before{content:"!"}
body[data-product="timalink"] .section-title{align-items:center}

/* Website richness */
html[data-product="timalink"] .white,body.tima .white{background:linear-gradient(180deg,#fff,#f8fbff)}
body.tima .capabilities{position:relative;overflow:hidden}
body.tima .capabilities:before{content:"";position:absolute;inset:-120px auto auto -120px;width:340px;height:340px;border-radius:50%;background:radial-gradient(circle,rgba(115,87,230,.18),transparent 70%);pointer-events:none}
body.tima .cap{transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}
body.tima .cap:hover{transform:translateY(-4px);box-shadow:0 18px 40px rgba(28,48,78,.12)}
body.tima .tima-ecosystem{padding:72px 0;background:linear-gradient(180deg,#f8fbff,#eef3fb)}
body.tima .tima-ecosystem-head{max-width:760px;margin-bottom:24px}
body.tima .tima-ecosystem-head h2{margin:.3rem 0 .65rem;font-size:clamp(2rem,4vw,3.2rem);letter-spacing:-.04em}
body.tima .tima-ecosystem-head p{color:#60748b;line-height:1.7}
body.tima .tima-ecosystem-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
body.tima .tima-ecosystem-card{position:relative;min-height:230px;overflow:hidden;border-radius:22px;border:1px solid rgba(255,255,255,.6);box-shadow:0 18px 45px rgba(23,43,72,.12);background:#0c2340;color:#fff}
body.tima .tima-ecosystem-card:before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(6,17,31,.05),rgba(6,17,31,.78));z-index:1}
body.tima .tima-ecosystem-card>div{position:absolute;inset:auto 18px 18px;z-index:2}
body.tima .tima-ecosystem-card strong{display:block;font-size:1.12rem}
body.tima .tima-ecosystem-card span{display:block;margin-top:5px;color:#d8e5f2;font-size:.82rem;line-height:1.5}
body.tima .tima-ecosystem-card:nth-child(1){background:url('/assets/services/cctv.webp') center/cover no-repeat}
body.tima .tima-ecosystem-card:nth-child(2){background:url('/assets/services/access.webp') center/cover no-repeat}
body.tima .tima-ecosystem-card:nth-child(3){background:url('/assets/services/integrated.webp') center/cover no-repeat}
body.tima .tima-ecosystem-card:nth-child(4){background:url('/assets/services/alarms.webp') center/cover no-repeat}
body.tima .tima-ecosystem-card:nth-child(5){background:url('/assets/services/fence.webp') center/cover no-repeat}
body.tima .tima-ecosystem-card:nth-child(6){background:url('/assets/services/maintenance.webp') center/cover no-repeat}
@media(max-width:900px){body.tima .tima-ecosystem-grid{grid-template-columns:1fr 1fr}}
@media(max-width:620px){body.tima .tima-ecosystem{padding:46px 0}body.tima .tima-ecosystem-grid{grid-template-columns:1fr}body.tima .tima-ecosystem-card{min-height:190px}}
@media(prefers-reduced-motion:reduce){body[data-product="timalink"] .card,body.tima .cap{transition:none}}


/* Consistent polished action buttons for legacy/plain controls inside platform cards. */
body[data-product="timalink"] .view .card button:not([class]),
body[data-product="timalink"] .view .card input[type="button"]:not([class]),
body[data-product="timalink"] .view .card input[type="submit"]:not([class]){
  appearance:none;
  min-height:42px;
  padding:0 15px;
  border:1px solid #d3deeb;
  border-radius:11px;
  background:linear-gradient(180deg,#ffffff,#f7f9fc);
  color:#2f4560;
  font-size:.78rem;
  font-weight:850;
  letter-spacing:.01em;
  box-shadow:0 4px 12px rgba(31,50,76,.06);
  cursor:pointer;
  transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease,background .16s ease,color .16s ease;
}
body[data-product="timalink"] .view .card button:not([class]):hover,
body[data-product="timalink"] .view .card input[type="button"]:not([class]):hover,
body[data-product="timalink"] .view .card input[type="submit"]:not([class]):hover{
  transform:translateY(-1px);
  border-color:#b9c9dc;
  background:#fff;
  color:#162b47;
  box-shadow:0 8px 20px rgba(31,50,76,.10);
}
body[data-product="timalink"] .view .card button:not([class]):active,
body[data-product="timalink"] .view .card input[type="button"]:not([class]):active,
body[data-product="timalink"] .view .card input[type="submit"]:not([class]):active{transform:translateY(0)}
body[data-product="timalink"] .view .card button:not([class]):focus-visible,
body[data-product="timalink"] .view .card input[type="button"]:not([class]):focus-visible,
body[data-product="timalink"] .view .card input[type="submit"]:not([class]):focus-visible{outline:3px solid rgba(115,87,230,.22);outline-offset:2px}
body[data-product="timalink"] .view .card button:not([class]):disabled,
body[data-product="timalink"] .view .card input[type="button"]:not([class]):disabled,
body[data-product="timalink"] .view .card input[type="submit"]:not([class]):disabled{opacity:.48;cursor:not-allowed;transform:none;box-shadow:none}

/* Gateway actions: primary, secondary and destructive hierarchy. */
body[data-product="timalink"] #tlGatewayManager #tlAddGateway,
body[data-product="timalink"] #tlGatewayManager button[type="submit"]{
  background:linear-gradient(135deg,#7357e6,#3f7fe8)!important;
  color:#fff!important;
  border-color:transparent!important;
  box-shadow:0 9px 20px rgba(99,79,210,.22)!important;
}
body[data-product="timalink"] #tlGatewayManager #tlAddGateway:hover,
body[data-product="timalink"] #tlGatewayManager button[type="submit"]:hover{
  background:linear-gradient(135deg,#684cda,#3373dc)!important;
  box-shadow:0 12px 24px rgba(99,79,210,.28)!important;
}
body[data-product="timalink"] #tlGatewayManager #tlRefreshGateways,
body[data-product="timalink"] #tlGatewayManager #tlCancelGateway,
body[data-product="timalink"] #tlGatewayManager [data-discover]{
  background:#fff!important;
  color:#38516d!important;
  border:1px solid #cfdbe8!important;
}
body[data-product="timalink"] #tlGatewayManager #tlRefreshGateways:hover,
body[data-product="timalink"] #tlGatewayManager #tlCancelGateway:hover,
body[data-product="timalink"] #tlGatewayManager [data-discover]:hover{
  background:#f6f8fc!important;
  border-color:#b8c9dd!important;
}
body[data-product="timalink"] #tlGatewayManager [data-revoke]{
  background:#fff7f8!important;
  color:#b23b4b!important;
  border:1px solid #f0ccd2!important;
}
body[data-product="timalink"] #tlGatewayManager [data-revoke]:hover{
  background:#fff0f2!important;
  border-color:#e9b7c0!important;
}
