@font-face {
  font-family: "FZ Poppins";
  src: url("../fonts/FZ Poppins-Black.ttf") format("truetype");
  font-weight: 900;
  font-style: normal;
}

@font-face {
  font-family: "FZ Poppins";
  src: url("../fonts/FZ Poppins-BlackItalic.ttf") format("truetype");
  font-weight: 900;
  font-style: italic;
}

@font-face {
  font-family: "FZ Poppins";
  src: url("../fonts/FZ Poppins-Bold.ttf") format("truetype");
  font-weight: 700;
  font-style: normal;
}

@font-face {
  font-family: "FZ Poppins";
  src: url("../fonts/FZ Poppins-BoldItalic.ttf") format("truetype");
  font-weight: 700;
  font-style: italic;
}

@font-face {
  font-family: "FZ Poppins";
  src: url("../fonts/FZ Poppins-ExtraBold.ttf") format("truetype");
  font-weight: 800;
  font-style: normal;
}

@font-face {
  font-family: "FZ Poppins";
  src: url("../fonts/FZ Poppins-ExtraBoldItalic.ttf") format("truetype");
  font-weight: 800;
  font-style: italic;
}

@font-face {
  font-family: "FZ Poppins";
  src: url("../fonts/FZ Poppins-ExtraLight.ttf") format("truetype");
  font-weight: 200;
  font-style: normal;
}

@font-face {
  font-family: "FZ Poppins";
  src: url("../fonts/FZ Poppins-ExtraLightItalic.ttf") format("truetype");
  font-weight: 200;
  font-style: italic;
}

@font-face {
  font-family: "FZ Poppins";
  src: url("../fonts/FZ Poppins-Italic.ttf") format("truetype");
  font-weight: 400;
  font-style: italic;
}

@font-face {
  font-family: "FZ Poppins";
  src: url("../fonts/FZ Poppins-Light.ttf") format("truetype");
  font-weight: 300;
  font-style: normal;
}

@font-face {
  font-family: "FZ Poppins";
  src: url("../fonts/FZ Poppins-LightItalic.ttf") format("truetype");
  font-weight: 300;
  font-style: italic;
}

@font-face {
  font-family: "FZ Poppins";
  src: url("../fonts/FZ Poppins-Medium.ttf") format("truetype");
  font-weight: 500;
  font-style: normal;
}

@font-face {
  font-family: "FZ Poppins";
  src: url("../fonts/FZ Poppins-MediumItalic.ttf") format("truetype");
  font-weight: 500;
  font-style: italic;
}

@font-face {
  font-family: "FZ Poppins";
  src: url("../fonts/FZ Poppins-Regular.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
}

@font-face {
  font-family: "FZ Poppins";
  src: url("../fonts/FZ Poppins-SemiBold.ttf") format("truetype");
  font-weight: 600;
  font-style: normal;
}

@font-face {
  font-family: "FZ Poppins";
  src: url("../fonts/FZ Poppins-SemiBoldItalic.ttf") format("truetype");
  font-weight: 600;
  font-style: italic;
}

@font-face {
  font-family: "FZ Poppins";
  src: url("../fonts/FZ Poppins-Thin.ttf") format("truetype");
  font-weight: 100;
  font-style: normal;
}

@font-face {
  font-family: "FZ Poppins";
  src: url("../fonts/FZ Poppins-ThinItalic.ttf") format("truetype");
  font-weight: 100;
  font-style: italic;
}

@font-face {
  font-family: "Pretendard";
  font-weight: 100;
  font-style: normal;
  font-display: swap;
  src: url("../fonts/Pretendard-Thin.otf") format("opentype");
}

@font-face {
  font-family: "Pretendard";
  font-weight: 200;
  font-style: normal;
  font-display: swap;
  src: url("../fonts/Pretendard-ExtraLight.otf") format("opentype");
}

@font-face {
  font-family: "Pretendard";
  font-weight: 300;
  font-style: normal;
  font-display: swap;
  src: url("../fonts/Pretendard-Light.otf") format("opentype");
}

@font-face {
  font-family: "Pretendard";
  font-weight: 400;
  font-style: normal;
  font-display: swap;
  src: url("../fonts/Pretendard-Regular.otf") format("opentype");
}

@font-face {
  font-family: "Pretendard";
  font-weight: 500;
  font-style: normal;
  font-display: swap;
  src: url("../fonts/Pretendard-Medium.otf") format("opentype");
}

@font-face {
  font-family: "Pretendard";
  font-weight: 600;
  font-style: normal;
  font-display: swap;
  src: url("../fonts/Pretendard-SemiBold.otf") format("opentype");
}

@font-face {
  font-family: "Pretendard";
  font-weight: 700;
  font-style: normal;
  font-display: swap;
  src: url("../fonts/Pretendard-Bold.otf") format("opentype");
}

@font-face {
  font-family: "Pretendard";
  font-weight: 800;
  font-style: normal;
  font-display: swap;
  src: url("../fonts/Pretendard-ExtraBold.otf") format("opentype");
}

@font-face {
  font-family: "Pretendard";
  font-weight: 900;
  font-style: normal;
  font-display: swap;
  src: url("../fonts/Pretendard-Black.otf") format("opentype");
}

html {
  scroll-behavior: smooth;
}

@keyframes bodyLoad {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

body {
  padding: 0;
  margin: 0;
  opacity: 0;
  animation: bodyLoad 1s ease-out forwards;
  font-family: var(--font-family-font-family-pretendard, "Pretendard");
}

.p-component {
  font-family: var(--font-family-font-family-pretendard, "Pretendard");
}

.p-inputtext {
  font-family: var(--font-family-font-family-pretendard, "Pretendard");
}

button {
  font-family: var(--font-family-font-family-pretendard, "Pretendard");
}

h1,
h2,
h3 {
  font-family: var(--font-family-font-family-fz-poppins, "FZ Poppins");
}

* {
  padding: 0;
  margin: 0;
}

.background-transparent {
  background-color: inherit;
}

/* HEADER */
.custom-menubar-placeholder {
  height: 8.56rem;
}

@keyframes keduall-header-animation {
  from {
    opacity: 0;
    transform: translate(0px, -150px);
  }

  to {
    opacity: 1;
    transform: translate(0px, 0px);
  }
}

.keduall-header {
  /*  animation: keduall-header-animation 0.5s;*/
  background-color: var(--primary-primary-1);
  border: 0;
  padding: 0;
  justify-content: start;
  gap: 6rem;
  box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.08);
}

.keduall-register-header.register-header-logo {
  font-family: "Cherry Bomb One", sans-serif;
  color: var(--white-color) !important;
  font-size: var(--font-size-48);
  font-style: normal;
  font-weight: var(--font-weight-400);
  line-height: var(--line-height-57);
}

.keduall-header.custom-menubar .p-menubar-root-list {
  width: 100%;
  justify-content: center;
}

.keduall-header.custom-menubar .top-header.register-header {
  height: 6rem;
}

.keduall-header.custom-menubar .top-header {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  height: 3rem;
  background-color: var(--surfaces-primary-bg);
  font-family: var(--font-family-font-family-pretendard);
}

.keduall-header.custom-menubar .p-menubar-start {
  position: absolute;
  /*  left: 3.5rem;*/
}

.keduall-header.custom-menubar .header-logo {
  font-family: "Cherry Bomb One", sans-serif;
  font-weight: var(--font-weight-400);
  font-size: var(--font-size-48);
  color: var(--text-primary-txt);
  line-height: var(--line-height-57);
  max-width: 240px;
}

.keduall-header.custom-menubar .avatar-placeholder {
  border-radius: 50%;
  overflow: hidden;
  height: 1.5rem;
  width: 1.5rem;
  display: flex;
  justify-content: center;
}

.keduall-header.custom-menubar .avatar-placeholder img {
  width: 100%;
  object-fit: cover;
}

/* COLOR */
/*text-ptimary-txt*/
.text-primary-default {
  color: var(--primary-default) !important;
}

.text-secondary-txt {
  color: var(--text-secondary-txt) !important;
}

.text-danger-txt {
  color: var(--text-danger-txt) !important;
}

.text-default-txt {
  color: var(--surface-black) !important;
}

.text-error-txt {
  color: var(--border-error-br, #f00) !important;
}

.text-white-txt {
  color: var(--white-color) !important;
}

.text-dark-txt {
  color: var(--text-dark-txt) !important;
}

.primary-primary-0 {
  color: var(--orange-orange-50) !important;
}

.primary-primary-1 {
  color: var(--orange-orange-100) !important;
}

.primary-primary-2 {
  color: var(--orange-orange-200) !important;
}

.primary-primary-3 {
  color: var(--orange-orange-300) !important;
}

.text-success-txt {
  color: var(--green-500) !important;
}

.text-third-txt {
  color: var(--blue-blue-900) !important;
}

.text-help-txt {
  color: var(--text-help-txt) !important;
}

.diff-color-50 {
  height: var(--font-size-36);
  align-items: center;
  background-image: linear-gradient(to bottom,
      var(--white-color),
      var(--white-color) 55%,
      var(--primary-default) 50%,
      var(--primary-default));
}

@media screen and (min-width: 62rem) {
  .lg\:diff-color-50 {
    height: var(--font-size-36);
    align-items: center;
    background-image: linear-gradient(to bottom,
        var(--white-color),
        var(--white-color) 55%,
        var(--primary-default) 50%,
        var(--primary-default));
  }
}

.text-default-txt .p-inputtext {
  color: var(--surface-black) !important;
}

.text-third-txt {
  color: var(--text-third-txt) !important;
}

.text-warning-txt {
  color: var(--state-warning-background) !important;
}

/* CUSTOM WORD WRAP*/
.word-wrap-break-word {
  word-wrap: break-word !important;
}

.nowrap {
  white-space: nowrap;
}

/* BACKGROUND COLOR */
.bg-primary-primary-0 {
  background-color: var(--orange-orange-50) !important;
}

.bg-primary-primary-1 {
  background-color: var(--orange-orange-100) !important;
}

.bg-primary-primary-2 {
  background-color: var(--orange-orange-200) !important;
}

.bg-primary-primary-3 {
  background-color: var(--orange-orange-300) !important;
}

.bg-primary-primary-4 {
  background-color: var(--orange-orange-400) !important;
}

.bg-primary-primary-11 {
  background-color: var(--blue-blue-50) !important;
}

.bg-utility-primary-transparent {
  background-color: var(--utility-primary-transparent) !important;
}

.bg-text-white-txt {
  background-color: var(--white-color) !important;
}

.bg-surfaces-gray-bg {
  background-color: var(--gray-gray-500) !important;
}

.border-primary-br {
  border-color: var(--border-primary-br) !important;
}

/* CUSTOM WIDTH*/
.w-webkit-fill-available {
  width: -webkit-fill-available !important;
}

.w-fit {
  width: fit-content !important;
}

.w-half {
  width: 50% !important;
}

@media screen and (min-width: 48rem) {
  .md\:w-half {
    width: 50% !important;
  }
}

.w-40 {
  width: 2.5rem;
}

.aspect-ratio-1-1 {
  aspect-ratio: 1 / 1;
}

.aspect-ratio-16-9 {
  aspect-ratio: 16 / 9;
}

/* CUSTOM HEIGHT */
.h-12 {
  height: 1.2rem !important;
}

.h-125 {
  height: 1.25rem !important;
}

.h-0125 {
  height: 0.125rem !important;
}

.h-half {
  height: 50% !important;
}

.h-fit {
  height: fit-content !important;
}

.h-200 {
  height: 20rem !important;
}

.max-h-410px {
  max-height: 25.63rem !important;
}

/* CUSTOM GAP */
.gap-0125 {
  gap: 0.125rem;
}

.gap-075 {
  gap: 0.75rem;
}

.gap-125 {
  gap: 1.25rem;
}

.gap-0875 {
  gap: 0.875rem;
}

.gap-0625 {
  gap: 0.625rem;
}

.gap-spacing-6 {
  gap: 0.375rem;
}

.gap-spacing-40 {
  gap: 2.5rem;
}

.gap-25 {
    gap: 2.5rem;
}

.gap-45 {
    gap: 4.5rem;
}

/* CUSTOM HEIGHT */
.h-0125 {
  height: 0.125rem;
}

.h-450 {
    height: 45rem !important;
}

/* CUSTOM OBJECT */
.object-cover {
  object-fit: cover !important;
}

.object-contain {
  object-fit: contain !important;
}

/*CUSTOME FONT SIZE*/
.text-125 {
  font-size: 1.25rem !important;
}

/* CUSTOM PADDING */
.p-0625 {
  padding: 0.625rem !important;
}

.p-075 {
  padding: 0.75rem !important;
}

.p-125 {
  padding: 1.25rem !important;
}

.p-35 {
  padding: 3.5rem !important;
}

.pt-075 {
  padding-top: 0.75rem !important;
}

.pb-35 {
  padding-bottom: 3.5rem !important;
}

.pb-45 {
  padding-bottom: 4.5rem !important;
}

.pl-35 {
  padding-left: 3.5rem !important;
}

.py-075 {
  padding-top: 0.75rem !important;
  padding-bottom: 0.75rem !important;
}

.px-075 {
  padding-left: 0.75rem !important;
  padding-right: 0.75rem !important;
}

.py-72 {
  padding-top: 4.5rem !important;
  padding-bottom: 4.5rem !important;
}

.py-0875 {
  padding-top: 0.875rem !important;
  padding-bottom: 0.875rem !important;
}

.pb-125 {
  padding-bottom: 1.25rem !important;
}

.py-125 {
  padding-top: 1.25rem !important;
  padding-bottom: 1.25rem !important;
}

.px-125 {
  padding-left: 1.25rem !important;
  padding-right: 1.25rem !important;
}

.px-35 {
  padding-left: 3.5rem !important;
  padding-right: 3.5rem !important;
}

.px-45 {
  padding-left: 4.5rem !important;
  padding-right: 4.5rem !important;
}

.py-45 {
  padding-top: 4.5rem !important;
  padding-bottom: 4.5rem !important;
}

.pr-110 {
  padding-right: 11rem;
}

/* CUSTOM MARGIN */
.mb-075 {
  margin-bottom: 0.75rem;
}

.ml-075 {
  margin-left: 0.75rem !important;
}

.pl-075 {
  padding-left: 0.75rem !important;
}

.py-35 {
  padding-top: 3.5rem !important;
  padding-bottom: 3.5rem !important;
}

.py-45 {
  padding-top: 4.5rem !important;
  padding-bottom: 4.5rem !important;
}

.mb-125 {
  margin-bottom: 1.25rem !important;
}

.px-0625 {
  padding-left: 0.625rem !important;
  padding-right: 0.625rem !important;
}

.px-725 {
  padding-left: 7.25rem !important;
  padding-right: 7.25rem !important;
}

.px-25 {
  padding-left: 2.5rem !important;
  padding-right: 2.5rem !important;
}

.p-lecture-not-found {
  padding: 3.549rem 2.569rem 1.138rem 2.859rem !important;
}

.py-1625 {
  padding-bottom: 1.625rem !important;
  padding-top: 1.625rem !important;
}

@media screen and (min-width: 48rem) {
  .md\:px-725 {
    padding-left: 7.25rem !important;
    padding-right: 7.25rem !important;
  }

  .md\:pl-35 {
    padding-left: 3.5rem !important;
  }
}

/* CUSTOM FONT */
.font-size-1875 {
  font-size: var(--font-size-30);
}

/* CUSTOM MARGIN */
.m-0625 {
  margin: 0.625rem !important;
}

.ml-075 {
  margin-left: 0.75rem !important;
}

.mx-56 {
  margin-left: 3.5rem !important;
  margin-right: 3.5rem !important;
}

.mr-35 {
  margin-right: 3.5rem !important;
}

/* Z-INDEX */
.z--1 {
  z-index: -1 !important;
}

/* CUSTOM BORDER */
.border-none {
  border: none !important;
}

.base-border-radius {
  border-radius: var(--base-border-radius) !important;
}

.base-border-radius-top-right {
  border-top-right-radius: var(--base-border-radius) !important;
}

.base-border-radius-bottom {
  border-bottom-left-radius: var(--base-border-radius) !important;
  border-bottom-right-radius: var(--base-border-radius) !important;
}

.border-radius-075 {
  border-radius: 0.75rem !important;
}

.border-radius-1563 {
  border-radius: 1.563rem !important;
}

.border-radius-15 {
  border-radius: 1.5rem !important;
}

.border-radius-125 {
  border-radius: 1.25rem !important;
}

.border-radius-05 {
  border-radius: 0.5rem !important;
}

.border-radius-top-125 {
  border-radius: 1.25rem 1.25rem 0 0 !important;
}

.border-radius-bottom-125 {
  border-radius: 0 0 1.25rem 1.25rem !important;
}

.border-accent-focus {
  border: 0.063rem solid var(--accent-focus-border) !important;
}

.border-primary-br {
  border: 0.063rem solid var(--border-primary-br) !important;
}

.border-top-primary-br {
  border-top: 0.063rem solid var(--border-primary-br) !important;
}

.border-secondary-br {
  border: 0.063rem solid var(--indigo-indigo-500) !important;
}
.border-danger {
  border: 0.063rem solid var(--text-danger-txt) !important;
}

/* BOX-SHADOW */
.shadow-m {
  box-shadow: 0rem 0rem 0rem 0.0625rem rgba(152, 161, 178, 0.1),
    0rem 0.9375rem 2.1875rem -0.3125rem rgba(17, 24, 38, 0.15),
    0rem 0.3125rem 0.9375rem 0rem rgba(0, 0, 0, 0.08);
}

.shadow-s-5 {
  box-shadow: 0px 24px 32px 0px var(--Shadow-shadow-6, rgba(0, 0, 0, 0.06)),
    0px 8px 16px 0px var(--Shadow-shadow-8, rgba(0, 0, 0, 0.08));
}

/* CUSTOME RIGHT */
.r-0625 {
  right: 0.625rem !important;
}

/* KEDUALL SCROLLBAR */
.keduall-scrollbar::-webkit-scrollbar {
  width: 0.375rem;
  height: 0.375rem;
}

.keduall-scrollbar::-webkit-scrollbar-track {
  background: var(--surfaces-inactive-bg);
  border-radius: var(--border-radius-12);
}

.keduall-scrollbar::-webkit-scrollbar-thumb {
  background: var(--primary-default);
  border-radius: var(--border-radius-12);
}

/* KEDUAL TOOLTIP */
.keduall-tooltip .p-tooltip-text {
  height: auto;
  max-width: 30rem !important;
  padding: 0.5rem;
  width: max-content !important;
  border-radius: 0.5rem;
  font-family: var(--font-family-font-family-pretendard);
  font-size: var(--font-size-14);
  font-style: normal;
  font-weight: var(--font-weight-500);
  line-height: var(--line-height-20);
}

.keduall-tooltip .p-tooltip-arrow {
  display: none;
}

/* KEDUALL DIVIDER */
.keduall-divider.p-divider {
  margin-right: 1rem;
  margin-top: 3rem;
  margin-left: 1rem;
  margin-bottom: 1.5rem;
  width: auto;
}

/* KEDUALL TOAST */

.keduall-toast {
    width: 90%;
}

.keduall-toast .p-toast-message-content {
  border-radius: var(--border-radius-12);
  display: flex;
  flex-direction: row;
  gap: 1rem;
  justify-content: space-between;
}

.keduall-toast .p-toast-message-error {
  padding: 1.25rem;
  border-radius: var(--border-radius-12);
  border: 0.063rem solid var(--border-error-br);
  background: var(--state-danger-transparent);
}

.keduall-toast .p-toast-message-success {
  padding: 1.25rem;
  border-radius: var(--border-radius-12);
  border: 0.063rem solid var(--state-success-background);
  background: var(--state-success-transparent);
}

.keduall-toast .p-toast-message-warn {
  padding: 1.25rem;
  border-radius: var(--border-radius-12);
  border: 0.063rem solid var(--state-warning-background);
  background: var(--state-warning-transparent);
}

.keduall-toast .p-toast-message-info {
  padding: 1.25rem;
  border-radius: var(--border-radius-12);
  border: 0.063rem solid var(--state-info-background);
  background: var(--state-info-transparent);
}

.keduall-toast .toast-container {
  display: flex;
  flex-direction: row;
  gap: 1rem;
  justify-content: center;
  align-items: start;
}

.keduall-toast .p-toast-message .p-toast-icon-close {
  width: 1.025rem;
  height: 1.025rem;
}

.keduall-toast .p-toast-message .p-toast-icon-close svg {
  color: var(--surface-black);
}

.keduall-toast {
  border: none !important;
  margin-bottom: 0.5rem;
}

/* KEDUALL CUSTOM WHITE SPACE*/

.white-space-break-spaces {
  white-space: break-spaces;
}

/* KEDUALL TYPOGRAPY */
.keduall-typography {
  font-variant-numeric: tabular-nums lining-nums;
}
.keduall-typography.cherry-bomb-one-normal {
  color: var(--text-default-txt);
  font-family: "Cherry Bomb One";
  font-size: var(--font-size-18);
  font-style: normal;
  font-weight: var(--font-weight-400);
  line-height: var(--line-height-24);
  /* 133.333% */
}

.keduall-typography.visibility-hidden {
  display: none;
}

.keduall-typography.visibility-visible {
  display: block;
}

.keduall-typography.text-ellipsis {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  box-sizing: border-box;
}

.keduall-text.text-ellipsis.text-area {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: unset;
}

.keduall-text.two-row-ellipsis {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: normal;
  overflow-wrap: break-word;
  word-break: break-all;
}

.keduall-typography.heading-h0-medium-500 {
  font-family: var(--font-family-font-family-fz-poppins, "Fz Poppins"), "PRETENDARD";
  font-size: var(--font-size-80);
  font-style: normal;
  font-weight: var(--font-weight-500);
  line-height: var(--line-height-96);
}

.keduall-typography.heading-h1-semibold-600 {
  color: var(--text-default-txt);
  font-family: var(--font-family-font-family-fz-poppins, "Fz Poppins"), "PRETENDARD";
  font-size: var(--font-size-48);
  font-style: normal;
  font-weight: var(--font-weight-600);
  line-height: var(--line-height-57);
}

.keduall-typography.heading-h1-bold-700 {
  font-family: var(--font-family-font-family-fz-poppins, "Fz Poppins"), "PRETENDARD";
  font-size: var(--font-size-48);
  font-style: normal;
  font-weight: var(--font-weight-700);
  line-height: var(--line-height-57);
}

.keduall-typography.heading-h1-semibold-600 {
  font-family: var(--font-family-font-family-fz-poppins, "Fz Poppins"), "PRETENDARD";
  font-size: var(--font-size-48);
  font-style: normal;
  font-weight: var(--font-weight-600);
  line-height: var(--line-height-57);
}

.keduall-typography.heading-h2-bold-700 {
  font-family: var(--font-family-font-family-fz-poppins, "Fz Poppins"), "PRETENDARD";
  font-size: var(--font-size-36);
  font-style: normal;
  font-weight: var(--font-weight-700);
  line-height: var(--line-height-40);
}

.keduall-typography.heading-h2-semibold-600 {
  font-family: var(--font-family-font-family-fz-poppins, "Fz Poppins"), "PRETENDARD";
  font-size: var(--font-size-36);
  font-style: normal;
  font-weight: var(--font-weight-600);
  line-height: var(--font-size-40);
}

.keduall-typography.heading-h2-normal-400 {
  font-family: var(--font-family-font-family-fz-poppins, "Fz Poppins"), "PRETENDARD";
  font-size: var(--font-size-36);
  font-style: normal;
  font-weight: var(--font-weight-400);
  line-height: var(--font-size-40);
}

.keduall-typography.heading-h2-medium-500 {
  font-family: var(--font-family-font-family-fz-poppins, "Fz Poppins"), "PRETENDARD";
  font-size: var(--font-size-36);
  font-style: normal;
  font-weight: var(--font-weight-500);
  line-height: var(--line-height-40);
}

.keduall-typography.heading-h3-normal-400 {
  font-family: var(--font-family-font-family-fz-poppins, "Fz Poppins"), "PRETENDARD";
  font-size: var(--font-size-30);
  font-style: normal;
  line-height: var(--font-size-36);
  font-weight: var(--font-weight-400);
}

.keduall-typography.heading-h3-bold-700 {
  font-family: var(--font-family-font-family-fz-poppins, "Fz Poppins"), "PRETENDARD";
  color: var(--text-default-txt);
  font-size: var(--font-size-30);
  font-style: normal;
  line-height: var(--font-size-36);
  font-weight: var(--font-weight-700);
  line-height: var(--line-height-36);
}

.keduall-typography.heading-h3-normal-400 {
  font-size: var(--font-size-30);
  font-style: normal;
  line-height: var(--font-size-36);
  font-weight: var(--font-weight-400);
}

.keduall-typography.heading-h3-medium-500 {
  font-family: var(--font-family-font-family-fz-poppins, "Fz Poppins"), "PRETENDARD";
  font-size: var(--font-size-30);
  font-style: normal;
  line-height: var(--font-size-36);
  font-weight: var(--font-weight-500);
}

.keduall-typography.heading-h2-semibold-600 {
  font-family: var(--font-family-font-family-fz-poppins, "Fz Poppins"), "PRETENDARD";
  font-style: normal;
  font-weight: var(--font-weight-600);
  font-size: var(--font-size-36);
  line-height: var(--line-height-40);
}

.keduall-typography.heading-h3-semibold-600 {
  font-family: var(--font-family-font-family-fz-poppins, "Fz Poppins"), "PRETENDARD";
  font-size: var(--font-size-30);
  font-style: normal;
  line-height: var(--font-size-36);
  font-weight: var(--font-weight-600);
  line-height: var(--line-height-36);
}

.keduall-typography.heading-h4-normal-400 {
  font-family: var(--font-family-font-family-fz-poppins, "Fz Poppins"), "PRETENDARD";
  font-size: var(--font-size-24);
  font-style: normal;
  line-height: var(--font-size-32);
  font-weight: var(--font-weight-400);
}

.keduall-typography.heading-h4-semibold-600 {
  font-family: var(--font-family-font-family-fz-poppins, "Fz Poppins"), "PRETENDARD";
  font-size: var(--font-size-24);
  font-style: normal;
  line-height: var(--font-size-32);
  font-weight: var(--font-weight-600);
}

.keduall-typography.heading-h4-medium-500 {
  font-family: var(--font-family-font-family-fz-poppins, "Fz Poppins"), "PRETENDARD";
  font-size: var(--font-size-24);
  font-style: normal;
  line-height: var(--font-size-32);
  font-weight: var(--font-weight-500);
}

.keduall-typography.heading-h4-bold-700 {
  font-family: var(--font-family-font-family-fz-poppins, "Fz Poppins"), "PRETENDARD";
  font-size: var(--font-size-24);
  font-style: normal;
  line-height: var(--font-size-32);
  font-weight: var(--font-weight-700);
}

.keduall-typography.heading-h4-normal-400 {
  font-size: var(--font-size-24);
  font-style: normal;
  line-height: var(--font-size-32);
  font-weight: var(--font-weight-400);
}

.keduall-typography.heading-h5-normal-400 {
  font-family: var(--font-family-font-family-fz-poppins, "Fz Poppins"), "PRETENDARD";
  font-size: var(--font-size-20);
  font-style: normal;
  line-height: var(--font-size-28);
  letter-spacing: 0;
  font-weight: var(--font-weight-400);
}

.keduall-typography.heading-h6-normal-400 {
  font-family: var(--font-family-font-family-fz-poppins, "Fz Poppins"), "PRETENDARD";
  font-size: var(--font-size-18);
  font-style: normal;
  font-weight: var(--font-weight-400);
  line-height: var(--line-height-24);
  letter-spacing: 0;
}

.keduall-typography.heading-h6-medium-500 {
  font-family: var(--font-family-font-family-fz-poppins, "Fz Poppins"), "PRETENDARD";
  font-size: var(--font-size-18);
  font-style: normal;
  font-weight: var(--font-weight-500);
  line-height: var(--line-height-24);
  letter-spacing: 0;
}

.keduall-typography.heading-h6-semibold-600 {
  font-family: var(--font-family-font-family-fz-poppins, "Fz Poppins"), "PRETENDARD";
  font-size: var(--font-size-18);
  font-style: normal;
  font-weight: var(--font-weight-600);
  line-height: var(--line-height-24);
  letter-spacing: 0;
}

.keduall-typography.heading-h6-bold-700 {
  font-family: var(--font-family-font-family-fz-poppins, "Fz Poppins"), "PRETENDARD";
  font-size: var(--font-size-18);
  font-style: normal;
  font-weight: var(--font-weight-700);
  line-height: var(--line-height-24);
  letter-spacing: 0;
}

.keduall-typography.heading-h5-semibold-600 {
  font-family: var(--font-family-font-family-fz-poppins, "Fz Poppins"), "PRETENDARD";
  font-size: var(--font-size-20);
  font-style: normal;
  line-height: var(--font-size-28);
  letter-spacing: 0;
  font-weight: var(--font-weight-600);
}

.keduall-typography.heading-h5-bold-700 {
  font-family: var(--font-family-font-family-fz-poppins, "Fz Poppins"), "PRETENDARD";
  font-size: var(--font-size-20);
  font-style: normal;
  font-weight: var(--font-weight-700);
  line-height: var(--font-size-28);
  letter-spacing: 0;
}

.keduall-typography.heading-h6-semibold-600 {
  font-family: var(--font-family-font-family-fz-poppins, "Fz Poppins"), "PRETENDARD";
  font-size: var(--font-size-18);
  font-style: normal;
  font-weight: var(--font-weight-600);
  line-height: var(--line-height-24);
  letter-spacing: 0;
}

.keduall-typography.text-24-normal-400 {
  font-family: var(--font-family-font-family-pretendard);
  font-size: var(--font-size-24);
  font-style: normal;
  line-height: var(--font-size-24);
  letter-spacing: 0;
  font-weight: var(--font-weight-400);
}

.keduall-typography.text-16-normal-400 {
  font-family: var(--font-family-font-family-pretendard, "Fz Poppins"), "PRETENDARD";
  font-size: var(--font-size-16);
  font-style: normal;
  line-height: var(--font-size-24);
  letter-spacing: 0;
  font-weight: var(--font-weight-400);
}

.keduall-typography.text-16-normal-400 .p-inputtext {
  font-family: var(--font-family-font-family-pretendard);
  font-size: var(--font-size-16);
  font-style: normal;
  line-height: var(--font-size-24);
  letter-spacing: 0;
  font-weight: var(--font-weight-400);
}

.keduall-typography.text-16-medium-500 {
  font-family: var(--font-family-font-family-pretendard);
  font-size: var(--font-size-16);
  font-style: normal;
  line-height: var(--font-size-24);
  letter-spacing: 0;
  font-weight: var(--font-weight-400);
}

.keduall-typography.text-16-semibold-600 {
  font-family: var(--font-family-font-family-pretendard);
  font-size: var(--font-size-16);
  font-style: normal;
  line-height: var(--font-size-24);
  letter-spacing: 0;
  font-weight: var(--font-weight-600);
}

.keduall-typography.text-16-medium-500 {
  font-family: var(--font-family-font-family-pretendard);
  font-size: var(--font-size-16);
  font-style: normal;
  line-height: var(--font-size-24);
  letter-spacing: 0;
  font-weight: var(--font-weight-500);
}

.keduall-typography.text-16-semibold-600-link {
  font-family: var(--font-family-font-family-pretendard);
  font-size: var(--font-size-16);
  font-style: normal;
  line-height: var(--font-size-24);
  font-weight: var(--font-weight-600);
  letter-spacing: 0;
}

.keduall-typography.text-16-bold-700 {
  font-family: var(--font-family-font-family-pretendard);
  font-size: var(--font-size-16);
  font-style: normal;
  font-weight: var(--font-weight-700);
  line-height: var(--font-size-24);
  letter-spacing: 0;
}

.keduall-typography.text-14-bold-700 {
  font-family: var(--font-family-font-family-pretendard);
  font-size: var(--font-size-14);
  font-style: normal;
  font-weight: var(--font-weight-700);
  line-height: var(--line-height-20);
}

.keduall-typography.text-14-semibold-600,
.keduall-typography.text-14-semibold-600 .p-button .p-button-label {
  font-family: var(--font-family-font-family-pretendard);
  font-size: var(--font-size-14);
  font-style: normal;
  font-weight: var(--font-weight-600);
  line-height: var(--font-size-20);
}

.keduall-typography.text-14-medium-500 {
  font-family: var(--font-family-font-family-pretendard);
  font-size: var(--font-size-14);
  font-style: normal;
  font-weight: var(--font-weight-500);
  line-height: var(--line-height-20);
}

.keduall-typography.text-14-normal-400 {
  font-family: var(--font-family-font-family-pretendard);
  font-size: var(--font-size-14);
  font-style: normal;
  font-weight: var(--font-weight-400);
  line-height: var(--line-height-20);
}

.keduall-typography.text-12-normal-400 {
  font-family: var(--font-family-font-family-pretendard);
  font-size: var(--font-size-12);
  font-style: normal;
  font-weight: var(--font-weight-400);
  line-height: var(--line-height-16);
}

.keduall-typography.text-12-medium-500 {
  font-family: var(--font-family-font-family-pretendard);
  font-size: var(--font-size-12);
  font-style: normal;
  font-weight: var(--font-weight-500);
  line-height: var(--line-height-16);
}

.background-transparent {
  background-color: inherit;
}

.background-white-color {
  background-color: var(--white-color);
}

/* KEDUALL FILE ATTACHMENT */
.keduall-attachment .p-fileupload-buttonbar {
    display: none;
}

.keduall-attachment .p-fileupload-content {
    border: 0.0625rem dashed var(--border-primary-br);
}
/* KEDUALL BUTTONS */
.keduall-buttons {
    cursor: pointer;
}

.keduall-buttons.share-2-btn-row {
  width: 50% !important;
}

.keduall-buttons.button-filled-default-large-primary {
  display: flex;
  min-width: 14rem;
  min-height: 3.5rem;
  height: 100%;
  padding: var(--spacing-16) var(--spacing-20);
  justify-content: center;
  align-items: center;
  flex-shrink: 0;
  gap: 0.5rem;
  border-radius: 6.25rem;
  background: var(--primary-default);
  border: none;
}

.keduall-buttons.button-text-large-primary {
  display: flex;
  min-width: 14rem;
  min-height: 3.5rem;
  height: 100%;
  padding: var(--spacing-16) var(--spacing-20);
  justify-content: center;
  align-items: center;
  flex-shrink: 0;
  gap: 0.5rem;
  border-radius: 6.25rem;
  background: var(--white-color);
  border: none;
  color: var(--buttons-primary);
}

.keduall-buttons.button-text-small-primary {
  display: flex;
  min-height: 2.25rem;
  padding: var(--spacing-8) var(--spacing-16);
  justify-content: center;
  align-items: center;
  flex-shrink: 0;
  gap: 0.5rem;
  background: var(--white-color);
  border: none;
  color: var(--buttons-primary);
}

.keduall-buttons.button-text-large-secondary {
  display: flex;
  min-width: 14rem;
  min-height: 3.5rem;
  height: 100%;
  padding: var(--spacing-16) var(--spacing-20);
  justify-content: center;
  align-items: center;
  flex-shrink: 0;
  gap: 0.5rem;
  border-radius: 6.25rem;
  background: var(--white-color);
  border: none;
  color: var(--text-default-txt);
}

.keduall-buttons.button-text-normal-secondary {
  display: flex;
  min-width: 5.5rem;
  min-height: 1.5rem;
  height: 100%;
  padding: var(--spacing-12) var(--spacing-20);
  justify-content: center;
  align-items: center;
  flex-shrink: 0;
  gap: 0.5rem;
  border-radius: 6.25rem;
  background: var(--white-color);
  border: none;
  color: var(--text-default-txt);
}

.keduall-buttons.button-filled-default-normal-secondary {
  display: flex;
  min-width: 5.5rem;
  min-height: 1.5rem;
  width: auto;
  height: auto;
  padding: var(--spacing-12) var(--spacing-20);
  justify-content: center;
  align-items: center;
  flex-shrink: 0;
  gap: 0.5rem;
  border-radius: 6.25rem;
  background: var(--surfaces-inactive-bg);
  border: none;
  color: var(--surface-black);
}

.keduall-buttons.button-filled-default-normal-secondary:hover {
  background: var(--buttons-system-active);
  color: var(--white-color);
}

.keduall-buttons.circle-button-normal {
    padding: var(--spacing-12) var(--spacing-12) !important;
    min-width: 0 !important;
}

.keduall-buttons.button-filled-default-normal-primary {
  display: flex;
  min-width: 5.5rem;
  min-height: 1.5rem;
  width: auto;
  height: auto;
  padding: var(--spacing-12) var(--spacing-20);
  justify-content: center;
  align-items: center;
  flex-shrink: 0;
  gap: 0.5rem;
  border-radius: 6.25rem;
  background: var(--primary-default);
  border: none;
}

.keduall-buttons.button-filled-default-small-primary {
  display: flex;
  min-width: 4.75rem;
  min-height: 1.25rem;
  width: auto;
  height: auto;
  padding: var(--spacing-8) var(--spacing-16);
  justify-content: center;
  align-items: center;
  flex-shrink: 0;
  gap: 0.5rem;
  border-radius: 6.25rem;
  background: var(--primary-default);
  border: none;
}

.keduall-buttons.button-outlined-small-secondary {
  display: flex;
  min-height: 1.25rem;
  height: 1.25rem;
  padding: var(--spacing-16) var(--spacing-20);
  justify-content: center;
  align-items: center;
  gap: 0.5rem;
  border-radius: 6.25rem;
  background: var(--white-color);
  border: 0.063rem solid var(--surface-black);
  color: var(--surface-black);
}

.keduall-buttons:disabled {
    opacity: 0.6 !important;
    cursor: default;
}

.keduall-buttons.button-filled-default-normal-primary:disabled,
.keduall-buttons.button-filled-default-small-primar:disabled,
.keduall-buttons.button-filled-default-large-primary:disabled {
  background: var(--primary-default) !important;
}

.keduall-buttons.button-outlined-default-small-primary,
.keduall-buttons.button-outlined-default-small-primary-button-group .p-button {
  display: flex;
  min-height: 1.25rem;
  width: 100%;
  height: 1.25rem;
  padding: var(--spacing-16) var(--spacing-20);
  justify-content: center;
  align-items: center;
  gap: 0.5rem;
  border-radius: 6.25rem;
  background: var(--white-color);
  border: 0.063rem solid var(--buttons-primary);
  color: var(--surface-black);
}

.keduall-buttons.button-filled-default-normal-primary:hover,
.keduall-tab-panel.tab-panel-container .active-button:hover,
.keduall-buttons.button-filled-default-large-primary:hover {
  background: var(--surfaces-primary-bg-active);
}

.keduall-buttons.button-filled-default-small-secondary {
  display: flex;
  min-width: 5.5rem;
  min-height: 1.5rem;
  width: auto;
  height: auto;
  padding: var(--spacing-12) var(--spacing-20);
  justify-content: center;
  align-items: center;
  gap: 0.5rem;
  flex-shrink: 0;
  border-radius: 6.25rem;
  background: var(--surfaces-inactive-bg);
  border: none;
  color: var(--surface-black);
}

.keduall-buttons.button-filled-default-small-secondary:hover {
  background: var(--buttons-system-active);
  color: var(--white-color);
}

.keduall-buttons.button-outlined-default-large-secondary {
  display: flex;
  min-width: 13.5rem;
  min-height: 3.5rem;
  width: 100%;
  height: 100%;
  padding: var(--spacing-16) var(--spacing-20);
  justify-content: center;
  align-items: center;
  gap: 0.5rem;
  flex-shrink: 0;
  border-radius: 6.25rem;
  background: var(--white-color);
  border: 0.063rem solid var(--surface-black);
  color: var(--surface-black);
}

.keduall-buttons.button-outlined-default-large-secondary:hover {
  background: var(--surfaces-inactive-bg);
}

.keduall-buttons.button-outlined-default-normal-primary {
  display: flex;
  width: auto;
  height: auto;
  padding: var(--spacing-12) var(--spacing-20);
  justify-content: center;
  align-items: center;
  gap: 0.5rem;
  flex-shrink: 0;
  border-radius: 6.25rem;
  background: var(--white-color);
  border: 0.063rem solid var(--buttons-primary);
  color: var(--surfaces-primary-bg);
}

.keduall-buttons.button-outlined-default-normal-primary:hover {
  background: var(--surfaces-hover-bg);
}

.keduall-buttons.button-outlined-default-normal-secondary {
  display: flex;
  width: auto;
  height: auto;
  padding: var(--spacing-12) var(--spacing-20);
  justify-content: center;
  align-items: center;
  gap: 0.5rem;
  flex-shrink: 0;
  border-radius: 6.25rem;
  background: var(--white-color);
  border: 0.063rem solid var(--surface-black);
  color: var(--surface-black);
}

.keduall-buttons.button-outlined-default-normal-secondary:hover {
  background: var(--surfaces-inactive-bg);
}

.keduall-buttons.button-outlined-default-small-secondary {
  display: flex;
  min-width: 5.5rem;
  min-height: 1.5rem;
  width: auto;
  height: auto;
  padding: var(--spacing-12) var(--spacing-20);
  justify-content: center;
  align-items: center;
  gap: 0.5rem;
  flex-shrink: 0;
  border-radius: 6.25rem;
  background: var(--white-color);
  border: 0.063rem solid var(--surface-black);
  color: var(--surface-black);
}

.keduall-buttons.button-outlined-default-normal-secondary:hover {
  background: var(--surfaces-inactive-bg);
}

.keduall-buttons.button-outlined-default-small-secondary {
  display: flex;
  min-width: 5.5rem;
  min-height: 1.5rem;
  width: auto;
  height: auto;
  padding: var(--spacing-8) var(--spacing-12);
  justify-content: center;
  align-items: center;
  gap: 0.5rem;
  flex-shrink: 0;
  border-radius: 6.25rem;
  background: var(--white-color);
  border: 0.063rem solid var(--surface-black);
  color: var(--surface-black);
}

.keduall-buttons.button-outlined-default-normal-secondary:hover {
  background: var(--surfaces-inactive-bg);
}

.keduall-buttons.button-outlined-default-small-secondary:hover {
  background: var(--surfaces-inactive-bg);
}

.keduall-buttons.button-outlined-large-primary {
  display: flex;
  min-width: 13.5rem;
  min-height: 3.5rem;
  width: auto;
  height: auto;
  padding: var(--spacing-16) var(--spacing-20);
  justify-content: center;
  align-items: center;
  gap: 0.5rem;
  flex-shrink: 0;
  border-radius: 6.25rem;
  background: var(--white-color);
  border: 0.0625rem solid var(--buttons-primary);
  color: var(--text-default-txt);
}

.keduall-buttons.button-outlined-large-primary:hover {
  background: var(--buttons-primary-transparent);
}

.keduall-buttons.button-outlined-default-small-primary-button-group .p-button {
  max-height: 1.125rem;
  box-shadow: none !important;
  width: 1.125rem !important;
  border-radius: 0.75rem !important;
}

.keduall-buttons.button-outlined-default-small-primary-button-group .p-button .p-button-label {
  text-wrap-mode: nowrap;
}

.keduall-buttons.flex-width .p-button {
  max-width: fit-content !important;
  width: auto !important;
}

.keduall-buttons.button-outlined-default-small-primary-button-group .p-button.p-highlight {
  background-color: var(--buttons-primary) !important;
  color: var(--white-color) !important;
}

.keduall-buttons.button-text-default-normal-secondary {
  display: flex;
  min-width: 5.5rem;
  min-height: 1.5rem;
  width: auto;
  height: auto;
  padding: var(--spacing-12) var(--spacing-20);
  justify-content: center;
  align-items: center;
  gap: 0.5rem;
  flex-shrink: 0;
  border-radius: 6.25rem;
  background: var(--white-color);
  border: none;
  color: var(--surface-black);
}

.keduall-buttons.button-outlined-default-small-primary-button-group .p-button:hover {
  background-color: var(--surfaces-hover-bg);
}

.keduall-buttons.button-text-default-normal-secondary {
  display: flex;
  min-width: 5.5rem;
  min-height: 1.5rem;
  width: auto;
  height: auto;
  padding: var(--spacing-12) var(--spacing-20);
  justify-content: center;
  align-items: center;
  gap: 0.5rem;
  flex-shrink: 0;
  border-radius: 6.25rem;
  background: var(--white-color);
  border: none;
  color: var(--surface-black);
}

.keduall-buttons.button-text-default-normal-secondary:hover {
  opacity: 0.5;
}

/* KEDUALL PANEL */
.keduall-tab-panel.tab-panel-container {
  border-radius: 3.5rem;
  gap: 0.75rem;
  display: flex;
  width: max-content;
  background: var(--surfaces-inactive-bg);
}

.keduall-tab-panel.tab-panel-container .tab-label-button.active-button {
  background: var(--primary-default);
  border: none;
}

.keduall-tab-panel.tab-panel-container .tab-label-button {
  display: flex;
  max-height: 3.5rem;
  width: 100%;
  height: 100%;
  padding: var(--spacing-12) var(--spacing-32);
  justify-content: center;
  align-items: center;
  gap: 0.5rem;
  border-radius: 6.25rem;
  overflow: unset;

  @media screen and (max-width: 768px) {
    font-size: 1.2rem;
  }
}

.keduall-tab-panel.tab-panel-container .tab-label-button .p-button-label {
  display: flex;
  width: 100%;
  white-space: nowrap;
  overflow: unset;
}

.keduall-tab-panel.tab-panel-container .inactive-button {
  background: var(--surfaces-inactive-bg);
  border: none;
  color: var(--surface-black);
}

.keduall-tab-panel.tab-panel-container .inactive-button:focus,
.keduall-tab-panel.tab-panel-container .active-button:focus {
  box-shadow: none;
}

.keduall-tab {
  padding: 0rem 1.3rem;
  height: 3rem;
  border-radius: 3.5rem;
  border: none;
  background: var(--form-third-border);
  color: var(--surface-black);
  font-weight: var(--font-weight-700);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

.keduall-tab.selected {
  background: var(--primary-default);
  color: var(--white-color);
  font-weight: var(--font-weight-600);
}

/* KEDUALL FROM */
/* KEDUALL FROM - INPUT */

.keduall-form.custom-password-input::-ms-reveal,
.keduall-form.custom-password-input::-ms-clear {
  display: none;
}

.keduall-form.form-input-default-filled-large {
  border-radius: var(--border-radius-12);
  padding: var(--spacing-12);
  align-items: center;
  border: 0.063rem solid var(--border-primary-br);
  background: var(--white-color);
  height: 3rem;
  max-height: 3rem;
}

.keduall-form.form-input-default-filled-large:focus-visible,
.keduall-form.form-input-default-filled-large:hover {
  border: 0.063rem solid var(--surfaces-primary-bg);
}

.keduall-form.form-input-default-filled-large.invalid {
  border: 0.063rem solid var(--text-danger-txt) !important;
}

.keduall-form.form-without-search button.p-multiselect-close.p-link {
  display: none;

}

.keduall-form.form-without-search {
  .p-multiselect-header {
    padding: 0 !important;
  }
}

.keduall-form.input-floating-lable-default .p-inputnumber-input {
  box-shadow: none !important;
  border-radius: var(--border-radius-12);
  border: 0.063rem solid var(--border-primary-br);
  display: flex;
  max-width: 10rem;
  align-items: center;
  color: var(--text-secondary-txt);
}

.keduall-form.input-default-default {
  box-shadow: none !important;
  border-radius: var(--border-radius-12);
  border: 0.063rem solid var(--border-primary-br);
  display: flex;
  align-items: center;
  color: var(--text-secondary-txt);
  padding: var(--spacing-12);
}

.keduall-form.input-default-default.p-inputwrapper-focus,
.keduall-form.input-default-default:focus,
.keduall-form.input-default-default:hover {
  border: 0.063rem solid var(--surfaces-primary-bg);
  box-shadow: none;
}

.keduall-form.input-default-default.p-invalid {
  border: 0.063rem solid var(--text-danger-txt);
}

.keduall-form.input-default-small {
  box-shadow: none !important;
  border-radius: var(--border-radius-12);
  border: 0.063rem solid var(--border-primary-br);
  display: flex;
  align-items: center;
  color: var(--text-secondary-txt);
  padding: var(--spacing-8) var(--spacing-12);
}

.keduall-form.input-default-small:hover {
  border: 0.063rem solid var(--surfaces-primary-bg);
  box-shadow: none;
}

/* KEDUALL ORDER LIST */
.keduall-order-list.order-list-select .p-orderlist-filter-input.p-inputtext {
    box-shadow: none !important;
    border-radius: var(--border-radius-12);
    border: 0.063rem solid var(--border-primary-br);
    display: flex;
    align-items: center;
    color: var(--text-secondary-txt);
    padding: var(--spacing-12);
}

.keduall-order-list.order-list-select .p-orderlist-filter-input.p-inputtext:hover,
.keduall-order-list.order-list-select .p-orderlist-filter-input.p-inputtext:focus {
    border: 0.063rem solid var(--surfaces-primary-bg);
    box-shadow: none;
}

.keduall-order-list.order-list-select .p-orderlist-controls {
    display: none;
}

.keduall-order-list.order-list-select .p-orderlist-filter-icon {
    top: 1rem;
}

.keduall-order-list.order-list-select .p-orderlist-list li {
    padding: 0.5rem 1rem;
}

.keduall-order-list.order-list-select .p-orderlist-list li:hover {
    background-color: var(--surfaces-hover-bg);
}

.keduall-order-list.order-list-select .p-orderlist-item.p-highlight {
    background-color: var(--surfaces-primary-bg);
}

.keduall-order-list.order-list-select .p-orderlist-filter-container {
    padding: 0.25rem;
    background-color: var(--primary-primary-0);
    border-radius: var(--border-radius-12) var(--border-radius-12) 0 0;
}

.keduall-order-list.order-list-select .p-orderlist-list {
    padding: 0.25rem;
    border-radius: 0 0 var(--border-radius-12) var(--border-radius-12);
}


.keduall-order-list.order-list-select .p-orderlist-list::-webkit-scrollbar {
    width: 0.375rem;
}

.keduall-order-list.order-list-select .p-orderlist-list::-webkit-scrollbar-track {
    background: var(--surfaces-inactive-bg);
    border-radius: var(--border-radius-12);
}

.keduall-order-list.order-list-select .p-orderlist-list::-webkit-scrollbar-thumb {
    background: var(--primary-default);
    border-radius: var(--border-radius-12);
}


/* KEDUALL FORM - DROPDOWN*/
.keduall-form .p-placeholder {
  color: var(--text-secondary-txt) !important;
}

.custom-dropdown-container:hover .keduall-form.dropdown-input.p-dropdown {
  border: 0.063rem solid var(--accent-focus-border);
}

.keduall-form.custom-login-wrapper {
  max-width: 33.31rem;
}

.keduall-form.custom-email-verification-wrapper {
  max-width: 60%;
}

.keduall-form.dropdown-input.no-padding.p-dropdown .p-dropdown-label {
  padding: 0.1rem;
}

.keduall-form.dropdown-input.custom-dropdown-label {
  max-height: 50vh;
  overflow-y: scroll;
}

.keduall-form.dropdown-input-custom .dropdown-header-custom {
  position: absolute;
  z-index: -1;
  background-color: var(--primary-primary-0) !important;
  height: 4.625rem;
  padding-right: 12%;
}

.keduall-form.dropdown-input-custom .search-icon {
  top: 1.75rem;
  right: 1.75rem;
}

.keduall-form.dropdown-input-custom div:hover {
  background-color: var(--primary-primary-1);
}

.keduall-form.dropdown-input-custom.p-multiselect {
  border-radius: var(--border-radius-12);
  overflow-y: hidden;
}

.keduall-form.dropdown-input-custom.p-multiselect:hover,
.keduall-form.dropdown-input-custom.p-multiselect:focus {
  border: 0.063rem solid var(--accent-focus-border);
  box-shadow: none;
}

.keduall-form.dropdown-input-custom .dropdown-option {
  overflow-y: scroll;
}

.select-selected {
  display: flex;
  align-items: center;
}

.select-selected.hover {
  border: 0.063rem solid var(--surfaces-primary-bg) !important;
}

.keduall-form.dropdown-input-custom.select-items {
  position: absolute;
  background-color: var(--white-color);
  box-shadow: 0 0.5rem 0.5rem var(--text-secondary-text);
  width: -webkit-fill-available;
  z-index: 99;
  max-height: 18.75rem;
  overflow-y: hidden;
  top: 100%;
}

.keduall-form.dropdown-input-custom.select-items div {
  padding: 1rem;
  cursor: pointer;
}

.select-arrow-active+.select-items {
  display: block;
}

.select-arrow-active {
  border: 0.063rem solid var(--surfaces-primary-bg) !important;
}

.keduall-form.dropdown-input-custom.select-hide {
  display: none;
}

.keduall-form.dropdown-input-panel .p-dropdown-filter-icon {
  top: 30%;
}

.keduall-form.dropdown-input-panel.custom-index{
  z-index: 10003 !important;
}

.keduall-form.dropdown-input-panel .p-inputtext {
    padding: 0.5rem 0.5rem;
}

.keduall-form.dropdown-input-panel .p-multiselect-filter-icon {
  margin-top: -0.5rem;
}

.keduall-form.dropdown-input-panel.p-multiselect-panel .p-multiselect-checkbox {
  align-items: center;
  display: flex;
}

.keduall-form.dropdown-input-panel.p-multiselect-panel .p-multiselect-header {
  padding: 0.5rem 1rem;
}

.keduall-form.dropdown-input-panel.p-multiselect-panel .p-multiselect-header .p-multiselect-close {
  margin-left: 0.5rem !important;
}

.keduall-form.dropdown-input-panel.p-multiselect-panel .p-multiselect-item {
  gap: 0.5rem;
}

.keduall-form.dropdown-input-panel.p-multiselect-panel .p-multiselect-items .p-multiselect-item:first-child,
.keduall-form.dropdown-input-panel.p-multiselect-panel .p-multiselect-items .p-multiselect-item {
  padding: 0.5rem 1rem;
}

.keduall-form.dropdown-input-panel .p-multiselect-filter.p-inputtext.p-component {
  padding-left: 10%;
}

.keduall-form.dropdown-input-panel .p-multiselect-items-wrapper {
  margin-right: 0;
  transition: margin-right 0.2s ease;
}

.keduall-form.dropdown-input-panel .p-multiselect-items-wrapper.has-scroll {
/*  margin-right: 0.75rem;*/
}

/* Auto-detect scroll and apply margin */
.keduall-form.dropdown-input-panel .p-multiselect-items-wrapper:not(.has-scroll) {
  margin-right: 0;
}

/* JavaScript will add .has-scroll class when scroll is detected */

.keduall-form.dropdown-input-panel .p-multiselect-header {
  border-radius: var(--border-radius-12) var(--border-radius-12) 0 0;
  background-color: var(--primary-primary-0);
}

.keduall-form.dropdown-input-panel.p-multiselect-panel .p-multiselect-header .p-multiselect-filter-container .p-multiselect-filter-icon {
  left: 0.5rem;
  right: 0;
}

.keduall-form.dropdown-input-panel .p-multiselect-items-wrapper::-webkit-scrollbar {
  width: 0.375rem;
}

.keduall-form.dropdown-input-panel .p-multiselect-items-wrapper::-webkit-scrollbar-track {
  background: var(--surfaces-inactive-bg);
  border-radius: var(--border-radius-12);
}

.keduall-form.dropdown-input-panel .p-multiselect-items-wrapper::-webkit-scrollbar-thumb {
  background: var(--primary-default);
  border-radius: var(--border-radius-12);
}

.keduall-form.dropdown-input-panel.p-dropdown-panel {
  width: -webkit-fill-available;
  padding: 0;
}


.keduall-form.dropdown-input-panel .p-dropdown-filter.p-inputtext,
.keduall-form.dropdown-input-panel.p-dropdown-panel {
  border-radius: var(--border-radius-12);
}

.keduall-form.dropdown-input-panel.p-dropdown-panel .p-dropdown-checkbox {
  align-items: center;
  display: flex;
}

.keduall-form.dropdown-input-panel.p-dropdown-panel .p-dropdown-header {
  padding: 0.5rem 1rem;
}

.keduall-form.dropdown-input-panel.p-dropdown-panel .p-dropdown-header .p-dropdown-close {
  margin-left: 0.5rem !important;
}

.keduall-form.dropdown-input-panel.p-dropdown-panel .p-dropdown-item {
  gap: 0.5rem;
}

.keduall-form.dropdown-input-panel.p-dropdown-panel .p-dropdown-items .p-dropdown-item:first-child,
.keduall-form.dropdown-input-panel.p-dropdown-panel .p-dropdown-items .p-dropdown-item {
  padding: 0.5rem 1rem;
}

.keduall-form.dropdown-input-panel .p-dropdown-filter.p-inputtext.p-component {
  padding-left: 2rem;
}

.keduall-form.dropdown-input-panel .p-dropdown-items-wrapper {
/*  margin-right: 0.75rem;*/
}

.keduall-form.dropdown-input-panel .p-dropdown-header {
  border-radius: var(--border-radius-12) var(--border-radius-12) 0 0;
  background-color: var(--primary-primary-0);
}

.keduall-form.dropdown-input-panel.p-dropdown-panel .p-dropdown-header .p-dropdown-filter-container .p-dropdown-filter-icon {
  left: 0.5rem;
  right: 0;
}

.keduall-form.dropdown-input-panel .p-dropdown-items-wrapper::-webkit-scrollbar {
  width: 0.375rem;
}

.keduall-form.dropdown-input-panel .p-dropdown-items-wrapper::-webkit-scrollbar-track {
  background: var(--surfaces-inactive-bg);
  border-radius: var(--border-radius-12);
}

.keduall-form.dropdown-input-panel .p-dropdown-items-wrapper::-webkit-scrollbar-thumb {
  background: var(--primary-default);
  border-radius: var(--border-radius-12);
}

.keduall-form.dropdown-input.custom-dropdown .p-dropdown-label.p-inputtext.p-placeholder {
  font-size: var(--font-size-16);
  color: var(--text-secondary-txt);
}

.keduall-form.dropdown-input.custom-dropdown .p-dropdown-trigger {
  width: auto;
  height: auto;
}

.keduall-form.dropdown-input.custom-dropdown .p-icon.p-dropdown-trigger-icon {
  width: 0.75rem;
}

.keduall-form.dropdown-input.self .p-dropdown-items-wrapper {
    overflow-x: auto !important;
}

.keduall-form.dropdown-input.self .p-dropdown-items-wrapper:hover {
    overflow: auto !important;
    border: unset !important;
}

.keduall-form.dropdown-input.self .p-dropdown-items .p-dropdown-item.p-focus,
.keduall-form.dropdown-input.self .p-dropdown-items .p-dropdown-item:hover {
    background-color: var(--surfaces-hover-bg) !important;
}

.keduall-form.dropdown-input .p-dropdown-items-wrapper {
    height: 12.5rem;
    overflow-y: auto;
}

.keduall-form.dropdown-input .p-dropdown-items-wrapper::-webkit-scrollbar {
  width: 0.375rem;
}

.keduall-form.dropdown-input .p-dropdown-items-wrapper::-webkit-scrollbar-track {
  background: var(--surfaces-inactive-bg);
  border-radius: var(--border-radius-12);
}

.keduall-form.dropdown-input .p-dropdown-items-wrapper::-webkit-scrollbar-thumb {
  background: var(--primary-default);
  border-radius: var(--border-radius-12);
}

.keduall-form.dropdown-input .p-dropdown-items-wrapper::-webkit-scrollbar-thumb:hover {
  background: var(--primary-default-active);
}

.keduall-form.dropdown-input.p-dropdown.custom-dropdown-label {
  width: auto;
}

.keduall-form.dropdown-input.p-dropdown {
  border-radius: var(--border-radius-12);
  border: 0.063rem solid var(--border-primary-br);
  display: flex;
  width: 100%;
  align-items: center;
  height: auto;
  padding: var(--spacing-8) var(--spacing-16);
}

.keduall-form.dropdown-input.p-dropdown:hover,
.keduall-form.dropdown-input.p-dropdown:focus,
.keduall-form.dropdown-input.p-dropdown.rating-dropdown:focus {
  border-color: var(--accent-focus-border);
}

.keduall-form.dropdown-input-panel .p-multiselect-filter.p-inputtext,
.keduall-form.dropdown-input-panel.p-multiselect-panel,
.keduall-form.dropdown-input .p-dropdown-panel,
.keduall-form.dropdown-input-panel.p-dropdown-panel,
.keduall-form.dropdown-input .p-dropdown-items-wrapper {
  border-radius: var(--border-radius-12);
  overflow: hidden;
}

.keduall-form.dropdown-input-panel .p-multiselect-filter.p-inputtext:hover,
.keduall-form.dropdown-input-panel .p-multiselect-filter.p-inputtext:focus,
.keduall-form.dropdown-input-panel.p-multiselect-panel:hover,
.keduall-form.dropdown-input-panel.p-dropdown-panel:hover,
.keduall-form.dropdown-input .p-dropdown-panel .p-dropdown-items-wrapper:hover {
/*  border: 0.063rem solid var(--accent-focus-border);*/
/*  box-shadow: none;*/
}

.keduall-form.dropdown-input.icon-angle-down {
  right: 0.5rem;
  top: 1.2rem;
}

.keduall-form.dropdown-input.icon-angle-down-large {
  right: 0.5rem;
  top: 0.6rem;
  font-size: 1.25rem;
}
.keduall-form.dropdown-input.icon-angle-down-small {
  right: 0.5rem;
  top: 0.4rem;
  font-size: 1.25rem;
  font-variant: all-small-caps;
}

.keduall-form.dropdown-input.icon-times-circle {
  right: 1.6rem;
  top: 0.5rem;
}

.keduall-form.dropdown-input.group-two-icon {
  right: 2rem;
  top: 0.5rem;
}

.keduall-form.dropdown-input.icon .p-button-icon {
  color: var(--surface-black);
  border-radius: 50%;
  font-size: 0.7rem;
  padding: 0.25rem;
  width: 1.5rem;
  height: 1.5rem;
  justify-content: center;
  align-items: center;
}

.keduall-form.dropdown-input-panel.p-dropdown-panel .p-dropdown-items-wrapper::-webkit-scrollbar-corner,
.keduall-form.dropdown-input .p-dropdown-panel .p-dropdown-items-wrapper::-webkit-scrollbar-corner {
  border-radius: var(--border-radius-12);
}

.keduall-form.dropdown-input .p-dropdown-items .p-dropdown-item.p-focus,
.keduall-form.dropdown-input .p-dropdown-item .p-highlight,
.keduall-form.dropdown-input .p-dropdown-items .p-dropdown-item:hover {
  background-color: var(--white-color);
}

/* KEDUAL LOADING */
    .keduall-loading-container {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.5);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 9999;
}

.keduall-loading-image-container .p-progress-spinner .p-progress-spinner-circle {
  stroke: var(--surfaces-primary-bg);
  animation: p-progress-spinner-dash 1.5s ease-in-out infinite;
}

/* KEDUALL FORM - MUTIL SELECT*/
.keduall-form.multi-select-input.custom-placeholder .p-placeholder {
  font-family: var(--font-family-font-family-fz-poppins, "Fz Poppins"), "PRETENDARD";
  /*  font-size: var(--font-size-20);*/
  font-style: normal;
  /*  line-height: var(--font-size-28);*/
  letter-spacing: 0;
  font-weight: var(--font-weight-400);
  color: var(--text-secondary-txt);
}

.keduall-form.multi-select-input.custom-multi-select {
  box-shadow: none !important;
  border-radius: var(--border-radius-12);
  border: 0.063rem solid var(--border-primary-br);
  display: flex;
  width: 100%;
  align-items: center;
  height: auto;
}

.keduall-form.multi-select-input.custom-multi-select:hover {
  border-color: var(--accent-focus-border);
}

.keduall-form.multi-select-input.custom-multi-select .p-multiselect-label.p-multiselect-items-label,
.keduall-form.multi-select-input.custom-multi-select .p-multiselect-label.p-placeholder {
  padding: var(--spacing-8) var(--spacing-16);
}

.keduall-form.multi-select-input.custom-multi-select.custom-pr-175 .p-multiselect-label.p-multiselect-items-label {
  padding-right: 3rem;
}

.keduall-form.multi-select-input.p-multiselect.custom-multi-select .p-multiselect-label-container {
  width: 10rem;
}

/* KEDUALL SELECT BUTTON */

.keduall-form.select-button.base .p-button.p-component {
  border-radius: 0.5rem;
  padding: 0.625rem;
  border: 0.063rem solid var(--surface-black);
  color: var(--surface-black);
  background: transparent;
}

.keduall-form.select-button.base .p-button.p-component.p-highlight {
  background-color: var(--buttons-primary);
  box-shadow: none;
  border: 0.063rem solid var(--buttons-primary);
  color: var(--white-color);
}

.keduall-form.select-button.base .p-button.p-component.p-focus {
  box-shadow: none;
}

.keduall-form.select-button.check-box .p-button.p-component {
  border-radius: 0.5rem;
  padding: 0.625rem;
  border: 0.063rem solid var(--border-primary-br);
  color: var(--surface-blackblack);
}

.keduall-form.select-button.check-box .p-button.p-component.p-highlight {
  box-shadow: none;
  background-color: var(--white-color);
}

.keduall-form.select-button.check-box .p-button.p-component.p-focus {
  box-shadow: none;
}

.trainer-registration-wrapper .p-dialog-content {
  overflow-anchor: none;
}

.trainer-registration-wrapper .keduall-multi-select-wrapper .keduall-form.select-button .p-button.p-component {
  scroll-margin: 0;
  scroll-padding: 0;
}

/* KEDUALL ICON */
.keduall-icon.validation-fail-icon {
  border-radius: 50%;
  padding: 0.156rem;
  font-size: 0.4rem;
  background-color: var(--text-danger-text);
  color: var(--white-color);
  width: 0.844rem;
  height: 0.844rem;
}

.keduall-icon.validation-success-icon {
  border-radius: 50%;
  padding: 0.156rem;
  font-size: 0.4rem;
  background-color: var(--spring-green-color-family);
  color: var(--white-color);
  width: 0.844rem;
  height: 0.844rem;
}

.keduall-icon.dropdown-icon-wrapper .clear-icon {
  right: 2rem;
  cursor: pointer;
  border: 0.063rem solid;
  border-radius: 50%;
  padding: 0.156rem;
  font-size: 0.75rem;
}

.keduall-icon.password-icon-wrapper,
.keduall-icon.dropdown-icon-wrapper {
  position: absolute;
  right: 0;
  height: 100%;
  border: none;
  background: none;
  z-index: 1;
}

.keduall-icon .dropdown-icon-wrapper {
  pointer-events: none;
}

.keduall-icon .dropdown-icon-wrapper i {
  font-size: 0.7rem;
  color: var(--forms-border);
  cursor: pointer;
}

.keduall-icon.icon-socical {
  border-radius: 50%;
  background-color: var(--white-color);
  box-shadow: 0 0.813rem 0.5rem 0 var(--opacity-black-12);
  min-width: 1.5rem;
  min-height: 1.5rem;
  height: 100%;
  aspect-ratio: 1 / 1;
  width: fit-content;
}

.keduall-icon.icon-socical .icon-container {
  width: auto;
  height: 100%;
  aspect-ratio: 1 / 1;
}

.keduall-icon.icon-socical .icon-container .icon-img {
  width: 2rem;
}

.keduall-icon.flag-circle-country {
  width: 1rem;
  height: 1rem;
  border-radius: 50%;
  overflow: hidden;
  display: inline-block;
  background-repeat: repeat;
  background-size: cover;
  background-position: center center;
}

.keduall-icon.flag-rectangle-country {
  width: 1rem;
  height: 1rem;
  border-radius: 3px;
  box-shadow: 0px 0px 2px 1px var(--shadow-shadow-12);
  overflow: hidden;
  display: inline-block;
  background-repeat: repeat;
  background-size: cover;
  background-position: center center;
}

.keduall-icon.flag-rectangle-country.small-size {
  width: 39px;
  height: 28px;
}

.keduall-icon.flag-circle-country.medium-size {
  width: 2rem !important;
  height: 2rem !important;
}

.keduall-icon.flag-circle-country.small-size {
  min-width: 1.5rem;
  width: 1.5rem !important;
  height: 1.5rem !important;
}

.keduall-icon.flag-circle-country.medium-size {
  width: 2rem !important;
  height: 2rem !important;
}

.keduall-icon.flag-circle-country .img {
  width: 100%;
/*  height: 100%;*/
  border-radius: 50%;
  object-fit: cover;
  overflow: hidden;
  background-size: cover;
  aspect-ratio: 1/1;
}

.keduall-icon.icon-play {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 3.5rem;
  height: 3.5rem;
  color: var(--primary-default);
  bottom: 2rem;
  right: 1rem;
}

.keduall-icon.icon-outlined-star-fill {
  color: var(--buttons-primary);
}

/* KEDUALL RADIO */
.keduall-radio.checkbox-base {
  appearance: none;
  width: 1rem;
  height: 1rem;
  outline: 0.063rem solid var(--border-primary-br);
  border-radius: 50%;
  margin-right: 0.3125rem;
  cursor: pointer;
  position: relative;
  border: none;
}

.keduall-radio.checkbox-base:hover {
  outline: 0.063rem solid var(--primary-primary-default);
  background-color: var(--primary-primary-0);
  border: none;
}

.keduall-radio.checkbox-base:checked {
  border: 0.3125rem solid var(--white-color);
  background-color: var(--primary-primary-default);
  outline: 0.063rem solid var(--primary-primary-default);
}

.keduall-radio.checkbox-base:active {
  box-shadow: 0 0 0 0.25rem var(--primary-primary-opacity);
  transition-delay: 0.5s;
  animation: hideShadow 1s forwards;
}

.keduall-radio.checkbox-base.radio-white-dot {
  margin: 0;
  outline: unset;
  border: 0.125rem solid var(--border-primary-br);
  background: var(--surfaces-body-bg);
  border-radius: 0.5rem;
}

.keduall-radio.checkbox-base.radio-white-dot:checked {
  border: 0.313rem solid var(--accent-focus-border);
}

@keyframes waves {
  0% {
    transform: scale(1);
    opacity: 1;
  }

  100% {
    transform: scale(2);
    opacity: 0;
  }
}

@keyframes hideShadow {
  to {
    box-shadow: none;
  }
}

.p-radiobutton.p-highlight .p-radiobutton-box {
  border: 0.3125rem solid var(--white-color) !important;
  background-color: var(--primary-primary-default) !important;
  outline: 0.063rem solid var(--primary-primary-default) !important;
}

.p-radiobutton:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
  border-color: var(--primary-default);
}

.p-radiobutton .p-radiobutton-box .p-radiobutton-icon {
  background-color: inherit !important;
  width: 0.63rem;
  height: 0.63rem;
}

.p-radiobutton.p-highlight .p-radiobutton-box {
  box-shadow: 0 0 0 0.25rem var(--primary-primary-opacity);
  transition-delay: 0.1s;
  animation: hideShadow 1s forwards;
  border-radius: 50%;
}

/* KEDUALL CHEKCBOX */
.keduall-checkbox .p-checkbox-box {
  border-radius: 0.375rem;
  border: 0.063rem solid var(--border-primary-br);
  background: var(--white-color);
  width: 1.25rem;
  height: 1.25rem;
  padding: 0.1875rem;
  cursor: pointer;
}

.keduall-checkbox.p-highlight .p-checkbox-box {
  background-color: var(--primary-primary-0) !important;
  border-color: var(--primary-primary-default) !important;
}

.keduall-checkbox.p-highlight .p-checkbox-box svg {
  color: var(--primary-primary-default) !important;
}

.keduall-checkbox:hover .p-checkbox-box {
  border-color: var(--primary-primary-default) !important;
}

.keduall-checkbox.checkbox-base {
  border-radius: 0.375rem;
  border: 0.063rem solid var(--surfaces-primary-bg);
  background: var(--primary-primary-0);
  width: 1.25rem;
  height: 1.25rem;
  cursor: pointer;
  text-align: center;
  line-height: 1.25rem;
  overflow: hidden;
  display: inline-block;
  position: relative;
}

.keduall-checkbox.checkbox-base i {
  display: none;
  font-size: 0.875rem;
  color: var(--surfaces-primary-bg);
}

.keduall-checkbox.checkbox-base.checkbox-small {
  border-radius: 0.25rem;
  border: 0.063rem solid var(--border-primary-br);
  background: var(--surfaces-body-bg);
  width: 1rem;
  height: 1rem;
  line-height: 1rem;
}

input[type="checkbox"]:checked+.checkbox-base.checkbox-small {
  border: 0.063rem solid var(--primary-primary-default);
  background: var(--primary-primary-0);
}

.keduall-checkbox.checkbox-base.checkbox-small i {
  font-size: 0.75rem;
}

input[type="checkbox"]:checked+.checkbox-base i {
  display: inline-block;
}

input[type="checkbox"] {
  display: none;
}

.keduall-checkbox.checkbox-base:active {
  box-shadow: 0 0 0 0.25rem var(--primary-primary-opacity);
  transition-delay: 0.1s;
  animation: hideShadow 1s forwards;
}

@keyframes hideShadow {
  to {
    box-shadow: none;
  }
}

/* KEDUALL CONFIRMDIALOG */
.keduall-confirm-dialog.p-confirm-dialog {
  border-radius: 1.25rem;
}

.keduall-confirm-dialog .p-dialog-header {
  border-bottom: 0 none;
  background: white;
  padding: 1.25rem 1.25rem 1rem;
  border-top-right-radius: 1.25rem;
  border-top-left-radius: 1.25rem;
}

.keduall-confirm-dialog.p-dialog .p-dialog-header .p-dialog-title {
  margin: 0 auto;
  color: var(--text-default-txt);
  font-family: var(--font-family-font-family-pretendard);
  font-size: var(--font-size-24);
  font-style: normal;
  font-weight: var(--font-weight-600);
  line-height: var(--font-size-32);
}

.keduall-confirm-dialog.p-dialog .p-dialog-content {
  background: #ffffff;
  padding: 0 1.25rem 1rem;
  font-family: var(--font-family-font-family-pretendard);
  font-size: var(--font-size-16);
  font-style: normal;
  line-height: var(--font-size-24);
  letter-spacing: 0;
  font-weight: var(--font-weight-400);
  color: var(--text-default-txt);
}

.keduall-confirm-dialog.p-dialog .p-dialog-footer {
  border-top: 0 none;
  background: #ffffff;
  display: flex;
  justify-content: flex-end;
  padding: 0 1.25rem 1rem;
  text-align: right;
  border-bottom-right-radius: 1.25rem;
  border-bottom-left-radius: 1.25rem;
  gap: 0.5rem;
}

/* KEDUALL CARD */
.keduall-card.cards-course-detail-tutor-default {
  border-radius: var(--border-radius-20);
  border: 0.063rem solid var(--border-second-br);
  background: var(--white-color);
  padding: 0;
}

.keduall-card.trainer-card-container {
  min-width: 20rem;
  width: 20rem;
  min-height: 17.25rem;
}

@media (min-width: 1280px) {
  .keduall-card.trainer-card-container {
    min-width: 25rem;
    width: 25rem;
  }
}

.keduall-card.card-tooltip {
  width: 100%;
  height: 100%;
  border-radius: var(--border-radius-20);
  border: 0.063rem solid var(--border-second-br);
}

.keduall-card.card-tooltip-detail {
  width: 100%;
  min-height: 225px;
  border-radius: var(--border-radius-20);
  border: 0.063rem solid var(--border-second-br);
}

.keduall-card.main-avatar-container {
  max-width: 10rem;
  max-height: 10rem;
  border-radius: var(--border-radius-8);
}

.keduall-card.main-avatar {
  border: 0.063rem solid var(--border-second-br);
  border-radius: var(--border-radius-8);
  width: 10rem;
  /* 100% */
  height: 10rem;
}

.keduall-card.keduall-vod-description-wrapper .p-tabview .p-tabview-nav {
  border-bottom: 0.125rem solid var(--border-primary-br);
}

.keduall-card.keduall-vod-description-wrapper .p-tabview .p-tabview-nav li .p-tabview-nav-link {
  padding: var(--spacing-12) var(--spacing-32);
  color: var(--text-secondary-txt);
  font-size: var(--font-font-size-heading-h6);
  line-height: var(--line-height-24);
  border: unset;
}

.keduall-card.keduall-vod-description-wrapper .p-tabview .p-tabview-nav li.p-highlight .p-tabview-nav-link {
  color: var(--text-default-txt);
  font-weight: var(--font-weight-700);
  border-bottom: 0.125rem solid var(--border-black-br);
  margin-bottom: -0.125rem;
}

.keduall-card.main-avatar-circle-25 {
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 50%;
  object-fit: contain;
  flex-shrink: 0;
}

.keduall-card.product-item-container {
  border-radius: var(--border-radius-20);
  border: 0.063rem solid var(--border-primary-br);
  background: var(--surfaces-body-bg);
}

.keduall-card.product-item-container + .keduall-card.product-item-container {
  margin-top: 0.5rem;
}

.keduall-card.payment-information-container {
  border: 0.063rem solid var(--border-primary-br);
  background: var(--surfaces-body-bg);
  box-shadow: 0rem 0.5rem 1rem 0rem var(--shadow-shadow-6);
}

.keduall-card.payment-method-container {
  border: 0.063rem solid var(--forms-fourth-border);
  background: var(--primary-primary-5);
}

.keduall-card.coupon-card-container {
  border: 0.063rem solid var(--border-primary-br);
  background: var(--surfaces-body-bg);
}

.keduall-card.coupon-card-container.coupon-checked {
  border: 0.063rem solid var(--border-accent-hover-border);
  background: var(--primary-primary-0);
}

.keduall-card.warning-message-container {
  border: 0.063rem solid var(--border-error-br);
}

.keduall-card.payment-result-container {
  border-radius: var(--border-radius-24);
  border: 0.063rem solid var(--border-primary-br);
  background: var(--surfaces-body-bg);
  box-shadow: 0rem 0.5rem 1rem 0rem var(--shadow-shadow-6);
}

.keduall-card.cards-hp-intro {
  border-radius: var(--border-radius-32);
  box-shadow: 0.25rem 0.375rem 0.25rem 0 var(--shadow-shadow-25);
}

/* KEDUALL SLIDER*/
.keduall-slider.slider-default {
  width: 100%;
  background-color: var(--border-second-br);
}

.keduall-slider.slider-default .p-slider-handle.p-slider-handle-end,
.keduall-slider.slider-default .p-slider-handle.p-slider-handle-start {
  border-color: var(--buttons-primary);
  width: 1rem;
  height: 1rem;
}

.keduall-slider.slider-default.p-slider.p-slider-horizontal .p-slider-handle {
  margin-top: -0.5715rem;
  margin-left: -0.5715rem;
}

.keduall-slider.slider-default .p-slider-handle.p-slider-handle-start:hover,
.keduall-slider.slider-default .p-slider-handle.p-slider-handle-end:hover,
.keduall-slider.slider-default .p-slider-handle.p-slider-handle-end.p-slider-handle-active,
.keduall-slider.slider-default .p-slider-handle.p-slider-handle-start.p-slider-handle-active,
.keduall-slider.slider-default .p-slider-range {
  background-color: var(--buttons-primary);
  border-color: var(--buttons-primary);
}

/* KEDUALL OVERLAY-PANEL*/
.notification-overlay-panel-hold-position {
  position: fixed !important;
  top: 2rem !important;
}

.notification-overlay-panel {
  z-index: 10001 !important;
}

.notification-overlay-panel .p-tabview .p-tabview-nav,
.notification-container .p-tabview .p-tabview-nav {
  border-bottom: 0.25rem solid var(--border-accent-br);
}

.keduall-overplay-panel {
  border-radius: var(--border-radius-20) !important;
  display: flex;
  width: 35%;
}

/* PC (min-width: 1025px) */
@media (min-width: 1025px) {
  .keduall-overplay-panel {
    width: 35%;
    min-width: 450px;
    max-width: 650px;
  }
}

/* iPad/tablet (min-width: 768px and max-width: 1024px) */
@media (min-width: 768px) and (max-width: 1024px) {
  .keduall-overplay-panel {
    width: 55%;
    min-width: 320px;
    max-width: 90vw;
  }
}

/* Phone (max-width: 767px) */
@media (max-width: 767px) {
  .keduall-overplay-panel {
    width: 90%;
    min-width: unset;
    max-width: 100vw;
    border-radius: 1rem !important;
  }
}

.keduall-overplay-panel .p-overlaypanel-content {
  width: -webkit-fill-available;
}

.keduall-overplay-panel .dropdown-menu-footer {
  align-items: center;
  background-color: var(--surface-0);
  display: flex;
  justify-content: space-between;
  border-bottom-left-radius: var(--border-radius-20);
  border-bottom-right-radius: var(--border-radius-20);
  border-top: 1px solid var(--forms-third-border);
  margin: 0 0.25rem;
}

.keduall-overplay-panel .dropdown-menu-item-wrapper {
  overflow-y: auto;
  height: 18.8rem;
}

.dropdown-menu-item {
  display: flex;
  flex-direction: column;
  cursor: pointer;
}

.dropdown-menu-item:last-child {
  border-bottom: none;
}

.dropdown-menu-item.unread-background:hover {
  background-color: var(--primary-primary-5);
}

.dropdown-menu-item.read-background:hover {
  background-color: var(--primary-primary-5);
}


.dropdown-menu-item-content span {
  font-size: 0.9rem;
  line-height: 1.5;
}

.dropdown-menu-item-content .datetime {
  font-size: 0.8rem;
  color: var(--gray-500);
}

.dropdown-menu-item-content {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

/* KEDUALL TOGGLE */
.keduall-toggle.toggle-base {
  height: 1.2rem;
  width: 2.2rem;
}

.keduall-toggle.toggle-base .p-inputswitch-slider {
  background-color: var(--primary-primary-0);
}

.keduall-toggle.toggle-base.p-highlight .p-inputswitch-slider {
  background-color: var(--primary-primary-default);
}

.p-inputswitch.p-highlight .p-inputswitch-slider:before {
  transform: translateX(0.96rem);
}

.p-inputswitch .p-inputswitch-slider:before {
  width: 1rem;
  height: 1rem;
  left: 0.08rem;
  margin-top: -0.5rem;
  filter: drop-shadow(0px 0.063rem 0.125rem rgba(16, 24, 40, 0.06)) drop-shadow(0px 0.063rem 3px rgba(16, 24, 40, 0.1));
}

/* KEDUALL TABLE */
.keduall-table.table-header-cell {
  border-radius: 0.5rem;
  border: 0.063rem solid var(--border-primary-br);
  box-shadow: 0 0.063rem 0.125rem 0 rgba(16, 24, 40, 0.05);
  position: relative;
  width: 100%;
}

.keduall-table.table-header-cell-container {
  display: flex;
  justify-content: space-between;
  position: relative;
  width: 100%;
  border: 0.063rem solid var(--form-third-border);
  border-radius: 0.5rem;
}

.keduall-table.table-header-cell-container .step-container:first-child .step {
  border-radius: 0.5rem 0 0 0.5rem;
}

.keduall-table.table-header-cell-container .step-container:last-child .step {
  border-radius: 0 0.5rem 0.5rem 0;
  border-right: none;
}

.keduall-table.table-header-cell-container .step {
  border-right: 0.063rem solid var(--form-third-border);
}

.keduall-table.table-header-cell-container .step .step-title {
  color: var(--surface-black);
}

.keduall-table.table-header-cell-container .step.active {
  background: var(--surfaces-primary-bg);
  border: none;
  height: 100%;
}

.keduall-table.table-header-cell-container .step.active .step-title {
  color: var(--white-color);
}

@media screen and (max-width: 48rem) {
  .keduall-table.table-header-cell-container .step-container .step {
    border-radius: 0.5rem !important;
    border: none !important;
  }

  .keduall-table.table-header-cell {
    border-radius: 0 !important;
  }
}

/* KEDUALL PROGRESS */
.keduall-progress.progress-bar {
  height: 0.5rem;
  width: 100%;
}

.keduall-progress.rating-progress-bar {
  max-width: 41.875rem;
  max-height: 0.875rem;
  width: 100%;
  height: 100%;
  border-radius: var(--border-radius-12);
}

.keduall-progress.p-progressbar .p-progressbar-value {
  background-color: var(--primary-default) !important;
}

/* KEDUALL STEP*/
.kedual-step.step-square {
  border-radius: 0.625rem;
  padding: 0.313rem 1.25rem;
  z-index: 2;
}

.kedual-step.step-custom.p-steps .p-steps-item {
  width: 100%;
}

.kedual-step.step-custom.p-steps .p-steps-item:before {
  top: 45%;
  border-top: 0.5rem solid var(--surfaces-sixth-bg);
  left: 50%;
  z-index: 0;
  display: none;
}

.kedual-step.step-custom ol {
  flex-wrap: wrap;
  display: flex;
  align-items: start;
}

@media screen and (min-width: 48rem) {
  .kedual-step.step-custom.p-steps .p-steps-item:before {
    display: block !important;
  }

  .kedual-step.step-custom ol {
    flex-wrap: nowrap;
  }
}

.kedual-step.step-custom.p-steps .p-steps-item:last-child:before {
  border-top: none;
}

.kedual-step.no-opacity ol li {
  opacity: 100 !important;
}

/* KEDUALL FRAME */
.kedual-frame.rectangle-13 {
  width: 100%;
  height: 12.813rem;
  flex-shrink: 0;
  border-radius: 9.375rem 18.75rem 18.75rem 9.375rem;
  background: linear-gradient(270deg,
      rgba(255, 129, 16, 0.35) 0%,
      rgba(236, 72, 153, 0.35) 100%);
}

.kedual-frame.rectangle-14 {
  width: 90%;
  height: 12.313rem;
  flex-shrink: 0;
  border-radius: 9.375rem 18.75rem 18.75rem 9.375rem;
  background: linear-gradient(270deg,
      rgba(255, 129, 16, 0.35) 0%,
      rgba(236, 72, 153, 0.35) 100%);
}

.kedual-frame.rectangle-15 {
  width: 90%;
  height: 11.688rem;
  flex-shrink: 0;
  border-radius: 9.375rem 18.75rem 18.75rem 9.375rem;
  background: linear-gradient(270deg,
      rgba(255, 129, 16, 0.35) 0%,
      rgba(236, 72, 153, 0.35) 100%);
}

/* KEDUAL EDITOR */
.keduall-editor {
  border-radius: 1.25rem;
}

.keduall-editor.p-invalid .ql-toolbar,
.keduall-editor.p-invalid .ql-container {
  border: 0.063rem solid var(--text-danger-txt);
}

.keduall-editor .ql-toolbar {
  border-radius: 1.25rem 1.25rem 0 0;
  border: 0.063rem solid var(--border-primary-br);
}

.keduall-editor .ql-container {
  min-height: 8rem;
  border-radius: 0 0 1.25rem 1.25rem;
  font-family: var(--font-family-font-family-pretendard);
  font-size: var(--font-size-16);
  font-style: normal;
  line-height: var(--font-size-24);
  letter-spacing: 0;
  font-weight: var(--font-weight-500);
  color: var(--text-default-txt);
  border: 0.063rem solid var(--border-primary-br);
}

/* KEDUALL PHOTO */
.keduall-img.img-container {
  width: 9.375rem;
  height: 12.5rem;
  /* border: 0.188rem solid #fff;
  box-shadow: 0.188rem 0.188rem 0.25rem 0 rgba(0, 0, 0, 0.25); */
}

.keduall-img.img-3x4 {
  width: 9.375rem;
  height: 12.5rem;
  max-width: 9.375rem;
  max-height: 12.5rem;
}

.keduall-img.img-3x4-example-correct {
    height: 8rem;
}

.keduall-img.img-3x4-example-wrong {
    height: 5rem;
}

.keduall-img.no-img {
  box-shadow: 0.188rem 0.188rem 0.25rem 0 rgba(0, 0, 0, 0.25) !important;
}

/* KEDUALL DIALOG*/
.keduall-dialog .p-dialog-header,
.keduall-dialog .p-dialog-content,
.keduall-dialog .p-dialog-footer {
  padding: 0;
}
.keduall-dialog.coupon-modal-container {
  width: 26.125rem;
  padding: var(--spacing-20);
  border-radius: var(--border-radius-20);
  background: var(--surfaces-body-bg);
  box-shadow: 0px 0px 0px 1px rgba(152, 161, 178, 0.1),
    0px 15px 35px -5px rgba(17, 24, 38, 0.15),
    0px 5px 15px 0px rgba(0, 0, 0, 0.08);
}

.keduall-dialog.coupon-modal-container .p-dialog-header {
  border: unset;
  text-align: center;
  color: var(--text-default-txt);
  font-size: var(--font-size-24);
  font-weight: var(--font-weight-600);
  line-height: var(--line-height-32);
}

.keduall-dialog.coupon-modal-container .coupon-list-container {
  border-radius: var(--border-radius-20);
  background: var(--surfaces-fifth-bg);
  padding: 0.75rem;
  max-height: 31.25rem;
  overflow-y: auto;
}

.keduall-dialog.keduall-question-container {
  height: fit-content;
  width: 62.5rem;

}

.keduall-dialog.keduall-question-confirm {
  height: fit-content;
  width: 25rem;

}

.keduall-dialog.keduall-dialog-without-header {
  .p-dialog-header {
    border-bottom: none;
    display: none;
  }
}


/*Custom for Free Test Dialog */
.kedual-dialog-free-test .p-dialog-header {
  border-bottom: none !important;
  color: black;
  font-weight: 600;
  text-align: center;
}

.kedual-dialog-free-test .p-dialog-header .p-dialog-title {
  font-size: 1.5rem !important;
  font-family: var(--font-family-font-family-fz-poppins, "FZ Poppins");
}

/*Custom for Advertise Dialog */
.keduall-advertise-modal {
  max-width: 54.09rem;
  border-radius: 1.25rem;
  overflow: hidden;
  min-width: 50%;
  margin: 1rem;
}

.keduall-advertise-modal .ads-close-btn {
  background-color: rgba(229, 229, 229, 0.60);
  width: 2rem;
  height: 2rem;
  position: absolute;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  right: 0.75rem;
  top: 0.75rem;
  cursor: pointer;
}

.keduall-advertise-modal img {
  width: 100%;
}

/* OBSOLETE */
.p-menubar .p-menuitem.p-highlight>.p-menuitem-content {
  color: unset;
  background-color: unset;
}

.p-menubar .p-menubar-root-list>.p-menuitem:not(.p-highlight):not(.p-disabled)>.p-menuitem-content:hover {
  color: unset;
  background-color: unset;
}

.p-menubar .p-menuitem {
  font-family: var(--font-family-font-family-fz-poppins, "FZ Poppins");
  transition: 0.3s;
}

.p-menubar .p-menuitem:hover {
  transform: scale(1.2);
}

.btn-primary-neon {
  transition: 0.3s;
}

.btn-primary-neon:hover {
  box-shadow: 0 0 10px var(--buttons-primary), 0 0 30px var(--buttons-primary),
    0 0 80px var(--buttons-primary);
}

.dropshadow {
  box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.6);
}

.p-menubar .p-menubar-root-list>.p-menuitem:not(.p-highlight):not(.p-disabled)>.p-menuitem-content:hover {
  color: unset;
  background-color: unset;
}

.p-menubar .p-menuitem:not(.p-highlight):not(.p-disabled).p-focus>.p-menuitem-content {
  color: unset;
  background-color: unset;
}

.p-overlaypanel-content {
  padding: 0;
}

.p-overlaypanel {
  border-radius: 0.375rem;
}

.p-dropdown {
  box-shadow: none;
  border-radius: 0.5rem;
  border: 0.063rem solid var(--border-primary-br);
  background: var(--surfaces-body-bg);
  padding: 0.75rem;
  gap: 0.5rem;
}

.p-dropdown-trigger {
  width: 1.25rem;

  svg {
    width: 0.625rem;
    color: var(--text-default-txt);
  }
}

.p-dropdown-panel {
  padding: 0.5rem 0.375rem;
  border-radius: 0.375rem;
  box-shadow: 0px 0px 0px 0.063rem rgba(152, 161, 178, 0.1),
    0px 15px 35px -5px rgba(17, 24, 38, 0.15),
    0px 5px 15px 0px rgba(0, 0, 0, 0.08);
  font-family: var(--font-family-font-family-pretendard);
}

.p-dropdown-items {
  padding: 0;
}

.p-dropdown-item {
  padding: 0.25rem 0.5rem;
  border-radius: 0.25rem;
  transition: 0.2s;
  outline: none;
}

.p-dropdown-item.p-highlight {
  background-color: var(--primary-primary-1);

  .p-dropdown-item-label {
    color: black;
  }
}

.p-dropdown-item.p-focus {
  background-color: var(--surfaces-hover-bg);

  .p-dropdown-item-label {
    color: var(--text-default-txt);
    font-weight: bold;
  }
}

.p-dropdown-item-label {
  width: 100%;
  font-size: 0.875rem;
  font-weight: 400;
  line-height: 1.25rem;
  color: var(--text-default-txt);
  transition: 0.2s;

  a {
    color: inherit;
    text-decoration: none;
    display: block;
  }
}

.keduall-input {
  border-radius: var(--border-radius-12) !important;
  border: 0.063rem solid var(--border-primary-br) !important;
  padding: 0.75rem !important;
  font-size: var(--font-size-14) !important;

  .p-inputnumber-input.p-inputtext.p-component.p-filled {
    border: none !important;
    width: 100%;
    font-size: var(--font-size-14) !important;
  }

  .p-inputtext {
    padding: 0;
  }
}

.keduall-btn {
  border-radius: 1.5rem !important;
  font-size: var(--font-size-14);
}

.keduall-btn.primary-filled-normal-default-customize-size {
  background-color: var(--primary-default) !important;
  color: var(--surface-0) !important;
  font-weight: var(--font-weight-600) !important;
  padding: 0.75rem 1.25rem 0.75rem 1.25rem;
  border: none !important;
}

.keduall-btn.primary-text-normal-default-customize-side {
  background-color: var(--surface-0);
  color: var(--primary-default);
  font-weight: var(--font-weight-600);
  padding: 0.75rem 1.25rem;
  border: none;
}

.keduall-btn.primary-text-normal-default-customize-side:disabled {
  opacity: 0.6 !important;
}

.keduall-btn.primary-filled-small-default-customize-size {
  background-color: var(--primary-default) !important;
  color: var(--surface-0) !important;
  font-weight: var(--font-weight-600) !important;
  padding: 0.5rem 1rem 0.5rem 1rem;
  border: none !important;
  font-size: var(--font-size-12);
}

.keduall-tab-panel {
  .p-tabview .p-tabview-nav li .p-tabview-nav-link {
    border-width: 0.063rem 0.063rem 0.063rem 0.063rem;
    border-style: solid;
    border-color: var(--border-second-br) !important;
    color: var(--surface-black) !important;
    padding: 0.75rem 2rem 0.75rem 2rem !important;
    border-radius: 0.25rem 0.25rem 0 0;
  }

  .p-tabview .p-tabview-nav li.p-highlight .p-tabview-nav-link {
    background: var(--primary-default) !important;
    border-color: var(--primary-default) !important;
    color: var(--white-color) !important;
    border-radius: 0.25rem 0.25rem 0 0;
  }
}

.keduall-tab-panel.tab-panel-container-small {
  .p-tabview .p-tabview-nav li .p-tabview-nav-link {
    padding: 0.5rem 1rem !important;
  }
}

.keduall-typography.default-default-semibold-label {
  font-weight: var(--font-weight-600);
}

.keduall-tag {
  padding: 0.125rem 0.625rem;
  border-radius: 1rem;
}

.keduall-tag.beginner-tag {
  background-color: var(--state-help-transparent);
  color: var(--text-info-txt);
}

.keduall-tag.elementary-tag {
  background-color: var(--state-info-transparent);
  color: var(--text-additional-txt);
}

.keduall-tag.intermediate-tag {
  background-color: var(--state-success-transparent);
  color: var(--text-success-txt);
}

.keduall-tag.upper-intermediate-tag {
  background-color: var(--primary-primary-0);
  color: var(--surfaces-primary-bg);
}

.keduall-tag.advanced-tag {
  background-color: var(--buttons-pink-transparent);
  color: var(--pink-pink-600);
}

.keduall-tag.native-tag {
  background-color: var(--buttons-purple-transparent);
  color: var(--purple-purple-600);
}

.keduall-typography.text-default {
  color: var(--surface-black) !important;
}

.keduall-typography.rating-title {
  color: var(--surface-black);
}

.keduall-button.button-normal-default {
  max-width: var(--normal-button-width);
  max-height: var(--normal-button-height);
  width: 100%;
  height: 100%;
  padding: var(--spacing-12) var(--spacing-20);
  border-radius: var(--normal-button-border-radius);
  background-color: var(--primary-default);
  box-shadow: none !important;
  border: none;
  font-weight: var(--font-weight-600);
}

.keduall-form.keduall-card-container {
  padding: 0 3.5rem 4.5rem 3.5rem;
}

.p-datepicker.p-component.p-datepicker-timeonly {
  border-radius: var(--border-radius-12);
}

.keduall-form.input-floating-lable-default .p-inputnumber-input:focus,
.p-datepicker.p-component.p-datepicker-timeonly:focus,
.p-datepicker.p-component.p-datepicker-timeonly:hover,
.keduall-form.input-default-default .p-inputtext.p-component:hover,
.keduall-form.input-floating-lable-default .p-inputnumber-input:hover,
.keduall-form.input-default-default.p-focus .p-inputtext.p-component {
  border: 0.063rem solid var(--accent-focus-border);
  box-shadow: none;
}

.keduall-custom-form.custom-dropdown {
  position: absolute;
  background-color: var(--white-color);
  box-shadow: 0px 0.5rem 0.5rem var(--text-secondary-text);
  width: 100%;
  z-index: 99;
  max-height: 18.75rem;
  border: 0.063rem solid var(--border-primary-br);
  overflow-y: auto;
  top: 100%;
}

.keduall-form {
  outline: none !important;
}

.keduall-form.dropdown-input-panel.p-dropdown-panel .p-dropdown-items-wrapper::-webkit-scrollbar-corner,
.keduall-form.dropdown-input .p-dropdown-panel .p-dropdown-items-wrapper::-webkit-scrollbar-corner {
  border-radius: var(--border-radius-12);
}

.keduall-form.dropdown-input-panel .p-checkbox.p-component .p-checkbox-box {
  border-radius: 0.375rem;
  border: 0.063rem solid var(--border-primary-br);
  background: var(--white-color);
  width: 1.25rem;
  height: 1.25rem;
  padding: 0.1875rem;
  cursor: pointer;
}

.keduall-form.dropdown-input-panel .p-checkbox.p-component.p-highlight .p-checkbox-box {
  background-color: var(--primary-primary-0) !important;
  border-color: var(--primary-primary-default) !important;
}

.keduall-form.dropdown-input-panel .p-checkbox.p-component.p-highlight .p-checkbox-box svg {
  color: var(--primary-primary-default) !important;
}

.keduall-form.dropdown-input-panel .p-multiselect-item.p-highlight,
.keduall-form.dropdown-input-panel .p-dropdown-item.p-highlight
{
  background-color: var(--surfaces-primary-bg);
}

.keduall-form.dropdown-input-panel .p-multiselect-item.p-focus,
.keduall-form.dropdown-input-panel .p-dropdown-item.p-focus
{
  background-color: var(--surfaces-hover-bg);
}

.keduall-form.dropdown-input-panel .p-multiselect-filter {
  font-family: var(--font-family-font-family-pretendard);
  font-size: var(--font-size-16);
  font-style: normal;
  line-height: var(--font-size-24);
  letter-spacing: 0;
  font-weight: 400;
}

.keduall-form.dropdown-input-panel .p-multiselect-empty-message {
  font-family: var(--font-family-font-family-pretendard);
  font-size: var(--font-size-16);
  font-style: normal;
  line-height: var(--font-size-24);
  letter-spacing: 0;
  font-weight: 400;
  padding: 1rem;
}

.keduall-form.dropdown-input-panel .p-multiselect-item {
  font-family: var(--font-family-font-family-pretendard);
  font-size: var(--font-size-16);
  font-style: normal;
  line-height: var(--font-size-24);
  letter-spacing: 0;
  font-weight: 400;
}

.keduall-form.dropdown-input.custom-placeholder::placeholder {
  font-family: var(--font-family-font-family-fz-poppins, "Fz Poppins"), "PRETENDARD";
  /*  font-size: var(--font-size-20);*/
  font-style: normal;
  /*  line-height: var(--font-size-28);*/
  letter-spacing: 0;
  font-weight: var(--font-weight-400);
  color: var(--text-secondary-txt);
}

.keduall-form.dropdown-input.panel-input-custom-placeholder::placeholder {
  font-family: var(--font-family-font-family-pretendard);
  font-size: var(--font-size-16);
  font-style: normal;
  line-height: var(--font-size-24);
  letter-spacing: 0;
  font-weight: var(--font-weight-400);
  color: var(--text-secondary-txt);
}

.keduall-form.textarea-default.p-inputtextarea {
  border-radius: 0.25rem;
  border-color: var(--border-primary-br);
  box-shadow: none !important;
}

.keduall-form.textarea-default.p-inputtextarea::placeholder {
  color: var(--text-secondary-txt);
}

.keduall-form.textarea-default.p-inputtextarea:focus,
.keduall-form.textarea-default.p-inputtextarea:hover {
  border-color: var(--accent-focus-border);
}

.keduall-rate.rate-small .p-rating-icon {
  width: 0.76rem !important;
  height: 0.73rem !important;
}

.keduall-rate.rate-medium .p-rating-icon {
  width: 0.954rem !important;
  height: 0.913rem !important;
}

.keduall-rate.rate-default.p-rating {
  margin-top: 0.5rem;
  margin-right: auto;
}

.keduall-rate.rate-default .p-rating-item {
  box-shadow: none !important;
  width: 100%;
  height: 100%;
}

.keduall-table .pagination-page-default-circle .p-paginator-element {
  border: none;
  border-radius: 50%;
  color: var(--surface-black);
}

.keduall-table .pagination-page-default-square .p-paginator-element {
  border: none;
  border-radius: var(--border-radius-8);
  color: var(--surface-black);
}

.keduall-table .pagination-page-default-circle .p-paginator-pages,
.keduall-table .pagination-page-default-square .p-paginator-pages {
  display: flex;
  gap: 0.125rem;
}

.keduall-table .pagination-page-default-circle .p-paginator-element:hover,
.keduall-table .pagination-page-default-square .p-paginator-element:hover {
  background: var(--primary-primary-1);
}

.keduall-table .pagination-page-default-circle .p-paginator-element.p-highlight,
.keduall-table .pagination-page-default-square .p-paginator-element.p-highlight {
  background: var(--primary-default);
  color: var(--white-color);
}

.keduall-table .pagination-page-default-square .p-paginator-next {
  justify-content: end;
  flex: auto;
  gap: 0.5rem;
}

.keduall-table .pagination-page-default-circle .p-paginator-last.p-disabled,
.keduall-table .pagination-page-default-circle .p-paginator-prev.p-disabled,
.keduall-table .pagination-page-default-circle .p-paginator-next.p-disabled,
.keduall-table .pagination-page-default-circle .p-paginator-first.p-disabled {
  opacity: 0.5;
  background: var(--white-color);
}

.keduall-table .pagination-page-default-square .p-paginator-prev:hover,
.keduall-table .pagination-page-default-square .p-paginator-next:hover {
  background: var(--white-color);
}

.keduall-table .pagination-page-default-square .p-paginator-prev {
  justify-content: start;
  flex: auto;
  gap: 0.5rem;
}

.keduall-form.dropdown-input.custom-input {
  padding-right: 7.5rem;
}

.keduall-typography.h6-default {
  margin-bottom: 0.875rem;
  padding: 0;
  color: var(--surface-black);
  font-size: var(--font-size-18);
  font-style: normal;
  line-height: 1.5rem;
}

.keduall-typography.text-default.reset {
  margin: 0;
  padding-right: 0.5rem;
}

.keduall-typography.text-default-disabled {
  color: var(--text-secondary-txt);
}

.keduall-gap.gap-20 {
  gap: 1.25rem;
}

.keduall-container {
  max-width: 80rem;
  margin: 0 auto;
  padding: 0 1rem;
  min-height: 75vh;
}

.keduall-no-data {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  font-size: 1.2rem;
  color: var(--text-default-text);
}

.keduall-dialog {
  margin: 0 0.5rem !important;
  gap: 1rem;
  background-color: var(--white-color);
  padding-bottom: 1.25rem;
  padding-top: 1.25rem;
  border-radius: 1.25rem;
  /*  min-height: 90vh;*/

  .p-dialog-header-icon {
    color: black;
    width: 1.38rem;
    height: 1.38rem;
    box-shadow: none;
  }

  .p-dialog-header {
    border-bottom: 0.063rem solid var(--form-third-border);
    padding: 0px 20px 16px 20px;
  }

  .p-dialog-content {
    padding: 0 1.25rem;
  }

  .p-dialog-footer {
    padding: 0 1.25rem;
  }
}

.keduall-button-text-system-square-normal {
  padding: 0.75rem 1.25rem;
  border-radius: 0.375rem;
  background: transparent;
  border: none;
  box-shadow: none;

  .p-button-label {
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5rem;
    color: var(--text-default-txt);
  }
}

.keduall-button-filled-primary-square-small {
  padding: 0.5rem 1rem;
  border-radius: 0.375rem;
  background: var(--buttons-primary);
  border: none;
  box-shadow: none;

  .p-button-label {
    font-size: 0.875rem;
    font-weight: 400;
    line-height: 1.25rem;
    color: var(--text-default-txt);
  }
}

.keduall-button-outlined-primary-square-small {
  padding: 0.5rem 1rem;
  border-radius: 0.375rem;
  border: none;
  box-shadow: none;
  background: transparent;
  border: 0.063rem solid var(--buttons-primary);

  .p-button-label {
    font-size: 0.875rem;
    font-weight: 400;
    line-height: 1.25rem;
    color: var(--buttons-primary);
  }
}

.keduall-button-filled-primary-square-normal {
  padding: 0.75rem 1.25rem;
  border-radius: 0.375rem;
  background: var(--buttons-primary);
  border: none;
  box-shadow: none;

  .p-button-label {
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5rem;
    color: var(--text-default-txt);
  }
}

.keduall-button-filled-primary-square-large {
  padding: 0.75rem 1.25rem;
  border-radius: 0.375rem;
  background: var(--buttons-primary);
  border: none;
  box-shadow: none;

  .p-button-label {
    font-size: 1.125rem;
    font-weight: 400;
    line-height: 1.75rem;
    color: var(--text-default-txt);
  }
}

.keduall-typography-p {
  color: var(--text-default-txt);
  font-size: 0.875rem;
  font-weight: 400;
  line-height: 1.5rem;
  margin: 0;
}

.keduall-typography-h3 {
  color: var(--text-default-txt);
  font-size: 1.88rem;
  font-weight: 600;
  line-height: 2.25rem;
  margin: 0;
}

.keduall-typography-h4 {
  color: var(--text-default-txt);
  font-size: 1.5rem;
  font-weight: 600;
  line-height: 2rem;
  margin: 0;
}

.keduall-typography-h5 {
  color: var(--text-default-txt);
  font-size: 1.25rem;
  font-weight: 500;
  line-height: 1.75rem;
  margin: 0;
}

.keduall-typography-h6 {
  color: var(--text-default-txt);
  font-size: 1.125rem;
  font-weight: 400;
  line-height: 1.75rem;
  margin: 0;
}

.keduall-divider-custome {
  display: flex;
  align-items: center;
}

.keduall-divider-custome::before,
.keduall-divider-custome::after {
  flex: 1;
  content: "";
  padding: 0.063rem;
  background-color: var(--border-primary-br);
  /*    margin: 5px;*/
}

.p-checkbox:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
  border-color: var(--primary-default);
}

.p-inputtext:enabled:hover {
  border-color: var(--surfaces-primary-bg);
}

.p-inputtext:enabled:focus {
  border-color: var(--surfaces-primary-bg);
}

.p-inputtext {
  box-shadow: none;
}

.keduall-badge-tags.badge-lg-primary {
  background: var(--primary-primary-0);
  color: var(--primary-default);
}

.keduall-buttons:hover,
.keduall-buttons:focus {
  box-shadow: none;
}

.keduall-buttons.flex-width .p-button {
  max-width: fit-content !important;
  width: auto !important;
  padding: 1.2rem;
  transition: 0.3s;
}

.keduall-buttons.flex-width .p-button:hover {
  transform: scale(1.1);
}

.p-datepicker.p-component .p-link:hover,
.keduall-buttons.button-outlined-default-small-primary:hover {
  background-color: var(--surfaces-hover-bg);
}

.keduall-min-width-25 {
  min-width: 25%;
}

.keduall-form.dropdown-input .kedual-dropdown-title-contain {
  display: flex;
  padding: 0 var(--spacing-8);
  justify-content: space-between;
  align-items: flex-start;
  align-self: stretch;
  border-radius: 0.25rem;
  background: var(--buttons-info-transparent);
  white-space: nowrap;
}

/* KEDUALL CAROUSEL */
.keduall-carousel-container {
  margin: 0 auto;
  position: relative;
  width: 85%;
}

.keduall-carousel {
  width: 100% !important;
}

.keduall-carousel .p-carousel-container {
  justify-content: center !important;
}

.keduall-carousel .p-carousel-prev,
.keduall-carousel .p-carousel-next {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 2;
  width: 2.5rem;
  height: 2.5rem;
  background: var(--primary-default);
  border: none !important;
  border-radius: 50%;
  opacity: 0.9;
}

.keduall-carousel .p-carousel-prev-icon,
.keduall-carousel .p-carousel-next-icon {
  color: var(--white-color);
  font-size: 1.5rem;
}

.keduall-carousel .p-carousel-prev:hover,
.keduall-carousel .p-carousel-next:hover {
  opacity: 1;
}

.keduall-carousel .p-carousel-prev {
  left: -4rem;
}

.keduall-carousel .p-carousel-next {
  right: -4rem;
}

@media (max-width: 1024px) {
  .keduall-carousel .p-carousel-prev {
    left: -1.5rem !important;
  }

  .keduall-carousel .p-carousel-next {
    right: -1.5rem !important;
  }
}

@media (max-width: 768px) {
  .keduall-carousel .p-carousel-prev {
    left: -1rem !important;
  }

  .keduall-carousel .p-carousel-next {
    right: -1rem !important;
  }
}

.keduall-carousel .p-carousel-indicators {
  display: none;
}

.keduall-carousel .p-carousel-items {
  gap: 1.5rem !important;
  max-width: 80rem;
  margin: 0 auto;
}

.keduall-carousel .top-block {
  scale: 2;
}

.keduall-paginator.p-paginator {
  margin: 1.5rem auto 0;
  justify-content: center !important;
  row-gap: 0.5rem;
  padding: 0.75rem 1rem 1rem !important;
}

.keduall-paginator.p-paginator .p-paginator-pages .p-paginator-page {
  width: 2.5rem;
  height: 2.5rem;
  border-radius: var(--border-radius-8);
  background-color: transparent;
  color: var(--text-default-txt);
  border: none;
  transition: background-color 0.2s;
  font-size: var(--font-size-14);
  font-weight: 500;
  margin-right: 0.13rem;
}

.keduall-paginator.p-paginator .p-paginator-pages .p-paginator-page:hover {
  background-color: var(--primary-primary-0);
}

.keduall-paginator.p-paginator .p-paginator-pages .p-paginator-page.p-highlight {
  background-color: var(--surfaces-primary-bg);
  color: var(--text-white-txt);
}

.keduall-paginator.p-paginator .p-paginator-first {
  width: 2.5rem;
  height: 2.5rem;
  border-radius: var(--border-radius-8);
  transition: background-color 0.2s;
  color: var(--text-default-txt);
}

.keduall-paginator.p-paginator .p-paginator-first:hover {
  background-color: var(--primary-primary-0);
}

.keduall-paginator.p-paginator .p-paginator-prev {
  width: 2.5rem;
  height: 2.5rem;
  border-radius: var(--border-radius-8);
  transition: background-color 0.2s;
  color: var(--text-default-txt);
}

.keduall-paginator.p-paginator .p-paginator-prev:hover {
  background-color: var(--primary-primary-0);
}

.keduall-paginator.p-paginator .p-paginator-last {
  width: 2.5rem;
  height: 2.5rem;
  border-radius: var(--border-radius-8);
  transition: background-color 0.2s;
  color: var(--text-default-txt);
}

.keduall-paginator.p-paginator .p-paginator-last:hover {
  background-color: var(--primary-primary-0);
}

.keduall-paginator.p-paginator .p-paginator-next {
  width: 2.5rem;
  height: 2.5rem;
  border-radius: var(--border-radius-8);
  transition: background-color 0.2s;
  color: var(--text-default-txt);
}

.keduall-paginator.p-paginator .p-paginator-next:hover {
  background-color: var(--primary-primary-0);
}

.keduall-paginator-dropdown {
  border-radius: var(--border-radius-8);
  border: 0.063rem solid var(--border-primary-br);
  display: flex;
  align-items: center;
  height: 2.5rem;
  padding: 0.63rem 1rem;
  min-width: 4.69rem;
  margin-left: 0.2rem;
}

.keduall-paginator-dropdown .p-dropdown-label {
  font-size: var(--font-size-14);
  font-weight: 500;
  color: var(--text-default-txt);
}

/*Static page*/
.static-page {
  max-width: 950px;
  margin: 0 auto;
  border: 1px solid var(--border-primary-br);
  padding: 4vw;
  border-radius: 2rem;
  box-shadow: 10px 10px 10px 0px rgba(0, 0, 0, 0.1);
}

@media (max-width: 800px) {
  .static-page {
    max-width: 950px;
    margin: 0 auto;
    border: none !important;
    padding: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
  }
}

.static-page-content {
  text-align: justify-all;
}

/*Global style for hyperlink*/
a {
  color: var(--text-default-text);
  text-decoration: none;
}

a:hover {
  text-decoration: underline;
}

.keduall-gap-75 {
  gap: 0.75rem;
}

.keduall-file-downloader {
  border: 0.0625rem solid var(--downloader-border-color);
  background: var(--downloader-bg-color);
  border-radius: 0.75rem;
}

/* RESPONSIVE */

@media screen and (min-width: 48rem) {
  .language-speaking .content::before {
    display: block;
  }

  .language-speaking .proficiency-col {
    margin-left: 2rem;
  }

  .language-speaking .column-headers {
    display: flex;
  }
}

.keduall-series-category-title {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 0.375rem 0.5rem;
  gap: 0.625rem;
  min-width: 5.75rem;
  height: 2rem;
  background: var(--surfaces-hover-bg);
  border-width: 0.0625rem 0.0625rem 0.0625rem 0rem;
  border-style: solid;
  border-color: var(--border-white-br);
  border-radius: 0rem 1rem 1rem 0rem;
  flex: none;
  order: 0;
  flex-grow: 0;
  z-index: 0;
  width: fit-content;
}

/* KEDUALL BADGE */
.keduall-badge {
  border-radius: 1rem;
}

.keduall-badge.keduall-badge-small-success {
  padding: 0.125rem 0.5rem;
  font-size: 0.75rem;
  font-weight: 500;
  line-height: 1rem;
  color: var(--text-success-txt);
  background: var(--buttons-success-transparent);
}

.keduall-badge.keduall-badge-small-primary {
  padding: 0.125rem 0.5rem;
  font-size: 0.75rem;
  font-weight: 500;
  line-height: 1rem;
  color: var(--surfaces-primary-bg);
  background: var(--primary-primary-0);
}

.keduall-badge.keduall-badge-small-danger {
  padding: 0.125rem 0.5rem;
  font-size: 0.75rem;
  font-weight: 500;
  line-height: 1rem;
  color: var(--text-danger-text);
  background: var(--buttons-danger-transparent);
}

.keduall-badge.keduall-badge-small-info {
  padding: 0.125rem 0.5rem;
  font-size: 0.75rem;
  font-weight: 500;
  line-height: 1rem;
  color: var(--text-info-text);
  background: var(--buttons-help-transparent);
}

.keduall-badge.keduall-badge-small-neutral {
  padding: 0.125rem 0.5rem;
  font-size: 0.75rem;
  font-weight: 500;
  line-height: 1rem;
  color: var(--text-default-text);
  background: var(--surfaces-sixth-bg);
}

.keduall-badge.keduall-badge-normal-success {
  padding: 0.125rem 0.625rem;
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.25rem;
  color: var(--text-success-txt);
  background: var(--buttons-success-transparent);
}

.keduall-badge.keduall-badge-normal-danger {
  padding: 0.125rem 0.625rem;
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.25rem;
  color: var(--text-danger-text);
  background: var(--buttons-danger-transparent);
}

.keduall-badge.keduall-badge-normal-primary {
  padding: 0.125rem 0.625rem;
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.25rem;
  color: var(--surfaces-primary-bg);
  background: var(--primary-primary-0);
}

.keduall-badge.keduall-badge-large-success {
  padding: 0.25rem 0.75rem;
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.25rem;
  color: var(--text-success-txt);
  background: var(--buttons-success-transparent);
}

.keduall-badge.keduall-badge-large-danger {
  padding: 0.25rem 0.75rem;
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.25rem;
  color: var(--text-danger-text);
  background: var(--buttons-danger-transparent);
}

.keduall-badge.keduall-badge-normal-info {
  padding: 0.25rem 0.75rem;
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.25rem;
  color: var(--text-info-text);
  background: var(--buttons-help-transparent);
}

.keduall-badge.keduall-badge-primary-button {
  padding: 0.5rem 1rem;
  color: var(--text-white-txt);
  background: var(--buttons-primary);
  border-radius: 6.25rem;
}

.keduall-badge.keduall-badge-extra-button {
  padding: 0.5rem 1rem;
  color: var(--text-primary-txt);
  border-radius: 6.25rem;
  border: 0.063rem solid var(--buttons-primary);
}

.keduall-trainer-item {
  border-radius: 1.25rem;
  border: 0.0625rem solid var(--border-second-br, #8c8e90);
  background: var(--surfaces-body-bg, #fff);
  transition: all 0.3s ease-in-out;

  &:hover {
    border: 0.063rem solid var(--border-accent-br, #ff8110);
    transform: scale(1.005);
    box-shadow: 0rem 1.5rem 2rem rgba(0, 0, 0, 0.06),
      0rem 0.5rem 1rem rgba(0, 0, 0, 0.08);
    transition: all 0.5s ease-in-out;
  }
}

.keduall-trainer-item .avatar {
  border-radius: var(--border-radius-12, 12px);
  border: 2px solid var(--border-primary-br, #d1d1d1);
  background: var(--surfaces-additional-add-bg-01, #e6f2ff);
  /*  aspect-ratio: 1/1;*/
}

.keduall-trainer-information .avatar {
  width: 9.5rem !important;
  height: 9.5rem !important;
  aspect-ratio: 3/4;
  border-radius: 1.25rem;
}

.keduall-trainer-information .trainer-header-item {
  gap: 1rem !important;
}

.keduall-trainer-item .underline-button {
  text-decoration-line: underline;
  text-decoration-style: solid;
  text-decoration-skip-ink: none;
  text-decoration-thickness: auto;
  text-underline-offset: auto;
  text-underline-position: from-font;
}

.keduall-flag-border {
  border: 1px solid var(--border-primary-br, #d1d1d1);
}

.keduall-heart-button {
  border-radius: var(--border-radius-56, 56px);
  background: var(--surfaces-inactive-bg, #e5e5e5);
  padding: 0.5rem;
}

.keduall-heart-button .icon {
  font-size: 1rem;
  color: #ec4899;
}

.keduall-bundle-discount-table {
  width: 100%;
  background-color: transparent;
  /*  border: 1px solid var(--border-primary-br, #d1d1d1);*/
}

.keduall-bundle-discount-table .bundle-discount-row {
  display: flex;
  flex-direction: column;
  padding: var(--spacing-4, 4px) 10px;
  border-bottom: 1px solid var(--border-primary-br, #d1d1d1);
  width: 100%;
}

.keduall-bundle-discount-table .bundle-discount-row:last-child {
  border-bottom: none;
}

.keduall-bundle-discount-table .bundle-discount-original-price {
  text-decoration-color: var(--border-error-br, #f00) !important;
}

@media (min-width: 640px) {
  .keduall-bundle-discount-table .bundle-discount-row {
    flex-direction: row;
    align-items: center;
  }
}

.main-content-wrapper {
  width: 95%;
  margin: 0 auto;
  margin-top: 30px;
  margin-bottom: 50px;
  max-width: 1480px;
}

.dropdown-picker-time .p-button.p-component {
  flex: 1 1 0%;
}

.notification-list-loader {
  min-height: 20rem;
  display: flex;
  align-items: center;
  justify-content: center;
}

.page-title-container {
  text-align: center;
  margin-bottom: 2rem;
}

.text-decoration-line-red {
  text-decoration-color: var(--border-error-br) !important;
}

/* Smart Matching */
.smart-matching-overview {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--spacing-48, 3rem);
  align-self: stretch;
}

.smart-matching-overview .section-1 {
  gap: var(--spacing-32, 2rem);
  max-width: 1440px;
  margin: 0 auto;
}

.smart-matching-overview .left-content {
  display: flex;
  width: 31.875rem;
  flex-direction: column;
  gap: 0.625rem;
  align-items: flex-start;
}

.smart-matching-overview .right-content {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 1.5rem;
  flex: 1 0 0;
  position: relative;
}

.smart-matching-overview .right-content-icon {
  position: absolute;
  top: 0;
  right: 0;
}

.smart-matching-overview .section-2 {
  border-radius: 2.25rem;
}

.smart-matching-overview .section-3 {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--Spacing-48, 3rem);
  align-self: stretch;
}

.smart-matching-overview .no-data {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: var(--Spacing-32, 2rem);
  align-self: stretch;
}

.smart-matching-overview .section-2>img {
  width: 100%;
  height: auto;
  overflow: hidden;
  object-fit: contain;
}

.smart-matching-overview .right-content-description {
  display: flex;
  align-items: center;
  gap: 1.5rem;
  align-self: stretch;
  font-size: 1.2rem;
}

.smart-matching-overview .left-content-background {
  width: 100%;
  max-width: 31.875rem;
  height: auto;
  aspect-ratio: 510/424.438;
  position: relative;
  z-index: 1;
}

.smart-matching-overview .left-content-image {
  width: 90%;
  max-width: 28.25rem;
  height: auto;
  aspect-ratio: 452/291;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  z-index: 2;
  box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.2);
  border-radius: 1.2rem;
}

.smart-matching-overview .image-19 {
  width: 42%;
  max-width: 13.31413rem;
  height: auto;
  aspect-ratio: 1/1;
  position: absolute;
  right: 0;
  bottom: 5%;
}

.smart-matching-overview .image-20 {
  width: 5%;
  max-width: 1.51294rem;
  height: auto;
  aspect-ratio: 1/1;
  position: absolute;
  bottom: 0;
  right: 40%;
}

.smart-matching-overview .image-21 {
  width: 5%;
  max-width: 1.51294rem;
  height: auto;
  aspect-ratio: 1/1;
  position: absolute;
  top: 1.5%;
  left: 25%;
}

.smart-matching-overview .image-22 {
  width: 22%;
  max-width: 7.0605rem;
  height: auto;
  aspect-ratio: 1/1;
  position: absolute;
  left: 0;
  top: 0;
}

@media (max-width: 48rem) {
  .smart-matching-overview .left-content {
    width: 100%;
    max-width: 31.875rem;
  }

  .smart-matching-overview .right-content-icon {
    top: 0.625rem;
    right: 0.625rem;
    max-width: 3.75rem;
  }
}

@media (max-width: 36rem) {
  .smart-matching-overview .image-19 {
    width: 40%;
    bottom: 3%;
  }

  .smart-matching-overview .image-20 {
    width: 6%;
    right: 35%;
  }

  .smart-matching-overview .image-21 {
    width: 6%;
  }

  .smart-matching-overview .image-22 {
    width: 25%;
  }
}

.smart-matching-question-wrapper .introduction-view {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 1rem;
  flex: 1 0 0;
  align-self: stretch;
  position: relative;
  text-align: center;
}

@media (max-width: 48rem) {
  .smart-matching-question-wrapper .introduction-view {
    width: 100%;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
  }
}

.smart-matching-modal {
  position: relative;
}

.smart-matching-modal .close-btn {
  position: absolute;
  top: 0;
  right: 0;
}

.smart-matching-question-wrapper .introduction-view-content {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1rem;
  flex: 1 0 0;
}

.smart-matching-question-wrapper .thumbnail {
  width: 21.3125rem;
  height: 18.0625rem;
  object-fit: contain;
}

@media (max-width: 48rem) {
  .smart-matching-question-wrapper .thumbnail {
    width: 100%;
    height: auto;
  }
}

.keduall-question-selector {
  display: flex;
  justify-content: center;
  align-self: stretch;
  flex-wrap: nowrap;
  align-items: stretch;
}

.keduall-question-selector .keduall-question-item {
  display: flex;
  /* width: 14.375rem; */
  max-width: 14.375rem;
  padding: 1rem var(--spacing-16, 1rem);
  flex-direction: column;
  align-items: flex-start;
  gap: 1rem;
  position: relative;
  border-radius: var(--Border-24, 1.5rem);
  background: var(--Primary-Primary-11, #e6f2ff);
  display: flex;
  max-width: 230px;
  padding: 16px var(--Spacing-16, 16px);
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
  flex: 1 0 0;
  margin: 0 0.5rem;

}

.keduall-question-selector .keduall-question-item:hover,
.keduall-question-selector .keduall-question-item.is-selected {
  border-radius: var(--border-24, 1.5rem);
  background: var(--primary-primary-11, #e6f2ff);
  transition: background 0.3s ease, box-shadow 0.3s ease, transform 0.3s ease;
  box-shadow: 0 0.25rem 1rem 0 var(--shadow-shadow-12, rgba(0, 0, 0, 0.12)),
    0 0.125rem 0.5rem 0 var(--shadow-shadow-25, rgba(0, 0, 0, 0.25));
}

.keduall-question-selector .keduall-question-item .keduall-question-item-content {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.5rem;
  align-self: stretch;
}

.keduall-question-selector .keduall-question-item .card-image {
  height: 8.875rem;
  align-self: stretch;
  border-radius: 0.5rem;
  object-fit: contain;
  width: 100%;
}

.keduall-question-selector .keduall-question-item .card-tag {
  display: flex;
  padding: var(--Spacing-6, 0.375rem) var(--Spacing-12, 0.75rem);
  justify-content: center;
  align-items: center;
  gap: 0.25rem;
  border-radius: 2rem;
  background: var(--Primary-Primary-1, #fff5d7);
}

.keduall-question-selector .keduall-question-item .keduall-question-item-selected {
  position: absolute;
  top: 0;
  right: 0;
}

@media (max-width: 1140px) {
  .keduall-question-selector {
    width: 100%;
    flex-direction: column;
    gap: 1rem;
    margin: auto;
    width: fit-content;

  }

}

.smart-matching-completed-wrapper .completed-description,
.smart-matching-error-wrapper .error-description {
/*  height: 15.5rem;*/
  display: flex;
  padding: var(--spacing-0, 0rem);
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.smart-matching-loading-wrapper .spinner-loading {
  width: 6rem;
  height: 6rem;
}

.smart-matching-loading-wrapper .spinner-loading circle {
  stroke: #ff8110 !important;
}

.smart-matching-loading-wrapper .smart-matching-loading-wrapper-content {
  height: 19.5rem;
}



.smart-matching-modal-content {
  position: relative;
  overflow: hidden;
}

.smart-matching-modal-content .close-btn {
  position: absolute;
  cursor: pointer;
  top: 0.3125rem;
  right: 0;
  z-index: 2;
}

.smart-matching-dropdown {
  height: 15.5rem;
  width: 100%;
  max-width: 29.75rem;
  align-self: center;
}

.smart-matching-selector {
  min-height: 15.5rem;
  width: 100%;
  align-self: center;
}

.line-clamp-3 {
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
}

.gradient-word {
  height: var(--font-size-36);
  align-items: center;
  padding-right: 0.5rem;
  background: linear-gradient(to top, var(--surfaces-primary-bg, #ff8110) 0 35%, transparent 35% 100%);
  margin-bottom: 0.5rem;
}

.required:after {
  content: " *";
  color: red;
}

.search-filter-fixed-button {
  width: 3.5rem;
  height: 3.5rem;
  position: fixed;
  left: 0;
  top: 11rem;
  z-index: 10;
}

.text-ellipsis-line-clamp-1 {
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}

ul {
    padding-left: 1.2rem;
}

.p-multiselect-items-wrapper ul {
    padding-left: 0rem;
}

.keduall-custom-accordion {
    border-radius: 0.5rem;
    box-shadow: 0 0.0625rem 0.125rem 0 rgba(0, 0, 0, 0.05);
    overflow: hidden;
    border-radius: var(--border-radius-12);
    border: 1px solid var(--border-primary-br, #d1d1d1);
}

.keduall-custom-accordion-item {
    border-bottom: 0.0625rem solid var(--border-primary-br, #d1d1d1);
}

.keduall-custom-accordion-item:last-child {
    border-bottom: none;
}

.keduall-custom-accordion-header {
    cursor: pointer;
    outline: none;
    transition: background-color 0.2s ease;
}

.keduall-custom-accordion-header:hover {
    background-color: #f9fafb;
}

.keduall-custom-accordion-title {
    color: var(--text-default-txt, #000);
    margin: 0;
    transition: color 0.2s ease;
}

.keduall-custom-accordion-title-active {
    color: var(--text-primary-txt, #ff8110) !important;
    font-weight: 700 !important;
}

.keduall-custom-accordion-icon {
    font-size: 0.875rem;
    transition: transform 0.3s ease, color 0.2s ease;
}

.keduall-custom-accordion-title-active+.keduall-custom-accordion-icon {
    color: var(--text-primary-txt, #ff8110);
}

.keduall-custom-accordion-content {
    max-height: 0;
    overflow: hidden;
    opacity: 0;
    transform: translate(-0.625rem);
    transition: max-height 0.3s ease-in-out, opacity 0.3s ease-in-out, transform 0.3s ease-in-out;
}

.keduall-custom-accordion-content.open {
    max-height: 62.5rem;
    opacity: 1;
    transform: translate(0);
}

.keduall-custom-accordion-list-item {
    cursor: pointer;
    transition: background-color 0.2s ease;
}


.keduall-custom-accordion-play-icon {
    color: var(--text-default-txt, #000);
    transition: color 0.2s ease;
    font-size: 0.625rem;
}

.keduall-custom-accordion-play-icon.pi-spinner {
    color: var(--text-primary-txt, #ff8110);
}

.keduall-custom-accordion-lesson-number {
    font-weight: 600;
    flex-shrink: 0;
    color: var(--text-default-txt, #000);
}

.keduall-custom-accordion-lesson-text {
    font-weight: 400;
    transition: font-weight 0.2s ease;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    flex: 1;
    min-width: 0;
    color: var(--text-default-txt, #000);
}

.keduall-custom-accordion-list-item-playing .keduall-custom-accordion-lesson-text {
    font-weight: 700;
}

.keduall-custom-accordion-time {
    font-weight: 400;
    flex-shrink: 0;
    margin-left: 0.75rem;
    color: var(--text-default-txt, #000);
}

/* Group pattern: khi list-item được selected, tất cả phần tử con sẽ có màu primary */
.keduall-custom-accordion-list-item-selected .keduall-custom-accordion-play-icon,
.keduall-custom-accordion-list-item-selected .keduall-custom-accordion-lesson-number,
.keduall-custom-accordion-list-item-selected .keduall-custom-accordion-lesson-text,
.keduall-custom-accordion-list-item-selected .keduall-custom-accordion-time,
.keduall-custom-accordion-list-item-selected .keduall-custom-accordion-equalizer-bar {
    color: var(--text-primary-txt, #ff8110) !important;
}

.keduall-custom-accordion-list-item-selected .keduall-custom-accordion-equalizer-bar {
    background-color: var(--text-primary-txt, #ff8110) !important;
}

.keduall-custom-accordion-list-item-selected .keduall-custom-accordion-lesson-text {
    font-weight: 700 !important;
}

.keduall-custom-accordion-list-item {
    overflow: hidden;
}

.keduall-custom-accordion-list-item > div:first-child {
    flex: 1;
    min-width: 0;
    overflow: hidden;
}

.keduall-custom-accordion-list-item-content {
    flex: 1;
    min-width: 0;
    overflow: hidden;
}

.keduall-custom-accordion-play-icon {
    flex-shrink: 0;
}

.keduall-custom-accordion-dot-elastic {
    display: flex;
    align-items: center;
    gap: 0.25rem;
}

.keduall-custom-accordion-dot-elastic .dot {
    width: 0.375rem;
    height: 0.375rem;
    border-radius: 50%;
    background-color: var(--primary-color);
    animation: dot-elastic 1.4s infinite ease-in-out;
}

.keduall-custom-accordion-dot-elastic .dot:nth-child(1) {
    animation-delay: -0.32s;
}

.keduall-custom-accordion-dot-elastic .dot:nth-child(2) {
    animation-delay: -0.16s;
}

.keduall-custom-accordion-dot-elastic .dot:nth-child(3) {
    animation-delay: 0s;
}

@keyframes dot-elastic {
    0%, 80%, 100% {
        transform: scale(0.8);
        opacity: 0.5;
    }

    40% {
        transform: scale(1);
        opacity: 1;
    }
}

.keduall-custom-accordion-equalizer {
    display: flex;
    align-items: center;
    gap: 0.125rem;
    height: 0.75rem;
    width: 0.75rem;
}

.keduall-custom-accordion-equalizer-bar {
    width: 0.125rem;
    background-color: var(--text-default-txt, #000);
    border-radius: 0.0625rem;
    animation: equalizer-animation 1.2s infinite ease-in-out;
}

.keduall-custom-accordion-equalizer-bar:nth-child(1) {
    animation-delay: 0s;
    height: 0.25rem;
}

.keduall-custom-accordion-equalizer-bar:nth-child(2) {
    animation-delay: 0.15s;
    height: 0.5rem;
}

.keduall-custom-accordion-equalizer-bar:nth-child(3) {
    animation-delay: 0.3s;
    height: 0.375rem;
}

.keduall-custom-accordion-equalizer-bar:nth-child(4) {
    animation-delay: 0.45s;
    height: 0.625rem;
}

@keyframes equalizer-animation {
    0%, 100% {
        transform: scaleY(0.3);
    }
    50% {
        transform: scaleY(1);
    }
}

.trainer-rating-content img {
    max-height: 50%;
    object-fit: cover;
    margin: 0.3125rem 0;
    max-width: 50%;
}

/* Prevent scroll without layout shift */
.no-scroll {
  overflow: hidden !important;
}

/* Only add padding on desktop to compensate for scrollbar */
@media (min-width: 1024px) {
  .no-scroll {
    padding-right: 1.35rem !important;
  }
}

.animated-progress .p-progressbar-value {
    transition: width 0.5s ease-in-out;
}

.animated-progress .p-progressbar-value-animate {
    transition: width 0.3s ease-in-out;
}

.animated-progress .p-progressbar-value {
    transition: width 0.5s ease-in-out;
    animation: pulse 2s infinite;
}

@keyframes pulse {
    0% {
        opacity: 1;
    }

    50% {
        opacity: 0.8;
    }

    100% {
        opacity: 1;
    }
}

/* Video thumbnail play button */
.video-thumbnail-container {
  cursor: pointer;
  overflow: hidden;
}

.video-thumbnail-container .vod-thumbnail {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.3s ease;
}

.video-thumbnail-container:hover .vod-thumbnail {
  transform: scale(1.05);
}

.video-play-button {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  transition: transform 0.3s ease;
  z-index: 2;
}

.video-thumbnail-container:hover .video-play-button {
  transform: translate(-50%, -50%) scale(1.5);
}

/* vod hover video styles */
.vod-hover-video {
  display: none;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 999999999;
  opacity: 1;
  transition: opacity 0.3s ease-in-out;
}

.vod-hover-video.fade-in {
  opacity: 1;
}

.vod-hover-video.fade-out {
  opacity: 0;
}

/* header dropdown styles */
.header-avatar-dropdown {
  position: relative;
  display: inline-block;
}

.account-dropdown-popup {
  position: absolute;
  right: 0;
  top: 2.2rem;
  min-width: 220px;
  background: #fff;
  border-radius: 8px;
  box-shadow: 0 2px 12px rgba(0,0,0,0.15);
  z-index: 2000;
  padding: 1.25rem 1rem 1rem 1rem;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.account-dropdown-avatar {
  border-radius: 50%;
  overflow: hidden;
  width: 50%;
  aspect-ratio: 1/1;
  margin-bottom: 0.5rem;
}

.account-dropdown-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: top;
}

.account-dropdown-divider {
  width: 100%;
  border-top: 1px solid #eee;
  margin-bottom: 0.75rem;
}

.account-dropdown-link {
  border-bottom: 1px solid #eee;
}

.education-qualification .education-form-row {
  display: grid !important;
  grid-template-columns: 1fr 1fr 1fr 1fr auto !important;
  gap: 1rem !important;
  width: 100% !important;
  align-items: start !important;
  margin-bottom: 1rem;
}

.education-qualification .education-form-row .edu-input {
  display: flex !important;
  flex-direction: column !important;
}

.education-qualification .education-form-row .reset-btn {
  display: flex !important;
  align-items: flex-end !important;
  justify-content: center !important;
  padding-bottom: 0.25rem;
}

.education-qualification .education-form-row .p-dropdown-label.p-inputtext{
    width: 0rem;
}

@media (max-width: 767px) {
  .education-qualification .education-form-row {
    grid-template-columns: 1fr !important;
    gap: 0.5rem !important;
  }
}

@media (min-width: 768px) and (max-width: 1023px) {
  .education-qualification .education-form-row {
    grid-template-columns: 1fr 1fr !important;
    gap: 0.75rem !important;
  }
  
  .education-qualification .education-form-row .reset-btn {
    grid-column: span 2;
    justify-self: center;
  }
}

.education-qualification .education-inputs-container {
  display: block !important;
  width: 100% !important;
}

/* KEDUALL PRICE */
.keduall-price.keduall-original-price {
  color: var(--text-secondary-txt);
  text-decoration: line-through;
}

.keduall-price.keduall-discount-percentage {
  color: var(--surface-black);
}

.keduall-price.keduall-final-price {
  color: var(--text-danger-txt);
}

.event-detail-featured-course-card {
    background-color: #fef3cd;
    padding: 1.5rem;
    border: none;
    box-shadow: none;
    margin-top: auto;
}

.event-detail-featured-course-badge {
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    padding: 1.563rem;
    font-weight: bold;
    color: #ffffff;
    transform: rotate(-20deg);
    display: inline-block;
    line-height: 1;
}

.event-detail-featured-course-price-save {
    background-color: palegreen;
    padding: 0.313rem 1.25rem;
    border-radius: 1.25rem;
    color: darkgreen;
    font-size: small;
    display: inline-flex;
    align-items: center;
    gap: .25rem;
}

.keduall-card.keduall-vod-description-wrapper .trainer-header-item-wrapper {
    display: flex;
    gap: 1rem;
}

.keduall-card.keduall-vod-description-wrapper .avatar {
    border-radius: 0.75rem !important;
    height: auto !important;
}

.in-cart {
    position: absolute;
    bottom: 1rem;
    background-color: var(--primary-default);
    padding: 0.5rem;
    z-index: 997;
    border-radius: 1rem;
    right: 0.75rem;
    transition: 0.3s;
    box-shadow: 5px 5px 10px 0px rgba(0, 0, 0, 0.3)
}

.in-cart > svg > path {
    fill: var(--white-color);
}

.in-cart:hover {
    transform: scale(1.2)
}

.add-to-cart > svg > path {
    fill: var(--text-primary-text);
}

.availability-table .p-datatable-tbody > tr > td:has(.cell-content.grayed-out) {
    background-color: var(--surfaces-inactive-bg);
    pointer-events: none;
}