/* ===============================
   BUTTON LINKS OJS
   View Journal | Current Issue
================================ */

.links {
    list-style: none;
    padding: 0;
    margin: 12px 0 0 0;
    display: flex;
    gap: 10px;
}

/* item */
.links li {
    margin: 0;
}

/* tombol umum */
.links a {
    display: inline-block;
    padding: 6px 16px;
    font-size: 12.5px;
    font-weight: 600;
    border-radius: 20px;
    text-decoration: none;
    transition: all 0.25s ease;
}

/* View Journal */
.links .view a {
    background: #040e27;
    color: #ffffff;
    border: 1px solid #040e27;
}

.links .view a:hover {
    background: #0b1c4d;
    border-color: #0b1c4d;
}

/* Current Issue */
.links .current a {
    background: #ffffff;
    color: #040e27;
    border: 1px solid #040e27;
}

.links .current a:hover {
    background: #040e27;
    color: #ffffff;
}

/* Mobile friendly */
@media (max-width: 480px) {
    .links {
        flex-wrap: wrap;
    }
}
/* ===============================
   BUTTON LINKS OJS (PETAK)
   View Journal | Current Issue
================================ */

.links {
    list-style: none;
    padding: 0;
    margin: 30px 0 0 0 !important; /* margin top 50px */
    display: flex;
    gap: 12px;
}

/* item */
.links li {
    margin: 0;
}

/* tombol umum */
.links a {
    display: inline-block;
    padding: 8px 18px;
    font-size: 13px;
    font-weight: 600;
    border-radius: 0; /* PETAK */
    text-decoration: none;
    transition: all 0.25s ease;
}

/* View Journal */
.links .view a {
    background: #040e27;
    color: #ffffff;
    border: 1px solid #040e27;
}

.links .view a:hover {
    background: #0b1c4d;
    border-color: #0b1c4d;
}

/* Current Issue */
.links .current a {
    background: #ffffff;
    color: #040e27;
    border: 1px solid #040e27;
}

.links .current a:hover {
    background: #040e27;
    color: #ffffff;
}

/* Mobile friendly */
@media (max-width: 480px) {
    .links {
        flex-wrap: wrap;
    }

    .links a {
        width: 100%;
        text-align: center;
    }
}
