/* Dropdown — отваря при клик чрез focus-within, затваря при клик навън */
#userDropdownWrapper {
    position: relative;
}

#userDropdownToggle {
    cursor: pointer;
}

#userDropdownMenu {
    display: none !important;
}

#userDropdownWrapper:focus-within #userDropdownMenu {
    display: block !important;
}

/* Fix (mobile): make the JS click-toggle (.is-open, set in header-public.blade.php)
   the reliable open mechanism. The ID-qualified selector (specificity 1,1,0) beats
   #userDropdownMenu (1,0,0) so it overrides `display:none !important`, and the
   !important also beats the element's inline `style="display:none"`. Previously
   .is-open only changed opacity (weaker than the ID rule) and the menu relied on
   :focus-within, which does NOT fire on a touch tap (esp. iOS Safari) — so on phones
   the Профил / Смяна на парола / Изход menu never appeared. Applies on every viewport
   so the desktop click is equally reliable. */
#userDropdownMenu.is-open {
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
    transform: translateY(0) !important;
}

/* The round profile icon is a mobile-only affordance; hidden on desktop where the
   toggle shows the user's name + chevron. It is shown in the mobile block below. */
.header-public__btn-avatar-icon {
    display: none;
}
@media (max-width: 60rem) {
	.grading-row {flex-direction: column;}
	.dashboard__grid {grid-template-columns: auto;}
	.lesson-form__section-content {margin-left: 0;}
	.lesson-form__field, .lesson-form__basic-info {flex-direction: column;}
	.tox.tox-tinymce.tox-platform-touch {min-height: 200px;}
}

.lesson-info {margin-top: 15px;}
/* mobile start */
@media (max-width: 60rem) {

  #userDropdownWrapper,
  .header-public__actions > a.header-public__btn--primary {
    position: absolute;
    right: 1rem;
    top: 50%;
    transform: translateY(-50%);
    z-index: 5;
  }

  /* Show the profile icon inside the round toggle (teachers/staff/admin have no
     avatar, so the circle was an unlabeled blue dot). White on the dark-blue circle. */
  #userDropdownToggle .header-public__btn-avatar-icon {
    display: block;
    width: 24px;
    height: 24px;
    color: var(--color-white);
  }

  /* Keep the opened profile menu usable on small screens (e.g. a parent with many
     children) — cap its height and let it scroll instead of running off-screen. */
  #userDropdownMenu.is-open {
    max-height: calc(100vh - 80px);
    overflow-y: auto;
  }

  .header-public__actions {
    display: inline-block!important;margin-left: auto;
  }
.header-public__user-dropdown:hover .header-public__user-menu {
    opacity: 0;
    transform: translateY(-10px);
    visibility: hidden;
}
header-public__logo-wrapper {margin-left: 60px;}
header-public__container {padding:0;}
.header-public__user-menu.is-open {
    opacity: 1 !important;
    transform: translateY(0) !important;
    visibility: visible !important;
}
/* z-index above page-content rows (which also use z-index:1) so the open user/profile menu isn't covered by breadcrumbs/text; stays below the mobile drawer (9000+) and modals (1050+). */
.header-public__content.row {margin-left:30px;display: grid;z-index: 1000;position: relative;}
 .header-public__mobile-menu-toggle {top: 40px;}
#profile-switch-form > div:nth-child(6) { display:grid!important;}
.plan-selection__steps {flex-direction: column;}
}
/* mobile end */
.ex-detail__body span {font-size: 1rem !important;}
.ex-desc__text p {font-size: 1rem !important;}
.ex-desc__text span {font-size: 1rem !important;}
.ex-desc__text i {font-style: normal;}
.ex-desc b {font-weight: 500;}
.ex-detail__body strong {font-weight: 500;}
.ex-detail__body span {font-weight: 500;}
div.ex-desc > div > p > span {font-size: 1rem !important;}
.plan-selection__children-note {font-size:12px!important;}
html {font-family: MontserratBG_Regular,sans-serif;}
.plan-selection__children {justify-content: space-around;max-width: 850px;
  margin: 50px auto;}
  .plan-selection__addon-list span {margin: 0 5px;font-size:12px!important;color:#393939!important;}
	.plan-selection__addon-list  {color: #393939!important;}