@import url('https://fonts.googleapis.com/css?family=Montserrat:600,700&display=swap');  
  
:root {  
  --main: #138fc9;  
  --main-dark: #0c3658;  
  --accent: #10adc4;  
  --white: #fff;  
  --gray: #f7fafc;  
  --line: #e0eaf3;  
  --shadow: rgba(19, 143, 201, 0.07);  
  --radius: 1.08rem;  
  --radius-table: 1.1em;  
  --warn: #ffeaea;  
  --warn-line: #ffd1d1;  
  --success: #e7ffe4;  
  --wait: #e3f3fb;  
}  
  
body {  
  font-family: 'Montserrat', Arial, sans-serif;  
  background: linear-gradient(116deg, var(--main) 0%, var(--accent) 100%);  
  margin: 0;  
  min-height: 100vh;  
  color: var(--main-dark);  
}  
  
/* Layout grid */  
.admin-shell {  
  display: flex;  
  min-height: 100vh;  
}  
.sidebar {  
  background: linear-gradient(120deg,#1282b0 50%,#10adc4 100%);  
  min-width:230px;  
  width:260px;  
  display:flex;  
  flex-direction:column;  
  align-items:center;  
  padding:1.7em 0 0;  
  box-shadow: 2px 0 20px #0d3b631a;  
}  
.sidebar-heading {  
  color: #fff;  
  font-size: 1.55rem;  
  font-weight: 700;  
  letter-spacing: .5px;  
  margin-bottom: 2em;  
  text-shadow: 0 2px 4px #138fc933;  
}  
.sidebar-nav {  
  display: flex;  
  flex-direction:column;  
  width:90%;  
  gap:.6em  
}  
.sidebar-link {  
  color: #e0f5ff;  
  text-decoration: none;  
  padding: .65em 1.2em;  
  border-radius: 2em;  
  font-weight: 600;  
  font-size: 1rem;  
  margin-bottom: 1.2em;  
  transition: background .15s, color .13s;  
  display: flex;  
  align-items: center;  
  gap:.8em;  
}  
.sidebar-link.active, .sidebar-link:hover {  
  background: var(--accent);  
  color: #fff;  
  box-shadow: 0 1px 10px #0e538613;  
}  
.sidebar-user {  
  margin-top:auto;  
  margin-bottom:2em;  
  color:#e6fcff;  
  font-size:.98em;  
  text-align:center;  
  word-break:break-all;  
}  
.mainframe {  
  width:100%;  
  max-width: calc(100vw - 260px);  
  background:#f7fafc;  
  padding:0;  
  display: flex;  
  justify-content: center;  
  align-items: flex-start;  
  min-height: 100vmin;  
}  
  
@media (max-width: 900px) {  
  .sidebar { display:none;}  
  .mainframe { max-width:100vw;}  
}  
@media (max-width: 600px) {  
  .mainframe {padding:0;}  
}  
  
/* Main Dash Card */  
.dash-card {  
  margin: 2.5em auto;  
  padding: 2.3em 1.8em;  
  border-radius: var(--radius);  
  background: var(--white);  
  box-shadow: 0 6px 40px var(--shadow);  
  width: 100%;  
  max-width: 1100px;  
}  
  
.d-title {  
  color:var(--main-dark);  
  font-size:1.8em;  
  font-weight:700;  
  margin-bottom:.15em;  
}  
.d-welcome {  
  margin-bottom:.7em;  
  color:var(--accent);  
  font-size:1.1em;  
}  
  
.stats-row {  
  display:flex; gap:1.5em; margin-bottom:2.3em;  
  flex-wrap:wrap;  
}  
.stat-mini {  
  flex:1 1 180px;  
  background: var(--gray);  
  border-radius: .95em;  
  padding: .98em 1.45em;  
  display:flex;align-items:center;gap:1.1em;  
  box-shadow: 0 2px 7px #1695ca0f;  
  font-weight:600;  
  transition:transform .11s;  
}  
.stat-mini i {  
  font-size:2em;color:var(--main-dark);  
  margin-right: .5em;  
}  
.stat-mini .sm-title { font-size:.99em;color:var(--main-dark);}  
.stat-mini .sm-val{font-size:1.33em;font-weight:700;margin-left:1.15em;letter-spacing:2px;color:var(--accent);}  
.stat-mini:hover {transform:scale(1.03);}  
@media (max-width:805px){ .stats-row{flex-direction:column;} .stat-mini{margin-bottom:.5em;} }  
  
.card-actions-bar {  
  display:flex; gap:.9em; align-items:center; margin-bottom:1.8em; margin-top:.7em;  
  flex-wrap:wrap;  
}  
  
.s-input {  
  border:1.7px solid #c6e3f6;  
  border-radius:.7em;  
  padding:.79em 1.1em;  
  font-size:1em;  
  background:#fafdff;  
  margin-right:.7em;  
  min-width:230px;max-width:330px;width:100%;  
  transition:border .17s;  
}  
.s-input:focus { border-color: var(--main); outline: none;}  
a.button, .button { display:inline-block; padding:.7em 1.56em; border: none;  
    font-size: 1.02rem;border-radius:.7em;font-weight:600;background:var(--main);color:var(--white);  
    cursor:pointer;text-decoration:none;transition:background .15s, box-shadow .16s;box-shadow:0 2px 8px 0 var(--shadow);}  
.button.accent {background:var(--accent);}  
.button.outline {background:var(--white);color:var(--main-dark);border:1.6px solid var(--accent);}  
.button:hover, .button:focus {background:var(--main-dark);}  
.button .material {font-size:1.06em;vertical-align:-5%;margin-right:.56em;}  
.button[disabled] { background: #b9c7d3; color:#fff; cursor: not-allowed;}  
  
.d-table-wrap {overflow-x:auto;border-radius:var(--radius-table);margin-bottom:1.2em;}  
.d-table {  
  width:100%;border-collapse:separate;border-spacing:0;  
  margin-bottom:1em;  
  background:#fffc;  
  border-radius:var(--radius-table);  
  box-shadow: 0 3px 32px #0b242c09;  
}  
.d-table th, .d-table td {  
  padding:.97em .85em;  
}  
.d-table th {  
  font-weight: 600;  
  background: #f7fafb;  
  font-size: 1em;  
  color: #205079;  
}   
.d-table tr {  
  transition: background .12s;  
}  
.d-table tbody tr:hover {  
  background:#eaf8fb;  
}  
.d-table td {  
  font-weight: 400;   /* Normal */  
  font-size: 1em;     /* Not too big; adjust as desired */  
  color: #273950;     /* or your main text color */  
  vertical-align: middle;  
  padding: 0.65em 0.7em; /* for better spacing */  
  background: #fff;   /* or transparent, as you wish */  
}  
.d-table tr:nth-child(even) td {  
  background:#f7fafc;  
}  
.d-table td .badge {  
  display: inline-block;  
  font-size:.93em;  
  background: var(--accent);  
  color: white;  
  font-weight: 600;  
  border-radius:1em;  
  padding:.24em .85em;  
  margin:0 .17em;  
}  
.d-table td .tag {  
  background: #effcff; color:var(--accent);  
  padding:.23em .7em; border-radius:.85em;font-weight:600;margin:0 .17em;  
}  
.d-table .actions {display:flex;gap:.55em;}  
/* Avatar for candidate */  
.d-table td .avatar {  
  width:2.2em;height:2.2em;border-radius:50%; vertical-align:middle; margin-right:.7em;  
  box-shadow: 0 1px 6px #1695ca13;  
  background: #d1eefd;  
}  
/* Empty state */  
.d-table tr.no-data td {  
  text-align:center;padding:2em 1em;  
  color:#b1bed4;  
  background: #e4f3fb;  
  font-size:1.17em;  
  font-style:italic;  
}  
.illustr {  
  display:inline-block;width:98px;height:98px;vertical-align:middle;background:url('data:image/svg+xml;utf8,<svg width="90" height="90"...') center/contain no-repeat;  
  opacity:0.7;  
}  
@media (max-width:500px){  
  .dash-card{padding:.5em .3em;}  
  .d-table th,.d-table td{padding:.69em .19em;}  
}  

/* FORM CONTAINER CARD */  
.form-card {  
  max-width: 430px;  
  margin: 4em auto 0 auto;  
  background: #fff;  
  border-radius: .74em;  
  box-shadow: 0 8px 48px var(--shadow), 0 1.5px 0 #edf4fa;  
  padding: 2.3em 2.1em 2.2em 2.1em;  
  display: flex;  
  flex-direction: column;  
  gap: 1.45em;  
  align-items: stretch;  
}  
  
@media (max-width:600px) {  
  .form-card {  
    margin: 2.4em 0.5em 0 0.5em;  
    padding: 1.15em .55em;  
    max-width: 98vw;  
  }  
}  
  
/* FORM TITLE */  
.form-card .form-title {  
  font-size: 1.58em;  
  font-weight: 700;  
  color: var(--main-dark);  
  margin-bottom: .7em;  
  text-align: center;  
  margin-top: .23em;  
}  
  
/* EXTRA TEXT (subtitle, link) */  
.form-card .form-subtext {  
  font-size: .98em;  
  color: var(--main);  
  text-align: center;  
  margin-top: -0.7em;  
  margin-bottom: .5em;  
}  
  
/* FORM FIELD */  
.form-field {  
  margin-bottom: 1em;  
  display: flex;  
  flex-direction: column;  
  gap: .33em;  
}  
  
.form-field label {  
  font-size: .97em;  
  color: var(--main-dark);  
  font-weight: 600;  
  margin-bottom: .17em;  
  letter-spacing:.13px;  
}  
  
.form-card input[type="text"],  
.form-card input[type="email"],  
.form-card input[type="password"],  
.form-card input[type="file"] {  
  border: 1.4px solid #ddeef7;  
  border-radius: .39em;  
  font-size: 1.08em;  
  padding: .93em 1.12em;  
  background: #fafdff;  
  font-family: inherit;  
  transition: border-color .18s, box-shadow .2s;  
  color: var(--main-dark);  
}  
  
.form-card input[type="text"]:focus,  
.form-card input[type="email"]:focus,  
.form-card input[type="password"]:focus,  
.form-card input[type="file"]:focus {  
  border-color: var(--main);  
  outline: none;  
  box-shadow: 0 1px 7px #138fc930;  
}  
  
.form-card input[type="file"] {  
  padding: .60em 1em;  
  font-size: 1em;  
}  
  
/* BUTTONS */  
.form-card .button, .form-card button[type="submit"] {  
  width: 100%;  
  border-radius: .47em;  
  font-size: 1.09em;  
  padding: .87em;  
  letter-spacing: .04em;  
}  
  
/* BUTTON ACCENT */  
.form-card .button.accent {  
  background: var(--main);  
  color: #fff;  
}  
.form-card .button.accent:hover,  
.form-card .button.accent:focus {  
  background: var(--main-dark);  
}  
  
/* FORM ERROR/SUCCESS */  
.form-error, .form-success {  
  background: #ffeaea;  
  color: #e00d48;  
  border: 1.2px solid #ffd0d0;  
  border-radius: .43em;  
  padding: .78em 1.1em;  
  font-size: .98em;  
  margin-bottom: .23em;  
  text-align: center;  
}  
.form-success {  
  background: #e7ffe4;  
  color: #14b849;  
  border-color: #baffc6;  
}  
  
/* ALTERNATE (link) */  
.form-link {  
  text-align: center;  
  margin-top: 1em;  
  color: var(--main-dark);  
  font-size: .97em;  
}  
.form-link a {  
  color: var(--accent);  
  text-decoration: none;  
  font-weight: 600;  
  margin-left: .4em;  
  transition: color .18s;  
}  
.form-link a:hover { text-decoration: underline; color: var(--main); }  
  
@media (max-width:470px) {  
  .form-card .form-title { font-size: 1.22em; }  
  .form-card input, .form-card button { font-size: 1em; }  
  .form-card { padding: .69em .11em; }  
}  
  
/* Optional: Animate form pop-in */  
@media (prefers-reduced-motion: no-preference) {  
  .form-card {  
    animation: formPop 0.56s cubic-bezier(.74,1.85,.62,1.06) 1;  
  }  
}  
@keyframes formPop {  
  0% { opacity:0; transform:scale(.97) translateY(30px);}  
  100% { opacity:1; transform:scale(1) translateY(0);}  
}  