/* DoctorDoctor.ca — custom overrides on Porto Medical 2 */

/* ── Brand color override: sky blue to match logo ── */
:root,
html body {
  --primary: #21B5E2 !important;
  --primary-100: #1AA3CC !important;
  --primary-200: #1499BF !important;
  --primary-300: #0E8FB3 !important;
  --primary--100: #3DC0E7 !important;
  --primary--200: #52C8EB !important;
  --primary--300: #67D0EE !important;
  --primary-rgba-0: rgba(33, 181, 226, 0) !important;
  --primary-rgba-10: rgba(33, 181, 226, 0.1) !important;
  --primary-rgba-20: rgba(33, 181, 226, 0.2) !important;
  --primary-rgba-30: rgba(33, 181, 226, 0.3) !important;
  --primary-rgba-40: rgba(33, 181, 226, 0.4) !important;
  --primary-rgba-50: rgba(33, 181, 226, 0.5) !important;
  --primary-rgba-60: rgba(33, 181, 226, 0.6) !important;
  --primary-rgba-70: rgba(33, 181, 226, 0.7) !important;
  --primary-rgba-80: rgba(33, 181, 226, 0.8) !important;
  --primary-rgba-90: rgba(33, 181, 226, 0.9) !important;
}

html .bg-primary,
html .background-color-primary { background-color: #21B5E2 !important; }
html .text-primary,
html .color-primary { color: #21B5E2 !important; }
html .btn-primary {
  --bs-btn-bg: #21B5E2;
  --bs-btn-border-color: #21B5E2;
  --bs-btn-hover-bg: #1AA3CC;
  --bs-btn-hover-border-color: #1AA3CC;
  --bs-btn-active-bg: #0E8FB3;
  --bs-btn-active-border-color: #0E8FB3;
  --bs-btn-disabled-bg: #21B5E2;
  --bs-btn-disabled-border-color: #21B5E2;
  --bs-btn-focus-shadow-rgb: 33, 181, 226;
  background-color: #21B5E2 !important;
  border-color: #21B5E2 !important;
}
html .btn-primary:hover, html .btn-primary.hover {
  background-color: #1AA3CC !important;
  border-color: #1AA3CC !important;
}
html .btn-primary:focus, html .btn-primary.focus {
  background-color: #21B5E2 !important;
  border-color: #21B5E2 !important;
  box-shadow: 0 0 0 .25rem rgba(33, 181, 226, .5) !important;
}
html .btn-primary:active, html .btn-primary.active {
  background-color: #0E8FB3 !important;
  border-color: #0E8FB3 !important;
}
html .btn-outline-primary {
  --bs-btn-color: #21B5E2;
  --bs-btn-border-color: #21B5E2;
  --bs-btn-hover-bg: #21B5E2;
  --bs-btn-hover-border-color: #21B5E2;
  --bs-btn-active-bg: #21B5E2;
  --bs-btn-active-border-color: #21B5E2;
  --bs-btn-focus-shadow-rgb: 33, 181, 226;
  color: #21B5E2 !important;
  border-color: #21B5E2 !important;
}
html .btn-outline-primary:hover {
  background-color: #21B5E2 !important;
  color: #fff !important;
}
html .btn-outline.btn-primary {
  color: #21B5E2 !important;
  border-color: #21B5E2 !important;
  background-color: transparent !important;
}
html .btn-outline.btn-primary:hover {
  background-color: #21B5E2 !important;
  color: #fff !important;
}
html .border-primary,
html .border-color-primary { border-color: #21B5E2 !important; }
a { color: #21B5E2; }
a:hover { color: #1AA3CC; }
html .badge.bg-primary { background-color: #21B5E2 !important; }
html .card-featured-primary { border-left-color: #21B5E2 !important; }
.nav-pills > li > a:hover,
.nav-pills > li.active > a { color: #21B5E2; }
.page-header-modern.bg-primary { background-color: #21B5E2 !important; }
html .heading-primary h1, html .heading-primary h2, html .heading-primary h3,
html .heading-primary h4 { color: #21B5E2; }
.text-color-primary { color: #21B5E2 !important; }
.feature-box .feature-box-icon { background-color: #21B5E2; }
.progress-bar { background-color: #21B5E2; }

.doctor-map-icon {
  background: transparent;
  border: none;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Smooth card hover effect */
.card {
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.card:hover {
  transform: translateY(-3px);
}

/* Specialty cards on dark bg */
.bg-primary .card.bg-transparent:hover {
  background: rgba(255, 255, 255, 0.08) !important;
}

/* Language dropdown scrollable */
#dropdownLanguage + .dropdown-menu {
  max-height: 400px;
  overflow-y: auto;
}

/* Badge styling */
.badge.bg-primary {
  font-size: 0.85rem;
}

/* Map marker popup */
.leaflet-popup-content {
  font-family: "Poppins", sans-serif;
  font-size: 13px;
}

/* RTL support basics */
[dir="rtl"] .me-1 { margin-right: 0 !important; margin-left: 0.25rem !important; }
[dir="rtl"] .me-2 { margin-right: 0 !important; margin-left: 0.5rem !important; }
[dir="rtl"] .ms-1 { margin-left: 0 !important; margin-right: 0.25rem !important; }
[dir="rtl"] .ms-2 { margin-left: 0 !important; margin-right: 0.5rem !important; }
[dir="rtl"] .text-start { text-align: right !important; }
[dir="rtl"] .text-end { text-align: left !important; }
[dir="rtl"] .ps-0 { padding-left: unset !important; padding-right: 0 !important; }
[dir="rtl"] .pe-0 { padding-right: unset !important; padding-left: 0 !important; }

/* Feature box icon alignment */
.feature-box-style-2 .feature-box-icon {
  min-width: 45px;
}

/* Flash message positioning */
.alert-dismissible {
  margin-bottom: 0;
}