/* GulfBot icons — styles for GBI sprite icons (services.jpg look: full-colour flat-glossy icon on a soft circular halo). */
.gbi{width:1em;height:1em;display:inline-block;flex:0 0 auto;vertical-align:-.15em;fill:currentColor;stroke:none;overflow:visible}
.gbi[class*=" t-"]{filter:drop-shadow(0 2px 2px rgba(var(--gbt),.28)) drop-shadow(0 6px 10px rgba(var(--gbt),.18))}
.t-blue{--gbt:22,119,255;--gbs:url(#gbg-blue)}  .gbi.t-blue{fill:url(#gbg-blue)}
.t-gold{--gbt:240,150,0;--gbs:url(#gbg-gold)}   .gbi.t-gold{fill:url(#gbg-gold)}
.t-green{--gbt:18,183,106;--gbs:url(#gbg-green)} .gbi.t-green{fill:url(#gbg-green)}
.t-purple{--gbt:124,77,255;--gbs:url(#gbg-purple)} .gbi.t-purple{fill:url(#gbg-purple)}
.t-red{--gbt:240,56,107;--gbs:url(#gbg-red)}    .gbi.t-red{fill:url(#gbg-red)}
.t-pink{--gbt:244,63,142;--gbs:url(#gbg-pink)}  .gbi.t-pink{fill:url(#gbg-pink)}
.t-orange{--gbt:255,138,31;--gbs:url(#gbg-orange)} .gbi.t-orange{fill:url(#gbg-orange)}
.t-teal{--gbt:20,184,166;--gbs:url(#gbg-teal)}  .gbi.t-teal{fill:url(#gbg-teal)}
.t-cyan{--gbt:14,165,233;--gbs:url(#gbg-cyan)}  .gbi.t-cyan{fill:url(#gbg-cyan)}
.t-indigo{--gbt:79,70,229;--gbs:url(#gbg-indigo)} .gbi.t-indigo{fill:url(#gbg-indigo)}
.t-navy{--gbt:27,47,99;--gbs:url(#gbg-navy)}    .gbi.t-navy{fill:url(#gbg-navy)}
.t-slate{--gbt:100,116,139;--gbs:url(#gbg-slate)} .gbi.t-slate{fill:url(#gbg-slate)}
/* soft circular halo behind a colour icon (no tinted square) */
.gbi-halo{--sz:52px;position:relative;display:inline-grid;place-items:center;width:var(--sz);height:var(--sz);flex:0 0 var(--sz);border-radius:50%;
  background:radial-gradient(circle at 50% 50%,rgba(var(--gbt),.20) 0,rgba(var(--gbt),.10) 42%,rgba(var(--gbt),0) 70%);font-size:calc(var(--sz)*.66);line-height:1!important;font-size:calc(var(--sz)*.66)!important}
.gbi-halo .gbi{width:1em;height:1em}
.gbi-halo.sm{--sz:40px}.gbi-halo.lg{--sz:64px}.gbi-halo.xl{--sz:76px}
/* on dark surfaces the halo glows a little more */
.gbi-on-dark .gbi-halo,.gbi-halo.on-dark{background:radial-gradient(circle,rgba(var(--gbt),.38) 0,rgba(var(--gbt),.14) 45%,rgba(var(--gbt),0) 70%)}
/* directional outline icons mirror in RTL */
[dir=rtl] .gbi.flip-rtl{transform:scaleX(-1)}