/* hide original logo */
#navbar-logo {
    display: none !important;
}

/* custom logo */
.navbar-brand {

    position: relative;

    width: 180px;

    height: 48px;

    display: flex !important;

    align-items: center;
}

/* insert custom image */
.navbar-brand::before {

    content: "";

    width: 180px;

    height: 48px;

    display: block;

    background-image:
        url('/custom-logo.png');

    background-repeat: no-repeat;

    background-position: left center;

    background-size: contain;
}


/* =======================================
   PROFESSIONAL FOOTER
======================================= */

.footer {

    background: #020b17 !important;

    padding: 0 !important;

}

.felix-footer {

    background:
        linear-gradient(180deg,
            #03131f 0%,
            #020914 100%);

    border-top:
        1px solid rgba(38, 224, 110, .15);

    padding: 70px 0 25px;
}

.felix-footer-container {

    width: 90%;

    max-width: 1400px;

    margin: auto;
}

.felix-footer-top {

    display: flex;

    justify-content: space-between;

    gap: 60px;

    flex-wrap: wrap;
}

.felix-footer-brand {

    max-width: 360px;
}

.felix-footer-logo {

    width: 180px;

    margin-bottom: 25px;
}

.felix-footer-brand h2 {

    color: #b2b8b6;

    font-size: 34px;

    font-weight: 700;

    margin-bottom: 15px;
}

.felix-footer-brand p {

    color: #9fb3c8;

    line-height: 1.8;

    font-size: 16px;
}

.felix-footer-links {

    display: flex;

    gap: 80px;

    flex-wrap: wrap;
}

.felix-footer-column h3 {

    color: #744fc0;

    margin-bottom: 22px;

    font-size: 20px;

    font-weight: 700;
}

.felix-footer-column a {

    display: block;

    color: #d9e6f2;

    text-decoration: none;

    margin-bottom: 14px;

    transition: .3s;
}

.felix-footer-column a:hover {

    color: #26e06e;

    transform: translateX(5px);
}

.felix-footer-bottom {

    border-top:
        1px solid rgba(255, 255, 255, .08);

    margin-top: 50px;

    padding-top: 25px;

    text-align: center;

    color: #7f95aa;

    font-size: 14px;
}

/* MOBILE */

@media(max-width:768px) {

    .felix-footer {

        padding: 50px 0 20px;
    }

    .felix-footer-top {

        flex-direction: column;
    }

    .felix-footer-links {

        gap: 35px;
    }

    .felix-footer-brand h2 {

        font-size: 28px;
    }
}

.layout-container .dashboard-banner-container{
    background: linear-gradient(180deg, #03131f 0%, #020914 100%) !important;
}

.dashboard-banner-network-plain-container {
      background: linear-gradient(180deg, #263139 0%, #020913 100%) !important;
}

.dashboard-banner-network-plain-container:after {
       background: linear-gradient(180deg, #263139 0%, #020913 100%) !important;
}


/* =========================================
   NIRMAX STYLE MOBILE SEARCH
========================================= */

@media(max-width:768px){

    /* MAIN SEARCH WRAPPER */

    .search-form.mobile-search-show{

        position:relative!important;

        width:100%!important;

        padding:14px!important;

        margin-top:14px!important;

        border-radius:16px!important;

        background: linear-gradient(135deg, #03121e 0%, #7650c3 55%, #714dbb 100%) !important;

        box-shadow:
        0 12px 30px rgba(0,0,0,.18)!important;

        overflow:visible!important;

        z-index:999999!important;

        border:none!important;
    }

    /* TITLE */

    .search-form.mobile-search-show::before{

        content:"Felix Smart Chain Explorer";

        display:block;

        color:#ffffff;

        font-size:16px;

        font-weight:700;

        margin-bottom:12px;

        letter-spacing:.2px;
    }

    /* INPUT GROUP */

    .search-form.mobile-search-show .input-group{

        position:relative!important;

        display:flex!important;

        align-items:center!important;

        width:100%!important;

        height:48px!important;

        background:#1e2f55!important;

        border-radius:12px!important;

        overflow:hidden!important;

        border:none!important;
    }

    /* INPUT WRAPPER */

    .search-form.mobile-search-show .search-control{

        width:100%!important;

        height:48px!important;

        background:transparent!important;

        border:none!important;

        padding:0!important;

        flex:1!important;
    }

    .search-form.mobile-search-show .autoComplete_wrapper{

        width:100%!important;

        position:relative!important;
    }

    /* INPUT */

    .search-form.mobile-search-show input{

        width:100%!important;

        height:48px!important;

        background:transparent!important;

        border:none!important;

        outline:none!important;

        box-shadow:none!important;

        color:#ffffff!important;

        font-size:13px!important;

        font-weight:500!important;

        padding-left:42px!important;

        padding-right:14px!important;
    }

    /* PLACEHOLDER */

    .search-form.mobile-search-show input::placeholder{

        color:rgba(255,255,255,.55)!important;

        opacity:1!important;
    }

    /* ICON POSITION */

    .search-form.mobile-search-show .input-group-append.left{

        position:absolute!important;

        left:36px!important;

        top:50%!important;

        transform:translateY(-50%)!important;

        z-index:99!important;
    }

    /* SEARCH BUTTON */

    .search-form.mobile-search-show #search-icon{

        background:transparent!important;

        border:none!important;

        padding:0!important;

        width:auto!important;

        height:auto!important;

        min-width:auto!important;

        display:flex!important;

        align-items:center!important;

        justify-content:center!important;

        box-shadow:none!important;
    }

    /* ICON */

    .search-form.mobile-search-show #search-icon svg{

        width:17px!important;

        height:17px!important;
    }

    .search-form.mobile-search-show #search-icon svg path{

        fill:#ffffff!important;
    }

    /* REMOVE SLASH */

    .search-form.mobile-search-show .desktop-only{

        display:none!important;
    }

    /* REMOVE EXTRA BUTTON STYLE */

    .search-form.mobile-search-show .input-group-text{

        background:transparent!important;

        border:none!important;

        padding:0!important;
    }

    /* AUTOCOMPLETE BOX */

    .search-form.mobile-search-show ul[role="listbox"]{

        position:absolute!important;

        top:56px!important;

        left:0!important;

        width:100%!important;

        background:#ffffff!important;

        border-radius:14px!important;

        z-index:999999999!important;

        box-shadow:
        0 15px 40px rgba(0,0,0,.28)!important;

        border:none!important;

        padding:6px!important;

        overflow:hidden!important;

        max-height:260px!important;

        overflow-y:auto!important;
    }

    /* SUGGESTION ITEM */

    .search-form.mobile-search-show ul[role="listbox"] li{

        background:#ffffff!important;

        color:#111827!important;

        padding:13px 14px!important;

        border-radius:10px!important;

        font-size:13px!important;

        font-weight:500!important;

        line-height:1.4!important;

        margin-bottom:4px!important;

        transition:.2s!important;

        word-break:break-word!important;
    }

    /* HOVER */

    .search-form.mobile-search-show ul[role="listbox"] li:hover{

        background:#f3f4f6!important;
    }

    /* REMOVE DEFAULT AUTOCOMPLETE STYLE */

    .search-form.mobile-search-show ul{

        list-style:none!important;

        margin:0!important;
    }

    /* FIX OVERFLOW */

    body,
    html,
    main,
    section,
    .layout-container,
    .dashboard-banner-container{

        overflow:visible!important;
    }
}

.tile-type-block{
    border: none !important;
    border-radius: 12px !important;
}

.tile-bottom-contents{
    line-height: 40px !important;
}

span,a,h3{
    font-size: 15px !important;
}

.btn-line{
    border-radius: 18px !important;
}

.tile.tile-type-transaction{
        border-radius: 20px !important;
}

.tile.tile-type-transaction .tile-transaction-type-block {
    border-bottom: 0px solid #007bff;
    border-right: 0px solid #007bff;
    border-top: 0px solid #007bff;
}

.tile.tile-type-token-transfer .tile-transaction-type-block {
    border-bottom: 0px solid #007bff;
    border-right: 0px solid #007bff;
    border-top: 0px solid #007bff;
}

.tile.tile-type-contract-call .tile-transaction-type-block {
    border-bottom: 0px solid #007bff;
    border-right: 0px solid #007bff;
    border-top: 0px solid #007bff;
}

.tile.tile-type-block .tile-transaction-type-block{
    border-bottom: 0px solid #5c34a2;
    border-right: 0px solid #5c34a2;
    border-top: 0px solid #5c34a2;
}

.tile.tile-type-token-transfer .tile-transaction-type-block{
    border-bottom: 0px solid #5c34a2;
    border-right: 0px solid #5c34a2;
    border-top: 0px solid #5c34a2;
}

.tile.tile-type-contract-call .tile-transaction-type-block{
    border-bottom: 0px solid #5c34a2;
    border-right: 0px solid #5c34a2;
    border-top: 0px solid #5c34a2;
}

/* =========================================
   FELIX SCAN CSS PRELOADER ONLY
========================================= */

/* BODY LOADING */

body::before{

    content:"";

    position:fixed;

    top:0;
    left:0;

    width:100%;
    height:100%;

    background:
    radial-gradient(
        circle at top,
        #1c1d31 0%,
        #282945 45%,
        #212c34 100%
    );

    z-index:999998;

    animation:
    preloaderFade 1.8s ease forwards;

    pointer-events:none;
}

/* ROTATING RING */

body::after{

    content:"";

    position:fixed;

    top:50%;
    left:50%;

    width:140px;
    height:140px;

    margin-left:-70px;
    margin-top:-70px;

    border-radius:50%;

    border:
    4px solid white;

    border-top:
    4px solid gold;

    border-right:
    4px solid white;

    z-index:999999;

    box-shadow:
    0 0 45px rgba(38,224,110,.25);

    animation:
    loaderSpin 1s linear infinite,
    preloaderFade 1.8s ease forwards;

    pointer-events:none;
}

/* OPTIONAL TEXT */

.layout-container::before{

    content:"FELIX SCAN";

    position:fixed;

    top:calc(50% + 95px);
    left:50%;

    transform:translateX(-50%);

    color:#ffffff;

    font-size:28px;

    font-weight:800;

    letter-spacing:3px;

    z-index:999999;

    animation:
    preloaderFade 1.8s ease forwards;

    pointer-events:none;
}

/* SPIN */

@keyframes loaderSpin{

    0%{

        transform:
        rotate(0deg);
    }

    100%{

        transform:
        rotate(360deg);
    }
}

/* FADE */

@keyframes preloaderFade{

    0%{

        opacity:1;
        visibility:visible;
    }

    70%{

        opacity:1;
    }

    100%{

        opacity:0;
        visibility:hidden;
    }
}

/* MOBILE */

@media(max-width:768px){

    body::after{

        width:100px;
        height:100px;

        margin-left:-50px;
        margin-top:-50px;
    }

    .layout-container::before{

        font-size:20px;

        top:calc(50% + 75px);
    }
}


/* =========================================================
   FELIX SCAN PROFESSIONAL NAVBAR SEARCH
========================================================= */

/* SEARCH WRAPPER */

.search-form{

    position:relative!important;

    width:100%!important;

    max-width:380px!important;

    margin-left:20px!important;

    margin-right:0!important;

    z-index:999999!important;
}

/* NAVBAR FIX */

.navbar,
.navbar-nav,
.navbar-collapse{

    overflow:visible!important;
}

/* MAIN INPUT GROUP */

.search-form .input-group{

    position:relative!important;

    display:flex!important;

    align-items:center!important;

    width:100%!important;

    height:40px!important;

    border-radius:12px!important;

    overflow:visible!important;

    background:
    linear-gradient(
        135deg,
        rgba(38,40,73,.96),
        rgba(30,33,61,.98)
    )!important;

    border:
    1px solid rgba(255,255,255,.05)!important;

    box-shadow:
    0 4px 15px rgba(0,0,0,.18)!important;

    transition:.3s!important;
}

/* HOVER */

.search-form .input-group:hover{

    border-color:
    rgba(38,224,110,.20)!important;
}

/* FOCUS */

.search-form .input-group:focus-within{

    border-color:
    rgba(38,224,110,.45)!important;

    box-shadow:
    0 0 0 3px rgba(38,224,110,.08)!important;
}

/* SEARCH CONTROL */

.search-control{

    flex:1!important;

    display:flex!important;

    align-items:center!important;

    background:transparent!important;

    border:none!important;

    height:100%!important;

    padding:0 14px!important;

    box-shadow:none!important;
}

/* REMOVE DEFAULT */

.search-form .form-control,
.search-form .input-group-text{

    background:transparent!important;

    border:none!important;

    box-shadow:none!important;
}

/* AUTOCOMPLETE WRAPPER */

.autoComplete_wrapper{

    width:100%!important;

    position:relative!important;
}

/* INPUT */

.main-search-autocomplete{

    width:100%!important;

    height:100%!important;

    border:none!important;

    outline:none!important;

    background:transparent!important;

    color:#ffffff!important;

    font-size:13px!important;

    font-weight:500!important;

    padding:0!important;

    letter-spacing:.2px!important;
}

/* PLACEHOLDER */

.main-search-autocomplete::placeholder{

    color:#8a90b5!important;

    opacity:1!important;

    font-size:12px!important;

    font-weight:500!important;
}

/* SEARCH BUTTON */

#search-icon{

    width:40px!important;

    height:40px!important;

    min-width:40px!important;

    border:none!important;

    padding:0!important;

    display:flex!important;

    align-items:center!important;

    justify-content:center!important;

    background:
    linear-gradient(
        135deg,
        #1d9445,
        #26e06e
    )!important;

    border-radius: 12px 0px 0px 10px !important;
                margin-left: -30px;

    transition:.25s!important;
    margin-left: -25px;
}

.navbar.navbar-primary .search-form{
   margin-top: 0px;
}

.dark-mode-changer{
   display: none;
}

/* BUTTON HOVER */

#search-icon:hover{

    filter:brightness(1.08)!important;

    transform:scale(1.02)!important;
}

/* ICON */

#search-icon svg{

    width:16px!important;

    height:16px!important;
}

#search-icon svg path{

    fill:#ffffff!important;
}

/* SLASH ICON */

#slash-icon{

    width:30px!important;

    min-width:30px!important;

    display:flex!important;

    align-items:center!important;

    justify-content:center!important;

    color:#7b82a5!important;

    font-size:11px!important;

    font-weight:700!important;

    background:transparent!important;

    border:none!important;
}

/* =========================================================
   AUTOCOMPLETE DROPDOWN
========================================================= */

#autoComplete_list_1,
#autoComplete_list_2{

    position:absolute!important;

    top:50px!important;

    left:0!important;

    width:100%!important;

    min-width:380px!important;

    padding:8px!important;

    background:
    linear-gradient(
        180deg,
        #2b2d50 0%,
        #232547 100%
    )!important;

    border:
    1px solid rgba(255,255,255,.06)!important;

    border-radius:14px!important;

    overflow:hidden!important;

    box-shadow:
    0 20px 45px rgba(0,0,0,.45)!important;

    z-index:99999999!important;

    animation:
    dropdownFade .25s ease;
}

/* RESULTS */

#autoComplete_list_1 li,
#autoComplete_list_2 li{

    background:transparent!important;

    color:#ffffff!important;

    border-radius:10px!important;

    padding:12px 14px!important;

    margin-bottom:4px!important;

    transition:.2s!important;

    font-size:13px!important;

    font-weight:500!important;

    cursor:pointer!important;
}

/* HOVER */

#autoComplete_list_1 li:hover,
#autoComplete_list_2 li:hover{

    background:
    rgba(38,224,110,.08)!important;

    color:#26e06e!important;
}

/* ACTIVE */

#autoComplete_list_1 li[aria-selected="true"],
#autoComplete_list_2 li[aria-selected="true"]{

    background:
    rgba(38,224,110,.10)!important;

    color:#26e06e!important;
}

/* MATCH TEXT */

mark{

    background:none!important;

    color:#26e06e!important;

    font-weight:700!important;

    padding:0!important;
}

/* RESULT TEXT */

.autoComplete_result{

    background:transparent!important;

    border:none!important;
}

/* NO RESULT */

.autoComplete_no_result{

    color:#9da3c7!important;

    padding:14px!important;

    font-size:13px!important;
}

/* SCROLLBAR */

#autoComplete_list_1::-webkit-scrollbar,
#autoComplete_list_2::-webkit-scrollbar{

    width:6px;
}

#autoComplete_list_1::-webkit-scrollbar-thumb,
#autoComplete_list_2::-webkit-scrollbar-thumb{

    background:#3c4168;

    border-radius:20px;
}

/* =========================================================
   ANIMATION
========================================================= */

@keyframes dropdownFade{

    from{

        opacity:0;
        transform:translateY(8px);
    }

    to{

        opacity:1;
        transform:translateY(0);
    }
}

/* =========================================================
   MOBILE VIEW
========================================================= */

@media(max-width:768px){

    .search-form{

        max-width:100%!important;

        margin:12px 0 0 0!important;
    }

    .search-form .input-group{

        height:50px!important;

        border-radius:14px!important;
    }

    .search-control{

        padding:0 12px!important;
    }

    .main-search-autocomplete{

        font-size:14px!important;
    }

    .main-search-autocomplete::placeholder{

        font-size:12px!important;
    }

    #search-icon{

        width:50px!important;

        height:50px!important;

        min-width:50px!important;

            border-radius: 12px 0px 0px 10px !important;
    }

    #search-icon svg{

        width:18px!important;

        height:18px!important;
    }

    #slash-icon{

        display:none!important;
    }

    /* MOBILE DROPDOWN */

    #autoComplete_list_1,
    #autoComplete_list_2{

        top:60px!important;

        left:0!important;

        width:100%!important;

        min-width:100%!important;

        border-radius:14px!important;
    }

    #autoComplete_list_1 li,
    #autoComplete_list_2 li{

        padding:13px!important;

        font-size:13px!important;
    }
}