:root{ 
  --bg:#EAF1F4; 
  --card:#ffffff; 
  --text:#111827; 
  --muted:#6b7280; 
  --brand:#D32A31; 
  --brand-dark:#D32A31; 
  --border:#e5e7eb; 
  --radius:12px; 
  --shadow:0 4px 16px rgba(0,0,0,.06); 
  } 

  /* compensate for fixed header */ 
  body{ 
    padding-top:70px; 
    background:var(--bg); 
    color:var(--text); 
    font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif; 
    height:100vh; 
    overflow:hidden; 
    display:flex; 
    flex-direction:column; 
  } 
  .mb-3{ 
    text-align: center; 
  } 
  .layout{ 
    display:flex; 
    flex:1; overflow:hidden; 
    gap:25px; padding:20px; 
  }
  .sidebar{ 
    width:280px; 
    background:var(--card); 
    border:1px solid var(--border); 
    border-radius:var(--radius); 
    box-shadow:var(--shadow); 
    padding:16px; position:sticky; 
    height:max-content; 
  } 
  .sidebar__menu{ 
    list-style:none; 
    padding:0; margin:0; 
    margin-bottom: -10px!important;
  } 
  .menu-item{ 
    width:100%; 
    text-align:left; 
    background:transparent; 
    border:1px solid var(--border); 
    color:var(--text); 
    border-radius:10px; 
    padding:10px 12px; 
    margin-bottom:8px; 
    cursor:pointer; 
    transition:all .15s ease; 
  } 
  .menu-item:hover{ 
    background:#fafafa; 
  } 
  .menu-item.active{ 
    background:var(--brand); 
    border-color:var(--brand); 
    color:#fff; 
  }  
  .content{ 
    flex:1; 
    min-width:0; 
    height:350px; 
    overflow-y:auto; 
    padding-right:8px; 
    border-radius:var(--radius); 
  } 
  .tab{ 
    display:none; 
  } 
  .tab.active{ 
    display:block; 
  } 
  .card{ 
    background:var(--card); 
    border:1px solid var(--border); 
    border-radius:var(--radius); 
    box-shadow:var(--shadow); 
  } 
  .card--padded{ 
    padding:20px; 
  } 
  .grid{ 
    display:grid; 
    grid-template-columns:repeat(2,minmax(0,1fr)); 
    gap:20px; 
  } 
  .field{ 
    display:flex; 
    flex-direction:column; 
    gap:6px; 
  } 
  .field > span{ 
    font-size:.85rem; 
    color:var(--muted); 
  } 
  .field input{ 
    height:40px; 
    padding:0 12px; 
    border:1px solid var(--border); 
    border-radius:10px; 
    outline:none; 
    margin-bottom: -10px; 
  } 
  .info{ 
    width: 100%; 
    height:40px; 
    border:1px solid #e5e7eb; 
    border-radius:10px; 
  } 
  .field select{ 
    height:40px; 
    padding:0 12px; 
    border:1px solid var(--border); 
    border-radius:10px; 
    outline:none; 
    margin-bottom: -10px; 
  } 
  .btn-save{ 
    width:150px; 
    margin-top:12px; 
    height:44px; 
    padding:0 18px; 
    background:var(--brand); 
    color:#fff; border:none; 
    border-radius:10px; 
    cursor:pointer; 
    display:block; 
    margin-left:auto; 
  }  
  .content-narrow{
    max-width:620px; 
  } 
  .report-table{ 
    width:100%; 
    border-collapse:separate; 
    border-spacing:0; overflow:hidden; 
    border:1px solid var(--border); 
    border-radius:10px; 
  } 
  .report-table th, .report-table td{ 
    padding:12px 14px; 
    border-bottom:1px solid var(--border); 
  } 
  .report-table th{
     width:45%; background:#fafafa; 
     text-align:left; 
     font-weight:600; 
    } 
    .report-table tr:last-child th, .report-table tr:last-child td{ 
      border-bottom:none; 
    }  
    .card-padded{ 
      margin:20px; 
      width:calc(100% - 40px); 
      background:#fff; 
      border-radius:10px; 
      padding:15px;  
    } 
    .terms-conditions{ 
      font-size: 10px; 
    } 
    .imges{
      width: 80%!important;
    }
    .form-navigation {
  display: none;
}
@media (max-width: 991.98px){ 
    .layout{ 
    padding:12px; 
    gap:12px; 
   } 
  .sidebar{ 
    position:fixed; 
    top:72px; 
    left:0; 
    bottom:0; 
    width:84%; 
    max-width:360px; 
    height:auto; 
    border-radius:0 16px 16px 0; 
    transform:translateX(-105%); transition:transform .2s ease; 
    z-index:1040; 
  } 
  .password_btn {
  display: none;
}

  .sidebar.open{ 
    transform:translateX(0); 
  } 
  .content{ 
    width:100%; 
    height: auto; 
  } 
  .grid{ 
    grid-template-columns:1fr; 
  } 
  .sidebar {
    display: none; /* Hide sidebar on mobile */
  }
  .tab {
    display: none;
  }
  .tab.active {
    display: block;
  }
  .form-navigation {
    display: flex;
    justify-content: space-between;
    margin-top: 20px;
  }
  .form-navigation button {
    background-color: #d32a31;
    color: white;
    border: none;
    padding: 10px 20px;
    border-radius: 6px;
  }

  .form-navigation .pass_save{
   background-color: #d32a31;
}

  .form-navigation .btn-prev{
    background-color: rgb(80, 80, 253);
  }
}