/* ============================================
   Echo Memo - Custom Styles
   ============================================ */

/* --------------------------------------------
   Global Styles (from baseof.html)
   -------------------------------------------- */

body {
    display: flex;
    min-height: 100vh;
    flex-direction: column;
    background-color: #f5f7fa;
    /* Optimized for Chinese reading */
    font-family: -apple-system, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Heiti SC", "WenQuanYi Micro Hei", sans-serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* Better spacing for Chinese text */
.content {
    line-height: 1.8;
}

.main-content {
    flex: 1;
}

.footer {
    padding: 3rem 1.5rem 3rem;
}

/* --------------------------------------------
   Utility Classes
   -------------------------------------------- */

.decoration-none {
    text-decoration: none !important;
}

/* Height utility - used in index.html */
.h-100 {
    height: 100%;
}

/* --------------------------------------------
   Interactive Effects - Homepage (index.html)
   -------------------------------------------- */

.box:hover {
    transform: translateY(-5px);
    box-shadow: 0 15px 30px rgba(0, 0, 0, 0.1) !important;
}

/* --------------------------------------------
   Interactive Effects - Books (books/list.html)
   -------------------------------------------- */

.card:hover {
    transform: translateY(-8px);
    box-shadow: 0 12px 24px rgba(0, 0, 0, 0.1) !important;
    cursor: pointer;
}

/* --------------------------------------------
   Interactive Effects - Posts (posts/list.html)
   -------------------------------------------- */

.media:hover {
    background-color: #f9fafb !important;
    cursor: pointer;
}

article.media:not(:first-child) {
    border-top: 1px solid #f5f5f5;
}

/* --------------------------------------------
   Component Styles - Table of Contents (books/single.html)
   -------------------------------------------- */

/* Slight tweak to make TOC cleaner if needed */
.menu-list ul {
    border-left: 2px solid #f5f5f5;
    margin-left: 0.5rem;
    padding-left: 0.5rem;
}

.menu-list li {
    list-style: none;
}

.menu-list a.active {
    border-left-color: #3273dc;
    color: #3273dc;
}