/* assets/site.css - styles cho layout sidebar + topbar */
:root{
  --sidebar-width: 200px;
  --primary: #0d6efd;
}

/* Reset box sizing */
*{box-sizing:border-box}

/* shell */
.app-shell{min-height:100vh;}
.app-sidebar{
  width:var(--sidebar-width);
  min-width:var(--sidebar-width);
  max-width:var(--sidebar-width);
  background:#fff;
  box-shadow: 0 0 0 1px rgba(0,0,0,0.03) inset;
}
.sidebar-top{height:72px; display:flex; align-items:center; gap:8px;}
.sidebar-logo {
    width: 120px;     /* chỉnh kích thước logo */
    height: auto;
    display: block;
    margin: 10px auto 5px auto;  /* căn giữa */
}

.sidebar-logo-title {
    font-size: 20px;
    font-weight: 600;
    margin-top: 5px;
    text-align: center;
}

.sidebar-logo-sub {
    font-size: 14px;
    color: #555;
    text-align: center;
}


/* nav */
.app-sidebar .nav-link{
  color:#1f2d38;
  padding:10px 12px;
  border-radius:6px;
  margin:4px 6px;
  transition:all .12s ease;
}
.app-sidebar .nav-link:hover{
  background:rgba(13,110,253,0.06);
  color:var(--primary);
}

/* topbar */
.topbar{background:#fff; box-shadow:0 1px 0 rgba(0,0,0,0.04);}
.topbar .container-fluid{max-width:1200px}

/* main content */
.app-main{flex:1; display:flex; flex-direction:column}
main.container-fluid{max-width:1200px}

/* cards small style */
.card-custom{
  background:#fff;
  border-radius:8px;
  box-shadow:0 6px 18px rgba(0,0,0,0.03);
  padding:16px;
}

/* responsive */
@media (max-width: 900px){
  .app-sidebar{display:none}
  .app-shell{flex-direction:column}
  main.container-fluid{padding:16px}
}

/* navbar-text user */
.navbar-text{font-weight:500; color:#333}
/* ===== LOGIN IMAGE FIX (FINAL) ===== */
.login-right {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px;
}

.login-right img,
.login-right .img-cover {
    width: 100%;
    max-width: 560px;       /* 👈 ép bề ngang */
    max-height: 360px;      /* 👈 giảm chiều cao (QUAN TRỌNG) */
    object-fit: cover;
    border-radius: 14px;
}