/* 홈페이지 테마 */
.homepage-theme-list {width: 100%; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--fs-20);}
.homepage-theme-item {position: relative; min-width: 0;}
.homepage-theme-item > input[type="radio"] {position: absolute; width: 1px; height: 1px; padding: 0; margin: 0; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; border: 0;}
.homepage-theme-item > label {cursor: pointer; width: 100%; height: 100%; padding: var(--fs-20); display: flex; flex-direction: column; justify-content: space-between; row-gap: var(--fs-30); border: 1px solid var(--grayscale3); border-radius: var(--fs-10); background-color: var(--color-white); transition: border-color 0.2s ease, box-shadow 0.2s ease;}
.homepage-theme-item > label:hover {border-color: var(--grayscale5); box-shadow: var(--box-shadow);}
.homepage-theme-info {min-width: 0; display: flex; align-items: flex-start; gap: var(--fs-20);}
.theme-color-list {flex-shrink: 0; display: flex; align-items: center; gap: 4px;}
.theme-color-list > span {display: block; width: 30px; height: 30px; border-radius: 5px; background-color: var(--theme-color);}
.homepage-theme-text {min-width: 0; display: flex; flex-direction: column; row-gap: 2px;}
.homepage-theme-text strong {font-size: var(--fs-16); font-weight: 400; line-height: 1.5; color: var(--grayscale11);}
.homepage-theme-text p {font-size: var(--fs-14); font-weight: 300; line-height: 1.5; color: var(--grayscale6);}
.homepage-theme-select {padding-block: var(--fs-10); width: 100%; display: flex; align-items: center; justify-content: center; column-gap: var(--fs-10); border: 1px solid var(--grayscale3); border-radius: var(--fs-10); background-color: var(--color-white); color: var(--grayscale10); transition: border-color 0.2s ease, background-color 0.2s ease, color 0.2s ease;}
.homepage-theme-select em {font-size: var(--fs-16); font-weight: 400; line-height: 1.5; font-style: normal;}
.theme-radio {flex-shrink: 0; width: 18px; height: 18px; padding: 4px; display: inline-flex; border: 1px solid var(--grayscale4); border-radius: 50%; background-color: var(--color-white); transition: border-color 0.2s ease;}
.theme-radio::before {content: ''; width: 100%; height: 100%; display: block; border-radius: 50%; background-color: transparent; transition: background-color 0.2s ease;}
.theme-select-checked {display: none;}

/* 선택 상태 */
.homepage-theme-item > input[type="radio"]:checked + label .homepage-theme-select {border-color: var(--calendar-blue); background-color: var(--calendar-lightblue); color: var(--calendar-blue);}
.homepage-theme-item > input[type="radio"]:checked + label .theme-radio {border-color: var(--calendar-blue);}
.homepage-theme-item > input[type="radio"]:checked + label .theme-radio::before {background-color: var(--calendar-blue);}
.homepage-theme-item > input[type="radio"]:checked + label .theme-select-default {display: none;}
.homepage-theme-item > input[type="radio"]:checked + label .theme-select-checked {display: inline;}

/* 키보드 접근성 */
.homepage-theme-item > input[type="radio"]:focus-visible + label {outline: 2px solid var(--calendar-blue); outline-offset: 3px;}

/* 공간 소개 */
.space-setting {width: 100%; display: flex; flex-direction: column; row-gap: var(--fs-20);}

.space-item-sortable {width: 100%; display: flex; flex-direction: column; row-gap: var(--fs-20);}

.space-item {width: 100%; overflow: hidden; border: 1px solid var(--grayscale3); border-radius: var(--fs-14); background-color: var(--color-white); transition: border-color 0.2s ease, box-shadow 0.2s ease, opacity 0.2s ease;}

.space-item:hover {border-color: var(--grayscale4);}

.space-item-head {min-height: 64px; padding: var(--fs-12) var(--fs-16); display: flex; align-items: center; column-gap: var(--fs-14);}

.space-item .drag-handle {flex-shrink: 0; width: 18px; padding: 2px; display: grid; grid-template-columns: repeat(2, 3px); justify-content: center; gap: 3px; cursor: grab;}

.space-item .drag-handle:active {cursor: grabbing;}

.space-item .drag-handle span {width: 3px; height: 3px; border-radius: 50%; background-color: var(--grayscale5);}

.space-item-name {min-width: 0; flex: 1; overflow: hidden; font-size: var(--fs-18); font-weight: 500; line-height: 1.5; color: var(--grayscale10); text-overflow: ellipsis; white-space: nowrap;}

.space-item-actions {flex-shrink: 0; display: flex; align-items: center; gap: var(--fs-10);}

.space-visible-toggle {width: auto; justify-content: flex-start; column-gap: 8px;}

.space-visible-toggle .toggle-title {white-space: nowrap; color: var(--grayscale7);}

.space-item-body {padding: 0 var(--fs-16) var(--fs-16); display: flex; flex-direction: column; row-gap: var(--fs-20);}

.space-item-body[hidden] {display: none;}

.space-item.open .space-item-head {padding-bottom: var(--fs-16);}

.space-item.sortable-ghost {opacity: 0.35; background-color: var(--grayscale2);}

.space-item.sortable-chosen {border-color: var(--color-main); box-shadow: 0 6px 20px rgb(var(--rgb-black) / 8%);}

.space-item.sortable-drag {opacity: 1; background-color: var(--color-white);}

.space-add-btn {margin-top: 0;}