@import url('admin.css');:root{--blue:#1769aa;--dark:#123b63;--sky:#eaf5fc;--ink:#263238;--validation-success:#198754;--validation-danger:#dc3545}*{box-sizing:border-box}body{font-family:'Noto Sans Thai',sans-serif;color:var(--ink);background:#f7fbfe}.brand{display:flex;align-items:center;gap:10px;color:var(--dark);font-weight:800;font-size:1.1rem;line-height:1.05}.brand img{width:42px;height:42px;object-fit:cover;border-radius:50%}.brand small{font-size:.6rem;letter-spacing:.04em;color:#73899b;font-weight:500}.navbar{background:#fff}.hero{padding:105px 0 120px;background:radial-gradient(circle at 80% 10%,#d5edff 0,#f7fbfe 40%,#fff 100%)}.eyebrow{font-size:.76rem;letter-spacing:.14em;color:var(--blue);font-weight:800}.hero h1{font-size:clamp(2.2rem,5vw,4.5rem);line-height:1.2;color:var(--dark);font-weight:800;margin:20px 0}.hero h1 span{color:var(--blue)}.hero .lead{font-size:1.35rem;line-height:1.7;color:#42586a}.btn-primary{background:var(--blue);border-color:var(--blue);box-shadow:0 10px 25px #1769aa2b}.btn-primary:hover{background:var(--dark)}.hero-card{background:white;border-radius:28px;padding:24px;box-shadow:0 24px 70px #123b6320;transform:rotate(2deg)}.hero-card img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:18px}.card-caption{padding:18px 4px 2px;color:var(--dark)}.card-caption span{color:#7690a4}.info-strip{background:#fff;padding:65px 0}.info-strip b{color:var(--blue);font-size:.8rem}.info-strip h3{font-size:1.1rem;margin:12px 0 6px;color:var(--dark)}.info-strip p{color:#728391}.footer{padding:25px 0;color:#7890a3;font-size:.85rem}.footer a{color:var(--blue)}.form-page{padding:45px 0 80px}.narrow{max-width:800px}.back{color:var(--blue);display:inline-block;margin-bottom:18px}.form-card{background:white;border:1px solid #dceaf3;border-radius:18px;padding:clamp(24px,5vw,52px);box-shadow:0 20px 60px #123b6312}.form-card h1{color:var(--dark);font-weight:800;margin-top:10px}.form-card label{display:block;font-size:.9rem;font-weight:600;margin-bottom:7px}.form-card em{color:var(--validation-danger);font-style:normal}.form-card input:not([type=checkbox]),.form-card select,.form-card textarea{width:100%;border:1px solid #cfdee8;border-radius:9px;padding:11px 13px;background:#fff}.form-card input:focus,.form-card select:focus,.form-card textarea:focus{outline:3px solid #1769aa22;border-color:var(--blue)}.is-valid{border-color:var(--validation-success)!important}.is-invalid{border-color:var(--validation-danger)!important}.invalid-feedback{color:var(--validation-danger);font-size:.85rem;margin-top:.35rem}.invalid-feedback[hidden]{display:none}.is-valid:focus{border-color:var(--validation-success)!important;box-shadow:0 0 0 .2rem #19875426}.is-invalid:focus{border-color:var(--validation-danger)!important;box-shadow:0 0 0 .2rem #dc354526}.form-validation-summary{margin-bottom:1rem}.validation-group-invalid{border:1px solid var(--validation-danger);border-radius:.5rem;padding:.5rem}.validation-group-invalid .invalid-feedback{display:block}.required-marker{color:var(--validation-danger);font-style:normal}.form-control:disabled,.form-control[readonly],select:disabled,input:disabled,textarea:disabled{background-color:#e9ecef;opacity:1}.consent{display:flex;gap:10px;align-items:flex-start;background:var(--sky);border-radius:10px;padding:15px;font-size:.9rem}.consent input{margin-top:5px;accent-color:var(--blue)}.success-page{min-height:100vh;display:grid;place-items:center;padding:30px}.success-box{text-align:center;background:#fff;padding:50px 30px;border-radius:20px;max-width:560px;width:100%;box-shadow:0 20px 70px #123b6317}.success-mark{margin:auto auto 18px;background:#dff7e9;color:var(--validation-success);border-radius:50%;width:65px;height:65px;display:grid;place-items:center;font-size:2rem}.success-box h1{color:var(--dark);font-weight:800;margin:12px}.line-invite{background:var(--sky);border-radius:14px;padding:20px;margin:25px 0}.line-invite h3{font-size:1.1rem;color:var(--dark)}.line-invite p{color:#60798a}.line-invite img{width:190px;margin:15px auto 3px;border-radius:8px}.btn-line{background:#06c755;color:#fff;border-color:#06c755}.btn-line:hover{background:#049c44;color:#fff}@media(max-width:576px){.hero{padding:65px 0 75px}.hero-card{max-width:300px;margin:auto}.hero .lead{font-size:1.1rem}}
/* Keep the brand mark and system name visually clean. */
.brand {
    text-decoration: none;
}

/* Keep validation messages from shifting the registration grid. */
.form-card .invalid-feedback {
    display: block;
    min-height: 1.25rem;
}

.form-card .invalid-feedback[hidden] {
    display: block;
    visibility: hidden;
}

.form-card .consent {
    flex-wrap: wrap;
    gap: 14px;
}

.form-card .consent > input {
    flex: 0 0 auto;
}

.form-card .consent > span {
    flex: 1 1 0;
}

.form-card .consent > .invalid-feedback {
    flex: 0 0 100%;
    order: 3;
    margin: 0;
    padding-left: 28px;
}

.form-card select {
    min-height: 52px;
    padding: 13px 44px 13px 15px;
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23123b63' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 14px center;
    background-size: 18px;
    line-height: 1.4;
}

.login-card label.remember-login {
    display: inline-flex !important;
    flex-direction: row;
    align-items: center;
    gap: 12px;
    width: auto;
    margin: 18px 0 0;
    padding: 12px 14px;
    border: 1px solid #dbeaf5;
    border-radius: 10px;
    background: #f7fbfe;
    font-weight: 400;
    cursor: pointer;
    transition: border-color .18s ease, background-color .18s ease, box-shadow .18s ease;
}

.login-card label.remember-login:hover {
    border-color: #9bc9e7;
    background: #f0f8fd;
}

.login-card label.remember-login:focus-within {
    border-color: var(--blue);
    box-shadow: 0 0 0 3px #1769aa1c;
}

.login-card label.remember-login input {
    width: 18px !important;
    height: 18px;
    flex: 0 0 18px;
    margin: 0;
    padding: 0;
    accent-color: var(--blue);
    cursor: pointer;
}

.login-card label.remember-login > span {
    color: var(--ink);
    font-size: 14px;
    font-weight: 600;
    line-height: 1;
    white-space: nowrap;
}

.short-courses{padding:78px 0 88px;background:#eef7fc}.section-heading{display:flex;align-items:end;justify-content:space-between;gap:24px;margin-bottom:30px}.section-heading h2{margin:10px 0 0;color:var(--dark);font-size:clamp(1.75rem,3vw,2.5rem);font-weight:800}.section-heading p{max-width:330px;margin:0;color:#728391}.short-course-card{height:100%;display:flex;gap:22px;padding:30px;border:1px solid #d6e9f4;border-radius:24px;background:linear-gradient(135deg,#fff 0%,#f8fcff 100%);box-shadow:0 18px 45px #123b6312}.short-course-mark{display:grid;place-items:center;flex:0 0 54px;height:54px;border-radius:16px;background:var(--blue);color:#fff;font-size:1.45rem;box-shadow:0 10px 20px #1769aa2b}.short-course-content{display:flex;flex-direction:column;align-items:flex-start}.course-label{color:var(--blue);font-size:.7rem;font-weight:800;letter-spacing:.13em}.short-course-card h3{margin:8px 0 10px;color:var(--dark);font-size:1.45rem;font-weight:800}.short-course-card p{margin:0;color:#60798a;line-height:1.7}.course-meta{margin:16px 0 20px;color:#42647b;font-size:.9rem;font-weight:600}.btn-course{margin-top:auto;border:1px solid #b7d9eb;color:var(--blue);background:#fff;font-weight:700}.btn-course:hover{color:#fff;background:var(--blue);border-color:var(--blue)}

@media(max-width:576px){.section-heading{display:block}.section-heading p{margin-top:12px}.short-course-card{padding:24px;gap:16px}.short-course-mark{flex-basis:44px;height:44px;border-radius:13px}.short-course-card h3{font-size:1.25rem}}
.course-documents{display:flex;flex-direction:column;gap:6px;margin:0 0 20px;padding:12px 14px;border:1px solid #d6e9f4;border-radius:12px;background:#f7fbfe;font-size:.88rem}.course-documents strong{color:var(--dark);font-size:.9rem}.course-documents a{color:var(--blue);text-decoration:none}.course-documents a:hover{text-decoration:underline}
.section-heading{display:block}.section-heading p{max-width:620px;margin:12px 0 0}
.form-card label.consent{display:flex;align-items:flex-start;gap:12px}.form-card label.consent > input{flex:0 0 auto;margin-right:2px}
.form-card label.consent{flex-wrap:wrap;gap:10px;line-height:1.5}.form-card label.consent > input{margin-top:4px}.form-card label.consent > span{flex:1 1 0;min-width:0;white-space:normal;overflow-wrap:anywhere}.form-card label.consent > .required-marker{flex:0 0 auto;white-space:nowrap}@media(max-width:576px){.form-card label.consent{padding:12px;font-size:.82rem;gap:8px}.form-card label.consent > span{line-height:1.55}}
