/* ==== Theme variables ==== */
:root {
  --bg-primary: #f4f7fb;
  --bg-secondary: #edf3fb;
  --bg-card: #ffffff;
  --bg-card-soft: #f8fafc;
  --bg-elevated: #eef5ff;
  --text-primary: #0f172a;
  --text-secondary: #52607a;
  --border-color: rgba(148, 163, 184, 0.26);
  --primary-color: #2563eb;
  --primary-hover: #1d4ed8;
  --accent-color: #0ea5e9;
  --success-color: #10b981;
  --danger-color: #ef4444;
  --shadow-soft: 0 14px 30px rgba(15, 23, 42, 0.08);
  --shadow-lg: 0 24px 52px rgba(15, 23, 42, 0.12);
  --radius-sm: 12px;
  --radius-md: 18px;
  --radius-lg: 24px;

  --dark-bg: #0a1220;
  --dark-surface: #101b2d;
  --dark-surface-alt: #152338;
  --dark-border: rgba(148, 163, 184, 0.16);
  --dark-text: #e6edf9;
  --dark-muted: #a2b4cc;
  --dark-primary: #60a5fa;
  --dark-primary-strong: #3b82f6;
  --light-bg: #f5f7fb;
  --light-surface: rgba(255, 255, 255, 0.96);
  --light-border: rgba(101, 119, 151, 0.16);
  --light-text: #0f172a;
  --light-muted: #61708a;
  --light-highlight: #dce5f1;
  --light-shadow: rgba(101, 119, 151, 0.1);
}

body.dark-mode,
.dark-mode {
  --bg-primary: #0b1220;
  --bg-secondary: #101b2d;
  --bg-card: #111c2d;
  --bg-card-soft: #0f172a;
  --bg-elevated: #142338;
  --text-primary: #edf4ff;
  --text-secondary: #adc0d6;
  --border-color: rgba(148, 163, 184, 0.18);
  --primary-color: #60a5fa;
  --primary-hover: #3b82f6;
  --accent-color: #38bdf8;
  --success-color: #34d399;
  --danger-color: #f87171;
  --shadow-soft: 0 18px 36px rgba(2, 6, 23, 0.28);
  --shadow-lg: 0 28px 64px rgba(2, 6, 23, 0.34);
  background: linear-gradient(180deg, #09111b 0%, #0d1626 100%) !important;
  color: var(--dark-text) !important;
}

body.light-mode,
.light-mode {
  --bg-primary: #f4f7fb;
  --bg-secondary: #edf3fb;
  --bg-card: #ffffff;
  --bg-card-soft: #f8fafc;
  --bg-elevated: #eef5ff;
  --text-primary: #0f172a;
  --text-secondary: #52607a;
  --border-color: rgba(148, 163, 184, 0.26);
  --primary-color: #2563eb;
  --primary-hover: #1d4ed8;
  --accent-color: #0ea5e9;
  --success-color: #10b981;
  --danger-color: #ef4444;
  --shadow-soft: 0 14px 30px rgba(15, 23, 42, 0.08);
  --shadow-lg: 0 24px 52px rgba(15, 23, 42, 0.12);
  background: linear-gradient(180deg, #f5f7fb 0%, #edf3f9 100%) !important;
  color: var(--light-text) !important;
}

body.light-mode .card,
.light-mode .card,
body.light-mode .job-card,
.light-mode .job-card,
body.light-mode .candidate-card,
.light-mode .candidate-card,
body.light-mode .search-card,
.light-mode .search-card,
body.light-mode .benefit-card,
.light-mode .benefit-card,
body.light-mode .team-member,
.light-mode .team-member,
body.light-mode .feature-card,
.light-mode .feature-card,
body.light-mode .contact-card,
.light-mode .contact-card,
body.light-mode .profile-sidebar,
.light-mode .profile-sidebar,
body.light-mode .profile-main,
.light-mode .profile-main,
body.light-mode .profile-header,
.light-mode .profile-header,
body.light-mode .panel,
.light-mode .panel,
body.light-mode .list-group-item,
.light-mode .list-group-item,
body.light-mode .alert,
.light-mode .alert,
body.light-mode .modal-content,
.light-mode .modal-content,
body.light-mode .table,
.light-mode .table {
  color: var(--light-text) !important;
}

body.light-mode .card p,
.light-mode .card p,
body.light-mode .job-card p,
.light-mode .job-card p,
body.light-mode .candidate-card p,
.light-mode .candidate-card p,
body.light-mode .search-card p,
.light-mode .search-card p,
body.light-mode .benefit-card p,
.light-mode .benefit-card p,
body.light-mode .team-member p,
.light-mode .team-member p,
body.light-mode .feature-card p,
.light-mode .feature-card p,
body.light-mode .contact-card p,
.light-mode .contact-card p,
body.light-mode .profile-sidebar p,
.light-mode .profile-sidebar p,
body.light-mode .profile-main p,
.light-mode .profile-main p,
body.light-mode .alert p,
.light-mode .alert p,
body.light-mode .list-group-item,
.light-mode .list-group-item {
  color: var(--light-muted) !important;
}

body.light-mode .section-title,
.light-mode .feature-card h3,
.light-mode .benefit-card h3,
.light-mode .team-name,
.light-mode .team-role,
.light-mode .contact-card h3,
.light-mode .job-title,
.light-mode .candidate-card h3,
.light-mode .profile-name,
.light-mode .sidebar-card-title,
.light-mode .profile-sidebar h3,
.light-mode .profile-main h3,
.light-mode .profile-main h4 {
  color: var(--light-text) !important;
}

body.dark-mode .card,
.dark-mode .card,
body.dark-mode .job-card,
.dark-mode .job-card,
body.dark-mode .candidate-card,
.dark-mode .candidate-card,
body.dark-mode .search-card,
.dark-mode .search-card,
body.dark-mode .benefit-card,
.dark-mode .benefit-card,
body.dark-mode .team-member,
.dark-mode .team-member,
body.dark-mode .feature-card,
.dark-mode .feature-card,
body.dark-mode .contact-card,
.dark-mode .contact-card,
body.dark-mode .profile-sidebar,
.dark-mode .profile-sidebar,
body.dark-mode .profile-main,
.dark-mode .profile-main,
body.dark-mode .profile-header,
.dark-mode .profile-header,
body.dark-mode .panel,
.dark-mode .panel,
body.dark-mode .list-group-item,
.dark-mode .list-group-item,
body.dark-mode .alert,
.dark-mode .alert,
body.dark-mode .modal-content,
.dark-mode .modal-content,
body.dark-mode .table,
.dark-mode .table {
  color: var(--dark-text) !important;
}

body.dark-mode .section-title,
.dark-mode .feature-card h3,
.dark-mode .benefit-card h3,
.dark-mode .team-name,
.dark-mode .team-role,
.dark-mode .contact-card h3,
.dark-mode .job-title,
.dark-mode .candidate-card h3,
.dark-mode .profile-name,
.dark-mode .sidebar-card-title,
.dark-mode .profile-sidebar h3,
.dark-mode .profile-main h3,
.dark-mode .profile-main h4 {
  color: var(--dark-text) !important;
}

body.dark-mode .card p,
.dark-mode .card p,
body.dark-mode .job-card p,
.dark-mode .job-card p,
body.dark-mode .candidate-card p,
.dark-mode .candidate-card p,
body.dark-mode .search-card p,
.dark-mode .search-card p,
body.dark-mode .benefit-card p,
.dark-mode .benefit-card p,
body.dark-mode .team-member p,
.dark-mode .team-member p,
body.dark-mode .feature-card p,
.dark-mode .feature-card p,
body.dark-mode .contact-card p,
.dark-mode .contact-card p,
body.dark-mode .profile-sidebar p,
.dark-mode .profile-sidebar p,
body.dark-mode .profile-main p,
.dark-mode .profile-main p,
body.dark-mode .alert p,
.dark-mode .alert p,
body.dark-mode .list-group-item,
.dark-mode .list-group-item {
  color: var(--dark-muted) !important;
}

/* Override oscuro para los bloques del home que se definen en index.php */
.dark-mode .search-section,
.dark-mode .search-panel,
.dark-mode .search-panel__intro,
.dark-mode .search-panel__eyebrow,
.dark-mode .search-panel__intro h3,
.dark-mode .search-panel__intro p,
.dark-mode .search-box,
.dark-mode .search-field,
.dark-mode .search-input,
.dark-mode .search-select,
.dark-mode .btn-search,
.dark-mode .section-header,
.dark-mode .section-title,
.dark-mode .section-subtitle,
.dark-mode .benefits,
.dark-mode .benefit-grid,
.dark-mode .benefit-card,
.dark-mode .benefit-card:hover,
.dark-mode .benefit-icon,
.dark-mode .team,
.dark-mode .team-grid,
.dark-mode .team-member,
.dark-mode .team-member:hover,
.dark-mode .team-photo,
.dark-mode .team-info,
.dark-mode .features,
.dark-mode .features-wrapper,
.dark-mode .features-list,
.dark-mode .features-list li,
.dark-mode .features-image,
.dark-mode .contact-section,
.dark-mode .contact-card,
.dark-mode .contact-form,
.dark-mode .contact-form label,
.dark-mode .contact-form .form-control,
.dark-mode .contact-form textarea,
.dark-mode .btn-contact,
.dark-mode footer,
.dark-mode .footer-content,
.dark-mode .footer-section,
.dark-mode .footer-section h4,
.dark-mode .footer-section p,
.dark-mode .footer-links,
.dark-mode .footer-links li,
.dark-mode .footer-links a,
.dark-mode .footer-bottom,
.dark-mode .footer-bottom .brand,
.dark-mode .footer-bottom a {
  background: transparent !important;
  background-image: none !important;
  border-color: transparent !important;
  box-shadow: none !important;
}

/* Keep header styling isolated in includes/header.php. */

.dark-mode .header-glow__link,
.dark-mode .footer-links a,
.dark-mode .footer-bottom a,
.dark-mode .contact-form label,
.dark-mode .section-subtitle,
.dark-mode .benefit-card p,
.dark-mode .team-role,
.dark-mode .team-desc,
.dark-mode .footer-section p {
  color: var(--dark-muted) !important;
}

.dark-mode .search-input,
.dark-mode .search-select,
.dark-mode .contact-form .form-control,
.dark-mode .contact-form textarea {
  background: rgba(12, 14, 22, 0.95) !important;
  border-color: rgba(148, 163, 184, 0.16) !important;
  color: var(--dark-text) !important;
}

.dark-mode .btn-search,
.dark-mode .btn-contact,
.dark-mode .btn-primary-hero,
.dark-mode .btn-primary-hero.secondary,
.dark-mode .btn-secondary-custom,
.dark-mode .back-to-top {
  background: #233149 !important;
  color: #eef2ff !important;
  border-color: rgba(148, 163, 184, 0.16) !important;
  box-shadow: none !important;
}

.dark-mode .features-list li::before,
.dark-mode .benefit-icon {
  color: #94a3b8 !important;
}

.dark-mode .hero::before,
.dark-mode .features-image img,
.dark-mode .team-photo,
.dark-mode .search-input:focus,
.dark-mode .search-select:focus,
.dark-mode .contact-form .form-control:focus,
.dark-mode .contact-form textarea:focus {
  box-shadow: none !important;
}

body.theme-transition,
body.theme-transition * {
  transition: background 0.45s ease, color 0.45s ease, border-color 0.45s ease, box-shadow 0.45s ease;
}

body.light-mode::before,
body.dark-mode::before,
.light-mode::before,
.dark-mode::before {
  content: none !important;
  background: none !important;
  background-image: none !important;
  box-shadow: none !important;
  pointer-events: none !important;
}

.light-mode h1,
.light-mode h2,
.light-mode h3,
.light-mode h4,
.light-mode h5,
.light-mode h6,
.light-mode .section-title {
  color: var(--light-text) !important;
  text-shadow: 0 0 5px rgba(90, 124, 165, 0.12);
}

.light-mode > * {
  position: relative;
  z-index: 2;
}

.light-mode p,
.light-mode span,
.light-mode label,
.light-mode small,
.light-mode .section-subtitle,
.light-mode .job-description,
.light-mode .candidate-meta,
.light-mode .result-summary,
.light-mode .footer-links a,
.light-mode .contact-info li {
  color: var(--light-muted) !important;
}

body.dark-mode p,
.dark-mode p,
.dark-mode span,
.dark-mode label,
.dark-mode small,
.dark-mode .section-subtitle,
.dark-mode .job-description,
.dark-mode .candidate-meta,
.dark-mode .result-summary,
.dark-mode .footer-links a,
.dark-mode .contact-info li {
  color: var(--dark-muted) !important;
}

.dark-mode .navbar-custom,
.dark-mode .navbar-light,
.dark-mode .page-header,
.dark-mode .hero,
.dark-mode .benefits,
.dark-mode .team,
.dark-mode .features,
.dark-mode .search-panel,
.dark-mode .contact-card,
.dark-mode .team-member,
.dark-mode .benefit-card,
.dark-mode .features-list li,
.dark-mode .features-image,
.dark-mode .search-card,
.dark-mode .candidate-card,
.dark-mode .job-card,
.dark-mode .profile-sidebar,
.dark-mode .profile-main,
.dark-mode .footer-section,
.dark-mode .footer-content,
.dark-mode .footer-bottom,
.dark-mode .profile-header {
  background: rgba(10, 14, 22, 0.96) !important;
  border: 1px solid rgba(148, 163, 184, 0.12) !important;
  box-shadow: none !important;
}

.light-mode .navbar-custom,
.light-mode .navbar-light,
.light-mode .page-header,
.light-mode .hero,
.light-mode .benefits,
.light-mode .team,
.light-mode .features,
.light-mode .contact-card,
.light-mode .search-card,
.light-mode .candidate-card,
.light-mode .job-card,
.light-mode .profile-sidebar,
.light-mode .profile-main,
.light-mode .profile-header {
  background: rgba(255, 255, 255, 0.94) !important;
  border: 1px solid var(--light-border) !important;
  color: var(--light-text) !important;
  box-shadow: 0 0 40px rgba(90, 124, 165, 0.12) !important;
}

.light-mode .profile-sidebar,
.light-mode .profile-main,
.light-mode .profile-header {
  background: rgba(255, 255, 255, 0.94) !important;
  border: 1px solid var(--light-border) !important;
  box-shadow: 0 0 40px var(--light-shadow) !important;
}

.light-mode .hero,
.light-mode .hero::before,
.light-mode .hero video,
.light-mode .hero .hero-content {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  filter: none !important;
}

.light-mode .hero::before {
  background: rgba(3, 8, 18, 0.35) !important;
  background-image: none !important;
}

.light-mode .hero h1,
.light-mode .hero p,
.light-mode .hero .hero-actions a {
  color: #ffffff !important;
}

.light-mode .hero .hero-actions a {
  border-color: transparent !important;
}

.dark-mode .navbar-custom .nav-link,
.dark-mode .navbar-light .nav-link,
.dark-mode .nav-link {
  border: 1px solid transparent;
  border-radius: 999px;
  padding: 0.55rem 0.9rem;
  transition: all 0.25s ease;
}

.dark-mode .navbar-custom .nav-link:hover,
.dark-mode .navbar-light .nav-link:hover,
.dark-mode .nav-link:hover {
  border-color: rgba(148, 163, 184, 0.16) !important;
  box-shadow: none !important;
}

.notification-badge {
  position: absolute;
  top: 8px;
  right: 6px;
  min-width: 18px;
  height: 18px;
  font-size: 0.7rem;
  line-height: 18px;
  text-align: center;
  border-radius: 999px;
  background: #ef4444;
  color: white;
  padding: 0 5px;
  font-weight: 700;
}

.notification-menu {
  min-width: 280px;
}

.notification-menu .dropdown-item {
  display: block;
  padding: 0.85rem 1rem;
}

.notification-title {
  font-weight: 700;
  margin-bottom: 3px;
}

.notification-text {
  font-size: 0.9rem;
  color: #6b7280;
  line-height: 1.3;
}

.notification-time {
  font-size: 0.8rem;
  color: #94a3b8;
  margin-top: 4px;
}
  body.dark-mode *,
  .dark-mode * {
    color: var(--dark-text) !important;
  }

.dark-mode .hero::before {
  opacity: 0.22 !important;
}

.dark-mode .navbar-brand,
.dark-mode .nav-link,
.dark-mode .session-greeting,
.dark-mode .footer-links a,
.dark-mode .contact-info li,
.dark-mode .job-title,
.dark-mode .job-company,
.dark-mode .team-name,
.dark-mode .team-role,
.dark-mode .team-desc,
.dark-mode .feature-card,
.dark-mode .section-title,
.dark-mode .footer-section h4,
.dark-mode .btn-back,
.dark-mode .btn-primary-hero,
.dark-mode .btn-contact,
.dark-mode .btn-search,
.dark-mode .btn-secondary-custom,
.dark-mode .btn-login-nav,
.dark-mode .btn-register-nav,
.dark-mode .badge-status,
.dark-mode .alert {
  color: var(--dark-text) !important;
}

.dark-mode h1,
.dark-mode h2,
.dark-mode h3,
.dark-mode h4,
.dark-mode h5,
.dark-mode h6,
.dark-mode .section-title {
  color: var(--dark-text) !important;
  text-shadow: 0 0 10px rgba(75, 85, 99, 0.12);
}

.dark-mode .section-subtitle,
.dark-mode .job-description,
.dark-mode .candidate-meta,
.dark-mode .result-summary,
.dark-mode .footer-links a,
.dark-mode .contact-info li,
.dark-mode .text-muted,
.dark-mode .small,
.dark-mode .form-text {
  color: var(--dark-muted) !important;
}

.dark-mode::before {
  content: '';
  position: fixed;
  inset: 0;
  pointer-events: none;
  background-image: none !important;
  z-index: 1;
}

.dark-mode > * {
  position: relative;
  z-index: 2;
}

.dark-mode .nav-link:hover,
.dark-mode .footer-links a:hover,
.dark-mode .btn-back:hover,
.dark-mode .btn-primary-hero:hover,
.dark-mode .btn-contact:hover,
.dark-mode .btn-search:hover,
.dark-mode .btn-secondary-custom:hover,
.dark-mode .btn-login-nav:hover,
.dark-mode .btn-register-nav:hover {
  background: var(--dark-primary-strong) !important;
  color: white !important;
}

.dark-mode .form-control,
.dark-mode .form-select,
.dark-mode textarea {
  background: rgba(4, 12, 28, 0.92) !important;
  border: 1px solid var(--dark-border) !important;
  box-shadow: none !important;
  color: var(--dark-text) !important;
}

.light-mode .form-control,
.light-mode .form-select,
.light-mode textarea {
  background: rgba(255, 255, 255, 0.96) !important;
  border: 1px solid var(--light-border) !important;
  box-shadow: inset 0 0 12px rgba(148, 163, 184, 0.08) !important;
  color: var(--light-text) !important;
}

.dark-mode .form-control::placeholder,
.dark-mode .form-select option,
.dark-mode textarea::placeholder {
  color: #94a3b8 !important;
}

.dark-mode input,
.dark-mode select,
.dark-mode textarea,
.dark-mode .form-group input,
.dark-mode .form-group select,
.dark-mode .form-group textarea,
.dark-mode .form-control,
.dark-mode .form-select {
  background: #122438 !important;
  border-color: var(--dark-border) !important;
  color: var(--dark-text) !important;
}

body.light-mode .form-group input,
body.light-mode .form-group select,
body.light-mode .form-group textarea,
.light-mode .form-group input,
.light-mode .form-group select,
.light-mode .form-group textarea {
  background: rgba(255, 255, 255, 0.98) !important;
  border-color: rgba(148, 163, 184, 0.4) !important;
  color: #0f172a !important;
}

body.light-mode .form-group input::placeholder,
body.light-mode .form-group textarea::placeholder,
.light-mode .form-group input::placeholder,
.light-mode .form-group textarea::placeholder {
  color: rgba(71, 85, 105, 0.82) !important;
}

.dark-mode input::placeholder,
.dark-mode textarea::placeholder,
.dark-mode select option {
  color: #94a3b8 !important;
}

.dark-mode .bg-white,
.dark-mode .bg-light,
.dark-mode .card,
.dark-mode .card-body,
.dark-mode .dropdown-menu,
.dark-mode .modal-content,
.dark-mode .login-right,
.dark-mode .register-right,
.dark-mode .login-wrapper,
.dark-mode .register-wrapper,
.dark-mode .login-left,
.dark-mode .register-left {
  background: rgba(17, 24, 39, 0.96) !important;
  background-image: none !important;
  border-color: rgba(148, 163, 184, 0.14) !important;
  color: var(--dark-text) !important;
  box-shadow: 0 16px 36px rgba(2, 6, 23, 0.28) !important;
}

.light-mode .bg-white,
.light-mode .bg-light,
.light-mode .card,
.light-mode .card-body,
.light-mode .dropdown-menu,
.light-mode .modal-content,
.light-mode .login-right,
.light-mode .register-right,
.light-mode .login-wrapper,
.light-mode .register-wrapper,
.light-mode .login-left,
.light-mode .register-left {
  background: rgba(255, 255, 255, 0.94) !important;
  border-color: var(--light-border) !important;
  color: var(--light-text) !important;
  box-shadow: 0 0 28px rgba(75, 85, 99, 0.08) !important;
}


.dark-mode .login-benefits li,
.dark-mode .register-benefits li,
.dark-mode .text-muted,
.dark-mode .small,
.dark-mode .form-text,
.dark-mode .candidate-meta,
.dark-mode .result-summary {
  color: var(--dark-muted) !important;
}

.dark-mode a,
.dark-mode .nav-link,
.dark-mode .footer-links a,
.dark-mode .btn-link {
  color: var(--dark-text) !important;
}

.dark-mode .btn,
.dark-mode .btn-primary,
.dark-mode .btn-secondary,
.dark-mode .btn-login-submit,
.dark-mode .btn-register-submit,
.dark-mode .btn-back,
.dark-mode .btn-secondary-custom,
.dark-mode .btn-contact,
.dark-mode .btn-search,
.dark-mode .header-glow__pill,
.dark-mode .theme-toggle,
.dark-mode .back-to-top {
  background: #233149 !important;
  color: #eef2ff !important;
  border-color: rgba(148, 163, 184, 0.16) !important;
  box-shadow: none !important;
}

body.light-mode .btn-login-submit,
body.light-mode .btn-register-submit,
.light-mode .btn-login-submit,
.light-mode .btn-register-submit,
body.light-mode .btn-login-submit:hover,
body.light-mode .btn-register-submit:hover,
.light-mode .btn-login-submit:hover,
.light-mode .btn-register-submit:hover {
  background: linear-gradient(135deg, #2563eb 0%, #1d4ed8 100%) !important;
  color: #ffffff !important;
  border: none !important;
  box-shadow: 0 16px 32px rgba(37, 99, 235, 0.28) !important;
}

body.light-mode .theme-toggle,
.light-mode .theme-toggle,
body.dark-mode .theme-toggle,
.dark-mode .theme-toggle {
  background: rgba(15, 23, 42, 0.08) !important;
  color: #111827 !important;
  border: 1px solid rgba(15, 23, 42, 0.16) !important;
  border-radius: 999px !important;
  padding: 0.72rem 0.98rem !important;
  font-weight: 700 !important;
  cursor: pointer !important;
}

body.dark-mode .theme-toggle,
.dark-mode .theme-toggle {
  background: #233149 !important;
  color: #eef2ff !important;
  border-color: rgba(148, 163, 184, 0.16) !important;
}

.dark-mode .btn-outline-primary,
.dark-mode .btn-outline-secondary,
.dark-mode .btn-outline-danger,
.dark-mode .btn-outline-success,
.dark-mode .sidebar-nav-btn {
  background: rgba(255, 255, 255, 0.04) !important;
  border-color: rgba(148, 163, 184, 0.16) !important;
  color: #e2e8f0 !important;
  box-shadow: none !important;
}

.dark-mode .btn-outline-primary,
.dark-mode .btn-outline-secondary,
.dark-mode .btn-outline-danger,
.dark-mode .btn-outline-success {
  background: rgba(255, 255, 255, 0.06) !important;
  border-color: rgba(255, 255, 255, 0.18) !important;
}

.dark-mode .btn-primary-custom {
  background: #2a3b56 !important;
  border-color: transparent !important;
}

.dark-mode .sidebar-nav-btn {
  background: rgba(255, 255, 255, 0.06) !important;
  color: var(--dark-text) !important;
  border-color: rgba(148, 163, 184, 0.18) !important;
}

.dark-mode .sidebar-nav-btn:hover {
  background: rgba(255, 255, 255, 0.08) !important;
  color: white !important;
}

.dark-mode .sidebar-nav-btn.active {
  background: #233149 !important;
  color: #ffffff !important;
  border-color: rgba(148, 163, 184, 0.18) !important;
  box-shadow: none !important;
}

.light-mode .btn,
.light-mode .btn-primary,
.light-mode .btn-secondary,
.light-mode .btn-login-submit,
.light-mode .btn-register-submit,
.light-mode .btn-back,
.light-mode .btn-secondary-custom,
.light-mode .btn-contact,
.light-mode .btn-search {
  background: linear-gradient(135deg, #2563eb, #1d4ed8) !important;
  color: white !important;
  border-color: transparent !important;
  box-shadow: 0 4px 20px rgba(75, 85, 99, 0.12) !important;
}

.light-mode .btn-primary-custom,
.light-mode .btn-outline-primary,
.light-mode .btn-outline-secondary,
.light-mode .btn-outline-danger,
.light-mode .btn-outline-success,
.light-mode .sidebar-nav-btn,
.light-mode .theme-toggle,
.light-mode .back-to-top {
  color: var(--light-text) !important;
}

.light-mode .btn-outline-primary,
.light-mode .btn-outline-secondary,
.light-mode .btn-outline-danger,
.light-mode .btn-outline-success {
  background: rgba(255, 255, 255, 0.96) !important;
  border-color: rgba(90, 124, 165, 0.25) !important;
  color: var(--light-text) !important;
}

.light-mode .btn-primary-custom {
  background: linear-gradient(135deg, var(--primary), var(--primary-soft)) !important;
  color: white !important;
}

.light-mode .sidebar-nav-btn {
  background: #f8fafc !important;
  color: #111827 !important;
  border-color: #e5e7eb !important;
}

.light-mode .sidebar-nav-btn:hover {
  background: #eff6ff !important;
  color: var(--primary) !important;
}

.light-mode .sidebar-nav-btn.active {
  background: var(--primary) !important;
  color: #ffffff !important;
  border-color: var(--primary) !important;
  box-shadow: 0 16px 30px rgba(37, 99, 235, 0.18) !important;
}
.dark-mode .theme-toggle,
.dark-mode .back-to-top {
  background: #233149 !important;
  color: white !important;
  border-color: transparent !important;
  box-shadow: 0 0 16px rgba(15, 23, 42, 0.18) !important;
}

.light-mode .theme-toggle,
.light-mode .back-to-top {
  background: linear-gradient(135deg, var(--primary), var(--primary-soft)) !important;
  color: white !important;
  border-color: transparent !important;
  box-shadow: 0 0 22px rgba(75, 85, 99, 0.12) !important;
}

.dark-mode .back-to-top {
  box-shadow: 0 10px 24px rgba(47, 78, 117, 0.35) !important;
}

.dark-mode .search-form,
.dark-mode .sidebar,
.dark-mode .job-footer,
.dark-mode .results-header,
.dark-mode .search-hero,
.dark-mode .pagination-custom a,
.dark-mode .pagination-custom span {
  background: var(--dark-surface) !important;
  border-color: var(--dark-border) !important;
  color: var(--dark-text) !important;
}

.dark-mode .search-form label,
.dark-mode .sidebar h4,
.dark-mode .results-info,
.dark-mode .pagination-custom a,
.dark-mode .pagination-custom span {
  color: var(--dark-text) !important;
}

.dark-mode .btn-limpiar {
  background: #1f2937 !important;
  color: var(--dark-text) !important;
  border-color: var(--dark-border) !important;
}

.dark-mode .btn-limpiar:hover {
  background: #475569 !important;
  color: white !important;
}

.dark-mode .job-meta-item,
.dark-mode .job-description,
.dark-mode .job-date,
.dark-mode .results-info small {
  color: var(--dark-muted) !important;
}

.dark-mode .login-wrapper,
.dark-mode .login-left,
.dark-mode .login-right,
.dark-mode .form-divider,
.dark-mode .form-divider span,
.dark-mode .form-divider::before,
.dark-mode .signup-link,
.dark-mode .back-link,
.dark-mode .toggle-form-link,
.dark-mode .form-container {
  background: transparent !important;
  color: var(--dark-text) !important;
}

body.dark-mode .login-right,
body.dark-mode .register-right,
.dark-mode .login-right,
.dark-mode .register-right {
  background: rgba(6, 12, 28, 0.98) !important;
  border-color: var(--dark-border) !important;
  box-shadow: 0 20px 42px rgba(2, 6, 23, 0.28) !important;
}

body.light-mode .login-right,
body.light-mode .register-right,
.light-mode .login-right,
.light-mode .register-right {
  background: rgba(255, 255, 255, 0.96) !important;
  color: #0f172a !important;
  border-color: rgba(148, 163, 184, 0.22) !important;
  box-shadow: 0 18px 46px rgba(15, 23, 42, 0.1) !important;
}

.dark-mode .login-left h1,
.dark-mode .login-left p,
.dark-mode .login-left,
.dark-mode .login-header h2,
.dark-mode .form-group label,
.dark-mode .signup-link,
.dark-mode .signup-link p,
.dark-mode .back-link a,
.dark-mode .toggle-form-link,
.dark-mode .toggle-form-link button {
  color: var(--dark-text) !important;
}

.dark-mode .form-divider span {
  background: rgba(6, 12, 28, 0.95) !important;
  color: var(--dark-muted) !important;
}

.dark-mode .form-divider::before {
  background: var(--dark-border) !important;
}

.dark-mode .signup-link a,
.dark-mode .back-link a {
  color: var(--dark-primary) !important;
}

.dark-mode .signup-link a:hover,
.dark-mode .back-link a:hover,
.dark-mode .toggle-form-link button:hover {
  color: var(--dark-primary-strong) !important;
}

.dark-mode .login-benefits li {
  color: var(--dark-muted) !important;
}

.dark-mode .footer {
  background: #020617 !important;
}

.dark-mode footer {
  background: rgba(1, 2, 10, 0.98) !important;
  color: var(--dark-text) !important;
}

.dark-mode footer .footer-content,
.dark-mode footer .footer-section,
.dark-mode footer .footer-bottom,
.dark-mode footer .footer-links,
.dark-mode footer .footer-links li,
.dark-mode footer .contact-info,
.dark-mode footer .social-links {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

.dark-mode footer .footer-links a,
.dark-mode footer .contact-info li,
.dark-mode footer .footer-bottom a {
  color: var(--dark-text) !important;
}

.dark-mode footer .footer-links a:hover,
.dark-mode footer .footer-bottom a:hover {
  color: var(--dark-primary) !important;
}

.dark-mode footer h4 {
  color: var(--dark-text) !important;
}

.dark-mode footer p {
  color: var(--dark-muted) !important;
}

.dark-mode footer i {
  color: var(--dark-muted) !important;
  margin-right: 8px;
}

.light-mode footer {
  background: transparent !important;
  color: var(--light-text) !important;
}

.light-mode footer .footer-content,
.light-mode footer .footer-section,
.light-mode footer .footer-bottom,
.light-mode footer .footer-links,
.light-mode footer .footer-links li,
.light-mode footer .contact-info,
.light-mode footer .social-links {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

.light-mode footer .footer-links a,
.light-mode footer .contact-info li,
.light-mode footer .footer-bottom a {
  color: var(--light-text) !important;
}

.light-mode footer .footer-links a:hover,
.light-mode footer .footer-bottom a:hover {
  color: #475569 !important;
}

.light-mode footer h4 {
  color: var(--light-text) !important;
}

.light-mode footer p {
  color: var(--light-muted) !important;
}

.light-mode footer i {
  color: var(--light-muted) !important;
  margin-right: 8px;
}

.dark-mode .chats-sidebar,
.dark-mode .chat-window,
.dark-mode .chat-messages-header,
.dark-mode .chat-input-area,
.dark-mode .chat-item,
.dark-mode .chat-item.active,
.dark-mode .chat-item:hover,
.dark-mode .chat-empty,
.dark-mode .message-content,
.dark-mode .message.received .message-content,
.dark-mode .message.sent .message-content {
  background: var(--dark-surface) !important;
  color: var(--dark-text) !important;
  border-color: var(--dark-border) !important;
}

.dark-mode .chat-item:hover {
  background: rgba(148, 163, 184, 0.08) !important;
}

.dark-mode .chat-item.active {
  background: rgba(148, 163, 184, 0.12) !important;
  border-left-color: #4c5f7f !important;
}

.dark-mode .chat-messages {
  background: transparent !important;
}

.dark-mode .message-time,
.dark-mode .chat-item-preview,
.dark-mode .chat-item-name,
.dark-mode .chat-empty {
  color: var(--dark-muted) !important;
}

.dark-mode .btn-delete-chat {
  background: #ef4444 !important;
  color: white !important;
}

.dark-mode .btn-send {
  background: #2c4260 !important;
  color: white !important;
}

.dark-mode .footer-bottom {
  background: transparent !important;
}

.dark-mode .btn-primary-hero,
.dark-mode .btn-contact,
.dark-mode .btn-search,
.dark-mode .btn-secondary-custom,
.dark-mode .btn-login-nav,
.dark-mode .btn-register-nav,
.dark-mode .btn-back {
  background: #233149 !important;
  color: white !important;
  border-color: transparent !important;
  box-shadow: none !important;
}

.theme-toggle {
  background: transparent;
  color: var(--dark-text);
  border: 1px solid rgba(148, 163, 184, 0.4);
  border-radius: 8px;
  padding: 6px 14px;
  font-size: 0.9rem;
  cursor: pointer;
  transition: all 0.3s ease;
}

.theme-toggle:hover {
  background: rgba(255, 255, 255, 0.08);
  color: #edf2fb;
}

.back-to-top {
  position: fixed;
  right: 20px;
  bottom: 24px;
  background: #233149;
  color: white;
  border: none;
  border-radius: 50%;
  width: 48px;
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.1rem;
  box-shadow: 0 10px 24px rgba(47, 78, 117, 0.25);
  cursor: pointer;
  opacity: 0;
  visibility: hidden;
  transition: all 0.25s ease;
  z-index: 999;
}


