/* 
 * 테마 관련 스타일은 theme.css로 이동되었습니다.
 * 이 파일은 공통 스타일만 포함합니다.
 */

/* Responsive Table for Mobile */
@media screen and (max-width: 768px) {
    #users-table thead {
        display: none;
    }

    #users-table, 
    #users-table tbody, 
    #users-table tr, 
    #users-table td {
        display: block;
        width: 100%;
    }

    #users-table tr {
        margin-bottom: 1rem;
        border-radius: .5rem;
        padding: 1rem;
        border: 1px solid var(--border-color, #dee2e6);
    }

    #users-table td {
        padding-left: 50% !important;
        text-align: right;
        position: relative;
        border: none;
        padding-top: .5rem;
        padding-bottom: .5rem;
    }

    #users-table td::before {
        content: attr(data-label);
        position: absolute;
        left: 1rem;
        width: calc(50% - 2rem);
        text-align: left;
        font-weight: bold;
    }

    /* First cell (Name) is special */
    #users-table tr td:nth-child(2) {
        padding-left: 1rem !important;
        text-align: left;
        padding-bottom: 1rem;
        display: flex;
        align-items: center;
    }
    #users-table tr td:nth-child(2)::before {
        display: none;
    }
    
    /* Hide some labels */
    #users-table tr td:first-child::before,
    #users-table tr td:last-child::before {
        display: none;
    }

    /* Action buttons cell */
    #users-table td:last-child {
        padding-left: 1rem !important;
        text-align: center;
        padding-top: 1rem;
    }
}

/* 테마 관련 스타일은 theme.css에서 처리됩니다 */

/* 회원가입 버튼 hover 스타일 커스텀 */
.btn-outline-light:hover {
    background-color: #667eea !important;
    border-color: #667eea !important;
    color: #ffffff !important;
    transition: all 0.3s ease;
}

/* 커스텀 btn-outline-hover 클래스 스타일 */
.btn-outline-hover {
    border: 1px solid rgba(255, 255, 255, 0.25);
    color: #ffffff;
    background-color: transparent;
    transition: all 0.3s ease;
}

.btn-outline-hover:hover {
    background-color: #667eea !important;
    border-color: #667eea !important;
    color: #ffffff !important;
}
