/* =========================================================
   Professional UI theme - Online Admission
   Loaded AFTER weaver.css / master.css to override legacy look.
   ========================================================= */
:root {
    --brand: #1e3a5f;
    --brand-dark: #14283f;
    --brand-light: #2c5282;
    --accent: #c9a227;
    --accent-dark: #a8851a;
    --bg: #f3f5f9;
    --card: #ffffff;
    --text: #1f2937;
    --muted: #6b7280;
    --border: #d9dee7;
    --danger: #c53030;
    --success: #2f855a;
    --radius: 8px;
    --shadow: 0 2px 10px rgba(20, 40, 63, .08);
    --shadow-lg: 0 8px 28px rgba(20, 40, 63, .14);
}

html { font-size: 100%; }
html * { font-family: "Segoe UI", "Open Sans", OpenSansRegular, Roboto, Arial, sans-serif; }

body {
    background: var(--bg) !important;
    background-image: none !important;
    color: var(--text);
    line-height: 1.5;
    padding-bottom: 50px;
    -webkit-font-smoothing: antialiased;
}

a { color: var(--brand-light); transition: color .2s; }
a:hover { color: var(--accent-dark); }

/* ---------- Header ---------- */
header {
    background: #fff !important;
    border-bottom: 3px solid var(--accent);
    box-shadow: var(--shadow);
}
.headerImg { max-width: 100%; height: auto; display: block; margin: 0 auto; }
.mainlable, .divHead {
    color: var(--brand) !important;
    font-size: 20px !important;
    font-weight: 600;
    letter-spacing: .6px;
    text-transform: uppercase;
    padding: 10px 12px !important;
    text-align: center;
}

/* ---------- Navigation ---------- */
nav {
    background: var(--brand) !important;
    box-shadow: none !important;
    margin-bottom: 0 !important;
}
header { margin-bottom: 24px; }
.nav a {
    color: #fff !important;
    text-shadow: none !important;
    font-size: 14px !important;
    font-weight: 500;
    letter-spacing: .4px;
    padding: 13px 22px !important;
    transition: background .2s, color .2s;
}
.nav a:hover, .nav li.active > a {
    background: var(--brand-dark) !important;
    color: var(--accent) !important;
}
.toggleMenu { background: var(--brand-dark) !important; color: #fff !important; }
.blink, .nav .blink { animation: none !important; -webkit-animation: none !important; opacity: 1 !important; font-weight: 600; color: var(--accent) !important; }
.nav li li a { background: var(--brand-dark) !important; }

/* ---------- Footer ---------- */
footer {
    background: var(--brand-dark) !important;
    color: #cfd8e3;
    padding: 6px 10px !important;
    z-index: 50;
}
footer p, footer p * { color: #cfd8e3 !important; font-size: 12px !important; }

/* ---------- Cards / form containers ---------- */
.myform, .myform1, .myform2, .box, .panelbox, .queryform, .forms-sign-up2 {
    background: var(--card) !important;
    border: 1px solid var(--border) !important;
    border-radius: var(--radius) !important;
    box-shadow: var(--shadow) !important;
}
.myform { padding: 20px !important; }
.myform h1 {
    background: var(--brand) !important;
    color: #fff !important;
    font-size: 14px !important;
    letter-spacing: .8px;
    border-radius: 4px;
    padding: 9px 12px !important;
}
.myform label, .myform2 label, label {
    color: var(--text) !important;
    font-size: 13px !important;
    font-weight: 600;
}
.myform label sup, sup { color: var(--danger) !important; }
.myform1 th, .myform2 th, .mytable th {
    background: var(--brand) !important;
    color: #fff !important;
    border-radius: 0 !important;
    font-weight: 600;
    padding: 8px 10px;
}
/* Instruction popup table: light, readable */
.grid, table.grid {
    background: #fff !important;
    color: var(--text) !important;
    border: 0 !important;
    font-size: 14px !important;
    font-weight: 400 !important;
    padding: 0 !important;
}
.grid th {
    background: #eef2f7 !important;
    color: var(--brand) !important;
    border-left: 4px solid var(--accent) !important;
    padding: 8px 12px !important;
    text-align: left;
}
.grid th h6, .grid th h6[style] { color: var(--brand) !important; float: none !important; font-size: 15px; font-weight: 700; margin: 0; text-transform: uppercase; letter-spacing: .5px; }
.grid td { color: var(--text) !important; padding: 8px 12px !important; line-height: 1.6; }
.grid td[style] { color: var(--danger) !important; }
.grid h6 { font-size: 14px; font-weight: 600; color: var(--text); }
.grid ol, .grid ol li { color: var(--text) !important; font-family: inherit !important; font-size: 14px !important; min-height: 0 !important; margin-bottom: 4px; }
.grid ol { padding-left: 22px; margin: 4px 0; }
.forms-sign-up2 { background: #fff !important; box-shadow: none !important; border: 1px solid var(--border) !important; margin-top: 0 !important; }
#popInstruct { height: 380px !important; border-radius: 6px; }
#popInstruct::-webkit-scrollbar { width: 8px; }
#popInstruct::-webkit-scrollbar-thumb { background: #b8c2d0; border-radius: 4px; }
.popupRegister { background: #fff !important; width: 640px !important; max-width: 94vw; height: auto !important; left: 50% !important; transform: translateX(-50%); top: 8% !important; }
#popupMsgAlert { width: 360px !important; top: 30% !important; }
#popupMsgAlert #lblMsgAlert { color: var(--brand) !important; font-family: inherit !important; }

/* Registration wizard */
#msform { margin: 24px auto !important; }
#msform fieldset { border-radius: var(--radius) !important; box-shadow: var(--shadow) !important; border: 1px solid var(--border) !important; padding: 14px !important; }
#msform .action-button { width: auto !important; min-width: 110px; }
#progressbar li { color: var(--muted) !important; font-size: 12px !important; letter-spacing: .5px; }
#progressbar li:before { background: #dfe4ec !important; color: var(--muted) !important; width: 34px !important; line-height: 34px !important; }
#progressbar li:after { background: #dfe4ec !important; top: 17px !important; height: 3px !important; }
#progressbar li.active { color: var(--brand) !important; }
#progressbar li.active:before, #progressbar li.active:after { background: var(--brand) !important; color: #fff !important; }
.textform, .dropSelect {
    border: 1px solid var(--border) !important;
    border-radius: 6px !important;
    margin: 4px 0 12px !important;
    padding: 6px 10px !important;
    height: 38px !important;
    font-size: 14px !important;
}
input[type=text] { margin: 4px 0 12px; height: 38px; font-size: 14px !important; border-width: 1px !important; }
textarea { border: 1px solid var(--border) !important; border-radius: 6px !important; width: 100% !important; }
.myform label { text-align: left; display: block; margin-top: 4px; }
.myform h1 { margin: 0 0 16px !important; }
.box td, .box p, .box b { color: var(--text) !important; font-family: inherit !important; }
.title { color: var(--brand) !important; font-family: inherit !important; }

/* ---------- Form controls ---------- */
input[type=text], input[type=password], input[type=email], input[type=number],
input[type=date], input[type=tel], input[type=file], select, textarea,
.input-text, .form-control {
    border: 1px solid var(--border) !important;
    border-radius: 6px !important;
    background: #fff;
    color: var(--text);
    padding: 7px 10px;
    font-size: 14px;
    min-height: 36px;
    outline: none;
    transition: border-color .2s, box-shadow .2s;
}
input[type=text]:focus, input[type=password]:focus, input[type=email]:focus,
input[type=number]:focus, input[type=date]:focus, input[type=tel]:focus,
select:focus, textarea:focus, .form-control:focus {
    border-color: var(--brand-light) !important;
    box-shadow: 0 0 0 3px rgba(44, 82, 130, .18) !important;
}
input:disabled, select:disabled, textarea:disabled { background: #eef0f4; color: var(--muted); }

/* ---------- Buttons ---------- */
input[type=submit], input[type=button], button, .btn, .button, .example_b, .example_c {
    background: var(--brand) !important;
    color: #fff !important;
    border: 0 !important;
    border-radius: 6px !important;
    box-shadow: none !important;
    cursor: pointer;
    font-size: 14px !important;
    font-weight: 600 !important;
    letter-spacing: .4px;
    height: auto !important;
    min-height: 36px;
    padding: 8px 20px !important;
    text-transform: uppercase;
    transition: background .2s, transform .1s, box-shadow .2s;
}
input[type=submit]:hover, input[type=button]:hover, button:hover,
.btn:hover, .button:hover, .example_b:hover, .example_c:hover {
    background: var(--accent-dark) !important;
    color: #fff !important;
    box-shadow: 0 4px 12px rgba(20, 40, 63, .2) !important;
}
input[type=submit]:active, input[type=button]:active, button:active { transform: translateY(1px); }
input[type=submit]:disabled, input[type=button]:disabled, button:disabled { background: #9aa5b5 !important; cursor: not-allowed; }

/* ---------- Tables / grids ---------- */
table { border-collapse: collapse; }
.GridView, table[id*=Grid], table[id*=grd], table[id*=gv] {
    width: 100%;
    background: #fff;
    border: 1px solid var(--border);
    border-radius: var(--radius);
    overflow: hidden;
}
table[id*=Grid] th, table[id*=grd] th, table[id*=gv] th { background: var(--brand); color: #fff; padding: 9px 10px; font-size: 13px; }
table[id*=Grid] td, table[id*=grd] td, table[id*=gv] td { padding: 8px 10px; border-bottom: 1px solid #edf0f5; font-size: 13px; }
table[id*=Grid] tr:nth-child(even) td, table[id*=grd] tr:nth-child(even) td, table[id*=gv] tr:nth-child(even) td { background: #f8fafc; }
table[id*=Grid] tr:hover td, table[id*=grd] tr:hover td, table[id*=gv] tr:hover td { background: #eef3fa; }

/* ---------- Messages ---------- */
span[id*=lblMsg], span[id*=literr], span[id*=lblErr], .error { color: var(--danger); font-weight: 600; }

/* ---------- Popups ---------- */
.popupRegister {
    border-radius: var(--radius) !important;
    border-top: 6px solid var(--accent) !important;
    box-shadow: var(--shadow-lg) !important;
}
.hider { background-color: rgba(20, 40, 63, .65) !important; }

/* ---------- Login page ---------- */
.logindivform {
    background: #fff !important;
    border-top: 5px solid var(--accent);
    border-radius: 10px !important;
    box-shadow: var(--shadow-lg) !important;
    padding: 28px 26px !important;
    color: var(--text) !important;
}
.form-style-1 td { padding-top: 14px !important; }
td.login { background-color: transparent !important; padding: 0 !important; height: 90px !important; }
.login-title { text-align: center; color: var(--brand); font-size: 20px; font-weight: 700; letter-spacing: .5px; margin: 0; }
.login-sub { text-align: center; color: var(--muted); font-size: 13px; margin: 2px 0 0; }
.form-style-1 input[type=text], .form-style-1 input[type=password] { width: 100%; padding: 10px 12px; }

/* ---------- Home page cards ---------- */
.tab1, .div {
    background: var(--card) !important;
    border: 1px solid var(--border) !important;
    border-top: 4px solid var(--brand) !important;
    border-radius: var(--radius) !important;
    box-shadow: var(--shadow) !important;
    color: var(--text) !important;
}
.newa { color: var(--brand) !important; }

/* ---------- Progress bar (registration steps) ---------- */
#progressbar li.active:before, #progressbar li.active:after { background: var(--brand) !important; color: #fff !important; }

/* ---------- Responsive ---------- */
@media only screen and (max-width: 750px) {
    .mainlable, .divHead { font-size: 14px !important; }
    .nav a { padding: 11px 16px !important; }
    input[type=text], input[type=password], select, textarea { width: 100%; }
    .tab1, .div { width: 100% !important; margin-left: 0 !important; margin-right: 0 !important; height: auto !important; }
}

/* ---------- Print: keep receipts clean ---------- */
@media print {
    body { background: #fff !important; padding: 0; }
    header, nav, footer { box-shadow: none !important; }
}
