/**
 * Text Simple Module Styles
 * =========================================
 * Consistent with login/registration/account modules
 * Uses CSS variables from defaults.css
 */

/* Text Simple Module Background */
.text-simple-module {
    font-family: var(--ion-font-family-base, 'Quicksand', sans-serif);
}

/* Content styling for better readability */
.text-simple-content .text-simple__content {
    font-size: 1.1rem;
    line-height: 1.7;
}

.text-simple-content .text-simple__content h1,
.text-simple-content .text-simple__content h2,
.text-simple-content .text-simple__content h3,
.text-simple-content .text-simple__content h4,
.text-simple-content .text-simple__content h5,
.text-simple-content .text-simple__content h6 {
    color: var(--ion-color-brand, #56035F);
    margin-bottom: 1rem;
    font-weight: 600;
}

.text-simple-content .text-simple__content p {
    margin-bottom: 1rem;
}

.text-simple-content .text-simple__content ul,
.text-simple-content .text-simple__content ol {
    margin-bottom: 1rem;
    padding-left: 1.5rem;
}

.text-simple-content .text-simple__content blockquote {
    border-left: 4px solid var(--ion-color-brand, #56035F);
    padding-left: 1rem;
    margin: 1.5rem 0;
    font-style: italic;
    color: var(--bs-gray-600);
}

/* Brand gradient background option */
.bg-gradient-brand {
    background: linear-gradient(135deg,
        var(--ion-color-brand, #56035F) 0%,
        #7a1a7e 50%,
        var(--ion-color-brand, #56035F) 100%);
    color: white !important;
}

.bg-gradient-brand .text-simple__content h1,
.bg-gradient-brand .text-simple__content h2,
.bg-gradient-brand .text-simple__content h3,
.bg-gradient-brand .text-simple__content h4,
.bg-gradient-brand .text-simple__content h5,
.bg-gradient-brand .text-simple__content h6 {
    color: white !important;
}

.bg-gradient-brand .text-simple__content {
    color: rgba(255, 255, 255, 0.9);
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .text-simple-content {
        padding: 2rem 1.5rem !important;
    }

    .text-simple-content .text-simple__content {
        font-size: 1rem;
    }
}