/* ========================================
   TYPO3 Configurable Card - Core Utilities
   Base utilities and system classes
   ======================================== */

/* Icon size classes for consistent CSS-based icon sizing */
.icon-xs { font-size: 0.75rem; width: 0.75rem; height: 0.75rem; }
.icon-sm { font-size: 0.875rem; width: 0.875rem; height: 0.875rem; }
.icon-md { font-size: 1rem; width: 1rem; height: 1rem; }
.icon-lg { font-size: 1.25rem; width: 1.25rem; height: 1.25rem; }
.icon-xl { font-size: 1.5rem; width: 1.5rem; height: 1.5rem; }
.icon-2xl { font-size: 2rem; width: 2rem; height: 2rem; }
.icon-3xl { font-size: 2.5rem; width: 2.5rem; height: 2.5rem; }
.icon-4xl { font-size: 3rem; width: 3rem; height: 3rem; }
.icon-5xl { font-size: 4rem; width: 4rem; height: 4rem; }

/* Height classes for background image containers */
.h-200 { height: 200px; }
.h-300 { height: 300px; }
.h-400 { height: 400px; }
.h-500 { height: 500px; }
.h-600 { height: 600px; }
.h-auto { height: auto; }

/* Only direct parent container of configurable-card-container gets 100% height */
*:has(> .configurable-card-container) {
    height: 100%;
}

.configurable-card-container {
    display: block;
    width: 100%;
    height: 100%;
}