/**
 * Markdown styling for setup guides
 * Using TINA3 Aqua theme colors for consistency
 */

.markdown-content {
    line-height: 1.3;
    color: #333333; /* @cfn2 - main font color */
    margin: 0.5em 2em;
    
    h1, h2 {
        border-bottom: 1px solid #cecece; /* @layout-general-border2-color */
        padding-bottom: 0.3em;
        color: #181f50; /* @button-bg-color - primary button color */
    }
    
    h1 {
        font-size: 2em;
    }
    
    h2 {
        font-size: 1.5em;
    }
    
    h3 {
        font-size: 1.25em;
        color: #181f50; /* @button-bg-color - primary button color */
    }
    
    h4 {
        font-size: 1em;
        color: #181f50; /* @button-bg-color - primary button color */
    }
    
    code {
        background-color: #eeedec; /* @cbg5 - light background */
        border-radius: 4px; /* @input-bd-radius */
        font-size: 85%;
        margin: 0;
        padding: 0.2em 0.4em;
        color: #333333; /* @cfn2 */
    }
    
    pre {
        background-color: #f2f3f7; /* @layout-general-bg-color */
        border-radius: 4px; /* @input-bd-radius */
        font-size: 85%;
        line-height: 1.45;
        overflow: auto;
        padding: 16px;
        border: 1px solid #cecece; /* @layout-general-border2-color */
        
        code {
            background-color: transparent;
            padding: 0;
        }
    }
    
    a {
        color: #181f50; /* @button-bg-color - primary button color */
        text-decoration: none;
        
        &:hover {
            text-decoration: underline;
            color: #52b8d0; /* @btNormal */
        }
    }
    
    ul, ol {
        padding-left: 2em;
    }
    
    blockquote {
        margin-left: 0;
        padding-left: 1em;
        color: #7f7f7f; /* @cfn1 - secondary font color */
        border-left: 0.25em solid #181f50; /* @button-bg-color - primary button color */
        background-color: #f2f3f7; /* @layout-general-bg-color */
        padding: 0.5em 1em;
        border-radius: 4px; /* @input-bd-radius */
    }
    
    table {
        border-collapse: collapse;
        width: 100%;
        margin: 1em 0;
        
        th {
            background-color: #181f50; /* @button-bg-color - primary button color */
            color: #ffffff; /* white text for contrast */
            border: 1px solid #cecece; /* @layout-general-border2-color */
            padding: 8px 13px;
        }
        
        td {
            border: 1px solid #e6e6e6; /* @ltrbd - table border */
            padding: 6px 13px;
            background-color: #ffffff; /* @ltrbg - table background */
        }
        
        tr:nth-child(2n) {
            background-color: #f2f3f7; /* @layout-general-bg-color */
        }
    }
    
    /* Additional styling for specific elements */
    strong {
        color: #181f50; /* @button-bg-color - primary button color */
    }
    
    hr {
        border: 0;
        height: 1px;
        background-color: #181f50; /* @button-bg-color - primary button color */
        margin: 1.5em 0;
    }
}
