.box {
    padding: 30px;
    border-radius: var(--border-radius);
    overflow: hidden;
    background: white;
}

.box-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.box-content {
    margin-top: 30px;
}

/*.box-left {*/
/*    background-color: #FFD700;*/
/*    padding: 20px;*/
/*    color: white;*/
/*    display: flex;*/
/*    flex-direction: column;*/
/*    justify-content: space-between;*/
/*    gap: 50px;*/
/*}*/

/*.box-title {*/
/*    font-size: 28px;*/
/*    color: var(--secondary);*/
/*}*/

/*.box-left i {*/
/*    font-size: 24px;*/
/*    align-self: flex-end;*/
/*    color: white;*/
/*}*/

/*.box-content {*/
/*    background-color: #f5f5f5;*/
/*    display: flex;*/
/*    flex-direction: column;*/
/*    justify-content: space-between;*/
/*}*/

/*.box-head {*/
/*    display: flex;*/
/*    color: var(--secondary);*/
/*    padding: 20px 30px 0;*/
/*    justify-content: space-between;*/
/*    align-items: center;*/
/*}*/


/*.box-info {*/
/*    font-size: 16px;*/
/*    color: var(--secondary);*/
/*}*/

/*.box-status {*/
/*    display: flex;*/
/*    gap: 15px;*/
/*}*/

.box-btn {
    color: var(--dark);
    display: flex;
    align-items: center;
    gap: 5px;
    font-size: 20px;
    font-weight: bold;
}

.box-btn .icon {
    font-size: 15px;
    display: block;
    color: var(--dark);
    width: 35px;
    height: 35px;
    border-radius: 50%;
    overflow: hidden;
    position: relative;
    transition: all 0.3s ease-in-out;
    border: solid 2px transparent;
}

.box-btn:hover .icon {
    border-color: var(--dark);
}

.box-btn .icon i {
    position: absolute;
    display: block;
    top: 50%;
    left: 50%;
    transform: translateY(-50%) translatex(-50%);
}

.box-btn:hover .icon i {
    animation: aniArrow 1s cubic-bezier(0, 0.6, 1, 0.4) infinite 0.5s;
}

/*.white {*/
/*    color: white;*/
/*}*/


/*.box-body .box-body-content:first-of-type {*/
/*    border-bottom: 1px solid #ddd;*/
/*    padding-bottom: 20px;*/
/*}*/

/*.currency {*/
/*    font-size: 16px;*/
/*    color: #888;*/
/*}*/

/*.box-change {*/
/*    font-size: 16px;*/
/*}*/

/*.box-change.positive {*/
/*    color: green;*/
/*}*/

/*.box-change.negative {*/
/*    color: red;*/
/*}*/

/*.market-value {*/
/*    display: flex;*/
/*    justify-content: flex-start;*/
/*    align-items: center;*/
/*}*/

/*.yellow-highlight {*/
/*    color: #FFD700;*/
/*}*/

/*.highlight {*/
/*    color: var(--primary);*/
/*}*/

.box-month {
    font-size: 32px;
    margin-left: 10px;
}

/*.box-body {*/
/*    padding: 30px 20px;*/
/*    display: flex;*/
/*    flex-direction: column;*/
/*    gap: 30px;*/
/*}*/

.box-calender {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 20px;
}

/*.btn-more {*/
/*    color: var(--secondary);*/
/*    font-size: 18px;*/
/*    border: 1px solid var(--border-color);*/
/*    border-radius: var(--border-radius-big);*/
/*    padding: 2px 20px;*/
/*}*/

.nav-arrow {
    border: 1px solid var(--primary);
    color: var(--primary);
    font-size: 25px;
    border-radius: 50%;
    padding: 5px 20px;
}

.box-dates {
    display: flex;
    /*justify-content: center;*/
    font-size: 130px;
    color: var(--primary-color);
}

.box-operation {
    font-size: 30px;
    color: var(--dark);
}

.navigation-arrows {
    display: flex;
    gap: 10px;
}

.nav-arrow {
    color: var(--primary-color);
    width: 40px;
    height: 40px;
    border-radius: 50%;
    border: 1px solid var(--primary-color);
    transition: all 0.3s ease-in-out;
    overflow: hidden;
    background: white;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
}

.nav-arrow:hover {
    color: white;
    background: var(--primary-color);
}