/* 변수 선언 */


/* layout */

.essay-header{

    display:grid;

    grid-template-columns:
        minmax(0, 1fr)
        240px;

    gap:1.5rem;


}

.essay-calendar {

    display:grid;
    align-content: start;
    gap:0.5rem;

    padding: 1rem;

    border: 1px solid #dfe3e8;
    border-radius: 8px;

    font-size: 0.85rem;

}

.essay-meta {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}

article.content .essay-meta h2::before {
    content: none;
}


.essay-body {

    margin-top: 2rem;

}

/* calendar 세부 */

.essay-calendar-header{

    display:flex;
    justify-content:center;

    gap:.5rem;

    align-items:center;

}

.essay-calendar-header select{

    padding:4px 6px;
}

.essay-calendar-weekdays,
.essay-calendar-grid{

    list-style:none;

    margin:0;

    padding:0;

}

.essay-calendar-weekdays{

    display:grid;

    grid-template-columns:repeat(7,1fr);

    list-style:none;

    margin:0;

    padding:0;

}

.essay-calendar-weekdays li{

    display:flex;

    justify-content:center;

    align-items:center;

    font-size:.8rem;

    font-weight:600;

    color:#666;

}

.essay-calendar-weekdays li:first-child {
    color: var(--red);
}

.essay-calendar-weekdays li:last-child {
    color: var(--blue);
}

.essay-calendar-grid{

    width: 100%;
    min-width: 0;

    align-self: start;
    
    display:grid;

    grid-template-columns:repeat(7,1fr);

    gap:0;

    list-style:none;

    margin:0;

    padding:0;

}

.essay-calendar-cell {
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: .3rem;
}

.essay-calendar-cell a{

    width:100%;

    height:100%;

    display:flex;

    justify-content:center;

    align-items:center;

    text-decoration:none;

    color:inherit;

    border-radius:inherit;

}

.essay-calendar-cell.has-post a:hover{

    background:#f2f2f2;;

}

.essay-calendar-cell.saturday {
    color: var(--blue);
}

.essay-calendar-cell.sunday,
.essay-calendar-cell.holiday {
    color: var(--red);
}

.essay-calendar-cell.selected{

    background: var(--blue);
    color: var(--void);
    font-weight: 600;
}

.essay-calendar-cell.has-post a {
    font-weight: 600;
    text-decoration: underline;
    text-decoration-color: var(--red);
    text-decoration-thickness: 2px;
    text-underline-offset: 2px;
}

.essay-calendar-cell.has-post:hover {
    background: #eee;
}

.essay-calendar-cell.current {
    outline: 2px solid var(--yellow);
}

.essay-calendar-cell.selected a{

    color:#fff;

}

/* typography */

.essay-title {

    margin: 0;

    font-size: 2rem;

    font-weight: 700;

    line-height: 1.3;

}

.essay-body {


    margin-inline: 1rem;
    border-left: 4px solid var(--blue);
    padding: 1rem 1.5rem;

}

.essay-body p:last-child {
    margin-bottom: 0;
}

/* metadata */

.essay-information {

    display: grid;

    grid-template-columns: auto 1fr;

    column-gap: 1rem;

    row-gap: .4rem;

    margin: 1rem 0 0;

    margin-top: 1.5rem;

    font-size: .95rem;

    line-height: 1.7;


}

.essay-information dt {

    color: #666;

    font-weight: 600;

}

.essay-information dd {

    margin: 0;

    color: #222;

}

.essay-information time {

    white-space: nowrap;

}


@media (max-width:768px){

.essay-header{

    display:block;

    }

.essay-calendar {

    margin-inline: 3rem;

}

.essay-body {

    margin-inline: 0;
    border-left: none;
    padding: 0;

}

}