/**
 * Panel Layout Fixes
 *
 * Critical fixes for panel padding and width constraints.
 * Loaded last to override all other styles.
 *
 * @package FluidFontForge
 * @version 5.1.0
 */

/* ==========================================================================
   PANEL PADDING FIX
   ========================================================================== */

/**
 * Settings and Data Table Panels - Internal Padding
 *
 * Ensures content doesn't touch the panel borders.
 */
#sizes-table-container,
.fff-panel[style*="margin-bottom: 8px"] {
    padding: 24px !important;
}

/* All fff-panel divs get padding */
.fff-panel {
    padding: 24px !important;
    box-sizing: border-box !important;
}

/* ==========================================================================
   SAMPLE TEXT AND FONT SCALE WIDTH FIX
   ========================================================================== */

/**
 * Sample Text and Font Scale - Constrained Width
 *
 * Uses max-width with margins for proper alignment without forcing fixed width.
 */
.fff-preview-enhanced {
    max-width: 1280px !important;
    margin: 20px !important;
    box-sizing: border-box !important;
}

/* Inner content should not exceed panel width */
.fff-preview-enhanced > * {
    max-width: 100% !important;
    box-sizing: border-box !important;
}

/* Ultra-specific selectors for Settings and Data panels */
.fff-main-grid > div > .fff-panel,
div.fff-panel[style*="margin-bottom: 8px"],
div#sizes-table-container.fff-panel {
    padding: 24px !important;
}

/* Remove any conflicting padding rules on children */
.fff-panel > h2:first-child {
    margin-top: 0 !important;
}

.fff-panel > div:first-of-type {
    margin-top: 0 !important;
}

/* Nuclear option - inline attribute selector */
div[class="fff-panel"],
div.fff-panel.fff-panel,
.fff-panel.fff-panel.fff-panel {
    padding: 24px !important;
    padding-top: 24px !important;
    padding-right: 24px !important;
    padding-bottom: 24px !important;
    padding-left: 24px !important;
}

/* Add left margin to panels outside the grid to match grid padding */
.fff-panel:not(.fff-main-grid .fff-panel) {
    margin-left: 24px !important;
}

/* ==========================================================================
   ALL INFO TOGGLE SECTIONS - WIDTH AND ALIGNMENT
   ========================================================================== */

/**
 * Base Rules - All panels using .fff-info-toggle-section (brown headers)
 *
 * DEFAULT: All panels constrained by max-width
 * This allows proper alignment without forcing fixed widths.
 */
.fff-info-toggle-section {
    max-width: 1280px !important;
    box-sizing: border-box !important;
}

/* Inner content should not exceed panel width */
.fff-info-toggle-section > * {
    max-width: 100% !important;
    box-sizing: border-box !important;
}

/**
 * REMOVED: LEFT-ALIGNED Panels override
 *
 * All panels now use consistent 20px margins (set in base rule above).
 * This ensures proper alignment without forcing specific left/right margin combinations.
 */