/*
  CONTACTSPORTAL global readable surfaces.
  Keep this file CSS-only: it is a contrast safety layer for current and future
  cards, panels, CTAs and form controls in day/night modes.
*/
:root {
  --cp-card-bg: #ffffff;
  --cp-card-text: #111827;
  --cp-card-muted: #4b5563;
  --cp-card-border: rgba(15, 23, 42, .14);
  --cp-link-color: #1d4ed8;
  --cp-button-bg: #2563eb;
  --cp-button-text: #ffffff;
  --cp-input-bg: #ffffff;
  --cp-input-text: #111827;
  --cp-input-placeholder: #64748b;
}

html[data-theme="dark"] {
  --cp-card-bg: #0f172a;
  --cp-card-text: #e5e7eb;
  --cp-card-muted: #cbd5e1;
  --cp-card-border: rgba(148, 163, 184, .36);
  --cp-link-color: #bfdbfe;
  --cp-button-bg: #dbeafe;
  --cp-button-text: #0f172a;
  --cp-input-bg: #020617;
  --cp-input-text: #f8fafc;
  --cp-input-placeholder: #94a3b8;
}

.cp-readable-card,
.cp-light-card,
.cp-dark-card {
  color: var(--cp-card-text);
}

.cp-readable-card {
  background: var(--cp-card-bg);
  border-color: var(--cp-card-border);
}

.cp-light-card {
  background: #ffffff !important;
  color: #111827 !important;
  border-color: rgba(15, 23, 42, .14) !important;
}

.cp-light-card :where(h1, h2, h3, h4, h5, h6, p, span, div, li, label, strong, small) {
  color: inherit;
}

.cp-light-card :where(.muted, .small, .side-text, .side-section-subtitle, .sidebar-card-summary, .right-card-text) {
  color: #4b5563 !important;
}

.cp-light-card a {
  color: #1d4ed8 !important;
}

.cp-dark-card,
html[data-theme="dark"] .cp-readable-card {
  background: var(--cp-card-bg) !important;
  color: var(--cp-card-text) !important;
  border-color: var(--cp-card-border) !important;
}

html[data-theme="dark"] :where(
  .card,
  .country-index-card,
  .service-card,
  .side-link,
  .side-action,
  .sidebar-section,
  .sidebar-banner,
  .passportu-guide-card,
  .sidebar-ad-link,
  .home-news-item,
  .cp-useful-card,
  .relocation-card,
  .news-card,
  .travel-card,
  .stay-booking-shell,
  .stay-participants-wrap,
  .stay-participant-row,
  .stay-selected-card,
  .stay-hotel-card,
  .stay-prebook-summary-card,
  .stay-review-section,
  .stay-autocomplete-list,
  #manifest,
  #projectContacts,
  #statsCard,
  #travelBlock,
  #relocationBlock,
  #servicesForm,
  #unifiedFormCard,
  #usefulBlock,
  #newsBlock,
  #rulesBlock
):not(.cp-light-card) {
  background-color: var(--cp-card-bg);
  border-color: var(--cp-card-border);
  color: var(--cp-card-text);
}

html[data-theme="dark"] :where(
  .card,
  .country-index-card,
  .service-card,
  .side-link,
  .sidebar-section,
  .home-news-item,
  .cp-useful-card,
  .stay-booking-shell,
  .stay-participants-wrap,
  .stay-participant-row,
  .stay-selected-card,
  .stay-hotel-card,
  #manifest,
  #projectContacts
):not(.cp-light-card) :where(h1, h2, h3, h4, h5, h6, .side-title, .side-section-title, .role-cta-title, .country-index-title, .country-index-name, .home-news-title, .stay-participants-title, .stay-participant-head, strong) {
  color: var(--cp-card-text);
}

html[data-theme="dark"] :where(
  .card,
  .country-index-card,
  .service-card,
  .side-link,
  .sidebar-section,
  .home-news-item,
  .cp-useful-card,
  .stay-booking-shell,
  .stay-participants-wrap,
  .stay-participant-row,
  .stay-selected-card,
  .stay-hotel-card,
  #manifest,
  #projectContacts
):not(.cp-light-card) :where(p, li, label, .muted, .small, .side-text, .side-section-subtitle, .sidebar-card-summary, .right-card-text, .country-index-date, .home-news-date, .stay-participants-note, .stay-results-meta) {
  color: var(--cp-card-muted);
  opacity: 1;
}

html[data-theme="dark"] :where(.card, .country-index-card, .service-card, .side-link, .sidebar-section, .home-news-item, .cp-useful-card, #manifest, #projectContacts):not(.cp-light-card) a {
  color: var(--cp-link-color);
}

html[data-theme="dark"] :where(
  .btn,
  .right-card-cta,
  .right-free-post-pill,
  .country-archive-button,
  .passportu-guide-action,
  .stay-choose-btn,
  .stay-search-button,
  .stay-destination-clear,
  button[type="submit"]
) {
  color: var(--cp-button-text);
}

html[data-theme="dark"] :where(
  .right-card-cta,
  .right-free-post-pill,
  .country-archive-button,
  .passportu-guide-action
) {
  background: var(--cp-button-bg);
  border-color: rgba(147, 197, 253, .86);
}

html[data-theme="dark"] :where(input, textarea, select, .input) {
  background-color: var(--cp-input-bg);
  color: var(--cp-input-text);
  border-color: var(--cp-card-border);
}

html[data-theme="dark"] :where(input, textarea)::placeholder {
  color: var(--cp-input-placeholder);
  opacity: 1;
}

html[data-theme="dark"] :where(input:focus, textarea:focus, select:focus, .input:focus) {
  outline-color: rgba(147, 197, 253, .72);
}

html[data-theme="dark"] :where(.sidebar-card-arrow, .side-section-title, .sidebar-title-marker-purple) {
  color: #bfdbfe;
}

html[data-theme="dark"] :where(.salary, .stat-pill b) {
  color: #86efac;
}