body{font-family:Arial,sans-serif;margin:0;background:#f4f6f8;color:#17202a}.wrap{max-width:1050px;margin:auto;padding:0 16px}.top{background:#0f5132;color:white}.nav{display:flex;justify-content:space-between;align-items:center;min-height:64px}.logo{font-size:24px;font-weight:700;color:white;text-decoration:none}nav a{color:white;text-decoration:none;margin-left:14px;font-weight:600}.hero{background:linear-gradient(135deg,#198754,#0f5132);color:white;border-radius:18px;padding:30px;margin:24px 0}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px}.card,.box{background:white;border-radius:16px;padding:18px;box-shadow:0 4px 14px #0001;margin:14px 0}.tag{display:inline-block;background:#e8f5ee;color:#0f5132;padding:5px 10px;border-radius:999px;font-size:13px;font-weight:700}.btn,button{background:#198754;color:white;border:0;border-radius:10px;padding:10px 14px;text-decoration:none;font-weight:700;cursor:pointer}.btn.red{background:#dc3545}.btn.gray{background:#6c757d}.btn.orange{background:#fd7e14}input,select,textarea{width:100%;box-sizing:border-box;padding:11px;border:1px solid #ccd3d9;border-radius:10px;margin:7px 0 14px}label{font-weight:700}.search{display:flex;gap:10px}.search input{margin:0}.banner img{width:100%;border-radius:14px;display:block;max-height:180px;object-fit:cover}.admin-table{width:100%;border-collapse:collapse;background:white}.admin-table th,.admin-table td{padding:10px;border-bottom:1px solid #eee;text-align:left}.foot{text-align:center;padding:25px;color:#666}.notice{background:#fff3cd;padding:12px;border-radius:12px}.ok{background:#d1e7dd;padding:12px;border-radius:12px}/* Responsive Mobile + Tablet */
@media (max-width: 1024px) {
    header {
        flex-direction: column;
        align-items: flex-start;
        gap: 15px;
    }

    nav {
        display: flex;
        flex-wrap: wrap;
        gap: 12px;
    }

    .hero {
        padding: 35px 25px;
    }

    .hero h1 {
        font-size: 38px;
    }

    .searchbox {
        flex-direction: column;
    }

    .searchbox input,
    .searchbox button {
        width: 100%;
    }

    .grid {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 600px) {
    body {
        font-size: 16px;
    }

    header {
        padding: 18px;
    }

    header h1 {
        font-size: 28px;
    }

    nav a {
        font-size: 18px;
    }

    .hero {
        margin: 15px;
        padding: 28px 20px;
        border-radius: 22px;
    }

    .hero h1 {
        font-size: 34px;
    }

    .hero p {
        font-size: 18px;
    }

    .btn {
        display: block;
        width: 100%;
        margin: 10px 0;
        text-align: center;
    }

    .box {
        margin: 15px;
        padding: 22px;
    }

    input,
    textarea,
    select,
    button {
        width: 100%;
        font-size: 18px;
        box-sizing: border-box;
    }

    .grid {
        grid-template-columns: 1fr;
    }

    .card {
        padding: 18px;
    }
}@media (max-width: 600px) {
    header h1 {
        font-size: 24px;
        line-height: 1.1;
        white-space: nowrap;
    }

    header {
        align-items: center;
    }

    nav {
        justify-content: center;
    }

    nav a {
        font-size: 16px;
    }

    .hero h1 {
        font-size: 30px;
    }
}@media (max-width: 768px) {
    .nav {
        flex-direction: column;
        align-items: center;
        gap: 14px;
        text-align: center;
    }

    .logo {
        white-space: nowrap;
        font-size: 30px;
        line-height: 1.1;
    }

    .nav nav {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: 10px 16px;
    }

    .nav nav a {
        font-size: 17px;
    }
}/* Fix menu mobile/tablet */
@media (max-width: 900px) {
    header.top .nav {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        text-align: center !important;
        gap: 12px !important;
    }

    header.top .logo {
        display: block !important;
        width: 100% !important;
        text-align: center !important;
        white-space: nowrap !important;
        font-size: 28px !important;
        line-height: 1.1 !important;
    }

    header.top nav {
        display: flex !important;
        flex-wrap: wrap !important;
        justify-content: center !important;
        gap: 10px 18px !important;
        width: 100% !important;
    }

    header.top nav a {
        font-size: 17px !important;
        line-height: 1.2 !important;
    }
}/* ===== Đối tác quảng cáo ===== */

.partner-ads {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  background: #fff;
  padding: 18px;
  border-radius: 22px;
  margin: 24px 0;
}

.partner-box {
  height: 110px;
  border: 2px dashed #ddd;
  border-radius: 16px;
  background: #f8f8f8;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  font-weight: 800;
  color: #0f3b66;
  font-size: 22px;
  text-align: center;
}

.partner-box span {
  font-size: 14px;
  color: #666;
  margin-top: 6px;
}

.partner-box img {
  max-width: 90%;
  max-height: 80px;
  object-fit: contain;
}

@media (max-width: 768px) {
  .partner-ads {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 480px) {
  .partner-ads {
    grid-template-columns: 1fr;
  }
}
.partner-ads {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
    background: #fff;
    padding: 18px;
    border-radius: 22px;
    margin: 24px 0;
}

.partner-box {
    height: 110px;
    border: 2px dashed #ddd;
    border-radius: 16px;
    background: #f8f8f8;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    font-weight: 800;
    color: #0f3b66;
    font-size: 22px;
    text-align: center;
}

.partner-box span {
    font-size: 14px;
    color: #666;
    margin-top: 6px;
}.partner-box a {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.partner-box img {
    max-width: 95%;
    max-height: 95px;
    object-fit: contain;
}.partner-ads {
    display: flex !important;
    overflow: hidden !important;
    gap: 15px !important;
}

.partner-box {
    min-width: calc(33.333% - 10px) !important;
   animation: partnerSlide 4s linear infinite;
}

@keyframes partnerSlide {
    0% {
        transform: translateX(0);
    }
    100% {
        transform: translateX(-105%);
    }
}.agree-submit-row{
    display:flex;
    align-items:center;
    gap:15px;
    margin-top:20px;
}

.agree-label{
    display:flex;
    align-items:center;
    gap:8px;
    font-weight:bold;
    font-size:20px;
}

.agree-label input{
    width:18px;
    height:18px;
    margin:0;
}

.btn-submit{
    background:#198754;
    color:#fff;
    border:none;
    border-radius:10px;
    padding:12px 24px;
    font-size:18px;
    font-weight:bold;
    cursor:pointer;
}.btn-login-now{
    display:inline-block;
    background:#198754;
    color:white;
    padding:12px 20px;
    border-radius:10px;
    text-decoration:none;
    font-weight:bold;
    margin-top:12px;
}.error{
    background:#f8d7da;
    color:#842029;
    padding:12px 15px;
    border-radius:8px;
    margin:15px 0;
    font-weight:bold;
}.btn-delete{
    display:inline-block;
    background:#dc3545;
    color:#fff !important;
    padding:8px 14px;
    border-radius:8px;
    text-decoration:none;
    font-weight:bold;
    margin-top:10px;
}.btn-edit{
    display:inline-block;
    background:#0d6efd;
    color:#fff !important;
    padding:8px 14px;
    border-radius:8px;
    text-decoration:none;
    font-weight:bold;
    margin-top:10px;
    margin-right:8px;
}.admin-stats{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:15px;
    margin:20px 0;
}

.admin-stats div{
    background:#ffffff;
    padding:20px;
    border-radius:14px;
    font-size:18px;
    box-shadow:0 8px 25px rgba(0,0,0,0.08);
}

.admin-stats b{
    font-size:32px;
    color:#198754;
}.job-card {
  background: white;
  padding: 18px;
  margin: 15px 25px;
  border-radius: 14px;
  box-shadow: 0 3px 12px rgba(0,0,0,0.08);
}.card{
    background:#fff;
    border-radius:20px;
    padding:25px;
    margin-bottom:20px;
    box-shadow:0 2px 10px rgba(0,0,0,.08);
}

.badge{
    display:inline-block;
    background:#e7f5ec;
    color:#0f6b3f;
    padding:8px 15px;
    border-radius:20px;
    font-weight:bold;
    margin-bottom:15px;
}.member-stats{
    background:#fff;
    margin:10px 25px;
    padding:10px 15px;
    border-radius:10px;
    font-weight:bold;
    box-shadow:0 2px 8px rgba(0,0,0,.08);
}.hero-buttons a{
    transition:all .25s;
}

.hero-buttons a:hover{
    transform:translateY(-3px);
    filter:brightness(110%);
}html {
    zoom: 75%;
}