@extends('admin.layout')
@section('content')
<style type="text/css">
   .modal-body {
   padding: 10px;
   text-align: center;
   }
   .modal .modal-dialog .modal-content{
    padding: 0px;
   }
   .modal .modal-dialog .modal-content .modal-header {
    background-color: #7460ee;
}
   .modal-footer {
    background-color: #fff;
    }
   .modal-footer .btn-primary:hover{
   background: transparent;
   border-color: transparent;
   }
   .dropdown-toggle::after{
   display: none;
   }
   .modal-body {
   font-size: 16px;
    padding: 25px;
   }
   .modal-content {
   min-height: auto;
   }
   .modal-title {
   padding-left: 0;
   color:#fff !important;
   }
   .modal-body p {
   margin-bottom: 0;
   font-size: 24px;
   font-weight: 600;
   }
   .ecom-btn-border1{
   min-width: 125px;
   padding: 3px 9px;
   }
   .bg-beauty-green{
   background: #4CAF50 !important;
   }
   .container-custom01, .container-custome02{
   max-width: 1900px;
   width: 100%;
   padding-left: 2%;
   padding-right: 2%;
   }
   .container-custome02 {
   margin-top: 30px;
   }
   .content-wrapper.close-wrapper {
   margin-left: 300px!important;
   }
   .content-wrapper {
   margin-left: 0px!important;
   }
   .sidenav {
   width: 0px;
   }
   table thead tr th{
   color: #fff !important;
   }
   table thead tr {
   background-color: #7460ee;
   }
   img.gene {
   width: 30px;
   }
   .summytable{
   white-space: nowrap;
   }
   .table thead th {
   vertical-align: middle;
   }
   .retail label, .retail input {
   margin: 0px 5px;
   }
   .retail {
   margin-bottom: 25px;
   }
  .inl {
    margin-bottom: 30px;
   }
 
   .cen_me thead tr th {
   text-align: left !important;
   }
   .total p {
   display: inline-block;
   width: 155px;
   }
   .ymd tbody tr td:last-child {
   text-align: center !important;
   }
   .aut_cus .form-group label {
    margin-right: 27px;
}
.aut_cus .form-group {
    margin-bottom: 15px;
}
.inl a i {
    color: #7460ee;
}
.inl a {
    padding: 8px 10px;
    background-color: #f1f0f0;
    color: #000;
    box-shadow: 1px 1px 4px gainsboro;
}

.aut_cus {
    text-align: left;
}
</style>
<div class="content-wrapper">
   <!-- Main content -->
   <section class="content">
      <!-- Info boxes --> 
      <!-- /.row -->
      <div class="container-custom01">
         <div class="row">

            <div class="col-md-12">
               <div class="row">
                  <div class="col-xs-12">
                     <div class="alert alert-success alert-dismissible" role="alert">
                        <button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                     </div>
                  </div>
               </div>
               <style type="text/css">
                 .msgSuccess{color:green;}
                 .msgAlert{color:red;}
               </style>
                 
                  <div class="col-md-8 inl">
                     <a href="#" data-toggle="modal" data-target="#myModal"><i class="fa fa-plus" aria-hidden="true"></i>  Create Role</a>  
                  </div>   

                      @if ($errors)
                      <div class="alert alert-danger">
                          <ul>
                              @foreach ($errors->all() as $error)
                                  <li>{{ $error }}</li>
                              @endforeach
                            </ul>
                        </div>
                    @endif   

                   @if(Session::has('success'))      
                       <div class="alert alert-success">
                          <ul>
                                  <li> {{ Session::get('success') }} </li>                             
                            </ul>
                        </div>
                        
                    @endif
                    @if(Session::has('error'))
      
                       <div class="alert alert-alert">
                          <ul>
                                  <li> {{ Session::get('error') }} </li>                             
                            </ul>
                        </div>
                        
                    @endif
                                    
                  <!-- <div class="msgSuccess">
                          <i class="icon fa fa-check"></i>
                      </div>
                      <div class="msgAlert">
                         <i class="icon fa fa-ban"></i>  
                      </div> -->