@charset "utf-8";

/* ==========================================================================
   WebMCP 모듈 관리자 전용 CSS
   ========================================================================== */

.wmcp_card_wrap {
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
    margin-bottom: 20px;
}
.wmcp_card {
    flex: 1;
    min-width: 180px;
    background: #fff;
    border: 1px solid #dcdcdc;
    border-radius: 4px;
    padding: 16px 20px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.04);
}
.wmcp_card_title {
    font-size: 13px;
    font-weight: bold;
    color: #666;
    margin-bottom: 8px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.wmcp_card_value {
    font-size: 24px;
    font-weight: bold;
    color: #333;
    letter-spacing: -0.5px;
}
.wmcp_card.c_blue { border-left: 4px solid #2563eb; }
.wmcp_card.c_green { border-left: 4px solid #16a34a; }
.wmcp_card.c_purple { border-left: 4px solid #9333ea; }
.wmcp_card.c_amber { border-left: 4px solid #d97706; }

/* 뱃지 */
.wmcp_badge {
    display: inline-block;
    padding: 2px 8px;
    font-size: 11px;
    font-weight: bold;
    border-radius: 3px;
    text-transform: uppercase;
}
.wmcp_badge.bg_readonly { background: #e0e7ff; color: #3730a3; }
.wmcp_badge.bg_operator { background: #fef3c7; color: #92400e; }
.wmcp_badge.bg_admin { background: #fee2e2; color: #991b1b; }
.wmcp_badge.bg_success { background: #dcfce7; color: #166534; }
.wmcp_badge.bg_error { background: #fee2e2; color: #991b1b; }
.wmcp_badge.bg_active { background: #dcfce7; color: #15803d; }
.wmcp_badge.bg_inactive { background: #f3f4f6; color: #6b7280; }

/* 키 복사 및 코드 */
.wmcp_code {
    font-family: monospace, Consolas, sans-serif;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    padding: 2px 6px;
    border-radius: 4px;
    font-size: 12px;
}

/* 플레이그라운드 레이아웃 */
.wmcp_playground_wrap {
    display: flex;
    gap: 20px;
    margin-top: 15px;
}
.wmcp_pg_left, .wmcp_pg_right {
    flex: 1;
    min-width: 320px;
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 6px;
    padding: 16px 20px;
}
.wmcp_pg_header {
    font-size: 15px;
    font-weight: bold;
    color: #1e293b;
    margin-bottom: 12px;
    padding-bottom: 8px;
    border-bottom: 1px solid #e2e8f0;
}
.wmcp_json_editor {
    width: 100%;
    min-height: 250px;
    font-family: monospace, Consolas, sans-serif;
    font-size: 13px;
    background: #0f172a;
    color: #38bdf8;
    padding: 12px;
    border-radius: 6px;
    border: 1px solid #334155;
    box-sizing: border-box;
}
.wmcp_json_result {
    width: 100%;
    min-height: 250px;
    font-family: monospace, Consolas, sans-serif;
    font-size: 13px;
    background: #0f172a;
    color: #4ade80;
    padding: 12px;
    border-radius: 6px;
    border: 1px solid #334155;
    overflow: auto;
    white-space: pre-wrap;
    box-sizing: border-box;
}