body {
      background: #9da4ad;
      min-height: 100vh;
      /*display: flex;*/
      justify-content: center;
      align-items: center;
    }
    .registration-wrapper {
      background: linear-gradient(to right, #3931af, #00bfff);
      border-radius: 10px;
      overflow: hidden;
      max-width: 1000px;
      width: 100%;
    }
    .left-panel {
      background: linear-gradient(to bottom, #3931af, #00bfff);
      color: white;
      text-align: center;
      padding: 50px 20px;
    }
    .left-panel .btn-login {
      background: white;
      color: #4b0082;
      border-radius: 20px;
      padding: 8px 25px;
      font-weight: bold;
    }
    .right-panel {
      background: #fff;
      padding: 40px 30px;
      border-radius: 20px 0 0 20px;
    }
    .tabs .btn {
      border-radius: 30px;
      padding: 5px 15px;
      font-size: 14px;
    }
    .form-control, .form-select {
      border-radius: 8px;
      font-size: 14px;
    }
    .btn-register {
      background: #00bfff;
      color: white;
      border-radius: 25px;
      padding: 10px 40px;
    }
    @media (max-width: 768px) {
      .registration-wrapper {
        flex-direction: column;
      }
      .right-panel {
        border-radius: 20px 20px 0 0;
      }
    }


    /*Login page*/

    .login-container {
      background: #fff;
      border-radius: 20px;
      overflow: hidden;
      max-width: 900px;
      width: 100%;
      display: flex;
      flex-wrap: wrap;
      box-shadow: 0 4px 20px rgba(0,0,0,0.1);
    }
    .login-left {
      background: linear-gradient(to bottom, #3b00c4, #4a00ff);
      color: #fff;
      flex: 1;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      padding: 40px 20px;
      min-width: 280px;
    }
    .login-left img {
      max-width: 80px;
      margin-bottom: 20px;
    }
    .login-left .btn-login {
      background: #fff;
      color: #000;
      border-radius: 25px;
      padding: 8px 30px;
      font-weight: bold;
    }
    .login-right {
      flex: 2;
      background: #f9f9f9;
      padding: 40px;
      position: relative;
      min-width: 320px;
    }
    .tabs-switch {
      position: absolute;
      top: 20px;
      right: 20px;
      display: flex;
      background: #fff;
      border-radius: 25px;
      overflow: hidden;
      border: 1px solid #4a00ff;
    }

    .tabs-switchss {
      position: absolute;
      top: 20px;
      right: 20px;
      display: flex;
      background: #fff;
      border-radius: 25px;
      overflow: hidden;
      border: 1px solid #4a00ff;
    }
    .tabs-switch a {
      padding: 8px 20px;
      text-decoration: none;
      font-weight: bold;
      color: #4a00ff;
      transition: 0.3s;
    }
    .tabs-switch a.active {
      background: #4a00ff;
      color: #fff;
    }
    .form-control {
      border-radius: 8px;
      padding: 10px;
    }
    .btn-main {
      background: #4a00ff;
      color: #fff;
      border-radius: 25px;
      padding: 10px 30px;
      font-weight: bold;
    }
    @media(max-width:768px){
      .login-container {
        flex-direction: column;
      }
    }

    .tabs-switchss {
      position: absolute;
      top: 20px;
      right: 16%;
      display: flex;
      background: #fff;
      border-radius: 25px;
      overflow: hidden;
      border: 1px solid #4a00ff;
    }
    .tabs-switchss a {
      padding: 8px 20px;
      text-decoration: none;
      font-weight: bold;
      color: #4a00ff;
      transition: 0.3s;
    }
    .tabs-switchss a.active {
      background: #4a00ff;
      color: #fff;
    }


/*Dashboard Page*/

.header-gradient {
      background: linear-gradient(to right, #5a0db8, #33b3f0);
      color: white;
      padding: 15px 20px;
    }

    /* Logo Styling */
    /*.logo img {
      max-height: 60px;
    }*/

    /* Nav Buttons */
    .nav-buttons a {
      color: white;
      border: 1px solid white;
      padding: 6px 15px;
      margin-left: 10px;
      text-decoration: none;
      font-size: 14px;
      transition: 0.3s ease-in-out;
    }

    .nav-buttons a:hover {
      background-color: white;
      color: #5a0db8;
    }

    /* ===== Main Section ===== */
    .main-section {
      background-color: #e6f2fa;
      padding: 30px 15px;
    }

    /* Seminar Box */
    .seminar-box {
      border: 2px solid #562b7e;
      border-radius: 6px;
      background-color: #f3f8fc;
      padding: 30px 20px;
      /*max-width: 600px;*/
      margin: auto;
      text-align: center;
    }

    /* Seminar Buttons */
    .seminar-btn {
      display: block;
      width: 220px;
      margin: 10px auto;
      padding: 10px 0;
      border: 2px solid #562b7e;
      background: transparent;
      border-radius: 8px;
      font-weight: bold;
      color: #562b7e;
      transition: 0.3s ease-in-out;
    }

    .seminar-btn:hover {
      background-color: #562b7e;
      color: white;
    }

    /* ===== Footer ===== */
    .footer-black {
      background-color: black;
      height: 60px;
    }

    /* Responsive Design */
    @media (max-width: 768px) {
      .nav-buttons {
        text-align: center;
        margin-top: 10px;
      }
      .logo {
        text-align: center;
        margin-bottom: 10px;
      }
    }


/*Seminar one page css*/
/* Top Header */
    .top-header {
      background: linear-gradient(to right, #6a0dad, #3ea9ff);
      color: white;
      padding: 15px;
    }

    .logo-text {
      font-weight: bold;
      font-size: 1.3rem;
    }

    /* Sidebar */
    .sidebar {
      background: #e9f3fb;
      border: 1px solid #ccc;
      border-radius: 10px;
      padding: 15px;
    }

    .sidebar h5 {
      background: #48b0d6;
      color: white;
      text-align: center;
      padding: 8px;
      border-radius: 8px;
      font-size: 1rem;
      margin-bottom: 15px;
    }

    .sidebar .list-group-item {
      font-size: 0.9rem;
      border: none;
      border-radius: 5px;
      padding: 8px 12px;
    }

    .sidebar .active {
      background-color: #5e2ca5;
      color: white;
      font-weight: bold;
    }

    /* Content Box */
    .content-box {
      background: #e9f3fb;
      border: 1px solid #ccc;
      border-radius: 10px;
      padding: 20px;
    }

    .content-title {
      color: #48b0d6;
      font-weight: bold;
    }

    .content-box .min-time {
      float: right;
      font-size: 0.8rem;
      font-weight: bold;
    }

    /* Bottom lesson links */
    .bottom-links {
      border: 1px solid #999;
      padding: 10px;
      border-radius: 5px;
      max-width: 300px;
      margin: 0 auto;
      background-color: #fff;
    }

    .bottom-links a {
      display: block;
      text-align: center;
      text-decoration: none;
      padding: 6px;
      color: #5e2ca5;
      font-weight: bold;
      border-bottom: 1px solid #999;
    }

    .bottom-links a:last-child {
      border-bottom: none;
    }

    /* Prev and Next buttons */
    .navigation-buttons {
      display: flex;
      justify-content: space-between;
      margin-top: 15px;
    }

    /* Mobile adjustments */
    @media (max-width: 767px) {
      .sidebar {
        margin-bottom: 20px;
      }
    }