/* Cyborg Theme with Raleway Typography - Road Safety Foundation */

/* Import Raleway Font */
@import url('https://fonts.googleapis.com/css2?family=Raleway:wght@100;200;300;400;500;600;700;800&display=swap');

/* Cyborg Theme Color Variables */
:root {
  --bs-primary: #2a9fd6;
  --bs-secondary: #77b300;
  --bs-success: #77b300;
  --bs-info: #9933cc;
  --bs-warning: #ff8800;
  --bs-danger: #cc0000;
  --bs-light: #222;
  --bs-dark: #adafae;
  --bs-body-bg: #060606;
  --bs-body-color: #fff;
  --bs-border-color: #333;
}

/* Global Typography Override */
* {
  font-family: 'Raleway', sans-serif !important;
}

body {
  font-family: 'Raleway', sans-serif !important;
  font-weight: 300;
  letter-spacing: 0.3px;
  line-height: 1.7;
  background: #060606 !important;
  color: #fff !important;
}

/* Headings */
h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
  font-family: 'Raleway', sans-serif !important;
  font-weight: 200;
  letter-spacing: 0.5px;
  color: #fff !important;
}

.display-1, .display-2, .display-3, .display-4, .display-5, .display-6 {
  font-family: 'Raleway', sans-serif !important;
  font-weight: 100;
  letter-spacing: -0.02em;
}

/* Navigation */
.navbar {
  background: rgba(6, 6, 6, 0.95) !important;
  backdrop-filter: blur(20px);
  border-bottom: 1px solid #333;
}

.navbar-brand {
  font-family: 'Raleway', sans-serif !important;
  font-weight: 300;
  letter-spacing: 1px;
  color: #2a9fd6 !important;
}

.nav-link {
  font-family: 'Raleway', sans-serif !important;
  font-weight: 300;
  letter-spacing: 0.5px;
  color: #adafae !important;
  transition: all 0.3s ease;
}

.nav-link:hover,
.nav-link.active {
  color: #2a9fd6 !important;
  background: rgba(42, 159, 214, 0.1) !important;
}

/* Buttons */
.btn {
  font-family: 'Raleway', sans-serif !important;
  font-weight: 500;
  letter-spacing: 0.5px;
  border-radius: 0.375rem;
  transition: all 0.3s ease;
}

.btn:hover {
  transform: translateY(-2px);
}

/* Cards */
.card {
  background: #222 !important;
  border: 1px solid #333 !important;
  color: #fff !important;
}

.card-title {
  font-family: 'Raleway', sans-serif !important;
  font-weight: 400;
  color: #fff !important;
}

.card-text {
  font-family: 'Raleway', sans-serif !important;
  color: #adafae !important;
}

/* Forms */
.form-control,
.form-select {
  font-family: 'Raleway', sans-serif !important;
  background: #222 !important;
  border: 1px solid #333 !important;
  color: #fff !important;
}

.form-control:focus,
.form-select:focus {
  border-color: #2a9fd6 !important;
  box-shadow: 0 0 0 0.2rem rgba(42, 159, 214, 0.25) !important;
}

.form-label {
  font-family: 'Raleway', sans-serif !important;
  color: #fff !important;
}

/* Badges */
.badge {
  font-family: 'Raleway', sans-serif !important;
  font-weight: 500;
  letter-spacing: 0.3px;
}

/* Tables */
.table {
  color: #fff !important;
}

.table th,
.table td {
  font-family: 'Raleway', sans-serif !important;
  border-color: #333 !important;
}

/* Alerts */
.alert {
  font-family: 'Raleway', sans-serif !important;
  border: 1px solid;
}

/* Modals */
.modal-content {
  background: #222 !important;
  border: 1px solid #333 !important;
  color: #fff !important;
}

.modal-header {
  border-bottom: 1px solid #333 !important;
}

.modal-footer {
  border-top: 1px solid #333 !important;
}

/* Dropdowns */
.dropdown-menu {
  background: #222 !important;
  border: 1px solid #333 !important;
}

.dropdown-item {
  font-family: 'Raleway', sans-serif !important;
  color: #adafae !important;
}

.dropdown-item:hover {
  background: #333 !important;
  color: #2a9fd6 !important;
}

/* Pagination */
.page-link {
  font-family: 'Raleway', sans-serif !important;
  background: #222 !important;
  border: 1px solid #333 !important;
  color: #2a9fd6 !important;
}

.page-link:hover {
  background: #333 !important;
  color: #2a9fd6 !important;
}

/* Breadcrumbs */
.breadcrumb {
  background: #222 !important;
}

.breadcrumb-item {
  font-family: 'Raleway', sans-serif !important;
}

.breadcrumb-item a {
  color: #2a9fd6 !important;
}

/* Progress bars */
.progress {
  background: #222 !important;
}

/* List groups */
.list-group-item {
  font-family: 'Raleway', sans-serif !important;
  background: #222 !important;
  border: 1px solid #333 !important;
  color: #fff !important;
}

/* Tooltips and Popovers */
.tooltip-inner {
  font-family: 'Raleway', sans-serif !important;
  background: #222 !important;
}

.popover {
  background: #222 !important;
  border: 1px solid #333 !important;
}

.popover-body {
  font-family: 'Raleway', sans-serif !important;
  color: #fff !important;
}

/* Custom utility classes */
.text-cyborg-primary {
  color: #2a9fd6 !important;
}

.text-cyborg-secondary {
  color: #77b300 !important;
}

.bg-cyborg-dark {
  background: #222 !important;
}

.border-cyborg {
  border-color: #333 !important;
}

/* Responsive typography */
@media (max-width: 768px) {
  .display-1, .display-2, .display-3 {
    font-size: calc(1.5rem + 2vw) !important;
  }
  
  .navbar-brand span {
    display: none;
  }
}

/* Animation enhancements */
.hover-lift {
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.hover-lift:hover {
  transform: translateY(-5px);
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
}

/* Video specific styles */
.video-card {
  background: #222 !important;
  border: 1px solid #333 !important;
  transition: all 0.3s ease;
}

.video-card:hover {
  border-color: #2a9fd6 !important;
  box-shadow: 0 10px 30px rgba(42, 159, 214, 0.2);
}

/* Partner cards */
.partner-card {
  background: #222 !important;
  border: 1px solid #333 !important;
  transition: all 0.3s ease;
}

.partner-card:hover {
  border-color: #77b300 !important;
  transform: translateY(-5px);
}

/* Footer */
footer {
  background: #222 !important;
  border-top: 1px solid #333 !important;
  color: #fff !important;
}

footer a {
  color: #2a9fd6 !important;
}

footer a:hover {
  color: #77b300 !important;
}