/* =========== iSERVICES PADRAO BACKGROUND ============= */
/* == Configurações padrões background para templates == */


/* solido */
.atm-isrv-lib-backg-solid-solid {
background: 
  var(--active-screen-bg-color);
}


/* gradient */
.atm-isrv-lib-backg-gradient-vertical {
background-color: var(--active-screen-bg-color);
background-image: linear-gradient(to bottom, var(--active-screen-grad-from), var(--active-screen-grad-to));
}
.atm-isrv-lib-backg-gradient-horizontal {
background-color: var(--active-screen-bg-color);
background-image: linear-gradient(to right, var(--active-screen-grad-from), var(--active-screen-grad-to));
}
.atm-isrv-lib-backg-gradient-diagonal {
background-color: var(--active-screen-bg-color);
background-image: linear-gradient(135deg, var(--active-screen-grad-from) 0%, var(--active-screen-grad-to) 100%);
}
.atm-isrv-lib-backg-gradient-radial {
background-color: var(--active-screen-bg-color);
background-image: radial-gradient(circle at center, var(--active-screen-grad-from), var(--active-screen-grad-to));
}
.atm-isrv-lib-backg-gradient-spotlight {
background-color: var(--active-screen-bg-color);
background-image: radial-gradient(circle at top left, rgba(255,255,255,0.75), var(--active-screen-grad-from) 70%);
}
.atm-isrv-lib-backg-gradient-spot {
background-color: var(--active-screen-bg-color);
background-image: radial-gradient(circle at 20% 30%, var(--active-screen-grad-to), transparent 45%),
  radial-gradient(circle at 80% 70%, var(--active-screen-grad-from), transparent 50%),
  linear-gradient(135deg, var(--active-screen-grad-from), var(--active-screen-grad-to));
}
.atm-isrv-lib-backg-gradient-bloom {
background:
  radial-gradient( circle at 50% 20%, color-mix(in srgb, var(--active-screen-grad-to), #ffffff 20%), transparent 55% ),
  linear-gradient( 180deg, var(--active-screen-grad-from), var(--active-screen-grad-to));
}
.atm-isrv-lib-backg-gradient-wave {
background-color: var(--active-screen-bg-color);
background-image: radial-gradient(120% 60% at 50% -20%, var(--active-screen-grad-to), transparent 60%),
  linear-gradient(to bottom, var(--active-screen-grad-from), var(--active-screen-grad-to));
}


/* mixing  */
.atm-isrv-lib-backg-mixing-lattice {
background:
  linear-gradient(color-mix(in srgb, var(--active-screen-grad-from) 85%, var(--active-screen-grad-to) 15%) 1px, transparent 1px),
  linear-gradient(to right, color-mix( in srgb, var(--active-screen-grad-from) 85%, var(--active-screen-grad-to) 15% ) 1px, transparent 1px),
  linear-gradient(135deg, var(--active-screen-grad-from) 0%, var(--active-screen-grad-from) 15%, var(--active-screen-grad-to) 100%);
background-size: 10px 10px, 10px 10px, 100% 100%;
}
.atm-isrv-lib-backg-mixing-matrix {
background:
  linear-gradient(color-mix(in srgb, var(--active-screen-grad-from) 85%, var(--active-screen-grad-to) 15%) 1px, transparent 1px),
  linear-gradient(to right, color-mix( in srgb, var(--active-screen-grad-from) 85%, var(--active-screen-grad-to) 15% ) 1px, transparent 1px),
  linear-gradient(135deg, var(--active-screen-grad-from) 0%, var(--active-screen-grad-from) 15%, var(--active-screen-grad-to) 100%);
background-size: 10px 10px;
}
.atm-isrv-lib-backg-mixing-framework {
background:
  linear-gradient(color-mix(in srgb, var(--active-screen-grad-from) 85%, var(--active-screen-grad-to) 92%) 1px, transparent 1px),
  linear-gradient(to right, color-mix( in srgb, var(--active-screen-grad-from) 85%, var(--active-screen-grad-to) 15% ) 1px, transparent 1px),
  linear-gradient(135deg, var(--active-screen-grad-from) 0%, var(--active-screen-grad-from) 15%, var(--active-screen-grad-to) 100%);
background-size: 10px 10px, 10px 10px, 100% 100%;
}
.atm-isrv-lib-backg-mixing-prism {
background:
  linear-gradient( 45deg, hsl(from var(--active-screen-grad-to) h s l / .18) 25%, transparent 25% ) -5px 0,
  linear-gradient( -45deg, hsl(from var(--active-screen-grad-to) h s l / .18) 25%, transparent 25% ) -5px 0,
  linear-gradient( 45deg, transparent 75%, hsl(from var(--active-screen-grad-to) h s l / .18) 75% ),
  linear-gradient( -45deg, transparent 75%, hsl(from var(--active-screen-grad-to) h s l / .18) 75% ),
  linear-gradient(135deg, var(--active-screen-grad-from) 0%, var(--active-screen-grad-from) 15%, var(--active-screen-grad-to) 100%);
background-size: 10px 10px, 10px 10px, 10px 10px, 10px 10px, 100% 100%;
}
.atm-isrv-lib-backg-mixing-refraction {
background:
  repeating-radial-gradient( circle at 0 0,
    hsl(from var(--active-screen-grad-to) h s l / .10),
    hsl(from var(--active-screen-grad-to) h s l / .10) 1px, transparent 1px, transparent 6px ),
  linear-gradient(135deg, var(--active-screen-grad-from) 0%, var(--active-screen-grad-from) 15%, var(--active-screen-grad-to) 100%);
}
.atm-isrv-lib-backg-mixing-flux {
background:
  repeating-linear-gradient( 135deg,
    hsl(from var(--active-screen-grad-to) h s l / .15),
    hsl(from var(--active-screen-grad-to) h s l / .15) 2px, transparent 2px, transparent 12px ),
  linear-gradient(135deg, var(--active-screen-grad-from) 0%, var(--active-screen-grad-from) 15%, var(--active-screen-grad-to) 100%);
}
.atm-isrv-lib-backg-mixing-drift {
background:
  repeating-linear-gradient( to bottom,
    color-mix(in srgb, var(--active-screen-grad-from) 75%, white 25%) 0,
    color-mix(in srgb, var(--active-screen-grad-from) 75%, white 25%) 1px, transparent 1px, transparent 8px ),
  linear-gradient(135deg, var(--active-screen-grad-from) 0%, var(--active-screen-grad-from) 15%, var(--active-screen-grad-to) 100%);
}
.atm-isrv-lib-backg-mixing-wireframe {
background: 
  repeating-linear-gradient( to right,
    color-mix( in srgb, var(--active-screen-grad-from) 85%, white 15% ),
    color-mix( in srgb, var(--active-screen-grad-from) 85%, white 15% ) 1px, transparent 1px, transparent 8px ),
  linear-gradient(135deg, var(--active-screen-grad-from) 0%, var(--active-screen-grad-from) 15%, var(--active-screen-grad-to) 100%);
}


/* geometric */
.atm-isrv-lib-backg-geometric-dots {
background:
  radial-gradient( circle, color-mix( in srgb, var(--active-screen-grad-from) 85%, white 15% ) 6%, transparent 20%) 0 0 / 10px 10px;
background-color: var(--active-screen-grad-from);
}
.atm-isrv-lib-backg-geometric-grid {
background:
  linear-gradient( color-mix( in srgb, var(--active-screen-grad-from) 85%, var(--active-screen-grad-to) 15% ) 1px, transparent 1px ),
  linear-gradient( to right, color-mix( in srgb, var(--active-screen-grad-from) 85%, var(--active-screen-grad-to) 15% ) 1px, transparent 1px);
background-size: 10px 10px;
background-color: var(--active-screen-grad-from);
}
.atm-isrv-lib-backg-geometric-paper {
background:
  repeating-linear-gradient( 45deg,
    color-mix(in srgb, var(--active-screen-grad-to) 18%, transparent),
    color-mix(in srgb, var(--active-screen-grad-to) 18%, transparent) 1px, transparent 1px, transparent 4px );
background-color: var(--active-screen-grad-from);
}
.atm-isrv-lib-backg-geometric-fiber {
background:
  linear-gradient( 45deg, hsl(from var(--active-screen-grad-to) h s l / .25) 25%, transparent 25% ) -5px 0,
  linear-gradient( -45deg, hsl(from var(--active-screen-grad-to) h s l / .25) 25%, transparent 25% ) -5px 0,
  linear-gradient( 45deg, transparent 75%, hsl(from var(--active-screen-grad-to) h s l / .25) 75% ),
  linear-gradient( -45deg, transparent 75%, hsl(from var(--active-screen-grad-to) h s l / .25) 75% );
background-size: 10px 10px;
background-color: var(--active-screen-grad-from);
}
.atm-isrv-lib-backg-geometric-noise {
background:
  linear-gradient( 0deg, hsl(from var(--active-screen-grad-to) h s l / .06), 
    hsl(from var(--active-screen-grad-to) h s l / .06) ),
  repeating-radial-gradient( circle at 0 0, 
    hsl(from var(--active-screen-grad-to) h s l / .35), 
	hsl(from var(--active-screen-grad-to) h s l / .35) 1px, transparent 1px, transparent 3px );
background-color: var(--active-screen-grad-from);
}
.atm-isrv-lib-backg-geometric-cotton {
background:
  repeating-radial-gradient( circle, hsl(from var(--active-screen-grad-to) h s l / .06) 0 1px, transparent 1px 6px );
background-color: var(--active-screen-grad-from);
}
.atm-isrv-lib-backg-geometric-synth {
background: 
  repeating-linear-gradient( to right,
    color-mix( in srgb, var(--active-screen-grad-from) 85%, white 15% ),
    color-mix( in srgb, var(--active-screen-grad-from) 85%, white 15% ) 1px, var(--active-screen-grad-from) 1px, var(--active-screen-grad-from) 8px );
}
.atm-isrv-lib-backg-geometric-quantum {
background: 
  repeating-linear-gradient( to bottom,
    color-mix( in srgb, var(--active-screen-grad-from) 85%, white 15% ),
    color-mix( in srgb, var(--active-screen-grad-from) 85%, white 15% ) 1px, var(--active-screen-grad-from) 1px, var(--active-screen-grad-from) 8px );
}


/* modern */
.atm-isrv-lib-backg-modern-aurora {
background:
  radial-gradient(circle at 10% 40%, rgba(0,255,180,.30), transparent 60%),
  radial-gradient(circle at 40% 10%, rgba(0,200,255,.30), transparent 60%),
  radial-gradient(circle at 70% 50%, rgba(150,255,200,.30), transparent 60%),
  radial-gradient(circle at 50% 90%, rgba(80,180,255,.25), transparent 65%),
  linear-gradient(180deg, #01040d, #030814);
}
.atm-isrv-lib-backg-modern-shine {
background:
  radial-gradient(circle at 25% 30%, rgba(32,201,151,.35), transparent 55%),
  radial-gradient(circle at 75% 35%, rgba(13,202,240,.25), transparent 60%);
background-color: #020617;
}
.atm-isrv-lib-backg-modern-cloudy {
background:
  radial-gradient(circle at 10% 30%, rgba(59,130,246,.35), transparent 40%),
  radial-gradient(circle at 80% 70%, rgba(14,165,233,.25), transparent 45%),
  linear-gradient(135deg, #020617, #020617);
}
.atm-isrv-lib-backg-modern-holographic {
background:
  linear-gradient(120deg, #ff00cc, #3333ff, #00ffcc);
background-size: 300% 300%;
}
.atm-isrv-lib-backg-modern-ocean {
background:
  linear-gradient(160deg, var(--atm-color-blue-200), var(--atm-color-cyan-350), var(--atm-color-teal-600));
}
.atm-isrv-lib-backg-modern-steam {
background:
  linear-gradient(160deg, #fbc2eb, #a6c1ee);
}
.atm-isrv-lib-backg-modern-stone {
 background:
   radial-gradient(circle at 30% 20%, #e5e7eb, transparent 40%),
   radial-gradient(circle at 70% 80%, #d1d5db, transparent 45%);
 background-color: #f9fafb;
}
.atm-isrv-lib-backg-modern-carbon {
background:
  repeating-linear-gradient(45deg, rgba(255,255,255,.06), rgba(255,255,255,.06) 1px, transparent 1px, transparent 6px),
  linear-gradient(135deg, #111827, #020617);
}






/* classic */
.atm-isrv-lib-backg-classic-graphite {
background: 
  linear-gradient(135deg, var(--atm-color-gray-900), var(--atm-color-gray-700));
}
.atm-isrv-lib-backg-classic-gold {
background: 
  linear-gradient(135deg, #6f5f2a, #c9b36a);
}
.atm-isrv-lib-backg-classic-silver {
background: 
  linear-gradient(135deg, var(--atm-color-gray-400), var(--atm-color-gray-100));
}
.atm-isrv-lib-backg-classic-bronze {
background: 
  linear-gradient(135deg, #4a3b2a, #a67c52);
}
/*
.atm-isrv-lib-backg-classic-platinum {
background:
  linear-gradient(135deg, var(--atm-color-gray-250), var(--atm-color-gray-50));
}
*/
/*
.atm-isrv-lib-backg-classic-duotone {
background:
  linear-gradient( 135deg, hsl(from var(--atm-color-sky-50) h s l / .05), hsl(from var(--atm-color-sky-50) h s l / .35) );
backdrop-filter: blur(8px);
background-color: var(--atm-color-sky-900);
}
*/
.atm-isrv-lib-backg-classic-boreal {
background:
  linear-gradient( 135deg, hsl(from var(--atm-color-cyan-50) h s l / .05), hsl(from var(--atm-color-cyan-50) h s l / .35) );
backdrop-filter: blur(8px);
background-color: var(--atm-color-cyan-800);
}
.atm-isrv-lib-backg-classic-fume {
  background:
    linear-gradient(135deg, rgba(255,255,255,.35), rgba(255,255,255,.08));
  backdrop-filter: blur(14px) saturate(140%);
  background-color: #020617;
}
.atm-isrv-lib-backg-classic-sapphire {
background:
  linear-gradient( 135deg, hsl(from var(--atm-color-blue-50) h s l / .05), hsl(from var(--atm-color-blue-50) h s l / .35) );
backdrop-filter: blur(8px);
background-color: var(--atm-color-blue-900);
}
.atm-isrv-lib-backg-classic-emerald {
background:
  linear-gradient( 135deg, hsl(from var(--atm-color-teal-50) h s l / .05), hsl(from var(--atm-color-teal-50) h s l / .35) );
backdrop-filter: blur(8px);
background-color: var(--atm-color-teal-900);
}
.atm-isrv-lib-backg-classic-ocean {
background:
  radial-gradient( circle at 30% 20%, hsl(from var(--atm-color-sky-300) h s l / .6), transparent 55% ),
  radial-gradient( circle at 70% 80%, hsl(from var(--atm-color-cyan-400) h s l / .5), transparent 60% ),
  linear-gradient( 135deg, var(--atm-color-teal-500), var(--atm-color-sky-600) );
}
.atm-isrv-lib-backg-classic-secret {
background:
  radial-gradient( circle at 20% 30%, hsl(from var(--atm-color-teal-700) h s l / .6), transparent 55% ),
  radial-gradient( circle at 70% 40%, hsl(from var(--atm-color-gray-700) h s l / .6), transparent 60% ),
  radial-gradient( circle at 40% 80%, hsl(from var(--atm-color-teal-800) h s l / .7), transparent 65% ),
  linear-gradient( 135deg, var(--atm-color-gray-800), var(--atm-color-teal-800) );
}

/*
.atm-isrv-lib-backg-premium-camuflagem-tech {
  background:
    repeating-linear-gradient(
      45deg,
      hsl(from var(--atm-color-teal-800) h s l / .35),
      hsl(from var(--atm-color-teal-800) h s l / .35) 6px,
      transparent 6px,
      transparent 14px
    ),
    linear-gradient(
      135deg,
      var(--atm-color-gray-850),
      var(--atm-color-teal-850)
    );
}
*/

.atm-isrv-lib-backg-classic-champagne {
  background:
    linear-gradient(135deg, #f7e7ce, #e6cfa7);
}

.atm-isrv-lib-backg-classic-frosted-blue {
  background:
    linear-gradient(135deg, rgba(59,130,246,.25), rgba(255,255,255,.05));
  backdrop-filter: blur(10px);
  background-color: #020617;
}

.atm-isrv-lib-backg-classic-obsidian {
  background:
    radial-gradient(circle at 20% 20%, rgba(255,255,255,.06), transparent 35%),
    linear-gradient(135deg, #0b0f14, #1f2937);
}




/* future */
.atm-isrv-lib-backg-future-ghost {
  background:
    radial-gradient(circle at 20% 20%, #20c997, transparent 50%),
    radial-gradient(circle at 80% 30%, #0dcaf0, transparent 50%),
    radial-gradient(circle at 50% 80%, #6610f2, transparent 50%);
  background-color: #111;
}
.atm-isrv-lib-backg-future-stance {
background:
 radial-gradient(circle at 30% 30%, #7cffcb, transparent 60%),
 radial-gradient(circle at 70% 70%, #5f7bff, transparent 60%),
 linear-gradient(135deg, #0b1020, #1a2555);
}
.atm-isrv-lib-backg-future-nebula {
background:
  linear-gradient(135deg, rgba(255,255,255,.08), rgba(255,255,255,.02)),
  radial-gradient(circle at top left, #6f7cff,transparent 60%),
  radial-gradient(circle at bottom right, #ff7ad9, transparent 60%),
  #0f1220;
}
.atm-isrv-lib-backg-future-flow {
background:
  linear-gradient(120deg, #ff5fd8, #7b5cff, #4ddfff, #7bffb2);
background-size: 300% 300%;
}
.atm-isrv-lib-backg-future-cosmic {
background:
  radial-gradient(circle at 20% 20%, #ff4d6d, transparent 55%),
  radial-gradient(circle at 80% 80%, #ffd166, transparent 55%),
  linear-gradient(135deg, #140b1f, #2b0f3f);
}
.atm-isrv-lib-backg-future-neon {
background:
  linear-gradient(135deg, #ff0080, #7928ca, #2afadf);
}
.atm-isrv-lib-backg-future-sunset {
background:
  linear-gradient(165deg, hsl(32, 95%, 70%), hsl(20, 90%, 60%), hsl(195, 75%, 55%));
}
.atm-isrv-lib-backg-future-mirage {
background:
  linear-gradient(135deg, #00e5ff, #3f37c9, #7209b7);
background-size: 200% 200%;
}
/*
.atm-isrv-lib-backg-aurora-boreal {
  background:
    radial-gradient(circle at 20% 30%, rgba(0,255,200,.35), transparent 55%),
    radial-gradient(circle at 50% 20%, rgba(0,200,255,.30), transparent 60%),
    radial-gradient(circle at 80% 40%, rgba(120,255,180,.30), transparent 60%),
    radial-gradient(circle at 30% 70%, rgba(80,200,255,.25), transparent 60%),
    radial-gradient(circle at 70% 75%, rgba(100,255,200,.25), transparent 60%),
    linear-gradient(180deg, #020617, #020617);
}

.atm-isrv-lib-backg-aurora-flow {
  background:
    linear-gradient(
      120deg,
      rgba(0,255,200,.25),
      rgba(0,200,255,.25),
      rgba(120,255,180,.25),
      rgba(0,180,255,.25)
    ),
    radial-gradient(circle at 30% 30%, rgba(0,255,200,.35), transparent 60%),
    radial-gradient(circle at 70% 60%, rgba(120,255,180,.35), transparent 60%),
    #020617;
  background-size: 300% 300%;
}
*/





/* atitude */
.atm-isrv-lib-backg-atitude-rainbow {
background:
linear-gradient( 135deg,
  rgba(228,3,3,.26), rgba(255,140,0,.26), rgba(255,237,0,.26),
  rgba(0,128,38,.26), rgba(0,77,255,.26), rgba(117,7,135,.26) );
}
.atm-isrv-lib-backg-atitude-infinite {
background: linear-gradient( 135deg,
  rgba(228,3,3,.30), rgba(255,140,0,.30), rgba(255,237,0,.30),
  rgba(0,128,38,.30), rgba(0,77,255,.30), rgba(117,7,135,.30) );
backdrop-filter: blur(12px);
background-color: #0f172a;
}
.atm-isrv-lib-backg-atitude-living {
background: linear-gradient( to right,
  rgba(228,3,3,.20), rgba(255,140,0,.20), rgba(255,237,0,.20),
  rgba(0,128,38,.20), rgba(0,77,255,.20), rgba(117,7,135,.20) );
background-color: #ffffff;
}
.atm-isrv-lib-backg-atitude-kindle {
background: linear-gradient( to right,
  rgba(228,3,3,.24), rgba(255,140,0,.24), rgba(255,237,0,.24),
  rgba(0,128,38,.24), rgba(0,77,255,.24), rgba(117,7,135,.24) );
backdrop-filter: blur(12px);
background-color: #0f172a;
}
.atm-isrv-lib-backg-atitude-luminous {
  background:
    radial-gradient(circle at 15% 20%, rgba(228,3,3,.22), transparent 55%),
    radial-gradient(circle at 85% 25%, rgba(255,140,0,.22), transparent 55%),
    radial-gradient(circle at 20% 80%, rgba(255,237,0,.22), transparent 55%),
    radial-gradient(circle at 80% 80%, rgba(0,128,38,.22), transparent 55%),
    radial-gradient(circle at 50% 50%, rgba(0,77,255,.22), transparent 55%),
    radial-gradient(circle at 65% 60%, rgba(117,7,135,.22), transparent 55%);
  background-color: #ffffff;
}
.atm-isrv-lib-backg-atitude-spectrum {
  background:
    radial-gradient(circle at 15% 20%, rgba(228,3,3,.30), transparent 55%),
    radial-gradient(circle at 85% 25%, rgba(255,140,0,.30), transparent 55%),
    radial-gradient(circle at 20% 80%, rgba(255,237,0,.30), transparent 55%),
    radial-gradient(circle at 80% 80%, rgba(0,128,38,.30), transparent 55%),
    radial-gradient(circle at 50% 50%, rgba(0,77,255,.30), transparent 55%),
    radial-gradient(circle at 65% 60%, rgba(117,7,135,.30), transparent 55%);
  background-color: #020617;
}