body{
  font-family:'Segoe UI', Arial, sans-serif;
  margin:0;
  background: linear-gradient(135deg,#eef2ff,#f8fafc);
}

/* HERO */
.hero{
  height:100vh;
  position:relative;
  overflow:hidden;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  color:#fff;
  padding:80px;
}

/* GRID */
.grid{
  display:flex;
  gap:20px;
  justify-content:center;
}

/* BUTTON */
.btn{
  padding:12px 25px;
  background:#007bff;
  color:#fff;
  border-radius:30px;
  border:none;
}

/* SIDEBAR */
.sidebar{
  width:250px;
  height:100vh;
  position:fixed;
  background:linear-gradient(180deg,#0f172a,#1e293b);
  color:#fff;
  padding:20px;
}

.sidebar a{
  display:block;
  color:#fff;
  padding:12px;
  margin:8px 0;
  border-radius:10px;
  text-decoration:none;
}

.sidebar a:hover{
  background:rgba(255,255,255,0.2);
}

/* MAIN CONTENT */
.main{
  margin-left:260px;
  padding:20px;
}

/* CARDS */
.card{
  border:none;
  border-radius:20px;
  box-shadow:0 10px 30px rgba(0,0,0,0.1);
  transition:0.3s;
}

.card:hover{
  transform: translateY(-5px);
}

/* BADGE */
.badge{
  background: linear-gradient(45deg,#4f46e5,#6366f1) !important;
  box-shadow:0 5px 15px rgba(0,0,0,0.2);
}

/* FORM CARD */
.form-card{
  background: rgba(255,255,255,0.9);
  backdrop-filter: blur(12px);
  border-radius:20px;
  box-shadow:0 15px 40px rgba(0,0,0,0.1);
  transition:0.3s;
}

.form-card:hover{
  transform: translateY(-5px);
}

/* TABLE */
.table{
  border-radius:12px;
  overflow:hidden;
}

.table-hover tbody tr:hover{
  background: rgba(255,255,255,0.1);
}

/* HERO SLIDER */
.hero-slider{
  position:relative;
  height:100vh;
  overflow:hidden;
}

.slide{
  position:absolute;
  width:100%;
  height:100%;
  background-size:cover;
  background-position:center;
  animation:slideShow 25s infinite;
  opacity:0;
}

.slide:nth-child(1){ animation-delay:0s; }
.slide:nth-child(2){ animation-delay:5s; }
.slide:nth-child(3){ animation-delay:10s; }
.slide:nth-child(4){ animation-delay:15s; }
.slide:nth-child(5){ animation-delay:20s; }

@keyframes slideShow{
  0%{opacity:0; transform:scale(1.1);}
  10%{opacity:1;}
  30%{opacity:1;}
  40%{opacity:0;}
  100%{opacity:0; transform:scale(1);}
}

/* OVERLAY */
.overlay{
  position:absolute;
  width:100%;
  height:100%;
  background:linear-gradient(to right, rgba(0,0,0,0.7), rgba(0,0,0,0.3));
  z-index:1;
}

/* HERO CONTENT */
.hero-content{
  position:absolute;
  z-index:2;
  top:50%;
  left:10%;
  transform:translateY(-50%);
  color:#fff;
}

.hero-content h1{
  font-size:60px;
  font-weight:700;
}

.hero-content p{
  font-size:20px;
}

/* HERO BASE (ACTIVE SLIDE SYSTEM) */
.hero-bg{
  position:absolute;
  width:100%;
  height:100%;
  top:0;
  left:0;
}

.hero-slide{
  position:absolute;
  width:100%;
  height:100%;
  background-size:cover;
  background-position:center;
  opacity:0;
  transform:scale(1.2);
  transition:opacity 1.5s ease, transform 6s ease;
  will-change: transform, opacity;
}

.hero-slide.active{
  opacity:1;
  transform:scale(1);
}

.hero-overlay{
  position:absolute;
  width:100%;
  height:100%;
  backdrop-filter: blur(6px);
  background:linear-gradient(to right, rgba(0,0,0,0.6), rgba(0,0,0,0.4));
}

/* BUTTON PREMIUM */
.btn-premium{
  padding:12px 30px;
  border-radius:30px;
  background:linear-gradient(45deg,#4f46e5,#6366f1);
  border:none;
  transition:0.3s;
}

.btn-premium:hover{
  transform:scale(1.08);
}

/* SLIDER CONTROLS */
.slider-controls{
  position:absolute;
  bottom:40px;
  width:100%;
  display:flex;
  justify-content:center;
  gap:20px;
  z-index:3;
}

.slider-controls button{
  width:45px;
  height:45px;
  border:none;
  border-radius:50%;
  background:rgba(255,255,255,0.2);
  backdrop-filter: blur(10px);
  color:#fff;
  font-size:18px;
  transition:0.3s;
}

.slider-controls button:hover{
  background:#4f46e5;
}

/* NAVBAR FIX */
nav, .navbar, .navbar *{
  all:revert;
}

.navbar-nav{
  display:flex !important;
  flex-direction:row !important;
  list-style:none !important;
  margin:0;
  padding:0;
}

.nav-link{
  text-decoration:none !important;
}

.nav-link:hover{
  text-decoration:none !important;
}

/* REMOVE BULLETS */
.navbar-nav li,
.navbar-nav li::marker{
  list-style:none !important;
  content:"" !important;
}

/* HEADER BRAND */
.navbar-brand{
  text-align:left;
}

.brand-text{
  display:block;
  line-height:1.2;
}

.navbar-brand img{
  height:40px;
  width:auto;
}

/* NAVBAR MOBILE FIX */
@media (max-width:991px){

  .navbar{
    padding-left:10px;
    padding-right:10px;
  }

  .navbar-brand{
    max-width:70%;
    overflow:hidden;
    text-overflow:ellipsis;
  }

  .navbar-toggler{
    margin-left:auto;
    margin-right:5px;
  }

  .navbar-collapse{
    width:100%;
    overflow-x:hidden;
    text-align:left;
  }

  .navbar-nav{
    margin-left:0 !important;
  }

  .navbar-nav .nav-link{
    text-align:left !important;
  }

  .navbar .lang-btn{
    margin-left:5px;
  }
}

/* ANIMATION */
#idCard{
  animation: fadeIn 1s ease;
}

@keyframes fadeIn{
  from{opacity:0; transform:translateY(20px);}
  to{opacity:1; transform:translateY(0);}
}
/* PREVENT OVERFLOW */
html, body{
  overflow-x:hidden !important;
}

/* FLEX CONTROL */
.navbar .container-fluid{
  display:flex;
  align-items:center;
  justify-content:space-between;
  flex-wrap:nowrap;
}

/* BRAND LIMIT (VERY IMPORTANT) */
.navbar-brand{
  max-width:75%;
  overflow:hidden;
}

.brand-text{
  display:block;
  line-height:1.2;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

body{
  padding-top:90px; /* desktop navbar height */
}

@media(max-width:768px){
  body{
    padding-top:110px; /* mobile navbar height */
  }
}

/* FORCE TOGGLER RIGHT */
.navbar-toggler{
  margin-left:auto !important;
  flex-shrink:0;
}

/* MOBILE FIX */
@media(max-width:991px){

  .navbar{
    padding-left:10px;
    padding-right:10px;
  }

  .brand-text{
    font-size:12px;
  }

  .navbar-brand{
    max-width:65%;
  }

  .navbar-toggler{
    margin-left:8px !important;
  }

}