/* Family & Home Section CSS */
/* Note: Shared section styles (page header, tabs, content sections, boxes, grids) are in styles.css */

.family-home-theme {
    background: linear-gradient(135deg, rgba(109, 205, 59, 1) 0%, rgba(109, 205, 59, 0.7) 100%);
}

/* Family-home-specific tab active color */
.tabs .tab-active {
    color: rgba(109, 205, 59, 1);
    border-bottom-color: rgba(109, 205, 59, 1);
    opacity: 1;
}

html.dark-mode .tabs .tab-active {
    color: rgba(109, 205, 59, 1);
    border-bottom-color: rgba(109, 205, 59, 1);
}

/* Family-home green theme color overrides */
.content-section h3 {
    border-left: 4px solid rgba(109, 205, 59, 1);
}

.content-section ul li:before {
    content: "▸";
    color: rgba(109, 205, 59, 1);
}

.content-section ol li:before {
    background: rgba(109, 205, 59, 1);
}

.subsection {
    border-left: 4px solid rgba(109, 205, 59, 1);
}

/* Family-home color overrides for boxes */
.highlight-box {
    background: rgba(109, 205, 59, 0.05);
    border-left: 4px solid rgba(109, 205, 59, 1);
}

html.dark-mode .highlight-box {
    background: rgba(109, 205, 59, 0.1);
}

.highlight-box ul li:before {
    color: rgba(109, 205, 59, 1);
}

.warning-box {
    background: rgba(247, 117, 18, 0.05);
    border-left: 4px solid rgba(247, 117, 18, 1);
}

html.dark-mode .warning-box {
    background: rgba(247, 117, 18, 0.1);
}

.warning-box ul li:before {
    content: "⚠";
    color: rgba(247, 117, 18, 1);
}

/* Family-home content card color overrides */
.content-card {
    border-top: 4px solid rgba(109, 205, 59, 1);
}

.content-card:hover {
    box-shadow: 0 4px 12px rgba(109, 205, 59, 0.15);
}

html.dark-mode .content-card:hover {
    box-shadow: 0 4px 12px rgba(109, 205, 59, 0.15);
}

.card-link {
    color: rgba(109, 205, 59, 1);
}

html.dark-mode .card-link {
    color: rgba(109, 205, 59, 1);
}

.card-link:hover {
    color: rgba(247, 117, 18, 1);
}

/* Family-home key takeaways color override */
.key-takeaways {
    background: rgba(109, 205, 59, 0.05);
    border: 2px solid rgba(109, 205, 59, 1);
}

html.dark-mode .key-takeaways {
    background: rgba(109, 205, 59, 0.1);
}

.key-takeaways h3 {
    color: rgba(109, 205, 59, 1);
    border-left: 4px solid rgba(109, 205, 59, 1);
}

.key-takeaways ul li:before {
    color: rgba(109, 205, 59, 1);
}

/* Family-home responsive overrides - minimal, most responsive styles are in styles.css */