/* ==================================================================
   DefaultLanding.css
   Visual refresh for the public landing page (default.aspx) only.
   This file is linked ONLY from default.aspx, so nothing here can
   affect any other page in the site. No markup structure, control
   IDs, postback wiring or validation was touched to achieve this -
   it is a pure CSS "re-skin" of the existing table layout.
   ================================================================== */

html {
    min-height: 100%;
}

body {
    /* Same campus photo used on ParentLogin.aspx, with a dark gradient wash
       so the white cards and text stay readable on top of it. */
    background-image: linear-gradient(180deg, rgba(8, 20, 38, 0.45) 0%, rgba(8, 20, 38, 0.65) 100%), url('../IMAGES/Parentloginbackground.png') !important;
    background-repeat: no-repeat !important;
    background-size: cover !important;
    background-position: center center !important;
    background-attachment: fixed !important;
    min-height: 100vh;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, Arial, sans-serif;
    color: #33383d;
}

/* ---------- Top header banner (logo + title image) ---------- */
.lnmiit-header-row {
    background: rgba(255, 255, 255, 0.92);
    -webkit-backdrop-filter: blur(6px);
    backdrop-filter: blur(6px);
    box-shadow: 0 2px 16px rgba(0, 0, 0, 0.25);
    border-bottom: 4px solid #c0392b;
}

/* ---------- Extra breathing room around the cards over the photo ---------- */
.lnmiit-content-row > td {
    padding-top: 40px !important;
    padding-bottom: 40px !important;
}

/* Field labels (User Type / Username / Password) inside the sign-in card */
.lnmiit-auth-right .login_bg span {
    font-size: 10.5pt;
}

/* ---------- Shared card look for login / news / notice panels ---------- */
table.login_bg,
table.table_bg {
    background-image: none !important;
    border: none !important;
    width: 100% !important;
    height: auto !important;
    background-color: #ffffff;
    border-radius: 12px !important;
    box-shadow: 0 6px 20px rgba(30, 60, 110, 0.12);
    border: 1px solid #e3e9f2 !important;
    overflow: hidden;
}

/* Header row (first row) of each card -> coloured banner */
.lnmiit-panel-header {
    background: linear-gradient(135deg, #2c5aa0, #1e4176) !important;
    color: #ffffff !important;
    font-family: 'Segoe UI', Verdana, Arial, sans-serif !important;
    font-size: 13.5pt !important;
    font-weight: 600 !important;
    letter-spacing: .3px;
    padding: 15px 20px !important;
    text-align: left !important;
    border: none !important;
}

.lnmiit-panel-header hr {
    display: none;
}

.lnmiit-panel-header i {
    margin-right: 8px;
}

/* Body padding inside the news / notice cards */
.table_bg td {
    padding: 10px 14px;
}

/* ---------- Sign-in form ---------- */
.login_bg td {
    padding: 8px 13px;
    font-size: 10.5pt;
}

/* Latest News / Notice Board are hidden by default (client request), leaving
   the Sign-in column as the only one in the row - cap and center it instead
   of letting it stretch across the whole page width. */
table.login_bg,
.lnmiit-quicklinks {
    max-width: 340px;
    margin-left: auto !important;
    margin-right: auto !important;
}

/* ---------- Unified split card: Quick Links (left) + Sign in (right) ---------- */
.lnmiit-auth-card {
    display: flex;
    flex-wrap: wrap;
    max-width: 800px;
    margin: 0 auto !important;
    background: #ffffff;
    border-radius: 15px;
    overflow: hidden;
    box-shadow: 0 15px 40px rgba(0, 0, 0, 0.32);
    text-align: left;
}

.lnmiit-auth-left {
    flex: 1 1 280px;
    background: linear-gradient(160deg, #2c5aa0, #1e4176);
    color: #ffffff;
    padding: 38px 30px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.lnmiit-auth-welcome {
    font-size: 18pt;
    font-weight: 700;
    line-height: 1.35;
    margin-bottom: 26px;
}

.lnmiit-auth-right {
    flex: 1 1 350px;
    background: #ffffff;
}

/* Quick-links, restyled to sit on the dark left panel */
.lnmiit-auth-left .lnmiit-quicklinks {
    background: transparent;
    box-shadow: none;
    border: none;
    padding: 0;
    max-width: none;
    margin: 0 !important;
}

.lnmiit-auth-left .lnmiit-quicklinks-title {
    color: #ffffff;
    text-align: left;
}

.lnmiit-auth-left .lnmiit-quicklink-btn {
    background: rgba(255, 255, 255, 0.12) !important;
    border: 1px solid rgba(255, 255, 255, 0.4) !important;
    color: #ffffff !important;
}

.lnmiit-auth-left .lnmiit-quicklink-btn:hover {
    background: rgba(255, 255, 255, 0.28) !important;
    color: #ffffff !important;
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.25);
}

/* Sign-in table, now nested inside the unified card - drop its own
   standalone card chrome since the outer .lnmiit-auth-card supplies it */
.lnmiit-auth-right table.login_bg {
    border: none !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    margin: 0 !important;
    max-width: none !important;
}

@media (max-width: 700px) {
    .lnmiit-auth-card {
        flex-direction: column;
        max-width: 380px;
    }
}

.unwatermarked,
.watermarked {
    width: 100% !important;
    max-width: 205px;
    height: 35px !important;
    border-radius: 6px !important;
    border: 1px solid #cdd7e3 !important;
    padding: 6px 12px !important;
    box-sizing: border-box;
    font-size: 10.5pt;
    transition: border-color .15s ease, box-shadow .15s ease;
}

.unwatermarked:focus,
.watermarked:focus {
    outline: none;
    border-color: #2c5aa0 !important;
    box-shadow: 0 0 0 3px rgba(44, 90, 160, 0.15);
}

#ddlUserType {
    border-radius: 6px;
    border: 1px solid #cdd7e3;
    padding: 6px 8px;
    height: 35px;
    font-size: 10.5pt;
}

/* The searchable-select widget (see JAVASCRIPTS/searchable-select.js,
   shared site-wide) defaults to a compact size everywhere else - scale
   it up on this page only, scoped under the sign-in card. */
.lnmiit-auth-right .ss-display {
    height: 35px;
    min-width: 165px;
    padding: 5px 10px;
    font-size: 10.5pt;
    border-radius: 6px;
}

.lnmiit-auth-right .ss-caret {
    font-size: 12px;
}

.lnmiit-auth-right .ss-wrapper.ss-auto-width .ss-label {
    max-width: 300px;
}

/* "Sign in" button: outline style (border + text only, no fill) using the
   site's own blue instead of the old solid red - !important is needed
   because the page's own inline <style> block (further down in
   default.aspx's <head>) defines .g-button-red with a solid red
   background/gradient and, being later in source order with the same
   selector specificity, would otherwise win over this stylesheet. */
.g-button-red {
    background: transparent !important;
    background-image: none !important;
    color: #2c5aa0 !important;
    text-shadow: none !important;
    border: 2px solid #2c5aa0 !important;
    box-sizing: border-box !important;
    border-radius: 6px !important;
    font-size: 11pt !important;
    padding: 0 22px !important;
    height: 37px !important;
    line-height: 33px !important;
    box-shadow: none !important;
}

.g-button-red:hover {
    background: #2c5aa0 !important;
    background-image: none !important;
    color: #ffffff !important;
    text-shadow: none !important;
    border-color: #2c5aa0 !important;
    box-shadow: 0 4px 10px rgba(44, 90, 160, 0.35) !important;
}

.g-button-red:active {
    background: #1e4176 !important;
    background-image: none !important;
    border-color: #1e4176 !important;
    color: #ffffff !important;
    box-shadow: none !important;
}

#btnOTP.btn.btn-info {
    border-radius: 6px !important;
    box-shadow: 0 3px 8px rgba(23, 162, 184, 0.35);
}

#Captchaid {
    border-radius: 4px;
    border: 1px solid #cdd7e3;
    background: #fafbfd;
    width: 115px !important;
    height: 30px !important;
}

#imgrefreshlgn {
    font-size: 12.5pt;
}

#imgrefreshlgn {
    color: #2c5aa0 !important;
}

/* ---------- Quick-links panel ---------- */
.lnmiit-quicklinks {
    background: #ffffff;
    border-radius: 12px;
    box-shadow: 0 6px 20px rgba(30, 60, 110, 0.12);
    border: 1px solid #e3e9f2;
    padding: 18px;
}

.lnmiit-quicklinks-title {
    color: #1e4176;
    font-weight: 700;
    font-size: 13.5pt;
    text-align: center;
    margin: 0 0 16px 0;
}

.lnmiit-quicklink-btn {
    display: block !important;
    background: linear-gradient(135deg, #f4f7fb, #e9eff8) !important;
    border: 1px solid #d7e0ec !important;
    border-radius: 8px !important;
    color: #1e4176 !important;
    font-weight: 600 !important;
    font-size: 11.5pt !important;
    text-decoration: none !important;
    text-transform: none !important;
    padding: 13px 16px !important;
    margin-bottom: 12px;
    transition: transform .12s ease, box-shadow .12s ease, background .12s ease, color .12s ease;
}

.lnmiit-quicklink-btn:last-child {
    margin-bottom: 0;
}

.lnmiit-quicklink-btn:hover {
    background: linear-gradient(135deg, #2c5aa0, #1e4176) !important;
    color: #ffffff !important;
    transform: translateY(-2px);
    box-shadow: 0 8px 16px rgba(30, 60, 110, 0.28);
}

.lnmiit-quicklink-btn:before {
    font-family: FontAwesome;
    margin-right: 10px;
    width: 16px;
    display: inline-block;
    text-align: center;
}

#lnkParentLogin:before {
    content: "\f183"; /* fa-user */
}

#lnkCourseRegistration:before {
    content: "\f19d"; /* fa-graduation-cap */
}

#lnkMultimediaStudioBooking:before {
    content: "\f03d"; /* fa-video-camera */
}

/* ---------- Compatibility footer ---------- */
.compatiblity {
    background: linear-gradient(135deg, #2c5aa0, #1e4176) !important;
}

/* ---------- Small screens ---------- */
@media (max-width: 900px) {
    table.login_bg,
    table.table_bg,
    .lnmiit-quicklinks {
        margin-bottom: 14px;
    }
}