.c-callout {
    background-color: #fff; /* Light blue background */
    border: 1px solid #ddd;
    border-left: 4px solid transparent; /* Left blue border */
    border-radius: 8px;
    color: #055160; /* Darker blue text */
    padding: 15px;
    width: 100%;
}

.c-callout-primary {
    border-left: 4px solid var(--color-primary);
}

.c-callout-secondary {
    border-left: 4px solid var(--color-secondary);
}

.c-callout-success {
    border-left: 4px solid var(--color-success);
}

.c-callout-danger {
    border-left: 4px solid var(--color-danger);
}

.c-callout-info {
    border-left: 4px solid var(--color-info);
}

.c-callout-warning {
    border-left: 4px solid var(--color-warning);
}

.c-callout-light {
    border-left: 4px solid var(--color-light);
}

.c-callout-dark {
    border-left: 4px solid var(--color-dark);
}