/* Deepskyastrophoto – Flex-Spalten Komfortfunktionen, Version 0.29.0 */

/*
 * Horizontale Ausrichtung für Bilder und typische kompakte Elemente.
 * Text bleibt davon unberührt; dafür dient die eigene Textausrichtung der Spalte.
 */
.dsa-flex-column.dsa-content-align-left :where(.wp-block-image, .wp-block-buttons) {
    margin-left: 0 !important;
    margin-right: auto !important;
}
.dsa-flex-column.dsa-content-align-center :where(.wp-block-image, .wp-block-buttons) {
    margin-left: auto !important;
    margin-right: auto !important;
}
.dsa-flex-column.dsa-content-align-right :where(.wp-block-image, .wp-block-buttons) {
    margin-left: auto !important;
    margin-right: 0 !important;
}

/* Standardmäßig respektiert 0.29.0 weiterhin die individuelle WordPress-Bildbreite. */
.dsa-flex-column.dsa-image-width-fill .wp-block-image {
    width: 100% !important;
    max-width: 100% !important;
}
.dsa-flex-column.dsa-image-width-fill .wp-block-image img {
    display: block;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
}

/*
 * Responsive bis Maximalbreite: füllt auf kleinen Geräten den verfügbaren Platz,
 * wächst aber auf größeren Spalten nicht über die gewählte Maximalbreite hinaus.
 */
.dsa-flex-column.dsa-image-width-max .wp-block-image {
    width: min(100%, var(--dsa-flex-image-max, 360px)) !important;
    max-width: 100% !important;
}
.dsa-flex-column.dsa-image-width-max .wp-block-image img {
    display: block;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
}

/* Textausrichtung der Spalte muss auch bei Core-Blöcken greifen, die eigene Regeln mitbringen. */
.dsa-flex-column[style*="--dsa-text-align"] :where(p, li, h1, h2, h3, h4, h5, h6) {
    text-align: var(--dsa-text-align, inherit) !important;
}
