<?php
use yii\helpers\Html;
use yii\widgets\ActiveForm;

$this->title = 'Регистрация курьера';
?>
<div class="md-login-container d-flex justify-content-center align-items-start py-5 min-vh-100">
    <div class="md-login-card bg-white p-4 shadow rounded my-4" style="max-width: 400px; width: 100%;">
        <h2 class="md-login-title text-center mb-4"><?= Html::encode($this->title) ?></h2>
        
        <?php $form = ActiveForm::begin([
            'id' => 'courier-register-form',
            'enableClientValidation' => true,
            'options' => [
                'class' => 'needs-validation',
                'enctype' => 'multipart/form-data'
            ],
        ]); ?>

        <div class="row mb-3">
            <div class="col-md-12 mb-3">
                <?= $form->field($model, 'auto')->textInput([
                    'class' => 'form-control profile-input',
                    'maxlength' => 20,
                    'style' => 'font-size: 14px; border: 1px solid var(--input-border, rgba(224, 224, 224, 0.56)); border-radius: 8px; padding: 10px 12px; background-color: var(--input-bg, rgba(248, 249, 250, 0.25)); color: var(--text-primary, #000000);',
                    'onfocus' => "this.style.borderColor='#588157'; this.style.boxShadow='0 0 0 2px rgba(88, 129, 87, 0.2)';",
                    'onblur' => "this.style.borderColor='var(--input-border, rgba(224, 224, 224, 0.56))'; this.style.boxShadow='none';"
                ]) ?>
            </div>
            
            <div class="col-md-12 mb-3">
                <?= $form->field($model, 'auto_number')->textInput([
                    'class' => 'form-control profile-input',
                    'maxlength' => 6,
                    'style' => 'font-size: 14px; border: 1px solid var(--input-border, rgba(224, 224, 224, 0.56)); border-radius: 8px; padding: 10px 12px; background-color: var(--input-bg, rgba(248, 249, 250, 0.25)); color: var(--text-primary, #000000);',
                    'onfocus' => "this.style.borderColor='#588157'; this.style.boxShadow='0 0 0 2px rgba(88, 129, 87, 0.2)';",
                    'onblur' => "this.style.borderColor='var(--input-border, rgba(224, 224, 224, 0.56))'; this.style.boxShadow='none';"
                ]) ?>
            </div>
            <div class="col-md-12 mb-3">
                <?= $form->field($model, 'phone')->widget(\yii\widgets\MaskedInput::class, [
                    'mask' => '+7 (999) 999-99-99',
                    'options' => [
                        'class' => 'form-control profile-input',
                        'style' => 'font-size: 14px; border: 1px solid var(--input-border, rgba(224, 224, 224, 0.56)); border-radius: 8px; padding: 10px 12px; background-color: var(--input-bg, rgba(248, 249, 250, 0.25)); color: var(--text-primary, #000000);',
                        'onfocus' => "this.style.borderColor='#588157'; this.style.boxShadow='0 0 0 2px rgba(88, 129, 87, 0.2)';",
                        'onblur' => "this.style.borderColor='var(--input-border, rgba(224, 224, 224, 0.56))'; this.style.boxShadow='none';"
                    ]
                ]) ?>
            </div>
        </div>

        <div class="mb-3">
            <?= $form->field($model, 'passport')->fileInput([
                'class' => 'form-control profile-input',
                'style' => 'font-size: 14px; border: 1px solid var(--input-border, rgba(224, 224, 224, 0.56)); border-radius: 8px; padding: 10px 12px; background-color: var(--input-bg, rgba(248, 249, 250, 0.25)); color: var(--text-primary, #000000);',
                'onfocus' => "this.style.borderColor='#588157'; this.style.boxShadow='0 0 0 2px rgba(88, 129, 87, 0.2)';",
                'onblur' => "this.style.borderColor='var(--input-border, rgba(224, 224, 224, 0.56))'; this.style.boxShadow='none';"
            ]) ?>

        </div>

        <div class="mb-4">
            <?= $form->field($model, 'driver_license')->fileInput([
                'class' => 'form-control profile-input',
                'style' => 'font-size: 14px; border: 1px solid var(--input-border, rgba(224, 224, 224, 0.56)); border-radius: 8px; padding: 10px 12px; background-color: var(--input-bg, rgba(248, 249, 250, 0.25)); color: var(--text-primary, #000000);',
                'onfocus' => "this.style.borderColor='#588157'; this.style.boxShadow='0 0 0 2px rgba(88, 129, 87, 0.2)';",
                'onblur' => "this.style.borderColor='var(--input-border, rgba(224, 224, 224, 0.56))'; this.style.boxShadow='none';"
            ]) ?>
        </div>

        <div class="d-flex justify-content-center align-items-center text-center">
            <button type="submit" 
                    class="btn"
                    style="font-size: 14px; text-transform: none; background-color: #588157; color: white; border: none; border-radius: 8px; padding: 10px 24px; min-width: 200px; width: 100%;"
                    onmouseover="this.style.backgroundColor='rgb(53, 126, 52)'"
                    onmouseout="this.style.backgroundColor='#588157'">
                Зарегистрироваться как курьер
            </button>
        </div>
        
        <?php ActiveForm::end(); ?>
    </div>
</div>