/* The same course preview on shelves, archive rows, grids and related courses. */
:root body:not(.wp-admin) .ec-course-grid .ec-course-card > .ec-course-preview.ec-course-popover[aria-label],
:root body:not(.wp-admin) [data-course-preview-host] > .ec-course-preview.ec-course-popover[aria-label] {
    display: block !important;
    position: fixed !important;
    z-index: 1200 !important;
    width: var(--course-popover-width, 360px) !important;
    min-width: 0 !important;
    min-height: 0 !important;
    max-width: calc(100vw - 32px) !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 1px solid #d8e1ee !important;
    border-radius: 12px !important;
    background: #fff !important;
    color: #172239 !important;
    box-shadow: 0 14px 42px rgb(15 23 42 / 18%) !important;
    overflow: visible !important;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: none !important;
    transition: opacity .12s ease, visibility .12s ease !important;
    text-align: left !important;
    overflow-wrap: anywhere;
}
[data-course-preview-host].is-popover-open > .ec-course-preview { opacity: 1; visibility: visible; pointer-events: auto; }
/* Two nested triangles create one attached caret. Fully reset legacy rotated-square rules. */
:root body:not(.wp-admin) [data-course-preview-host] > .ec-course-preview.ec-course-popover[data-course-preview]::before,
:root body:not(.wp-admin) [data-course-preview-host] > .ec-course-preview.ec-course-popover[data-course-preview]::after {
    content: "" !important;
    position: absolute !important;
    display: block !important;
    box-sizing: content-box !important;
    width: 0 !important;
    height: 0 !important;
    min-width: 0 !important;
    min-height: 0 !important;
    max-width: none !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 0 !important;
    top: auto !important;
    right: auto !important;
    bottom: auto !important;
    left: auto !important;
    border: 0 solid transparent !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    outline: 0 !important;
    filter: none !important;
    clip-path: none !important;
    transform: none !important;
    pointer-events: none !important;
}
:root body:not(.wp-admin) [data-course-preview-host] > .ec-course-preview.ec-course-popover[data-course-preview]::before { z-index: 1 !important; }
:root body:not(.wp-admin) [data-course-preview-host] > .ec-course-preview.ec-course-popover[data-course-preview]::after { z-index: 2 !important; }
:root body:not(.wp-admin) [data-course-preview-host].is-popover-right > .ec-course-preview.ec-course-popover[data-course-preview]::before {
    top: calc(var(--course-popover-arrow-top, 34px) - 1px) !important;
    left: -11px !important;
    border-width: 10px 11px 10px 0 !important;
    border-right-color: #d8e1ee !important;
}
:root body:not(.wp-admin) [data-course-preview-host].is-popover-right > .ec-course-preview.ec-course-popover[data-course-preview]::after {
    top: var(--course-popover-arrow-top, 34px) !important;
    left: -9px !important;
    border-width: 9px 10px 9px 0 !important;
    border-right-color: #fff !important;
}
:root body:not(.wp-admin) [data-course-preview-host].is-popover-left > .ec-course-preview.ec-course-popover[data-course-preview]::before {
    top: calc(var(--course-popover-arrow-top, 34px) - 1px) !important;
    right: -11px !important;
    border-width: 10px 0 10px 11px !important;
    border-left-color: #d8e1ee !important;
}
:root body:not(.wp-admin) [data-course-preview-host].is-popover-left > .ec-course-preview.ec-course-popover[data-course-preview]::after {
    top: var(--course-popover-arrow-top, 34px) !important;
    right: -9px !important;
    border-width: 9px 0 9px 10px !important;
    border-left-color: #fff !important;
}
:root body:not(.wp-admin) [data-course-preview-host].is-popover-below > .ec-course-preview.ec-course-popover[data-course-preview]::before {
    top: -11px !important;
    left: calc(var(--course-popover-arrow-left, 30px) - 10px) !important;
    border-width: 0 10px 11px !important;
    border-bottom-color: #d8e1ee !important;
}
:root body:not(.wp-admin) [data-course-preview-host].is-popover-below > .ec-course-preview.ec-course-popover[data-course-preview]::after {
    top: -9px !important;
    left: calc(var(--course-popover-arrow-left, 30px) - 9px) !important;
    border-width: 0 9px 10px !important;
    border-bottom-color: #fff !important;
}
:root body:not(.wp-admin) [data-course-preview-host].is-popover-above > .ec-course-preview.ec-course-popover[data-course-preview]::before {
    bottom: -11px !important;
    left: calc(var(--course-popover-arrow-left, 30px) - 10px) !important;
    border-width: 11px 10px 0 !important;
    border-top-color: #d8e1ee !important;
}
:root body:not(.wp-admin) [data-course-preview-host].is-popover-above > .ec-course-preview.ec-course-popover[data-course-preview]::after {
    bottom: -9px !important;
    left: calc(var(--course-popover-arrow-left, 30px) - 9px) !important;
    border-width: 10px 9px 0 !important;
    border-top-color: #fff !important;
}
.ec-course-preview .ec-course-preview__content { display: grid; gap: 10px; padding: 20px; border-radius: inherit; }
.ec-course-preview .ec-course-preview__title { margin: 0; padding: 0 28px 0 0; color: #172239; font: 700 19px/1.35 Arial, sans-serif; letter-spacing: 0; }
.ec-course-preview .ec-course-preview__title a { color: inherit !important; text-decoration: none !important; }
.ec-course-preview .ec-course-preview__title a:hover { color: var(--ec-brand-primary, #245deb) !important; }
.ec-course-preview p.ec-course-preview__updated { display: block; margin: -4px 0 0; padding: 0; color: #28784e; font: 700 12px/1.4 Arial, sans-serif; }
.ec-course-preview .ec-course-preview__meta { display: flex; flex-wrap: wrap; gap: 4px 0; margin: 0; color: #617087; font: 400 12px/1.45 Arial, sans-serif; }
.ec-course-preview .ec-course-preview__meta span:not(:last-child)::after { content: "·"; margin: 0 7px; color: #9aa5b5; }
.ec-course-preview p.ec-course-preview__summary { display: block; margin: 0; padding: 0; color: #43516a; font: 400 14px/1.5 Arial, sans-serif; -webkit-line-clamp: unset !important; }
.ec-course-preview .ec-course-preview__outcomes h4 { margin: 0 0 8px; padding: 0; color: #27384f; font: 700 13px/1.4 Arial, sans-serif; }
.ec-course-preview .ec-course-preview__points { display: grid; gap: 7px; margin: 0; padding: 0; list-style: none; }
.ec-course-preview .ec-course-preview__points li { position: relative; margin: 0; padding: 0 0 0 22px; color: #43516a; font: 400 13px/1.45 Arial, sans-serif; }
.ec-course-preview .ec-course-preview__points li::before { content: ""; position: absolute; left: 1px; top: 4px; width: 11px; height: 6px; border-left: 2px solid #26384f; border-bottom: 2px solid #26384f; transform: rotate(-45deg); }
.ec-course-preview .ec-course-preview__actions { display: grid; grid-template-columns: minmax(0, 1fr) 48px; align-items: stretch; gap: 10px; margin: 2px 0 0; }
.ec-course-preview :is(.ec-course-preview__action, .ec-course-preview__availability, .ec-course-preview__favorite) { display: flex; align-items: center; justify-content: center; min-width: 0; min-height: 48px; margin: 0; padding: 10px 14px; border: 1px solid var(--ec-brand-primary, #245deb); border-radius: 8px; font: 700 14px/1.4 Arial, sans-serif; text-align: center; text-decoration: none; }
.ec-course-preview .ec-course-preview__action { color: var(--ec-brand-on-primary, #fff) !important; background: var(--ec-brand-primary, #245deb); }
.ec-course-preview .ec-course-preview__action:hover { border-color: var(--ec-brand-hover, #194acb); background: var(--ec-brand-hover, #194acb); color: var(--ec-brand-on-hover, #fff) !important; }
.ec-course-preview .ec-course-preview__availability { border-color: #dce4ef; color: #53657d !important; background: #f1f5f9; cursor: default; }
.ec-course-preview form.ec-course-alert { display:block; min-width:0; margin:0; padding:0; border:0; background:transparent; box-shadow:none; }
.ec-course-preview .ec-course-alert .ec-course-preview__action { width:100%; cursor:pointer; }
.ec-course-preview .ec-course-alert .ec-course-preview__action:disabled { opacity:.7; cursor:wait; }
.ec-course-preview .ec-course-alert .ec-course-preview__action[aria-pressed="true"] { color:var(--ec-brand-primary, #245deb) !important; background:var(--ec-brand-soft, #eff6ff); }
.ec-course-preview .ec-course-alert .ec-course-alert__open { display:flex; }
.ec-course-preview p.ec-course-alert__status { margin:0; padding:0; color:#617087; font:400 12px/1.5 Arial,sans-serif; }
.ec-course-preview .ec-course-alert__status[data-course-alert-error="true"] { color:#a43838; }
.ec-course-preview .ec-course-alert__status > a { color:var(--ec-brand-primary, #245deb); text-decoration:underline; text-underline-offset:2px; }
.ec-course-preview .ec-course-alert__course-link { display:inline-flex; align-items:center; min-height:32px; margin-top:4px; color:var(--ec-brand-primary, #245deb); font:700 12px/1.4 Arial,sans-serif; }
.ec-course-alert-notice { box-sizing:border-box; width:min(960px,calc(100% - 32px)); margin:20px auto; padding:16px 18px; border:1px solid #bed9ce; border-radius:9px; color:#245d49; background:#f1faf5; font:400 14px/1.6 Arial,sans-serif; overflow-wrap:anywhere; }
.ec-course-preview .ec-course-preview__favorite { width: 48px; padding: 11px; color: var(--ec-brand-primary, #245deb); background: #fff; cursor: pointer; }
.ec-course-preview .ec-course-preview__favorite svg { width: 23px; height: 23px; fill: none; stroke: currentColor; stroke-width: 1.8; }
.ec-course-preview .ec-course-preview__favorite[aria-pressed="true"] { background: var(--ec-brand-soft, #eff6ff); }
.ec-course-preview .ec-course-preview__favorite[aria-pressed="true"] svg { fill: currentColor; }
.ec-course-preview :is(a,button):focus-visible { outline: 2px solid var(--ec-brand-primary, #245deb); outline-offset: 3px; }
.ec-course-preview .ec-course-preview-close { top: 9px; right: 8px; width: 36px; height: 36px; min-height: 36px; padding: 8px; border: 0; border-radius: 50%; color: #617087; background: #fff; }
.ec-course-preview .ec-course-preview-close:hover { color: var(--ec-brand-primary, #245deb); background: var(--ec-brand-soft, #eff6ff); }
.ec-course-preview .ec-course-preview-close svg { width: 18px; height: 18px; }
.ec-course-preview .ec-course-popover__share { margin: 2px 0 0; padding-top: 10px; border-top: 1px solid #e7ecf3; }
:root body:not(.wp-admin) .ec-course-preview h3.ec-course-preview__title {
    display: block !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
    -webkit-line-clamp: unset !important;
    -webkit-box-orient: unset !important;
    font-size: calc(var(--ec-popup-title-size, 17px) * var(--ec-heading-scale, 1)) !important;
    font-weight: 700;
    line-height: 1.35 !important;
}
:root body:not(.wp-admin) .ec-course-preview .ec-course-preview__outcomes h4 { font-size: var(--ec-popup-body-size, 13px) !important; }
:root body:not(.wp-admin) .ec-course-preview .ec-course-preview__points li { font-size: calc(var(--ec-popup-body-size, 13px) - 1px) !important; }
.ec-course-preview.is-compact-preview .ec-course-preview__content { gap: 8px; padding: 16px; }
.ec-course-preview.is-compact-preview .ec-course-preview__summary { line-height: 1.45; }
@media (max-width: 600px) {
    .ec-course-preview .ec-course-preview__content { gap: 9px; padding: 18px; }
    .ec-course-preview .ec-course-preview__title { font-size: 18px; }
}