/* ============================================================
   PM Internship Matching System — Base Styles
   Vibrant Student-Friendly Theme
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap');

:root {
  --bg-primary: #0a0f1e;
  --bg-card: #141e3c;
  --bg-dark: #0a0f1e;
  --color-primary: #00d4ff;
  --color-secondary: #7b61ff;
  --color-accent: #00d4ff;
  --color-text: #e2e8f0;
  --color-text-muted: #64748b;
  --color-text-light: #ffffff;
  --border-color: rgba(255,255,255,.1);
  --border-color-dark: rgba(255,255,255,.15);
  --shadow: 0 4px 20px rgba(0,0,0,.4);
  --shadow-lg: 0 12px 50px rgba(0,0,0,.5);
  --gradient-primary: linear-gradient(135deg, #00d4ff, #7b61ff);
}

* { margin:0; padding:0; box-sizing:border-box; }

body {
  font-family: 'Inter', sans-serif;
  background-color: var(--bg-primary);
  color: var(--color-text);
  line-height: 1.65;
  min-height: 100vh;
}

h1,h2,h3,h4,h5,h6 { font-weight:600; color:#fff; margin-bottom:.75rem; }
h1 { font-size:2.5rem; }
h2 { font-size:2rem; }
h3 { font-size:1.5rem; }
h4 { font-size:1.25rem; }

.text-primary { color: var(--color-primary) !important; }
.text-secondary { color: var(--color-secondary) !important; }
.text-muted { color: var(--color-text-muted) !important; }
.text-accent { color: var(--color-accent) !important; }

.container { max-width:1200px; margin:0 auto; padding:0 1rem; }

/* Navbar (dark by default) */
.navbar { background-color:rgba(5,8,22,.8) !important; border-bottom:1px solid var(--border-color); backdrop-filter:blur(20px); }
.navbar-brand { color:#fff !important; font-weight:700; font-size:1.5rem; }
.navbar-nav .nav-link { color:rgba(255,255,255,.7) !important; font-weight:500; transition:color .3s; }
.navbar-nav .nav-link:hover { color:#fff !important; }
.navbar-nav .nav-link.active { color:var(--color-accent) !important; }

/* Cards */
.card { background:rgba(15,23,42,.65); border:1px solid var(--border-color); border-radius:16px; backdrop-filter:blur(12px); box-shadow:var(--shadow); transition:transform .3s,box-shadow .3s; }
.card:hover { transform:translateY(-2px); box-shadow:var(--shadow-lg); }
.card-header { background:rgba(255,255,255,.03); border-bottom:1px solid var(--border-color); font-weight:600; color:#e2e8f0; }
.card-body { padding:1.5rem; }

/* Buttons */
.btn { font-weight:600; border-radius:12px; padding:.75rem 1.5rem; transition:all .3s; display:inline-flex; align-items:center; gap:.5rem; border:none; cursor:pointer; }
.btn-primary { background:var(--gradient-primary); color:#fff; box-shadow:0 2px 16px rgba(0,212,255,.25); }
.btn-primary:hover { box-shadow:0 6px 24px rgba(0,212,255,.4); transform:translateY(-2px); }
.btn-secondary { background:rgba(123,97,255,.15); color:#7b61ff; border:1px solid rgba(123,97,255,.3); }
.btn-secondary:hover { background:#7b61ff; color:#fff; }
.btn-outline-primary { background:transparent; color:#00d4ff; border:1.5px solid rgba(0,212,255,.4); }
.btn-outline-primary:hover { background:rgba(0,212,255,.1); border-color:#00d4ff; }
.btn-outline-secondary { background:transparent; color:#94a3b8; border:1.5px solid var(--border-color); }
.btn-outline-secondary:hover { background:rgba(255,255,255,.06); border-color:rgba(255,255,255,.2); color:#fff; }
.btn-success { background:#00ff88; color:#050816; }
.btn-success:hover { box-shadow:0 4px 20px rgba(0,255,136,.35); }
.btn-danger { background:#ff0080; color:#fff; }
.btn-danger:hover { box-shadow:0 4px 20px rgba(255,0,128,.35); }
.btn-warning { background:#ffaa00; color:#050816; }
.btn-warning:hover { box-shadow:0 4px 20px rgba(255,170,0,.35); }
.btn-sm { padding:.375rem 1rem; font-size:.8125rem; }
.btn-lg { padding:.875rem 2rem; font-size:1rem; }

/* Forms */
.form-control,.form-select { background:rgba(15,23,42,.8); border:1.5px solid var(--border-color); color:#e2e8f0; border-radius:12px; padding:.75rem 1rem; transition:border-color .3s; }
.form-control:focus,.form-select:focus { border-color:#00d4ff; box-shadow:0 0 0 3px rgba(0,212,255,.15); outline:none; background:rgba(15,23,42,.95); }
.form-control::placeholder { color:#334155; }
.form-label { color:#e2e8f0; font-weight:600; font-size:.8125rem; }
.form-check-input { background-color:rgba(15,23,42,.8); border-color:var(--border-color); }
.form-check-input:checked { background-color:#00d4ff; border-color:#00d4ff; }
.form-check-label { color:#94a3b8; }

/* Stat Cards */
.stat-card { background:rgba(15,23,42,.65); border:1px solid var(--border-color); border-radius:20px; padding:1.5rem; text-align:center; transition:transform .3s,box-shadow .3s; }
.stat-card:hover { transform:translateY(-3px); box-shadow:var(--shadow-lg); }
.stat-number { font-size:2.5rem; font-weight:800; background:linear-gradient(135deg,#00d4ff,#7b61ff); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; margin-bottom:.25rem; }
.stat-label { font-size:.75rem; color:#64748b; text-transform:uppercase; letter-spacing:1.5px; font-weight:600; }

/* Tables */
.table { color:#e2e8f0; }
.table th { background:rgba(255,255,255,.03); border-color:var(--border-color); color:#94a3b8; font-weight:600; font-size:.75rem; text-transform:uppercase; letter-spacing:1px; }
.table td { border-color:rgba(255,255,255,.05); vertical-align:middle; }
.table-hover tbody tr:hover { background:rgba(0,212,255,.04); }

/* Badges */
.badge { font-weight:600; padding:.375rem .75rem; border-radius:6px; font-size:.75rem; }
.badge.bg-primary { background:rgba(0,212,255,.15) !important; color:#00d4ff !important; border:1px solid rgba(0,212,255,.25); }
.badge.bg-secondary { background:rgba(123,97,255,.15) !important; color:#7b61ff !important; border:1px solid rgba(123,97,255,.25); }
.badge.bg-success { background:rgba(0,255,136,.12) !important; color:#00ff88 !important; border:1px solid rgba(0,255,136,.2); }
.badge.bg-warning { background:rgba(255,170,0,.12) !important; color:#ffaa00 !important; border:1px solid rgba(255,170,0,.2); }
.badge.bg-info { background:rgba(0,212,255,.12) !important; color:#00d4ff !important; border:1px solid rgba(0,212,255,.2); }
.badge.bg-danger { background:rgba(255,0,128,.12) !important; color:#ff0080 !important; border:1px solid rgba(255,0,128,.2); }

/* Skill Tags */
.skill-tag { display:inline-flex; background:rgba(0,212,255,.12); color:#00d4ff; padding:.375rem .875rem; border-radius:50px; font-size:.8125rem; font-weight:600; border:1px solid rgba(0,212,255,.2); }
.skill-tag.secondary { background:rgba(123,97,255,.12); color:#7b61ff; border-color:rgba(123,97,255,.2); }

/* Match Items */
.match-item { background:rgba(15,23,42,.65); border:1px solid var(--border-color); border-radius:20px; padding:1.5rem; margin-bottom:1rem; transition:all .3s; }
.match-item:hover { border-color:rgba(0,212,255,.2); box-shadow:var(--shadow-lg); transform:translateX(4px); }
.match-score { font-size:2rem; font-weight:800; background:linear-gradient(135deg,#00d4ff,#7b61ff); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
.match-rank { background:linear-gradient(135deg,#00d4ff,#7b61ff); color:#fff; border-radius:50%; width:48px; height:48px; display:flex; align-items:center; justify-content:center; font-weight:700; box-shadow:0 4px 16px rgba(0,212,255,.3); }

/* Progress */
.progress { background:rgba(255,255,255,.06); border-radius:50px; height:8px; }
.progress-bar { background:linear-gradient(90deg,#00d4ff,#7b61ff); border-radius:50px; }

/* Alerts */
.alert { border-radius:12px; border:none; padding:1rem 1.25rem; margin-bottom:1rem; font-weight:500; }
.alert-success { background:rgba(0,255,136,.08); color:#00ff88; border-left:3px solid #00ff88; }
.alert-danger { background:rgba(255,0,128,.08); color:#ff0080; border-left:3px solid #ff0080; }
.alert-warning { background:rgba(255,170,0,.08); color:#ffaa00; border-left:3px solid #ffaa00; }
.alert-info { background:rgba(0,212,255,.08); color:#00d4ff; border-left:3px solid #00d4ff; }

/* Dropdowns */
.dropdown-menu { background:rgba(15,23,42,.95); border:1px solid var(--border-color); border-radius:12px; box-shadow:var(--shadow-lg); max-height:200px; overflow-y:auto; backdrop-filter:blur(16px); }
.dropdown-item { padding:.75rem 1rem; color:#94a3b8; transition:background .2s; }
.dropdown-item:hover { background:rgba(0,212,255,.1); color:#00d4ff; }
.dropdown-item.selected { background:#00d4ff; color:#050816; }

/* Multi-select */
.multi-select-wrapper { position:relative; margin-bottom:1rem; }
.selected-items { min-height:48px; margin-bottom:.5rem; padding:.5rem; border:1.5px solid var(--border-color); border-radius:12px; background:rgba(15,23,42,.6); display:flex; flex-wrap:wrap; gap:.5rem; }
.selected-item { display:inline-flex; background:linear-gradient(135deg,#00d4ff,#7b61ff); color:#fff; padding:.375rem .875rem; border-radius:50px; font-size:.8125rem; font-weight:600; }
.selected-item .remove-btn { margin-left:.5rem; cursor:pointer; opacity:.8; }
.selected-item .remove-btn:hover { opacity:1; }

/* Hero */
.hero { background:transparent; padding:5rem 0; text-align:center; color:#fff; }
.hero h1 { font-size:3rem; color:#fff; }
.hero p { font-size:1.125rem; color:rgba(255,255,255,.7); }

/* Gov Header */
.gov-header { background:rgba(0,212,255,.08); border-bottom:1px solid var(--border-color); padding:.5rem 0; text-align:center; font-size:.8125rem; font-weight:600; color:#00d4ff; backdrop-filter:blur(12px); }

/* Scheme Badge */
.scheme-badge { background:rgba(0,212,255,.1); color:#00d4ff; padding:.5rem 1rem; border-radius:50px; font-weight:600; display:inline-block; border:1px solid rgba(0,212,255,.2); }

/* Spinner */
.spinner { border:3px solid rgba(255,255,255,.1); border-top-color:#00d4ff; border-radius:50%; width:30px; height:30px; animation:spin 1s linear infinite; margin:0 auto; }
@keyframes spin { to { transform:rotate(360deg); } }

/* Footer */
footer { background:rgba(5,8,22,.9) !important; border-top:1px solid var(--border-color) !important; color:#64748b !important; }
footer h5 { color:#fff; }
footer a { color:#00d4ff; }

/* Scrollbar */
::-webkit-scrollbar { width:6px; }
::-webkit-scrollbar-track { background:transparent; }
::-webkit-scrollbar-thumb { background:#334155; border-radius:3px; }
::-webkit-scrollbar-thumb:hover { background:#64748b; }

/* Selection */
::selection { background:#00d4ff; color:#050816; }

/* Responsive */
@media (max-width:768px) {
  .hero h1 { font-size:2rem; }
  .hero p { font-size:1rem; }
  .stat-number { font-size:2rem; }
  .container { padding:0 .75rem; }
  .card-body { padding:1rem; }
  .match-item { padding:1rem; }
}
@media (max-width:576px) {
  .btn { font-size:.875rem; padding:.5rem 1rem; }
  .table-responsive { font-size:.875rem; }
  .skill-tag { font-size:.75rem; padding:.25rem .625rem; }
}