<div class="refund-order-container zoom-anim-dialog mfp-hide dialog">
	<div ng-controller="OrderRefundCtrl" ng-show="refund">
		<h2 class="title left"><span>Refund Order #: {{order.id_order}}</span></h2>
		<div class="divider"></div>
		<form name="formRefund" novalidate>
			<ul ng-class="{'submitted':formRefundSubmitted}" class="ul-inputs">
				<li class="li-input" ng-class="{'error':formRefund.amount.$invalid}" ng-if="refund_amount">
					<div class="label">Amount to refund card:</div>
					<div class="input">
						<div class="input"><input step="any" type="number" name="amount" ng-model="refund.amount" min="0.01" max="{{amount_max}}" ng-disabled="order.campus_cash" ng-required="order.charged != '0.00'" ignore-mouse-wheel placeholder=""></div>
					</div>
					<div class="box-error">
						<small ng-show="formRefund.amount.$error.required">Required.</small>
						<small ng-show="formRefund.amount.$error.max">The amount to refund must be in range 0.01 to {{amount_max}}!</small>
					</div>
				</li>
				<li class="li-input" ng-class="{'error':formRefund.reason.$invalid}">
					<div class="label">Reason:</div>
					<div class="input">
						<select name="reason" required ng-model="refund.reason" ng-options="opt.value as opt.label for opt in reasons" ></select>
					</div>
					<div class="box-error">
						<small ng-show="formRefund.reason.$error.required">Required.</small>
					</div>
				</li>
				<li class="li-input" ng-class="{'error':formRefund.reasonOther.$invalid}" ng-show="refund.reason == 'Other'">
					<div class="label">Description:</div>
					<div class="input">
						<input type="text" maxlength="200" name="reasonOther" ng-required="refund.reason == 'Other'" ng-model="refund.reason_other"/>
					</div>
					<div class="box-error">
						<small ng-show="formRefund.reasonOther.$error.required">Required.</small>
					</div>
				</li>

				<li class="li-input divider-line">
					<label class="switch-wrap">
						<input type="checkbox" class="switch" ng-model="refund.cancel_order"/><div></div>
					</label>
					<div class="label">Hide this order from drivers (cancel order)</div>
				</li>

				<li ng-if="order.credit != '0.00'">
					<div class="label">
						Because a gift card was used for this order, we will refund the card ${{order.charged}} and refund ${{order.credit}} as a gift card on the account.
					</div>
				</li>

				<li class="li-input divider-line" ng-if="order.status.status == 'accepted' || order.status.status == 'pickedup' || order.status.status == 'transfered'">
					<label class="switch-wrap">
						<input type="checkbox" class="switch" ng-model="refund.tell_driver"/><div></div>
					</label>
					<div class="label">Tell driver not to deliver this canceled order?</div>
				</li>

				<li ng-if="refund.cancel_order">
					<div class="label">
						If more than 5 minutes has passed, make sure you have a good reason for doing so.
					</div>
				</li>

				<li class="li-input" ng-show="!isRefunding">
					<button class="button save" ng-click="refund_order();">Refund</button>
				</li>
				<li class="li-input" ng-show="isRefunding">
					<button class="button save"><i class="fa fa-spinner fa-spin"></i> Refunding </button>
				</li>
			</ul>
		</form>
	</div>
</div>