/* Course catalogue, material detail and participant dashboard share the KMS theme. */
/* Compact catalogue variant of the content guide banner. */
.portal-kms .kms-course-list .guide-hero { padding: 18px 0 24px; }
.portal-kms .kms-course-list .guide-breadcrumb { margin-bottom: 18px; }
.portal-kms .kms-course-list .guide-hero-content { gap: 32px; }
.portal-kms .kms-course-list .guide-kicker { margin-bottom: 10px; padding: 4px 8px; font-size: 9px; }
.portal-kms .kms-course-list .guide-hero h1 { font-size: clamp(24px,2.6vw,30px); }
.portal-kms .kms-course-list .guide-hero-copy > p { margin: 10px 0 14px; font-size: 12px; line-height: 1.7; }
.portal-kms .kms-course-list .guide-hero-button { gap: 14px; padding: 8px 12px; font-size: 11px; }
.portal-kms .kms-course-list .guide-hero-note { padding: 18px; border-radius: 16px; }
.portal-kms .kms-course-list .guide-note-icon { width: 34px; height: 34px; margin-bottom: 10px; border-radius: 10px; font-size: 22px; }
.portal-kms .kms-course-list .guide-hero-note h2 { margin-bottom: 8px; font-size: 15px; line-height: 1.5; }
.portal-kms .kms-course-list .guide-hero-note p { font-size: 11px; line-height: 1.7; }
.portal-kms .kms-course-list .guide-note-tags { gap: 10px; margin-top: 12px; font-size: 9px; }
/* Catalogue pagination follows the portal palette, including dark mode. */
body.portal-kms.portal-kms-page .kms-catalogue-empty { display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: 340px; padding: 36px 24px 40px; border: 1px solid var(--portal-border); border-radius: 20px; background: radial-gradient(ellipse at 50% 0, rgb(8 79 185 / 5%), transparent 65%), var(--portal-surface); text-align: center; }
body.portal-kms.portal-kms-page .kms-catalogue-empty-art { width: 180px; max-width: 100%; margin-bottom: 18px; color: var(--portal-primary); }
body.portal-kms.portal-kms-page .kms-catalogue-empty-art svg { display: block; width: 100%; height: auto; }
body.portal-kms.portal-kms-page .kms-catalogue-empty h3 { max-width: 480px; margin: 0 0 10px; color: var(--portal-text); font-size: clamp(18px, 2vw, 22px); font-weight: 600; line-height: 1.45; letter-spacing: -.025em; }
body.portal-kms.portal-kms-page .kms-catalogue-empty p { max-width: 400px; margin: 0; color: var(--portal-muted); font-size: 13px; line-height: 1.8; }
body.portal-kms.portal-kms-page .kms-catalogue-empty-action { display: inline-flex; align-items: center; justify-content: center; gap: 9px; max-width: 100%; min-height: 44px; margin-top: 24px; padding: 11px 16px; border: 1px solid #084fb9; border-radius: 10px; background: #084fb9; color: #fff; font: inherit; font-size: 12px; font-weight: 500; line-height: 1.6; cursor: pointer; transition: background-color .2s ease, box-shadow .2s ease; }
body.portal-kms.portal-kms-page .kms-catalogue-empty-action i { flex-shrink: 0; font-size: 18px; }
body.portal-kms.portal-kms-page .kms-catalogue-empty-action:hover { background: #0f4494; box-shadow: 0 4px 12px rgb(8 79 185 / 16%); }
body.portal-kms.portal-kms-page .kms-catalogue-empty-action:focus-visible { outline: 2px solid var(--portal-primary); outline-offset: 4px; }
@media (max-width: 575.98px) {
  body.portal-kms.portal-kms-page .kms-catalogue-empty { min-height: 310px; padding: 28px 18px 32px; border-radius: 16px; }
  body.portal-kms.portal-kms-page .kms-catalogue-empty-art { width: 150px; margin-bottom: 14px; }
  body.portal-kms.portal-kms-page .kms-catalogue-empty p { font-size: 12px; }
}
@media (prefers-reduced-motion: reduce) {
  body.portal-kms.portal-kms-page .kms-catalogue-empty-action { transition: none; }
}
body.portal-kms.portal-kms-page .kms-catalogue-pagination { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px; margin-top: 28px; padding-top: 22px; border-top: 1px solid var(--portal-border); }
body.portal-kms.portal-kms-page .kms-pagination-summary { margin: 0; color: var(--portal-muted); font-size: 12px; line-height: 1.6; }
body.portal-kms.portal-kms-page .kms-pagination-summary strong { color: var(--portal-text); font-weight: 600; }
body.portal-kms.portal-kms-page .kms-pagination-list { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 6px; margin: 0; padding: 0; list-style: none; }
body.portal-kms.portal-kms-page .kms-page-link { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-width: 44px; min-height: 44px; padding: 8px 12px; border: 1px solid var(--portal-border); border-radius: 12px; background: var(--portal-surface); color: var(--portal-text); font-family: inherit; font-size: 12px; font-weight: 500; line-height: 1.5; text-decoration: none; transition: border-color .2s ease, background .2s ease, color .2s ease; }
body.portal-kms.portal-kms-page .kms-page-direction { padding-inline: 14px; }
body.portal-kms.portal-kms-page a.kms-page-link:hover { border-color: var(--portal-primary); background: var(--portal-soft); color: var(--portal-primary); }
body.portal-kms.portal-kms-page a.kms-page-link:focus-visible { outline: 2px solid var(--portal-primary); outline-offset: 3px; }
body.portal-kms.portal-kms-page .kms-page-link.is-current { border-color: #084fb9; background: #084fb9; color: #fff; font-weight: 600; box-shadow: 0 4px 10px rgb(8 79 185 / 16%); }
body.portal-kms.portal-kms-page .kms-page-link.is-disabled { background: var(--portal-soft); color: var(--portal-muted); opacity: .5; cursor: default; }
body.portal-kms.portal-kms-page .kms-page-ellipsis { display: inline-flex; align-items: center; justify-content: center; min-width: 24px; min-height: 44px; color: var(--portal-muted); font-size: 12px; }
body.portal-kms.portal-kms-page .kms-page-chevron { flex-shrink: 0; width: 7px; height: 7px; border-top: 1.5px solid currentColor; border-right: 1.5px solid currentColor; transform: rotate(45deg); }
body.portal-kms.portal-kms-page .kms-page-chevron.is-prev { transform: rotate(-135deg); }
@media (max-width: 767.98px) {
  body.portal-kms.portal-kms-page .kms-catalogue-pagination { flex-direction: column; gap: 14px; }
}
@media (max-width: 575.98px) {
  body.portal-kms.portal-kms-page .kms-pagination-list { width: 100%; justify-content: space-between; }
  body.portal-kms.portal-kms-page .kms-page-number { display: none; }
  body.portal-kms.portal-kms-page .kms-page-direction { padding-inline: 12px; }
}
@media (prefers-reduced-motion: reduce) {
  body.portal-kms.portal-kms-page .kms-page-link { transition: none; }
}
/* A compact Highlight header keeps copy and carousel controls aligned. */
body.portal-kms.portal-kms-page .kms-course-list .kms-highlight { padding: 24px; border-radius: 20px; }
/* Avoid stacking the catalogue spacer with the legacy mobile card margin. */
@media (max-width: 767.98px) {
  body.portal-kms.portal-kms-page .kms-course-list .guide-hero + .section-box.mt-50 { margin-top: 16px !important; }
  body.portal-kms.portal-kms-page .kms-course-list .kms-highlight { margin-top: 0; }
}
body.portal-kms.portal-kms-page .kms-highlight-header { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 20px; padding-bottom: 20px; border-bottom: 1px solid var(--portal-border); }
body.portal-kms.portal-kms-page .kms-highlight-intro { display: flex; align-items: center; gap: 14px; min-width: 0; }
body.portal-kms.portal-kms-page .kms-highlight-icon { display: inline-flex; flex: 0 0 48px; align-items: center; justify-content: center; width: 48px; height: 48px; border: 1px solid var(--portal-border); border-radius: 14px; background: var(--portal-soft); color: var(--portal-primary); font-size: 26px; }
body.portal-kms.portal-kms-page .kms-highlight-copy { min-width: 0; }
body.portal-kms.portal-kms-page .kms-highlight-copy h2 { margin: 0 0 5px; color: var(--portal-text); font-size: clamp(20px, 2vw, 24px); font-weight: 600; line-height: 1.3; letter-spacing: -.03em; }
body.portal-kms.portal-kms-page .kms-highlight-copy p { margin: 0; color: var(--portal-muted); font-size: 12px; line-height: 1.7; }
body.portal-kms.portal-kms-page .kms-highlight-controls { display: flex; flex-shrink: 0; align-items: center; gap: 8px; }
body.portal-kms.portal-kms-page .kms-highlight-controls :is(.swiper-button-prev,.swiper-button-next) { position: static; display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; margin: 0; padding: 0; border-radius: 12px; background-image: none; box-shadow: none; cursor: pointer; transition: background .2s ease, border-color .2s ease; }
body.portal-kms.portal-kms-page .kms-highlight-controls :is(.swiper-button-prev,.swiper-button-next)::after { width: 8px; height: 8px; border-width: 2px; }
body.portal-kms.portal-kms-page .kms-highlight-controls .swiper-button-prev::after { margin-left: 3px; }
body.portal-kms.portal-kms-page .kms-highlight-controls .swiper-button-next::after { margin-right: 3px; }
body.portal-kms.portal-kms-page .kms-highlight-controls button:hover { border-color: var(--portal-primary); }
body.portal-kms.portal-kms-page .kms-highlight-controls button:hover::after { border-color: #fff; }
body.portal-kms.portal-kms-page .kms-highlight-controls button:focus-visible { outline: 2px solid var(--portal-primary); outline-offset: 3px; }
body.portal-kms.portal-kms-page .kms-highlight-controls .swiper-button-disabled { opacity: .35; cursor: default; pointer-events: none; }
body.portal-kms.portal-kms-page .kms-highlight-controls .swiper-button-lock { display: none; }
body.portal-kms.portal-kms-page .kms-highlight-content { min-width: 0; }
body.portal-kms.portal-kms-page .kms-highlight .swiper-wrapper { padding-block: 0 !important; }
body.portal-kms.portal-kms-page .kms-highlight .swiper-slide > .col-12 { padding-inline: 0; }
body.portal-kms.portal-kms-page .kms-highlight .kms-section-loader { border-radius: 14px; background: var(--portal-soft); }
/* Keep the loading carousel in one row and reserve its height in the layout. */
body.portal-kms.portal-kms-page .kms-highlight .kms-section-loader-host { display: grid; min-width: 0; overflow: hidden; }
body.portal-kms.portal-kms-page .kms-highlight .kms-section-loader { position: relative; inset: auto; grid-area: 1 / 1; min-width: 0; min-height: 0; align-items: flex-start; }
body.portal-kms.portal-kms-page .kms-highlight #kms-highlight-slider { grid-area: 1 / 1; min-width: 0; width: 100%; }
body.portal-kms.portal-kms-page .kms-highlight .kms-skeleton-track { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: calc((100% - 60px) / 4); gap: 20px; min-width: 0; overflow: hidden; }
body.portal-kms.portal-kms-page .kms-highlight .kms-skeleton-card { min-width: 0; }
@media (max-width: 1149.98px) {
  body.portal-kms.portal-kms-page .kms-highlight .kms-skeleton-track { grid-auto-columns: calc((100% - 40px) / 3); }
}
@media (max-width: 767.98px) {
  body.portal-kms.portal-kms-page .kms-highlight .kms-skeleton-track { grid-auto-columns: calc((100% - 16px) / 2); gap: 16px; }
}
@media (max-width: 479.98px) {
  body.portal-kms.portal-kms-page .kms-highlight .kms-skeleton-track { grid-auto-columns: calc((100% - 2.4px) / 1.15); }
}
/* Search skeletons reserve their full height, including multiple mobile rows. */
body.portal-kms.portal-kms-page .kms-course-list .kms-list-loader-host { display: grid; min-width: 0; min-height: 0 !important; }
body.portal-kms.portal-kms-page #hasilPencariannya { grid-area: 1 / 1; min-width: 0; width: 100%; }
body.portal-kms.portal-kms-page #kmsListLoader { position: relative; inset: auto; grid-area: 1 / 1; align-items: flex-start; min-width: 0; min-height: 0; padding-top: 24px; }
body.portal-kms.portal-kms-page #kmsListLoader.is-hidden,
body.portal-kms.portal-kms-page #kmsSliderLoader.is-hidden { display: none; }
body.portal-kms.portal-kms-page #kmsListLoader .kms-skeleton-track { grid-template-columns: repeat(4, minmax(0, 1fr)); align-items: start; gap: 20px; min-width: 0; }
body.portal-kms.portal-kms-page #kmsListLoader .kms-skeleton-card { min-width: 0; }
@media (max-width: 1199.98px) {
  body.portal-kms.portal-kms-page #kmsListLoader .kms-skeleton-track { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 991.98px) {
  body.portal-kms.portal-kms-page #kmsListLoader .kms-skeleton-track { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 767.98px) {
  .portal-kms .kms-skeleton-body { padding: 12px 12px 6px; }
  .portal-kms .kms-skeleton-image { height: 150px; }
}
@media (max-width: 575.98px) {
  body.portal-kms.portal-kms-page .kms-course-list .kms-highlight { padding: 16px; border-radius: 16px; }
  body.portal-kms.portal-kms-page .kms-highlight-header { flex-wrap: wrap; gap: 14px; margin-bottom: 16px; padding-bottom: 16px; }
  body.portal-kms.portal-kms-page .kms-highlight-intro { flex: 1 1 100%; gap: 12px; }
  body.portal-kms.portal-kms-page .kms-highlight-icon { flex-basis: 42px; width: 42px; height: 42px; font-size: 23px; }
  body.portal-kms.portal-kms-page .kms-highlight-controls { margin-left: auto; }
}
@media (prefers-reduced-motion: reduce) {
  body.portal-kms.portal-kms-page .kms-highlight-controls button { transition: none; }
}
/* Match the home cards in both the catalogue and Highlight. */
body.portal-kms.portal-kms-page .kms-course-list .product-item-3 { display: flex; flex-direction: column; width: 100%; height: 100%; min-height: 0; margin: 0; overflow: hidden; }
body.portal-kms.portal-kms-page .kms-course-list .product-item-3.wow { visibility: visible !important; animation: none; }
body.portal-kms.portal-kms-page .kms-course-list .product-item-3:hover { transform: none; }
body.portal-kms.portal-kms-page .kms-course-list .product-item-3 .card { display: flex; flex: 1; flex-direction: column; min-width: 0; border-radius: 0; background: transparent; }
body.portal-kms.portal-kms-page .kms-course-list .product-item-3 .product-info { flex: 1; min-width: 0; margin: 0; padding: 16px !important; }
body.portal-kms.portal-kms-page .kms-course-list .product-item-3 .product-info h3 { display: -webkit-box; height: 66px; min-height: 66px; margin: 0 0 12px; overflow: hidden; color: var(--portal-text); font-size: 13px; font-weight: 600; line-height: 22px; overflow-wrap: anywhere; -webkit-box-orient: vertical; -webkit-line-clamp: 3; }
body.portal-kms.portal-kms-page .kms-course-list .product-item-3 .smol-font { display: block; min-height: 32px; margin-bottom: 6px; color: var(--portal-muted); font-size: 10px; line-height: 16px; }
body.portal-kms.portal-kms-page .kms-course-list .product-item-3 .rating { margin-top: 0 !important; }
body.portal-kms.portal-kms-page .kms-course-list .product-item-3 .box-rating.abs-info { position: static; width: auto; }
body.portal-kms.portal-kms-page .kms-course-list .product-item-3 .infopd { padding-left: 0; }
body.portal-kms.portal-kms-page .kms-course-list .product-item-3 .tag-view { color: var(--portal-muted); font-family: inherit; font-size: 10px; font-weight: 500; }
body.portal-kms.portal-kms-page .kms-course-list .product-item-3 .product-image .location-icon { position: absolute; bottom: 10px; left: 10px; z-index: 2; max-width: calc(100% - 20px); margin: 0; padding: 5px 9px 5px 24px; overflow: hidden; border: 1px solid rgb(255 255 255 / 60%); border-radius: 7px; background: url('../../kudagang-kms/imgs/page/homepage8/location.svg') no-repeat 8px center / 12px, rgb(255 255 255 / 95%); color: #273b4a; font-family: inherit; font-size: 9px; font-weight: 500; line-height: 15px; text-overflow: ellipsis; white-space: nowrap; }
body.portal-kms.portal-kms-page .kms-course-list .product-item-3 :is(.type-video,.type-pdf) { position: static; flex: 0 0 auto; width: 100%; margin-top: auto; padding: 8px 16px; border-top: 1px solid var(--portal-border); color: #fff; font-size: 10px; line-height: 18px; }
body.portal-kms.portal-kms-page .kms-course-list .product-item-3 .type-video { background: #59935b; }
body.portal-kms.portal-kms-page .kms-course-list .product-item-3 .type-pdf { background: #c0392b; }
body.portal-kms.portal-kms-page .kms-course-list .swiper-populer .swiper-wrapper { align-items: stretch; }
body.portal-kms.portal-kms-page .kms-course-list .swiper-populer .swiper-slide { display: flex; height: auto; }
body.portal-kms.portal-kms-page .kms-course-list .swiper-populer .swiper-slide > .col-12 { display: flex; }
body.portal-kms.portal-kms-page .kms-course-list .grid-container > .row { margin-top: 24px !important; row-gap: 20px; --bs-gutter-x: 20px; }
body.portal-kms.portal-kms-page .kms-course-list .grid-container.list-view .product-item-3 .card { flex-direction: row; }
body.portal-kms.portal-kms-page .kms-course-list .grid-container.list-view .space-list { flex: 0 0 32%; width: 32%; max-width: 240px; }
body.portal-kms.portal-kms-page .kms-course-list .grid-container.list-view .product-image { height: 100%; }
body.portal-kms.portal-kms-page .kms-course-list .grid-container.list-view .product-image img { height: 100%; border-radius: 0; }
body.portal-kms.portal-kms-page .kms-course-list .kms-catalogue-heading { margin-bottom: 20px; }
body.portal-kms.portal-kms-page .kms-course-list .kms-catalogue-heading h4 { color: var(--portal-text); font-size: 20px; font-weight: 600; }
body.portal-kms.portal-kms-page .kms-course-list .filters-products { flex-wrap: wrap; }
body.portal-kms.portal-kms-page .kms-course-list .filters-products .fitler-info { flex-wrap: wrap; gap: 12px; }
body.portal-kms.portal-kms-page .kms-course-list :is(.btn-grid,.btn-list) { display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; padding: 0; border: 0; border-radius: 6px; background: transparent; }
body.portal-kms.portal-kms-page .kms-course-list :is(.btn-grid,.btn-list).active { background: var(--portal-soft); }
body.portal-kms.portal-kms-page .kms-course-list :is(.btn-grid,.btn-list) i { position: static !important; font-size: 24px !important; }
@media (max-width: 575.98px) {
  body.portal-kms.portal-kms-page .kms-course-list .product-item-3 .product-info { padding: 12px !important; }
  body.portal-kms.portal-kms-page .kms-course-list .product-item-3 .product-info h3 { height: 60px; min-height: 60px; font-size: 12px; line-height: 20px; }
  body.portal-kms.portal-kms-page .kms-course-list .grid-container.list-view .product-item-3 .card { flex-direction: column; }
  body.portal-kms.portal-kms-page .kms-course-list .grid-container.list-view .space-list { flex: auto; width: 100%; max-width: none; }
  body.portal-kms.portal-kms-page .kms-course-list .grid-container.list-view .product-image img { height: auto; }
}
body.portal-kms.portal-kms-page .main { min-height: 65vh; padding-bottom: 48px; background: var(--portal-soft); }
body.portal-kms.portal-kms-page :is(.kms-list-fluid,.preview-container,.kms-preview .banner-hero .container,.preview-description) { width: 100%; max-width: 1200px; }
body.portal-kms.portal-kms-page :is(.kms-page-heading,.kms-course-list .banner-breadcrums) { position: relative; overflow: hidden; min-height: 0; padding: 36px 0; border-bottom: 1px solid var(--portal-border); background: radial-gradient(ellipse at 90% 0,rgb(128 201 80 / 22%),transparent 65%),var(--portal-surface); box-shadow: none; }
body.portal-kms.portal-kms-page .kms-page-eyebrow { display: inline-block; margin-bottom: 8px; color: var(--portal-primary); font-size: 10px; font-weight: 600; letter-spacing: .1em; }
body.portal-kms.portal-kms-page :is(.kms-page-heading h1,.kms-course-list .banner-breadcrums h1) { margin: 0; color: var(--portal-text) !important; font-size: clamp(24px,3vw,32px); font-weight: 600; line-height: 1.4; letter-spacing: -.04em; }
body.portal-kms.portal-kms-page :is(.kms-page-heading p,.kms-page-intro) { margin: 10px 0 0; color: var(--portal-muted); font-size: 12px; line-height: 1.8; }
body.portal-kms.portal-kms-page .kms-course-list .banner-hero.banner-breadcrums.bg-kms-up { border-bottom-color: rgb(255 255 255 / 12%); background: radial-gradient(ellipse at 85% 20%,#2364ad 0,transparent 55%),linear-gradient(135deg,#103c80,#0f4494 60%,#0d3878); color: #fff; }
body.portal-kms.portal-kms-page .kms-course-list .banner-hero.banner-breadcrums.bg-kms-up::before { content: ''; position: absolute; inset: 0; background: url('../../kudagang-kms/imgs/page/about/1/doodle.png') center / 800px repeat; mix-blend-mode: screen; opacity: .08; pointer-events: none; }
body.portal-kms.portal-kms-page .kms-course-list .bg-kms-up > .kms-list-fluid { position: relative; z-index: 1; }
body.portal-kms.portal-kms-page .kms-course-list .banner-hero.banner-breadcrums.bg-kms-up h1 { color: #fff !important; }
body.portal-kms.portal-kms-page .kms-course-list .bg-kms-up .kms-page-eyebrow { color: #bcfe5a; }
body.portal-kms.portal-kms-page .kms-course-list .bg-kms-up .kms-page-intro { color: #d3e2f4; }
body.portal-kms.portal-kms-page :is(.kms-course-list .mob-marg,.kms-course-list .filters-products,.kms-course-list #sticker .sidebar,.kms-course-list .product-item-3,.preview-content-card,.kms-learning .category-grid-3) { border: 1px solid var(--portal-border); border-radius: 16px; background: var(--portal-surface); box-shadow: var(--portal-shadow); }
body.portal-kms.portal-kms-page .kms-course-list :is(.mob-marg h4,#sticker .widget-title h3,#sticker .widget-content h4) { color: var(--portal-text); font-weight: 600; }
body.portal-kms.portal-kms-page .kms-course-list :is(.mob-marg h4,#sticker .widget-title h3) { font-size: 20px; }
body.portal-kms.portal-kms-page .kms-course-list #sticker .widget-content h4 { font-size: 13px; }
body.portal-kms.portal-kms-page .kms-course-list :is(.mob-marg p,.number-info,.text-body-text,.noto-font,.product-info h3 a) { color: var(--portal-muted); font-family: inherit; }
body.portal-kms.portal-kms-page .kms-course-list .product-info h3 a { color: var(--portal-text); font-size: 13px; font-weight: 500; }
body.portal-kms.portal-kms-page .kms-course-list .product-info h3 a:hover { color: var(--portal-primary); }
body.portal-kms.portal-kms-page .kms-course-list .product-item-3:hover { border-color: var(--portal-primary); box-shadow: var(--portal-shadow); }
body.portal-kms.portal-kms-page .kms-course-list .filters-products { gap: 16px; min-height: 54px; }
body.portal-kms.portal-kms-page .kms-course-list .filters-products :is(.btn,.btn-grid,.btn-list) { color: var(--portal-primary); }
body.portal-kms.portal-kms-page .kms-course-list #sticker :is(input.form-control,select.form-control) { border-color: var(--portal-border) !important; border-radius: 9px; background: var(--portal-soft) !important; color: var(--portal-text); }
body.portal-kms.portal-kms-page .kms-course-list #sticker .btn-filter { background: #084fb9; font-size: 12px; font-weight: 500; }
body.portal-kms.portal-kms-page .kms-course-list .form-check-input { accent-color: #084fb9; }
body.portal-kms.portal-kms-page .kms-course-list :is(.swiper-button-next-populer,.swiper-button-prev-populer) { border-color: var(--portal-border); background: var(--portal-surface); box-shadow: var(--portal-shadow); }
body.portal-kms.portal-kms-page .kms-course-list :is(.swiper-button-next-populer,.swiper-button-prev-populer)::after { border-color: var(--portal-primary); }
body.portal-kms.portal-kms-page :is(.kms-section-loader,.kms-skeleton-card) { background: var(--portal-soft); }
body.portal-kms.portal-kms-page .kms-section-loader-content { color: var(--portal-primary); font-family: inherit; }
body.portal-kms.portal-kms-page :is(.select2-container--default .select2-selection--multiple,.select2-dropdown) { border-color: var(--portal-border); border-radius: 9px; background: var(--portal-surface); color: var(--portal-text); }
body.portal-kms.portal-kms-page .select2-container--default .select2-selection--multiple .select2-selection__choice { border-color: var(--portal-border); background: var(--portal-soft); color: var(--portal-text); }
body.portal-kms.portal-kms-page :is(.kms-preview,.kms-learning) .banner-hero { padding: 0; border-bottom: 1px solid var(--portal-border); background: var(--portal-surface); }
/* Override the legacy background utility on material breadcrumbs. */
body.portal-kms.portal-kms-page :is(.kms-preview,.kms-learning) .banner-hero.bg-gray-100 { background-color: var(--portal-surface) !important; }
body.portal-kms.portal-kms-page .breadcrumb { padding: 16px 0; }
body.portal-kms.portal-kms-page .breadcrumb ul { display: flex; flex-wrap: wrap; gap: 8px 0; }
body.portal-kms.portal-kms-page .breadcrumb li a { color: var(--portal-muted); font-size: 11px; white-space: normal; overflow-wrap: anywhere; }
body.portal-kms.portal-kms-page .breadcrumb li:last-child a { max-width: 100%; white-space: normal; }
/* Let contributor tooltips extend above the material content below the hero. */
body.portal-kms.portal-kms-page :is(.preview-hero,.kms-learning .bg-kms-detail) { position: relative; z-index: 10; overflow: visible; padding: 0; border-radius: 20px; background: radial-gradient(ellipse at 100% 0,rgb(128 201 80 / 28%),transparent 65%),linear-gradient(120deg,#0f4494,#173e6c); box-shadow: var(--portal-shadow); }
body.portal-kms.portal-kms-page :is(.preview-hero,.kms-learning .bg-kms-detail) > .product-info { padding: 28px; }
body.portal-kms.portal-kms-page :is(.preview-title,.kms-learning .text-title) { margin: 0 0 20px !important; font-size: clamp(22px,2.6vw,30px) !important; font-weight: 600; line-height: 1.5; letter-spacing: -.03em; overflow-wrap: anywhere; }
body.portal-kms.portal-kms-page .kms-learning .bg-kms-detail .image-profil { width: 40px; height: 40px; object-fit: cover; border-radius: 50%; }
body.portal-kms.portal-kms-page .btn-kontributor .kms-contributor-tooltip { display: block; width: min(300px, calc(100vw - 40px)); height: auto; padding: 0; border: 1px solid var(--portal-border); border-radius: 16px; background: var(--portal-surface); color: var(--portal-text); box-shadow: 0 16px 40px rgb(15 40 75 / 18%); text-align: left; visibility: hidden; pointer-events: none; transition: opacity .15s ease, top .15s ease, visibility .15s ease; }
body.portal-kms.portal-kms-page .btn-kontributor input:checked ~ .kms-contributor-tooltip { width: min(300px, calc(100vw - 40px)); height: auto; animation: none; visibility: visible; pointer-events: auto; }
body.portal-kms.portal-kms-page .btn-kontributor .kms-contributor-tooltip::after { background: var(--portal-surface); border-top: 1px solid var(--portal-border); border-left: 1px solid var(--portal-border); }
body.portal-kms.portal-kms-page .kms-contributor-heading { position: relative; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 16px 18px 12px; border-bottom: 1px solid var(--portal-border); }
body.portal-kms.portal-kms-page .kms-contributor-heading .kontributor-title { margin: 0; color: var(--portal-text); font-size: 13px; font-weight: 600; line-height: 1.5; }
body.portal-kms.portal-kms-page .kms-contributor-count { flex-shrink: 0; padding: 3px 8px; border-radius: 20px; background: var(--portal-soft); color: var(--portal-muted); font-size: 10px; font-weight: 500; }
body.portal-kms.portal-kms-page .kms-contributor-list { display: grid; gap: 0; max-height: 280px; margin: 0; padding: 6px 18px; overflow-y: auto; overscroll-behavior: contain; list-style: none; }
body.portal-kms.portal-kms-page .kms-contributor-item { display: flex; align-items: flex-start; gap: 10px; padding: 12px 0; }
body.portal-kms.portal-kms-page .kms-contributor-item + .kms-contributor-item { border-top: 1px solid var(--portal-border); }
body.portal-kms.portal-kms-page .kms-contributor-number { display: grid; place-items: center; flex: 0 0 28px; height: 28px; border-radius: 9px; background: var(--portal-soft); color: var(--portal-primary); font-size: 11px; font-weight: 600; }
body.portal-kms.portal-kms-page .kms-contributor-copy { display: grid; gap: 3px; min-width: 0; padding-top: 3px; overflow-wrap: anywhere; }
body.portal-kms.portal-kms-page .kms-contributor-name { color: var(--portal-text); font-size: 12px; font-weight: 600; line-height: 1.6; }
body.portal-kms.portal-kms-page .kms-contributor-note { color: var(--portal-muted); font-size: 11px; line-height: 1.6; }
body.portal-kms.portal-kms-page .btn-kontributor:has(input:focus-visible) > .btn { outline: 2px solid #fff; outline-offset: 4px; }
body.portal-kms.portal-kms-page :is(.preview-content-card,.kms-learning .category-grid-3) { padding: 18px !important; }
body.portal-kms.portal-kms-page :is(.preview-media,.kms-learning #player,.kms-learning #filePdfnya) { overflow: hidden; width: 100%; border: 0; border-radius: 12px; background: var(--portal-soft); }
body.portal-kms.portal-kms-page :is(.preview-sections-title,.preview-sections-title span) { color: var(--portal-text); }
body.portal-kms.portal-kms-page :is(.preview-sections,#v-pills-section-progress) .tab-border { width: 100%; margin: 0 0 8px; padding: 12px; border: 1px solid var(--portal-border) !important; border-radius: 10px !important; background: var(--portal-soft); color: var(--portal-text); font-size: 12px; line-height: 1.6; }
body.portal-kms.portal-kms-page :is(.preview-sections,#v-pills-section-progress) .tab-border:is(:hover,.active) { border-color: var(--portal-primary) !important; background: var(--portal-surface); color: var(--portal-primary); }
body.portal-kms.portal-kms-page #v-pills-section-progress { margin-right: 0 !important; }
body.portal-kms.portal-kms-page .button-done { padding: 5px 8px; border-radius: 6px; background: #084fb9; color: #fff; font-size: 10px; }
body.portal-kms.portal-kms-page :is(.preview-description,.kms-learning .product-description) .nav { flex-wrap: wrap; gap: 8px; }
body.portal-kms.portal-kms-page :is(.preview-description,.kms-learning .product-description) .btn-tab { margin: 0; padding: 10px 14px; border: 1px solid var(--portal-border); border-radius: 9px; background: var(--portal-surface); color: var(--portal-muted); font-size: 12px; }
body.portal-kms.portal-kms-page :is(.preview-description,.kms-learning .product-description) .btn-tab.active { border-color: #084fb9; background: #084fb9; color: #fff; }
body.portal-kms.portal-kms-page :is(.preview-description,.kms-learning .product-description) .tab-content { padding: 22px; border: 1px solid var(--portal-border); border-radius: 14px; background: var(--portal-surface); }
body.portal-kms.portal-kms-page :is(.isi-desc,.color-gray-500,.color-gray-600,.color-gray-900,.color-gray-1200) { color: var(--portal-text); }
body.portal-kms.portal-kms-page :is(.preview-description,.kms-learning .product-description) .isi-desc { background: transparent; color: var(--portal-text); font-family: inherit; font-size: 15px; line-height: 1.9; }
body.portal-kms.portal-kms-page .has-dropcap::first-letter { float: none; margin: 0; padding: 0; font: inherit; color: inherit; }
body.portal-kms.portal-kms-page .preview-share { border: 1px solid var(--portal-border); border-radius: 14px; background: var(--portal-surface); }
body.portal-kms.portal-kms-page :is(.kms-preview,.kms-learning) .social-sticky h3 { color: var(--portal-text); }
body.portal-kms.portal-kms-page :is(.kms-preview,.kms-learning) .social-sticky .wrapper .icon { background: var(--portal-soft); color: var(--portal-primary); border: 1px solid var(--portal-border); }
body.portal-kms.portal-kms-page :is(.kms-preview,.kms-learning) .social-sticky .wrapper .icon a { color: inherit; }
body.portal-kms.portal-kms-page :is(.kms-preview,.kms-learning) .social-sticky .wrapper .facebook:hover { background: #1877f2; color: #fff; }
body.portal-kms.portal-kms-page :is(.kms-preview,.kms-learning) .social-sticky .wrapper .twitter:hover { background: #1da1f2; color: #fff; }
body.portal-kms.portal-kms-page :is(.kms-preview,.kms-learning) .social-sticky .wrapper .instagram:hover { background: #16a085; color: #fff; }
body.portal-kms.portal-kms-page :is(.kms-preview,.kms-learning) .social-sticky .wrapper .icon a:focus-visible { outline: 2px solid var(--portal-primary); outline-offset: 4px; border-radius: 4px; }
body.portal-kms.portal-kms-page :is(.btn-primary,.preview-access .btn) { border-radius: 10px; background: #084fb9; color: #fff; }
body.portal-kms.portal-kms-page .modal-content { border: 1px solid var(--portal-border); border-radius: 18px; background: var(--portal-surface); color: var(--portal-text); }
body.portal-kms.portal-kms-page .modal-content :is(.box-gray-100,.block-price-item) { background: var(--portal-soft); color: var(--portal-text); }
body.portal-kms.portal-kms-page .form-control { border-color: var(--portal-border); background: var(--portal-surface); color: var(--portal-text); }
body.portal-kms.portal-kms-page .table { color: var(--portal-text); border-color: var(--portal-border); }
body.portal-kms.portal-kms-page .kms-participant-dashboard .nav-pill-bg { overflow: hidden; padding: 8px; border: 1px solid var(--portal-border); border-radius: 18px; background: var(--portal-surface); box-shadow: var(--portal-shadow); }
body.portal-kms.portal-kms-page .kms-participant-dashboard .user-account { display: flex; align-items: center; gap: 12px; }
body.portal-kms.portal-kms-page .kms-participant-dashboard .user-account img { width: 44px; height: 44px; border-radius: 50%; object-fit: cover; }
body.portal-kms.portal-kms-page .kms-participant-dashboard .user-name { color: var(--portal-text); font-size: 13px; line-height: 1.6; }
body.portal-kms.portal-kms-page .kms-participant-dashboard .user-name .text-brand { color: var(--portal-primary); }
body.portal-kms.portal-kms-page .kms-participant-dashboard .nav-shadow { padding: 8px !important; box-shadow: none; }
body.portal-kms.portal-kms-page .kms-participant-dashboard .nav-pills .nav-link { display: flex; align-items: center; padding: 12px; border-radius: 10px; background: transparent; color: var(--portal-muted); text-align: left; font-size: 12px; font-weight: 500; }
body.portal-kms.portal-kms-page .kms-participant-dashboard .nav-pills .nav-link.active { background: #084fb9; color: #fff; box-shadow: 0 4px 12px rgb(8 79 185 / 12%); }
body.portal-kms.portal-kms-page .kms-participant-dashboard .circle-icon { width: 30px; height: 30px; border-radius: 8px; background: var(--portal-soft); color: var(--portal-primary); font-size: 18px; }
body.portal-kms.portal-kms-page .kms-participant-dashboard .nav-link.active .circle-icon { background: rgb(255 255 255 / 16%); color: #fff; }
body.portal-kms.portal-kms-page .kms-participant-dashboard #v-pills-tabContent { padding: 24px !important; border: 1px solid var(--portal-border); border-radius: 18px; background: var(--portal-surface) !important; box-shadow: var(--portal-shadow); }
body.portal-kms.portal-kms-page .kms-participant-dashboard #v-pills-tabContent > .tab-pane { margin-right: 0 !important; }
body.portal-kms.portal-kms-page .stats-header { gap: 12px; margin-bottom: 24px; padding: 14px; border-color: var(--portal-border); border-radius: 12px; background: var(--portal-soft); box-shadow: none; }
body.portal-kms.portal-kms-page .stats-header .stats-badge { width: 36px; height: 36px; border-radius: 10px; background: #084fb9; font-size: 22px; }
body.portal-kms.portal-kms-page .stats-header .stats-title { color: var(--portal-text); font-size: 12px; line-height: 1.7; }
body.portal-kms.portal-kms-page .stats-header .stats-title strong { color: var(--portal-primary); }
body.portal-kms.portal-kms-page .stat-card { flex-wrap: wrap; gap: 14px; padding: 20px; border-color: var(--portal-border); border-radius: 14px; background: var(--portal-surface); box-shadow: none; }
body.portal-kms.portal-kms-page .stat-card:hover { box-shadow: var(--portal-shadow); transform: translateY(-2px); }
body.portal-kms.portal-kms-page .stat-card .stat-icon { width: 56px; height: 56px; border-radius: 12px; padding: 10px; }
body.portal-kms.portal-kms-page .stat-card .stat-value { color: var(--portal-text); font-size: 28px; }
body.portal-kms.portal-kms-page .stat-card .stat-label { color: var(--portal-muted); font-size: 11px; }
body.portal-kms.portal-kms-page .stat-card .stat-pill { position: static; margin-left: auto; font-size: 9px; }
body.portal-kms.portal-kms-page .dashboard-list .border-card { border: 1px solid var(--portal-border); border-radius: 14px; background: var(--portal-surface); box-shadow: none; }
body.portal-kms.portal-kms-page .dashboard-list .product-info h3 { color: var(--portal-text); font-size: 14px; line-height: 1.6; }
body.portal-kms.portal-kms-page .dashboard-list .filter-bar { flex-wrap: wrap; }
body.portal-kms.portal-kms-page .dashboard-list .location-icon.cat-line { background: var(--portal-soft); color: var(--portal-primary); font-weight: 500; font-size: 10px; }
body.portal-kms.portal-kms-page .mobile-menu a.active { color: var(--portal-primary) !important; font-weight: 600; }
html.dark-scheme body.portal-kms.portal-kms-page :is(.stat-icon,.stat-pill) { background: var(--portal-soft) !important; }
html.dark-scheme body.portal-kms.portal-kms-page .select2-results__option[aria-selected=true] { background: var(--portal-soft); }
@media (max-width: 1199px) {
  body.portal-kms.portal-kms-page .header .main-header .header-left { flex: 1; }
}
@media (max-width: 767px) {
  body.portal-kms.portal-kms-page :is(.kms-page-heading,.kms-course-list .banner-breadcrums) { padding-block: 26px; }
  body.portal-kms.portal-kms-page .kms-list-fluid { padding-inline: 18px; }
  body.portal-kms.portal-kms-page :is(.preview-hero,.kms-learning .bg-kms-detail) > .product-info { padding: 20px; }
  body.portal-kms.portal-kms-page .kms-participant-dashboard .nav-pill-bg { margin-bottom: 20px; }
  body.portal-kms.portal-kms-page .kms-participant-dashboard #v-pills-tab { flex-direction: row !important; flex-wrap: wrap; gap: 6px; }
  body.portal-kms.portal-kms-page .kms-participant-dashboard #v-pills-tab .nav-link { flex: 1 1 auto; gap: 6px; margin-bottom: 0 !important; padding: 8px; font-size: 10px; }
  body.portal-kms.portal-kms-page .kms-participant-dashboard .circle-icon { margin-right: 0 !important; width: 24px; height: 24px; }
  body.portal-kms.portal-kms-page .kms-participant-dashboard #v-pills-tabContent { padding: 16px !important; }
  body.portal-kms.portal-kms-page :is(.preview-description,.kms-learning .product-description) .tab-content { padding: 16px; }
  body.portal-kms.portal-kms-page .kms-footer-bottom { justify-content: center; text-align: center; }
  body.portal-kms.portal-kms-page .kms-learning #filePdfnya { height: 65vh; }
}
@media (prefers-reduced-motion: reduce) {
  body.portal-kms.portal-kms-page :is(.stat-card,.product-item-3,.tab-border,.kms-section-loader) { transition: none; }
  body.portal-kms.portal-kms-page :is(.stat-card,.product-item-3,.tab-border):hover { transform: none; }
  body.portal-kms.portal-kms-page :is(.kms-skeleton-block,.kms-section-loader-spinner) { animation: none; }
}

body.portal-kms.portal-kms-page .preview-description .btn.btn-tab { padding: 10px 14px; font-size: 12px; font-weight: 500; }
body.portal-kms.portal-kms-page .preview-description .btn.btn-tab:is(.active,:hover) { border-color: #084fb9 !important; background: #084fb9 !important; color: #fff !important; }
body.portal-kms.portal-kms-page .preview-description .badge { background: var(--portal-soft) !important; color: var(--portal-primary); }
body.portal-kms.portal-kms-page .select2-search__field { color: var(--portal-text); }

/* Search and dropdown filters follow the Satu Data catalogue toolbar. */
body.portal-kms.portal-kms-page .kms-catalogue-filters [hidden] { display: none !important; }
body.portal-kms.portal-kms-page .kms-catalogue-search { display: flex; align-items: center; gap: 12px; margin-bottom: 20px; padding: 10px 12px 10px 18px; border: 1px solid var(--portal-border); border-radius: 12px; background: var(--portal-surface); }
body.portal-kms.portal-kms-page .kms-catalogue-search > i { color: var(--portal-primary); font-size: 22px; }
body.portal-kms.portal-kms-page .kms-catalogue-search input { flex: 1; min-width: 0; width: 100%; height: 40px; padding: 0; border: 0; background: transparent; color: var(--portal-text); font: inherit; font-size: 13px; }
body.portal-kms.portal-kms-page .kms-catalogue-search:focus-within { border-color: var(--portal-primary); }
body.portal-kms.portal-kms-page .kms-search-submit { flex-shrink: 0; padding: 12px 18px; border-radius: 8px; background: #084fb9; color: #fff; font-size: 12px; }
body.portal-kms.portal-kms-page :is(.kms-catalogue-toolbar,.kms-catalogue-filter-group,.kms-catalogue-actions) { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; min-width: 0; }
body.portal-kms.portal-kms-page .kms-catalogue-toolbar { justify-content: space-between; padding: 16px; border: 1px solid var(--portal-border); border-radius: 12px; background: var(--portal-surface); }
body.portal-kms.portal-kms-page .kms-filter-dropdown { position: relative; max-width: 100%; min-width: 0; }
body.portal-kms.portal-kms-page .kms-filter-trigger { display: flex; align-items: center; gap: 10px; max-width: 100%; min-height: 44px; padding: 10px 14px; border: 1px solid var(--portal-border); border-radius: 8px; background: var(--portal-soft); color: var(--portal-text); font: inherit; font-size: 12px; font-weight: 500; }
body.portal-kms.portal-kms-page .kms-filter-trigger > i { flex-shrink: 0; font-size: 18px; }
body.portal-kms.portal-kms-page .kms-catalogue-actions .kms-filter-trigger { transition: border-color .18s ease, background-color .18s ease; }
body.portal-kms.portal-kms-page .kms-catalogue-actions .kms-filter-trigger:is(:hover,[aria-expanded="true"]) { border-color: var(--portal-primary); background: var(--portal-surface); }
body.portal-kms.portal-kms-page .kms-catalogue-actions .kms-filter-trigger > i:last-child { transition: transform .18s ease; }
body.portal-kms.portal-kms-page .kms-catalogue-actions .kms-filter-trigger[aria-expanded="true"] > i:last-child { transform: rotate(180deg); }
body.portal-kms.portal-kms-page .kms-catalogue-actions .dropdown-menu { min-width: 190px; padding: 6px; border: 1px solid var(--portal-border); border-radius: 12px; background: var(--portal-surface); box-shadow: 0 12px 32px rgb(15 68 148 / 14%); }
body.portal-kms.portal-kms-page .kms-catalogue-actions .dropdown-menu .dropdown-item { display: flex; align-items: center; gap: 10px; min-height: 44px; padding: 8px 10px; border-radius: 8px !important; color: var(--portal-text); background: transparent; font-size: 12px; font-weight: 500; }
body.portal-kms.portal-kms-page .kms-catalogue-actions .kms-option-icon { display: grid; place-items: center; flex-shrink: 0; width: 30px; height: 30px; border-radius: 8px; background: var(--portal-soft); color: var(--portal-muted); font-size: 18px; }
body.portal-kms.portal-kms-page .kms-catalogue-actions .kms-option-label { flex: 1; }
body.portal-kms.portal-kms-page .kms-catalogue-actions .kms-option-check { flex-shrink: 0; visibility: hidden; font-size: 17px; }
body.portal-kms.portal-kms-page .kms-catalogue-actions .dropdown-menu .dropdown-item:is(:hover,:focus,.active) { color: var(--portal-primary); background: var(--portal-soft); }
body.portal-kms.portal-kms-page .kms-catalogue-actions .dropdown-item:is(:hover,:focus,.active) .kms-option-icon { color: var(--portal-primary); background: var(--portal-surface); }
body.portal-kms.portal-kms-page .kms-catalogue-actions .dropdown-item.active .kms-option-check { visibility: visible; }
body.portal-kms.portal-kms-page .kms-catalogue-actions :is(.kms-filter-trigger,.dropdown-item):focus-visible { outline: 2px solid var(--portal-primary); outline-offset: 2px; }
body.portal-kms.portal-kms-page #kms-category-label { max-width: 220px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
body.portal-kms.portal-kms-page .kms-filter-count { min-width: 24px; padding: 2px 6px; border-radius: 30px; background: var(--portal-border); font-size: 10px; }
body.portal-kms.portal-kms-page .kms-filter-panel { position: absolute; top: calc(100% + 8px); left: 0; z-index: 30; width: min(320px, calc(100vw - 64px)); overflow: hidden; border: 1px solid var(--portal-border); border-radius: 12px; background: var(--portal-surface); box-shadow: 0 12px 40px rgb(15 68 148 / 15%); }
body.portal-kms.portal-kms-page .kms-filter-search { display: flex; align-items: center; gap: 8px; margin: 0; padding: 12px; border-bottom: 1px solid var(--portal-border); color: var(--portal-muted); }
body.portal-kms.portal-kms-page .kms-filter-search input { flex: 1; min-width: 0; width: 100%; padding: 0; border: 0; background: transparent; color: var(--portal-text); font: inherit; font-size: 12px; }
body.portal-kms.portal-kms-page .kms-filter-hint { display: block; margin: 0; padding: 10px 14px; color: var(--portal-muted); font-size: 11px; line-height: 1.6; }
body.portal-kms.portal-kms-page .kms-filter-options { max-height: 320px; padding: 6px; overflow-y: auto; }
body.portal-kms.portal-kms-page .kms-filter-option { display: flex; align-items: center; gap: 9px; width: 100%; margin: 0; padding: 10px 12px; border: 0; border-radius: 7px; background: transparent; color: var(--portal-text); font: inherit; font-size: 12px; text-align: left; cursor: pointer; }
body.portal-kms.portal-kms-page .kms-filter-option > i { flex-shrink: 0; color: var(--portal-muted); font-size: 18px; }
body.portal-kms.portal-kms-page .kms-filter-option > span { flex: 1; min-width: 0; }
body.portal-kms.portal-kms-page .kms-filter-option input { flex-shrink: 0; width: 16px; height: 16px; margin: 0; accent-color: #084fb9; cursor: pointer; }
body.portal-kms.portal-kms-page .kms-filter-option:hover { background: var(--portal-soft); }
body.portal-kms.portal-kms-page .kms-filter-option:is(.is-selected,[aria-pressed="true"]) { background: var(--portal-soft); color: var(--portal-primary); box-shadow: inset 3px 0 var(--portal-primary); }
body.portal-kms.portal-kms-page .kms-filter-child { padding-left: 28px; }
/* Keep contributor search, selections and results inside one dropdown surface. */
body.portal-kms.portal-kms-page #kms-author-trigger { transition: border-color .18s ease, background-color .18s ease; }
body.portal-kms.portal-kms-page #kms-author-trigger:is(:hover,[aria-expanded="true"]) { border-color: var(--portal-primary); background: var(--portal-surface); }
body.portal-kms.portal-kms-page #kms-author-trigger > i:last-child { transition: transform .18s ease; }
body.portal-kms.portal-kms-page #kms-author-trigger[aria-expanded="true"] > i:last-child { transform: rotate(180deg); }
body.portal-kms.portal-kms-page .kms-author-panel { width: min(360px, calc(100vw - 64px)); padding: 16px; overflow: hidden; }
body.portal-kms.portal-kms-page .kms-author-title { display: block; margin: 0 0 4px; color: var(--portal-text); font-size: 13px; font-weight: 600; line-height: 1.5; }
body.portal-kms.portal-kms-page .kms-author-help { margin: 0 0 12px; color: var(--portal-muted); font-size: 11px; line-height: 1.6; }
body.portal-kms.portal-kms-page .kms-author-field { position: relative; }
body.portal-kms.portal-kms-page .kms-author-field > i { position: absolute; top: 13px; left: 12px; z-index: 1; color: var(--portal-muted); font-size: 18px; pointer-events: none; }
body.portal-kms.portal-kms-page .kms-author-panel .select2-container { width: 100% !important; }
body.portal-kms.portal-kms-page .kms-author-panel .select2-selection--multiple { height: auto; min-height: 44px; padding: 5px 10px 5px 38px; border: 1px solid var(--portal-border) !important; border-radius: 8px; background: var(--portal-soft) !important; }
body.portal-kms.portal-kms-page .kms-author-panel .select2-container--focus .select2-selection--multiple { border-color: var(--portal-primary) !important; background: var(--portal-surface) !important; box-shadow: 0 0 0 3px rgb(8 79 185 / 10%); }
body.portal-kms.portal-kms-page .kms-author-panel .select2-selection__rendered { display: flex; flex-wrap: wrap; align-items: center; gap: 5px; width: 100%; margin: 0; padding: 0; white-space: normal; }
body.portal-kms.portal-kms-page .kms-author-panel .select2-search--inline { float: none; flex: 1 1 100%; min-width: 0; margin: 0; }
body.portal-kms.portal-kms-page .kms-author-panel .select2-search__field { width: 100% !important; min-width: 0; height: 32px; min-height: 0; margin: 0; padding: 0; border: 0; border-radius: 0; outline: none; background: transparent; box-shadow: none; color: var(--portal-text); font: inherit; font-size: 12px; line-height: 32px; }
body.portal-kms.portal-kms-page .kms-author-panel .select2-search__field:focus-visible { outline: none; }
body.portal-kms.portal-kms-page .kms-author-panel .select2-search__field::placeholder { color: var(--portal-muted); opacity: 1; }
body.portal-kms.portal-kms-page .kms-author-panel .select2-selection__choice { display: flex; align-items: center; gap: 6px; float: none; max-width: 100%; margin: 0; padding: 4px 8px; border: 1px solid var(--portal-border); border-radius: 6px; background: var(--portal-surface); color: var(--portal-primary); font-size: 11px; line-height: 1.5; overflow-wrap: anywhere; }
body.portal-kms.portal-kms-page .kms-author-panel .select2-selection__choice__remove { flex-shrink: 0; margin: 0; padding: 0 3px; color: var(--portal-muted); font-size: 16px; line-height: 1; }
body.portal-kms.portal-kms-page .kms-author-panel .select2-selection__choice__remove:hover { color: var(--portal-primary); }
body.portal-kms.portal-kms-page .kms-author-panel > .select2-container--open { position: static !important; display: block; }
body.portal-kms.portal-kms-page .kms-author-panel .select2-dropdown { position: static; width: 100% !important; padding-top: 10px; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
body.portal-kms.portal-kms-page .kms-author-panel .select2-results__options { max-height: 240px; margin: 0; padding: 0; overscroll-behavior: contain; }
body.portal-kms.portal-kms-page .kms-author-panel .select2-results__option { margin: 2px 0; padding: 10px 12px; border-radius: 8px; color: var(--portal-text); font-size: 12px; line-height: 1.6; overflow-wrap: anywhere; }
body.portal-kms.portal-kms-page .kms-author-panel .select2-results__option:is(.select2-results__option--highlighted,[aria-selected="true"]) { background: var(--portal-soft); color: var(--portal-primary); }
body.portal-kms.portal-kms-page .kms-author-panel .select2-results__option[aria-selected="true"] { box-shadow: inset 3px 0 var(--portal-primary); }
body.portal-kms.portal-kms-page .kms-author-panel .select2-results__option:is(.select2-results__message,.loading-results) { margin: 0; padding: 12px 8px 2px; background: transparent; color: var(--portal-muted); font-size: 11px; text-align: center; }
body.portal-kms.portal-kms-page .kms-filter-reset { padding: 10px 12px; border: 0; border-radius: 8px; background: var(--portal-soft); color: var(--portal-primary); font: inherit; font-size: 12px; }
body.portal-kms.portal-kms-page .kms-catalogue-views { display: flex; gap: 4px; padding: 4px; border-radius: 8px; background: var(--portal-soft); }
body.portal-kms.portal-kms-page .kms-catalogue-views :is(.btn-grid,.btn-list) { color: var(--portal-muted); }
body.portal-kms.portal-kms-page .kms-catalogue-views :is(.btn-grid,.btn-list)[aria-pressed="true"] { background: #084fb9; color: #fff; }
body.portal-kms.portal-kms-page .kms-catalogue-results { margin: 20px 0 0; color: var(--portal-muted); font-size: 12px; }
body.portal-kms.portal-kms-page .kms-catalogue-filters :is(button,input):focus-visible { outline: 2px solid var(--portal-primary); outline-offset: 3px; }
@media (max-width: 767.98px) {
  body.portal-kms.portal-kms-page .kms-catalogue-toolbar { padding: 12px; gap: 14px; }
  body.portal-kms.portal-kms-page :is(.kms-catalogue-filter-group,.kms-catalogue-actions) { width: 100%; gap: 8px; }
  body.portal-kms.portal-kms-page .kms-catalogue-search { flex-wrap: wrap; gap: 8px; padding: 12px; }
  body.portal-kms.portal-kms-page .kms-search-submit { width: 100%; }
  body.portal-kms.portal-kms-page #kms-category-label { max-width: 160px; }
}

/* Material preview: clear title hierarchy and a dedicated contents panel. */
body.portal-kms.portal-kms-page .kms-preview .preview-hero { position: relative; isolation: isolate; background: radial-gradient(ellipse at 95% 10%, rgb(61 144 170 / 28%), transparent 60%), linear-gradient(120deg, #103c80, #173e6c); }
body.portal-kms.portal-kms-page .kms-preview .preview-hero::before { content: ''; position: absolute; z-index: -1; inset: 0; border-radius: inherit; background: radial-gradient(circle at calc(100% - 100px) 30px, transparent 179px, rgb(255 255 255 / 10%) 180px, transparent 181px), radial-gradient(circle at calc(100% - 100px) 30px, transparent 180px, rgb(255 255 255 / 3%) 181px, rgb(255 255 255 / 3%) 240px, transparent 241px); pointer-events: none; }
body.portal-kms.portal-kms-page .kms-preview .preview-hero > .product-info { padding: 32px; }
body.portal-kms.portal-kms-page .kms-preview .preview-kicker { display: inline-flex; align-items: center; gap: 8px; max-width: 100%; margin-bottom: 14px; padding: 5px 10px; border: 1px solid rgb(255 255 255 / 20%); border-radius: 8px; color: #dceaff; background: rgb(255 255 255 / 8%); font-size: 11px; line-height: 1.6; }
body.portal-kms.portal-kms-page .kms-preview .preview-title { max-width: 960px; margin-bottom: 24px !important; font-size: clamp(23px, 2vw, 34px) !important; font-weight: 600; line-height: 1.35; }
body.portal-kms.portal-kms-page .kms-preview .preview-meta { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 20px; padding-top: 20px; border-top: 1px solid rgb(255 255 255 / 16%); }
body.portal-kms.portal-kms-page .kms-preview .preview-author { min-width: 0; min-height: 0; }
body.portal-kms.portal-kms-page .kms-preview .preview-author .prof-fill { padding: 0; border: 0; border-radius: 0; background: transparent; }
body.portal-kms.portal-kms-page .kms-preview .preview-author .image-profil { width: 42px; height: 42px; flex-shrink: 0; border-color: rgb(255 255 255 / 35%); }
body.portal-kms.portal-kms-page .kms-preview .preview-author-copy { min-width: 0; }
body.portal-kms.portal-kms-page .kms-preview .preview-author-copy > span { display: block; margin-bottom: 2px; color: #c3d5eb; font-size: 10px; }
body.portal-kms.portal-kms-page .kms-preview .preview-author-copy p { color: #fff; font-size: 12px; font-weight: 500; overflow-wrap: anywhere; }
body.portal-kms.portal-kms-page .kms-preview .preview-stats { display: flex; flex-direction: row; align-items: center; flex-wrap: wrap; gap: 16px; margin: 0; }
body.portal-kms.portal-kms-page .kms-preview .preview-stats :is(.box-category-product,.box-rate-product) { float: none; margin: 0; padding: 0; }
body.portal-kms.portal-kms-page .kms-preview .preview-stats .tag-category { padding: 6px 10px; border-radius: 8px; font-size: 11px; font-weight: 500; }
body.portal-kms.portal-kms-page .kms-preview .preview-stats .box-rate-product { gap: 8px; }
body.portal-kms.portal-kms-page .kms-preview .preview-rating-value { color: #fff; font-size: 12px; font-weight: 600; white-space: nowrap; }
body.portal-kms.portal-kms-page .kms-preview .preview-rating-value > span { color: #c3d5eb; font-size: 10px; font-weight: 400; }
body.portal-kms.portal-kms-page .kms-preview .preview-viewers { display: inline-flex; align-items: center; gap: 6px; color: #dceaff; font-size: 11px; }
body.portal-kms.portal-kms-page .kms-preview .preview-content-card { padding: 20px !important; border-radius: 20px; }
body.portal-kms.portal-kms-page .kms-preview .preview-content-card > .row { align-items: stretch !important; }
body.portal-kms.portal-kms-page .kms-preview .preview-media-column { min-width: 0; }
body.portal-kms.portal-kms-page .kms-preview .preview-media-column .product-item-3 { border: 0; box-shadow: none; }
body.portal-kms.portal-kms-page .kms-preview .preview-media img { height: auto; min-height: 0; max-height: none; aspect-ratio: 16 / 9; object-fit: cover; }
body.portal-kms.portal-kms-page .kms-preview .preview-sections { display: flex; flex-direction: column; min-width: 0; margin: 0 !important; padding: 8px 8px 8px 24px !important; }
body.portal-kms.portal-kms-page .kms-preview .preview-sections-title { gap: 12px; margin-bottom: 8px; }
body.portal-kms.portal-kms-page .kms-preview .preview-sections-title h2 { margin: 0; color: var(--portal-text); font-size: 17px; font-weight: 600; line-height: 1.5; }
body.portal-kms.portal-kms-page .kms-preview .preview-sections-title > span { padding: 3px 8px; border-radius: 6px; background: var(--portal-soft); color: var(--portal-muted); font-size: 10px; white-space: nowrap; }
body.portal-kms.portal-kms-page .kms-preview .preview-sections-summary { margin: 0 0 18px; color: var(--portal-muted); font-size: 11px; line-height: 1.7; }
body.portal-kms.portal-kms-page .kms-preview .preview-section-list { display: grid; align-content: start; gap: 8px; max-height: 290px; margin: 0; padding: 0; overflow-y: auto; list-style: none; }
body.portal-kms.portal-kms-page .kms-preview .preview-section-list li { display: flex; align-items: center; gap: 10px; padding: 12px; border: 1px solid var(--portal-border); border-radius: 10px; background: var(--portal-soft); }
body.portal-kms.portal-kms-page .kms-preview .preview-section-number { display: inline-flex; flex: 0 0 28px; align-items: center; justify-content: center; height: 28px; border: 1px solid var(--portal-border); border-radius: 8px; background: var(--portal-surface); color: var(--portal-primary); font-size: 11px; font-weight: 600; }
body.portal-kms.portal-kms-page .kms-preview .preview-section-name { flex: 1; min-width: 0; color: var(--portal-text); font-size: 12px; line-height: 1.6; overflow-wrap: anywhere; }
body.portal-kms.portal-kms-page .kms-preview .preview-section-list li > i { flex-shrink: 0; color: var(--portal-primary); font-size: 19px; }
body.portal-kms.portal-kms-page .kms-preview .preview-access { margin-top: auto !important; padding-top: 18px; border-top: 0; }
body.portal-kms.portal-kms-page .kms-preview .preview-access .btn { display: flex; align-items: center; justify-content: center; gap: 8px; min-height: 48px; padding: 12px 16px; border: 1px solid #084fb9; font-size: 13px; font-weight: 500; line-height: 1.6; box-shadow: 0 4px 12px rgb(8 79 185 / 14%); }
body.portal-kms.portal-kms-page .kms-preview .preview-access .btn:hover { background: #0f4494; border-color: #0f4494; }
body.portal-kms.portal-kms-page .kms-preview .preview-share .wrapper { flex-wrap: wrap; justify-content: flex-start; padding: 0; margin-bottom: 0; }
body.portal-kms.portal-kms-page .kms-preview .preview-share .wrapper .icon { width: 40px; height: 40px; margin: 0 8px 8px 0; padding: 8px; font-size: 20px; box-shadow: none; border: 1px solid var(--portal-border); }
@media (max-width: 991.98px) {
  body.portal-kms.portal-kms-page .kms-preview .preview-sections { padding: 20px 8px 8px !important; }
  body.portal-kms.portal-kms-page .kms-preview .preview-access { margin-top: 18px !important; }
}
@media (max-width: 575.98px) {
  body.portal-kms.portal-kms-page .kms-preview .preview-hero > .product-info { padding: 22px 20px; }
  body.portal-kms.portal-kms-page .kms-preview .preview-content-card { padding: 10px !important; }
  body.portal-kms.portal-kms-page .kms-preview .preview-meta { gap: 16px; padding-top: 16px; }
  body.portal-kms.portal-kms-page .kms-preview .preview-stats { width: 100%; gap: 12px; }
}

/* Material detail tabs and supporting files. */
body.portal-kms.portal-kms-page .kms-detail-tabs { gap: 10px; }
body.portal-kms.portal-kms-page .kms-detail-tabs .btn.btn-tab { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 46px; padding: 11px 16px; border-radius: 12px; font-weight: 600; line-height: 1.5; transition: background .2s, border-color .2s, box-shadow .2s; }
body.portal-kms.portal-kms-page .kms-detail-tabs .btn-tab > i { position: static !important; color: inherit; font-size: 20px; }
body.portal-kms.portal-kms-page .kms-detail-tabs .btn-tab:is(.active,:hover) { border-color: #084fb9; background: #084fb9; color: #fff; box-shadow: 0 4px 12px rgb(8 79 185 / 15%); }
body.portal-kms.portal-kms-page .kms-detail-tabs .btn-tab:focus-visible { outline: 2px solid var(--portal-primary); outline-offset: 3px; }
body.portal-kms.portal-kms-page .kms-tab-count { display: inline-flex; align-items: center; justify-content: center; min-width: 23px; min-height: 23px; padding: 2px 6px; border-radius: 7px; background: var(--portal-soft); color: var(--portal-primary); font-size: 10px; line-height: 1; }
body.portal-kms.portal-kms-page .kms-detail-tabs .btn-tab:is(.active,:hover) .kms-tab-count { background: rgb(255 255 255 / 20%); color: #fff; }
body.portal-kms.portal-kms-page .kms-tab-count i { position: static !important; font-size: 14px; }
body.portal-kms.portal-kms-page .kms-attachments { display: grid; gap: 12px; }
body.portal-kms.portal-kms-page .kms-attachment { display: flex; align-items: center; gap: 14px; padding: 16px; border: 1px solid var(--portal-border); border-radius: 12px; background: var(--portal-soft); }
body.portal-kms.portal-kms-page .kms-attachment-icon { display: grid; place-items: center; flex: 0 0 44px; height: 44px; border: 1px solid var(--portal-border); border-radius: 12px; background: var(--portal-surface); color: var(--portal-primary); font-size: 25px; }
body.portal-kms.portal-kms-page .kms-attachment-copy { flex: 1; min-width: 0; }
body.portal-kms.portal-kms-page .kms-attachment-label { display: block; margin-bottom: 4px; color: var(--portal-muted); font-size: 10px; font-weight: 500; }
body.portal-kms.portal-kms-page .kms-attachment-title { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 0; color: var(--portal-text); font-size: 13px; font-weight: 600; line-height: 1.6; overflow-wrap: anywhere; }
body.portal-kms.portal-kms-page a.kms-attachment-title:hover { color: var(--portal-primary); }
body.portal-kms.portal-kms-page a.kms-attachment-title:focus-visible { outline: 2px solid var(--portal-primary); outline-offset: 4px; border-radius: 4px; }
body.portal-kms.portal-kms-page .kms-attachment-title > i { flex-shrink: 0; color: var(--portal-primary); font-size: 20px; }
body.portal-kms.portal-kms-page .kms-attachments-empty { display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: 245px; padding: 30px 20px; border: 1px dashed var(--portal-border); border-radius: 12px; background: radial-gradient(ellipse at 50% 0,rgb(8 79 185 / 5%),transparent 70%),var(--portal-soft); text-align: center; }
body.portal-kms.portal-kms-page .kms-empty-icon { position: relative; display: grid; place-items: center; width: 72px; height: 72px; margin-bottom: 18px; border: 1px solid var(--portal-border); border-radius: 22px; background: var(--portal-surface); color: var(--portal-primary); font-size: 38px; box-shadow: 0 6px 18px rgb(8 79 185 / 6%); }
body.portal-kms.portal-kms-page .kms-empty-icon > span { position: absolute; right: -7px; bottom: -5px; display: grid; place-items: center; width: 28px; height: 28px; border: 3px solid var(--portal-soft); border-radius: 50%; background: #084fb9; color: #fff; font-size: 15px; }
body.portal-kms.portal-kms-page .kms-attachments-empty h3 { margin: 0 0 8px; color: var(--portal-text); font-size: 16px; font-weight: 600; line-height: 1.5; }
body.portal-kms.portal-kms-page .kms-attachments-empty p { max-width: 380px; margin: 0; color: var(--portal-muted); font-size: 12px; line-height: 1.8; }
body.portal-kms.portal-kms-page .kms-empty-note { display: inline-flex; align-items: center; justify-content: center; gap: 6px; margin-top: 16px; color: var(--portal-muted); font-size: 11px; line-height: 1.6; }
body.portal-kms.portal-kms-page .kms-empty-note i { flex-shrink: 0; color: var(--portal-primary); font-size: 16px; }
@media (max-width: 575.98px) {
  body.portal-kms.portal-kms-page .kms-detail-tabs { gap: 6px; }
  body.portal-kms.portal-kms-page .kms-detail-tabs > li { flex: 1 1 auto; }
  body.portal-kms.portal-kms-page .kms-detail-tabs .btn.btn-tab { width: 100%; gap: 6px; padding: 9px 10px; font-size: 11px; }
  body.portal-kms.portal-kms-page .kms-detail-tabs .btn-tab > i { font-size: 18px; }
  body.portal-kms.portal-kms-page .kms-attachments-empty { min-height: 225px; padding: 26px 14px; }
}
@media (prefers-reduced-motion: reduce) {
  body.portal-kms.portal-kms-page .kms-detail-tabs .btn.btn-tab { transition: none; }
}

/* Learning detail: consistent hero, readable chapters and separate progress actions. */
body.portal-kms.portal-kms-page .kms-learning .learning-container > .row { margin-inline: 0; padding: 0 !important; }
body.portal-kms.portal-kms-page .kms-learning .bg-kms-detail { border-radius: 18px; background: radial-gradient(ellipse at 95% 10%, rgb(61 144 170 / 25%), transparent 60%), linear-gradient(120deg, #103c80, #173e6c); }
body.portal-kms.portal-kms-page .kms-learning .bg-kms-detail > .product-info { padding: 28px 32px; }
body.portal-kms.portal-kms-page .kms-learning .learning-kicker { display: inline-flex; align-items: center; gap: 8px; max-width: 100%; margin-bottom: 12px; padding: 5px 10px; border: 1px solid rgb(255 255 255 / 20%); border-radius: 8px; background: rgb(255 255 255 / 8%); color: #dceaff; font-size: 11px; line-height: 1.6; }
body.portal-kms.portal-kms-page .kms-learning .learning-title { max-width: 100%; margin: 0 0 22px !important; font-size: clamp(22px, 2vw, 30px) !important; font-weight: 600; line-height: 1.35; }
.learning-meta { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 20px; padding-top: 18px; border-top: 1px solid rgb(255 255 255 / 16%); }
.learning-author { flex: 1 1 280px; min-width: 0; }
body.portal-kms.portal-kms-page .kms-learning .learning-author .prof-fill { display: flex; align-items: center; gap: 12px; min-width: 0; padding: 0; border: 0; border-radius: 0; background: transparent; }
.learning-author-copy { min-width: 0; overflow-wrap: anywhere; }
.learning-author-copy > span { display: block; margin-bottom: 3px; color: #b4cce9; font-size: 10px; line-height: 1.6; }
body.portal-kms.portal-kms-page .kms-learning .learning-author-copy p { margin: 0; color: #fff; font-size: 12px; line-height: 1.7; }
body.portal-kms.portal-kms-page .kms-learning .learning-author-copy a { color: #fff; }
.learning-stats { display: flex; align-items: center; gap: 22px; }
.learning-type { display: inline-flex; align-items: center; gap: 7px; padding: 7px 11px; border: 1px solid rgb(255 255 255 / 20%); border-radius: 9px; background: rgb(255 255 255 / 9%); color: #fff; font-size: 12px; }
.learning-rating { display: grid; gap: 4px; justify-items: end; }
.learning-rating > span { color: #dceaff; font-size: 11px; }
body.portal-kms.portal-kms-page .kms-learning .learning-workspace { margin: 0; }
body.portal-kms.portal-kms-page .kms-learning .learning-sections { padding: 8px 8px 8px 22px !important; }
.learning-sections-heading { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 10px; margin-bottom: 10px; }
body.portal-kms.portal-kms-page .kms-learning .learning-sections-heading h2 { margin: 0; color: var(--portal-text); font-size: 16px; font-weight: 600; line-height: 1.5; }
.learning-sections-heading > span { padding: 3px 8px; border-radius: 7px; background: var(--portal-soft); color: var(--portal-muted); font-size: 10px; white-space: nowrap; }
.learning-sections-summary { margin: 0 0 16px; color: var(--portal-muted); font-size: 11px; line-height: 1.7; text-align: left; }
.learning-section-list { display: grid; gap: 9px; max-height: 440px; margin: 0; padding: 0; overflow-y: auto; list-style: none; }
.learning-section { display: flex; align-items: center; gap: 8px; padding: 8px; border: 1px solid var(--portal-border); border-radius: 12px; background: var(--portal-soft); }
.learning-section-jump { display: flex; flex: 1; align-items: flex-start; gap: 9px; min-width: 0; padding: 5px 2px; border: 0; border-radius: 7px; background: transparent; color: var(--portal-text); font-family: inherit; text-align: left; cursor: pointer; }
.learning-section-jump:hover { color: var(--portal-primary); }
.learning-section-number { display: grid; flex: 0 0 26px; place-items: center; height: 28px; border: 1px solid var(--portal-border); border-radius: 8px; background: var(--portal-surface); color: var(--portal-primary); font-size: 11px; font-weight: 600; }
.learning-section-copy { min-width: 0; overflow-wrap: anywhere; }
.learning-section-copy strong { display: block; color: inherit; font-size: 12px; font-weight: 500; line-height: 1.6; }
.learning-section-copy small { display: block; margin-top: 5px; color: var(--portal-muted); font-size: 10px; line-height: 1.5; }
body.portal-kms.portal-kms-page .learning-section .button-done { flex-shrink: 0; padding: 7px 9px; border: 0; border-radius: 8px; background: #084fb9; color: #fff; font-family: inherit; font-size: 10px; line-height: 1.5; cursor: pointer; }
body.portal-kms.portal-kms-page .learning-section .button-done:hover { background: #0f4494; }
.learning-section-complete { flex-shrink: 0; color: #227253; font-size: 10px; font-weight: 500; }
.learning-section.is-complete .learning-section-number { border-color: #b9dbc9; background: #e7f6ed; color: #227253; }
html.dark-scheme .learning-section-complete { color: #88d9b4; }
html.dark-scheme .learning-section.is-complete .learning-section-number { border-color: #355c4c; background: #1d3c30; color: #88d9b4; }
.learning-section :is(button):focus-visible { outline: 2px solid var(--portal-primary); outline-offset: 2px; }
.learning-sections-empty { padding: 16px; border: 1px dashed var(--portal-border); border-radius: 12px; color: var(--portal-muted); font-size: 12px; line-height: 1.7; }
body.portal-kms.portal-kms-page .kms-learning .learning-actions { display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 10px; margin: 14px 0 22px; }
body.portal-kms.portal-kms-page .kms-learning .learning-actions .btn { margin: 0 !important; }
@media (max-width: 991.98px) {
  body.portal-kms.portal-kms-page .kms-learning .learning-sections { padding: 20px 8px 8px !important; }
  .learning-section-list { max-height: 360px; }
}
@media (max-width: 575.98px) {
  body.portal-kms.portal-kms-page .kms-learning .bg-kms-detail > .product-info { padding: 22px 20px; }
  body.portal-kms.portal-kms-page .kms-learning .category-grid-3 { padding: 10px !important; }
  .learning-meta { gap: 16px; }
  .learning-stats { width: 100%; justify-content: space-between; }
}