.kn-page button,
.kn-modal button {
    text-transform: unset;
}

.kn-btn-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    border: none;
    cursor: pointer;
    border-radius: var(--kn-spacing-sm);
    padding: 0px;
}

.kn-btn-icon img {
    width: var(--kn-spacing-xl);
    height: var(--kn-spacing-xl);
}

.kn-btn-icon.secondary {
    width: 38px;
    height: 33px;
    background: var(--kn-bg-secondary);
    border-radius: var(--kn-radius-xl);
}

.kn-btn,
.kn-secondary-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: var(--kn-font-primary);
    font-weight: 600;
    cursor: pointer;
    white-space: nowrap;
    text-transform: unset;
    gap: var(--kn-spacing-sm);
    transition: all 0.3s ease-out;
}

.kn-btn:not(.btn-lg),
.kn-secondary-btn:not(.btn-lg) {
    height: 33px;
    border-radius: var(--kn-radius-full);
    font-size: 15px;
}

.kn-btn:not(.btn-lg):not(.kn-btn-secondary) {
    padding: 5px var(--kn-spacing-md);
}

.kn-btn.kn-btn-secondary:not(.btn-lg),
.kn-secondary-btn:not(.btn-lg) {
    padding: 8px 16px;
}

.kn-btn.btn-lg,
.kn-secondary-btn.btn-lg {
    border-radius: 16px;
    height: 48px;
}

.kn-btn.btn-lg:not(.kn-btn-secondary) {
    padding: 8px 40px;
    border: 1px solid rgba(46, 42, 37, 0.03) !important;
    font-size: 17px;
}

.kn-btn.kn-btn-secondary.btn-lg,
.kn-secondary-btn.btn-lg {
    padding: 8px 16px;
    border: 1px solid var(--kn-border-light, #E7E7E5);
    font-size: 15px;
    font-style: normal;
    line-height: normal;
}

.kn-btn:not(.kn-btn-secondary):not(.kn-btn-danger):not(.disabled),
.kn-btn.kn-btn-primary:not(.disabled) {
    background: var(--kn-primary);
    color: white;
    border: none;
}

.kn-btn:not(.kn-btn-secondary):not(.kn-btn-danger):not(.disabled):hover,
.kn-btn.kn-btn-primary:not(.disabled):hover {
    opacity: 0.8;
}

.kn-btn.kn-btn-secondary:not(.disabled),
.kn-secondary-btn:not(.disabled) {
    background: white;
    color: var(--kn-text, #2E2A25);
    border: 1px solid var(--kn-border-light, #E7E7E5);
}

.kn-btn.kn-btn-secondary:not(.btn-lg):not(.disabled),
.kn-secondary-btn:not(.btn-lg):not(.disabled) {
    background: #E7E7E5;
}

.kn-btn.kn-btn-secondary.btn-lg:not(.disabled):hover,
.kn-secondary-btn.btn-lg:not(.disabled):hover {
    background: var(--kn-bg);
    opacity: 1;
}

.kn-btn.disabled:not(.kn-btn-secondary):not(.kn-btn-danger) {
    background-color: var(--kn-disabled) !important;
    color: #FFF !important;
    border: none !important;
    cursor: not-allowed;
    opacity: 1 !important;
}

.kn-btn.kn-btn-secondary.disabled,
.kn-secondary-btn.disabled {
    background: white !important;
    color: var(--kn-disabled) !important;
    border: 1px solid var(--kn-border-light, #E7E7E5) !important;
    cursor: not-allowed;
    opacity: 1 !important;
}

.kn-btn.kn-btn-secondary.disabled:not(.btn-lg),
.kn-secondary-btn.disabled:not(.btn-lg) {
    background: var(--kn-bg-header) !important;
    color: var(--kn-disabled) !important;
}

.kn-btn img,
.kn-secondary-btn img {
    width: var(--kn-spacing-xl);
    height: var(--kn-spacing-xl);
}

.kn-spinner {
    width: var(--kn-spacing-xl);
    height: var(--kn-spacing-xl);
    display: none;
}

.kn-btn.kn-btn-danger:not(.disabled),
.kn-btn-danger:not(.disabled) {
    background: var(--kn-danger);
    color: white;
    border: none;
}

.kn-btn.kn-btn-danger:not(.disabled):hover,
.kn-btn-danger:not(.disabled):hover {
    opacity: 0.8;
}

.kn-btn-danger.disabled,
.kn-btn.kn-btn-danger.disabled {
    background-color: #fff !important;
    color: var(--kn-disabled) !important;
    border: none !important;
    cursor: not-allowed !important;
    opacity: 1 !important;
}

.kn-btn-search-desktop {
    display: flex;
    width: 40px;
    height: 26px;
    justify-content: center;
    align-items: center;
    gap: 10px;
    border-radius: 20px;
    background: var(--kn-text-dark);
    border: none;
    cursor: pointer;
}

.kn-btn-search-desktop:hover {
    background: var(--kn-primary);
}

.kn-btn-search-desktop img {
    width: 15px;
    height: 15px;
}