.custom-alert {
    display: none;
    padding: 15px;
    margin-top: 20px;
    border-radius: 12px;
    font-size: 15px;
    box-shadow: 0px 4px 12px rgba(0,0,0,0.1);
    animation: fadeIn 0.6s ease-in-out;
    text-align: right;
    direction: rtl;
  }

  .alert-success-custom {
    background: linear-gradient(135deg, #e8f9f2, #d1f2e5);
    border-right: 4px solid #28a745;
    color: #155724;
  }

  .alert-error-custom {
    background: linear-gradient(135deg, #fde8e8, #f9d6d5);
    border-right: 4px solid #dc3545;
    color: #721c24;
  }

  .custom-alert i {
    margin-left: 6px;
    font-size: 20px;
    vertical-align: middle;
  }

  @keyframes fadeIn {
    from {opacity: 0; transform: translateY(5px);}
    to {opacity: 1; transform: translateY(0);}
  }
    :root{
      --accent:#0d6efd; /* Bootstrap primary blue */
      --muted:#6c757d;
      --card-bg: #ffffff;
      --page-bg: #f8f9fa;
    }

    html,body{height:100%;}
    body{
      font-family: 'Vazirmatn', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial;
      background: var(--page-bg);
      color:#212529;
      -webkit-font-smoothing:antialiased;
      -moz-osx-font-smoothing:grayscale;
    }

    /* Header */
    .hero{
      background: linear-gradient(180deg, rgba(13,110,253,0.08), rgba(13,110,253,0.03));
      padding: 3.5rem 1rem;
      border-radius: .75rem;
    }

    .profile-img{
      width: 160px;
      height: 160px;
      object-fit: cover;
      border-radius: 50%;
      border: 6px solid #fff;
      box-shadow: 0 6px 20px rgba(13,110,253,0.12);
    }

    .badge-round{
      border-radius: 999px;
      padding: .35rem .6rem;
      font-weight:600;
    }
    
    /* Card styles */
    .info-card{border-radius:12px; box-shadow: 0 6px 18px rgba(33,37,41,0.06);}

    /* Footer */
    footer{font-size:.9rem;color:var(--muted);}

    /* Responsive tweaks */
    @media(min-width:992px){
      .hero{padding:4.5rem 2rem}
    }

    /* Small helper */
    .muted{color:var(--muted)}