<?php
// phpcs:disable WordPress.NamingConventions.PrefixAllGlobals.NonPrefixedVariableFound -- Local template scope variables.
if ( ! defined( 'ABSPATH' ) ) {
    exit;
}

$this->render_page_header(
    __( 'nnax User Files - Design', 'nnax-frontend-user-files' ),
    __( 'Colors and visual standards for the file manager.', 'nnax-frontend-user-files' ),
    'design'
);
?>
<form method="post" action="options.php" class="nnaxadmin-form">
    <?php settings_fields( 'nnaxfuf_settings_group' ); ?>
    <?php
    $ui_defs         = NNAXFUF_Helpers::get_ui_color_definitions();
    $base_ui_defs    = array();
    $button_ui_defs  = array();

    foreach ( $ui_defs as $key => $def_row ) {
        if ( strpos( (string) $key, 'button_' ) === 0 ) {
            $button_ui_defs[ $key ] = $def_row;
            continue;
        }
        $base_ui_defs[ $key ] = $def_row;
    }
    ?>

    <div class="nnax-grid nnax-grid-2">
        <?php $this->render_card_start( __( 'UI Colors', 'nnax-frontend-user-files' ), __( 'Global colors for surfaces, text, and states.', 'nnax-frontend-user-files' ) ); ?>
            <?php
            foreach ( $base_ui_defs as $key => $def_row ) :
                $label = isset( $def_row['label'] ) ? (string) $def_row['label'] : $key;
                $saved = isset( $ui_colors[ $key ] ) ? sanitize_hex_color( (string) $ui_colors[ $key ] ) : false;
                $fallback = isset( $defaults['ui_colors'][ $key ] ) ? sanitize_hex_color( (string) $defaults['ui_colors'][ $key ] ) : false;
                $def = $fallback ?: '#000000';
                $val = $saved ?: $def;
                ?>
                <p style="margin: 0 0 10px;">
                    <label style="display:inline-block; width: 220px;"><?php echo esc_html( $label ); ?></label>
                    <input
                        type="text"
                        class="nnaxadmin-color-field"
                        name="<?php echo esc_attr( NNAXFUF_Plugin::OPTION_SETTINGS ); ?>[ui_colors][<?php echo esc_attr( $key ); ?>]"
                        value="<?php echo esc_attr( $val ); ?>"
                        data-default-color="<?php echo esc_attr( $def ); ?>"
                    />
                </p>
            <?php endforeach; ?>
        <?php $this->render_card_end(); ?>

        <?php $this->render_card_start( __( 'Button Colors', 'nnax-frontend-user-files' ), __( 'Colors for UIkit buttons (Default, Primary, Secondary, Danger).', 'nnax-frontend-user-files' ) ); ?>
            <?php foreach ( $button_ui_defs as $key => $def_row ) :
                $label = isset( $def_row['label'] ) ? (string) $def_row['label'] : $key;
                $saved = isset( $ui_colors[ $key ] ) ? sanitize_hex_color( (string) $ui_colors[ $key ] ) : false;
                $fallback = isset( $defaults['ui_colors'][ $key ] ) ? sanitize_hex_color( (string) $defaults['ui_colors'][ $key ] ) : false;
                $def = $fallback ?: '#000000';
                $val = $saved ?: $def;
                ?>
                <p style="margin: 0 0 10px;">
                    <label style="display:inline-block; width: 280px;"><?php echo esc_html( $label ); ?></label>
                    <input
                        type="text"
                        class="nnaxadmin-color-field"
                        name="<?php echo esc_attr( NNAXFUF_Plugin::OPTION_SETTINGS ); ?>[ui_colors][<?php echo esc_attr( $key ); ?>]"
                        value="<?php echo esc_attr( $val ); ?>"
                        data-default-color="<?php echo esc_attr( $def ); ?>"
                    />
                </p>
            <?php endforeach; ?>
        <?php $this->render_card_end(); ?>
        
        <?php $this->render_card_start( __( 'Badge Colors', 'nnax-frontend-user-files' ), __( 'Colors per file-type badge.', 'nnax-frontend-user-files' ) ); ?>
            <?php
            $badge_defs = NNAXFUF_Helpers::get_badge_color_definitions();
            foreach ( $badge_defs as $key => $def_row ) :
                $label = isset( $def_row['label'] ) ? (string) $def_row['label'] : $key;
                $saved = isset( $badge_colors[ $key ] ) ? sanitize_hex_color( (string) $badge_colors[ $key ] ) : false;
                $fallback = isset( $defaults['badge_colors'][ $key ] ) ? sanitize_hex_color( (string) $defaults['badge_colors'][ $key ] ) : false;
                $def = $fallback ?: '#000000';
                $val = $saved ?: $def;
                ?>
                <p style="margin: 0 0 10px;">
                    <label style="display:inline-block; width: 180px;"><?php echo esc_html( $label ); ?></label>
                    <input
                        type="text"
                        class="nnaxadmin-color-field"
                        name="<?php echo esc_attr( NNAXFUF_Plugin::OPTION_SETTINGS ); ?>[badge_colors][<?php echo esc_attr( $key ); ?>]"
                        value="<?php echo esc_attr( $val ); ?>"
                        data-default-color="<?php echo esc_attr( $def ); ?>"
                    />
                </p>
            <?php endforeach; ?>
        <?php $this->render_card_end(); ?>

    </div>

    <p class="nnax-row">
        <button type="button" id="nnaxadmin-reset-colors" class="nnax-btn nnax-btn--default nnax-btn--small">
            <?php esc_html_e( 'Reset all colors to default', 'nnax-frontend-user-files' ); ?>
        </button>
        <span class="description">
            <?php esc_html_e( 'Then click "Save changes".', 'nnax-frontend-user-files' ); ?>
        </span>
    </p>

    <p>
        <button type="submit" name="submit" class="nnax-btn nnax-btn--primary"><?php esc_html_e( 'Save changes', 'nnax-frontend-user-files' ); ?></button>
    </p>
</form>
<?php
$this->render_page_footer();
