/* =========================================================
   EA ICON TOOLS
   Equal-size icons + responsive slider + max-two-row grid
========================================================= */

.ea-icon-tool{
    width:100%;
    max-width:100%;
    min-width:0;
    direction:rtl;
    position:relative;
    font-family:inherit;
    isolation:isolate;
}

.ea-icon-tool *,
.ea-icon-tool *::before,
.ea-icon-tool *::after{
    box-sizing:border-box;
}

.ea-icon-heading{
    width:100%;
    margin:0 0 12px;
    padding:0;
}

.ea-icon-heading h2{
    margin:0;
    padding:0;
    color:#222;
    font-size:20px;
    line-height:1.55;
    font-weight:800;
}

.ea-icon-heading p{
    margin:3px 0 0;
    padding:0;
    color:#777;
    font-size:12px;
    line-height:1.6;
}

.ea-icon-box{
    width:100%;
    position:relative;
    background:var(--ea-icon-bg,#fff);
    border:var(--ea-icon-border-width,1px) solid var(--ea-icon-border-color,#e7e9ed);
    border-radius:var(--ea-icon-radius,16px);
    box-shadow:var(--ea-icon-shadow,none);
    padding:16px;
}

/* ---------------------------------------------------------
   Common icon item
--------------------------------------------------------- */

.ea-icon-item{
    flex:0 0 auto;
    min-width:0;
    min-height:126px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:flex-start;
    gap:8px;
    padding:var(--ea-icon-pad,8px);
    color:var(--ea-icon-title-color,#333);
    text-decoration:none!important;
    text-align:center;
    border-radius:12px;
    background:transparent;
    outline:none;
    -webkit-tap-highlight-color:transparent;
}

.ea-icon-item:focus-visible{
    outline:2px solid currentColor;
    outline-offset:2px;
}

@media (hover:hover){
    .ea-icon-item{
        transition:
            transform .18s ease,
            background-color .18s ease;
    }

    .ea-icon-item:hover{
        transform:translateY(-2px);
        background:rgba(16,24,40,.025);
    }
}

.ea-icon-image{
    width:var(--ea-icon-size-desktop,64px);
    height:var(--ea-icon-size-desktop,64px);
    flex:0 0 auto;
    display:flex;
    align-items:center;
    justify-content:center;
    overflow:hidden;
    border-radius:12px;
    background:#fff;
}

.ea-icon-image img{
    display:block;
    width:100%!important;
    height:100%!important;
    max-width:none!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
    object-position:center;
    user-select:none;
    -webkit-user-drag:none;
}

.ea-icon-item-title{
    width:100%;
    min-height:2.9em;
    display:-webkit-box;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:2;
    overflow:hidden;
    color:var(--ea-icon-title-color,#333);
    font-size:var(--ea-icon-title-size-desktop,12px);
    line-height:1.45;
    font-weight:var(--ea-icon-title-weight,600);
    white-space:normal;
}

/* ---------------------------------------------------------
   Slider
--------------------------------------------------------- */

.ea-icon-carousel{
    position:relative;
    width:100%;
    min-width:0;
    outline:none;
}

.ea-icon-viewport{
    position:relative;
    width:100%;
    overflow:hidden;
    touch-action:pan-y;
    user-select:none;
    -webkit-user-select:none;
}

.ea-icon-track{
    position:absolute;
    top:0;
    right:0;
    display:flex;
    flex-direction:row;
    align-items:stretch;
    direction:rtl;
    gap:var(--ea-icon-gap-desktop,12px);
    width:max-content;
    will-change:transform;
    transition:transform .42s cubic-bezier(.22,.61,.36,1);
}

.ea-icon-track.ea-icon-no-transition{
    transition:none!important;
}

.ea-icon-slider-tool .ea-icon-viewport{
    min-height:var(--ea-icon-viewport-min-desktop,126px);
    contain:layout paint;
}

.ea-icon-slider-tool .ea-icon-item{
    flex-basis:var(--ea-icon-card-width,auto)!important;
    width:var(--ea-icon-card-width,auto)!important;
}

.ea-icon-arrow{
    position:absolute;
    top:50%;
    z-index:20;
    width:36px;
    height:36px;
    margin-top:-18px;
    padding:0;
    display:none;
    align-items:center;
    justify-content:center;
    border:1px solid #dedede!important;
    border-radius:50%!important;
    background:#fff!important;
    color:#333!important;
    box-shadow:0 5px 16px rgba(0,0,0,.10);
    cursor:pointer;
    appearance:none!important;
    -webkit-appearance:none!important;
    outline:none!important;
    line-height:0!important;
    font-size:0!important;
}

.ea-icon-prev{ right:-6px; }
.ea-icon-next{ left:-6px; }

.ea-icon-chevron{
    width:9px!important;
    height:9px!important;
    padding:0!important;
    margin:0!important;
    display:block!important;
    border:0!important;
    border-top:2px solid #333!important;
    border-right:2px solid #333!important;
    background:transparent!important;
}

.ea-icon-chevron-right{
    transform:rotate(45deg);
    margin-right:-3px!important;
}

.ea-icon-chevron-left{
    transform:rotate(-135deg);
    margin-left:-3px!important;
}

@media (max-width:1100px) and (min-width:768px){
    .ea-icon-slider-tool .ea-icon-viewport{
        min-height:var(--ea-icon-viewport-min-tablet,126px);
    }
}

@media (max-width:767px){
    .ea-icon-slider-tool .ea-icon-viewport{
        min-height:var(--ea-icon-viewport-min-mobile,112px);
    }
}

@media (hover:hover){
    .ea-icon-arrow:hover{
        background:#f7f7f7!important;
        border-color:#d7d7d7!important;
        box-shadow:0 7px 18px rgba(0,0,0,.13);
    }
}

.ea-icon-dots{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:6px;
    margin:10px 0 0;
}

.ea-icon-dot{
    width:7px;
    height:7px;
    padding:0;
    border:0;
    border-radius:50%;
    background:#d8d8d8;
    cursor:pointer;
}

.ea-icon-dot.is-active{
    width:18px;
    border-radius:999px;
    background:#555;
}

/* ---------------------------------------------------------
   Grid
--------------------------------------------------------- */

.ea-icon-grid-box{
    overflow:hidden;
}

.ea-icon-grid{
    display:grid;
    grid-template-columns:repeat(var(--ea-icon-columns,1),minmax(0,1fr));
    align-items:stretch;
    gap:var(--ea-icon-gap-desktop,12px);
    width:100%;
    min-width:0;
}

.ea-icon-grid .ea-icon-item{
    width:100%;
    min-width:0;
}

.ea-icon-grid .ea-icon-image{
    margin-inline:auto;
}

/* Never create a 3rd row. On narrow screens the grid scrolls
   horizontally instead of reducing the number of columns. */
@media (max-width:767px){
    .ea-icon-box{
        padding:10px;
        border-radius:min(14px,var(--ea-icon-radius,16px));
    }

    .ea-icon-item{
        min-height:112px;
        gap:7px;
    }

    .ea-icon-image{
        width:var(--ea-icon-size-mobile,52px);
        height:var(--ea-icon-size-mobile,52px);
        border-radius:10px;
    }

    .ea-icon-item-title{
        font-size:var(--ea-icon-title-size-mobile,10px);
    }

    .ea-icon-grid{
        grid-template-columns:repeat(var(--ea-icon-columns,1),minmax(76px,1fr));
        width:max-content;
        min-width:100%;
        overflow-x:auto;
        overscroll-behavior-x:contain;
        scrollbar-width:none;
    }

    .ea-icon-grid::-webkit-scrollbar{
        display:none;
        width:0;
        height:0;
    }

    .ea-icon-track{
        gap:var(--ea-icon-gap-mobile,8px);
    }
}

@media (max-width:1100px) and (min-width:768px){
    .ea-icon-box{
        padding:14px;
    }

    .ea-icon-track{
        gap:var(--ea-icon-gap-tablet,10px);
    }

    .ea-icon-grid{
        gap:var(--ea-icon-gap-tablet,10px);
    }

    .ea-icon-image{
        width:var(--ea-icon-size-tablet,60px);
        height:var(--ea-icon-size-tablet,60px);
    }
}

@media (max-width:767px){
    .ea-icon-slider-tool .ea-icon-box{
        padding:10px;
    }

    .ea-icon-slider-tool .ea-icon-prev,
    .ea-icon-slider-tool .ea-icon-next{
        width:32px;
        height:32px;
        margin-top:-16px;
    }
}

@media (prefers-reduced-motion:reduce){
    .ea-icon-track{
        transition:none!important;
    }

    .ea-icon-item{
        transition:none!important;
    }
}


/* =========================================================
   AIDIN ICON SLIDER — visual refresh
   Only the Slider tool is affected; the icon grid stays unchanged.
========================================================= */

.ea-icon-slider-tool .ea-icon-heading{
    margin:0 0 16px;
    text-align:right!important;
}

.ea-icon-slider-tool .ea-icon-heading h2{
    font-size:20px;
    font-weight:800;
    color:#222;
}

.ea-icon-slider-tool .ea-icon-heading p{
    color:#777;
    font-size:12px;
}

/* No outer box around the icon slider. */
.ea-icon-slider-tool .ea-icon-box{
    padding:0!important;
    background:transparent!important;
    border:0!important;
    border-radius:0!important;
    box-shadow:none!important;
}

.ea-icon-slider-tool .ea-icon-carousel{
    padding:4px 2px 10px;
}

.ea-icon-slider-tool .ea-icon-item{
    min-height:128px;
    padding:6px 4px 2px;
    gap:10px;
    overflow:visible;
    background:transparent!important;
    transform:none;
}

@media (hover:hover){
    .ea-icon-slider-tool .ea-icon-item:hover{
        transform:translateY(-3px);
        background:transparent!important;
    }
}

/* Circular icon with a soft shadow + colorful halo. */
.ea-icon-slider-tool .ea-icon-image{
    position:relative;
    width:var(--ea-icon-size-desktop,64px);
    height:var(--ea-icon-size-desktop,64px);
    padding:5px;
    overflow:visible;
    border-radius:50%;
    background:linear-gradient(135deg,#7c5cff 0%,#24c6dc 48%,#ff6fb5 100%);
    box-shadow:0 9px 24px rgba(55,65,81,.16), 0 0 0 5px rgba(124,92,255,.055);
}

.ea-icon-slider-tool .ea-icon-image::before{
    content:"";
    position:absolute;
    inset:-5px;
    z-index:-1;
    border-radius:50%;
    background:conic-gradient(from 210deg,#7c5cff,#24c6dc,#52d88f,#ffc857,#ff6fb5,#7c5cff);
    opacity:.30;
}

.ea-icon-slider-tool .ea-icon-image img{
    width:100%!important;
    height:100%!important;
    border-radius:50%;
    background:#fff;
    padding:6px!important;
    object-fit:contain;
    box-shadow:0 3px 11px rgba(15,23,42,.12);
}

/* Pleasant color rhythm across the icon set; also repeats safely in loop clones. */
.ea-icon-slider-tool .ea-icon-item:nth-child(6n+1) .ea-icon-image{background:linear-gradient(135deg,#5b7cff,#67d8ff);}
.ea-icon-slider-tool .ea-icon-item:nth-child(6n+2) .ea-icon-image{background:linear-gradient(135deg,#ff77c8,#ffb86b);}
.ea-icon-slider-tool .ea-icon-item:nth-child(6n+3) .ea-icon-image{background:linear-gradient(135deg,#62d58b,#38bdf8);}
.ea-icon-slider-tool .ea-icon-item:nth-child(6n+4) .ea-icon-image{background:linear-gradient(135deg,#8b6cff,#e89bff);}
.ea-icon-slider-tool .ea-icon-item:nth-child(6n+5) .ea-icon-image{background:linear-gradient(135deg,#ff8b6a,#ffd15c);}
.ea-icon-slider-tool .ea-icon-item:nth-child(6n) .ea-icon-image{background:linear-gradient(135deg,#25c7b6,#6c8cff);}

.ea-icon-slider-tool .ea-icon-item-title{
    color:var(--ea-icon-title-color,#333);
    font-weight:var(--ea-icon-title-weight,600);
}

/* Device visibility. These are scoped and do not affect Icon Grid. */
@media (min-width:1101px){
    .ea-icon-slider-tool.ea-icon-hide-desktop{display:none!important;}
}
@media (min-width:768px) and (max-width:1100px){
    .ea-icon-slider-tool.ea-icon-hide-tablet{display:none!important;}
    .ea-icon-slider-tool .ea-icon-image{
        width:var(--ea-icon-size-tablet);
        height:var(--ea-icon-size-tablet);
    }
}
@media (max-width:767px){
    .ea-icon-slider-tool.ea-icon-hide-mobile{display:none!important;}
    .ea-icon-slider-tool .ea-icon-carousel{padding-inline:0;}
    .ea-icon-slider-tool .ea-icon-item{min-height:112px;gap:8px;}
    .ea-icon-slider-tool .ea-icon-image{
        width:var(--ea-icon-size-mobile);
        height:var(--ea-icon-size-mobile);
    }
    .ea-icon-slider-tool .ea-icon-heading{margin-bottom:12px;}
    .ea-icon-slider-tool .ea-icon-heading h2{font-size:17px;}
    .ea-icon-slider-tool .ea-icon-heading p{font-size:9px;}
}


/* v5.5.24 — Completely remove the frame/ring around Icon Slider images. */
.ea-icon-slider-tool .ea-icon-item,
.ea-icon-slider-tool .ea-icon-item:focus,
.ea-icon-slider-tool .ea-icon-item:focus-visible {
    border: 0 !important;
    outline: 0 !important;
    box-shadow: none !important;
}

.ea-icon-slider-tool .ea-icon-image,
.ea-icon-slider-tool .ea-icon-image:hover,
.ea-icon-slider-tool .ea-icon-image:focus,
.ea-icon-slider-tool .ea-icon-image:focus-visible {
    padding: 0 !important;
    border: 0 !important;
    outline: 0 !important;
    background: transparent !important;
    background-image: none !important;
    border-radius: 50% !important;
    box-shadow: none !important;
    overflow: hidden !important;
}

.ea-icon-slider-tool .ea-icon-image::before {
    display: none !important;
    content: none !important;
    background: none !important;
    box-shadow: none !important;
}

.ea-icon-slider-tool .ea-icon-image img {
    display: block !important;
    padding: 0 !important;
    margin: 0 !important;
    border: 0 !important;
    outline: 0 !important;
    border-radius: 50% !important;
    background: transparent !important;
    box-shadow: none !important;
}