/* Plugin-owned commerce markup. Dashboard refinements below are separately scoped. */

/* Header Log In / Log Out button (one action). Efor wraps link content in span.link-text, which
   Additional CSS forces white with !important; the extra classes here out-rank it and the menu
   hover (blue block + ribbon tail), so the button never gets a ribbon. */
.site-header .main-navigation li.yp-auth-button.menu-item,
.site-header .main-navigation li.yp-auth-button.menu-item:not(.current-menu-item):hover { background: none !important; }
.site-header .main-navigation li.yp-auth-button.menu-item::after,
.site-header .main-navigation li.yp-auth-button.menu-item:not(.current-menu-item):hover::after { content: none !important; display: none !important; }
.site-header .main-navigation li.yp-auth-button > a:focus-visible { outline: 2px solid #FFD51E; outline-offset: 3px; }
@media (min-width: 1025px) {
  .site-header .main-navigation li.yp-auth-button.menu-item { margin-inline-start: 12px !important; margin-inline-end: 0 !important; }
  .site-header .main-navigation li.yp-auth-button > a { display: inline-flex; align-items: center; justify-content: center; box-sizing: border-box; min-height: 38px; padding: 8px 18px !important; border-radius: 999px; border: 2px solid transparent; font-weight: 700; line-height: 1; letter-spacing: .04em; transition: background-color .15s, color .15s, border-color .15s; }
  /* Log In: yellow CTA, navy text; turquoise on hover/focus. */
  .site-header .main-navigation li.yp-auth-login.menu-item > a { background: #FFD51E; border-color: #FFD51E; }
  .site-header .main-navigation li.yp-auth-login.menu-item > a,
  .site-header .main-navigation li.yp-auth-login.menu-item > a .link-text { color: #0F2D52 !important; }
  .site-header .main-navigation li.yp-auth-login.menu-item:not(.current-menu-item) > a:is(:hover, :focus-visible) { background: #00C3C9; border-color: #00C3C9; }
  .site-header .main-navigation li.yp-auth-login.menu-item:not(.current-menu-item):hover > a .link-text { color: #0F2D52 !important; }
  /* Log Out: quiet white outline; yellow on hover/focus. */
  .site-header .main-navigation li.yp-auth-logout.menu-item > a { background: transparent; border-color: rgba(255, 255, 255, .85); }
  .site-header .main-navigation li.yp-auth-logout.menu-item > a .link-text { color: #FFFFFF !important; }
  .site-header .main-navigation li.yp-auth-logout.menu-item:not(.current-menu-item) > a:is(:hover, :focus-visible) { border-color: #FFD51E; }
  .site-header .main-navigation li.yp-auth-logout.menu-item:not(.current-menu-item):hover > a .link-text,
  .site-header .main-navigation li.yp-auth-logout.menu-item > a:focus-visible .link-text { color: #FFD51E !important; }
}

/* Courses page: "Continue where you left off" for logged-in members with courses. */
.yp-continue { padding: 40px 16px 8px; background: #F4F8FB; font-family: Poppins, sans-serif; color: #0F2D52; }
.yp-continue-inner { max-width: 1160px; margin: 0 auto; }
.yp-continue h2 { margin: 0 0 4px; color: #0F2D52; font-size: 28px; line-height: 1.3; }
.yp-continue .yp-continue-lead { margin: 0 0 24px; color: #4A5B70; }
.yp-continue-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 24px; }
.yp-continue-card { display: flex; flex-direction: column; overflow: hidden; background: #FFFFFF; border: 1px solid #DFE7EE; border-radius: 12px; }
.yp-continue-card .yp-continue-image { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; background: #E6EEF4; }
.yp-continue-body { display: flex; flex-direction: column; flex: 1; padding: 18px 20px 20px; }
.yp-continue-body h3 { margin: 0 0 14px; color: #0F2D52; font-size: 18px; line-height: 1.4; }
.yp-progress { height: 8px; overflow: hidden; border-radius: 999px; background: #E6EEF4; }
.yp-progress > span { display: block; height: 100%; border-radius: 999px; background: #00C3C9; }
.yp-continue .yp-progress-label { margin: 8px 0 16px; color: #4A5B70; font-size: 13px; }
.yp-continue a.yp-continue-cta { display: inline-flex; align-items: center; justify-content: center; align-self: flex-start; margin-top: auto; min-height: 44px; padding: 10px 22px; border-radius: 12px; background: #FFD51E; color: #0F2D52; font-size: 14px; font-weight: 600; text-decoration: none; text-transform: uppercase; letter-spacing: .02em; }
.yp-continue a.yp-continue-cta:is(:hover, :focus-visible) { background: #00C3C9; color: #0F2D52; }
.yp-continue a:focus-visible { outline: 3px solid #0F2D52; outline-offset: 3px; }
.yp-continue .yp-continue-all { margin: 20px 0 0; }
.yp-continue .yp-continue-all a { color: #0F2D52; font-weight: 600; text-decoration: underline; text-underline-offset: 4px; }
@media (max-width: 575px) {
  .yp-continue { padding-top: 28px; }
  .yp-continue h2 { font-size: 22px; }
  .yp-continue a.yp-continue-cta { align-self: stretch; }
}

/* My Account: the trimmed side menu (Continue Learning, Purchases, Account Details, Log Out) shows on
   desktop; below 1025px it is hidden, the profile menu is the navigation and content is full width. */
@media (max-width: 1024px) {
  html body.woocommerce-account.logged-in #main .woocommerce-MyAccount-navigation { display: none !important; }
  html body.woocommerce-account.logged-in #main .woocommerce-MyAccount-content { float: none !important; width: 100% !important; margin-left: 0 !important; }
}
.woocommerce-MyAccount-content .yp-back-link { margin: 0 0 20px; }
.woocommerce-MyAccount-content .yp-back-link a { color: #0F2D52; font-weight: 600; text-decoration: none; }
.woocommerce-MyAccount-content .yp-back-link a:is(:hover, :focus-visible) { color: #2193D2; text-decoration: underline; text-underline-offset: 4px; }

/* Profile menu (initials), far right of the page like most sites: 40px from the right edge (same as the Tutor dashboard).
   Course pages: on the course title row. My Account pages: a row just under the header. */
.yp-profile-bar { display: flex; justify-content: flex-end; box-sizing: border-box; width: 100%; padding: 16px 40px 0; }
#main.yp-has-profile-bar > .yp-profile-bar { position: relative; z-index: 20; }
.tutor-course-details-header.yp-has-profile { position: relative; }
/* 100% = the centred course column; (100% - 100vw) / 2 reaches the page edge. */
.tutor-course-details-header.yp-has-profile > .yp-profile-dropdown { position: absolute; top: -2px; right: calc((100% - 100vw) / 2 + 40px); z-index: 20; }
@media (max-width: 1280px) {
  .tutor-course-details-header.yp-has-profile .tutor-course-details-title { padding-inline-end: 64px; }
}
@media (max-width: 767px) {
  .tutor-course-details-header.yp-has-profile > .yp-profile-dropdown { right: 0; }
  .tutor-course-details-header.yp-has-profile .tutor-course-details-title { padding-inline-end: 56px; }
  .yp-profile-bar { padding: 12px 16px 0; }
}
.yp-profile-dropdown { position: relative; }
.yp-profile-dropdown > summary { display: inline-grid; place-items: center; box-sizing: border-box; width: 44px; height: 44px; border-radius: 50%; border: 1px solid #DFE7EE; background: #E0F4F7; color: #0F2D52; cursor: pointer; list-style: none; transition: border-color .15s, background-color .15s, box-shadow .15s; }
.yp-profile-dropdown > summary::-webkit-details-marker { display: none; }
.yp-profile-dropdown .yp-initials { font-family: Poppins, sans-serif; font-size: 14px; font-weight: 700; line-height: 1; letter-spacing: .03em; text-transform: uppercase; }
.yp-profile-dropdown > summary:hover,
.yp-profile-dropdown[open] > summary { border-color: #00C3C9; background: #FFFFFF; box-shadow: 0 0 0 2px #00C3C9; }
.yp-profile-dropdown > summary:focus-visible { outline: 3px solid #2193D2; outline-offset: 3px; }
.yp-profile-links { position: absolute; right: 0; top: calc(100% + 8px); z-index: 50; box-sizing: border-box; width: 230px; margin: 0; padding: 8px; list-style: none; background: #FFFFFF; border: 1px solid #DFE7EE; border-radius: 12px; box-shadow: 0 14px 32px rgba(15, 45, 82, .18); text-align: left; }
.yp-profile-links li { margin: 0; padding: 0; }
.yp-profile-links a { display: block; box-sizing: border-box; min-height: 44px; padding: 12px 14px; border-radius: 8px; color: #0F2D52; font-family: Poppins, sans-serif; font-size: 14px; font-weight: 500; line-height: 1.4; text-decoration: none; }
.yp-profile-links a:is(:hover, :focus-visible) { background: #E0F4F7; color: #0F2D52; }
.yp-profile-links a:focus-visible { outline: 3px solid #2193D2; outline-offset: -3px; }
.yp-profile-links .yp-profile-logout { margin-top: 4px; padding-top: 4px; border-top: 1px solid #E5EBF0; }

/* Course Thank You page (order-received), all widths. One success area: the page title and
   WooCommerce's repeated notice + overview are hidden for course orders (details stay in View Order Details). */
body.yp-course-thankyou #main .post-header,
body.yp-course-thankyou .woocommerce-order > .woocommerce-thankyou-order-received,
body.yp-course-thankyou .woocommerce-order > .woocommerce-order-overview { display: none !important; }
.yp-order-welcome { box-sizing: border-box; max-width: 760px; margin: 0 auto 36px; padding: 40px 32px; border: 1px solid #DCE8EE; border-radius: 16px; background: #FFFFFF; color: #0F2D52; text-align: center; font-family: Poppins, sans-serif; }
.yp-order-welcome .yp-order-eyebrow { margin: 0 0 16px; color: #2193D2; font-size: 14px; font-weight: 600; letter-spacing: .02em; }
.yp-order-welcome .yp-order-check { display: inline-grid; place-items: center; width: 52px; height: 52px; margin: 0 0 12px; border-radius: 50%; background: #E0F7F8; color: #0F2D52; font-size: 26px; box-shadow: inset 0 0 0 2px #00C3C9; }
.yp-order-welcome #yp-order-title { margin: 0 0 10px; color: #0F2D52; font-size: 32px; line-height: 1.25; }
.yp-order-welcome p { margin: 0 0 14px; line-height: 1.6; }
.yp-order-welcome .yp-order-number { color: #4A5B70; font-size: 14px; }
.yp-course-confirmations { display: flex; justify-content: center; flex-wrap: wrap; gap: 24px; margin: 28px 0; }
.yp-course-confirmation { flex: 0 1 360px; overflow: hidden; border: 1px solid #DCE8EE; border-radius: 12px; background: #FFFFFF; text-align: left; }
.yp-course-confirmation .yp-course-image { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; background: #F4F8FB; }
.yp-course-confirmation-body { padding: 20px 24px 24px; }
.yp-order-welcome .yp-course-confirmation h3 { margin: 0 0 18px; color: #0F2D52; font-size: 20px; line-height: 1.4; }
.yp-order-welcome .yp-course-pending { margin: 0; color: #4A5B70; font-size: 14px; }
.yp-order-welcome a.yp-start-learning { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 12px 28px; border: 0; border-radius: 12px; background: #FFD51E !important; color: #0F2D52 !important; font-weight: 600; text-decoration: none; text-transform: uppercase; letter-spacing: .02em; }
/* Navy on turquoise: white on #00C3C9 is only ~2:1 contrast. */
.yp-order-welcome a.yp-start-learning:is(:hover, :focus-visible) { background: #00C3C9 !important; color: #0F2D52 !important; }
.yp-order-welcome .yp-order-pay { font-size: 14px; }
.yp-order-welcome .yp-order-pay a { color: #0F2D52; font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
.yp-order-welcome a:focus-visible { outline: 3px solid #2193D2; outline-offset: 4px; }
@media (max-width: 575px) {
  .yp-order-welcome { padding: 28px 18px; border-radius: 12px; }
  .yp-order-welcome #yp-order-title { font-size: 26px; }
  .yp-order-welcome a.yp-start-learning { width: 100%; }
}

/* My Account learning card: all widths. */
.yp-account-courses { padding: 24px; background: #f2fbfb; border: 1px solid #dce8ee; border-radius: 12px; margin: 24px 0; color: #0f2d52; font-family: Poppins, sans-serif; }
.yp-account-courses h2 { margin: 0 0 8px; font-size: 22px; line-height: 1.3; color: #0f2d52; }
.yp-account-courses p { margin: 0 0 16px; }
.yp-account-courses a.yp-account-cta { display: inline-block; min-height: 44px; padding: 12px 28px; border: 0; border-radius: 12px; background: #ffd51e !important; color: #0f2d52 !important; font-weight: 600; text-decoration: none; text-transform: uppercase; letter-spacing: .02em; }
.yp-account-courses a.yp-account-cta:is(:hover, :focus-visible) { background: #00c3c9 !important; color: #0f2d52 !important; }
.yp-account-courses a.yp-account-cta:focus-visible { outline: 3px solid #0f2d52; outline-offset: 3px; }

/* Tutor public cards: retain native typography and duration; no shop/product selectors. */
.tutor-course-card .yp-course-card-action { width: 100%; }
.tutor-course-card .yp-course-card-meta { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 8px; margin-bottom: 12px; }
.tutor-course-card .yp-course-level { font-size: 12px; color: #0f2d52; }
.tutor-course-card .yp-course-cta { white-space: normal; }

/* Tutor Settings (Account, Security, Social Accounts, Preferences): Efor styles every <button> 12px,
   uppercase, letter-spaced and square, which misaligns Tutor's tab list and form buttons. Undo those
   theme styles inside the settings area only; Tutor's own layout and colours take over again. */
.tutor-profile-settings-section button { text-transform: none; letter-spacing: normal; }
.tutor-profile-settings-section .tutor-profile-settings-tab [role="tab"] { display: flex; align-items: center; justify-content: flex-start; gap: 12px; width: 100%; box-sizing: border-box; text-align: left; font-size: 14px; font-weight: 500; line-height: 1.4; border-radius: 10px; }
.tutor-profile-settings-section .tutor-profile-settings-tab [role="tab"] > span:first-child { flex: none; display: inline-grid; place-items: center; width: 20px; height: 20px; }
.tutor-profile-settings-section .tutor-profile-settings-tab [role="tab"] > div { min-width: 0; text-align: left; }
.tutor-profile-settings-section .tutor-profile-settings-tab [role="tab"][aria-selected="true"] { color: #0F2D52; }
.tutor-profile-settings-section .yp-personal-details .tutor-card { box-sizing: border-box; }

/* Dashboard greeting: "Welcome back," navy, the learner's name brand blue. */
.tutor-dashboard-header .yp-greet-lead { color: #0F2D52; }
.tutor-dashboard-header .yp-greet-name { color: #2193D2; }
/* My Account dashboard: same greeting as the Tutor dashboard (replaces "Hello … (not …? Log out)"). */
.woocommerce-MyAccount-content .yp-account-greeting { margin: 0 0 24px; font-family: Poppins, sans-serif; font-size: 26px; font-weight: 600; line-height: 1.3; letter-spacing: -0.01em; text-transform: none; }
.woocommerce-MyAccount-content .yp-account-greeting .yp-greet-lead { color: #0F2D52; }
.woocommerce-MyAccount-content .yp-account-greeting .yp-greet-name { color: #2193D2; }
@media (max-width: 575px) {
  .woocommerce-MyAccount-content .yp-account-greeting { font-size: 22px; }
}

/* Log Out in the left-hand menus: a full-width, clearly visible outline button (Tutor dashboard
   sidebar and the desktop My Account menu). */
.tutor-dashboard-sidebar a.yp-sidebar-logout,
html body.woocommerce-account #main .woocommerce-MyAccount-navigation li.woocommerce-MyAccount-navigation-link--customer-logout a { display: flex !important; align-items: center; justify-content: center; box-sizing: border-box; width: 100%; min-height: 48px; margin: 16px 0 0 !important; padding: 12px 18px !important; border: 2px solid #0F2D52 !important; border-radius: 12px !important; background: #FFFFFF !important; color: #0F2D52 !important; font-family: Poppins, sans-serif; font-size: 14px; font-weight: 700; letter-spacing: .03em; text-transform: uppercase; text-decoration: none !important; box-shadow: none !important; }
.tutor-dashboard-sidebar a.yp-sidebar-logout:is(:hover, :focus-visible),
html body.woocommerce-account #main .woocommerce-MyAccount-navigation li.woocommerce-MyAccount-navigation-link--customer-logout a:is(:hover, :focus-visible) { background: #00C3C9 !important; border-color: #00C3C9 !important; color: #0F2D52 !important; }
.tutor-dashboard-sidebar a.yp-sidebar-logout:focus-visible,
html body.woocommerce-account #main .woocommerce-MyAccount-navigation li.woocommerce-MyAccount-navigation-link--customer-logout a:focus-visible { outline: 3px solid #2193D2; outline-offset: 3px; }

/* Tutor internal UI only. Native popover placement and mobile overlay remain intact. */
.tutor-dashboard-layout .tutor-dashboard-header-inner { display: flex; align-items: center; justify-content: space-between; width: 100%; gap: 16px; }
.tutor-dashboard-layout .tutor-dashboard-header-left { min-width: 0; }
.tutor-dashboard-layout .tutor-dashboard-header-right { margin-inline-start: auto; flex-shrink: 0; }
.tutor-dashboard-layout :is(.tutor-dashboard-sidebar, .tutor-dashboard-header-user-popover) a:is(:hover, :focus-visible),
.tutor-dashboard-layout a.tutor-see-all-courses:is(:hover, :focus-visible),
.tutor-dashboard-layout .tutor-dashboard-welcome-content a:is(:hover, :focus-visible) { color: #0f2d52 !important; text-decoration: none !important; background-color: #e0f4f7; box-shadow: inset 3px 0 #00c3c9; }
/* Turquoise stays the accent (icons + bar); text is navy because #00C3C9 text on a pale background is ~2:1. */
.tutor-dashboard-layout :is(.tutor-dashboard-sidebar, .tutor-dashboard-header-user-popover) a:is(:hover, :focus-visible) svg { color: #00c3c9 !important; }
.tutor-dashboard-layout :is(.tutor-dashboard-sidebar, .tutor-dashboard-header-user-popover) a::after,
.tutor-dashboard-layout a.tutor-see-all-courses::after { display: none !important; }

/* Tutor dashboard enrolled-course cards: the action button is always visible (Tutor shows it on
   hover only), centred on the right on larger screens; Tutor already stacks it full-width on phones. */
.tutor-dashboard-layout .tutor-progress-card > .tutor-progress-card-actions { opacity: 1 !important; visibility: visible !important; }
@media (min-width: 576px) {
  .tutor-dashboard-layout .tutor-progress-card > .tutor-progress-card-actions { top: 50%; transform: translateY(-50%); }
  .tutor-dashboard-layout .tutor-progress-card .tutor-progress-card-content { padding-inline-end: 200px; }
}
.tutor-dashboard-layout a.yp-card-cta { display: inline-flex; align-items: center; justify-content: center; box-sizing: border-box; min-height: 44px; padding: 10px 22px; border-radius: 12px; background: #FFD51E; color: #0F2D52 !important; font-family: Poppins, sans-serif; font-size: 14px; font-weight: 600; line-height: 1.3; text-decoration: none !important; white-space: nowrap; }
.tutor-dashboard-layout a.yp-card-cta:is(:hover, :focus-visible) { background: #00C3C9; color: #0F2D52 !important; }
.tutor-dashboard-layout a.yp-card-cta:focus-visible { outline: 3px solid #0F2D52; outline-offset: 3px; }
@media (max-width: 575px) { .tutor-dashboard-layout a.yp-card-cta { width: 100%; } }

/* Course page sidebar: "You're enrolled in this course" without the cart icon and purchase date. */
.tutor-sidebar-card .tutor-icon-purchase-mark,
.tutor-sidebar-card .tutor-enrolled-info-date { display: none !important; }
.tutor-sidebar-card .tutor-enrolled-info-text { color: #0F2D52; font-weight: 500; }
.tutor-sidebar-card .tutor-enrolled-info-text::before { content: "✓"; margin-inline-end: 8px; color: #00C3C9; font-weight: 700; }

/* Course page "Share": a secondary button (not a grey link) in the site's button style. */
.tutor-course-details-actions a.tutor-course-share-btn { display: inline-flex; align-items: center; justify-content: center; box-sizing: border-box; min-height: 44px; padding: 10px 20px !important; border: 1.5px solid #0F2D52 !important; border-radius: 12px; background: #FFFFFF; color: #0F2D52 !important; font-family: Poppins, sans-serif; font-size: 14px; font-weight: 600; text-decoration: none; transition: background-color .15s, border-color .15s; }
.tutor-course-details-actions a.tutor-course-share-btn .tutor-icon-share { display: none; }
.tutor-course-details-actions a.tutor-course-share-btn:is(:hover, :focus-visible) { background: #00C3C9; border-color: #00C3C9 !important; color: #0F2D52 !important; }
.tutor-course-details-actions a.tutor-course-share-btn:focus-visible { outline: 3px solid #0F2D52; outline-offset: 3px; }

/* Share modal: WhatsApp button matches Tutor's coloured network buttons. */
.tutor-social-share-wrap .tutor_share.s_whatsapp { background-color: #128C7E !important; color: #FFFFFF !important; border-color: #128C7E !important; }
.tutor-social-share-wrap .tutor_share.s_whatsapp .yp-icon-whatsapp { display: inline-block; width: 16px; height: 16px; background-color: currentColor; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M17.47 14.38c-.3-.15-1.76-.87-2.03-.97-.27-.1-.47-.15-.67.15-.2.3-.77.97-.94 1.16-.17.2-.35.22-.64.08-.3-.15-1.26-.47-2.39-1.48-.88-.79-1.48-1.76-1.65-2.06-.17-.3-.02-.46.13-.61.13-.13.3-.35.45-.52.15-.17.2-.3.3-.5.1-.2.05-.37-.03-.52-.07-.15-.67-1.61-.92-2.21-.24-.58-.49-.5-.67-.51h-.57c-.2 0-.52.07-.79.37-.27.3-1.04 1.02-1.04 2.48s1.07 2.88 1.21 3.07c.15.2 2.1 3.2 5.08 4.49.71.31 1.26.49 1.7.63.71.23 1.36.2 1.87.12.57-.09 1.76-.72 2-1.41.25-.7.25-1.29.18-1.41-.08-.13-.27-.2-.57-.35M12.05 21.79h-.01a9.87 9.87 0 0 1-5.03-1.38l-.36-.21-3.74.98 1-3.65-.24-.37a9.86 9.86 0 0 1-1.51-5.26c0-5.45 4.44-9.88 9.89-9.88 2.64 0 5.12 1.03 6.99 2.9a9.83 9.83 0 0 1 2.89 6.99c0 5.45-4.44 9.88-9.88 9.88m8.41-18.3A11.82 11.82 0 0 0 12.05 0C5.5 0 .16 5.34.16 11.89c0 2.1.55 4.14 1.59 5.95L.06 24l6.3-1.65a11.88 11.88 0 0 0 5.68 1.45h.01c6.55 0 11.89-5.34 11.89-11.89a11.82 11.82 0 0 0-3.48-8.41Z'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M17.47 14.38c-.3-.15-1.76-.87-2.03-.97-.27-.1-.47-.15-.67.15-.2.3-.77.97-.94 1.16-.17.2-.35.22-.64.08-.3-.15-1.26-.47-2.39-1.48-.88-.79-1.48-1.76-1.65-2.06-.17-.3-.02-.46.13-.61.13-.13.3-.35.45-.52.15-.17.2-.3.3-.5.1-.2.05-.37-.03-.52-.07-.15-.67-1.61-.92-2.21-.24-.58-.49-.5-.67-.51h-.57c-.2 0-.52.07-.79.37-.27.3-1.04 1.02-1.04 2.48s1.07 2.88 1.21 3.07c.15.2 2.1 3.2 5.08 4.49.71.31 1.26.49 1.7.63.71.23 1.36.2 1.87.12.57-.09 1.76-.72 2-1.41.25-.7.25-1.29.18-1.41-.08-.13-.27-.2-.57-.35M12.05 21.79h-.01a9.87 9.87 0 0 1-5.03-1.38l-.36-.21-3.74.98 1-3.65-.24-.37a9.86 9.86 0 0 1-1.51-5.26c0-5.45 4.44-9.88 9.89-9.88 2.64 0 5.12 1.03 6.99 2.9a9.83 9.83 0 0 1 2.89 6.99c0 5.45-4.44 9.88-9.88 9.88m8.41-18.3A11.82 11.82 0 0 0 12.05 0C5.5 0 .16 5.34.16 11.89c0 2.1.55 4.14 1.59 5.95L.06 24l6.3-1.65a11.88 11.88 0 0 0 5.68 1.45h.01c6.55 0 11.89-5.34 11.89-11.89a11.82 11.82 0 0 0-3.48-8.41Z'/%3E%3C/svg%3E") center / contain no-repeat; vertical-align: middle; }

/* Dashboard header: profile avatar at the far right of the header row (Tutor centres an 860px box). */
.tutor-dashboard-layout .tutor-dashboard-header-inner { max-width: none !important; }

/* Account / authentication primary buttons, all widths: yellow, turquoise on hover, navy text
   (white on #00C3C9 is ~2:1). #main out-ranks the ≥1025px Additional CSS hover rule. */
body.woocommerce-account #main .woocommerce :is(form.login, form.register, form.lost_reset_password, form.edit-account, form.woocommerce-EditAccountForm, .woocommerce-address-fields) :is(button.button, input.button),
body.woocommerce-account #main .tutor-forgot-password-form button[type="submit"] { display: inline-block; min-height: 48px; padding: 12px 28px; border: 0; border-radius: 12px; background: #FFD51E !important; color: #0F2D52 !important; font-family: Poppins, sans-serif; font-weight: 600; line-height: 1.4; text-decoration: none; box-shadow: none; cursor: pointer; }
body.woocommerce-account #main .woocommerce :is(form.login, form.register, form.lost_reset_password, form.edit-account, form.woocommerce-EditAccountForm, .woocommerce-address-fields) :is(button.button, input.button):is(:hover, :focus-visible),
body.woocommerce-account #main .tutor-forgot-password-form button[type="submit"]:is(:hover, :focus-visible) { background: #00C3C9 !important; color: #0F2D52 !important; }
body.woocommerce-account #main .woocommerce :is(form.login, form.register, form.lost_reset_password, form.edit-account, form.woocommerce-EditAccountForm, .woocommerce-address-fields) :is(button.button, input.button):focus-visible { outline: 3px solid #0F2D52; outline-offset: 3px; }
body.woocommerce-account #main .woocommerce :is(button.button, input.button):disabled { background: #E5EBF0 !important; color: #4A5B70 !important; cursor: not-allowed; }
.tutor-forgot-password-form button[type="submit"] { background: #FFD51E !important; color: #0F2D52 !important; border: 0; border-radius: 12px; font-weight: 600; }
.tutor-forgot-password-form button[type="submit"]:is(:hover, :focus-visible) { background: #00C3C9 !important; color: #0F2D52 !important; }
.tutor-forgot-password-form button[type="submit"]:focus-visible { outline: 3px solid #0F2D52; outline-offset: 3px; }

/* WooCommerce buttons elsewhere (checkout Place Order, cart, order tables): Additional CSS hovers
   white on turquoise (~2:1). Keep its colours but use navy hover text. `html` out-ranks it. */
html body.woocommerce-page #main :is(button.button, input.button, a.button, .wc-block-components-button, .wp-block-button__link):hover,
html body.woocommerce-page #main :is(.woocommerce-orders-table, .woocommerce-message, .woocommerce-info) a.button:hover { color: #0F2D52 !important; }
html body.woocommerce-page #main .button.is-primary:hover { color: #0F2D52 !important; }

/* Registration / Account Details optional profile fields. */
.woocommerce-form-row .yp-field-hint { display: block; margin-top: 6px; font-size: 13px; line-height: 1.5; color: #4a5b70; }
.woocommerce-form-row .optional { font-weight: 400; color: #4a5b70; }

/* Inactivity notice (2 minutes before the 60-minute timeout). */
.yp-idle { position: fixed; right: 16px; bottom: 16px; z-index: 100000; box-sizing: border-box; width: min(360px, calc(100vw - 32px)); padding: 20px; border: 1px solid #DFE7EE; border-radius: 12px; background: #FFFFFF; color: #0F2D52; box-shadow: 0 14px 32px rgba(15, 45, 82, .22); font-family: Poppins, sans-serif; }
.yp-idle[hidden] { display: none; }
.yp-idle .yp-idle-title { margin: 0 0 6px; font-size: 16px; font-weight: 700; }
.yp-idle .yp-idle-text { margin: 0 0 14px; font-size: 14px; line-height: 1.5; }
.yp-idle .yp-idle-stay { min-height: 44px; padding: 10px 22px; border: 0; border-radius: 12px; background: #FFD51E; color: #0F2D52; font-family: inherit; font-size: 14px; font-weight: 600; letter-spacing: normal; text-transform: none; cursor: pointer; }
.yp-idle .yp-idle-stay:is(:hover, :focus-visible) { background: #00C3C9; }
.yp-idle .yp-idle-stay:focus-visible { outline: 3px solid #0F2D52; outline-offset: 3px; }

/* Password checklist (rule: 8+ characters, uppercase, lowercase, number, symbol). Ticks are shown with
   text + symbol, not colour alone. WooCommerce's and Tutor's strength meters are hidden so nothing
   contradicts the rule. */
.yp-pw-rules { margin: 8px 0 16px; padding: 0; list-style: none; font-family: Poppins, sans-serif; font-size: 13px; line-height: 1.5; color: #4A5B70; }
.yp-pw-rules li { position: relative; margin: 2px 0; padding-left: 22px; }
.yp-pw-rules li::before { content: "○"; position: absolute; left: 0; top: 0; color: #4A5B70; }
.yp-pw-rules li.is-met { color: #0F2D52; }
.yp-pw-rules li.is-met::before { content: "✓"; color: #0A7F84; font-weight: 700; }
.woocommerce-password-strength,
.woocommerce-password-hint,
.tutor-help-text[x-bind="getStrengthTextBindings()"] { display: none !important; }

/* Settings → Preferences: students keep Accessibility and Course Content; Appearance (Theme, Learning
   Mode) is hidden so everyone sees the Youngpreneur design. */
.tutor-preferences-section h5:has(+ .tutor-card [x-effect*="applyTheme"]),
.tutor-preferences-section .tutor-card:has([x-effect*="applyTheme"]) { display: none !important; }

/* Tutor dashboard, Settings and Reset Password pages have no #main, so Efor's floating-header script
   (`.site-header ~ .elementor` gets an inline margin-top of minus the header height: -124px desktop,
   -94px mobile) pulls the footer up over the last fields and Save buttons. Cancel it and leave a gap. */
body.tutor-screen-frontend-dashboard #page > footer.elementor-location-footer { margin-top: 56px !important; }
@media (max-width: 1024px) {
  body.tutor-screen-frontend-dashboard #page > footer.elementor-location-footer { margin-top: 40px !important; }
}