/**
 * Shadow DOM Styles
 * 
 * Base styles for the module container, placeholders, and module elements.
 * Edit-mode styles removed — layout editing handled by VPS admin panel.
 */

/* Module container */
.module-container {
    position: relative !important;
    width: 100% !important;
    height: 100vh !important;
    min-height: 100vh !important;
    overflow: hidden !important;
    background: linear-gradient(135deg, var(--color-background, #1a1a1a) 0%, var(--color-module-header, #333) 100%) !important;
}

/* Module placeholder (replaced by custom elements via module-manager) */
.module-placeholder {
    position: absolute !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
    border-radius: 0 !important;
    background-color: rgba(0, 0, 0, 0.2);
}

/* Module (custom element after initialization) */
.module {
    position: absolute !important;
    border-radius: 0 !important;
    overflow: hidden !important;
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1) !important;
}

/* Ensure proper stacking for modules */
.module-container .module {
    position: absolute !important;
    transform-style: preserve-3d !important;
    backface-visibility: hidden !important;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .module-container {
        min-height: 100vh;
    }
}