.wrapd{
 font-family:Arial, sans-serif;
}


/* ===========================
   BASE
=========================== */

body{
 background:#f2f2f2;
}

.wrapd{
 width:100%;
 margin:0;
 padding:0;
}

/* ===========================
   NAV
=========================== */

.driver-nav{
 background:#FF006C;
 overflow-x:auto;
 white-space:nowrap;
}

.driver-nav a{
 display:inline-block;
 color:#ffffff;
 padding:14px 14px;
 text-decoration:none;
 font-size:14px;
}

.driver-nav .active{
 background:#1D0792;
 border-bottom:3px solid #1D0792;
}

/* ===========================
   CONTENT
=========================== */

.content-area{
 padding:12px;
}

.card{
 background:#fff;
 padding:14px;
 border-radius:8px;
 margin-bottom:12px;
 box-shadow:0 1px 3px rgba(0,0,0,.1);
}

/* ===========================
   TABLE MOBILE VIEW
=========================== */

table{
 width:100%;
 border-collapse:collapse;
 background:#fff;
 font-size:14px;
}

th{display:none;}

tr{
 border-bottom:2px solid #1D0792;
 border-top:2px solid #1D0792;
 border-right:2px solid #FF006C;
 border-left:2px solid #FF006C;
}

td{
 display:block;
 padding:6px 8px;
 border:none;
}

td:before{
 font-weight:600;
 display:block;
 color:#555;
}

td:nth-child(1):before{content:"Order ID";}
td:nth-child(2):before{content:"Booking Service";}
td:nth-child(3):before{content:"Customer Name";}
td:nth-child(4):before{content:"Email";}
td:nth-child(5):before{content:"Address";}
td:nth-child(6):before{content:"Mobile";}
td:nth-child(7):before{content:"Order Amount";}
td:nth-child(8):before{content:"Booking Amount";}
td:nth-child(9):before{content:"Balance Amount";}

/* ===========================
   BUTTONS
=========================== */

.btn{
 padding:8px 12px;
 font-size:14px;
 border:none;
 color:#fff;
 border-radius:5px;
 margin:3px 2px;
}

.green{background:#27ae60}
.red{background:#c0392b}
.blue{background:#2271b1}

/* Reject Button */
.reject-btn{
 background:#e53935;
 color:#ffffff;
 border:none;
 padding:9px 15px;
 border-radius:4px;
 cursor:pointer;
 font-size:14px;
 margin-left:5px;
}
.reject-btn:hover{
 background:red;
}

/* ===========================
  ACCEPT/REJECT POPUP MODALS
=========================== */
/* Overlay */
.shashi-modal,
#rejectModal{
 display:none;
 position:fixed;
 inset:0;
 background:rgba(0,0,0,.6);
 z-index:9999;
 display:flex;
 align-items:center;
 justify-content:center;
}

/* Popup Box */
.shashi-modal-content,
#rejectModal .popup-box{
 background:#ffffff;
 width:350px;
 padding:25px;
 border-radius:8px;
 box-shadow:0 0 15px rgba(0,0,0,0.3);

 /* NEW BORDER */
 border:4px solid #1D0792;
}

/* Inputs */
input,select,textarea{
 width:100%;
 padding:8px;
 margin-bottom:10px;
 font-size:14px;
 border:1.5px solid #1D0792;
 color:solid black;
 border-radius:4px;
 outline:none;
}

/* Buttons Container */
.button-row{
 display:flex;
 justify-content:flex-end;
 gap:10px;
}

/* Submit Button */
.submit-btn{
 background:green;
 color:white;
 border:none;
 padding:8px 16px;
 border-radius:4px;
 cursor:pointer;
}
.submit-btn:hover{
 background:green;
}

/* Cancel Button */
.cancel-btn{
 background:red;
 color:white;
 border:none;
 padding:8px 16px;
 border-radius:4px;
 cursor:pointer;
}
.cancel-btn:hover{
 background:red;
}

/* Open Button */
.open-btn{
 padding:10px 18px;
 background:#1D0792;
 color:white;
 border:none;
 border-radius:4px;
 cursor:pointer;
}


/* IMPORTANT */

#rejectModal{
    display:none;               
    position:fixed;
    top:0;
    left:0;
    width:100%;
    height:100%;
    background:rgba(0,0,0,0.6);
    z-index:9999;
}

.popup-box{
    background:#fff;
    width:400px;
    padding:20px;
    border-radius:6px;
    position:absolute;
    top:50%;
    left:50%;
    transform:translate(-50%,-50%);
}

textarea{
    width:100%;
    height:120px;
}




/* ===========================
   DASHBOARD CARD
=========================== */

.driver-dashboard-card{
 border:2px solid #1D0792;
 padding:15px;
 border-radius:8px;
 background:#fff;
 max-width:520px;
}

.driver-dashboard-card p{
 margin:8px 0;
 padding:6px 0;
 border-bottom:1px dashed #FF006C;
 font-weight:500;
}
.driver-dashboard-card p:last-child{
 border-bottom:none;
}

/* ===========================
   SETTINGS CARD
=========================== */

.settings-card{
 border:2px solid #1D0792;
 padding:15px;
 border-radius:8px;
 background:#fff;
 max-width:500px;
}

/* ===========================
   COMPLETE BUTTON
=========================== */

.shashi-open-complete{
 background:green;
 color:white;
 border:none;
 padding:6px 14px;
 border-radius:5px;
 cursor:pointer;
}
.shashi-open-complete:hover{
 background:green;
}

/* ===========================
   CONFIRM COMLETE POP UP
=========================== */
/* Popup Overlay */
.shashi-modal {
  display: none;
  position: fixed;
  z-index: 9999;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,0.5);
}

/* Popup Box */
.shashi-modal-content {
  background: #fff;
  width: 350px;
  max-width: 95%;
  padding: 20px;
  border: 4px solid #1D0792;
  border-radius: 8px;

  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

/* Inputs */
.shashi-modal-content input,
.shashi-modal-content select,
.shashi-modal-content textarea {
  width: 100%;
  margin-bottom: 12px;
  padding: 8px;
  border: 1.5px solid #1D0792;
  color: #000;
  border-radius: 4px;
}

/* Confirm Button */
.confirm-btn {
  background: green;
  color: #fff;
  border: none;
  padding: 8px 14px;
  cursor: pointer;
  border-radius: 4px;
  margin-right: 8px;
}
.confirm-btn:hover{
 background:green;
}


/* Cancel Button */
.cancel-btn {
  background: red;
  color: #fff;
  border: none;
  padding: 8px 14px;
  cursor: pointer;
  border-radius: 4px;
}
.cancel-btn:hover{
 background:red;
}


/* ===========================
   LOGIN FORM
=========================== */
.shashi-login-form {
    max-width: 400px;
}

.shashi-login-form input {
    width: 100%;
    padding: 10px;
    box-sizing: border-box;
}

.password-wrapper {
    position: relative;
}

.password-wrapper input {
    padding-right: 40px; /* space for eye icon */
}

.password-toggle {
    position: absolute;
    right: 12px;
    top: 50%;
    transform: translateY(-50%);
    cursor: pointer;
    font-size: 18px;
    user-select: none;
}


.shashi-login-form input{
 width:100%;
 padding:10px;
 margin-bottom:12px;
 border:2px solid #1D0792;
 border-radius:5px;
}


.shashi-login-form button{
 background:#1D0792 !important;
 color:#fff !important;
 padding:12px;
 border:none;
 width:100%;
 font-size:16px;
 border-radius:5px;
 cursor:pointer;
}


.login-error{
 background:#ffe1e1;
 color:#b00000;
 padding:10px;
 border-radius:5px;
 text-align:center;
 margin-bottom: 10px;
}

/* ===========================
   DRIVER PAYOUT PAGE LOCK/UNLOCK
=========================== */
        .payout-form input {
            width: 100%;
            padding: 10px;
            border: 2px solid #1D0792;
            border-radius: 5px;
            margin-bottom: 15px;
        }

        .payout-form input[readonly] {
            background-color: #f2f2f2;
            cursor: not-allowed;
            color: solid black;
        }

        .payout-save-btn {
            background-color: green;
            color: white;
            padding: 8px 20px;
            border: none;
            border-radius: 5px;
            cursor: pointer;
        }

        .payout-save-btn:hover {
            color: green;
        }

        .admin-unlock-btn {
            background-color: #d63638;
            color: #fff;
            padding: 8px 16px;
            border: none;
            border-radius: 5px;
            cursor: pointer;
            margin-bottom: 15px;
        }

        .admin-unlock-btn:hover {
            background-color: #b32d2e;
        }

        .payout-success {
            color: green;
            font-weight: 600;
            margin-bottom: 15px;
        }

        .payout-locked-note {
            color: #cc0000;
            font-weight: 600;
            margin-bottom: 15px;
        }
  
  
 /* ===========================
   DRIVER REGISTER SEND/RESEND OTP
=========================== */ 
.shashi-form input,
.shashi-form select {
    border: 2px solid #1D0792;
    color: #000;
}
.shashi-form button {
    background: green;
    color: #fff;
    border: none;
    padding: 10px;
    cursor: pointer;
}
.password-wrapper {
    position: relative;
}
.password-toggle {
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    cursor: pointer;
}
        
 /* ===========================
   ADMIN DRIVER REGISTER REJECT POPUP
=========================== */ 

#rejectModal{
 display:none;
 position:fixed;
 top:0;left:0;
 width:100%;height:100%;
 background:rgba(0,0,0,.6);
 z-index:9999;
}
#rejectBox{
 background:#fff;
 width:400px;
 padding:20px;
 margin:10% auto;
 border-radius:6px;
}
#rejectBox textarea{
 width:100%;
 height:90px;
}

 /* ===========================
   DRIVER FORGOT PASSWORD SEND/RESEND OTP
=========================== */ 
.shashi-form input{
    border: 2px solid #1D0792;
    padding: 10px;
    width: 100%;
    box-sizing: border-box;
    margin-bottom: 12px;
}
.pass-wrap{ position: relative; }
.pass-eye{
    position: absolute;
    right: 12px;
    top: 50%;
    transform: translateY(-50%);
    cursor: pointer;
}
.shashi-form button,
.shashi-resend{
    background: green;
    color: #fff;
    border: none;
    padding: 8px 14px;
    cursor: pointer;
    border-radius: 4px;
}
.shashi-form button:hover,
.shashi-resend:hover{ background: green; }