[hidden],
.hidden-page {
  display: none !important;
}

.app-modal { z-index: 1000; }
.app-modal[hidden] { display: none !important; }
.app-modal.is-open { display: flex; }
.modal-open { overflow: hidden; }
.public-header { z-index: 100; }
.profile-dropdown { z-index: 120; }
.profile-dropdown.open {
  opacity: 1;
  visibility: visible;
  transform: translateY(0) scale(1);
}

.course-slider-window .skill-slide-card.slide-hidden { display: none; }
.app-modal .form-error { margin: 4px 0; color: #d6232b; font-size: 12px; font-weight: 700; }
.success-state[hidden], .form-state[hidden] { display: none !important; }
.offered-courses button { cursor: pointer; }
.hero-slide { cursor: pointer; text-decoration: none; }
.hero-slide[aria-hidden="true"] { pointer-events: none; }

/* Lucide DOM icons use the exact sizes passed by the reference React build. */
.public-header .nav > button svg,
.public-header .services-dropdown button svg,
.public-header .services-trigger svg:first-child { width: 17px; height: 17px; }
.public-header .services-trigger svg:last-child,
.profile-trigger svg:last-child { width: 15px; height: 15px; }
.icon-btn svg { width: 19px; height: 19px; }
.profile-dropdown > button svg { width: 16px; height: 16px; }
.profile-dropdown > button.logout-item svg { width: 17px; height: 17px; }
.hero-fixed-actions .primary svg { width: 18px; height: 18px; }
.hero-fixed-actions .secondary svg,
.quick > svg { width: 17px; height: 17px; }
.section-head button svg,
.associate-card button svg,
.home-degree-card > button svg,
.test-card > button svg { width: 16px; height: 16px; }
.rating svg { width: 14px; height: 14px; fill: currentColor; }
.meta svg { width: 14px; height: 14px; }
.price button svg { width: 15px; height: 15px; }
.home-degree-facts svg { width: 15px; height: 15px; }
.degree-modal-actions .primary svg,
.get-call-button svg,
.call-request-form .primary svg,
.contact-form .primary svg,
.modal-body > .primary svg { width: 17px; height: 17px; }
.plans button > i svg { width: 13px; height: 13px; }
.offered-courses > button svg { width: 16px; height: 16px; }
.learn-actions button svg { width: 16px; height: 16px; }
.filterbar label svg { width: 18px; height: 18px; }
.filterbar button svg { width: 16px; height: 16px; }
.footer-app a svg { width: 19px; height: 19px; }

.toast {
  position: fixed;
  right: 24px;
  bottom: 24px;
  z-index: 2000;
  padding: 13px 18px;
  border-radius: 12px;
  background: #13213d;
  color: #fff;
  box-shadow: 0 18px 45px rgba(12, 25, 48, .25);
  font-size: 13px;
  font-weight: 700;
  animation: toastIn .25s ease;
}
.toast.error { background: #c9252d; }
@keyframes toastIn {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: none; }
}
@media (max-width: 600px) {
  .toast { left: 18px; right: 18px; bottom: 18px; text-align: center; }
}