/**
* Integration Example: Using Modern Select in PHP
* =================================================
*
* STEP 1: Include CSS and JS in your PHP file (before or in header)
* -------------------------------------------------------------------------
*
*
*
*
*
* STEP 2: Add data-select="true" to your elements
* ----------------------------------------------------------
*
*
* Choose a role
* School Head
* SBM Coordinator
* Teacher
*
*
*
* STEP 3: That's it! The JS auto-initializes on page load.
* ---------------------------------------------------------
*
*
* ================================================
* CUSTOMIZATION OPTIONS
* ================================================
*
* Size variants:
* data-size="sm" - Small (28px height)
* data-size="md" - Medium (36px height) [default]
* data-size="lg" - Large (40px height)
*
* Placeholder text:
* data-placeholder="Select your option"
*
* Full width:
* data-full-width="true"
*
* Disabled state:
* Just add the disabled attribute to native select
* ...
*
*
* ================================================
* EXAMPLE: Converting existing selects
* ================================================
*
* BEFORE:
*
* School Head
* Teacher
*
*
* AFTER:
*
* Select role
* School Head
* Teacher
*
*
*
* ================================================
* OPTGROUP SUPPORT
* ================================================
*
*
*
* Option A
* Option B
*
*
* Option C
*
*
*
*
* ================================================
* FORM SUBMISSION NOTE
* ================================================
*
* The native element is kept in DOM but hidden.
* It will submit its value normally as part of any form.
* No additional hidden input handling needed!
*
*/