/* 模板样式 - 只控制颜色和背景，不控制字体 */
#cardView .template-1 { 
    background: white;
    color: #333333;
    width: 360px;
    height: 480px;
    box-sizing: border-box;
}

#cardView .template-1 .content {
    color: #333333;
    height: auto;
    max-height: 440px;
    overflow: hidden;
}

#cardView .template-1 p {
    color: #333333 !important;
    margin: 0.4em 0;
    line-height: 1.4;
    opacity: 1;
}

#cardView .template-1 h2 { 
    color: #ff4081;
    font-size: 1.5em;
    margin-bottom: 0.5em;
    border-bottom: 2px solid #ff94ab;
}

#cardView .template-1 .highlight {
    color: #1a73e8;
    background: rgba(26,115,232,0.1);
    padding: 0.2em 0.8em;
    border-radius: 20px;
}

/* 少女风 */
#cardView .template-2 { 
    background: linear-gradient(135deg, #fff0f4 0%, #fff 100%);
}

#cardView .template-2 h2 { 
    color: #ff1493; 
    font-size: 1.6em;
    margin-bottom: 0.6em;
}

#cardView .template-2 .highlight {
    color: #ff69b4;
    background: rgba(255,105,180,0.1);
    padding: 0.3em 1em;
    border-radius: 25px;
}

#cardView .template-2 p {
    color: #333;
    line-height: 1.6;
}

/* 商务风 */
#cardView .template-3 { 
    background: #f8f9fa;
}

#cardView .template-3 h2 { 
    color: #1a73e8;
    font-size: 1.4em;
    margin-bottom: 0.8em;
    border-bottom: 1px solid #dee2e6;
}

#cardView .template-3 .highlight {
    color: #202124;
    background: #f1f3f4;
    padding: 0.2em 0.6em;
    border-radius: 4px;
}

#cardView .template-3 p {
    color: #3c4043;
    line-height: 1.5;
}

/* 手账风 */
#cardView .template-4 {
    background: #fffbf0;
    background-image: url('data:image/svg+xml;utf8,<svg width="100" height="100" xmlns="http://www.w3.org/2000/svg"><rect width="100%" height="100%" fill="none" stroke="%23e6d9c0" stroke-width="1" stroke-dasharray="5,5"/></svg>');
}

#cardView .template-4 h2 { 
    color: #8e7c68;
    border-bottom: 2px dashed #d9c8a9;
}

#cardView .template-4 .highlight {
    background: rgba(217,200,169,0.3);
    color: #6b5b47;
    border-radius: 0;
    border-bottom: 1px dotted #8e7c68;
}

#cardView .template-4 p {
    color: #5c4033;
    line-height: 1.8;
}

/* 简约风 */
#cardView .template-5 {
    background: white;
}

#cardView .template-5 h2 { 
    color: #333;
    font-size: 1.5em;
    margin-bottom: 1em;
}

#cardView .template-5 .highlight {
    color: #666;
    background: #f5f5f5;
    padding: 0.2em 0.5em;
}

#cardView .template-5 p {
    color: #444;
    line-height: 1.6;
}

/* 杂志风 */
#cardView .template-6 {
    background: white;
    font-weight: 300;
    letter-spacing: 0.05em;
}

#cardView .template-6 h2 { 
    color: #000;
    font-size: 1.8em;
    margin-bottom: 1em;
    font-weight: 700;
}

#cardView .template-6 .highlight {
    color: #000;
    background: none;
    border-bottom: 2px solid #000;
    padding: 0.1em 0;
}

#cardView .template-6 p {
    color: #333;
    line-height: 1.7;
}

/* 复古风 */
#cardView .template-7 {
    background: #f9f3e9;
    background-image: url('data:image/svg+xml;utf8,<svg width="200" height="200" xmlns="http://www.w3.org/2000/svg"><rect width="100%" height="100%" fill="none" stroke="%23d9c8a9" stroke-width="0.5" stroke-opacity="0.3"/></svg>');
}

#cardView .template-7 h2 { 
    color: #8b4513;
    border-bottom: 1px solid #d2b48c;
    font-style: italic;
}

#cardView .template-7 .highlight {
    background: rgba(210,180,140,0.3);
    color: #8b4513;
    font-weight: normal;
    border-radius: 0;
    font-style: italic;
}

#cardView .template-7 p {
    color: #5c4033;
    line-height: 1.8;
}

/* 彩虹风 */
#cardView .template-8 {
    background: linear-gradient(135deg, #fde7f9 0%, #c8f7ff 50%, #d0ffbc 100%);
}

#cardView .template-8 h2 {
    color: #8a2be2;
    font-size: 1.5em;
    margin-bottom: 0.6em;
    border-bottom: 2px solid #ff69b4;
}

#cardView .template-8 .highlight {
    color: #ff4500;
    background: rgba(255, 255, 255, 0.6);
    padding: 0.3em 0.8em;
    border-radius: 20px;
    box-shadow: 0 2px 5px rgba(0,0,0,0.1);
}

#cardView .template-8 p {
    color: #333;
    line-height: 1.6;
}

/* 暗黑风 */
#cardView .template-9 {
    background: #121212;
    color: #e0e0e0;
}

#cardView .template-9 h2 {
    color: #bb86fc;
    font-size: 1.5em;
    margin-bottom: 0.7em;
    border-bottom: 1px solid #3d3d3d;
}

#cardView .template-9 .highlight {
    color: #03dac6;
    background: rgba(3, 218, 198, 0.1);
    padding: 0.3em 0.8em;
    border-radius: 4px;
}

#cardView .template-9 p {
    color: #b0b0b0;
    line-height: 1.6;
}

/* 森系风 */
#cardView .template-10 {
    background: #f8f9f3;
    background-image: url('data:image/svg+xml;utf8,<svg width="20" height="20" xmlns="http://www.w3.org/2000/svg"><circle cx="10" cy="10" r="1" fill="%23a5d6a7" fill-opacity="0.3"/></svg>');
}

#cardView .template-10 h2 {
    color: #2e7d32;
    font-size: 1.5em;
    margin-bottom: 0.7em;
    border-bottom: 1px solid #a5d6a7;
}

#cardView .template-10 .highlight {
    color: #1b5e20;
    background: rgba(165, 214, 167, 0.3);
    padding: 0.3em 0.8em;
    border-radius: 20px;
}

#cardView .template-10 p {
    color: #33691e;
    line-height: 1.7;
}

/* 水蜜桃风 */
#cardView .template-11 {
    background: linear-gradient(135deg, #fff5f5 0%, #ffe5e5 100%);
}

#cardView .template-11 h2 {
    color: #ff7e7e;
    font-size: 1.5em;
    margin-bottom: 0.6em;
    border-bottom: 2px dotted #ffb6b6;
}

#cardView .template-11 .highlight {
    color: #e06377;
    background: rgba(255, 182, 182, 0.3);
    padding: 0.3em 0.8em;
    border-radius: 30px;
}

#cardView .template-11 p {
    color: #5a5a5a;
    line-height: 1.6;
}

/* 都市风 */
#cardView .template-12 {
    background: #f5f5f5;
    background-image: url('data:image/svg+xml;utf8,<svg width="30" height="30" xmlns="http://www.w3.org/2000/svg"><rect x="0" y="0" width="30" height="30" fill="none" stroke="%23e0e0e0" stroke-width="1"/></svg>');
}

#cardView .template-12 h2 {
    color: #424242;
    font-size: 1.6em;
    margin-bottom: 0.8em;
    border-bottom: 2px solid #9e9e9e;
    text-transform: uppercase;
    letter-spacing: 1px;
}

#cardView .template-12 .highlight {
    color: #212121;
    background: #e0e0e0;
    padding: 0.2em 0.6em;
    border-radius: 0;
}

#cardView .template-12 p {
    color: #616161;
    line-height: 1.5;
}

/* 戏剧风 */
#cardView .template-13 {
    background: #f9f2e7;
    border: 8px solid #8d6e63;
}

#cardView .template-13 h2 {
    color: #6d4c41;
    font-size: 1.8em;
    margin-bottom: 0.6em;
    text-align: center;
    font-style: italic;
}

#cardView .template-13 .highlight {
    color: #4e342e;
    background: rgba(141, 110, 99, 0.2);
    padding: 0.3em 0.8em;
    border-radius: 0;
    font-style: italic;
    text-align: center;
    display: block;
    margin: 0.8em auto;
}

#cardView .template-13 p {
    color: #5d4037;
    line-height: 1.7;
    text-align: justify;
}

/* 海洋风 */
#cardView .template-14 {
    background: linear-gradient(135deg, #e3f2fd 0%, #bbdefb 100%);
}

#cardView .template-14 h2 {
    color: #0277bd;
    font-size: 1.5em;
    margin-bottom: 0.7em;
    border-bottom: 2px solid #64b5f6;
}

#cardView .template-14 .highlight {
    color: #01579b;
    background: rgba(100, 181, 246, 0.3);
    padding: 0.3em 0.8em;
    border-radius: 8px;
}

#cardView .template-14 p {
    color: #0d47a1;
    line-height: 1.6;
}

/* 甜点风 */
#cardView .template-15 {
    background: linear-gradient(135deg, #fff8e1 0%, #ffecb3 100%);
}

#cardView .template-15 h2 {
    color: #ff6f00;
    font-size: 1.6em;
    margin-bottom: 0.7em;
    border-bottom: 2px dashed #ffb74d;
}

#cardView .template-15 .highlight {
    color: #f57c00;
    background: rgba(255, 183, 77, 0.3);
    padding: 0.3em 0.8em;
    border-radius: 15px;
}

#cardView .template-15 p {
    color: #795548;
    line-height: 1.6;
}

/* 科技风 */
#cardView .template-16 {
    background: #1a1a1a;
    color: #00ff00;
    text-shadow: 0 0 5px rgba(0, 255, 0, 0.5);
}

#cardView .template-16 h2 {
    color: #00ff00;
    font-size: 1.5em;
    margin-bottom: 0.7em;
    border-bottom: 1px solid #00ff00;
    text-transform: uppercase;
}

#cardView .template-16 .highlight {
    color: #ffffff;
    background: rgba(0, 255, 0, 0.1);
    padding: 0.3em 0.8em;
    border: 1px solid #00ff00;
    border-radius: 0;
}

#cardView .template-16 p {
    color: #00cc00;
    line-height: 1.5;
}

/* 水墨风 */
#cardView .template-17 {
    background: #f5f5f5;
    background-image: url('data:image/svg+xml;utf8,<svg width="100" height="100" xmlns="http://www.w3.org/2000/svg"><path d="M20,50 Q50,20 80,50 T140,50" stroke="%23000000" stroke-width="1" fill="none" stroke-opacity="0.1"/></svg>');
}

#cardView .template-17 h2 {
    color: #000000;
    font-size: 1.8em;
    margin-bottom: 0.8em;
    border-bottom: 2px solid #000000;
    letter-spacing: 0.1em;
}

#cardView .template-17 .highlight {
    color: #000000;
    background: rgba(0, 0, 0, 0.05);
    padding: 0.3em 0.8em;
    border-left: 3px solid #000000;
    border-radius: 0;
}

#cardView .template-17 p {
    color: #333333;
    line-height: 1.8;
    letter-spacing: 0.05em;
}