/*
Click nbfs://nbhost/SystemFileSystem/Templates/Licenses/license-default.txt to change this license
Click nbfs://nbhost/SystemFileSystem/Templates/Other/CascadeStyleSheet.css to edit this template
*/
/* 
    Created on : 12.08.2024, 14:47:10
    Author     : robert
*/

.swap-button {
    position: absolute;
    right: 48px;
    top: 16px;
    height: 35px;
    width: 35px;
    background: #fffbffaa;
    border: 3px solid rgb(58, 77, 99);
    border-radius: 0 7px 0 10px;
    color: rgb(57, 41, 64);
}

.swap-button:hover > .tt,
.swap-button-hover > .tt {
    position: absolute;
    border: 2px solid rgb(189, 143, 255);
    border-radius:5px 5px 0 0;
    top: -8px;
    bottom: -8px;
    left: -8px;
    right: -8px;
}
.swap-button:hover > .tt:after,
.swap-button-hover > .tt:after {
    content: "Swap";
    position: absolute;
    background: rgb(189, 143, 255);
    border-radius: 0 0 5px 5px;
    bottom: -21px;
    left: -2px;
    width: calc(100% - 6px);
    text-align: center;
    padding: 2px 5px;
    font-size: 14px;   
    color: white;
}

.selected {
    display: none;
    font-size: 33px;
    margin-top: -12px;
    margin-left: -3px;
}
.swap-button:hover > .selected {
    display: block;
}
.swapSelected {
    background: rgb(57, 41, 64);
}
.swapSelected > .selected {
    display: block;
    color: rgb(255, 251, 255);
    
}
.swapSelected > .free {
    
}