* {
       margin: 0;
       padding: 0;
       box-sizing: border-box;
   }

   body {
       font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
       background-color: #f8f9fa;
   }

   .tp-auth-page {
       min-height: 100vh;
       display: flex;
       align-items: center;
       justify-content: center;
       padding: 20px;
   }

   .tp-auth-card {
       background: #ffffff;
       width: 100%;
       max-width: 480px;
       padding: 50px 40px;
       border-radius: 20px;
       box-shadow: 0 20px 50px rgba(0, 0, 0, 0.05);
       text-align: center;
   }

   .tp-auth-logo {
       margin-bottom: 30px;
   }

   .tp-auth-logo img {
       max-height: 67px;
   }

   .tp-auth-title {
       font-size: 24px;
       font-weight: 700;
       color: #1a1a1a;
       margin-bottom: 10px;
   }

   .tp-auth-subtitle {
       font-size: 15px;
       color: #666;
       margin-bottom: 35px;
       line-height: 1.5;
   }

   .tp-input-group {
       position: relative;
       margin-bottom: 20px;
       text-align: left;
   }

   .tp-input-group i {
       position: absolute;
       left: 18px;
       top: 50%;
       transform: translateY(-50%);
       color: #999;
       font-size: 16px;
       transition: 0.3s;
   }

   .tp-auth-input {
       width: 100%;
       height: 55px;
       background: #f4f4f4;
       border: 1px solid transparent;
       border-radius: 12px;
       padding: 0 20px 0 50px;
       font-size: 15px;
       color: #1a1a1a;
       transition: all 0.3s ease;
       outline: none;
   }

   .tp-auth-input:focus {
       background: #ffffff;
       border-color: #0e78c4;
       box-shadow: 0 0 0 4px rgba(20, 228, 255, 0.1);
   }

   .tp-auth-input:focus+i,
   .tp-auth-input:not(:placeholder-shown)+i {
       color: #0e78c4;
   }

   .tp-auth-btn {
       width: 100%;
       height: 55px;
       background: #0e78c4;
       color: #ffffff;
       border: none;
       border-radius: 50px;
       font-size: 16px;
       font-weight: 600;
       cursor: pointer;
       transition: all 0.3s ease;
       margin-top: 10px;
       display: flex;
       align-items: center;
       justify-content: center;
       gap: 10px;
   }

   .tp-auth-btn:hover {
       background: rgb(16, 86, 120, 47);
       transform: translateY(-2px);
       box-shadow: 0 8px 20px rgba(20, 247, 255, 0.25);
   }

   .tp-auth-footer {
       margin-top: 25px;
       font-size: 14px;
       color: #666;
   }

   .tp-auth-footer a {
       color: #0e78c4;
       font-weight: 600;
       text-decoration: none;
       transition: 0.3s;
   }

   .tp-auth-footer a:hover {
       color: #1a1a1a;
   }