﻿/* DRMC Online Admission public pages (Pages/OnlineAdmission), DRMC theme (App_Themes/drmcNew):
   dark teal #1a3c40 / #144d53, green #76a665 / #94bb54, olive #acb66c, orange #db6400; panels / section bars #94bb54 (was cream #e5e4cc, 2026-11-07).
   Own classes only: the theme forces .card height / colours and every link to #e3f0fc (light),
   so links inside the white boxes are coloured again here. */

.oa-page { max-width: none; margin: 22px 0 30px 0; padding: 0 15px; color: #1d2b2c; }
.oa-page a, .oa-page a:visited, .oa-page a:focus { color: #144d53 !important; }
.oa-page a:hover { color: #db6400 !important; }

/* step bar: a white card strip (sharp corners) */
.oa-steps { display: flex; flex-wrap: wrap; justify-content: center; list-style: none; padding: 10px 12px; margin: 0 0 20px 0;
    background: #fff; border: 1px solid #94bb54; border-bottom: 3px solid #94bb54; box-shadow: 0 6px 18px rgba(26, 60, 64, 0.12); }
.oa-steps li { display: flex; align-items: center; color: #6c7a6a; font-size: 13px; font-weight: 600; margin: 4px 6px; }
.oa-steps li span { display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; border-radius: 50%; border: 2px solid #94bb54; background: #fff; margin-right: 7px; font-size: 12px; color: #1a3c40; }
.oa-steps li.done { color: #144d53; }
.oa-steps li.done span { border-color: #76a665; background: #76a665; color: #fff; }
.oa-steps li.active { color: #db6400; }
.oa-steps li.active span { border-color: #db6400; background: #db6400; color: #fff; box-shadow: 0 0 0 3px rgba(219, 100, 0, 0.18); }
.oa-steps li + li:before { content: ""; display: inline-block; width: 22px; height: 2px; background: #94bb54; margin-right: 10px; }

/* card (sharp corners) */
.oa-box { background: #fff; border: 1px solid #94bb54; border-radius: 0; box-shadow: 0 6px 18px rgba(26, 60, 64, 0.16); margin-bottom: 20px; }
.oa-box-title { background: #1a3c40; color: #ffffff; font-weight: bold; font-size: 16px; padding: 12px 20px; border-bottom: 4px solid #94bb54; letter-spacing: .4px; }
.oa-box-title.center { text-align: center; }
.oa-box-body { padding: 22px 30px 8px 30px; }
.oa-box-footer { text-align: center; padding: 14px 30px 20px 30px; border-top: 1px solid #dfe8cf; background: #fbfcf8; }

/* sharp form controls and buttons, DRMC focus colour */
.oa-page .form-control { border-radius: 0; border-color: #c9d6b8; }
.oa-page .form-control:focus { border-color: #76a665; box-shadow: 0 0 0 3px rgba(148, 187, 84, 0.30); }
.oa-page .btn { border-radius: 0; }
.oa-section { background: #8AD6D1; color: #1a3c40; font-weight: bold; padding: 6px 12px; margin: 4px 0 14px 0; border-left: 4px solid #1a3c40; }

/* fields */
.oa-grid { display: flex; flex-wrap: wrap; margin: 0 -10px; }
.oa-field { flex: 1 1 260px; padding: 0 10px; margin-bottom: 16px; }
.oa-field.full { flex-basis: 100%; }
.oa-field.oa-small { flex: 1 1 170px; }
.oa-label { font-weight: bold; margin-bottom: 5px; color: #1a3c40; }
.oa-required { color: #c62828; font-weight: bold; }
.oa-inline label { margin-right: 15px; margin-left: 3px; font-weight: normal; }
.oa-inline input[type=radio] { margin-left: 2px; }
.oa-note { color: #5f6f5a; font-size: 13px; }
.oa-nonid { display: inline-block; margin-top: 6px; font-size: 13px; color: #5f6f5a; }
.oa-nonid label { margin-left: 4px; font-weight: normal; }
.oa-note-bn { font-family: 'Kalpurush', 'Nikosh', 'SolaimanLipi', 'Noto Sans Bengali', sans-serif; font-size: 13px; margin-top: 2px; color: #c62828; font-weight: 600; }
.oa-readonly { background: #94bb54 !important; color: #1a3c40; font-weight: bold; }

/* messages and buttons */
.oa-fee { display: block; text-align: center; font-size: 18px; font-weight: bold; color: #144d53; }
.oa-msg { display: block; text-align: center; margin-top: 4px; }
.oa-btn { min-width: 160px; margin: 4px 6px; border-radius: 0; }
.oa-page .btn-primary { background: #144d53; border-color: #144d53; }
.oa-page .btn-primary:hover, .oa-page .btn-primary:focus { background: #76a665; border-color: #76a665; }
.oa-page .btn-success { background: #76a665; border-color: #76a665; }
.oa-page .btn-success:hover, .oa-page .btn-success:focus { background: #144d53; border-color: #144d53; }
.oa-page .btn-secondary { background: #6c7a6a; border-color: #6c7a6a; }
.oa-continue { text-align: center; margin: 4px auto 20px auto; }
a.oa-link { font-weight: bold; text-decoration: underline !important; }

/* info tables */
/* same light look as .oa-info (Photo / Payment) so every info table is uniform */
.oa-table { width: 100%; margin-bottom: 14px; border-collapse: separate; border-spacing: 0; border: 1px solid #cfe0bd; background: #fff; }
.oa-table td { padding: 8px 14px; border-bottom: 1px solid #e3ecd6; vertical-align: middle; font-size: 14px; color: #1d2b2c; }
.oa-table tr:last-child td { border-bottom: 0; }
.oa-table tr:nth-child(even) td { background: #fbfcf7; }
.oa-table td:first-child { width: 35%; font-weight: 600; background: #f2f7ea; color: #2f5a35; border-left: 4px solid #a9cc8f; border-right: 1px solid #e3ecd6; }
.oa-highlight { font-weight: bold; color: #144d53; }

/* applicant summary of the Photo / Payment steps (OnlineAdmissionHelper.ApplicantInfoTable): light DRMC colours */
.oa-info { width: 100%; margin-bottom: 14px; border-collapse: separate; border-spacing: 0; border: 1px solid #cfe0bd; border-radius: 0; overflow: hidden; background: #fff; }
.oa-info tr.oa-info-roll td { font-weight: bold; font-size: 17px; color: #db6400; letter-spacing: .5px; }
.oa-info th, .oa-info td { padding: 8px 14px; border-bottom: 1px solid #e3ecd6; vertical-align: middle; text-align: left; font-size: 14px; }
.oa-info tr:last-child th, .oa-info tr:last-child td { border-bottom: 0; }
.oa-info th { width: 40%; background: #f2f7ea; color: #2f5a35; font-weight: 600; border-left: 4px solid #a9cc8f; border-right: 1px solid #e3ecd6; }
.oa-info td { color: #1d2b2c; }
.oa-info tr:nth-child(even) td { background: #fbfcf7; }
.oa-info tr.oa-info-name th { background: #fdf3e7; border-left-color: #f0b27a; color: #8a4a12; }
.oa-info tr.oa-info-name td { background: #fffaf3; font-weight: bold; font-size: 15px; color: #1a3c40; }
.oa-info tr.oa-info-ref td { font-weight: bold; color: #144d53; letter-spacing: .5px; }

/* 2026-11-09: applicant summary in TWO columns (Photo / Payment / Download steps), one column on phones.
   Each cell = label | value; ".full" = whole row (Name, Payment). Same light colours as .oa-info. */
.oa-info2 { display: grid; grid-template-columns: 1fr 1fr; margin-bottom: 14px; border: 1px solid #cfe0bd; border-bottom: 0; background: #fff; }
.oa-info2 .oa-i2 { display: flex; min-width: 0; border-bottom: 1px solid #e3ecd6; }
.oa-info2 .oa-i2.full { grid-column: 1 / -1; }
.oa-info2 .oa-i2-l { flex: 0 0 44%; max-width: 44%; padding: 8px 12px; background: #f2f7ea; color: #2f5a35; font-weight: 600; font-size: 14px;
    border-left: 4px solid #a9cc8f; border-right: 1px solid #e3ecd6; display: flex; align-items: center; }
.oa-info2 .oa-i2.full .oa-i2-l { flex-basis: 22%; max-width: 22%; }
.oa-info2 .oa-i2-v { flex: 1 1 auto; min-width: 0; padding: 8px 12px; font-size: 14px; color: #1d2b2c; overflow-wrap: anywhere; display: flex; align-items: center; }
.oa-info2 .oa-i2.oa-info-name .oa-i2-l { background: #fdf3e7; border-left-color: #f0b27a; color: #8a4a12; }
.oa-info2 .oa-i2.oa-info-name .oa-i2-v { background: #fffaf3; font-weight: bold; font-size: 15px; color: #1a3c40; }
.oa-info2 .oa-i2.oa-info-ref .oa-i2-v { font-weight: bold; color: #144d53; letter-spacing: .5px; }
.oa-info2 .oa-i2.oa-info-roll .oa-i2-v { font-weight: bold; font-size: 17px; color: #db6400; letter-spacing: .5px; }
@media (max-width: 767px) {
    .oa-info2 { grid-template-columns: 1fr; }
    .oa-info2 .oa-i2.full .oa-i2-l { flex-basis: 44%; max-width: 44%; }
    .oa-info2 .oa-i2.oa-i2-empty { display: none; }
}

/* validation (online-admission.js) */
[data-oa-required].is-invalid:not(.form-control) { display: inline-block; outline: 1px solid #dc3545; outline-offset: 4px; }
.form-inline .invalid-feedback { width: 100%; }
select.form-control.is-valid, select.form-control.is-invalid { background-image: none !important; padding-right: .75rem !important; }

/* date of birth: day / month / year */
.oa-dob { display: flex !important; flex-wrap: wrap; width: 100%; }
.oa-dob select.form-control { display: block; flex: 1 1 0; width: auto; min-width: 0; margin-right: 6px; padding-left: 6px; padding-right: 2px; }
.oa-dob select.oa-dob-month { flex-grow: 1.3; }
.oa-dob select:last-of-type { margin-right: 0; }
.oa-dob .invalid-feedback { flex-basis: 100%; }

/* checkbox with text */
.oa-check input[type=checkbox] { margin-right: 6px; vertical-align: middle; }
.oa-check label { margin-bottom: 0; vertical-align: middle; }
.oa-declaration label { color: #c62828; font-weight: bold; }

/* Reference No banner */
.oa-tracking { background: #fff7ec; border: 1px solid #f2c48d; border-left: 4px solid #db6400; padding: 10px 14px; margin-bottom: 14px; }
.oa-tracking .oa-tracking-id { font-size: 18px; font-weight: bold; color: #1a3c40; letter-spacing: 1px; }
.oa-tracking-note { display: block; color: #7a4a10; font-size: 13px; margin-top: 3px; }

/* photo */
.oa-photo { width: 150px; height: 170px; object-fit: cover; border: 1px solid #94bb54; background: #94bb54; }
.oa-photo-empty { display: inline-flex; align-items: center; justify-content: center; color: #6c7a6a; font-size: 13px; }
.oa-preview-note { color: #7a4a10; font-size: 12px; margin-top: 6px; }

@media (max-width: 576px) {
    .oa-box-body { padding: 16px 14px 4px 14px; }
    .oa-box-footer { padding: 10px 14px 18px 14px; }
    .oa-steps li + li:before { width: 8px; margin-right: 6px; }
    .oa-dob select.form-control { font-size: 14px; padding-left: 4px; margin-right: 4px; }
}

.oa-page .alert { border-radius: 0; }

/* Download step: success banner */
.oa-done { text-align: center; color: #1a3c40; font-weight: bold; font-size: 17px; margin-bottom: 16px; padding: 10px 14px;
    background: #eef6e4; border: 1px solid #94bb54; border-left: 5px solid #76a665; }
