#globalSaveBadge,
#autosaveCounter {
    transition:
        opacity 0.2s ease,
        transform 0.2s ease;
    font-size: 15px;
    margin: 0;
    font-weight: 500;
}
#globalSaveBadge.uk-label-default {
    color: #000;
}
#globalSaveBadge.uk-label-success {
    color: green;
}
#globalSaveBadge.uk-label-warning {
    color: orange;
}
#globalSaveBadge.uk-label-danger {
    color: red;
}
.ys_save_status {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    padding: 20px 0;
    position: sticky;
    top: 0;
    background: #fff;
    z-index: 999;
}

.section_accordion2 {
    border-bottom: 1px solid #eee;
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 50px;
}
.section_accordion {
    border-bottom: 1px solid #eee;
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 60px;
}
.section_accordion a {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    color: #333;
    font-size: 17px;
    padding: 0 20px;

    font-weight: 500;

    /* ⭐ 부드러운 확대 효과 */
    transform: scale(1);
    transform-origin: left center;

    transition:
        transform 0.35s cubic-bezier(0.4, 0, 0.2, 1),
        color 0.25s ease,
        letter-spacing 0.25s ease;
}

.uk-open .section_accordion {
    border: none;
    height: 80px;
}

.uk-open .section_accordion a {
    color: #000;
    font-weight: 700;
    letter-spacing: -1px;

    /* 17px → 24px 느낌 */
    transform: scale(1.18);
}

.section_accordion a:hover {
    text-decoration: none;
}

/* 좌/우 레이아웃 */
.inv-edit-wrap {
    display: flex;
    justify-content: space-between;
    gap: 14px;
}

.inv-left {
    width: 100%;
    max-width: 600px;
}

.inv-right {
    max-width: 450px;
    width: 100%;
}
.inv-right .uk-card-default {
    background-color: #666;
    height: 100%;
    position: sticky;
    top: 0;
    z-index: 10;
}
.preview_wrap {
    position: sticky;
    top: 0;
}
@media (max-width: 1024px) {
    .inv-edit-wrap {
        flex-direction: column;
    }

    .inv-left {
        max-width: 100%;
    }
    .inv-rigth {
    }
}

.inv-pack-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}

.inv-pack {
    border: 1px solid #e5e5e5;
    border-radius: 10px;
    overflow: hidden;
    cursor: pointer;
    background: #fff;
}

.inv-pack.is-active {
    /* outline: 2px solid rgba(0, 0, 0, 0.35); */
    border-color: #000;
}

.inv-pack .thumb {
    height: 110px;
    background: #f5f5f5;
    display: flex;
    align-items: center;
    justify-content: center;
}

.inv-pack .thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.inv-pack .meta {
    padding: 10px;
}

.inv-pack .title {
    font-weight: 700;
    font-size: 13px;
}

/* .inv-pack .desc {
    font-size: 12px;
    color: #777;
    margin-top: 4px;
    line-height: 1.2;
    min-height: 28px;
} */
.inv-pack .ys_icon_edit {
    margin: 0 !important;
    color: #999;
}
.inv-pack .ys_icon_edit:hover {
    color: #000;
}
.inv-pack button {
    border: none;
    background: none;
}
.inv-pack-bgm {
    display: grid;
    grid-template-columns: repeat(1, minmax(0, 1fr));
    gap: 10px;
}
.inv-pack-map {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}
.inv-pack-map div:first-child .meta {
    background: url("../images/map_naver.jpg") no-repeat;
    background-size: cover;
    height: 150px;
}
.inv-pack-map div:last-child .meta {
    background: url("../images/map_kakao.jpg") no-repeat;
    background-size: cover;
    height: 150px;
}
.inv-pack-map .meta .title {
    font-size: 15px;
    font-weight: 500;
    color: #fff;
    background-color: #000;
    display: inline-block;
    padding: 0 4px;
    border-radius: 4px;
    opacity: 0.8;
}
.inv-pack-bgm .meta {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.inv-pack-bgm .meta .desc {
    line-height: auto;
}
.inv-iframe {
    width: 100%;
    border: 1px solid #e5e5e5;
    border-radius: 12px;
    height: auto;
    aspect-ratio: 9 / 16;
    display: block;
}

.uk-switch {
    display: none;
}

.uk-switch-label {
    position: relative;
    display: inline-block;
    width: 90px;
    height: 32px;
    background: rgba(0, 0, 0, 0.7);
    cursor: pointer;
    font-size: 15px;
    font-weight: bold;
    color: #fff;
    border-radius: 50px;
    margin: 5px 10px 0 0;
}
.uk-switch-sub-label {
    border-radius: 8px;
    width: 100px;
}

.uk-switch-label .on,
.uk-switch-label .off {
    position: absolute;
    top: 0;
    width: 60%;
    height: 100%;
    line-height: 32px;
    text-align: center;
    pointer-events: none;
}

.uk-switch-label .on {
    left: 2px;
    opacity: 0;
}

.uk-switch-label .off {
    right: 4px;
    opacity: 1;
}

.uk-switch-label::after {
    content: "";
    position: absolute;
    width: 28px;
    height: 28px;
    left: 2px;
    top: 2px;
    background: #fff;
    border-radius: 50%;
    transition: 0.2s;
}
.uk-switch-sub-label::after {
    border-radius: 6px;
}

.uk-switch:checked + .uk-switch-label {
    background: #1e87f0;
}
.uk-switch-sub:checked + .uk-switch-label {
    background: red;
}

.uk-switch:checked + .uk-switch-label::after {
    left: 60px;
}
.uk-switch-sub:checked + .uk-switch-sub-label::after {
    left: 70px;
}

.uk-switch:checked + .uk-switch-label .on {
    opacity: 1;
}

.uk-switch:checked + .uk-switch-label .off {
    opacity: 0;
}

.uploadzonestyle {
    margin-top: 20px;
}
.uploadzonethumb1 {
    max-width: 200px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin: 0 auto;
    cursor: default;
}
.uploadzonethumb .ys_icon_edit,
.uploadzonethumb1 .ys_icon_edit {
    margin: 0 !important;
    font-size: 24px;
    cursor: pointer;
    font-variation-settings:
        "FILL" 0,
        "wght" 200,
        "GRAD" -25,
        "opsz" 24;
    color: #aaa;
    height: 30px;
    display: flex;
    align-items: center;
}
.uploadzonethumb .ys_icon_edit:hover,
.uploadzonethumb1 .ys_icon_edit:hover {
    color: #000;
}

.uploadzonethumb1 img {
    border-radius: 5px;
    background-color: #f5f5f5;
}
.uploadzonethumb {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.uploadzonethumb {
    cursor: default;
}
.uploadzonethumb svg,
.uploadzonethumb1 svg {
    color: #aaa;
    z-index: 99;
    cursor: pointer;
    margin-bottom: 5px;
}
.uploadzonethumb svg:hover,
.uploadzonethumb1 svg:hover {
    color: #111;
}

.dropzonestyle {
    border: 2px dashed #ddd;
    transition:
        background-color 0.15s ease,
        border-color 0.15s ease,
        transform 0.05s ease;
    cursor: pointer;
    border-radius: 10px;
}
.dropzonestyle.is-hover {
    background: #f8f9ff;
    border-color: #5b7cff;
}
.dropzonestyle.is-dragover {
    background: #eef2ff;
    border-color: #1e87f0;
}
.dropzonestyle.is-drop {
    background: #f0fff4;
    border-color: #32d296;
}
.dropzone_comment {
    display: flex;
    flex-direction: column;
    align-items: center;
    pointer-events: none;
    width: 100%;
}
.dropzone_comment img[src*="cloud-upload"] {
    width: 64px;
    aspect-ratio: 1/1;
    opacity: 0.2;
}
.dropzone_comment .ys_icon_edit {
    margin: -10px 0 0 !important;
    color: #ccc;
}
.dropzonenotice {
    color: #666;
    font-size: 14px;
    width: 100%;
}
.dropzonenotice b {
    font-weight: 500;
    color: #f0506e;
    margin: 0;
}
.dropzonenotice div {
    background-color: #eee;
    border-radius: 8px;
    padding: 10px;
    width: 90%;
    margin: 10px auto;
}

.uk-modal-container .uk-modal-dialog {
    width: 100%;
    max-width: 600px !important;
}

.gallery-uploading-overlay {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color: #fff;
}
.gallery-card.is-uploading .uk-cover-container {
    background: rgba(0, 0, 0, 0.04);
}
#editModeToggle {
    margin-bottom: 10px;
}
#editModeToggle button {
    border: 1px solid transparent;
    border-bottom: 1px solid;
    background: none;
    font-size: 24px;
    font-weight: 500;
}
#editModeToggle button.is-active {
    background: #000;
    border: 1px solid #000;
    color: #fff;
    height: 60px;
    font-size: 24px;
    font-weight: 600;
}
#editModeToggle {
    display: flex;
    justify-content: space-between;
    width: 100%;
}
#editModeToggle button {
    width: 50%;
}

.ys_icon_edit {
    font-family: "Material Symbols Rounded";
    -webkit-font-smoothing: antialiased;
    font-variation-settings:
        "FILL" 0,
        "wght" 400,
        "GRAD" 0,
        "opsz" 48;
    font-size: 30px;
}
.preview_wrap .ys_icon_edit {
    border: 0;
    background: none;
}
.inv-edit-wrap .ys_icon_edit {
    margin-right: 10px;
}

.inv-edit-wrap .uk-form-label,
.inv-edit-wrap .uk-label {
    margin: 0 0 5px;
    font-weight: 700;
    font-size: 15px;
    letter-spacing: -0.5px;
    background: none;
    padding: 0;
    color: #000;
}
.inv-edit-wrap .uk-accordion-content {
    padding: 30px 30px 40px;
    border: 2px solid #000;
    border-radius: 20px;
    margin-bottom: 10px;
}

.uk-input,
.uk-textarea,
.uk-select {
    border-radius: 8px;
    font-size: 15px;
    /* padding: 15px; */
}
.location_type .uk-accordion-title {
    color: #000;
    font-size: 15px;
    padding: 10px 0;
    border-bottom: 1px solid #eee;
}
.location_type .uk-accordion-content {
    padding: 0;
}
.location_type .location_update {
    position: relative;
}
.location_tabs::before,
.couple_tabs::before,
.parents_tabs::before {
    border: none;
}
.location_tabs {
    display: flex;
    justify-content: space-between;
    padding: 0;
    margin: 0;
}
.couple_tabs {
    display: flex;
    justify-content: space-between;
    padding: 0;
    margin: 0;
    gap: 10px;
}
.parents_tabs {
    display: flex;
    justify-content: space-between;
    padding: 0;
    margin: 0;
    gap: 5px;
}
.location_tabs li {
    padding: 0;
    width: calc(100% / 9);
}
.couple_tabs li {
    padding: 0;
    width: calc(100% / 2 - 5px);
}
.parents_tabs li {
    padding: 0;
    width: calc(100% / 4 - 5px);
}
.location_tabs li a {
    font-size: 13px;
    font-weight: 500;
    padding: 0;
}
.couple_tabs li a,
.parents_tabs li a {
    font-size: 20px;
    font-weight: 500;
    padding: 0;
    border-radius: 100px;
    background-color: #eee;
    height: 40px;
}
.location_tabs .uk-active a {
    color: #000;
    font-weight: 700;
    border: none;
}
.location_tabs .uk-active a::after {
    content: "";
    background: #000;
    width: 100%;
    height: 2px;
    border-radius: 10px;
}
.couple_tabs .uk-active a,
.parents_tabs .uk-active a {
    background-color: #000;
    color: #fff;
    border: none;
}
.location_tabs a.location_update::before {
    content: "";
    background-color: green;
    display: inline-flex;
    position: absolute;
    top: 8px;
    font-size: 10px;
    color: #fff;
    font-weight: 700;
    border-radius: 50px;
    /* padding: 0 5px; */
    width: 5px;
    height: 5px;
    right: 8px;
    border-radius: 50%;
}
.location_tabs a {
    display: flex;
    flex-direction: column;
}
.couple_tabs a,
.parents_tabs a {
    display: flex;
}
.location_tabs a .ys_icon_edit {
    margin: 0 0 -5px;
    padding: 0;
}

.inv-dropzone {
    position: relative;
    transition: 0.12s ease;
    border: 2px dashed #d9d9d9;
    border-radius: 12px;
    cursor: pointer;
    box-sizing: border-box;
}
.inv-dropzone.is-dragover {
    border-color: #1e87f0;
    box-shadow: 0 0 0 3px rgba(30, 135, 240, 0.12) inset;
}
.inv-dropzone-loader {
    position: fixed; /* ✅ 화면 기준 */
    inset: 0; /* top/right/bottom/left = 0 */
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background: rgba(0, 0, 0, 0.8);
    z-index: 9999; /* ✅ 최상단 */
    pointer-events: all; /* ✅ 클릭 차단 */
    color: #fff;
    font-size: 20px;
}
/* #pv_venue {
    width: 100%;
    max-width: 300px;
} */

.btn-del {
    cursor: pointer;
}

.ys-label {
    display: block;
}

#noticeList .ys_icon_edit {
    cursor: pointer;
    font-size: 24px;
    color: #999;
}
#noticeList .ys_icon_edit:hover,
#interviewList .ys_icon_edit:hover {
    color: #000;
}
#noticeList button,
#interviewList button {
    border: none;
    background: none;
}
#interviewList .ys_icon_edit {
    margin: 0;
    font-size: 24px;
    color: #999;
}

/* ✅ 9분할 위치 버튼 UI */
.ys-pos-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-auto-rows: 44px;
    gap: 8px;
    width: max-content;
    width: 100%;
}
.ys-pos-btn {
    border: 1px solid #e5e5e5;
    background: #fff;
    border-radius: 10px;
    cursor: pointer;
    font-size: 16px;
    line-height: 1;
    display: flex;
    align-items: center;
    justify-content: center;
}
.ys-pos-btn:hover {
    filter: brightness(0.98);
}
.ys-pos-btn.is-active {
    border-color: #1e87f0; /* UIkit primary 느낌 */
    box-shadow: 0 0 0 2px rgba(30, 135, 240, 0.15);
}
