/* =====================================================
   SIDEBAR EUDAIMONIA JOURNAL PSYCHOLOGY
   ===================================================== */

.eudaimonia-sidebar {
    width: 100%;
    padding: 5px 10px 20px;
    box-sizing: border-box;
}


/* =====================================================
   BOX SIDEBAR
   ===================================================== */

.ejp-sidebar-box {
    width: 100%;
    margin-bottom: 0px !important;

    background: #ffffff;

    border: 1px solid #decbe6;

    border-radius: 14px;

    overflow: hidden;

    box-shadow: 0 4px 14px rgba(83, 34, 105, 0.10);

    transition: all 0.3s ease;
}


.ejp-sidebar-box:hover {
    transform: translateY(-2px);

    border-color: #9b58b5;

    box-shadow: 0 8px 20px rgba(83, 34, 105, 0.16);
}


/* =====================================================
   HEADER BOX
   ===================================================== */

.ejp-sidebar-header {
    position: relative;

    padding: 20px 22px;

    background: linear-gradient(
        135deg,
        #6d287f 0%,
        #8d3fa5 50%,
        #b861c8 100%
    );

    color: #ffffff;

    font-size: 20px;

    font-weight: 700;

    letter-spacing: 1px;

    text-transform: uppercase;

    border-bottom: 4px solid #d8a8e8;

    box-sizing: border-box;
}


/* Efek cahaya pada header */

.ejp-sidebar-header::after {
    content: "";

    position: absolute;

    width: 120px;
    height: 120px;

    border-radius: 50%;

    background: rgba(255,255,255,0.08);

    right: -40px;

    top: -70px;
}


/* =====================================================
   E-ISSN
   ===================================================== */

.issn-content {
    padding: 25px 15px 28px;

    text-align: center;

    background: #fcfaff;
}


.issn-number {
    margin-bottom: 5px;

    color: #493950;

    font-size: 20px;

    font-weight: 500;

    letter-spacing: 0.5px;
}


.ejp-barcode {
    display: block;

    width: 100%;

    max-width: 280px;

    height: auto;

    margin: 0 auto;
}


/* =====================================================
   MENU
   ===================================================== */

.ejp-menu {
    background: #ffffff;
}


.ejp-menu a {
    display: block;

    padding: 18px 20px;

    color: #413748;

    background: #ffffff;

    text-decoration: none;

    font-size: 18px;

    font-weight: 500;

    letter-spacing: 0.2px;

    border-bottom: 1px solid #e9ddec;

    transition: all 0.25s ease;
}


.ejp-menu a:last-child {
    border-bottom: none;
}


/* Hover Menu */

.ejp-menu a:hover {
    color: #ffffff;

    background: linear-gradient(
        90deg,
        #6d287f,
        #9342a8
    );

    padding-left: 27px;
}


/* Menu aktif */

.ejp-menu a.active,
.ejp-menu a[aria-current="page"] {
    color: #702c86;

    background: #f5ebf8;

    border-left: 5px solid #8e40a4;

    padding-left: 15px;

    font-weight: 700;
}


/* =====================================================
   ARTICLE TEMPLATE
   ===================================================== */

.ejp-template-content {
    padding: 25px 20px;

    text-align: center;

    background: #fcfaff;
}


.ejp-doc-icon {
    display: inline-flex;

    justify-content: center;
    align-items: center;

    width: 80px;
    height: 80px;

    margin-bottom: 15px;

    border-radius: 12px;

    background: linear-gradient(
        135deg,
        #6d287f,
        #a94fc0
    );

    color: #ffffff;

    font-size: 16px;

    font-weight: 700;

    box-shadow: 0 5px 15px rgba(91, 36, 115, 0.20);
}


.ejp-template-content p {
    margin: 0 0 20px;

    color: #625868;

    font-size: 14px;

    line-height: 1.7;
}


.ejp-download-button {
    display: inline-block;

    padding: 12px 22px;

    background: linear-gradient(
        135deg,
        #6d287f,
        #9342a8
    );

    color: #ffffff;

    text-decoration: none;

    border-radius: 7px;

    font-size: 13px;

    font-weight: 700;

    transition: all 0.3s ease;
}


.ejp-download-button:hover {
    background: linear-gradient(
        135deg,
        #522060,
        #762d8d
    );

    transform: translateY(-2px);

    color: #ffffff;
}


/* =====================================================
   CONTACT
   ===================================================== */

.ejp-contact-content {
    padding: 18px 20px;

    background: #fcfaff;
}


.ejp-contact-item {
    padding: 12px 0;

    border-bottom: 1px solid #eadfeb;
}


.ejp-contact-item:last-child {
    border-bottom: none;
}


.ejp-contact-item strong {
    display: block;

    margin-bottom: 5px;

    color: #702c86;

    font-size: 12px;

    text-transform: uppercase;

    letter-spacing: 0.7px;
}


.ejp-contact-item span {
    color: #514659;

    font-size: 14px;

    line-height: 1.6;
}


/* =====================================================
   RESPONSIVE
   ===================================================== */

@media (max-width: 768px) {

    .eudaimonia-sidebar {
        padding: 5px;
    }

    .ejp-sidebar-box {
        margin-bottom: 18px;
    }

    .ejp-sidebar-header {
        padding: 17px 18px;
        font-size: 17px;
    }

    .ejp-menu a {
        padding: 15px 18px;
        font-size: 16px;
    }

}